diff options
Diffstat (limited to 'app/client/modules')
| -rw-r--r-- | app/client/modules/biggan/views/biggan.encodingList.js | 53 | ||||
| -rw-r--r-- | app/client/modules/biggan/views/biggan.live.js | 31 |
2 files changed, 56 insertions, 28 deletions
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, |