-
- {/*App*/}
-
- {/* Middle Panel */}
-
- {/*Toolbox*/}
-
-
- this.getActiveTool().name}
- activeToolName={this.getActiveTool().name}
- setActiveTool={this.setActiveTool}
- getToolSetting={this.getToolSetting}
- setToolSetting={this.setToolSetting}
- previewPlaying={this.state.previewPlaying}
- editorActions={this.actionMapInterface.editorActions}
- getToolSettingRestrictions={this.getToolSettingRestrictions}
- showCanvasActions={this.state.showCanvasActions}
- showBooleanCanvasActions={this.state.showBooleanCanvasActions}
- showLayersCanvasActions={this.state.showLayersCanvasActions}
- showAlignmentCanvasActions={this.state.showAlignmentCanvasActions}
- showBrushModes={this.state.showBrushModes}
- toggleCanvasActions={this.toggleCanvasActions}
- toggleBooleanCanvasActions={this.toggleBooleanCanvasActions}
- toggleLayersCanvasActions={this.toggleLayersCanvasActions}
- toggleAlignmentCanvasActions={this.toggleAlignmentCanvasActions}
- toggleBrushModes={this.toggleBrushModes}
- colorPickerType={this.state.colorPickerType}
- changeColorPickerType={this.changeColorPickerType}
- updateLastColors={this.updateLastColors}
- lastColorsUsed={this.state.lastColorsUsed}
- keyMap={this.getKeyMap()}
- renderSize={renderSize}
- />
-
-
-
-
- {/* Canvas and Popout Outliner */}
-
-
- {/*Canvas*/}
-
-
- {({ size }) => {
- this.project.view.render();
- return (
-
-
- {renderSize === "small" &&
- }
- {renderSize === "large" &&
- }
-
-
-
- {/* Popout Outliner */}
- {renderSize === "large" && this.state.outlinerPoppedOut && }
- {renderSize === "large" && this.state.outlinerPoppedOut &&
-
-
- }
-
-
-
- {(renderSize === "small") && }
- {!(renderSize === "small") && }
-
- {/*Timeline*/}
-
-
- {renderSize === "small"
- && this.timelineComponent = ref}
- dragSoundOntoTimeline={this.dragSoundOntoTimeline}
-
- getToolSetting={this.getToolSetting}
- setToolSetting={this.setToolSetting}
- getSelectionType={this.getSelectionType}
- getAllSoundAssets={this.getAllSoundAssets}
- getAllSelectionAttributes={this.getAllSelectionAttributes}
- setSelectionAttribute={this.setSelectionAttribute}
- editorActions={this.actionMapInterface.editorActions}
- selectionIsScriptable={this.selectionIsScriptable}
- script={this.getSelectedObjectScript()}
- scriptInfoInterface={this.scriptInfoInterface}
- deleteScript={this.deleteScript}
- editScript={this.editScript}
- fontInfoInterface={this.fontInfoInterface}
-
- importFileAsAsset={this.importFileAsAsset}
- colorPickerType={this.state.colorPickerType}
- changeColorPickerType={this.changeColorPickerType}
- updateLastColors={this.updateLastColors}
- lastColorsUsed={this.state.lastColorsUsed}
- getClipAnimationTypes={this.getClipAnimationTypes}
-
- assets={this.project.getAssets()}
- openModal={this.openModal}
- openImportAssetFileDialog={this.openImportAssetFileDialog}
- selectObjects={this.selectObjects}
- clearSelection={this.clearSelection}
- isObjectSelected={this.isObjectSelected}
- createAssets={this.createAssets}
- importProjectAsWickFile={this.importProjectAsWickFile}
- createImageFromAsset={this.createImageFromAsset}
- toast={this.toast}
- deleteSelectedObjects={this.deleteSelectedObjects}
- addSoundToActiveFrame={this.addSoundToActiveFrame} />}
- {renderSize !== "small" &&
- this.timelineComponent = ref}
- dragSoundOntoTimeline={this.dragSoundOntoTimeline}
- />}
-
-
-
-
-
-
- {/* Right Sidebar */}
- {!(renderSize === "small") && }
- {!(renderSize === "small") &&
-
-
-
- {/* Inspector */}
-
-
-
-
-
-
-
- {/* Outliner */}
- {renderSize === 'medium' && }
- {renderSize === 'medium' &&
-
-
-
- }
-
-
-
- {window.enableAssetLibrary && }
- {/* Asset Library */}
- {window.enableAssetLibrary &&
-
-
-
-
- }
-
-
- }
-
-
- {this.state.codeEditorOpen &&
-
}
-
-