diff --git a/license.md b/license.md index 8ed0a9d..138a631 100644 --- a/license.md +++ b/license.md @@ -1,6 +1,6 @@ MIT License -Copyright (c) 2019 Bruno SIMON +Copyright (c) 2019 Lucas MORAMARCO Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/readme.md b/readme.md index 44bab3f..304d607 100644 --- a/readme.md +++ b/readme.md @@ -1,4 +1,8 @@ -# Folio 2019 +# Portfolio 2023 Mode exploration + +Vous voulez visualiser mon portfolio de différentes façons ? +[Mode Simple / Principale](https://lucasmoramarco.fr) +[Mode Designer](https://designer.lucasmoramarco.fr) ## Setup Download [Node.js](https://nodejs.org/en/download/). diff --git a/src/favicon/site.webmanifest b/src/favicon/site.webmanifest index 9115af1..45b38e3 100644 --- a/src/favicon/site.webmanifest +++ b/src/favicon/site.webmanifest @@ -1,6 +1,6 @@ { - "name": "Bruno Simon", - "short_name": "Bruno Simon", + "name": "Lucas Moramarco", + "short_name": "Lucas Moramarco", "icons": [ { "src": "/favicon/android-chrome-192x192.png", @@ -16,4 +16,4 @@ "theme_color": "#ffffff", "background_color": "#ffffff", "display": "standalone" -} +} \ No newline at end of file diff --git a/src/index.html b/src/index.html index 704754d..9cf4c92 100644 --- a/src/index.html +++ b/src/index.html @@ -1,27 +1,31 @@ - - + + - Bruno Simon - + Lucas Moramarco - Portfolio Exploration + - - - + + + - - - + + - + + - - - - + + + + @@ -30,15 +34,16 @@ - - + + - + + @@ -54,13 +59,14 @@
-
Hey! You seem to really enjoy my portfolio.
+
Je vous souhaite la bienvenue et bon visonnage de mon portfolio mode exploration. +
-
Would you like to learn how to create cool websites like this?
+
Voulez vous visualiser mon portfolio d'une autre façon ?
@@ -68,17 +74,17 @@ - Nah, I'm good + Non, je préfère m'amuser dans cet univers. - + - Yes, teach me! + Oui, je veux bien voir ça !
-
Alright then.
Have fun and try not to break my car!
+
Pas de soucis.
Amusez vous bien et essayez de ne pas casser ma voiture !
@@ -87,10 +93,11 @@ - + + \ No newline at end of file diff --git a/src/javascript/Application.js b/src/javascript/Application.js index ed338e7..a2e4547 100644 --- a/src/javascript/Application.js +++ b/src/javascript/Application.js @@ -14,13 +14,11 @@ import { RenderPass } from 'three/examples/jsm/postprocessing/RenderPass.js' import BlurPass from './Passes/Blur.js' import GlowsPass from './Passes/Glows.js' -export default class Application -{ +export default class Application { /** * Constructor */ - constructor(_options) - { + constructor(_options) { // Options this.$canvas = _options.$canvas @@ -42,15 +40,13 @@ export default class Application /** * Set config */ - setConfig() - { + setConfig() { this.config = {} this.config.debug = window.location.hash === '#debug' this.config.cyberTruck = window.location.hash === '#cybertruck' this.config.touch = false - window.addEventListener('touchstart', () => - { + window.addEventListener('touchstart', () => { this.config.touch = true this.world.controls.setTouch() @@ -64,10 +60,8 @@ export default class Application /** * Set debug */ - setDebug() - { - if(this.config.debug) - { + setDebug() { + if (this.config.debug) { this.debug = new dat.GUI({ width: 420 }) } } @@ -75,8 +69,7 @@ export default class Application /** * Set renderer */ - setRenderer() - { + setRenderer() { // Scene this.scene = new THREE.Scene() @@ -96,8 +89,7 @@ export default class Application this.renderer.autoClear = false // Resize event - this.sizes.on('resize', () => - { + this.sizes.on('resize', () => { this.renderer.setSize(this.sizes.viewport.width, this.sizes.viewport.height) }) } @@ -105,8 +97,7 @@ export default class Application /** * Set camera */ - setCamera() - { + setCamera() { this.camera = new Camera({ time: this.time, sizes: this.sizes, @@ -117,23 +108,19 @@ export default class Application this.scene.add(this.camera.container) - this.time.on('tick', () => - { - if(this.world && this.world.car) - { + this.time.on('tick', () => { + if (this.world && this.world.car) { this.camera.target.x = this.world.car.chassis.object.position.x this.camera.target.y = this.world.car.chassis.object.position.y } }) } - setPasses() - { + setPasses() { this.passes = {} // Debug - if(this.debug) - { + if (this.debug) { this.passes.debugFolder = this.debug.addFolder('postprocess') // this.passes.debugFolder.open() } @@ -154,8 +141,7 @@ export default class Application this.passes.verticalBlurPass.material.uniforms.uStrength.value = new THREE.Vector2(0, this.passes.verticalBlurPass.strength) // Debug - if(this.debug) - { + if (this.debug) { const folder = this.passes.debugFolder.addFolder('blur') folder.open() @@ -164,23 +150,21 @@ export default class Application } this.passes.glowsPass = new ShaderPass(GlowsPass) - this.passes.glowsPass.color = '#ffcfe0' + this.passes.glowsPass.color = '#38B7FF' this.passes.glowsPass.material.uniforms.uPosition.value = new THREE.Vector2(0, 0.25) this.passes.glowsPass.material.uniforms.uRadius.value = 0.7 this.passes.glowsPass.material.uniforms.uColor.value = new THREE.Color(this.passes.glowsPass.color) this.passes.glowsPass.material.uniforms.uAlpha.value = 0.55 // Debug - if(this.debug) - { + if (this.debug) { const folder = this.passes.debugFolder.addFolder('glows') folder.open() folder.add(this.passes.glowsPass.material.uniforms.uPosition.value, 'x').step(0.001).min(- 1).max(2).name('positionX') folder.add(this.passes.glowsPass.material.uniforms.uPosition.value, 'y').step(0.001).min(- 1).max(2).name('positionY') folder.add(this.passes.glowsPass.material.uniforms.uRadius, 'value').step(0.001).min(0).max(2).name('radius') - folder.addColor(this.passes.glowsPass, 'color').name('color').onChange(() => - { + folder.addColor(this.passes.glowsPass, 'color').name('color').onChange(() => { this.passes.glowsPass.material.uniforms.uColor.value = new THREE.Color(this.passes.glowsPass.color) }) folder.add(this.passes.glowsPass.material.uniforms.uAlpha, 'value').step(0.001).min(0).max(1).name('alpha') @@ -193,8 +177,7 @@ export default class Application this.passes.composer.addPass(this.passes.glowsPass) // Time tick - this.time.on('tick', () => - { + this.time.on('tick', () => { this.passes.horizontalBlurPass.enabled = this.passes.horizontalBlurPass.material.uniforms.uStrength.value.x > 0 this.passes.verticalBlurPass.enabled = this.passes.verticalBlurPass.material.uniforms.uStrength.value.y > 0 @@ -205,8 +188,7 @@ export default class Application }) // Resize event - this.sizes.on('resize', () => - { + this.sizes.on('resize', () => { this.renderer.setSize(this.sizes.viewport.width, this.sizes.viewport.height) this.passes.composer.setSize(this.sizes.viewport.width, this.sizes.viewport.height) this.passes.horizontalBlurPass.material.uniforms.uResolution.value.x = this.sizes.viewport.width @@ -219,8 +201,7 @@ export default class Application /** * Set world */ - setWorld() - { + setWorld() { this.world = new World({ config: this.config, debug: this.debug, @@ -237,8 +218,7 @@ export default class Application /** * Set title */ - setTitle() - { + setTitle() { this.title = {} this.title.frequency = 300 this.title.width = 20 @@ -246,21 +226,17 @@ export default class Application this.title.$element = document.querySelector('title') this.title.absolutePosition = Math.round(this.title.width * 0.25) - this.time.on('tick', () => - { - if(this.world.physics) - { + this.time.on('tick', () => { + if (this.world.physics) { this.title.absolutePosition += this.world.physics.car.forwardSpeed - if(this.title.absolutePosition < 0) - { + if (this.title.absolutePosition < 0) { this.title.absolutePosition = 0 } } }) - window.setInterval(() => - { + window.setInterval(() => { this.title.position = Math.round(this.title.absolutePosition % this.title.width) document.title = `${'_'.repeat(this.title.width - this.title.position)}🚗${'_'.repeat(this.title.position)}` @@ -270,8 +246,7 @@ export default class Application /** * Set Three.js Journey */ - setThreejsJourney() - { + setThreejsJourney() { this.threejsJourney = new ThreejsJourney({ config: this.config, time: this.time, @@ -282,8 +257,7 @@ export default class Application /** * Destructor */ - destructor() - { + destructor() { this.time.off('tick') this.sizes.off('resize') diff --git a/src/javascript/Resources.js b/src/javascript/Resources.js index 3fbc081..1a093d1 100644 --- a/src/javascript/Resources.js +++ b/src/javascript/Resources.js @@ -97,11 +97,11 @@ import projectsDistinctionsCSSDABaseSource from '../models/projects/distinctions import projectsDistinctionsCSSDACollisionSource from '../models/projects/distinctions/cssda/collision.glb' import projectsThreejsJourneyFloorSource from '../models/projects/threejsJourney/floorTexture.png' -import projectsMadboxFloorSource from '../models/projects/madbox/floorTexture.png' -import projectsScoutFloorSource from '../models/projects/scout/floorTexture.png' -import projectsChartogneFloorSource from '../models/projects/chartogne/floorTexture.png' -import projectsZenlyFloorSource from '../models/projects/zenly/floorTexture.png' -import projectsCitrixRedbullFloorSource from '../models/projects/citrixRedbull/floorTexture.png' +import projectschironFloorSource from '../models/projects/chiron/floorTexture.png' +import projectsrobrunFloorSource from '../models/projects/robrun/floorTexture.png' +import projectsupdaymeFloorSource from '../models/projects/updayme/floorTexture.png' +import projectskarmaFloorSource from '../models/projects/karma/floorTexture.png' +import projectsosakaFloorSource from '../models/projects/osaka/floorTexture.png' import projectsPriorHoldingsFloorSource from '../models/projects/priorHoldings/floorTexture.png' import projectsOranoFloorSource from '../models/projects/orano/floorTexture.png' // import projectsGleecChatFloorSource from '../models/projects/gleecChat/floorTexture.png' @@ -115,8 +115,8 @@ import informationStaticFloorShadowSource from '../models/information/static/flo import informationBaguetteBaseSource from '../models/information/baguette/base.glb' import informationBaguetteCollisionSource from '../models/information/baguette/collision.glb' -import informationContactTwitterLabelSource from '../models/information/static/contactTwitterLabel.png' -import informationContactGithubLabelSource from '../models/information/static/contactGithubLabel.png' +import informationModeSimpleLabelSource from '../models/information/static/modeSimpleLabel.png' +import informationModeDesignerLabelSource from '../models/information/static/modeDesignerLabel.png' import informationContactLinkedinLabelSource from '../models/information/static/contactLinkedinLabel.png' import informationContactMailLabelSource from '../models/information/static/contactMailLabel.png' @@ -211,10 +211,8 @@ import wig4Source from '../models/wigs/wig4.glb' // import eggBaseSource from '../models/egg/base.glb' // import eggCollisionSource from '../models/egg/collision.glb' -export default class Resources extends EventEmitter -{ - constructor() - { +export default class Resources extends EventEmitter { + constructor() { super() this.loader = new Loader() @@ -315,11 +313,11 @@ export default class Resources extends EventEmitter { name: 'projectsDistinctionsCSSDACollision', source: projectsDistinctionsCSSDACollisionSource }, { name: 'projectsThreejsJourneyFloor', source: projectsThreejsJourneyFloorSource, type: 'texture' }, - { name: 'projectsMadboxFloor', source: projectsMadboxFloorSource, type: 'texture' }, - { name: 'projectsScoutFloor', source: projectsScoutFloorSource, type: 'texture' }, - { name: 'projectsChartogneFloor', source: projectsChartogneFloorSource, type: 'texture' }, - { name: 'projectsZenlyFloor', source: projectsZenlyFloorSource, type: 'texture' }, - { name: 'projectsCitrixRedbullFloor', source: projectsCitrixRedbullFloorSource, type: 'texture' }, + { name: 'projectschironFloor', source: projectschironFloorSource, type: 'texture' }, + { name: 'projectsrobrunFloor', source: projectsrobrunFloorSource, type: 'texture' }, + { name: 'projectsupdaymeFloor', source: projectsupdaymeFloorSource, type: 'texture' }, + { name: 'projectskarmaFloor', source: projectskarmaFloorSource, type: 'texture' }, + { name: 'projectsosakaFloor', source: projectsosakaFloorSource, type: 'texture' }, { name: 'projectsPriorHoldingsFloor', source: projectsPriorHoldingsFloorSource, type: 'texture' }, { name: 'projectsOranoFloor', source: projectsOranoFloorSource, type: 'texture' }, // { name: 'projectsGleecChatFloor', source: projectsGleecChatFloorSource, type: 'texture' }, @@ -333,8 +331,8 @@ export default class Resources extends EventEmitter { name: 'informationBaguetteBase', source: informationBaguetteBaseSource }, { name: 'informationBaguetteCollision', source: informationBaguetteCollisionSource }, - { name: 'informationContactTwitterLabel', source: informationContactTwitterLabelSource, type: 'texture' }, - { name: 'informationContactGithubLabel', source: informationContactGithubLabelSource, type: 'texture' }, + { name: 'informationModeSimpleLabel', source: informationModeSimpleLabelSource, type: 'texture' }, + { name: 'informationModeDesignerLabel', source: informationModeDesignerLabelSource, type: 'texture' }, { name: 'informationContactLinkedinLabel', source: informationContactLinkedinLabelSource, type: 'texture' }, { name: 'informationContactMailLabel', source: informationContactMailLabelSource, type: 'texture' }, @@ -430,13 +428,11 @@ export default class Resources extends EventEmitter // { name: 'eggCollision', source: eggCollisionSource }, ]) - this.loader.on('fileEnd', (_resource, _data) => - { + this.loader.on('fileEnd', (_resource, _data) => { this.items[_resource.name] = _data // Texture - if(_resource.type === 'texture') - { + if (_resource.type === 'texture') { const texture = new THREE.Texture(_data) texture.needsUpdate = true @@ -447,8 +443,7 @@ export default class Resources extends EventEmitter this.trigger('progress', [this.loader.loaded / this.loader.toLoad]) }) - this.loader.on('end', () => - { + this.loader.on('end', () => { // Trigger ready this.trigger('ready') }) diff --git a/src/javascript/ThreejsJourney.js b/src/javascript/ThreejsJourney.js index 6d8ef5e..14e15d7 100644 --- a/src/javascript/ThreejsJourney.js +++ b/src/javascript/ThreejsJourney.js @@ -1,9 +1,7 @@ import { TweenLite } from 'gsap/TweenLite' -export default class ThreejsJourney -{ - constructor(_options) - { +export default class ThreejsJourney { + constructor(_options) { // Options this.config = _options.config this.time = _options.time @@ -23,160 +21,138 @@ export default class ThreejsJourney this.minTraveledDistance = (this.config.debug ? 5 : 75) * (this.seenCount + 1) this.prevent = !!window.localStorage.getItem('threejsJourneyPrevent') - if(this.config.debug) + if (this.config.debug) this.start() - - if(this.prevent) + + if (this.prevent) return this.setYesNo() this.setLog() - this.time.on('tick', () => - { - if(this.world.physics) - { + this.time.on('tick', () => { + if (this.world.physics) { this.traveledDistance += this.world.physics.car.forwardSpeed - if(!this.config.touch && !this.shown && this.traveledDistance > this.minTraveledDistance) - { + if (!this.config.touch && !this.shown && this.traveledDistance > this.minTraveledDistance) { this.start() } } }) } - setYesNo() - { + setYesNo() { // Clicks - this.$yes.addEventListener('click', () => - { - TweenLite.delayedCall(2, () => - { + this.$yes.addEventListener('click', () => { + TweenLite.delayedCall(2, () => { this.hide() }) window.localStorage.setItem('threejsJourneyPrevent', 1) }) - this.$no.addEventListener('click', () => - { + this.$no.addEventListener('click', () => { this.next() - TweenLite.delayedCall(5, () => - { + TweenLite.delayedCall(5, () => { this.hide() }) }) // Hovers - this.$yes.addEventListener('mouseenter', () => - { + this.$yes.addEventListener('mouseenter', () => { this.$container.classList.remove('is-hover-none') this.$container.classList.remove('is-hover-no') this.$container.classList.add('is-hover-yes') }) - this.$no.addEventListener('mouseenter', () => - { + this.$no.addEventListener('mouseenter', () => { this.$container.classList.remove('is-hover-none') this.$container.classList.add('is-hover-no') this.$container.classList.remove('is-hover-yes') }) - this.$yes.addEventListener('mouseleave', () => - { + this.$yes.addEventListener('mouseleave', () => { this.$container.classList.add('is-hover-none') this.$container.classList.remove('is-hover-no') this.$container.classList.remove('is-hover-yes') }) - this.$no.addEventListener('mouseleave', () => - { + this.$no.addEventListener('mouseleave', () => { this.$container.classList.add('is-hover-none') this.$container.classList.remove('is-hover-no') this.$container.classList.remove('is-hover-yes') }) } - setLog() - { -// console.log( -// `%c -// ▶ -// ▶▶▶▶ -// ▶▶▶▶▶▶▶ -// ▶▶▶▶▶▶▶▶▶▶ -// ▶▶▶▶▶▶▶▶ ▶ -// ▶▶▶▶ ▶▶▶▶▶▶▶▶ -// ▶ ▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶ -// ▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶ -// ▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶ -// ▶▶ ▶▶▶▶▶▶▶▶▶▶ ▶ ▶▶▶ -// ▶▶▶▶▶▶ ▶ ▶▶▶▶▶ ▶▶▶▶▶▶ -// ▶▶▶▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶▶▶ -// ▶▶▶▶▶▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶ -// ▶▶▶▶▶▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶▶▶▶ ▶▶▶▶ -// ▶▶▶▶▶▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶▶▶▶ ▶ -// ▶▶▶▶▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶▶▶▶ -// ▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶ -// ▶▶▶▶ ▶▶▶▶ ▶▶▶ -// ▶▶▶▶▶▶▶ ▶ -// ▶▶▶▶▶▶▶▶▶▶ -// ▶▶▶▶▶▶▶ -// ▶▶ -// `, -// 'color: #705df2;' -// ) - console.log('%cWhat are you doing here?! you sneaky developer...', 'color: #32ffce'); - console.log('%cDo you want to learn how this portfolio has been made?', 'color: #32ffce'); - console.log('%cCheckout Three.js Journey 👉 https://threejs-journey.com?c=p2', 'color: #32ffce'); - console.log('%c— Bruno', 'color: #777777'); + setLog() { + // console.log( + // `%c + // ▶ + // ▶▶▶▶ + // ▶▶▶▶▶▶▶ + // ▶▶▶▶▶▶▶▶▶▶ + // ▶▶▶▶▶▶▶▶ ▶ + // ▶▶▶▶ ▶▶▶▶▶▶▶▶ + // ▶ ▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶ + // ▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶ + // ▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶▶ + // ▶▶ ▶▶▶▶▶▶▶▶▶▶ ▶ ▶▶▶ + // ▶▶▶▶▶▶ ▶ ▶▶▶▶▶ ▶▶▶▶▶▶ + // ▶▶▶▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶▶▶ + // ▶▶▶▶▶▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶ + // ▶▶▶▶▶▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶▶▶▶ ▶▶▶▶ + // ▶▶▶▶▶▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶▶▶▶ ▶ + // ▶▶▶▶▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶▶▶▶ + // ▶▶▶▶▶▶▶▶ ▶▶▶▶▶▶▶ + // ▶▶▶▶ ▶▶▶▶ ▶▶▶ + // ▶▶▶▶▶▶▶ ▶ + // ▶▶▶▶▶▶▶▶▶▶ + // ▶▶▶▶▶▶▶ + // ▶▶ + // `, + // 'color: #38B7FF;' + // ) + console.log('%cWhat are you doing here?! you sneaky developer...', 'color: #38B7FF'); + console.log('%cDo you want to learn how this portfolio has been made?', 'color: #38B7FF'); + console.log('%cCheckout Three.js Journey 👉 https://threejs-journey.com?c=p2', 'color: #38B7FF'); + console.log('%c— Lucas', 'color: #38B7FF'); } - hide() - { - for(const _$message of this.$messages) - { + hide() { + for (const _$message of this.$messages) { _$message.classList.remove('is-visible') } - TweenLite.delayedCall(0.5, () => - { + TweenLite.delayedCall(0.5, () => { this.$container.classList.remove('is-active') }) } - start() - { + start() { this.$container.classList.add('is-active') - window.requestAnimationFrame(() => - { + window.requestAnimationFrame(() => { this.next() - TweenLite.delayedCall(4, () => - { + TweenLite.delayedCall(4, () => { this.next() }) - TweenLite.delayedCall(7, () => - { + TweenLite.delayedCall(7, () => { this.next() }) }) this.shown = true - + window.localStorage.setItem('threejsJourneySeenCount', this.seenCount + 1) } - updateMessages() - { + updateMessages() { let i = 0 // Visibility - for(const _$message of this.$messages) - { - if(i < this.step) + for (const _$message of this.$messages) { + if (i < this.step) _$message.classList.add('is-visible') i++ @@ -187,16 +163,13 @@ export default class ThreejsJourney let height = 0 i = this.maxStep - for(const _$message of this.$messages) - { + for (const _$message of this.$messages) { const messageHeight = _$message.offsetHeight - if(i < this.step) - { + if (i < this.step) { _$message.style.transform = `translateY(${- height}px)` height += messageHeight + 20 } - else - { + else { _$message.style.transform = `translateY(${messageHeight}px)` } @@ -207,9 +180,8 @@ export default class ThreejsJourney this.$messages.reverse() } - next() - { - if(this.step > this.maxStep) + next() { + if (this.step > this.maxStep) return this.step++ diff --git a/src/javascript/World/Car.js b/src/javascript/World/Car.js index b2642a0..229ae10 100644 --- a/src/javascript/World/Car.js +++ b/src/javascript/World/Car.js @@ -2,10 +2,8 @@ import * as THREE from 'three' import CANNON from 'cannon' import { TransformControls } from 'three/examples/jsm/controls/TransformControls.js' -export default class Car -{ - constructor(_options) - { +export default class Car { + constructor(_options) { // Options this.time = _options.time this.resources = _options.resources @@ -25,8 +23,7 @@ export default class Car this.position = new THREE.Vector3() // Debug - if(this.debug) - { + if (this.debug) { this.debugFolder = this.debug.addFolder('car') // this.debugFolder.open() } @@ -42,13 +39,11 @@ export default class Car this.setKlaxon() } - setModels() - { + setModels() { this.models = {} // Cyber truck - if(this.config.cyberTruck) - { + if (this.config.cyberTruck) { this.models.chassis = this.resources.items.carCyberTruckChassis this.models.antena = this.resources.items.carCyberTruckAntena this.models.backLightsBrake = this.resources.items.carCyberTruckBackLightsBrake @@ -57,8 +52,7 @@ export default class Car } // Default - else - { + else { this.models.chassis = this.resources.items.carDefaultChassis this.models.antena = this.resources.items.carDefaultAntena // this.models.bunnyEarLeft = this.resources.items.carDefaultBunnyEarLeft @@ -69,8 +63,7 @@ export default class Car } } - setMovement() - { + setMovement() { this.movement = {} this.movement.speed = new THREE.Vector3() this.movement.localSpeed = new THREE.Vector3() @@ -78,8 +71,7 @@ export default class Car this.movement.localAcceleration = new THREE.Vector3() // Time tick - this.time.on('tick', () => - { + this.time.on('tick', () => { // Movement const movementSpeed = new THREE.Vector3() movementSpeed.copy(this.chassis.object.position).sub(this.chassis.oldPosition) @@ -93,15 +85,13 @@ export default class Car this.sounds.engine.speed = this.movement.localSpeed.x this.sounds.engine.acceleration = this.controls.actions.up ? (this.controls.actions.boost ? 1 : 0.5) : 0 - if(this.movement.localAcceleration.x > 0.01) - { + if (this.movement.localAcceleration.x > 0.01) { this.sounds.play('screech') } }) } - setChassis() - { + setChassis() { this.chassis = {} this.chassis.offset = new THREE.Vector3(0, 0, - 0.28) this.chassis.object = this.objects.getConvertedMesh(this.models.chassis.scene.children) @@ -112,14 +102,12 @@ export default class Car this.shadows.add(this.chassis.object, { sizeX: 3, sizeY: 2, offsetZ: 0.2 }) // Time tick - this.time.on('tick', () => - { + this.time.on('tick', () => { // Save old position for movement calculation this.chassis.oldPosition = this.chassis.object.position.clone() // Update if mode physics - if(!this.transformControls.enabled) - { + if (!this.transformControls.enabled) { this.chassis.object.position.copy(this.physics.car.chassis.body.position).add(this.chassis.offset) this.chassis.object.quaternion.copy(this.physics.car.chassis.body.quaternion) } @@ -129,8 +117,7 @@ export default class Car }) } - setAntena() - { + setAntena() { this.antena = {} this.antena.speedStrength = 10 @@ -151,8 +138,7 @@ export default class Car this.antena.localPosition = new THREE.Vector2() // Time tick - this.time.on('tick', () => - { + this.time.on('tick', () => { const max = 1 const accelerationX = Math.min(Math.max(this.movement.acceleration.x, - max), max) const accelerationY = Math.min(Math.max(this.movement.acceleration.y, - max), max) @@ -183,8 +169,7 @@ export default class Car }) // Debug - if(this.debug) - { + if (this.debug) { const folder = this.debugFolder.addFolder('antena') folder.open() @@ -194,8 +179,7 @@ export default class Car } } - setBackLights() - { + setBackLights() { this.backLightsBrake = {} this.backLightsBrake.material = this.materials.pures.items.red.clone() @@ -203,8 +187,7 @@ export default class Car this.backLightsBrake.material.opacity = 0.5 this.backLightsBrake.object = this.objects.getConvertedMesh(this.models.backLightsBrake.scene.children) - for(const _child of this.backLightsBrake.object.children) - { + for (const _child of this.backLightsBrake.object.children) { _child.material = this.backLightsBrake.material } @@ -218,29 +201,25 @@ export default class Car this.backLightsReverse.material.opacity = 0.5 this.backLightsReverse.object = this.objects.getConvertedMesh(this.models.backLightsReverse.scene.children) - for(const _child of this.backLightsReverse.object.children) - { + for (const _child of this.backLightsReverse.object.children) { _child.material = this.backLightsReverse.material } this.chassis.object.add(this.backLightsReverse.object) // Time tick - this.time.on('tick', () => - { + this.time.on('tick', () => { this.backLightsBrake.material.opacity = this.physics.controls.actions.brake ? 1 : 0.5 this.backLightsReverse.material.opacity = this.physics.controls.actions.down ? 1 : 0.5 }) } - setWheels() - { + setWheels() { this.wheels = {} this.wheels.object = this.objects.getConvertedMesh(this.models.wheel.scene.children) this.wheels.items = [] - for(let i = 0; i < 4; i++) - { + for (let i = 0; i < 4; i++) { const object = this.wheels.object.clone() this.wheels.items.push(object) @@ -248,12 +227,9 @@ export default class Car } // Time tick - this.time.on('tick', () => - { - if(!this.transformControls.enabled) - { - for(const _wheelKey in this.physics.car.wheels.bodies) - { + this.time.on('tick', () => { + if (!this.transformControls.enabled) { + for (const _wheelKey in this.physics.car.wheels.bodies) { const wheelBody = this.physics.car.wheels.bodies[_wheelKey] const wheelObject = this.wheels.items[_wheelKey] @@ -264,59 +240,47 @@ export default class Car }) } - setTransformControls() - { + setTransformControls() { this.transformControls = new TransformControls(this.camera.instance, this.renderer.domElement) this.transformControls.size = 0.5 this.transformControls.attach(this.chassis.object) this.transformControls.enabled = false this.transformControls.visible = this.transformControls.enabled - document.addEventListener('keydown', (_event) => - { - if(this.mode === 'transformControls') - { - if(_event.key === 'r') - { + document.addEventListener('keydown', (_event) => { + if (this.mode === 'transformControls') { + if (_event.key === 'r') { this.transformControls.setMode('rotate') } - else if(_event.key === 'g') - { + else if (_event.key === 'g') { this.transformControls.setMode('translate') } } }) - this.transformControls.addEventListener('dragging-changed', (_event) => - { + this.transformControls.addEventListener('dragging-changed', (_event) => { this.camera.orbitControls.enabled = !_event.value }) this.container.add(this.transformControls) - if(this.debug) - { + if (this.debug) { const folder = this.debugFolder.addFolder('controls') folder.open() - folder.add(this.transformControls, 'enabled').onChange(() => - { + folder.add(this.transformControls, 'enabled').onChange(() => { this.transformControls.visible = this.transformControls.enabled }) } } - setShootingBall() - { - if(!this.config.cyberTruck) - { + setShootingBall() { + if (!this.config.cyberTruck) { return } - window.addEventListener('keydown', (_event) => - { - if(_event.key === 'b') - { + window.addEventListener('keydown', (_event) => { + if (_event.key === 'b') { const angle = Math.random() * Math.PI * 2 const distance = 10 const x = this.position.x + Math.cos(angle) * distance @@ -343,20 +307,16 @@ export default class Car }) } - setKlaxon() - { + setKlaxon() { this.klaxon = {} this.klaxon.waitDuration = 150 this.klaxon.can = true - window.addEventListener('keydown', (_event) => - { + window.addEventListener('keydown', (_event) => { // Play horn sound - if(_event.key === 'h' && this.klaxon.can) - { + if (_event.key === 'h' && this.klaxon.can) { this.klaxon.can = false - window.setTimeout(() => - { + window.setTimeout(() => { this.klaxon.can = true }, this.klaxon.waitDuration) @@ -365,8 +325,7 @@ export default class Car } // Rain horns - if(_event.key === 'k') - { + if (_event.key === 'k') { const x = this.position.x + (Math.random() - 0.5) * 3 const y = this.position.y + (Math.random() - 0.5) * 3 const z = 6 + 2 * Math.random() diff --git a/src/javascript/World/Floor.js b/src/javascript/World/Floor.js index 75f5b9c..ae7c8e2 100644 --- a/src/javascript/World/Floor.js +++ b/src/javascript/World/Floor.js @@ -1,10 +1,8 @@ import * as THREE from 'three' import FloorMaterial from '../Materials/Floor.js' -export default class Floor -{ - constructor(_options) - { +export default class Floor { + constructor(_options) { // Options this.debug = _options.debug @@ -15,18 +13,17 @@ export default class Floor // Geometry this.geometry = new THREE.PlaneBufferGeometry(2, 2, 10, 10) - // Colors + // Couleurs du sol this.colors = {} - this.colors.topLeft = '#f5883c' - this.colors.topRight = '#ff9043' - this.colors.bottomRight = '#fccf92' - this.colors.bottomLeft = '#f5aa58' + this.colors.topLeft = '#05C4FC' + this.colors.topRight = '#05C4FC' + this.colors.bottomRight = '#4FF3A1' + this.colors.bottomLeft = '#4FF3A1' // Material this.material = new FloorMaterial() - this.updateMaterial = () => - { + this.updateMaterial = () => { const topLeft = new THREE.Color(this.colors.topLeft) const topRight = new THREE.Color(this.colors.topRight) const bottomRight = new THREE.Color(this.colors.bottomRight) @@ -56,8 +53,7 @@ export default class Floor this.container.add(this.mesh) // Debug - if(this.debug) - { + if (this.debug) { const folder = this.debug.addFolder('floor') // folder.open() diff --git a/src/javascript/World/Sections/InformationSection.js b/src/javascript/World/Sections/InformationSection.js index 8881871..0370de9 100644 --- a/src/javascript/World/Sections/InformationSection.js +++ b/src/javascript/World/Sections/InformationSection.js @@ -1,9 +1,7 @@ import * as THREE from 'three' -export default class InformationSection -{ - constructor(_options) - { +export default class InformationSection { + constructor(_options) { // Options this.time = _options.time this.resources = _options.resources @@ -25,8 +23,7 @@ export default class InformationSection this.setTiles() } - setStatic() - { + setStatic() { this.objects.add({ base: this.resources.items.informationStaticBase.scene, collision: this.resources.items.informationStaticCollision.scene, @@ -36,8 +33,7 @@ export default class InformationSection }) } - setBaguettes() - { + setBaguettes() { this.baguettes = {} this.baguettes.x = - 4 @@ -67,8 +63,7 @@ export default class InformationSection }) } - setLinks() - { + setLinks() { // Set up this.links = {} this.links.x = 1.95 @@ -89,27 +84,26 @@ export default class InformationSection // Options this.links.options = [ { - href: 'https://twitter.com/bruno_simon/', - labelTexture: this.resources.items.informationContactTwitterLabelTexture + href: 'https://lucasmoramarco.fr', + labelTexture: this.resources.items.informationModeSimpleLabelTexture }, { - href: 'https://github.com/brunosimon/', - labelTexture: this.resources.items.informationContactGithubLabelTexture + href: 'https://designer.lucasmoramarco.fr', + labelTexture: this.resources.items.informationModeDesignerLabelTexture }, { - href: 'https://www.linkedin.com/in/simonbruno77/', + href: 'https://www.linkedin.com/in/lucas-moramarco/', labelTexture: this.resources.items.informationContactLinkedinLabelTexture }, { - href: 'mailto:simon.bruno.77@gmail.com', + href: 'mailto:moramarcolucas@gmail.com', labelTexture: this.resources.items.informationContactMailLabelTexture } ] // Create each link let i = 0 - for(const _option of this.links.options) - { + for (const _option of this.links.options) { // Set up const item = {} item.x = this.x + this.links.x + this.links.distanceBetween * i @@ -121,8 +115,7 @@ export default class InformationSection position: new THREE.Vector2(item.x, item.y), halfExtents: new THREE.Vector2(this.links.halfExtents.x, this.links.halfExtents.y) }) - item.area.on('interact', () => - { + item.area.on('interact', () => { window.open(_option.href, '_blank') }) @@ -146,8 +139,7 @@ export default class InformationSection } } - setActivities() - { + setActivities() { // Set up this.activities = {} this.activities.x = this.x + 0 @@ -174,8 +166,7 @@ export default class InformationSection this.container.add(this.activities.mesh) } - setTiles() - { + setTiles() { this.tiles.add({ start: new THREE.Vector2(this.x - 1.2, this.y + 13), delta: new THREE.Vector2(0, - 20) diff --git a/src/javascript/World/Sections/IntroSection.js b/src/javascript/World/Sections/IntroSection.js index 2cf6f9c..a80df9d 100644 --- a/src/javascript/World/Sections/IntroSection.js +++ b/src/javascript/World/Sections/IntroSection.js @@ -1,9 +1,7 @@ import * as THREE from 'three' -export default class IntroSection -{ - constructor(_options) - { +export default class IntroSection { + constructor(_options) { // Options this.config = _options.config this.time = _options.time @@ -24,13 +22,12 @@ export default class IntroSection this.setStatic() this.setInstructions() this.setOtherInstructions() - this.setTitles() + // this.setTitles() this.setTiles() this.setDikes() } - setStatic() - { + setStatic() { this.objects.add({ base: this.resources.items.introStaticBase.scene, collision: this.resources.items.introStaticCollision.scene, @@ -40,8 +37,7 @@ export default class IntroSection }) } - setInstructions() - { + setInstructions() { this.instructions = {} /** @@ -63,8 +59,7 @@ export default class IntroSection this.instructions.arrows.label.mesh = new THREE.Mesh(this.instructions.arrows.label.geometry, this.instructions.arrows.label.material) this.container.add(this.instructions.arrows.label.mesh) - if(!this.config.touch) - { + if (!this.config.touch) { // Keys this.instructions.arrows.up = this.objects.add({ base: this.resources.items.introArrowKeyBase.scene, @@ -109,10 +104,8 @@ export default class IntroSection } } - setOtherInstructions() - { - if(this.config.touch) - { + setOtherInstructions() { + if (this.config.touch) { return } @@ -157,134 +150,131 @@ export default class IntroSection }) } - setTitles() - { - // Title - this.objects.add({ - base: this.resources.items.introBBase.scene, - collision: this.resources.items.introBCollision.scene, - offset: new THREE.Vector3(0, 0, 0), - rotation: new THREE.Euler(0, 0, 0), - shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, - mass: 1.5, - soundName: 'brick' - }) - this.objects.add({ - base: this.resources.items.introRBase.scene, - collision: this.resources.items.introRCollision.scene, - offset: new THREE.Vector3(0, 0, 0), - rotation: new THREE.Euler(0, 0, 0), - shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, - mass: 1.5, - soundName: 'brick' - }) - this.objects.add({ - base: this.resources.items.introUBase.scene, - collision: this.resources.items.introUCollision.scene, - offset: new THREE.Vector3(0, 0, 0), - rotation: new THREE.Euler(0, 0, 0), - shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, - mass: 1.5, - soundName: 'brick' - }) - this.objects.add({ - base: this.resources.items.introNBase.scene, - collision: this.resources.items.introNCollision.scene, - offset: new THREE.Vector3(0, 0, 0), - rotation: new THREE.Euler(0, 0, 0), - duplicated: true, - shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, - mass: 1.5, - soundName: 'brick' - }) - this.objects.add({ - base: this.resources.items.introOBase.scene, - collision: this.resources.items.introOCollision.scene, - offset: new THREE.Vector3(0, 0, 0), - rotation: new THREE.Euler(0, 0, 0), - duplicated: true, - shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, - mass: 1.5, - soundName: 'brick' - }) - this.objects.add({ - base: this.resources.items.introSBase.scene, - collision: this.resources.items.introSCollision.scene, - offset: new THREE.Vector3(0, 0, 0), - rotation: new THREE.Euler(0, 0, 0), - shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, - mass: 1.5, - soundName: 'brick' - }) - this.objects.add({ - base: this.resources.items.introIBase.scene, - collision: this.resources.items.introICollision.scene, - offset: new THREE.Vector3(0, 0, 0), - rotation: new THREE.Euler(0, 0, 0), - shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, - mass: 1.5, - soundName: 'brick' - }) - this.objects.add({ - base: this.resources.items.introMBase.scene, - collision: this.resources.items.introMCollision.scene, - offset: new THREE.Vector3(0, 0, 0), - rotation: new THREE.Euler(0, 0, 0), - shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, - mass: 1.5, - soundName: 'brick' - }) - this.objects.add({ - base: this.resources.items.introOBase.scene, - collision: this.resources.items.introOCollision.scene, - offset: new THREE.Vector3(3.95, 0, 0), - rotation: new THREE.Euler(0, 0, 0), - duplicated: true, - shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, - mass: 1.5, - soundName: 'brick' - }) - this.objects.add({ - base: this.resources.items.introNBase.scene, - collision: this.resources.items.introNCollision.scene, - offset: new THREE.Vector3(5.85, 0, 0), - rotation: new THREE.Euler(0, 0, 0), - duplicated: true, - shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, - mass: 1.5, - soundName: 'brick' - }) - this.objects.add({ - base: this.resources.items.introCreativeBase.scene, - collision: this.resources.items.introCreativeCollision.scene, - offset: new THREE.Vector3(0, 0, 0), - rotation: new THREE.Euler(0, 0, 0.25), - shadow: { sizeX: 5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.3 }, - mass: 1.5, - sleep: false, - soundName: 'brick' - }) - this.objects.add({ - base: this.resources.items.introDevBase.scene, - collision: this.resources.items.introDevCollision.scene, - offset: new THREE.Vector3(0, 0, 0), - rotation: new THREE.Euler(0, 0, 0), - shadow: { sizeX: 2.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.3 }, - mass: 1.5, - soundName: 'brick' - }) - } - - setTiles() - { + // setTitles() { + // Title + // this.objects.add({ + // base: this.resources.items.introBBase.scene, + // collision: this.resources.items.introBCollision.scene, + // offset: new THREE.Vector3(0, 0, 0), + // rotation: new THREE.Euler(0, 0, 0), + // shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, + // mass: 1.5, + // soundName: 'brick' + // }) + // this.objects.add({ + // base: this.resources.items.introRBase.scene, + // collision: this.resources.items.introRCollision.scene, + // offset: new THREE.Vector3(0, 0, 0), + // rotation: new THREE.Euler(0, 0, 0), + // shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, + // mass: 1.5, + // soundName: 'brick' + // }) + // this.objects.add({ + // base: this.resources.items.introUBase.scene, + // collision: this.resources.items.introUCollision.scene, + // offset: new THREE.Vector3(0, 0, 0), + // rotation: new THREE.Euler(0, 0, 0), + // shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, + // mass: 1.5, + // soundName: 'brick' + // }) + // this.objects.add({ + // base: this.resources.items.introNBase.scene, + // collision: this.resources.items.introNCollision.scene, + // offset: new THREE.Vector3(0, 0, 0), + // rotation: new THREE.Euler(0, 0, 0), + // duplicated: true, + // shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, + // mass: 1.5, + // soundName: 'brick' + // }) + // this.objects.add({ + // base: this.resources.items.introOBase.scene, + // collision: this.resources.items.introOCollision.scene, + // offset: new THREE.Vector3(0, 0, 0), + // rotation: new THREE.Euler(0, 0, 0), + // duplicated: true, + // shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, + // mass: 1.5, + // soundName: 'brick' + // }) + // this.objects.add({ + // base: this.resources.items.introSBase.scene, + // collision: this.resources.items.introSCollision.scene, + // offset: new THREE.Vector3(0, 0, 0), + // rotation: new THREE.Euler(0, 0, 0), + // shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, + // mass: 1.5, + // soundName: 'brick' + // }) + // this.objects.add({ + // base: this.resources.items.introIBase.scene, + // collision: this.resources.items.introICollision.scene, + // offset: new THREE.Vector3(0, 0, 0), + // rotation: new THREE.Euler(0, 0, 0), + // shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, + // mass: 1.5, + // soundName: 'brick' + // }) + // this.objects.add({ + // base: this.resources.items.introMBase.scene, + // collision: this.resources.items.introMCollision.scene, + // offset: new THREE.Vector3(0, 0, 0), + // rotation: new THREE.Euler(0, 0, 0), + // shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, + // mass: 1.5, + // soundName: 'brick' + // }) + // this.objects.add({ + // base: this.resources.items.introOBase.scene, + // collision: this.resources.items.introOCollision.scene, + // offset: new THREE.Vector3(3.95, 0, 0), + // rotation: new THREE.Euler(0, 0, 0), + // duplicated: true, + // shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, + // mass: 1.5, + // soundName: 'brick' + // }) + // this.objects.add({ + // base: this.resources.items.introNBase.scene, + // collision: this.resources.items.introNCollision.scene, + // offset: new THREE.Vector3(5.85, 0, 0), + // rotation: new THREE.Euler(0, 0, 0), + // duplicated: true, + // shadow: { sizeX: 1.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.4 }, + // mass: 1.5, + // soundName: 'brick' + // }) + // this.objects.add({ + // base: this.resources.items.introCreativeBase.scene, + // collision: this.resources.items.introCreativeCollision.scene, + // offset: new THREE.Vector3(0, 0, 0), + // rotation: new THREE.Euler(0, 0, 0.25), + // shadow: { sizeX: 5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.3 }, + // mass: 1.5, + // sleep: false, + // soundName: 'brick' + // }) + // this.objects.add({ + // base: this.resources.items.introDevBase.scene, + // collision: this.resources.items.introDevCollision.scene, + // offset: new THREE.Vector3(0, 0, 0), + // rotation: new THREE.Euler(0, 0, 0), + // shadow: { sizeX: 2.5, sizeY: 1.5, offsetZ: - 0.6, alpha: 0.3 }, + // mass: 1.5, + // soundName: 'brick' + // }) + // } + + setTiles() { this.tiles.add({ start: new THREE.Vector2(0, - 4.5), delta: new THREE.Vector2(0, - 4.5) }) } - setDikes() - { + setDikes() { this.dikes = {} this.dikes.brickOptions = { base: this.resources.items.brickBase.scene, @@ -421,8 +411,7 @@ export default class IntroSection } }) - if(!this.config.touch) - { + if (!this.config.touch) { this.walls.add({ object: { diff --git a/src/javascript/World/Sections/ProjectsSection.js b/src/javascript/World/Sections/ProjectsSection.js index 612f79b..3a0a84a 100644 --- a/src/javascript/World/Sections/ProjectsSection.js +++ b/src/javascript/World/Sections/ProjectsSection.js @@ -2,52 +2,59 @@ import * as THREE from 'three' import Project from './Project' import TweenLite from 'gsap/TweenLite' -import projectsThreejsJourneySlideASources from '../../../models/projects/threejsJourney/slideA.jpg' -import projectsThreejsJourneySlideBSources from '../../../models/projects/threejsJourney/slideB.jpg' -import projectsThreejsJourneySlideCSources from '../../../models/projects/threejsJourney/slideC.jpg' -import projectsThreejsJourneySlideDSources from '../../../models/projects/threejsJourney/slideD.jpg' +// projet 1 : noffta +import projectsnofftaSlideASources from '../../../models/projects/noffta/slideA.jpg' +import projectsnofftaSlideBSources from '../../../models/projects/noffta/slideB.jpg' +import projectsnofftaSlideCSources from '../../../models/projects/noffta/slideC.jpg' +// import projectsThreejsJourneySlideASources from '../../../models/projects/threejsJourney/slideA.jpg' +// import projectsThreejsJourneySlideBSources from '../../../models/projects/threejsJourney/slideB.jpg' +// import projectsThreejsJourneySlideCSources from '../../../models/projects/threejsJourney/slideC.jpg' +// import projectsThreejsJourneySlideDSources from '../../../models/projects/threejsJourney/slideD.jpg' -import projectsMadboxSlideASources from '../../../models/projects/madbox/slideA.jpg' -import projectsMadboxSlideBSources from '../../../models/projects/madbox/slideB.jpg' -import projectsMadboxSlideCSources from '../../../models/projects/madbox/slideC.jpg' +// projet 2 : chiron +import projectschironSlideASources from '../../../models/projects/chiron/slideA.jpg' +import projectschironSlideBSources from '../../../models/projects/chiron/slideB.jpg' +import projectschironSlideCSources from '../../../models/projects/chiron/slideC.jpg' -import projectsScoutSlideASources from '../../../models/projects/scout/slideA.jpg' -import projectsScoutSlideBSources from '../../../models/projects/scout/slideB.jpg' -import projectsScoutSlideCSources from '../../../models/projects/scout/slideC.jpg' +// projet 3 : robrun +import projectsrobrunSlideASources from '../../../models/projects/robrun/slideA.jpg' +import projectsrobrunSlideBSources from '../../../models/projects/robrun/slideB.jpg' +import projectsrobrunSlideCSources from '../../../models/projects/robrun/slideC.jpg' -import projectsChartogneSlideASources from '../../../models/projects/chartogne/slideA.jpg' -import projectsChartogneSlideBSources from '../../../models/projects/chartogne/slideB.jpg' -import projectsChartogneSlideCSources from '../../../models/projects/chartogne/slideC.jpg' +// projet 4 : updayme +import projectsupdaymeSlideASources from '../../../models/projects/updayme/slideA.jpg' +import projectsupdaymeSlideBSources from '../../../models/projects/updayme/slideB.jpg' +import projectsupdaymeSlideCSources from '../../../models/projects/updayme/slideC.jpg' -import projectsZenlySlideASources from '../../../models/projects/zenly/slideA.jpg' -import projectsZenlySlideBSources from '../../../models/projects/zenly/slideB.jpg' -import projectsZenlySlideCSources from '../../../models/projects/zenly/slideC.jpg' +// projet 5 : karma +import projectskarmaSlideASources from '../../../models/projects/karma/slideA.jpg' +import projectskarmaSlideBSources from '../../../models/projects/karma/slideB.jpg' +import projectskarmaSlideCSources from '../../../models/projects/karma/slideC.jpg' -import projectsCitrixRedbullSlideASources from '../../../models/projects/citrixRedbull/slideA.jpg' -import projectsCitrixRedbullSlideBSources from '../../../models/projects/citrixRedbull/slideB.jpg' -import projectsCitrixRedbullSlideCSources from '../../../models/projects/citrixRedbull/slideC.jpg' +// projet 6 : osaka +import projectsosakaSlideASources from '../../../models/projects/osaka/slideA.jpg' +import projectsosakaSlideBSources from '../../../models/projects/osaka/slideB.jpg' +import projectsosakaSlideCSources from '../../../models/projects/osaka/slideC.jpg' -import projectsPriorHoldingsSlideASources from '../../../models/projects/priorHoldings/slideA.jpg' -import projectsPriorHoldingsSlideBSources from '../../../models/projects/priorHoldings/slideB.jpg' -import projectsPriorHoldingsSlideCSources from '../../../models/projects/priorHoldings/slideC.jpg' +// import projectsPriorHoldingsSlideASources from '../../../models/projects/priorHoldings/slideA.jpg' +// import projectsPriorHoldingsSlideBSources from '../../../models/projects/priorHoldings/slideB.jpg' +// import projectsPriorHoldingsSlideCSources from '../../../models/projects/priorHoldings/slideC.jpg' -import projectsOranoSlideASources from '../../../models/projects/orano/slideA.jpg' -import projectsOranoSlideBSources from '../../../models/projects/orano/slideB.jpg' -import projectsOranoSlideCSources from '../../../models/projects/orano/slideC.jpg' +// import projectsOranoSlideASources from '../../../models/projects/orano/slideA.jpg' +// import projectsOranoSlideBSources from '../../../models/projects/orano/slideB.jpg' +// import projectsOranoSlideCSources from '../../../models/projects/orano/slideC.jpg' // import projectsGleecChatSlideASources from '../../../models/projects/gleecChat/slideA.jpg' // import projectsGleecChatSlideBSources from '../../../models/projects/gleecChat/slideB.jpg' // import projectsGleecChatSlideCSources from '../../../models/projects/gleecChat/slideC.jpg' // import projectsGleecChatSlideDSources from '../../../models/projects/gleecChat/slideD.jpg' -import projectsKepplerSlideASources from '../../../models/projects/keppler/slideA.jpg' -import projectsKepplerSlideBSources from '../../../models/projects/keppler/slideB.jpg' -import projectsKepplerSlideCSources from '../../../models/projects/keppler/slideC.jpg' +// import projectsKepplerSlideASources from '../../../models/projects/keppler/slideA.jpg' +// import projectsKepplerSlideBSources from '../../../models/projects/keppler/slideB.jpg' +// import projectsKepplerSlideCSources from '../../../models/projects/keppler/slideC.jpg' -export default class ProjectsSection -{ - constructor(_options) - { +export default class ProjectsSection { + constructor(_options) { // Options this.time = _options.time this.resources = _options.resources @@ -62,8 +69,7 @@ export default class ProjectsSection this.y = _options.y // Debug - if(this.debug) - { + if (this.debug) { this.debugFolder = this.debug.addFolder('projects') this.debugFolder.open() } @@ -85,20 +91,17 @@ export default class ProjectsSection this.setZone() // Add all project from the list - for(const _options of this.list) - { + for (const _options of this.list) { this.add(_options) } } - setGeometries() - { + setGeometries() { this.geometries = {} this.geometries.floor = new THREE.PlaneBufferGeometry(16, 8) } - setMeshes() - { + setMeshes() { this.meshes = {} // this.meshes.boardStructure = this.objects.getConvertedMesh(this.resources.items.projectsBoardStructure.scene.children, { floorShadowTexture: this.resources.items.projectsBoardStructureFloorShadowTexture }) @@ -109,47 +112,41 @@ export default class ProjectsSection this.meshes.areaLabel.matrixAutoUpdate = false } - setList() - { + setList() { this.list = [ { - name: 'Three.js Journey', + name: 'Noffta', imageSources: - [ - projectsThreejsJourneySlideASources, - projectsThreejsJourneySlideBSources, - projectsThreejsJourneySlideCSources, - projectsThreejsJourneySlideDSources - ], + [ + projectsnofftaSlideASources, + projectsnofftaSlideBSources, + projectsnofftaSlideCSources + ], floorTexture: this.resources.items.projectsThreejsJourneyFloorTexture, link: { - href: 'https://threejs-journey.com?c=p3', + href: 'https://lucasmoramarco.fr/noffta', x: - 4.8, - y: - 3, + y: - 4, halfExtents: { x: 3.2, y: 1.5 } - }, - distinctions: - [ - { type: 'fwa', x: 3.95, y: 4.15 } - ] + } }, { - name: 'Madbox', + name: 'chiron', imageSources: - [ - projectsMadboxSlideASources, - projectsMadboxSlideBSources, - projectsMadboxSlideCSources - ], - floorTexture: this.resources.items.projectsMadboxFloorTexture, + [ + projectschironSlideASources, + projectschironSlideBSources, + projectschironSlideCSources + ], + floorTexture: this.resources.items.projectschironFloorTexture, link: { - href: 'https://madbox.io', + href: 'https://lucasmoramarco.fr/chiron', x: - 4.8, y: - 4, halfExtents: @@ -157,27 +154,22 @@ export default class ProjectsSection x: 3.2, y: 1.5 } - }, - distinctions: - [ - { type: 'awwwards', x: 3.95, y: 4.15 }, - { type: 'fwa', x: 5.6, y: 4.15 } - ] + } }, { - name: 'Scout', + name: 'robrun', imageSources: - [ - projectsScoutSlideASources, - projectsScoutSlideBSources, - projectsScoutSlideCSources - ], - floorTexture: this.resources.items.projectsScoutFloorTexture, + [ + projectsrobrunSlideASources, + projectsrobrunSlideBSources, + projectsrobrunSlideCSources + ], + floorTexture: this.resources.items.projectsrobrunFloorTexture, link: { - href: 'https://fromscout.com', + href: 'https://lucasmoramarco.fr/robrun', x: - 4.8, - y: - 2, + y: - 4, halfExtents: { x: 3.2, @@ -185,21 +177,21 @@ export default class ProjectsSection } }, distinctions: - [ - ] + [ + ] }, { - name: 'Chartogne Taillet', + name: 'updayme', imageSources: - [ - projectsChartogneSlideASources, - projectsChartogneSlideBSources, - projectsChartogneSlideCSources - ], - floorTexture: this.resources.items.projectsChartogneFloorTexture, + [ + projectsupdaymeSlideASources, + projectsupdaymeSlideBSources, + projectsupdaymeSlideCSources + ], + floorTexture: this.resources.items.projectsupdaymeFloorTexture, link: { - href: 'https://chartogne-taillet.com', + href: 'https://lucasmoramarco.fr/updayme', x: - 4.8, y: - 3.3, halfExtents: @@ -207,26 +199,20 @@ export default class ProjectsSection x: 3.2, y: 1.5 } - }, - distinctions: - [ - { type: 'awwwards', x: 3.95, y: 4.15 }, - { type: 'fwa', x: 5.6, y: 4.15 }, - { type: 'cssda', x: 7.2, y: 4.15 } - ] + } }, { - name: 'Zenly', + name: 'karma', imageSources: - [ - projectsZenlySlideASources, - projectsZenlySlideBSources, - projectsZenlySlideCSources - ], - floorTexture: this.resources.items.projectsZenlyFloorTexture, + [ + projectskarmaSlideASources, + projectskarmaSlideBSources, + projectskarmaSlideCSources + ], + floorTexture: this.resources.items.projectskarmaFloorTexture, link: { - href: 'https://zen.ly', + href: 'https://lucasmoramarco.fr/karma', x: - 4.8, y: - 4.2, halfExtents: @@ -234,80 +220,74 @@ export default class ProjectsSection x: 3.2, y: 1.5 } - }, - distinctions: - [ - { type: 'awwwards', x: 3.95, y: 4.15 }, - { type: 'fwa', x: 5.6, y: 4.15 }, - { type: 'cssda', x: 7.2, y: 4.15 } - ] - }, - { - name: 'priorHoldings', - imageSources: - [ - projectsPriorHoldingsSlideASources, - projectsPriorHoldingsSlideBSources, - projectsPriorHoldingsSlideCSources - ], - floorTexture: this.resources.items.projectsPriorHoldingsFloorTexture, - link: - { - href: 'https://prior.co.jp/discover/', - x: - 4.8, - y: - 3, - halfExtents: - { - x: 3.2, - y: 1.5 - } - }, - distinctions: - [ - { type: 'awwwards', x: 3.95, y: 4.15 }, - { type: 'fwa', x: 5.6, y: 4.15 }, - { type: 'cssda', x: 7.2, y: 4.15 } - ] - }, - { - name: 'orano', - imageSources: - [ - projectsOranoSlideASources, - projectsOranoSlideBSources, - projectsOranoSlideCSources - ], - floorTexture: this.resources.items.projectsOranoFloorTexture, - link: - { - href: 'https://orano.imm-g-prod.com/experience/innovation/en', - x: - 4.8, - y: - 3.4, - halfExtents: - { - x: 3.2, - y: 1.5 - } - }, - distinctions: - [ - { type: 'awwwards', x: 3.95, y: 4.15 }, - { type: 'fwa', x: 5.6, y: 4.15 }, - { type: 'cssda', x: 7.2, y: 4.15 } - ] + } }, + // { + // name: 'priorHoldings', + // imageSources: + // [ + // projectsPriorHoldingsSlideASources, + // projectsPriorHoldingsSlideBSources, + // projectsPriorHoldingsSlideCSources + // ], + // floorTexture: this.resources.items.projectsPriorHoldingsFloorTexture, + // link: + // { + // href: 'https://prior.co.jp/discover/', + // x: - 4.8, + // y: - 3, + // halfExtents: + // { + // x: 3.2, + // y: 1.5 + // } + // }, + // distinctions: + // [ + // { type: 'awwwards', x: 3.95, y: 4.15 }, + // { type: 'fwa', x: 5.6, y: 4.15 }, + // { type: 'cssda', x: 7.2, y: 4.15 } + // ] + // }, + // { + // name: 'orano', + // imageSources: + // [ + // projectsOranoSlideASources, + // projectsOranoSlideBSources, + // projectsOranoSlideCSources + // ], + // floorTexture: this.resources.items.projectsOranoFloorTexture, + // link: + // { + // href: 'https://orano.imm-g-prod.com/experience/innovation/en', + // x: - 4.8, + // y: - 3.4, + // halfExtents: + // { + // x: 3.2, + // y: 1.5 + // } + // }, + // distinctions: + // [ + // { type: 'awwwards', x: 3.95, y: 4.15 }, + // { type: 'fwa', x: 5.6, y: 4.15 }, + // { type: 'cssda', x: 7.2, y: 4.15 } + // ] + // }, { - name: 'citrixRedbull', + name: 'osaka', imageSources: - [ - projectsCitrixRedbullSlideASources, - projectsCitrixRedbullSlideBSources, - projectsCitrixRedbullSlideCSources - ], - floorTexture: this.resources.items.projectsCitrixRedbullFloorTexture, + [ + projectsosakaSlideASources, + projectsosakaSlideBSources, + projectsosakaSlideCSources + ], + floorTexture: this.resources.items.projectsosakaFloorTexture, link: { - href: 'https://thenewmobileworkforce.imm-g-prod.com/', + href: 'https://lucasmoramarco.fr/osaka', x: - 4.8, y: - 4.4, halfExtents: @@ -315,14 +295,8 @@ export default class ProjectsSection x: 3.2, y: 1.5 } - }, - distinctions: - [ - { type: 'awwwards', x: 3.95, y: 4.15 }, - { type: 'fwa', x: 5.6, y: 4.15 }, - { type: 'cssda', x: 7.2, y: 4.15 } - ] - }, + } + } // { // name: 'gleecChat', // imageSources: @@ -351,33 +325,32 @@ export default class ProjectsSection // { type: 'cssda', x: 7.2, y: 4.15 } // ] // }, - { - name: 'keppler', - imageSources: - [ - projectsKepplerSlideASources, - projectsKepplerSlideBSources, - projectsKepplerSlideCSources - ], - floorTexture: this.resources.items.projectsKepplerFloorTexture, - link: - { - href: 'https://brunosimon.github.io/keppler/', - x: 2.75, - y: - 1.1, - halfExtents: - { - x: 3.2, - y: 1.5 - } - }, - distinctions: [] - } + // { + // name: 'keppler', + // imageSources: + // [ + // projectsKepplerSlideASources, + // projectsKepplerSlideBSources, + // projectsKepplerSlideCSources + // ], + // floorTexture: this.resources.items.projectsKepplerFloorTexture, + // link: + // { + // href: 'https://lucasmoramarco.fr', + // x: 2.75, + // y: - 1.1, + // halfExtents: + // { + // x: 3.2, + // y: 1.5 + // } + // }, + // distinctions: [] + // } ] } - setZone() - { + setZone() { const totalWidth = this.list.length * (this.interDistance / 2) const zone = this.zones.add({ @@ -386,27 +359,23 @@ export default class ProjectsSection data: { cameraAngle: 'projects' } }) - zone.on('in', (_data) => - { + zone.on('in', (_data) => { this.camera.angle.set(_data.cameraAngle) TweenLite.to(this.passes.horizontalBlurPass.material.uniforms.uStrength.value, 2, { x: 0 }) TweenLite.to(this.passes.verticalBlurPass.material.uniforms.uStrength.value, 2, { y: 0 }) }) - zone.on('out', () => - { + zone.on('out', () => { this.camera.angle.set('default') TweenLite.to(this.passes.horizontalBlurPass.material.uniforms.uStrength.value, 2, { x: this.passes.horizontalBlurPass.strength }) TweenLite.to(this.passes.verticalBlurPass.material.uniforms.uStrength.value, 2, { y: this.passes.verticalBlurPass.strength }) }) } - add(_options) - { + add(_options) { const x = this.x + this.items.length * this.interDistance let y = this.y - if(this.items.length > 0) - { + if (this.items.length > 0) { y += (Math.random() - 0.5) * this.positionRandomess } @@ -427,8 +396,7 @@ export default class ProjectsSection this.container.add(project.container) // Add tiles - if(this.items.length >= 1) - { + if (this.items.length >= 1) { const previousProject = this.items[this.items.length - 1] const start = new THREE.Vector2(previousProject.x + this.projectHalfWidth, previousProject.y) const end = new THREE.Vector2(project.x - this.projectHalfWidth, project.y) diff --git a/src/models/information/static/activities.png b/src/models/information/static/activities.png index 1379127..ac24904 100644 Binary files a/src/models/information/static/activities.png and b/src/models/information/static/activities.png differ diff --git a/src/models/information/static/contactLinkedinLabel.png b/src/models/information/static/contactLinkedinLabel.png old mode 100755 new mode 100644 index e6a8c88..b15e9ac Binary files a/src/models/information/static/contactLinkedinLabel.png and b/src/models/information/static/contactLinkedinLabel.png differ diff --git a/src/models/information/static/contactMailLabel.png b/src/models/information/static/contactMailLabel.png old mode 100755 new mode 100644 index 553cfc9..9ca7d2a Binary files a/src/models/information/static/contactMailLabel.png and b/src/models/information/static/contactMailLabel.png differ diff --git a/src/models/information/static/contactTwitterLabel.png b/src/models/information/static/contactTwitterLabel.png old mode 100755 new mode 100644 index cbe72e5..f8fb65b Binary files a/src/models/information/static/contactTwitterLabel.png and b/src/models/information/static/contactTwitterLabel.png differ diff --git a/src/models/information/static/modeDesignerLabel.png b/src/models/information/static/modeDesignerLabel.png new file mode 100644 index 0000000..4aae9a8 Binary files /dev/null and b/src/models/information/static/modeDesignerLabel.png differ diff --git a/src/models/information/static/modeSimpleLabel.png b/src/models/information/static/modeSimpleLabel.png new file mode 100644 index 0000000..197f278 Binary files /dev/null and b/src/models/information/static/modeSimpleLabel.png differ diff --git a/src/models/intro/b/base_data.bin b/src/models/intro/b/base_data.bin new file mode 100644 index 0000000..1fcc5c7 Binary files /dev/null and b/src/models/intro/b/base_data.bin differ diff --git a/src/models/projects/chartogne/floorTexture.png b/src/models/projects/chartogne/floorTexture.png deleted file mode 100644 index 4a26714..0000000 Binary files a/src/models/projects/chartogne/floorTexture.png and /dev/null differ diff --git a/src/models/projects/chartogne/slideA.jpg b/src/models/projects/chartogne/slideA.jpg deleted file mode 100644 index 59b98a0..0000000 Binary files a/src/models/projects/chartogne/slideA.jpg and /dev/null differ diff --git a/src/models/projects/chartogne/slideB.jpg b/src/models/projects/chartogne/slideB.jpg deleted file mode 100644 index b443ef5..0000000 Binary files a/src/models/projects/chartogne/slideB.jpg and /dev/null differ diff --git a/src/models/projects/chartogne/slideC.jpg b/src/models/projects/chartogne/slideC.jpg deleted file mode 100644 index edaaa28..0000000 Binary files a/src/models/projects/chartogne/slideC.jpg and /dev/null differ diff --git a/src/models/projects/chiron/floorTexture.png b/src/models/projects/chiron/floorTexture.png new file mode 100644 index 0000000..0c04bb5 Binary files /dev/null and b/src/models/projects/chiron/floorTexture.png differ diff --git a/src/models/projects/chiron/slideA.jpg b/src/models/projects/chiron/slideA.jpg new file mode 100644 index 0000000..a65aa01 Binary files /dev/null and b/src/models/projects/chiron/slideA.jpg differ diff --git a/src/models/projects/chiron/slideB.jpg b/src/models/projects/chiron/slideB.jpg new file mode 100644 index 0000000..a65aa01 Binary files /dev/null and b/src/models/projects/chiron/slideB.jpg differ diff --git a/src/models/projects/chiron/slideC.jpg b/src/models/projects/chiron/slideC.jpg new file mode 100644 index 0000000..a65aa01 Binary files /dev/null and b/src/models/projects/chiron/slideC.jpg differ diff --git a/src/models/projects/citrixRedbull/floorTexture.png b/src/models/projects/citrixRedbull/floorTexture.png deleted file mode 100644 index bc1743e..0000000 Binary files a/src/models/projects/citrixRedbull/floorTexture.png and /dev/null differ diff --git a/src/models/projects/citrixRedbull/slideA.jpg b/src/models/projects/citrixRedbull/slideA.jpg deleted file mode 100755 index 50b3d88..0000000 Binary files a/src/models/projects/citrixRedbull/slideA.jpg and /dev/null differ diff --git a/src/models/projects/citrixRedbull/slideB.jpg b/src/models/projects/citrixRedbull/slideB.jpg deleted file mode 100755 index 30c0c05..0000000 Binary files a/src/models/projects/citrixRedbull/slideB.jpg and /dev/null differ diff --git a/src/models/projects/citrixRedbull/slideC.jpg b/src/models/projects/citrixRedbull/slideC.jpg deleted file mode 100755 index 8e18bd2..0000000 Binary files a/src/models/projects/citrixRedbull/slideC.jpg and /dev/null differ diff --git a/src/models/projects/karma/floorTexture.png b/src/models/projects/karma/floorTexture.png new file mode 100644 index 0000000..f2c996e Binary files /dev/null and b/src/models/projects/karma/floorTexture.png differ diff --git a/src/models/projects/karma/slideA.jpg b/src/models/projects/karma/slideA.jpg new file mode 100644 index 0000000..c8a539f Binary files /dev/null and b/src/models/projects/karma/slideA.jpg differ diff --git a/src/models/projects/karma/slideB.jpg b/src/models/projects/karma/slideB.jpg new file mode 100644 index 0000000..c8a539f Binary files /dev/null and b/src/models/projects/karma/slideB.jpg differ diff --git a/src/models/projects/karma/slideC.jpg b/src/models/projects/karma/slideC.jpg new file mode 100644 index 0000000..c8a539f Binary files /dev/null and b/src/models/projects/karma/slideC.jpg differ diff --git a/src/models/projects/madbox/floorTexture.png b/src/models/projects/madbox/floorTexture.png deleted file mode 100644 index 9ea67e7..0000000 Binary files a/src/models/projects/madbox/floorTexture.png and /dev/null differ diff --git a/src/models/projects/madbox/slideA.jpg b/src/models/projects/madbox/slideA.jpg deleted file mode 100644 index e64d660..0000000 Binary files a/src/models/projects/madbox/slideA.jpg and /dev/null differ diff --git a/src/models/projects/madbox/slideB.jpg b/src/models/projects/madbox/slideB.jpg deleted file mode 100644 index 6714842..0000000 Binary files a/src/models/projects/madbox/slideB.jpg and /dev/null differ diff --git a/src/models/projects/madbox/slideC.jpg b/src/models/projects/madbox/slideC.jpg deleted file mode 100644 index 5b95534..0000000 Binary files a/src/models/projects/madbox/slideC.jpg and /dev/null differ diff --git a/src/models/projects/noffta/floorTexture.png b/src/models/projects/noffta/floorTexture.png new file mode 100644 index 0000000..0bffcab Binary files /dev/null and b/src/models/projects/noffta/floorTexture.png differ diff --git a/src/models/projects/noffta/slideA.jpg b/src/models/projects/noffta/slideA.jpg new file mode 100644 index 0000000..7da2f18 Binary files /dev/null and b/src/models/projects/noffta/slideA.jpg differ diff --git a/src/models/projects/noffta/slideB.jpg b/src/models/projects/noffta/slideB.jpg new file mode 100644 index 0000000..7da2f18 Binary files /dev/null and b/src/models/projects/noffta/slideB.jpg differ diff --git a/src/models/projects/noffta/slideC.jpg b/src/models/projects/noffta/slideC.jpg new file mode 100644 index 0000000..7da2f18 Binary files /dev/null and b/src/models/projects/noffta/slideC.jpg differ diff --git a/src/models/projects/osaka/floorTexture.png b/src/models/projects/osaka/floorTexture.png new file mode 100644 index 0000000..91a1e2c Binary files /dev/null and b/src/models/projects/osaka/floorTexture.png differ diff --git a/src/models/projects/osaka/slideA.jpg b/src/models/projects/osaka/slideA.jpg new file mode 100644 index 0000000..7d3926a Binary files /dev/null and b/src/models/projects/osaka/slideA.jpg differ diff --git a/src/models/projects/osaka/slideB.jpg b/src/models/projects/osaka/slideB.jpg new file mode 100644 index 0000000..7d3926a Binary files /dev/null and b/src/models/projects/osaka/slideB.jpg differ diff --git a/src/models/projects/osaka/slideC.jpg b/src/models/projects/osaka/slideC.jpg new file mode 100644 index 0000000..7d3926a Binary files /dev/null and b/src/models/projects/osaka/slideC.jpg differ diff --git a/src/models/projects/robrun/floorTexture.png b/src/models/projects/robrun/floorTexture.png new file mode 100644 index 0000000..f8f7f48 Binary files /dev/null and b/src/models/projects/robrun/floorTexture.png differ diff --git a/src/models/projects/robrun/slideA.jpg b/src/models/projects/robrun/slideA.jpg new file mode 100644 index 0000000..18289ca Binary files /dev/null and b/src/models/projects/robrun/slideA.jpg differ diff --git a/src/models/projects/robrun/slideB.jpg b/src/models/projects/robrun/slideB.jpg new file mode 100644 index 0000000..18289ca Binary files /dev/null and b/src/models/projects/robrun/slideB.jpg differ diff --git a/src/models/projects/robrun/slideC.jpg b/src/models/projects/robrun/slideC.jpg new file mode 100644 index 0000000..18289ca Binary files /dev/null and b/src/models/projects/robrun/slideC.jpg differ diff --git a/src/models/projects/scout/floorTexture.png b/src/models/projects/scout/floorTexture.png deleted file mode 100644 index 487a883..0000000 Binary files a/src/models/projects/scout/floorTexture.png and /dev/null differ diff --git a/src/models/projects/scout/slideA.jpg b/src/models/projects/scout/slideA.jpg deleted file mode 100644 index 3c085be..0000000 Binary files a/src/models/projects/scout/slideA.jpg and /dev/null differ diff --git a/src/models/projects/scout/slideB.jpg b/src/models/projects/scout/slideB.jpg deleted file mode 100644 index 14d30bb..0000000 Binary files a/src/models/projects/scout/slideB.jpg and /dev/null differ diff --git a/src/models/projects/scout/slideC.jpg b/src/models/projects/scout/slideC.jpg deleted file mode 100644 index 9485a88..0000000 Binary files a/src/models/projects/scout/slideC.jpg and /dev/null differ diff --git a/src/models/projects/threejsJourney/floorTexture.png b/src/models/projects/threejsJourney/floorTexture.png index 62012b3..0bffcab 100644 Binary files a/src/models/projects/threejsJourney/floorTexture.png and b/src/models/projects/threejsJourney/floorTexture.png differ diff --git a/src/models/projects/threejsJourney/slideA.jpg b/src/models/projects/threejsJourney/slideA.jpg index 51dbf9f..7da2f18 100644 Binary files a/src/models/projects/threejsJourney/slideA.jpg and b/src/models/projects/threejsJourney/slideA.jpg differ diff --git a/src/models/projects/threejsJourney/slideB.jpg b/src/models/projects/threejsJourney/slideB.jpg index a8f4145..7da2f18 100644 Binary files a/src/models/projects/threejsJourney/slideB.jpg and b/src/models/projects/threejsJourney/slideB.jpg differ diff --git a/src/models/projects/threejsJourney/slideC.jpg b/src/models/projects/threejsJourney/slideC.jpg index 5a8230f..7da2f18 100644 Binary files a/src/models/projects/threejsJourney/slideC.jpg and b/src/models/projects/threejsJourney/slideC.jpg differ diff --git a/src/models/projects/updayme/floorTexture.png b/src/models/projects/updayme/floorTexture.png new file mode 100644 index 0000000..1191cbb Binary files /dev/null and b/src/models/projects/updayme/floorTexture.png differ diff --git a/src/models/projects/updayme/slideA.jpg b/src/models/projects/updayme/slideA.jpg new file mode 100644 index 0000000..9ab669d Binary files /dev/null and b/src/models/projects/updayme/slideA.jpg differ diff --git a/src/models/projects/updayme/slideB.jpg b/src/models/projects/updayme/slideB.jpg new file mode 100644 index 0000000..f1b2b9c Binary files /dev/null and b/src/models/projects/updayme/slideB.jpg differ diff --git a/src/models/projects/updayme/slideC.jpg b/src/models/projects/updayme/slideC.jpg new file mode 100644 index 0000000..aef8fe5 Binary files /dev/null and b/src/models/projects/updayme/slideC.jpg differ diff --git a/src/models/projects/zenly/floorTexture.png b/src/models/projects/zenly/floorTexture.png deleted file mode 100644 index cb140a6..0000000 Binary files a/src/models/projects/zenly/floorTexture.png and /dev/null differ diff --git a/src/models/projects/zenly/slideA.jpg b/src/models/projects/zenly/slideA.jpg deleted file mode 100644 index 38a3449..0000000 Binary files a/src/models/projects/zenly/slideA.jpg and /dev/null differ diff --git a/src/models/projects/zenly/slideB.jpg b/src/models/projects/zenly/slideB.jpg deleted file mode 100644 index a4edcc5..0000000 Binary files a/src/models/projects/zenly/slideB.jpg and /dev/null differ diff --git a/src/models/projects/zenly/slideC.jpg b/src/models/projects/zenly/slideC.jpg deleted file mode 100644 index 2af0c28..0000000 Binary files a/src/models/projects/zenly/slideC.jpg and /dev/null differ diff --git a/src/style/main.css b/src/style/main.css index 152e282..03e4042 100644 --- a/src/style/main.css +++ b/src/style/main.css @@ -1,13 +1,11 @@ -* -{ +* { padding: 0; margin: 0; box-sizing: border-box; } body, -html -{ +html { position: fixed; top: 0; left: 0; @@ -16,8 +14,7 @@ html overflow: hidden; } -.canvas -{ +.canvas { position: fixed; top: 0; left: 0; @@ -25,23 +22,19 @@ html height: 100%; } -.canvas.has-cursor-grab -{ +.canvas.has-cursor-grab { cursor: grab; } -.canvas.has-cursor-grabbing -{ +.canvas.has-cursor-grabbing { cursor: grabbing; } -.canvas.has-cursor-pointer -{ +.canvas.has-cursor-pointer { cursor: pointer; } -.threejs-journey -{ +.threejs-journey { display: none; flex-direction: column; justify-content: flex-end; @@ -53,13 +46,11 @@ html user-select: none; } -.threejs-journey.is-active -{ +.threejs-journey.is-active { display: flex; } -.threejs-journey .message -{ +.threejs-journey .message { position: absolute; bottom: 0; right: 0; @@ -73,13 +64,11 @@ html transition: transform 0.5s cubic-bezier(0.5, 0, 0.25, 1), opacity 0.5s 0.2s cubic-bezier(0.5, 0, 0.25, 1); } -.threejs-journey .message.is-visible -{ +.threejs-journey .message.is-visible { opacity: 1; } -.threejs-journey .boy -{ +.threejs-journey .boy { position: absolute; bottom: 100%; left: 20px; @@ -89,8 +78,7 @@ html pointer-events: none; } -.threejs-journey .boy .variant -{ +.threejs-journey .boy .variant { position: absolute; top: 0; left: 0; @@ -100,39 +88,33 @@ html transition: transform 0.15s ease-in; } -.threejs-journey .boy .variant.is-yay -{ +.threejs-journey .boy .variant.is-yay { background: url('../images/boyYay.png'); } -.threejs-journey .boy .variant.is-shrugging -{ +.threejs-journey .boy .variant.is-shrugging { background: url('../images/boyShrugging.png'); } -.threejs-journey.is-hover-yes .boy .variant.is-yay -{ +.threejs-journey.is-hover-yes .boy .variant.is-yay { transform: translateY(0); transition-delay: 0.1s; transition-timing-function: ease-out; } -.threejs-journey.is-hover-no .boy .variant.is-shrugging -{ +.threejs-journey.is-hover-no .boy .variant.is-shrugging { transform: translateY(0); transition-delay: 0.1s; transition-timing-function: ease-out; } -.threejs-journey.is-hover-none .boy .variant.is-hi -{ +.threejs-journey.is-hover-none .boy .variant.is-hi { transform: translateY(0); transition-delay: 0.1s; transition-timing-function: ease-out; } -.threejs-journey .boy .is-hi .body -{ +.threejs-journey .boy .is-hi .body { position: absolute; top: 0; left: 0; @@ -141,8 +123,7 @@ html background: url('../images/boyHiBody.png'); } -.threejs-journey .boy .is-hi .arm -{ +.threejs-journey .boy .is-hi .arm { position: absolute; bottom: 0; right: 0; @@ -153,21 +134,37 @@ html transform-origin: 30% 90%; } -@keyframes boyArmWave -{ - 0% { transform: rotate(0deg); } - 2.5% { transform: rotate(15deg); } - 7.5% { transform: rotate(-15deg); } +@keyframes boyArmWave { + 0% { + transform: rotate(0deg); + } - 12.5% { transform: rotate(15deg); } - 17.5% { transform: rotate(-15deg); } - 20% { transform: rotate(0deg); } + 2.5% { + transform: rotate(15deg); + } - 100% { transform: rotate(0deg); } + 7.5% { + transform: rotate(-15deg); + } + + 12.5% { + transform: rotate(15deg); + } + + 17.5% { + transform: rotate(-15deg); + } + + 20% { + transform: rotate(0deg); + } + + 100% { + transform: rotate(0deg); + } } -.threejs-journey .message .bubble -{ +.threejs-journey .message .bubble { position: relative; padding: 20px 30px; border: 2px solid #ffffff; @@ -175,8 +172,7 @@ html background: linear-gradient(#fdb572ab, #fdb5721a); } -.threejs-journey .message .tip -{ +.threejs-journey .message .tip { position: absolute; width: 12px; height: 16px; @@ -185,14 +181,12 @@ html background: url('../images/bubbleTip.svg'); } -.threejs-journey .message.is-answers -{ +.threejs-journey .message.is-answers { display: flex; justify-content: flex-end; } -.threejs-journey .message .answer -{ +.threejs-journey .message .answer { position: relative; display: flex; align-items: center; @@ -204,8 +198,7 @@ html overflow: hidden; } -.threejs-journey .message .answer .background -{ +.threejs-journey .message .answer .background { position: absolute; top: 0; left: 0; @@ -214,8 +207,7 @@ html border-radius: 8px; } -.threejs-journey .message .answer .hover -{ +.threejs-journey .message .answer .hover { position: absolute; top: 0; left: 0; @@ -228,41 +220,34 @@ html will-change: transform; } -.threejs-journey .message .answer:hover .hover -{ +.threejs-journey .message .answer:hover .hover { transform: scaleX(1); } -.threejs-journey .message .answer .label -{ +.threejs-journey .message .answer .label { position: relative; } -.threejs-journey .message .answer.is-no -{ +.threejs-journey .message .answer.is-no { color: #ffffff; } -.threejs-journey .message .answer.is-no .background -{ +.threejs-journey .message .answer.is-no .background { border: 2px solid #ffffff; - background: linear-gradient(#fdb5721a, #fdb572ab); + background: linear-gradient(#38B7FF, #AD00FF); color: #ffffff; } -.threejs-journey .message .answer.is-yes -{ - color: #feae69; +.threejs-journey .message .answer.is-yes { + color: #38B7FF; } -.threejs-journey .message .answer.is-yes .background -{ +.threejs-journey .message .answer.is-yes .background { background: #ffffff; opacity: 0.75; } -.threejs-journey .message .answer.is-no .hover -{ +.threejs-journey .message .answer.is-no .hover { transform-origin: 100% 0; opacity: 0.2; } \ No newline at end of file diff --git a/static/favicon/android-chrome-192x192.png b/static/favicon/android-chrome-192x192.png index 646d082..78b4458 100644 Binary files a/static/favicon/android-chrome-192x192.png and b/static/favicon/android-chrome-192x192.png differ diff --git a/static/favicon/android-chrome-256x256.png b/static/favicon/android-chrome-256x256.png index b893827..54b5bc2 100644 Binary files a/static/favicon/android-chrome-256x256.png and b/static/favicon/android-chrome-256x256.png differ diff --git a/static/favicon/apple-touch-icon.png b/static/favicon/apple-touch-icon.png index b9051de..c7eff70 100644 Binary files a/static/favicon/apple-touch-icon.png and b/static/favicon/apple-touch-icon.png differ diff --git a/static/favicon/favicon-16x16.png b/static/favicon/favicon-16x16.png index 9a98b5c..8f62062 100644 Binary files a/static/favicon/favicon-16x16.png and b/static/favicon/favicon-16x16.png differ diff --git a/static/favicon/favicon-32x32.png b/static/favicon/favicon-32x32.png index 8618a45..2500cb8 100644 Binary files a/static/favicon/favicon-32x32.png and b/static/favicon/favicon-32x32.png differ diff --git a/static/favicon/favicon.ico b/static/favicon/favicon.ico index e2fc2f6..d0f3e02 100644 Binary files a/static/favicon/favicon.ico and b/static/favicon/favicon.ico differ diff --git a/static/favicon/mstile-150x150.png b/static/favicon/mstile-150x150.png index 16ce9ca..3c44d61 100644 Binary files a/static/favicon/mstile-150x150.png and b/static/favicon/mstile-150x150.png differ diff --git a/static/favicon/site.webmanifest b/static/favicon/site.webmanifest index 9115af1..45b38e3 100644 --- a/static/favicon/site.webmanifest +++ b/static/favicon/site.webmanifest @@ -1,6 +1,6 @@ { - "name": "Bruno Simon", - "short_name": "Bruno Simon", + "name": "Lucas Moramarco", + "short_name": "Lucas Moramarco", "icons": [ { "src": "/favicon/android-chrome-192x192.png", @@ -16,4 +16,4 @@ "theme_color": "#ffffff", "background_color": "#ffffff", "display": "standalone" -} +} \ No newline at end of file