Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Initial Commit

  • Loading branch information...
commit ad489f94e9fd7af90e6e9da13e27252c55d000c6 0 parents
@arian authored
6 Demos/FullCanvas.css
@@ -0,0 +1,6 @@
+
+.FullCanvas {
+ position: absolute;
+ top: 0;
+ left: 0;
+}
135 Demos/Fx.Timer.html
@@ -0,0 +1,135 @@
+<!DOCTYPE html>
+<html>
+<head>
+
+<title>n00bsNotNeedApply</title>
+<script src="https://ajax.googleapis.com/ajax/libs/mootools/1.3.2/mootools.js"></script>
+<script src="../Source/dbg.js"></script>
+<script src="../Source/Class.Binds.js"></script>
+<script src="../Source/FullCanvas.js"></script>
+<script src="../Source/Fx.Timer.js"></script>
+<script src="../Source/Vector.js"></script>
+<script src="../Source/Fx.Timer.Dynamic.js"></script>
+
+<style>
+ body {
+ background: #111;
+ }
+
+ .bike {
+ background: #555;
+ border: 3px solid #222;
+ border-radius: 15px;
+ width: 40px;
+ height: 40px;
+ position: absolute;
+ top: 100px;
+ left: 100px;
+ }
+</style>
+
+<script>
+
+var trans = {0: 'x', 1: 'y'};
+
+var Bike = new Class({
+
+ Extends: Fx.Timer.Dynamic,
+
+ options: {
+ fps: 60,
+ init: {
+ v: [200, 160],
+ a: [0, 200]
+ },
+ limit: {
+ x: [0, window.innerWidth],
+ y: [0, window.innerHeight]
+ },
+ bounce: {
+ x: [-1.5, -1.5, 0.5],
+ y: [-1, -0.9, 0.5]
+ }
+ },
+
+ initialize: function(el, options){
+ el = this.element = document.id(el);
+ this.parent(options);
+ this.items.push(el);
+ },
+
+ onStart: function(){
+ this.parent();
+ var pos = this.element.getStyles('top', 'left');
+ this.x[0] = pos.left.toInt();
+ this.x[1] = pos.top.toInt();
+ this.size = this.getSize();
+ },
+
+ onStep: function(dt, elapsed, now){
+ this.parent(dt, elapsed, now);
+ this.limit();
+ this.element.setStyles({
+ left: this.x[0],
+ top: this.x[1]
+ });
+ },
+
+ limit: function(){
+ var limit = this.options.limit, size = this.size;
+ this.x.map(function(y, i){
+ var axis = trans[i], lim = limit[axis];
+ if (y < lim[0]){
+ this.onLimit(i, 0);
+ return lim[0];
+ } else if (y > (lim[1] - size[axis])){
+ this.onLimit(i, 1);
+ return (lim[1] - size[axis]);
+ }
+ return y;
+ }, this);
+ },
+
+ onLimit: function(axis, boundary){
+ var bounce = this.options.bounce[trans[axis]],
+ perpAxis = +(axis == 0); // 0 -> 1, 1 -> 0
+ this.v[axis] *= bounce[boundary];
+ this.v[perpAxis] *= bounce[2];
+ },
+
+ getSize: function(){
+ return this.element.getSize();
+ }
+
+});
+
+window.addEvent('domready', function(){
+
+ (20).times(function(){
+
+ var el = new Element('div.bike').setStyles({
+ left: Number.random(0, 700),
+ top: Number.random(0, 400),
+ opacity: Number.random(),
+ background: 'rgb({r},{g},{b})'.substitute({ r: Number.random(0,255), g: Number.random(0,255), b: Number.random(0, 255) })
+ }).inject(document.body);
+
+ new Bike(el, {
+ init: {
+ v: [Number.random(-300, 300), 0]
+ }
+ }).addEvent('complete', function(){
+ console.log(el, 'has been completed');
+ });
+
+ });
+
+});
+
+</script>
+
+</head>
+<body>
+
+</body>
+</html>
28 Source/Class.Binds.js
@@ -0,0 +1,28 @@
+/*
+---
+
+name: Class.Binds
+
+description: A clean Class.Binds Implementation
+
+authors: Scott Kyle (@appden), Christoph Pojer (@cpojer)
+
+license: MIT-style license.
+
+requires: [Core/Class, Core/Function]
+
+provides: Class.Binds
+
+...
+*/
+
+Class.Binds = new Class({
+
+ $bound: {},
+
+ bound: function(name){
+ return this.$bound[name] ? this.$bound[name] : this.$bound[name] = this[name].bind(this);
+ }
+
+});
+
45 Source/FullCanvas.js
@@ -0,0 +1,45 @@
+var FullCanvas = new Class({
+
+ Implements: [Options, Events, Class.Binds],
+
+ options: {
+ attach: true,
+ className: 'FullCanvas'
+ },
+
+ initialize: function(canvas, options){
+ this.setOptions(options);
+
+ this.canvas = document.id(canvas).set('class', this.options.className);
+
+ if (this.options.attach) this.attach();
+ this.resize();
+ },
+
+ attach: function(){
+ window.addEvent('resize', this.bound('resize'));
+ },
+
+ detach: function(){
+ window.removeEvent('resize', this.bound('resize'));
+ },
+
+ resize: function(){
+ var info = window.getSize();
+ this.canvas.setStyles({
+ width: info.x,
+ height: info.y
+ });
+
+ this.canvas.width = info.x;
+ this.canvas.height = info.y;
+
+ System.size = info;
+
+ this.fireEvent('resize', info);
+ },
+
+ toElement: function(){
+ return this.canvas;
+ }
+});
38 Source/Fx.Timer.Dynamic.js
@@ -0,0 +1,38 @@
+
+Fx.Timer.Dynamic = new Class({
+
+ Extends: Fx.Timer,
+
+ options: {
+ fps: 10,
+ autostart: true,
+ init: {
+ x: [0, 0],
+ v: [0, 0],
+ a: [0, 0]
+ },
+ threshold: 0.03
+ },
+
+ initialize: function(options){
+ this.parent(options);
+ if (this.options.autostart) this.start();
+ },
+
+ onStart: function(){
+ Object.each(this.options.init, function(value, i){
+ this[i] = new Vector(value);
+ }, this);
+ },
+
+ onStep: function(dt, elapsed, now){
+ var x = this.x, v = this.v, a = this.a,
+ threshold = this.options.threshold;
+ dt /= 1000;
+ x.add(v.clone().times(dt));
+ v.add(a.clone().times(dt));
+
+ if (elapsed > dt && v.abs() < threshold) this.complete();
+ }
+
+});
134 Source/Fx.Timer.js
@@ -0,0 +1,134 @@
+/*
+---
+name: Fx.Timer
+description: Contains basic timing logic animation logic to be extended by Fx.
+requires: [Date.now, Array, Function, Class, Events, Options, Chain]
+provides: Timer
+...
+*/
+
+(function(){
+
+var Timer = Fx.Timer = new Class({
+
+ Implements: [Options, Events, Chain],
+
+ options: {
+ behavior: 'cancel',
+ fps: 60
+ },
+
+ initialize: function(options){
+ this.setOptions(options);
+ this.items = [];
+ },
+
+ start: function(){
+ if (this.check.apply(this, arguments)){
+ this.time = 0;
+ this.elapsed = 0;
+ this.onStart.apply(this, arguments);
+ this.startTimer(this);
+ this.fireEvent('start', this.items);
+ }
+ return this;
+ },
+
+ cancel: function(){
+ this.stopTimer(this);
+ this.fireEvent('cancel', this.items);
+ return this;
+ },
+
+ pause: function(){
+ if (!this.timer) return this;
+ this.stopTimer(this);
+ this.paused = true;
+ return this.fireEvent('pause', this.items);
+ },
+
+ resume: function(){
+ if (this.paused){
+ this.startTimer(this);
+ this.paused = false;
+ this.fireEvent('resume', this.items);
+ }
+ return this;
+ },
+
+ complete: function(){
+ this.stopTimer();
+ this.fireEvent('complete', this.items);
+ if (!this.callChain()) this.fireEvent('chainComplete', this.items);
+ return this;
+ },
+
+ isRunning: function(){
+ return !!this.timer;
+ },
+
+ /* private methods */
+
+ step: function(now){
+ if (!this.time) this.time = now - this.elapsed;
+ var previous = this.elapsed;
+ this.elapsed = now - this.time;
+ this.onStep(this.elapsed - previous, this.elapsed, now);
+ },
+
+ // overwrite these in your subclasses
+ onStep: function(){},
+ onStart: function(){},
+
+ check: function(){
+ if (!this.timer) return true;
+ switch (this.options.behavior){
+ case 'cancel': this.cancel(); return true;
+ case 'chain': this.chain(this.caller.pass(arguments, this)); return false;
+ }
+ return false;
+ },
+
+ stopTimer: function(){
+ if (!this.timer) return;
+ this.time = null;
+ this.timer = this.stepper && Timer.remove(this.stepper, this.options.fps);
+ },
+
+ startTimer: function(){
+ if (this.timer) return;
+ this.timer = Timer.add(this.stepper || (this.stepper = this.step.bind(this)), this.options.fps);
+ }
+
+});
+
+// global timer
+// replace for https://github.com/kamicane/mootools-core/blob/05a862ead25fbec32d9/Source/Utilities/Timer.js ??
+var functions = {}, timers = {};
+
+var loop = function(){
+ var now = Date.now();
+ for (var i = this.length, fn; i--;) (fn = this[i]) && fn(now);
+};
+
+Timer.extend({
+ add: function(fn, fps){
+ var list = (functions[fps] || (functions[fps] = []));
+ list.push(fn);
+ if (!timers[fps]) timers[fps] = setInterval(loop.bind(list), 1000 / fps);
+ return true;
+ },
+ remove: function(fn, fps){
+ var list = functions[fps];
+ if (list){
+ list.erase(fn);
+ if (!list.length && timers[fps]){
+ delete functions[fps];
+ timers[fps] = clearInterval(timers[fps]);
+ }
+ }
+ return false;
+ }
+});
+
+})();
91 Source/Vector.js
@@ -0,0 +1,91 @@
+
+
+var Vector = function(){
+ Array.flatten(arguments).each(function(i){
+ this.push(i);
+ }, this)
+};
+
+Vector.prototype = {length: 0};
+Vector.parent = Array;
+
+new Type('Vector', Vector);
+
+Vector.implement({
+
+ push: function(){
+ var length = this.length;
+ for (var i = 0, l = arguments.length; i < l; i++){
+ this[length++] = +arguments[i];
+ }
+ return (this.length = length);
+ }.protect(),
+
+ map: function(fn, bind){
+ for (var i = 0, l = this.length; i < l; i++) this[i] = fn.call(bind, this[i], i);
+ return this;
+ }.protect(),
+
+ augment: function(length){
+ if (this.length >= length) return this;
+ for (var l = (length - this.length); l--;) this.push(0);
+ return this;
+ }.protect(),
+
+ times: function(v){
+ return this.map(v instanceof Vector ? function(i, n){
+ return i * v[n];
+ } : function(i){
+ return i * v;
+ });
+ }.protect(),
+
+ add: function(v){
+ return this.map(v instanceof Vector ? function(i, n){
+ return i + v[n];
+ }: function(i){
+ return i + v;
+ });
+ }.protect(),
+
+ sum: function(){
+ var res = 0;
+ for (var l = this.length; l--;) res += this[l];
+ return res;
+ }.protect(),
+
+ dot: function(v){
+ return this.times(v).sum();
+ }.protect(),
+
+ cross: function(y){
+ var tmp = this.clone().augment(3);
+ y = y.clone().augment(3);
+ this[0] = tmp[1] * y[2] - tmp[2] * y[1];
+ this[1] = tmp[2] * y[0] - tmp[0] * y[2];
+ this[2] = tmp[0] * y[1] - tmp[1] * y[0];
+ return this;
+ }.protect(),
+
+ abs: function(){
+ return Math.sqrt(this.clone().dot(this.clone()));
+ }.protect(),
+
+ angle: function(v){
+ v = v.clone().norm();
+ var u = this.clone().norm();
+ return Math.acos(u.dot(v));
+ }.protect(),
+
+ norm: function(){
+ return this.times(1 / this.abs());
+ }.protect(),
+
+ clone: function(){
+ return new Vector(this);
+ }.protect()
+
+});
+
+Vector.implement(Array.prototype);
+Array.mirror(Vector);
24 Source/dbg.js
@@ -0,0 +1,24 @@
+(function(){
+ var global = this,
+ realConsole = global.console || null,
+ fn = function(){},
+ disabledConsole = {
+ log: fn,
+ warn: fn,
+ info: fn,
+ enable: function(quiet){
+ global.dbg = realConsole ? realConsole : disabledConsole;
+ if (!quiet) global.dbg.log('dbg enabled.');
+ },
+ disable: function(){
+ global.dbg = disabledConsole;
+ }
+ };
+
+ if (realConsole) {
+ realConsole.disable = disabledConsole.disable;
+ realConsole.enable = disabledConsole.enable;
+ }
+
+ disabledConsole.enable(true);
+}).call(this);
Please sign in to comment.
Something went wrong with that request. Please try again.