You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
221 lines
5.4 KiB
221 lines
5.4 KiB
4 years ago
|
// REVEAL AND TYPE
|
||
|
|
||
|
Reveal.initialize({
|
||
|
width: '80%',
|
||
|
height: '60%',
|
||
|
hash: true,
|
||
|
controls: true,
|
||
|
// Learn about plugins: https://revealjs.com/plugins/
|
||
|
// plugins: [RevealMarkdown, RevealHighlight, RevealNotes],
|
||
|
|
||
|
dependencies: [{
|
||
|
src: 'plugin/typed/typed.js',
|
||
|
async: false,
|
||
|
callback: function () {
|
||
|
callTypedJs()
|
||
|
}
|
||
|
}]
|
||
|
})
|
||
|
|
||
|
function init_type (event) {
|
||
|
console.log('init_type()')
|
||
|
|
||
|
// console.log(event);
|
||
|
// console.log(event.currentSlide);
|
||
|
// console.log(event.indexh);
|
||
|
|
||
|
index = event.indexh
|
||
|
div_typed_content = event.currentSlide.getElementsByClassName(
|
||
|
'typed-content'
|
||
|
)[0]
|
||
|
|
||
|
if (div_typed_content == undefined) {
|
||
|
console.log('Nothing to do. No type div found.')
|
||
|
|
||
|
return false
|
||
|
}
|
||
|
|
||
|
div_typed_content.id = 'typed-content-' + index
|
||
|
div_typed_insert = event.currentSlide.getElementsByClassName(
|
||
|
'typed-insert'
|
||
|
)[0]
|
||
|
div_typed_insert.id = 'typed-insert-' + index
|
||
|
|
||
|
if (typeof window['typed' + index] === 'undefined') {
|
||
|
window['typed' + index] = new Typed('#' + div_typed_insert.id, {
|
||
|
stringsElement: '#' + div_typed_content.id,
|
||
|
loop: false,
|
||
|
startDelay: 1500,
|
||
|
typeSpeed: 50,
|
||
|
backSpeed: 0,
|
||
|
showCursor: true,
|
||
|
cursorChar: '| ',
|
||
|
autoInsertCss: true,
|
||
|
onComplete: function (self) {
|
||
|
// console.log(Reveal.isLastSlide())
|
||
|
// console.log(Reveal.getSlides())
|
||
|
console.log('------')
|
||
|
console.log('End Typing!')
|
||
|
if (Reveal.isLastSlide()) {
|
||
|
console.log('LAAAAAAAAAAAAAST SLIDE')
|
||
|
aside_controls = document.getElementsByClassName('controls')[0]
|
||
|
aside_controls.style.display = 'block'
|
||
|
} else {
|
||
|
setTimeout(() => {
|
||
|
Reveal.right()
|
||
|
}, 3000)
|
||
|
}
|
||
|
}
|
||
|
})
|
||
|
}
|
||
|
}
|
||
|
|
||
|
var count_sliding = 0
|
||
|
|
||
|
Reveal.on('slidechanged', (event) => {
|
||
|
count_sliding = count_sliding + 1
|
||
|
console.log('Slide Change: ' + count_sliding)
|
||
|
init_type(event)
|
||
|
})
|
||
|
|
||
|
// Hit on first slide
|
||
|
Reveal.on('ready', (event) => {
|
||
|
console.log('Reveal Ready')
|
||
|
|
||
|
var aside_controls = document.getElementsByClassName('controls')[0]
|
||
|
aside_controls.style.display = 'none'
|
||
|
|
||
|
if (Reveal.isFirstSlide()) {
|
||
|
console.log('Reveal is First Slide')
|
||
|
setTimeout(() => {
|
||
|
init_type(event)
|
||
|
}, 5000)
|
||
|
} else {
|
||
|
console.log('Reveal not first slide!!')
|
||
|
window.location.assign('/')
|
||
|
}
|
||
|
})
|
||
|
|
||
|
/*
|
||
|
* This example show how to load complex shapes created with PhysicsEditor (https://www.codeandweb.com/physicseditor)
|
||
|
*
|
||
|
* Scaling via: https://www.joshmorony.com/how-to-scale-a-game-for-all-device-sizes-in-phaser/
|
||
|
*/
|
||
|
|
||
|
var config = {
|
||
|
type: Phaser.AUTO,
|
||
|
scale: {
|
||
|
mode: Phaser.Scale.FIT,
|
||
|
parent: 'game',
|
||
|
autoCenter: Phaser.Scale.CENTER_BOTH,
|
||
|
width: window.innerWidth * window.devicePixelRatio,
|
||
|
height: window.innerHeight * window.devicePixelRatio
|
||
|
},
|
||
|
transparent: true,
|
||
|
backgroundColor: 0xffffff,
|
||
|
scene: {
|
||
|
preload: preload,
|
||
|
create: create
|
||
|
},
|
||
|
physics: {
|
||
|
default: 'matter',
|
||
|
matter: {
|
||
|
// debug: true
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
var game = new Phaser.Game(config)
|
||
|
|
||
|
function preload () {
|
||
|
// Load sprite sheet generated with TexturePacker
|
||
|
this.load.atlas(
|
||
|
'sheet',
|
||
|
'assets/fruit-sprites.png',
|
||
|
'assets/fruit-sprites.json'
|
||
|
)
|
||
|
|
||
|
// Load body shapes from JSON file generated using PhysicsEditor
|
||
|
this.load.json('shapes', 'assets/fruit-shapes.json')
|
||
|
// this.load.json('shapes', 'assets/scooter.json');
|
||
|
}
|
||
|
|
||
|
function create () {
|
||
|
var shapes = this.cache.json.get('shapes')
|
||
|
|
||
|
this.matter.world.setBounds(0, 0, game.config.width, game.config.height)
|
||
|
// this.add.image(0, 0, 'sheet', 'background').setOrigin(0, 0)
|
||
|
|
||
|
// sprites are positioned at their center of mass
|
||
|
var ground = this.matter.add.sprite(0, 0, 'sheet', 'ground', {
|
||
|
shape: shapes.ground
|
||
|
})
|
||
|
ground.setPosition(0 + ground.centerOfMass.x, 1000 + ground.centerOfMass.y) // corrected position: (0,280)
|
||
|
this.matter.add.sprite(200, 50, 'sheet', 'crate', {
|
||
|
shape: shapes.crate
|
||
|
})
|
||
|
this.matter.add.sprite(250, 250, 'sheet', 'banana', {
|
||
|
shape: shapes.banana
|
||
|
})
|
||
|
this.matter.add.sprite(360, 50, 'sheet', 'orange', {
|
||
|
shape: shapes.orange
|
||
|
})
|
||
|
this.matter.add.sprite(400, 250, 'sheet', 'cherries', {
|
||
|
shape: shapes.cherries
|
||
|
})
|
||
|
|
||
|
var sprites = ['crate', 'banana', 'orange', 'cherries'] // array to choose random sprite from
|
||
|
|
||
|
for (let i = 0; i < 50; ++i) {
|
||
|
this.matter.add.sprite(
|
||
|
getRandomIntMin(30, 100),
|
||
|
getRandomIntMin(30, game.config.height / 2),
|
||
|
'sheet',
|
||
|
sprites[getRandomInt(4)], {
|
||
|
shape: shapes.banana
|
||
|
}
|
||
|
)
|
||
|
}
|
||
|
|
||
|
this.input.on(
|
||
|
'pointerdown',
|
||
|
function (pointer) {
|
||
|
// var touchX = pointer.x;
|
||
|
// var touchY = pointer.y;
|
||
|
this.matter.add.sprite(
|
||
|
pointer.x,
|
||
|
pointer.y,
|
||
|
'sheet',
|
||
|
sprites[getRandomInt(4)], {
|
||
|
shape: shapes.banana
|
||
|
}
|
||
|
)
|
||
|
},
|
||
|
this
|
||
|
)
|
||
|
|
||
|
setInterval(() => {
|
||
|
console.log('get random sprite')
|
||
|
for (let i = 0; i < getRandomInt(3); ++i) {
|
||
|
this.matter.add.sprite(
|
||
|
getRandomIntMin(30, 100),
|
||
|
getRandomIntMin(30, game.config.height / 2),
|
||
|
'sheet',
|
||
|
sprites[getRandomInt(4)], {
|
||
|
shape: shapes.banana
|
||
|
}
|
||
|
)
|
||
|
}
|
||
|
}, 10000)
|
||
|
}
|
||
|
|
||
|
function getRandomInt (max) {
|
||
|
return Math.floor(Math.random() * Math.floor(max))
|
||
|
}
|
||
|
|
||
|
function getRandomIntMin (min, max) {
|
||
|
min = Math.ceil(min)
|
||
|
max = Math.floor(max)
|
||
|
return Math.floor(Math.random() * (max - min) + min) // The maximum is exclusive and the minimum is inclusive
|
||
|
}
|