tforgione
/
3d-interface
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Finished tutorial

This commit is contained in:
Thomas FORGIONE 2015-05-29 10:11:20 +02:00
parent 6b3a79c34e
commit 0cd54a86a8
4 changed files with 107 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
js/TutoCamera.js
View File

@ -169,6 +169,10 @@ TutoCamera.prototype.normalMotion = function(time) {
}
TutoCamera.prototype.reset = function() {
if (this.tutorial.nextAction() === 'reset-camera') {
this.tutorial.nextStep();
}
this.resetPosition();
this.moving = false;
this.movingHermite = false;
@ -226,6 +230,10 @@ TutoCamera.prototype.move = function(otherCamera, toSave) {
}
TutoCamera.prototype.moveHermite = function(otherCamera, toSave) {
if (this.tutorial.nextAction() === 'recommendation') {
this.tutorial.nextStep();
}
if (toSave === undefined)
toSave = true;

39
js/prototype/Coin.js vendored
View File

@ -12,7 +12,6 @@ var _toto = new Audio();
Coin.extension = _toto.canPlayType("audio/x-vorbis") === "" ? ".ogg" : ".mp3";
Coin.prototype.init = function(x,y,z) {
Coin.nextSound = new Audio(static_path + 'data/music/redcoins/1' + Coin.extension);
if (Coin.BASIC_MESH !== null) {
this.mesh = Coin.BASIC_MESH.clone();
this.mesh.position.x = x;
@ -81,22 +80,28 @@ Coin.BASIC_MESH = null;
Coin._loader = new THREE.OBJLoader();
Coin.init = function(scale) {
if (scale === undefined) {
scale = 0.005;
}
if (!Coin.initialized) {
Coin.initialized = true;
Coin._loader.load(
static_path + 'data/coin/Coin.obj',
function(object) {
object.traverse(function (mesh) {
if (mesh instanceof THREE.Mesh) {
mesh.scale.set(scale,scale,scale);
mesh.material.color.setHex(0xff0000);
mesh.geometry.computeVertexNormals();
mesh.raycastable = true;
Coin.BASIC_MESH = mesh
}
});
if (scale === undefined) {
scale = 0.005;
}
);
Coin._loader.load(
static_path + 'data/coin/Coin.obj',
function(object) {
object.traverse(function (mesh) {
if (mesh instanceof THREE.Mesh) {
mesh.scale.set(scale,scale,scale);
mesh.material.color.setHex(0xff0000);
mesh.geometry.computeVertexNormals();
mesh.raycastable = true;
Coin.BASIC_MESH = mesh
}
});
}
);
Coin.nextSound = new Audio(static_path + 'data/music/redcoins/1' + Coin.extension);
}
}

65
js/prototype/TutorialSteps.js vendored
View File

@ -47,7 +47,35 @@ var TutorialSteps = function(tutoCamera) {
justclick: false
},
{
text: "You got it ! I think you're ready to play !",
text: "You got it ! Try to click on reset camera !",
justclick: false
},
{
text: "Nice ! Let me introduce you to <emp>recommendations</em>",
justclick: true
},
{
text: "This is a recommendation, by hovering it, you should see a preview, and by clicking on it, you should go to the recommended viewpoint",
justclick: false
},
{
text: "The recommendation will change color once you clicked on it, just like a web link",
justclick:true
},
{
text: "Here are some more recommendations, try to browse the scene and find the missing red coins (5/8)",
justclick:false
},
{
text:"6/8 : you can use the arrow buttons to go to the previous / next position",
justclick: false
},
{
text: "7/8 ! Only one more !",
justclick: false
},
{
text: "Congratulations ! You've successfully finished the tutorial !",
justclick: false
}
];
@ -65,10 +93,7 @@ TutorialSteps.prototype.nextStep = function() {
case 2: this.camera.allowed.keyboardRotate = true; break;
case 3:
this.camera.allowed.keyboardRotate = true;
coins.push(new Coin(0.4911245636058468,1.225621525492101,-5.11526684540265, function() {
self.nextStep();
self.coins++;
}));
coins.push(new Coin(0.4911245636058468,1.225621525492101,-5.11526684540265, callback));
coins[coins.length-1].addToScene(scene);
break;
case 4:
@ -87,6 +112,28 @@ TutorialSteps.prototype.nextStep = function() {
coins.push(new Coin(2.7378029903574026,2.953347730618792,-11.550836282321221, callback));
coins[coins.length-1].addToScene(scene);
break;
case 12:
var cam = createPeachCameras(container_size.width(), container_size.height())[2];
cameras.push(cam);
cam.addToScene(scene);
this.camera.move({
position: new THREE.Vector3(0.24120226734236713,0.2009624547018851,-0.5998422840047036),
target: new THREE.Vector3(24.021711452218575,7.072419314071788,-32.020702608601745)
});
break;
case 14:
var cams = createPeachCameras(container_size.width(), container_size.height());
for (var i = 0; i < cams.length; i == 1 ? i+=2 : i++) {
cameras.push(cams[i]);
cams[i].addToScene(scene);
}
coins.push(new Coin(3.701112872561801,-0.4620393514856378,-3.3373375945128085, callback));
coins[coins.length-1].addToScene(scene);
coins.push(new Coin(6.694675339780243,-1.2480369397526456,-1.992336719279164, callback));
coins[coins.length-1].addToScene(scene);
coins.push(new Coin(-2.458336118265302,-1.549510268763568,-11.186153614421212, callback));
coins[coins.length-1].addToScene(scene);
}
this.step++;
}
@ -97,6 +144,8 @@ TutorialSteps.prototype.nextAction = function() {
case 2: return 'rotate-mouse';
case 3: return 'rotate-keyboard';
case 9: return 'translate-keyboard';
case 11: return 'reset-camera';
case 13: return 'recommendation';
}
}
@ -113,15 +162,15 @@ TutorialSteps.prototype.alert = function(myString, justclicked) {
TutorialSteps.prototype.notify = function(myString, justclick) {
$('#alert-placeholder').html(
'<div class="alert alert-warning alert-dismissable">' +
'<div class="alert alert-' + (justclick ? 'warning' : 'info') + ' alert-dismissable">' +
(justclick ?
'<button type="button" class="close" aria-hidden="true"' +
'onclick="setTimeout(onWindowResize, 100); tutorial.nextStep();' + '">' +
'<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>' +
'</button>' : '') +
'<span>' +
'<span><strong>' +
myString +
'</span>' +
'</strong></span>' +
'</div>'
);
}

28
js/prototype/initScene.js vendored
View File

@ -176,21 +176,33 @@ function createPeachCameras(width, height) {
new THREE.Vector3(-19.756833131355208, -16.20027570329664, -33.02132017177813)
));
cams.push(createCamera(
new THREE.Vector3(1.3304975149911331, 0.4836093721106701, -8.60618907952783),
new THREE.Vector3(-1.7713635815431914, 6.271997833695163, -48.06341930106774)
));
// cams.push(createCamera(
// new THREE.Vector3(1.3304975149911331, 0.4836093721106701, -8.60618907952783),
// new THREE.Vector3(-1.7713635815431914, 6.271997833695163, -48.06341930106774)
// ));
cams.push(createCamera(
new THREE.Vector3(1.2976081760482443, 1.1520399813234647, -10.258148122402845),
new THREE.Vector3(-26.00651734173549, -9.19681009597505, -37.596510029925945)
));
// cams.push(createCamera(
// new THREE.Vector3(1.2976081760482443, 1.1520399813234647, -10.258148122402845),
// new THREE.Vector3(-26.00651734173549, -9.19681009597505, -37.596510029925945)
// ));
cams.push(createCamera(
new THREE.Vector3(0.15727187830660858, 2.7251137440572855, -5.84333603646124),
new THREE.Vector3(19.33738702531091, -13.614383891308975, -36.91010284556961)
));
cams.push(createCamera(
new THREE.Vector3(-3.912436457101955,1.4571795397310319,-7.361700012948173),
new THREE.Vector3(26.60153755572943,-12.280244389383581,-29.274722938506393)
));
cams.push(createCamera(
new THREE.Vector3(4.734058048040269,0.9171350442568073,0.12604632828978296),
new THREE.Vector3(25.163187055614348,-27.08137327531798,-19.842284094421995)
));
cams.forEach(function(cam) {cam.setSize(0.2);});
return cams;
}