From 6368b60dcd42d13a027195a7d8547834c8ceb213 Mon Sep 17 00:00:00 2001 From: Ralph Wiedemeier Date: Thu, 7 Mar 2019 14:51:44 +0100 Subject: [PATCH] minor fixes --- libs/ff-three | 2 +- source/client/core/ui/styles.scss | 57 ++----------------- source/client/demo.hbs | 30 +++++----- source/client/explorer/ui/ContentView.ts | 9 +++ source/client/explorer/ui/styles.scss | 57 +++++++++++++++++++ source/client/mini/MiniApplication.ts | 2 - source/client/mini/nodes/NVMiniExplorer.ts | 5 +- .../client/{core => mini}/ui/ContentView.ts | 30 +++++++--- source/client/mini/ui/MainView.ts | 2 +- source/client/mini/ui/styles.scss | 2 +- source/client/{app.hbs => story.hbs} | 8 ++- source/client/viewer.hbs | 39 +++++++++++++ source/client/webpack.config.js | 6 +- 13 files changed, 163 insertions(+), 86 deletions(-) rename source/client/{core => mini}/ui/ContentView.ts (62%) rename source/client/{app.hbs => story.hbs} (92%) create mode 100644 source/client/viewer.hbs diff --git a/libs/ff-three b/libs/ff-three index db5c24c1..964cca5f 160000 --- a/libs/ff-three +++ b/libs/ff-three @@ -1 +1 @@ -Subproject commit db5c24c112bebdad1284312b4317ab0015514257 +Subproject commit 964cca5fa00dd49ffce7bcca5ed23b8ec7a0975b diff --git a/source/client/core/ui/styles.scss b/source/client/core/ui/styles.scss index 6caf52ea..8ba16c5c 100644 --- a/source/client/core/ui/styles.scss +++ b/source/client/core/ui/styles.scss @@ -95,64 +95,15 @@ sv-logo { } //////////////////////////////////////////////////////////////////////////////// -// CONTENT LAYER +// SCENE VIEW -.sv-content-view { - @include fullsize; -} .sv-scene-view { + @include fullsize; + overflow: hidden; + &.sv-blur { filter: brightness(80%) blur(5px); transition: filter 0.5s; } } - -.sv-content-reader-split { - @include fullsize; - display: flex; - - .sv-scene-view { - flex: 1 1 60%; - } - .sv-reader-view { - flex: 1 1 40%; - } -} - -.sv-content-reader-overlay { - @include fullsize; - - .sv-scene-view { - @include fullsize; - } - - .sv-reader-view { - @include fullsize; - margin-top: 54px; - //background-color: transparentize(white, 0.95); - border-top: $section-border; - //z-index: 2; - } -} - -.sv-content-reader-off { - .sv-scene-view { - @include fullsize; - } -} - -.sv-reader-view { - overflow-y: auto; - - .sv-article { - margin: 0 20px; - } -} - - -.sv-content-overlay { -} - -.ff-viewport-overlay { -} \ No newline at end of file diff --git a/source/client/demo.hbs b/source/client/demo.hbs index 607148f7..e989dc99 100644 --- a/source/client/demo.hbs +++ b/source/client/demo.hbs @@ -39,29 +39,29 @@

Voyager 3D Tool Suite

Standalone test/demo versions.
Current version: {{htmlWebpackPlugin.options.version}}

Voyager Story

-

Click on an asset to launch / Create Story issue in Jira

+

Click on an asset to launch / Create Story issue in Jira

- - - - + + + +

Voyager Explorer

-

Click on an asset to launch / Create Explorer issue in Jira

+

Click on an asset to launch / Create Explorer issue in Jira

- - - - + + + +

Voyager Mini

-

Click on an asset to launch / Create Mini issue in Jira

+

Click on an asset to launch / Create Mini issue in Jira

