diff --git a/app/assets/json/agents/basic3D.json b/app/assets/json/agents/basic3D.json
new file mode 100644
index 0000000..0b6492e
--- /dev/null
+++ b/app/assets/json/agents/basic3D.json
@@ -0,0 +1,28 @@
+{
+ "molecule1": {
+ "type": "Mesh",
+ "geometry": { "type": "BoxGeometry", "args": [1, 1, 1] },
+ "material": { "type": "MeshStandardMaterial", "color": "orange" },
+ "children": [
+ {
+ "type": "Mesh",
+ "geometry": { "type": "SphereGeometry", "args": [0.3, 16, 16] },
+ "material": { "type": "MeshStandardMaterial", "color": "blue" },
+ "position": [0, 0.5, 0]
+ }
+ ]
+ },
+ "molecule2": {
+ "type": "Mesh",
+ "geometry": { "type": "SphereGeometry", "args": [1, 1, 1] },
+ "material": { "type": "MeshStandardMaterial", "color": "green" },
+ "children": [
+ {
+ "type": "Mesh",
+ "geometry": { "type": "SphereGeometry", "args": [0.3, 16, 16] },
+ "material": { "type": "MeshStandardMaterial", "color": "red" },
+ "position": [0, 1, 0]
+ }
+ ]
+ }
+}
diff --git a/app/assets/json/global/bypass/roleDelegations.json b/app/assets/json/global/bypass/roleDelegations.json
deleted file mode 100644
index c3b5588..0000000
--- a/app/assets/json/global/bypass/roleDelegations.json
+++ /dev/null
@@ -1,23 +0,0 @@
-[
- {
- "master": "BP_PO",
- "surrogates": [
- {"role": "BP_PO", "track": "ignore", "domain": "ignore"},
- {"role": "BP_HoU", "track": "ignore", "domain": "ignore"},
- {"role": "BP_SPOC_Plugin", "track": "daTai94ymStyRbQWybH3eDw", "domain": "set"},
- {"role": "BP_SPOC_FastTrack", "track": "d7xAg5kIhQYeDMB1H6eXnBg", "domain": "set"}
- ]
- },
- {
- "master": "BP_SPOC_FastTrack",
- "surrogates": [
- {"role": "BP_SPOC_FastTrack", "track": "inherit", "domain": "inherit"}
- ]
- },
- {
- "master": "BP_SPOC_Plugin",
- "surrogates": [
- {"role": "BP_SPOC_Plugin", "track": "inherit", "domain": "inherit"}
- ]
- }
-]
\ No newline at end of file
diff --git a/app/assets/styles/app.css b/app/assets/styles/app.css
index da6b722..8a2c7dd 100755
--- a/app/assets/styles/app.css
+++ b/app/assets/styles/app.css
@@ -131,7 +131,7 @@ body[eicapp] {
padding: var(--eicui-base-spacing-2xs) var(--eicui-base-spacing-2xs);
cursor: default;
margin: 0;
- overflow: auto;
+ overflow: hidden;
transition: all 0.5s;
flex: 1 1 auto;
diff --git a/app/controllers/dashboard/DashboardsController.js b/app/controllers/dashboard/DashboardsController.js
index 1301fae..8d5457b 100644
--- a/app/controllers/dashboard/DashboardsController.js
+++ b/app/controllers/dashboard/DashboardsController.js
@@ -2,7 +2,7 @@ class DashboardsController extends EICController {
constructor(params) {
super(params)
-
+ this.agentDefs = app.Assets.Store.json.agentDefs
}
/**
@@ -10,12 +10,29 @@ class DashboardsController extends EICController {
* @returns
*/
index() {
- let models = {
+ const models = {
// mailings: new MailingsModel(payload['/mailings'].permissions)
}
- // await app.Assets.loadHtml({name:'mailing/tile.html'})
+
+ const ttb = new app.LoadedModules.Threetobus()
+ ttb.initScene()
+ const m1 = ttb.buildFromJSON(this.agentDefs.molecule1)
+ m1.name = 'agent42'
+ ttb.scene.add(m1)
+ setTimeout(() => {
+ ttb.smoothRelMove({
+ object: m1,
+ dX: 5,
+ dY:0,
+ dZ:0,
+ delay: 1500,
+ easing: 'Quadratic',
+ easingMode: 'InOut',
+ })
+ },3000)
+
this.loadWindow(
- 'dashboards/MainDashboardView',
+ 'visualisers/SpaceView',
{
title: '3D view',
static: true,
@@ -29,11 +46,14 @@ class DashboardsController extends EICController {
},
{
models: models,
- mode: '3D'
+ agentDefs: this.agentDefs,
+ rendererId:'3drenderer',
+ mode: '3D',
+ ttb: ttb,
}
)
this.loadWindow(
- 'dashboards/MainDashboardView',
+ 'visualisers/SpaceView',
{
title: '2D View',
static: true,
@@ -47,7 +67,10 @@ class DashboardsController extends EICController {
},
{
models: models,
- mode: '2D'
+ agentDefs: this.agentDefs,
+ rendererId:'2drenderer',
+ mode: '2D',
+ ttb: ttb,
}
)
}
diff --git a/app/controllers/dashboard/DashboardsController.json b/app/controllers/dashboard/DashboardsController.json
index c1f8881..f6074b1 100644
--- a/app/controllers/dashboard/DashboardsController.json
+++ b/app/controllers/dashboard/DashboardsController.json
@@ -10,7 +10,7 @@
"models": [
],
"views": [
- "dashboards/MainDashboardView"
+ "visualisers/SpaceView"
],
"controllerDependencies": [
"/helpers/basicDialogs",
@@ -18,12 +18,14 @@
"/helpers/activeAttributes",
"/thirdparty/Threetobus/three.module",
"/thirdparty/Threetobus/OrbitControls.module",
+ "/thirdparty/Threetobus/tween.module",
"/thirdparty/Threetobus/threetobus.module"
],
"assets": {
"styles": [
],
"json": [
+ {"id":"agentDefs", "name": "agents/basic3D.json"}
]
}
}
\ No newline at end of file
diff --git a/app/thirdparty/Threetobus/threetobus.module.js b/app/thirdparty/Threetobus/threetobus.module.js
index 766831d..777f9ee 100644
--- a/app/thirdparty/Threetobus/threetobus.module.js
+++ b/app/thirdparty/Threetobus/threetobus.module.js
@@ -1,24 +1,24 @@
-import * as THREE from './three.module.js';
-import { OrbitControls } from './OrbitControls.module.js';
+import * as THREE from './three.module.js'
+import { OrbitControls } from './OrbitControls.module.js'
+import * as TWEEN from './tween.module.js'
export class Threetobus{
- constructor(canvasEl){
- this.canvasEl = canvasEl
+ constructor(){
this.cameras = {}
+ this.renderers = []
}
initScene(){
// Scene
this.scene = new THREE.Scene()
- this.grid = new THREE.GridHelper(20, 20, 0x444444, 0x888888)
- //this.grid.rotation.x = Math.PI / 2 // Default is on the XZ plane → rotate to XY
+ this.grid = new THREE.GridHelper(20, 20, 0x8888AA, 0x8888AA)
this.scene.add(this.grid)
// Cameras
- this.cameras.persp1 = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000)
- this.cameras.persp1.position.set(3, 3, 5)
+ this.cameras.camPerspective = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000)
+ this.cameras.camPerspective.position.set(3, 3, 5)
const aspect = window.innerWidth / window.innerHeight
const frustumSize = 10
this.cameras.cam2Dtop = new THREE.OrthographicCamera(
@@ -31,7 +31,6 @@ export class Threetobus{
)
this.cameras.cam2Dtop.position.set(0, 100, 0)
this.cameras.cam2Dtop.lookAt(0, 0, 0)
- //this.camera = this.cameras.persp1
// Lights
const light = new THREE.DirectionalLight(0xffffff, 1)
@@ -40,31 +39,21 @@ export class Threetobus{
this.scene.add(light)
this.scene.add(new THREE.AmbientLight(0xffffff, 0.4))
- // Renderer
- this.renderer = new THREE.WebGLRenderer({ antialias: true, canvas: this.canvasEl })
-
}
- startRendering(mode){
+ startRendering(canvasEl, mode){
+ let renderEngine
if(mode=='2D'){
- this.changeCamera('cam2Dtop')
- } else if(mode=='3D') {
- this.changeCamera('persp1')
- this.controls = new OrbitControls(this.camera, this.renderer.domElement)
- window.addEventListener('resize', () => {
- this.camera.aspect = window.innerWidth / window.innerHeight
- this.camera.updateProjectionMatrix()
- renderer.setSize(window.innerWidth, window.innerHeight)
- })
- }
- this.render()
+ renderEngine = new RenderingEngine(canvasEl, this.scene, this.cameras.cam2Dtop)
+ } else if(mode=='3D') {
+ renderEngine = new RenderingEngine(canvasEl, this.scene, this.cameras.camPerspective)
+ renderEngine.addControls()
+ } else console.error('Unknown rendering mode !')
+
+ renderEngine.render()
+ this.renderers.push(renderEngine)
}
- changeCamera(camName){
- if(camName in this.cameras){
- this.camera = this.cameras[camName]
- }
- }
buildFromJSON(desc){
let obj
@@ -93,29 +82,64 @@ export class Threetobus{
return obj
}
- _resizeRendererToDisplaySize() {
- const canvas = this.renderer.domElement
- const width = canvas.clientWidth
- const height = canvas.clientHeight
- if (canvas.width !== width || canvas.height !== height) {
- this.renderer.setSize(width, height, false)
- return true
- }
- return false
+
+ smoothRelMove(options){
+ // options: object, dX, dY, dZ, delay, easing, easingMode
+ // easings: Linear, Quadratic, Cubic, Quartic, Quintic, Sinusoidal, Exponential, Circular, Elastic, Back, Bounce
+ // easingMode: In → starts slow, accelerates towards the end.
+ // Out → starts fast, decelerates smoothly.
+ // InOut → slow at both ends, faster in the middle.
+ options.easing = options.easing ? options.easing : 'Quadratic'
+ options.easingMode = options.easingMode ? options.easingMode : 'InOut'
+
+ new TWEEN.Tween(options.object.position)
+ .to({ x: options.object.position.x + options.dX,
+ y: options.object.position.y + options.dY,
+ z: options.object.position.z + options.dZ,
+ }, options.delay)
+ .easing(TWEEN.Easing[options.easing][options.easingMode])
+ .start()
+ }
+}
+
+class RenderingEngine{
+ constructor(canvasEl, scene, camera){
+ this.canvasEl = canvasEl
+ this.scene = scene
+ this.renderer = new THREE.WebGLRenderer({ antialias: true, canvas: this.canvasEl })
+ this.camera = camera
+ }
+
+ addControls(){
+ this.controls = new OrbitControls(this.camera, this.canvasEl)
+ window.addEventListener('resize', () => {
+ this.camera.aspect = window.innerWidth / window.innerHeight
+ this.camera.updateProjectionMatrix()
+ this.renderer.setSize(window.innerWidth, window.innerHeight)
+ })
}
render() {
- if(this._resizeRendererToDisplaySize()) {
- this.camera.aspect = this.renderer.domElement.clientWidth / this.renderer.domElement.clientHeight
+ TWEEN.update()
+ if(this.resizeRendererToDisplaySize()) {
+ this.camera.aspect = this.renderer.domElement.clientWidth / this.canvasEl.clientHeight
this.camera.updateProjectionMatrix()
}
this.renderer.render(this.scene, this.camera)
requestAnimationFrame(this.render.bind(this))
}
-
-}
+ resizeRendererToDisplaySize() {
+ const width = this.canvasEl.clientWidth
+ const height = this.canvasEl.clientHeight
+ if (this.canvasEl.width !== width || this.canvasEl.height !== height) {
+ this.renderer.setSize(width, height, false)
+ return true
+ }
+ return false
+ }
+}
// Make this module available to common JS
if(!app.LoadedModules) app.LoadedModules = {}
diff --git a/app/thirdparty/Threetobus/tween.module.js b/app/thirdparty/Threetobus/tween.module.js
new file mode 100644
index 0000000..610a1cd
--- /dev/null
+++ b/app/thirdparty/Threetobus/tween.module.js
@@ -0,0 +1,803 @@
+/**
+ * The Ease class provides a collection of easing functions for use with tween.js.
+ */
+var Easing = {
+ Linear: {
+ None: function (amount) {
+ return amount;
+ },
+ },
+ Quadratic: {
+ In: function (amount) {
+ return amount * amount;
+ },
+ Out: function (amount) {
+ return amount * (2 - amount);
+ },
+ InOut: function (amount) {
+ if ((amount *= 2) < 1) {
+ return 0.5 * amount * amount;
+ }
+ return -0.5 * (--amount * (amount - 2) - 1);
+ },
+ },
+ Cubic: {
+ In: function (amount) {
+ return amount * amount * amount;
+ },
+ Out: function (amount) {
+ return --amount * amount * amount + 1;
+ },
+ InOut: function (amount) {
+ if ((amount *= 2) < 1) {
+ return 0.5 * amount * amount * amount;
+ }
+ return 0.5 * ((amount -= 2) * amount * amount + 2);
+ },
+ },
+ Quartic: {
+ In: function (amount) {
+ return amount * amount * amount * amount;
+ },
+ Out: function (amount) {
+ return 1 - --amount * amount * amount * amount;
+ },
+ InOut: function (amount) {
+ if ((amount *= 2) < 1) {
+ return 0.5 * amount * amount * amount * amount;
+ }
+ return -0.5 * ((amount -= 2) * amount * amount * amount - 2);
+ },
+ },
+ Quintic: {
+ In: function (amount) {
+ return amount * amount * amount * amount * amount;
+ },
+ Out: function (amount) {
+ return --amount * amount * amount * amount * amount + 1;
+ },
+ InOut: function (amount) {
+ if ((amount *= 2) < 1) {
+ return 0.5 * amount * amount * amount * amount * amount;
+ }
+ return 0.5 * ((amount -= 2) * amount * amount * amount * amount + 2);
+ },
+ },
+ Sinusoidal: {
+ In: function (amount) {
+ return 1 - Math.cos((amount * Math.PI) / 2);
+ },
+ Out: function (amount) {
+ return Math.sin((amount * Math.PI) / 2);
+ },
+ InOut: function (amount) {
+ return 0.5 * (1 - Math.cos(Math.PI * amount));
+ },
+ },
+ Exponential: {
+ In: function (amount) {
+ return amount === 0 ? 0 : Math.pow(1024, amount - 1);
+ },
+ Out: function (amount) {
+ return amount === 1 ? 1 : 1 - Math.pow(2, -10 * amount);
+ },
+ InOut: function (amount) {
+ if (amount === 0) {
+ return 0;
+ }
+ if (amount === 1) {
+ return 1;
+ }
+ if ((amount *= 2) < 1) {
+ return 0.5 * Math.pow(1024, amount - 1);
+ }
+ return 0.5 * (-Math.pow(2, -10 * (amount - 1)) + 2);
+ },
+ },
+ Circular: {
+ In: function (amount) {
+ return 1 - Math.sqrt(1 - amount * amount);
+ },
+ Out: function (amount) {
+ return Math.sqrt(1 - --amount * amount);
+ },
+ InOut: function (amount) {
+ if ((amount *= 2) < 1) {
+ return -0.5 * (Math.sqrt(1 - amount * amount) - 1);
+ }
+ return 0.5 * (Math.sqrt(1 - (amount -= 2) * amount) + 1);
+ },
+ },
+ Elastic: {
+ In: function (amount) {
+ if (amount === 0) {
+ return 0;
+ }
+ if (amount === 1) {
+ return 1;
+ }
+ return -Math.pow(2, 10 * (amount - 1)) * Math.sin((amount - 1.1) * 5 * Math.PI);
+ },
+ Out: function (amount) {
+ if (amount === 0) {
+ return 0;
+ }
+ if (amount === 1) {
+ return 1;
+ }
+ return Math.pow(2, -10 * amount) * Math.sin((amount - 0.1) * 5 * Math.PI) + 1;
+ },
+ InOut: function (amount) {
+ if (amount === 0) {
+ return 0;
+ }
+ if (amount === 1) {
+ return 1;
+ }
+ amount *= 2;
+ if (amount < 1) {
+ return -0.5 * Math.pow(2, 10 * (amount - 1)) * Math.sin((amount - 1.1) * 5 * Math.PI);
+ }
+ return 0.5 * Math.pow(2, -10 * (amount - 1)) * Math.sin((amount - 1.1) * 5 * Math.PI) + 1;
+ },
+ },
+ Back: {
+ In: function (amount) {
+ var s = 1.70158;
+ return amount * amount * ((s + 1) * amount - s);
+ },
+ Out: function (amount) {
+ var s = 1.70158;
+ return --amount * amount * ((s + 1) * amount + s) + 1;
+ },
+ InOut: function (amount) {
+ var s = 1.70158 * 1.525;
+ if ((amount *= 2) < 1) {
+ return 0.5 * (amount * amount * ((s + 1) * amount - s));
+ }
+ return 0.5 * ((amount -= 2) * amount * ((s + 1) * amount + s) + 2);
+ },
+ },
+ Bounce: {
+ In: function (amount) {
+ return 1 - Easing.Bounce.Out(1 - amount);
+ },
+ Out: function (amount) {
+ if (amount < 1 / 2.75) {
+ return 7.5625 * amount * amount;
+ }
+ else if (amount < 2 / 2.75) {
+ return 7.5625 * (amount -= 1.5 / 2.75) * amount + 0.75;
+ }
+ else if (amount < 2.5 / 2.75) {
+ return 7.5625 * (amount -= 2.25 / 2.75) * amount + 0.9375;
+ }
+ else {
+ return 7.5625 * (amount -= 2.625 / 2.75) * amount + 0.984375;
+ }
+ },
+ InOut: function (amount) {
+ if (amount < 0.5) {
+ return Easing.Bounce.In(amount * 2) * 0.5;
+ }
+ return Easing.Bounce.Out(amount * 2 - 1) * 0.5 + 0.5;
+ },
+ },
+};
+
+var now;
+// Include a performance.now polyfill.
+// In node.js, use process.hrtime.
+// eslint-disable-next-line
+// @ts-ignore
+if (typeof self === 'undefined' && typeof process !== 'undefined' && process.hrtime) {
+ now = function () {
+ // eslint-disable-next-line
+ // @ts-ignore
+ var time = process.hrtime();
+ // Convert [seconds, nanoseconds] to milliseconds.
+ return time[0] * 1000 + time[1] / 1000000;
+ };
+}
+// In a browser, use self.performance.now if it is available.
+else if (typeof self !== 'undefined' && self.performance !== undefined && self.performance.now !== undefined) {
+ // This must be bound, because directly assigning this function
+ // leads to an invocation exception in Chrome.
+ now = self.performance.now.bind(self.performance);
+}
+// Use Date.now if it is available.
+else if (Date.now !== undefined) {
+ now = Date.now;
+}
+// Otherwise, use 'new Date().getTime()'.
+else {
+ now = function () {
+ return new Date().getTime();
+ };
+}
+var now$1 = now;
+
+/**
+ * Controlling groups of tweens
+ *
+ * Using the TWEEN singleton to manage your tweens can cause issues in large apps with many components.
+ * In these cases, you may want to create your own smaller groups of tween
+ */
+var Group = /** @class */ (function () {
+ function Group() {
+ this._tweens = {};
+ this._tweensAddedDuringUpdate = {};
+ }
+ Group.prototype.getAll = function () {
+ var _this = this;
+ return Object.keys(this._tweens).map(function (tweenId) {
+ return _this._tweens[tweenId];
+ });
+ };
+ Group.prototype.removeAll = function () {
+ this._tweens = {};
+ };
+ Group.prototype.add = function (tween) {
+ this._tweens[tween.getId()] = tween;
+ this._tweensAddedDuringUpdate[tween.getId()] = tween;
+ };
+ Group.prototype.remove = function (tween) {
+ delete this._tweens[tween.getId()];
+ delete this._tweensAddedDuringUpdate[tween.getId()];
+ };
+ Group.prototype.update = function (time, preserve) {
+ if (time === void 0) { time = now$1(); }
+ if (preserve === void 0) { preserve = false; }
+ var tweenIds = Object.keys(this._tweens);
+ if (tweenIds.length === 0) {
+ return false;
+ }
+ // Tweens are updated in "batches". If you add a new tween during an
+ // update, then the new tween will be updated in the next batch.
+ // If you remove a tween during an update, it may or may not be updated.
+ // However, if the removed tween was added during the current batch,
+ // then it will not be updated.
+ while (tweenIds.length > 0) {
+ this._tweensAddedDuringUpdate = {};
+ for (var i = 0; i < tweenIds.length; i++) {
+ var tween = this._tweens[tweenIds[i]];
+ var autoStart = !preserve;
+ if (tween && tween.update(time, autoStart) === false && !preserve) {
+ delete this._tweens[tweenIds[i]];
+ }
+ }
+ tweenIds = Object.keys(this._tweensAddedDuringUpdate);
+ }
+ return true;
+ };
+ return Group;
+}());
+
+/**
+ *
+ */
+var Interpolation = {
+ Linear: function (v, k) {
+ var m = v.length - 1;
+ var f = m * k;
+ var i = Math.floor(f);
+ var fn = Interpolation.Utils.Linear;
+ if (k < 0) {
+ return fn(v[0], v[1], f);
+ }
+ if (k > 1) {
+ return fn(v[m], v[m - 1], m - f);
+ }
+ return fn(v[i], v[i + 1 > m ? m : i + 1], f - i);
+ },
+ Bezier: function (v, k) {
+ var b = 0;
+ var n = v.length - 1;
+ var pw = Math.pow;
+ var bn = Interpolation.Utils.Bernstein;
+ for (var i = 0; i <= n; i++) {
+ b += pw(1 - k, n - i) * pw(k, i) * v[i] * bn(n, i);
+ }
+ return b;
+ },
+ CatmullRom: function (v, k) {
+ var m = v.length - 1;
+ var f = m * k;
+ var i = Math.floor(f);
+ var fn = Interpolation.Utils.CatmullRom;
+ if (v[0] === v[m]) {
+ if (k < 0) {
+ i = Math.floor((f = m * (1 + k)));
+ }
+ return fn(v[(i - 1 + m) % m], v[i], v[(i + 1) % m], v[(i + 2) % m], f - i);
+ }
+ else {
+ if (k < 0) {
+ return v[0] - (fn(v[0], v[0], v[1], v[1], -f) - v[0]);
+ }
+ if (k > 1) {
+ return v[m] - (fn(v[m], v[m], v[m - 1], v[m - 1], f - m) - v[m]);
+ }
+ return fn(v[i ? i - 1 : 0], v[i], v[m < i + 1 ? m : i + 1], v[m < i + 2 ? m : i + 2], f - i);
+ }
+ },
+ Utils: {
+ Linear: function (p0, p1, t) {
+ return (p1 - p0) * t + p0;
+ },
+ Bernstein: function (n, i) {
+ var fc = Interpolation.Utils.Factorial;
+ return fc(n) / fc(i) / fc(n - i);
+ },
+ Factorial: (function () {
+ var a = [1];
+ return function (n) {
+ var s = 1;
+ if (a[n]) {
+ return a[n];
+ }
+ for (var i = n; i > 1; i--) {
+ s *= i;
+ }
+ a[n] = s;
+ return s;
+ };
+ })(),
+ CatmullRom: function (p0, p1, p2, p3, t) {
+ var v0 = (p2 - p0) * 0.5;
+ var v1 = (p3 - p1) * 0.5;
+ var t2 = t * t;
+ var t3 = t * t2;
+ return (2 * p1 - 2 * p2 + v0 + v1) * t3 + (-3 * p1 + 3 * p2 - 2 * v0 - v1) * t2 + v0 * t + p1;
+ },
+ },
+};
+
+/**
+ * Utils
+ */
+var Sequence = /** @class */ (function () {
+ function Sequence() {
+ }
+ Sequence.nextId = function () {
+ return Sequence._nextId++;
+ };
+ Sequence._nextId = 0;
+ return Sequence;
+}());
+
+var mainGroup = new Group();
+
+/**
+ * Tween.js - Licensed under the MIT license
+ * https://github.com/tweenjs/tween.js
+ * ----------------------------------------------
+ *
+ * See https://github.com/tweenjs/tween.js/graphs/contributors for the full list of contributors.
+ * Thank you all, you're awesome!
+ */
+var Tween = /** @class */ (function () {
+ function Tween(_object, _group) {
+ if (_group === void 0) { _group = mainGroup; }
+ this._object = _object;
+ this._group = _group;
+ this._isPaused = false;
+ this._pauseStart = 0;
+ this._valuesStart = {};
+ this._valuesEnd = {};
+ this._valuesStartRepeat = {};
+ this._duration = 1000;
+ this._initialRepeat = 0;
+ this._repeat = 0;
+ this._yoyo = false;
+ this._isPlaying = false;
+ this._reversed = false;
+ this._delayTime = 0;
+ this._startTime = 0;
+ this._easingFunction = Easing.Linear.None;
+ this._interpolationFunction = Interpolation.Linear;
+ this._chainedTweens = [];
+ this._onStartCallbackFired = false;
+ this._id = Sequence.nextId();
+ this._isChainStopped = false;
+ this._goToEnd = false;
+ }
+ Tween.prototype.getId = function () {
+ return this._id;
+ };
+ Tween.prototype.isPlaying = function () {
+ return this._isPlaying;
+ };
+ Tween.prototype.isPaused = function () {
+ return this._isPaused;
+ };
+ Tween.prototype.to = function (properties, duration) {
+ // TODO? restore this, then update the 07_dynamic_to example to set fox
+ // tween's to on each update. That way the behavior is opt-in (there's
+ // currently no opt-out).
+ // for (const prop in properties) this._valuesEnd[prop] = properties[prop]
+ this._valuesEnd = Object.create(properties);
+ if (duration !== undefined) {
+ this._duration = duration;
+ }
+ return this;
+ };
+ Tween.prototype.duration = function (d) {
+ this._duration = d;
+ return this;
+ };
+ Tween.prototype.start = function (time) {
+ if (this._isPlaying) {
+ return this;
+ }
+ // eslint-disable-next-line
+ this._group && this._group.add(this);
+ this._repeat = this._initialRepeat;
+ if (this._reversed) {
+ // If we were reversed (f.e. using the yoyo feature) then we need to
+ // flip the tween direction back to forward.
+ this._reversed = false;
+ for (var property in this._valuesStartRepeat) {
+ this._swapEndStartRepeatValues(property);
+ this._valuesStart[property] = this._valuesStartRepeat[property];
+ }
+ }
+ this._isPlaying = true;
+ this._isPaused = false;
+ this._onStartCallbackFired = false;
+ this._isChainStopped = false;
+ this._startTime = time !== undefined ? (typeof time === 'string' ? now$1() + parseFloat(time) : time) : now$1();
+ this._startTime += this._delayTime;
+ this._setupProperties(this._object, this._valuesStart, this._valuesEnd, this._valuesStartRepeat);
+ return this;
+ };
+ Tween.prototype._setupProperties = function (_object, _valuesStart, _valuesEnd, _valuesStartRepeat) {
+ for (var property in _valuesEnd) {
+ var startValue = _object[property];
+ var startValueIsArray = Array.isArray(startValue);
+ var propType = startValueIsArray ? 'array' : typeof startValue;
+ var isInterpolationList = !startValueIsArray && Array.isArray(_valuesEnd[property]);
+ // If `to()` specifies a property that doesn't exist in the source object,
+ // we should not set that property in the object
+ if (propType === 'undefined' || propType === 'function') {
+ continue;
+ }
+ // Check if an Array was provided as property value
+ if (isInterpolationList) {
+ var endValues = _valuesEnd[property];
+ if (endValues.length === 0) {
+ continue;
+ }
+ // handle an array of relative values
+ endValues = endValues.map(this._handleRelativeValue.bind(this, startValue));
+ // Create a local copy of the Array with the start value at the front
+ _valuesEnd[property] = [startValue].concat(endValues);
+ }
+ // handle the deepness of the values
+ if ((propType === 'object' || startValueIsArray) && startValue && !isInterpolationList) {
+ _valuesStart[property] = startValueIsArray ? [] : {};
+ // eslint-disable-next-line
+ for (var prop in startValue) {
+ // eslint-disable-next-line
+ // @ts-ignore FIXME?
+ _valuesStart[property][prop] = startValue[prop];
+ }
+ _valuesStartRepeat[property] = startValueIsArray ? [] : {}; // TODO? repeat nested values? And yoyo? And array values?
+ // eslint-disable-next-line
+ // @ts-ignore FIXME?
+ this._setupProperties(startValue, _valuesStart[property], _valuesEnd[property], _valuesStartRepeat[property]);
+ }
+ else {
+ // Save the starting value, but only once.
+ if (typeof _valuesStart[property] === 'undefined') {
+ _valuesStart[property] = startValue;
+ }
+ if (!startValueIsArray) {
+ // eslint-disable-next-line
+ // @ts-ignore FIXME?
+ _valuesStart[property] *= 1.0; // Ensures we're using numbers, not strings
+ }
+ if (isInterpolationList) {
+ // eslint-disable-next-line
+ // @ts-ignore FIXME?
+ _valuesStartRepeat[property] = _valuesEnd[property].slice().reverse();
+ }
+ else {
+ _valuesStartRepeat[property] = _valuesStart[property] || 0;
+ }
+ }
+ }
+ };
+ Tween.prototype.stop = function () {
+ if (!this._isChainStopped) {
+ this._isChainStopped = true;
+ this.stopChainedTweens();
+ }
+ if (!this._isPlaying) {
+ return this;
+ }
+ // eslint-disable-next-line
+ this._group && this._group.remove(this);
+ this._isPlaying = false;
+ this._isPaused = false;
+ if (this._onStopCallback) {
+ this._onStopCallback(this._object);
+ }
+ return this;
+ };
+ Tween.prototype.end = function () {
+ this._goToEnd = true;
+ this.update(Infinity);
+ return this;
+ };
+ Tween.prototype.pause = function (time) {
+ if (time === void 0) { time = now$1(); }
+ if (this._isPaused || !this._isPlaying) {
+ return this;
+ }
+ this._isPaused = true;
+ this._pauseStart = time;
+ // eslint-disable-next-line
+ this._group && this._group.remove(this);
+ return this;
+ };
+ Tween.prototype.resume = function (time) {
+ if (time === void 0) { time = now$1(); }
+ if (!this._isPaused || !this._isPlaying) {
+ return this;
+ }
+ this._isPaused = false;
+ this._startTime += time - this._pauseStart;
+ this._pauseStart = 0;
+ // eslint-disable-next-line
+ this._group && this._group.add(this);
+ return this;
+ };
+ Tween.prototype.stopChainedTweens = function () {
+ for (var i = 0, numChainedTweens = this._chainedTweens.length; i < numChainedTweens; i++) {
+ this._chainedTweens[i].stop();
+ }
+ return this;
+ };
+ Tween.prototype.group = function (group) {
+ this._group = group;
+ return this;
+ };
+ Tween.prototype.delay = function (amount) {
+ this._delayTime = amount;
+ return this;
+ };
+ Tween.prototype.repeat = function (times) {
+ this._initialRepeat = times;
+ this._repeat = times;
+ return this;
+ };
+ Tween.prototype.repeatDelay = function (amount) {
+ this._repeatDelayTime = amount;
+ return this;
+ };
+ Tween.prototype.yoyo = function (yoyo) {
+ this._yoyo = yoyo;
+ return this;
+ };
+ Tween.prototype.easing = function (easingFunction) {
+ this._easingFunction = easingFunction;
+ return this;
+ };
+ Tween.prototype.interpolation = function (interpolationFunction) {
+ this._interpolationFunction = interpolationFunction;
+ return this;
+ };
+ Tween.prototype.chain = function () {
+ var tweens = [];
+ for (var _i = 0; _i < arguments.length; _i++) {
+ tweens[_i] = arguments[_i];
+ }
+ this._chainedTweens = tweens;
+ return this;
+ };
+ Tween.prototype.onStart = function (callback) {
+ this._onStartCallback = callback;
+ return this;
+ };
+ Tween.prototype.onUpdate = function (callback) {
+ this._onUpdateCallback = callback;
+ return this;
+ };
+ Tween.prototype.onRepeat = function (callback) {
+ this._onRepeatCallback = callback;
+ return this;
+ };
+ Tween.prototype.onComplete = function (callback) {
+ this._onCompleteCallback = callback;
+ return this;
+ };
+ Tween.prototype.onStop = function (callback) {
+ this._onStopCallback = callback;
+ return this;
+ };
+ /**
+ * @returns true if the tween is still playing after the update, false
+ * otherwise (calling update on a paused tween still returns true because
+ * it is still playing, just paused).
+ */
+ Tween.prototype.update = function (time, autoStart) {
+ if (time === void 0) { time = now$1(); }
+ if (autoStart === void 0) { autoStart = true; }
+ if (this._isPaused)
+ return true;
+ var property;
+ var elapsed;
+ var endTime = this._startTime + this._duration;
+ if (!this._goToEnd && !this._isPlaying) {
+ if (time > endTime)
+ return false;
+ if (autoStart)
+ this.start(time);
+ }
+ this._goToEnd = false;
+ if (time < this._startTime) {
+ return true;
+ }
+ if (this._onStartCallbackFired === false) {
+ if (this._onStartCallback) {
+ this._onStartCallback(this._object);
+ }
+ this._onStartCallbackFired = true;
+ }
+ elapsed = (time - this._startTime) / this._duration;
+ elapsed = this._duration === 0 || elapsed > 1 ? 1 : elapsed;
+ var value = this._easingFunction(elapsed);
+ // properties transformations
+ this._updateProperties(this._object, this._valuesStart, this._valuesEnd, value);
+ if (this._onUpdateCallback) {
+ this._onUpdateCallback(this._object, elapsed);
+ }
+ if (elapsed === 1) {
+ if (this._repeat > 0) {
+ if (isFinite(this._repeat)) {
+ this._repeat--;
+ }
+ // Reassign starting values, restart by making startTime = now
+ for (property in this._valuesStartRepeat) {
+ if (!this._yoyo && typeof this._valuesEnd[property] === 'string') {
+ this._valuesStartRepeat[property] =
+ // eslint-disable-next-line
+ // @ts-ignore FIXME?
+ this._valuesStartRepeat[property] + parseFloat(this._valuesEnd[property]);
+ }
+ if (this._yoyo) {
+ this._swapEndStartRepeatValues(property);
+ }
+ this._valuesStart[property] = this._valuesStartRepeat[property];
+ }
+ if (this._yoyo) {
+ this._reversed = !this._reversed;
+ }
+ if (this._repeatDelayTime !== undefined) {
+ this._startTime = time + this._repeatDelayTime;
+ }
+ else {
+ this._startTime = time + this._delayTime;
+ }
+ if (this._onRepeatCallback) {
+ this._onRepeatCallback(this._object);
+ }
+ return true;
+ }
+ else {
+ if (this._onCompleteCallback) {
+ this._onCompleteCallback(this._object);
+ }
+ for (var i = 0, numChainedTweens = this._chainedTweens.length; i < numChainedTweens; i++) {
+ // Make the chained tweens start exactly at the time they should,
+ // even if the `update()` method was called way past the duration of the tween
+ this._chainedTweens[i].start(this._startTime + this._duration);
+ }
+ this._isPlaying = false;
+ return false;
+ }
+ }
+ return true;
+ };
+ Tween.prototype._updateProperties = function (_object, _valuesStart, _valuesEnd, value) {
+ for (var property in _valuesEnd) {
+ // Don't update properties that do not exist in the source object
+ if (_valuesStart[property] === undefined) {
+ continue;
+ }
+ var start = _valuesStart[property] || 0;
+ var end = _valuesEnd[property];
+ var startIsArray = Array.isArray(_object[property]);
+ var endIsArray = Array.isArray(end);
+ var isInterpolationList = !startIsArray && endIsArray;
+ if (isInterpolationList) {
+ _object[property] = this._interpolationFunction(end, value);
+ }
+ else if (typeof end === 'object' && end) {
+ // eslint-disable-next-line
+ // @ts-ignore FIXME?
+ this._updateProperties(_object[property], start, end, value);
+ }
+ else {
+ // Parses relative end values with start as base (e.g.: +10, -3)
+ end = this._handleRelativeValue(start, end);
+ // Protect against non numeric properties.
+ if (typeof end === 'number') {
+ // eslint-disable-next-line
+ // @ts-ignore FIXME?
+ _object[property] = start + (end - start) * value;
+ }
+ }
+ }
+ };
+ Tween.prototype._handleRelativeValue = function (start, end) {
+ if (typeof end !== 'string') {
+ return end;
+ }
+ if (end.charAt(0) === '+' || end.charAt(0) === '-') {
+ return start + parseFloat(end);
+ }
+ else {
+ return parseFloat(end);
+ }
+ };
+ Tween.prototype._swapEndStartRepeatValues = function (property) {
+ var tmp = this._valuesStartRepeat[property];
+ var endValue = this._valuesEnd[property];
+ if (typeof endValue === 'string') {
+ this._valuesStartRepeat[property] = this._valuesStartRepeat[property] + parseFloat(endValue);
+ }
+ else {
+ this._valuesStartRepeat[property] = this._valuesEnd[property];
+ }
+ this._valuesEnd[property] = tmp;
+ };
+ return Tween;
+}());
+
+var VERSION = '18.6.4';
+
+/**
+ * Tween.js - Licensed under the MIT license
+ * https://github.com/tweenjs/tween.js
+ * ----------------------------------------------
+ *
+ * See https://github.com/tweenjs/tween.js/graphs/contributors for the full list of contributors.
+ * Thank you all, you're awesome!
+ */
+var nextId = Sequence.nextId;
+/**
+ * Controlling groups of tweens
+ *
+ * Using the TWEEN singleton to manage your tweens can cause issues in large apps with many components.
+ * In these cases, you may want to create your own smaller groups of tweens.
+ */
+var TWEEN = mainGroup;
+// This is the best way to export things in a way that's compatible with both ES
+// Modules and CommonJS, without build hacks, and so as not to break the
+// existing API.
+// https://github.com/rollup/rollup/issues/1961#issuecomment-423037881
+var getAll = TWEEN.getAll.bind(TWEEN);
+var removeAll = TWEEN.removeAll.bind(TWEEN);
+var add = TWEEN.add.bind(TWEEN);
+var remove = TWEEN.remove.bind(TWEEN);
+var update = TWEEN.update.bind(TWEEN);
+var exports = {
+ Easing: Easing,
+ Group: Group,
+ Interpolation: Interpolation,
+ now: now$1,
+ Sequence: Sequence,
+ nextId: nextId,
+ Tween: Tween,
+ VERSION: VERSION,
+ getAll: getAll,
+ removeAll: removeAll,
+ add: add,
+ remove: remove,
+ update: update,
+};
+
+export default exports;
+export { Easing, Group, Interpolation, Sequence, Tween, VERSION, add, getAll, nextId, now$1 as now, remove, removeAll, update };
diff --git a/app/views/dashboards/MainDashboardView.js b/app/views/dashboards/MainDashboardView.js
deleted file mode 100644
index 35dbd84..0000000
--- a/app/views/dashboards/MainDashboardView.js
+++ /dev/null
@@ -1,70 +0,0 @@
-class MainDashboardView extends EICDomContent {
-
-
- //TODO should come from the API, from some sprites lib. (allow switching representations)
- agentTypes = {
- molecule1:{
- "type": "Mesh",
- "geometry": { "type": "BoxGeometry", "args": [1, 1, 1] },
- "material": { "type": "MeshStandardMaterial", "color": "orange" },
- "children": [
- {
- "type": "Mesh",
- "geometry": { "type": "SphereGeometry", "args": [0.3, 16, 16] },
- "material": { "type": "MeshStandardMaterial", "color": "blue" },
- "position": [0, 0.5, 0]
- }
- ]
- },
- molecule2:{
- "type": "Mesh",
- "geometry": { "type": "SphereGeometry", "args": [1, 1, 1] },
- "material": { "type": "MeshStandardMaterial", "color": "green" },
- "children": [
- {
- "type": "Mesh",
- "geometry": { "type": "SphereGeometry", "args": [0.3, 16, 16] },
- "material": { "type": "MeshStandardMaterial", "color": "red" },
- "position": [0, 1, 0]
- }
- ]
- }
-
- }
-
- constructor() {
- super()
- Object.assign(this, app.helpers.activeAttributes)
- //this.tileMarkup = app.Assets.Store.html['/app/assets/html/mailing/tile.html']
- }
-
- DOMContentFocused(options) {
- // Avoid 2nd refesh on DomContentLoaded
- if(this.wasBlured){
- //this.refreshyoustuff()
- }
- this.wasBlured = false
- }
-
- DOMContentBlured(options) { this.wasBlured = true }
-
- DOMContentLoaded(options) {
- for(let model in options.models) this[model] = options.models[model]
- const components = ui.eicfy(this.el)
- this.setupTriggers(components)
- this.setupRefs(components)
-
- this.ttb = new app.LoadedModules.Threetobus(this.outputs.paper43)
- this.ttb.initScene()
- this.ttb.startRendering(options.mode)
-
- const m1 = this.ttb.buildFromJSON(this.agentTypes.molecule1)
- m1.name = 'toto'
- this.ttb.scene.add(m1)
- }
-
-
-
-}
-
-app.registerClass('MainDashboardView', MainDashboardView)
diff --git a/app/views/dashboards/MainDashboardView.html b/app/views/visualisers/SpaceView.html
similarity index 73%
rename from app/views/dashboards/MainDashboardView.html
rename to app/views/visualisers/SpaceView.html
index ee8060a..9103085 100644
--- a/app/views/dashboards/MainDashboardView.html
+++ b/app/views/visualisers/SpaceView.html
@@ -4,10 +4,10 @@
height:100%;
background-color: #333;
}
- canvas[data-output="paper43"]{
+ canvas[data-output="ttbCanvas"]{
width: 100%;
height: 100%;
}
-
+
diff --git a/app/views/visualisers/SpaceView.js b/app/views/visualisers/SpaceView.js
new file mode 100644
index 0000000..15e00fa
--- /dev/null
+++ b/app/views/visualisers/SpaceView.js
@@ -0,0 +1,34 @@
+class SpaceView extends EICDomContent {
+
+ constructor() {
+ super()
+ Object.assign(this, app.helpers.activeAttributes)
+ //this.tileMarkup = app.Assets.Store.html['/app/assets/html/mailing/tile.html']
+ }
+
+ DOMContentFocused(options) {
+ if(this.wasBlured){ // Avoid 2nd refesh on DomContentLoaded
+ //this.refreshyoustuff()
+ }
+ this.wasBlured = false
+ }
+
+ DOMContentBlured(options) { this.wasBlured = true }
+
+ DOMContentLoaded(options) {
+ for(let model in options.models) this[model] = options.models[model]
+ this.ttb = options.ttb
+ const components = ui.eicfy(this.el)
+ this.setupTriggers(components)
+ this.setupRefs(components)
+
+ this.ttb.startRendering(this.outputs.ttbCanvas, options.mode)
+
+
+ }
+
+
+
+}
+
+app.registerClass('SpaceView', SpaceView)