Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add new section for raw schedule export, so you can use schedules in ComfyUI (via FizzleDorf's schedule nodes), or just paste them directly in Deforum #227

Merged
merged 1 commit into from
Oct 11, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 17 additions & 0 deletions src/ParseqUI.js
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ import SupportParseq from './components/SupportParseq'
import { UserAuthContextProvider } from "./UserAuthContext";
import { AudioWaveform } from './components/AudioWaveform';
import { ExpandableSection } from './components/ExpandableSection';
import RawSchedules from './components/RawSchedules'
import { FieldSelector } from "./components/FieldSelector";
import { InitialisationStatus } from "./components/InitialisationStatus";
import { AddKeyframesDialog, BulkEditDialog, DeleteKeyframesDialog, MergeKeyframesDialog } from './components/KeyframeDialogs';
Expand Down Expand Up @@ -1334,6 +1335,15 @@ const ParseqUI = (props) => {
}, [displayedFields, showFlatSparklines, renderedData, managedFields, handleClickedSparkline, sparklineData, theme]);


// Raw Schedules ------------------------

const rawSchedules = useMemo(() => {
return renderedData
? <RawSchedules renderedData={renderedData} managedFields={managedFields} />
: <></>;

}, [renderedData, managedFields]);


// Raw output ------------------------

Expand Down Expand Up @@ -1699,6 +1709,13 @@ const ParseqUI = (props) => {
</ExpandableSection>
</Grid>
<React.StrictMode>
<Grid xs={12}>
<ExpandableSection title="Raw schedules">
<Box>
{rawSchedules}
</Box>
</ExpandableSection>
</Grid>
<Grid xs={12}>
<ExpandableSection title="Output">
<Box>
Expand Down
1 change: 1 addition & 0 deletions src/components/KeyframeDialogs.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -471,6 +471,7 @@ export const BulkEditDialog: FC<BulkEditDialogProps> = ({
timeSeries: timeSeries,
variableMap: new Map([['prev_computed_value', 0]]),
computed_values: [],
cadence: 1,
}
parse(newValue).invoke(dummyContext);
} catch (e: any) {
Expand Down
2 changes: 1 addition & 1 deletion src/components/ParseqGrid.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -208,7 +208,7 @@ export const ParseqGrid = forwardRef(({ rangeSelection, onSelectRange, onGridRea
&& !isValidNumber(params.data[field])
&& renderedData
&& renderedData.rendered_frames
) {
&& renderedData.rendered_frames[frame]) {
const renderedValue = renderedData.rendered_frames[frame][field];
return isValidNumber(renderedValue) ? `(${renderedValue})` : '';
} else {
Expand Down
84 changes: 84 additions & 0 deletions src/components/RawSchedules.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,84 @@
import { MenuItem, Stack, TextField, Typography } from '@mui/material';
import * as React from 'react';
import { useState } from 'react';
import { RenderedData } from '../ParseqUI';

type RawSchedulesProps = {
renderedData: RenderedData;
managedFields: string[];
}

export default function RawSchedules({ renderedData, managedFields }: RawSchedulesProps) {

const [selectedField, setSelectedField] = useState<string>(managedFields ? managedFields[0] : '');
const [variant, setVariant] = useState<'delta' | 'absolute'>('delta');


const rawSchedule = React.useMemo(() => {

if (['Prompt', 'PositivePrompt', 'NegativePrompt'].includes(selectedField)) {
return renderedData?.rendered_frames
?.map(frame => {
const fullPrompt = frame['deforum_prompt'];
const promptPiece = selectedField === 'Prompt' ? fullPrompt
: selectedField === 'PositivePrompt' ? fullPrompt.split('--neg')[0]
: fullPrompt.split('--neg')[1];
return `"${frame['frame']}": "${promptPiece}"`
})
?.join(",\n");
} else {
return renderedData?.rendered_frames
?.map(frame => `${frame['frame']}: (${frame[selectedField + (variant === 'delta' ? '_delta' : '')]})`)
?.join(', ');
}

}, [renderedData, selectedField, variant]);

return (
<Stack>
<Stack direction={'row'} gap={1}>
<TextField
label="Field"
InputLabelProps={{ shrink: true, }}
InputProps={{ style: { width: "20em", fontSize: '0.75em' } }}
value={selectedField}
onChange={(e) => setSelectedField(e.target.value)}
select
size='small'
>
{managedFields?.map(f => <MenuItem value={f}>{f}</MenuItem>)}
<MenuItem value="Prompt">Full prompt</MenuItem>
<MenuItem value="PositivePrompt">Positive prompt</MenuItem>
<MenuItem value="NegativePrompt">Negative prompt</MenuItem>
</TextField>
<TextField
label="Variant"
InputLabelProps={{ shrink: true, }}
InputProps={{ style: { width: "20em", fontSize: '0.75em' } }}
value={variant}
onChange={(e) => setVariant(e.target.value as 'delta' | 'absolute')}
select
size='small'
>
<MenuItem value="delta">Delta values</MenuItem>
<MenuItem value="absolute">Absolute values</MenuItem>
</TextField>
</Stack>
{rawSchedule && selectedField && <TextField
style={{ width: '100%' }}
multiline
onFocus={event => event.target.select()}
rows={4}
InputProps={{ style: { fontFamily: 'Monospace', fontSize: '0.75em' } }}
value={rawSchedule}
variant="filled"
/>
}
<Typography fontSize="0.75em" paddingBottom={"5px"}>
You use this schedule directly in Deforum, or in ComfyUI using <a href="https://github.com/FizzleDorf/ComfyUI_FizzNodes">FizzNodes</a>.
</Typography>

</Stack>

);
}