some architecture
Canvas class takes care of displaying images Scene class will display a scene as described in script.json Director class will switch between scenes for now, this displays a static frame
This commit is contained in:
parent
d2bdcf49db
commit
563c79652f
|
@ -2,7 +2,6 @@
|
||||||
|
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
|
|
||||||
let Canvas = function(container, width, height) {
|
let Canvas = function(container, width, height) {
|
||||||
|
|
||||||
this.container = container;
|
this.container = container;
|
||||||
|
@ -30,7 +29,7 @@
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
Canvas.prototype.showImage = function(name) {
|
Canvas.prototype.drawImage = function(name) {
|
||||||
|
|
||||||
if (!(name in this.images)) {
|
if (!(name in this.images)) {
|
||||||
throw new Error('image ' + name + ' unknown');
|
throw new Error('image ' + name + ' unknown');
|
||||||
|
|
|
@ -0,0 +1,24 @@
|
||||||
|
(function() {
|
||||||
|
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const Scene = require('./scene');
|
||||||
|
|
||||||
|
let Director = function(script, canvas) {
|
||||||
|
|
||||||
|
this.script = script;
|
||||||
|
this.canvas = canvas;
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
Director.prototype.begin = function() {
|
||||||
|
|
||||||
|
let scene = new Scene(this.script.scenes.vaginal, this.canvas);
|
||||||
|
|
||||||
|
scene.play();
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
module.exports = Director;
|
||||||
|
|
||||||
|
})();
|
|
@ -4,11 +4,14 @@
|
||||||
|
|
||||||
require('../assets/style.css');
|
require('../assets/style.css');
|
||||||
|
|
||||||
const scenes = require('./scenes.json');
|
const script = require('./script.json');
|
||||||
|
|
||||||
const Canvas = require('./canvas');
|
const Canvas = require('./canvas');
|
||||||
|
const Director = require('./director');
|
||||||
|
|
||||||
let canvas = new Canvas(document.getElementById("canvasDiv"), 512, 272);
|
let canvas = new Canvas(document.getElementById("canvasDiv"), 512, 272);
|
||||||
|
let director = new Director(script, canvas);
|
||||||
|
|
||||||
canvas.show('room');
|
director.begin();
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
|
|
@ -0,0 +1,29 @@
|
||||||
|
(function() {
|
||||||
|
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
let Scene = function(scene, canvas) {
|
||||||
|
|
||||||
|
this.frames = scene.frames;
|
||||||
|
this.roll = scene.roll;
|
||||||
|
this.canvas = canvas;
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
Scene.prototype.drawFrame = function(frame) {
|
||||||
|
|
||||||
|
let images = this.frames[frame];
|
||||||
|
|
||||||
|
images.forEach((image) => {
|
||||||
|
this.canvas.drawImage(image);
|
||||||
|
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
Scene.prototype.play = function() {
|
||||||
|
this.drawFrame('vaginal_initial');
|
||||||
|
};
|
||||||
|
|
||||||
|
module.exports = Scene;
|
||||||
|
|
||||||
|
})();
|
|
@ -1,71 +0,0 @@
|
||||||
{
|
|
||||||
"vaginal": {
|
|
||||||
"frames": [
|
|
||||||
{
|
|
||||||
"name": "vaginal_initial",
|
|
||||||
"images": [
|
|
||||||
"room",
|
|
||||||
"vaginal_base",
|
|
||||||
"vaginal_frame1"
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"name": "vaginal_frame1",
|
|
||||||
"images": [
|
|
||||||
"vaginal_frame1"
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"name": "vaginal_frame2",
|
|
||||||
"images": [
|
|
||||||
"vaginal_frame2"
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"name": "vaginal_balloon_venho",
|
|
||||||
"images": [
|
|
||||||
"vaginal_balloon_venho"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
],
|
|
||||||
"scene": [
|
|
||||||
{
|
|
||||||
"frame": "vaginal_initial",
|
|
||||||
"duration": 750
|
|
||||||
},
|
|
||||||
[
|
|
||||||
{
|
|
||||||
"repeat": 19
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"frame": "vaginal_frame1",
|
|
||||||
"duration": 750
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"frame": "vaginal_frame2",
|
|
||||||
"duration": 750
|
|
||||||
}
|
|
||||||
],
|
|
||||||
{
|
|
||||||
"frame": "vaginal_balloon_venho"
|
|
||||||
},
|
|
||||||
[
|
|
||||||
{
|
|
||||||
"repeat": 6
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"frame": "vaginal_frame1",
|
|
||||||
"duration": 750
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"frame": "vaginal_frame2",
|
|
||||||
"duration": 750
|
|
||||||
}
|
|
||||||
],
|
|
||||||
{
|
|
||||||
"frame": "vaginal_initial",
|
|
||||||
"duration": 2500
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -0,0 +1,61 @@
|
||||||
|
{
|
||||||
|
"scenes": {
|
||||||
|
"vaginal": {
|
||||||
|
"frames": {
|
||||||
|
"vaginal_initial": [
|
||||||
|
"room",
|
||||||
|
"vaginal_base",
|
||||||
|
"vaginal_frame1"
|
||||||
|
],
|
||||||
|
"vaginal_frame1": [
|
||||||
|
"vaginal_frame1"
|
||||||
|
],
|
||||||
|
"vaginal_frame2": [
|
||||||
|
"vaginal_frame2"
|
||||||
|
],
|
||||||
|
"vaginal_balloon_venho": [
|
||||||
|
"vaginal_balloon_venho"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"roll": [
|
||||||
|
{
|
||||||
|
"frame": "vaginal_initial",
|
||||||
|
"duration": 750
|
||||||
|
},
|
||||||
|
[
|
||||||
|
{
|
||||||
|
"repeat": 19
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"frame": "vaginal_frame1",
|
||||||
|
"duration": 750
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"frame": "vaginal_frame2",
|
||||||
|
"duration": 750
|
||||||
|
}
|
||||||
|
],
|
||||||
|
{
|
||||||
|
"frame": "vaginal_balloon_venho"
|
||||||
|
},
|
||||||
|
[
|
||||||
|
{
|
||||||
|
"repeat": 6
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"frame": "vaginal_frame1",
|
||||||
|
"duration": 750
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"frame": "vaginal_frame2",
|
||||||
|
"duration": 750
|
||||||
|
}
|
||||||
|
],
|
||||||
|
{
|
||||||
|
"frame": "vaginal_initial",
|
||||||
|
"duration": 2500
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue