Skip to content

Commit 575540d

Browse files
PamavocPamavoc
committed
last anims fixs
1 parent f2df79d commit 575540d

File tree

4 files changed

+125
-64
lines changed

4 files changed

+125
-64
lines changed

‎assets/states-animations/Micro-anim.theatre-project-state.json

+76-8
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,17 @@
77
"width": 100
88
},
99
"button p": {
10-
"X": -400
10+
"X": -400,
11+
"transforms": {
12+
"x": 52,
13+
"y": -2
14+
}
1115
}
1216
}
1317
},
1418
"sequence": {
1519
"subUnitsPerUnit": 30,
16-
"length": 2.56,
20+
"length": 2,
1721
"type": "PositionalSequence",
1822
"tracksByObject": {
1923
"start": {
@@ -51,7 +55,32 @@
5155
"534yqYhLqR": {
5256
"type": "BasicKeyframedTrack",
5357
"__debugName": "button p:[\"opacity\"]",
54-
"keyframes": []
58+
"keyframes": [
59+
{
60+
"id": "LeR6s_oW4c",
61+
"position": 1.2,
62+
"connectedRight": true,
63+
"handles": [
64+
0.5,
65+
1,
66+
0.5,
67+
0
68+
],
69+
"value": 1
70+
},
71+
{
72+
"id": "HpwvjfDjHp",
73+
"position": 1.7,
74+
"connectedRight": true,
75+
"handles": [
76+
0.5,
77+
1,
78+
0.5,
79+
0
80+
],
81+
"value": 0
82+
}
83+
]
5584
},
5685
"D_y4JzPeje": {
5786
"type": "BasicKeyframedTrack",
@@ -67,7 +96,7 @@
6796
0.5,
6897
0
6998
],
70-
"value": -59
99+
"value": -76
71100
},
72101
{
73102
"id": "EzcAd0auP8",
@@ -97,21 +126,58 @@
97126
0.5,
98127
0
99128
],
100-
"value": 19
129+
"value": 1
101130
}
102131
]
103132
},
104133
"sNpIrTL-6G": {
105134
"type": "BasicKeyframedTrack",
106135
"__debugName": "button p:[\"width\"]",
107136
"keyframes": []
137+
},
138+
"qB0Im2vS06": {
139+
"type": "BasicKeyframedTrack",
140+
"__debugName": "button p:[\"transform\",\"x\"]",
141+
"keyframes": []
142+
},
143+
"LX3PWrwlBy": {
144+
"type": "BasicKeyframedTrack",
145+
"__debugName": "button p:[\"transform\",\"y\"]",
146+
"keyframes": [
147+
{
148+
"id": "cTIUq6XPbf",
149+
"position": 1.2,
150+
"connectedRight": true,
151+
"handles": [
152+
0.5,
153+
1,
154+
0.55,
155+
0.085
156+
],
157+
"value": 0
158+
},
159+
{
160+
"id": "VAMxPRoGWf",
161+
"position": 1.7,
162+
"connectedRight": true,
163+
"handles": [
164+
0.68,
165+
0.53,
166+
0.5,
167+
0
168+
],
169+
"value": -20
170+
}
171+
]
108172
}
109173
},
110174
"trackIdByPropPath": {
111175
"[\"opacity\"]": "534yqYhLqR",
112176
"[\"y\"]": "D_y4JzPeje",
113177
"[\"x\"]": "P_D3bCt33o",
114-
"[\"width\"]": "sNpIrTL-6G"
178+
"[\"width\"]": "sNpIrTL-6G",
179+
"[\"transform\",\"x\"]": "qB0Im2vS06",
180+
"[\"transform\",\"y\"]": "LX3PWrwlBy"
115181
}
116182
},
117183
"border-bottom": {
@@ -149,7 +215,7 @@
149215
},
150216
{
151217
"id": "QsPDbhj60j",
152-
"position": 1.2,
218+
"position": 0.767,
153219
"connectedRight": true,
154220
"handles": [
155221
0.5,
@@ -204,7 +270,7 @@
204270
},
205271
{
206272
"id": "nPv-v-fS6j",
207-
"position": 2.4,
273+
"position": 1.367,
208274
"connectedRight": true,
209275
"handles": [
210276
0.5,
@@ -230,6 +296,8 @@
230296
},
231297
"definitionVersion": "0.4.0",
232298
"revisionHistory": [
299+
"BgfyjdFlCLTInP5l",
300+
"Xlscy6aMkb86m6hZ",
233301
"sTDvJIbJYbtnzNjB"
234302
]
235303
}

‎classes/Animations.ts

+3-12
Original file line numberDiff line numberDiff line change
@@ -57,13 +57,6 @@ export default class Animations {
5757
}
5858

5959

60-
// gsap shit
61-
createTimeline() {
62-
//const tl = gsap.timeline({ onUpdate: this.onUpdate })
63-
//return tl;
64-
}
65-
66-
6760
createProject(project_name, project_state?: ObjectType) {
6861
// Create a project for the animation
6962
let project;
@@ -117,14 +110,12 @@ export default class Animations {
117110
real: this.ui.querySelector('.border-top'),
118111
},
119112
],
120-
})
113+
})
121114

115+
this.playAnimations(project, sheet, 1)
122116
}
123117

124-
// createIntroduction2() {
125-
// const project = getProject('Introduction', { introductionState });
126-
// const sheet = project.sheet('Camera Animation');
127-
// }
118+
128119

129120
createIntroduction(camera) {
130121
const project = this.createProject('Introduction', { state: introductionState })

‎classes/WebGL.ts

+40-42
Original file line numberDiff line numberDiff line change
@@ -74,47 +74,6 @@ export default class WebGL {
7474
this.loadMap('trinity-2.glb')
7575

7676

77-
this.emitter.on('studio', () => {
78-
this.animations.studio.ui.restore()
79-
})
80-
81-
this.emitter.on('home', ()=> {
82-
this.animations.studio.ui.hide()
83-
})
84-
85-
// this.animations.createMicroInteraction()
86-
87-
88-
this.emitter.on('audio_started', () => {
89-
90-
// trigger anim webgl
91-
// const target = new THREE.Vector3(0, 1, 0)
92-
// const cube = this.scene.instance.getObjectByProperty('name', 'cube-base');
93-
// console.log(cube)
94-
95-
this.animations.createIntroduction(this.camera)
96-
this.materials.playVideos()
97-
98-
99-
this.audio_manager = useAudio(this.emitter)
100-
101-
this.audio_manager.start( {
102-
onBeat: ()=> {
103-
104-
const average = this.audio_manager.values.reduce((a, b) => a + b, 0) / this.audio_manager.values.length;
105-
this.emitter.emit('beat_sent', average)
106-
},
107-
live: false,
108-
playlist: ['/sounds/initialisation.mp3', '/sounds/megatron-ss.mp3', '/sounds/burningman-s.mp3']
109-
})
110-
111-
112-
this.audio_started = true
113-
// window.audio = this.audio_manager
114-
115-
})
116-
117-
11877
if (/debug/.test(window.location.href)) {
11978
this.debug = true
12079
this.camera.tweak()
@@ -128,7 +87,6 @@ export default class WebGL {
12887
}
12988

13089

131-
13290
switchMap = (map) => {
13391
this.removeOldMap().then(()=> this.loadMap(map))
13492
}
@@ -152,9 +110,49 @@ export default class WebGL {
152110

153111
}
154112

113+
experienceEvents = () => {
114+
this.emitter.on('studio', () => {
115+
this.animations.studio.ui.restore()
116+
})
117+
118+
this.emitter.on('home', ()=> {
119+
this.animations.studio.ui.hide()
120+
})
121+
122+
123+
this.emitter.on('audio_started', () => {
124+
125+
// trigger anim webgl
126+
// const target = new THREE.Vector3(0, 1, 0)
127+
// const cube = this.scene.instance.getObjectByProperty('name', 'cube-base');
128+
// console.log(cube)
129+
130+
this.animations.createMicroInteraction()
131+
this.animations.createIntroduction(this.camera)
132+
this.materials.playVideos()
133+
this.audio_manager = useAudio(this.emitter)
134+
135+
this.audio_manager.start( {
136+
onBeat: ()=> {
137+
138+
const average = this.audio_manager.values.reduce((a, b) => a + b, 0) / this.audio_manager.values.length;
139+
this.emitter.emit('beat_sent', average)
140+
},
141+
live: false,
142+
playlist: ['/sounds/initialisation.mp3', '/sounds/megatron-ss.mp3', '/sounds/burningman-s.mp3']
143+
})
144+
145+
146+
this.audio_started = true
147+
// window.audio = this.audio_manager
148+
149+
})
150+
}
151+
155152

156153
setEvents = () => {
157154
this.addEvents();
155+
this.experienceEvents();
158156
this.onResize();
159157
};
160158

‎components/UI.vue

+6-2
Original file line numberDiff line numberDiff line change
@@ -119,7 +119,7 @@ const startAudio = () => {
119119
background: none;
120120
width: 200px;
121121
border:none;
122-
122+
// padding: 6px 22px 12px 22px;
123123
color: #1ECA9A;
124124
transition: all 0.35s ease-in-out;
125125
border-radius: 5.38462px;
@@ -131,8 +131,12 @@ const startAudio = () => {
131131
}
132132
133133
p {
134+
margin-block-end: 0;
135+
margin-block-start: 0;
134136
margin:0;
135-
padding: 6px 22px 12px 22px;
137+
padding-top: 8px;
138+
padding-bottom: 14px;
139+
//padding: 6px 22px 12px 22px;
136140
}
137141
138142
&:hover {

0 commit comments

Comments
 (0)