- - - - + + + +
\ No newline at end of file diff --git a/source/client/explorer/ui/ContentView.ts b/source/client/explorer/ui/ContentView.ts index 5224e7ef..69583876 100644 --- a/source/client/explorer/ui/ContentView.ts +++ b/source/client/explorer/ui/ContentView.ts @@ -16,6 +16,7 @@ */ import CVAssetLoader from "../../core/components/CVAssetLoader"; +import CVScene from "../../core/components/CVScene"; import CVReader, { EReaderPosition } from "../components/CVReader"; import SystemElement, { customElement, html } from "../../core/ui/SystemElement"; @@ -69,6 +70,14 @@ export default class ContentView extends SystemElement const sceneView = this.sceneView; sceneView.classList.remove("sv-blur"); + // TODO: quick hack + if (!isLoading) { + const scene = this.system.getComponent(CVScene, true); + if (scene) { + scene.ins.zoomExtents.set(); + } + } + if (readerVisible) { if (readerPosition === EReaderPosition.Right) { diff --git a/source/client/explorer/ui/styles.scss b/source/client/explorer/ui/styles.scss index f55ba7cd..790f01cb 100644 --- a/source/client/explorer/ui/styles.scss +++ b/source/client/explorer/ui/styles.scss @@ -19,6 +19,62 @@ @import "../../core/ui/styles"; +//////////////////////////////////////////////////////////////////////////////// +// CONTENT LAYER + +.sv-content-view { + @include fullsize; + overflow: hidden; +} + +.sv-content-reader-split { + @include fullsize; + display: flex; + + .sv-scene-view { + flex: 1 1 60%; + } + .sv-reader-view { + flex: 1 1 40%; + } +} + +.sv-content-reader-overlay { + @include fullsize; + + .sv-scene-view { + @include fullsize; + } + + .sv-reader-view { + @include fullsize; + margin-top: 54px; + //background-color: transparentize(white, 0.95); + border-top: $section-border; + //z-index: 2; + } +} + +.sv-content-reader-off { + .sv-scene-view { + @include fullsize; + } +} + +.sv-reader-view { + overflow-y: auto; + + .sv-article { + margin: 0 20px; + } +} + +.sv-content-overlay { +} + +.ff-viewport-overlay { +} + //////////////////////////////////////////////////////////////////////////////// // ANNOTATIONS @@ -77,6 +133,7 @@ .sv-chrome-view { @include fullsize; + overflow: hidden; display: flex; flex-direction: column; diff --git a/source/client/mini/MiniApplication.ts b/source/client/mini/MiniApplication.ts index 4965ed17..15752cd4 100644 --- a/source/client/mini/MiniApplication.ts +++ b/source/client/mini/MiniApplication.ts @@ -30,8 +30,6 @@ import { nodeTypes as graphNodes } from "@ff/graph/nodes"; import { nodeTypes as sceneNodes } from "@ff/scene/nodes"; import { nodeTypes as miniNodes } from "./nodes"; -import { IItem } from "common/types/item"; - import CVAssetLoader from "../core/components/CVAssetLoader"; import NVMiniExplorer from "./nodes/NVMiniExplorer"; diff --git a/source/client/mini/nodes/NVMiniExplorer.ts b/source/client/mini/nodes/NVMiniExplorer.ts index 714518fd..3bae4387 100644 --- a/source/client/mini/nodes/NVMiniExplorer.ts +++ b/source/client/mini/nodes/NVMiniExplorer.ts @@ -19,6 +19,7 @@ import Node from "@ff/graph/Node"; import CPulse from "@ff/graph/components/CPulse"; import CRenderer from "@ff/scene/components/CRenderer"; +import CBackground from "@ff/scene/components/CBackground"; import NCamera from "@ff/scene/nodes/NCamera"; import NDirectionalLight from "@ff/scene/nodes/NDirectionalLight"; @@ -50,7 +51,6 @@ export default class NVMiniExplorer extends Node this.createComponent(CRenderer); this.createComponent(CVAssetLoader); - this.createComponent(CVOrbitNavigation); const scene = this.createComponent(CVScene); this.createScene(scene); @@ -58,6 +58,9 @@ export default class NVMiniExplorer extends Node protected createScene(scene: CVScene) { + scene.node.createComponent(CBackground); + scene.node.createComponent(CVOrbitNavigation); + const item = scene.graph.createCustomNode(NVMiniItem); scene.addChild(item.transform); diff --git a/source/client/core/ui/ContentView.ts b/source/client/mini/ui/ContentView.ts similarity index 62% rename from source/client/core/ui/ContentView.ts rename to source/client/mini/ui/ContentView.ts index 9a00d11e..2133d785 100644 --- a/source/client/core/ui/ContentView.ts +++ b/source/client/mini/ui/ContentView.ts @@ -16,22 +16,31 @@ */ -import CVAssetLoader from "../components/CVAssetLoader"; +import CVAssetLoader from "../../core/components/CVAssetLoader"; +import CVScene from "../../core/components/CVScene"; -import SystemElement, { customElement, html } from "./SystemElement"; +import SystemElement, { customElement, html } from "../../core/ui/SystemElement"; -import "./SceneView"; -import "./Spinner"; +import SceneView from "../../core/ui/SceneView"; +import "../../core/ui/Spinner"; //////////////////////////////////////////////////////////////////////////////// @customElement("sv-content-view") export default class ContentView extends SystemElement { + protected sceneView: SceneView = null; + protected get assetLoader() { return this.system.getMainComponent(CVAssetLoader); } + protected firstConnected() + { + this.classList.add("sv-content-view"); + this.sceneView = new SceneView(this.system); + } + protected connected() { this.assetLoader.outs.loading.on("value", this.performUpdate, this); @@ -44,10 +53,17 @@ export default class ContentView extends SystemElement protected render() { - const system = this.system; const isLoading = this.assetLoader.outs.loading.value; - return html` - `; + if (!isLoading) { + const scene = this.system.getComponent(CVScene, true); + if (scene) { + scene.ins.zoomExtents.set(); + } + } + + + return html`${this.sceneView} + `; } } diff --git a/source/client/mini/ui/MainView.ts b/source/client/mini/ui/MainView.ts index f25f559f..4c8f32bf 100644 --- a/source/client/mini/ui/MainView.ts +++ b/source/client/mini/ui/MainView.ts @@ -17,7 +17,7 @@ import CustomElement, { customElement } from "@ff/ui/CustomElement"; -import ContentView from "../../explorer/ui/ContentView"; +import ContentView from "./ContentView"; import MiniApplication, { IMiniApplicationProps } from "../MiniApplication"; diff --git a/source/client/mini/ui/styles.scss b/source/client/mini/ui/styles.scss index 9a994333..b90bac97 100644 --- a/source/client/mini/ui/styles.scss +++ b/source/client/mini/ui/styles.scss @@ -15,4 +15,4 @@ * limitations under the License. */ -@import "../../core/ui/styles"; \ No newline at end of file +@import "../../core/ui/styles"; diff --git a/source/client/app.hbs b/source/client/story.hbs similarity index 92% rename from source/client/app.hbs rename to source/client/story.hbs index 6bd6b66a..6284f740 100644 --- a/source/client/app.hbs +++ b/source/client/story.hbs @@ -8,6 +8,10 @@ + + {{#if htmlWebpackPlugin.options.isDevelopment}} {{#if htmlWebpackPlugin.options.isLocal}} @@ -16,7 +20,7 @@ {{else}} - + {{/if}} @@ -28,7 +32,7 @@ {{else}} - + {{/if}} diff --git a/source/client/viewer.hbs b/source/client/viewer.hbs new file mode 100644 index 00000000..647e8eb7 --- /dev/null +++ b/source/client/viewer.hbs @@ -0,0 +1,39 @@ + + + + + + + {{htmlWebpackPlugin.options.title}} + + + + + + {{#if htmlWebpackPlugin.options.isDevelopment}} + {{#if htmlWebpackPlugin.options.isLocal}} + + + {{else}} + + + {{/if}} + {{else}} + {{#if htmlWebpackPlugin.options.isLocal}} + + + + + {{else}} + + + {{/if}} + {{/if}} + + + +{{{htmlWebpackPlugin.options.element}}} + + \ No newline at end of file diff --git a/source/client/webpack.config.js b/source/client/webpack.config.js index 2088b533..a84efb6a 100644 --- a/source/client/webpack.config.js +++ b/source/client/webpack.config.js @@ -43,19 +43,19 @@ const apps = { name: "voyager-explorer", entryPoint: "client/explorer/ui/MainView.ts", title: "Voyager Explorer", - template: "app.hbs", + template: "viewer.hbs", }, "mini": { name: "voyager-mini", entryPoint: "client/mini/ui/MainView.ts", title: "Voyager Mini", - template: "app.hbs", + template: "viewer.hbs", }, "story": { name: "voyager-story", entryPoint: "client/story/ui/MainView.ts", title: "Voyager Story", - template: "app.hbs", + template: "story.hbs", }, "demo": { name: "voyager-demo",