vad-example.js

total 0
used 0
limit 0
/* title: Most Minimal Example categories: minimal files: head point stage mouse ../point_src/easing.js ../theatre/vad-wave.js --- The minimal requirements include the _head_, _stage_, and the _point_. */ class MainStage extends Stage { canvas = 'playspace' mounted() { this.point = this.center.copy() this.point.radius = 50 this.color = '#44DD88' this.events.on('speechStart', this.onSpeechStart.bind(this)) this.events.on('speechEnd', this.onSpeechEnd.bind(this)) this.events.on('frameProcessed', this.onFrameProcessed.bind(this)) } onSpeechStart() { console.log('start') this.point.radius += 30 this.color = 'orange' } onSpeechEnd() { console.log('end') this.point.radius = 50 this.color = '#4488DD' } onFrameProcessed(){ console.log('frameProcessed') } draw(ctx){ this.clear(ctx) this.point.pen.fill(ctx, {color:this.color, width: 3}) } } stage = MainStage.go(/*{ loop: true }*/)
Run
Meta Data
title Most Minimal Example
imports ()
files ('head', 'point', 'stage', 'mouse', '../point_src/easing.js', '../theatre/vad-wave.js')
unused_keys ()
unknown_keys ('categories',)
categories ['minimal']
filepath_exists True
path vad-example.js
filepath vad-example.js
clean_files ('../point_src/core/head.js', '../point_src/pointpen.js', '../point_src/compass.js', '../point_src/center.js', '../point_src/point-content.js', '../point_src/pointdraw.js', '../point_src/relative-xy.js', '../point_src/pointcast.js', '../point_src/point.js', '../point_src/stage-resize.js', '../point_src/functions/resolve.js', '../point_src/stage.js', '../point_src/events.js', '../point_src/automouse.js', '../point_src/easing.js', '../theatre/vad-wave.js')
markdown {'html': '<p>The minimal requirements include the <em>head</em>, <em>stage</em>, and the <em>point</em>.</p>', 'content': 'title: Most Minimal Example\ncategories: minimal\nfiles:\n head\n point\n stage\n mouse\n ../point_src/easing.js\n ../theatre/vad-wave.js\n---\n\nThe minimal requirements include the _head_, _stage_, and the _point_.'}