Maj de la Boîte en papier

J’ai mis à jour mon mini site La Boîte en Papier, en ajoutant l’ExpressKey Remote aux Intuos Pro et en la retirant des Cintiq 24HD (sniff).
Mais en fait, le plus important , c’est que j’ai bien cleané mon code pour le WebGL. C’est nettement plus propre. J’ai modifié légèrement le main script de Three.js pour avoir un preload plus joli (‘faut pas le faire, mais bon, je peux me le permettre – c’est de la réplique de kéké, ça) . Donc maintenant, vous avez un vrai preload (le précédent était un faux – le faux preloading, c’est un ancien truc de flasheur) des meshes et des images qui lance l’ouverture des volets quand tout a été chargé.

Si j’ai rien à faire, je ferai des Grip Pen et Pro Pen plus réalistes la prochaine fois.

Sinon pour ceux qui font du WebGL (biblio Three.js) et qui veulent facilement un preloader (sans les images – j’utilise un autre script simple), j’ai fait comme ça. Comme je charge en dernier le meshe qui a le plus gros poids (la tablette) avec loader ( ‘y a que ça sur le three.min.js – penser à activer « true ») et je crée un autre loader pour le meshe stylet que je place avant (mais je l’active pas par True). Après quand tout est chargé, je mets tout dans loader.onLoadComplete=function() :  l’effacement du loading tout pourri de threejs (je l’ai changé  directement – c’est pour ça que j’appelle un three.minCustom2.js), l’ajout des meshes à la scène (j’ai créé un groupe avec un Object3D), et pour finir, le script Ajax qui stoppe l’animation et lance l’ouverture des volets du script.

groupTablette = new THREE.Object3D();

function createScene2(geometry, x, y, z, scale, tmap) {
zmesh2 = new THREE.Mesh(geometry, new THREE.MeshPhongMaterial({map: THREE.ImageUtils.loadTexture(tmap),envMap:textureCube, reflectivity: 0.02, shading: THREE.SmoothShading}));
zmesh2.position.set(x, y, z);
zmesh2.scale.set(scale, scale, scale);
meshes.push(zmesh2);
groupTablette.add(zmesh2);
}
function createScene(geometry, x, y, z, scale, tmap) {
zmesh = new THREE.Mesh(geometry, new THREE.MeshPhongMaterial({map: THREE.ImageUtils.loadTexture(tmap),envMap:textureCube, reflectivity: 0.02,shininess: 100,
specularMap : THREE.ImageUtils.loadTexture(‘SpecularIS.gif’),
specular : new THREE.Color(‘#151515’),
bumpMap : THREE.ImageUtils.loadTexture(« IntuosSBumpPT.gif »),
bumpScale : 0.5,
shading: THREE.SmoothShading}));
zmesh.position.set(x, y, z);
zmesh.scale.set(scale, scale, scale);
meshes.push(zmesh);
groupTablette.add(zmesh);
}

//Tablette
var loaderW1nce2 = new THREE.JSONLoader();
loader = new THREE.JSONLoader(true);
document.body.appendChild( loader.statusDomElement );

callbackKey2 = function(geometry) {
createScene2(geometry, 80, 0, 55, 15, « BambooPenmap.jpg »)};
loaderW1nce2.load(« BambooStylus.js », callbackKey2);

callbackKey = function(geometry) {
createScene(geometry, 0, 0, 0, 15, « IntuosSmapPT.png »)};
loader.load(« IntuosS2.js », callbackKey);

loader.onLoadComplete=function(){
loader.statusDomElement.style.display = « none »;
scene.add( groupTablette );
$.getScript(« js/main.js », function(){});
}