diff options
Diffstat (limited to 'app')
| -rw-r--r-- | app/client/index.jsx | 2 | ||||
| -rw-r--r-- | app/client/live/live.reducer.js | 8 | ||||
| -rw-r--r-- | app/client/live/player.js | 11 | ||||
| -rw-r--r-- | app/client/modules/biggan/views/biggan.encodingList.js | 53 | ||||
| -rw-r--r-- | app/client/modules/biggan/views/biggan.live.js | 31 |
5 files changed, 69 insertions, 36 deletions
diff --git a/app/client/index.jsx b/app/client/index.jsx index 4e0c38d..cf2616d 100644 --- a/app/client/index.jsx +++ b/app/client/index.jsx @@ -29,7 +29,7 @@ const app = ( <Provider store={store}> <Auth.Gate> <BrowserRouter> - <div className='everybody'> + <div> <Route exact path='/system' component={System} /> <Route exact path='/dashboard' component={Dashboard} /> <Route exact path='/browse' component={Browser} /> diff --git a/app/client/live/live.reducer.js b/app/client/live/live.reducer.js index 2abb527..1d437e0 100644 --- a/app/client/live/live.reducer.js +++ b/app/client/live/live.reducer.js @@ -10,6 +10,7 @@ const liveInitialState = { sequence_playing: true, sequence_step: 1, recurse_roll: 0, rotate: 0, scale: 0, process_frac: 0.5, view_mode: 'b', + encoding_stored_mix_n: 0, }, all_checkpoints: [], checkpoints: [], @@ -115,7 +116,12 @@ const liveReducer = (state = liveInitialState, action) => { const new_opt = action.data.data.trim().split('\n').reduce((a,b) => { if (b.indexOf('set_opt') === 0) { const terms = b.split(' ') - a[terms[1]] = terms[2] + let key = terms[1] + let value = parseFloat(terms[2]) + if (isNaN(value)) { + value = terms[2] + } + a[key] = value } return a }, {}) diff --git a/app/client/live/player.js b/app/client/live/player.js index 483bbf1..78f5c24 100644 --- a/app/client/live/player.js +++ b/app/client/live/player.js @@ -3,7 +3,7 @@ import Whammy from './whammy' import types from '../types' import * as pix2wav from '../audio/pix2wav' -let fps = 0, last_frame +let fps = 0 let recording = false, saving = false, synthesizing = false let videoWriter @@ -42,6 +42,10 @@ export function saveFrame(){ } export function onFrame (data) { + store.dispatch({ + type: types.player.current_frame, + meta: data.meta, + }) const blob = new Blob([data.frame], { type: 'image/jpg' }) const url = URL.createObjectURL(blob) const img = new Image () @@ -49,7 +53,6 @@ export function onFrame (data) { if (! canvas) return console.error('no canvas for frame') img.onload = () => { img.onload = null - last_frame = data.meta URL.revokeObjectURL(url) const ctx = canvas.getContext('2d-lodpi') ctx.drawImage(img, 0, 0, canvas.width, canvas.height) @@ -100,10 +103,6 @@ export function startWatchingFPS(){ type: types.player.set_fps, fps: fps, }) - store.dispatch({ - type: types.player.current_frame, - meta: last_frame, - }) fps = 0 }, 1000) } diff --git a/app/client/modules/biggan/views/biggan.encodingList.js b/app/client/modules/biggan/views/biggan.encodingList.js index 710752e..8ebf05b 100644 --- a/app/client/modules/biggan/views/biggan.encodingList.js +++ b/app/client/modules/biggan/views/biggan.encodingList.js @@ -3,7 +3,7 @@ import { bindActionCreators } from 'redux' import { connect } from 'react-redux' import { - Loading, Group, Slider + Loading, Group, Slider, Button } from '../../../common/' import actions from '../../../actions' @@ -11,6 +11,10 @@ import * as bigganTasks from '../biggan.tasks' import * as bigganActions from '../biggan.actions' class BigGANEncodingList extends Component { + state = { + file_id: 0, + } + componentDidMount() { if (!this.props.biggan.encodings) { this.props.actions.biggan.load_encodings() @@ -18,31 +22,46 @@ class BigGANEncodingList extends Component { } render() { + const { file_id } = this.state + const { opt } = this.props const { encodings } = this.props.biggan if (!encodings) { return <div>Loading encodings...</div> } return ( <div> + <div className="spacer"> + {this.props.last_message} + </div> <Group title={"Stored image"}> <Slider live - name='encoding_mix_speed' - title={"Load Speed"} - min={0.0001} max={10} type='float' - /> - <Slider live name='encoding_stored_speed' - title={"Next Image Speed"} - min={0.0001} max={10} type='float' + title={"Load speed"} + min={1} max={250} type='int' /> <Slider live - name='encoding_mix_n' - title={"Latent mix"} + name='encoding_stored_n' + title={"Image mix"} min={0} max={1} type='float' /> + </Group> + <Group title={"Latent to Image Transition"}> + <Button + title={"Toggle"} + onClick={() => file_id && actions.live.send_command('switch', 'encoding_stored_mix')} + >{file_id + ? opt.encoding_stored_mix_n < 0.5 + ? "To Image" + : "Back to Latent" + : "Not loaded"}</Button> <Slider live - name='encoding_stored_n' - title={"Encoding mix"} + name='encoding_stored_mix_speed' + title={"Transition speed"} + min={1} max={250} type='int' + /> + <Slider live + name='encoding_stored_mix_n' + title={"Transition mix"} min={0} max={1} type='float' /> </Group> @@ -55,9 +74,12 @@ class BigGANEncodingList extends Component { <img key={file.id} src={file.url} - onClick={() => actions.live.send_command('setEncoding', JSON.stringify({ - id: file.id, - }))} + onClick={() => { + actions.live.send_command('setEncoding', JSON.stringify({ + id: file.id, + })) + this.setState({ file_id: file.id }) + }} /> ))} </div> @@ -71,6 +93,7 @@ class BigGANEncodingList extends Component { } const mapStateToProps = state => ({ + last_message: state.live.last_message, opt: state.live.opt, frame: state.live.frame, biggan: state.module.biggan, diff --git a/app/client/modules/biggan/views/biggan.live.js b/app/client/modules/biggan/views/biggan.live.js index 8d4a234..4410968 100644 --- a/app/client/modules/biggan/views/biggan.live.js +++ b/app/client/modules/biggan/views/biggan.live.js @@ -15,6 +15,7 @@ import * as bigganTasks from '../biggan.tasks' import * as bigganActions from '../biggan.actions' import BigGANCategoryList from './biggan.categoryList.js' import BigGANEncodingList from './biggan.encodingList.js' +import { frameTimestamp } from '../../../util' class BigGANLive extends Component { constructor(props) { @@ -32,7 +33,7 @@ class BigGANLive extends Component { this.props.actions.queue.stop_task('gpu') } render() { - const { biggan, actions } = this.props + const { biggan, actions, frame } = this.props // console.log(actions) // if (biggan.loading) { // return <Loading progress={biggan.progress} /> @@ -44,9 +45,18 @@ class BigGANLive extends Component { <Player width={512} height={512} square fullscreen={this.props.fullscreen} /> </div> <div className='params column audioParams'> - <Group> + <div className='spacer'> + {frame.i ? + <div className='param'> + <span>Frame #{frame.i}</span> + {frameTimestamp(frame.i)} + </div> + : <div className='param'><span>Not playing</span></div> + } + </div> + + <Group title="Player"> {this.renderRestartButton()} - <p class='last_message'>{this.props.last_message}</p> </Group> <Group title={"Latent"}> @@ -57,7 +67,7 @@ class BigGANLive extends Component { <Slider live name='latent_speed' title={"Update Speed"} - min={0.0001} max={10} type='float' + min={1} max={250} type='int' /> <Slider live name='truncation' @@ -79,7 +89,7 @@ class BigGANLive extends Component { <Slider live name='label_speed' title={"Mix Speed"} - min={0.0001} max={10} type='float' + min={1} max={250} type='int' /> </Group> @@ -87,7 +97,7 @@ class BigGANLive extends Component { <Slider live name='orbit_speed' title={"Orbit speed"} - min={-4} max={4} type='float' + min={-250} max={250} type='int' /> <Slider live name='orbit_radius' @@ -101,7 +111,7 @@ class BigGANLive extends Component { <Slider live name='orbit_noise_speed' title={"Shuffle Speed"} - min={0} max={4} type='float' + min={1} max={250} type='int' /> </Group> @@ -164,13 +174,9 @@ class BigGANLive extends Component { return ( <div> <Button - title={i18n.gpu.processing} - onClick={this.togglePlaying} - >{i18n.gpu.stop}</Button> - <Button title={i18n.gpu.busy} onClick={() => this.interrupt()} - >{i18n.gpu.interrupt}</Button> + >{i18n.gpu.stop}</Button> </div> ) } @@ -178,7 +184,6 @@ class BigGANLive extends Component { const mapStateToProps = state => ({ - last_message: state.live.last_message, fullscreen: state.live.fullscreen, opt: state.live.opt, frame: state.live.frame, |
