first step towards assets bundling

Viewer/src/assets/font.ts

@@ -0,0 +1 @@
+export const babylonFont = require('../../assets/babylon.woff');

Viewer/src/assets/img.ts

@@ -0,0 +1,5 @@
+export const babylonLogo = require('../../assets/img/BabylonJS_Logo_Small.png');
+export const close = require('../../assets/img/close.png');
+export const fullscreen = require('../../assets/img/fullscreen.png');
+export const helpCircle = require('../../assets/img/help-circle.png');
+export const loading = require('../../assets/img/loading.png');

Viewer/src/assets/index.ts

@@ -0,0 +1,3 @@
+export * from './font';
+export * from './img';
+export * from './templates';

Viewer/src/assets/templates.ts

@@ -0,0 +1,9 @@
+export const defaultTemplate = require('../../assets/templates/default/defaultTemplate.html');
+export const defaultViewer = require('../../assets/templates/default/defaultViewer.html');
+export const error = require('../../assets/templates/default/error.html');
+export const fillContainer = require('../../assets/templates/default/fillContainer.html');
+export const help = require('../../assets/templates/default/help.html');
+export const loadingScreen = require('../../assets/templates/default/loadingScreen.html');
+export const navbar = require('../../assets/templates/default/navbar.html');
+export const overlay = require('../../assets/templates/default/overlay.html');
+export const share = require('../../assets/templates/default/share.html');

Viewer/src/configuration/types/default.ts

@@ -1,4 +1,7 @@
 import { ViewerConfiguration } from './../configuration';
+import { defaultTemplate, fillContainer, loadingScreen, defaultViewer, navbar, overlay, help, share, error } from '../../assets/templates';
+import { babylonFont } from '../../assets/font';
+import * as images from '../../assets/img';
 
 /**
  * The default configuration of the viewer, including templates (canvas, overly, loading screen)
@@ -8,33 +11,33 @@ export let defaultConfiguration: ViewerConfiguration = {
     version: "3.2.0-alpha4",
     templates: {
         main: {
-            html: require("../../../assets/templates/default/defaultTemplate.html"),
+            html: defaultTemplate,
             params: {
-                babylonFont: require('../../../assets/babylon.woff'),
+                babylonFont: babylonFont,
                 noEscape: true
             }
         },
         fillContainer: {
-            html: require("../../../assets/templates/default/fillContainer.html"),
+            html: fillContainer,
             params: {
                 disable: false
             }
         },
         loadingScreen: {
-            html: require("../../../assets/templates/default/loadingScreen.html"),
+            html: loadingScreen,
             params: {
                 backgroundColor: "#000000",
-                loadingImage: require('../../../assets/img/loading.png')
+                loadingImage: images.loading
             }
         },
         viewer: {
-            html: require("../../../assets/templates/default/defaultViewer.html"),
+            html: defaultViewer,
             params: {
                 enableDragAndDrop: false
             }
         },
         navBar: {
-            html: require("../../../assets/templates/default/navbar.html"),
+            html: navbar,
             params: {
                 speedList: {
                     "0.5x": "0.5",
@@ -42,7 +45,7 @@ export let defaultConfiguration: ViewerConfiguration = {
                     "1.5x": "1.5",
                     "2.0x": "2.0",
                 },
-                logoImage: require('../../../assets/img/BabylonJS_Logo_Small.png'),
+                logoImage: images.babylonLogo,
                 logoText: 'BabylonJS',
                 logoLink: 'https://babylonjs.com',
                 hideHelp: true,
@@ -62,20 +65,20 @@ export let defaultConfiguration: ViewerConfiguration = {
             }
         },
         overlay: {
-            html: require("../../../assets/templates/default/overlay.html"),
+            html: overlay,
             params: {
-                closeImage: require('../../../assets/img/close.png'),
+                closeImage: images.close,
                 closeText: 'Close'
             }
         },
         help: {
-            html: require("../../../assets/templates/default/help.html")
+            html: help
         },
         share: {
-            html: require("../../../assets/templates/default/share.html")
+            html: share
         },
         error: {
-            html: require("../../../assets/templates/default/error.html")
+            html: error
         }
 
     },

Viewer/src/configuration/types/minimal.ts

@@ -1,4 +1,6 @@
 import { ViewerConfiguration } from './../configuration';
+import { defaultTemplate, fillContainer, loadingScreen, defaultViewer, overlay, error } from '../../assets/templates';
+import { loading, close } from '../../assets/img';
 
 /**
  * The minimal configuration needed to make the viewer work.
@@ -8,33 +10,33 @@ export let minimalConfiguration: ViewerConfiguration = {
     version: "0.1",
     templates: {
         main: {
-            html: require("../../../assets/templates/default/defaultTemplate.html")
+            html: defaultTemplate
         },
         fillContainer: {
-            html: require("../../../assets/templates/default/fillContainer.html"),
+            html: fillContainer,
             params: {
                 disable: false
             }
         },
         loadingScreen: {
-            html: require("../../../assets/templates/default/loadingScreen.html"),
+            html: loadingScreen,
             params: {
                 backgroundColor: "#000000",
-                loadingImage: require('../../../assets/img/loading.png')
+                loadingImage: loading
             }
         },
         viewer: {
-            html: require("../../../assets/templates/default/defaultViewer.html"),
+            html: defaultViewer,
         },
         overlay: {
-            html: require("../../../assets/templates/default/overlay.html"),
+            html: overlay,
             params: {
-                closeImage: require('../../../assets/img/close.png'),
+                closeImage: close,
                 closeText: 'Close'
             }
         },
         error: {
-            html: require("../../../assets/templates/default/error.html")
+            html: error
         }
 
     },