initial
This commit is contained in:
Mahdi Dibaiee
parent
edf062d88d
commit
2cff4ee46f
2
.gitignore
vendored
Normal file
2
.gitignore
vendored
Normal file
@ -0,0 +1,2 @@
|
||||
*.swp
|
||||
*.swo
|
||||
BIN
css/imgs/menu.png
Normal file
BIN
css/imgs/menu.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 182 B |
40
css/main.less
Normal file
40
css/main.less
Normal file
@ -0,0 +1,40 @@
|
||||
html, body {
|
||||
margin: 0;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
*::-moz-focus-inner {
|
||||
border: none;
|
||||
}
|
||||
*:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
canvas {
|
||||
border: 1px solid gray;
|
||||
}
|
||||
|
||||
header {
|
||||
width: 100%;
|
||||
height: 5rem;
|
||||
background: #4d4d4d;
|
||||
background: -moz-linear-gradient(top, #4d4d4d 0%, #333333 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4d4d4d), color-stop(100%,#333333));
|
||||
background: -webkit-linear-gradient(top, #4d4d4d 0%,#333333 100%);
|
||||
background: -o-linear-gradient(top, #4d4d4d 0%,#333333 100%);
|
||||
background: -ms-linear-gradient(top, #4d4d4d 0%,#333333 100%);
|
||||
background: linear-gradient(to bottom, #4d4d4d 0%,#333333 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4d4d4d', endColorstr='#333333',GradientType=0 );
|
||||
|
||||
#menu {
|
||||
width: 3rem;
|
||||
height: 5rem;
|
||||
position: relative;
|
||||
lefT: -0.9rem;
|
||||
background: url('imgs/menu.png') center center no-repeat, darken(#4d4d4d, 10%);
|
||||
-moz-appearance: none;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
25
index.html
Normal file
25
index.html
Normal file
@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title></title>
|
||||
<meta charset='UTF-8'>
|
||||
<link rel='stylesheet/less' href='css/main.less'>
|
||||
<script src='js/less-1.5.0.min.js'></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header>
|
||||
<button id='menu'></button>
|
||||
</header>
|
||||
|
||||
<canvas></canvas>
|
||||
|
||||
<script src='js/libs/zepto.min.js'></script>
|
||||
<script src='js/functions.js'></script>
|
||||
<script src='js/main.js'></script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
116
js/functions.js
Normal file
116
js/functions.js
Normal file
@ -0,0 +1,116 @@
|
||||
"use strict";
|
||||
/*** ESSENTIALS ***/
|
||||
|
||||
function sizeAndPos() {
|
||||
|
||||
var data = c.getImageData(0,0, $c.width(), $c.height());
|
||||
var w = $(window).width(),
|
||||
h = $(window).height();
|
||||
$c.css({'margin-left': w * .05,
|
||||
'margin-top': h * .05
|
||||
})
|
||||
$c.attr('width', w * .9);
|
||||
$c.attr('height',h * .9 - 50);
|
||||
c.clearRect(0,0, $c.width(), $c.height());
|
||||
c.putImageData(data, 0, 0);
|
||||
}
|
||||
|
||||
function relative(x,y) {
|
||||
return {
|
||||
x : x - $c.offset().left,
|
||||
y : y - $c.offset().top
|
||||
}
|
||||
}
|
||||
|
||||
function threshold(x1, y1, x2, y2, threshold) {
|
||||
var tr = threshold || 5;
|
||||
if( x1 <= x2 + tr && x1 >= x2 - tr && y1 <= y2 + tr && y1 >= y2 - tr ) return true;
|
||||
return false;
|
||||
}
|
||||
|
||||
function line(x1, y1, x2, y2, opts) {
|
||||
opts = opts || {};
|
||||
c.beginPath();
|
||||
c.lineCap = opts.lineCap || settings.lineCap;
|
||||
c.lineJoin = opts.lineJoin || settings.lineJoin;
|
||||
c.strokeStyle = opts.strokeStyle || settings.strokeStyle;
|
||||
c.lineWidth = opts.lineWidth || settings.lineWidth;
|
||||
c.moveTo(x1, y1);
|
||||
c.lineTo(x2, y2);
|
||||
c.stroke();
|
||||
}
|
||||
|
||||
|
||||
/*** END ***/
|
||||
|
||||
function startPoint(x, y) {
|
||||
|
||||
// If not previous point exists, make the first one.
|
||||
if( !points.length ) points.push({x: x, y: y, type: settings.type, start: {x: x, y: y}});
|
||||
|
||||
var old = points[points.length-1],
|
||||
start = old.start,
|
||||
current = {
|
||||
x : x,
|
||||
y : y,
|
||||
start : old.start || {x: x, y: y},
|
||||
type : settings.type
|
||||
}
|
||||
// Just draws a circle
|
||||
line(x,y,x,y);
|
||||
|
||||
if( old.type == 'line' ) {
|
||||
line(old.x, old.y, x, y);
|
||||
}
|
||||
|
||||
if( points.length > 1 && ((start && threshold(start.x, start.y, x, y)) || threshold(old.x, old.y, x, y, 2)) ) {
|
||||
window.active = false;
|
||||
points[points.length-1].type = '';
|
||||
points[points.length-1].start = undefined;
|
||||
return;
|
||||
}
|
||||
|
||||
points.push(current);
|
||||
}
|
||||
|
||||
function drawPoint(x,y) {
|
||||
var capture = points[points.length-1];
|
||||
|
||||
switch(capture.type) {
|
||||
case 'draw': {
|
||||
line(capture.x, capture.y, x, y);
|
||||
|
||||
var current = {
|
||||
x : x,
|
||||
y : y,
|
||||
start : capture.start,
|
||||
type : capture.type
|
||||
}
|
||||
|
||||
points.push(current);
|
||||
break;
|
||||
}
|
||||
case 'sketch': {
|
||||
line(capture.x, capture.y, x, y);
|
||||
var current = {
|
||||
x : x,
|
||||
y : y,
|
||||
start : capture.start,
|
||||
type : capture.type
|
||||
}
|
||||
points.push(current);
|
||||
|
||||
for( var i = 0, len = points.length-1; i < len; i++ ) {
|
||||
if( threshold(points[i].x, points[i].y, current.x, current.y, 40)) {
|
||||
var x = points[i].x - current.x,
|
||||
y = points[i].y - current.y;
|
||||
|
||||
line(points[i].x - x*0.2, points[i].y - y*0.2, current.x + x*0.2, current.y + y*0.2, {strokeStyle: 'rgba(0,0,0,0.4)', lineWidth: settings.lineWidth/2})
|
||||
}
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
13
js/less-1.5.0.min.js
vendored
Normal file
13
js/less-1.5.0.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
108
js/libs/two.min.js
vendored
Normal file
108
js/libs/two.min.js
vendored
Normal file
@ -0,0 +1,108 @@
|
||||
(function(){var p=this,l=p._,e={},j=Array.prototype,m=Object.prototype,c=j.push,b=j.slice,h=j.concat,x=m.toString,a=m.hasOwnProperty,k=j.forEach,q=j.map,s=j.reduce,f=j.reduceRight,r=j.filter,B=j.every,w=j.some,u=j.indexOf,y=j.lastIndexOf,m=Array.isArray,n=Object.keys,t=Function.prototype.bind,d=function(g){if(g instanceof d)return g;if(!(this instanceof d))return new d(g);this._wrapped=g};"undefined"!==typeof exports?("undefined"!==typeof module&&module.exports&&(exports=module.exports=d),exports._=
|
||||
d):p._=d;d.VERSION="1.5.1";var v=d.each=d.forEach=function(g,a,b){if(null!=g)if(k&&g.forEach===k)g.forEach(a,b);else if(g.length===+g.length)for(var f=0,c=g.length;f<c&&a.call(b,g[f],f,g)!==e;f++);else for(f in g)if(d.has(g,f)&&a.call(b,g[f],f,g)===e)break};d.map=d.collect=function(g,d,a){var b=[];if(null==g)return b;if(q&&g.map===q)return g.map(d,a);v(g,function(g,f,c){b.push(d.call(a,g,f,c))});return b};d.reduce=d.foldl=d.inject=function(g,a,b,f){var c=2<arguments.length;null==g&&(g=[]);if(s&&g.reduce===
|
||||
s)return f&&(a=d.bind(a,f)),c?g.reduce(a,b):g.reduce(a);v(g,function(g,d,n){c?b=a.call(f,b,g,d,n):(b=g,c=!0)});if(!c)throw new TypeError("Reduce of empty array with no initial value");return b};d.reduceRight=d.foldr=function(g,a,b,c){var n=2<arguments.length;null==g&&(g=[]);if(f&&g.reduceRight===f)return c&&(a=d.bind(a,c)),n?g.reduceRight(a,b):g.reduceRight(a);var h=g.length;if(h!==+h)var k=d.keys(g),h=k.length;v(g,function(d,f,t){f=k?k[--h]:--h;n?b=a.call(c,b,g[f],f,t):(b=g[f],n=!0)});if(!n)throw new TypeError("Reduce of empty array with no initial value");
|
||||
return b};d.find=d.detect=function(g,d,a){var b;z(g,function(g,f,c){if(d.call(a,g,f,c))return b=g,!0});return b};d.filter=d.select=function(g,d,a){var b=[];if(null==g)return b;if(r&&g.filter===r)return g.filter(d,a);v(g,function(g,f,c){d.call(a,g,f,c)&&b.push(g)});return b};d.reject=function(g,a,b){return d.filter(g,function(g,d,f){return!a.call(b,g,d,f)},b)};d.every=d.all=function(g,a,b){a||(a=d.identity);var f=!0;if(null==g)return f;if(B&&g.every===B)return g.every(a,b);v(g,function(g,d,c){if(!(f=
|
||||
f&&a.call(b,g,d,c)))return e});return!!f};var z=d.some=d.any=function(g,a,b){a||(a=d.identity);var f=!1;if(null==g)return f;if(w&&g.some===w)return g.some(a,b);v(g,function(g,d,c){if(f||(f=a.call(b,g,d,c)))return e});return!!f};d.contains=d.include=function(g,d){return null==g?!1:u&&g.indexOf===u?-1!=g.indexOf(d):z(g,function(g){return g===d})};d.invoke=function(g,a){var f=b.call(arguments,2),c=d.isFunction(a);return d.map(g,function(g){return(c?a:g[a]).apply(g,f)})};d.pluck=function(g,a){return d.map(g,
|
||||
function(g){return g[a]})};d.where=function(g,a,b){return d.isEmpty(a)?b?void 0:[]:d[b?"find":"filter"](g,function(g){for(var d in a)if(a[d]!==g[d])return!1;return!0})};d.findWhere=function(g,a){return d.where(g,a,!0)};d.max=function(g,a,b){if(!a&&d.isArray(g)&&g[0]===+g[0]&&65535>g.length)return Math.max.apply(Math,g);if(!a&&d.isEmpty(g))return-Infinity;var f={computed:-Infinity,value:-Infinity};v(g,function(g,d,c){d=a?a.call(b,g,d,c):g;d>f.computed&&(f={value:g,computed:d})});return f.value};d.min=
|
||||
function(g,a,b){if(!a&&d.isArray(g)&&g[0]===+g[0]&&65535>g.length)return Math.min.apply(Math,g);if(!a&&d.isEmpty(g))return Infinity;var f={computed:Infinity,value:Infinity};v(g,function(g,d,c){d=a?a.call(b,g,d,c):g;d<f.computed&&(f={value:g,computed:d})});return f.value};d.shuffle=function(g){var a,b=0,f=[];v(g,function(g){a=d.random(b++);f[b-1]=f[a];f[a]=g});return f};var J=function(g){return d.isFunction(g)?g:function(d){return d[g]}};d.sortBy=function(g,a,b){var f=J(a);return d.pluck(d.map(g,function(g,
|
||||
d,a){return{value:g,index:d,criteria:f.call(b,g,d,a)}}).sort(function(g,d){var a=g.criteria,b=d.criteria;if(a!==b){if(a>b||void 0===a)return 1;if(a<b||void 0===b)return-1}return g.index<d.index?-1:1}),"value")};var C=function(g,a,b,f){var c={},n=J(null==a?d.identity:a);v(g,function(d,a){var h=n.call(b,d,a,g);f(c,h,d)});return c};d.groupBy=function(g,a,b){return C(g,a,b,function(g,a,b){(d.has(g,a)?g[a]:g[a]=[]).push(b)})};d.countBy=function(g,a,b){return C(g,a,b,function(g,a){d.has(g,a)||(g[a]=0);
|
||||
g[a]++})};d.sortedIndex=function(g,a,b,f){b=null==b?d.identity:J(b);a=b.call(f,a);for(var c=0,n=g.length;c<n;){var h=c+n>>>1;b.call(f,g[h])<a?c=h+1:n=h}return c};d.toArray=function(g){return!g?[]:d.isArray(g)?b.call(g):g.length===+g.length?d.map(g,d.identity):d.values(g)};d.size=function(g){return null==g?0:g.length===+g.length?g.length:d.keys(g).length};d.first=d.head=d.take=function(g,d,a){return null==g?void 0:null!=d&&!a?b.call(g,0,d):g[0]};d.initial=function(g,d,a){return b.call(g,0,g.length-
|
||||
(null==d||a?1:d))};d.last=function(g,d,a){return null==g?void 0:null!=d&&!a?b.call(g,Math.max(g.length-d,0)):g[g.length-1]};d.rest=d.tail=d.drop=function(g,d,a){return b.call(g,null==d||a?1:d)};d.compact=function(g){return d.filter(g,d.identity)};var D=function(g,a,b){if(a&&d.every(g,d.isArray))return h.apply(b,g);v(g,function(g){d.isArray(g)||d.isArguments(g)?a?c.apply(b,g):D(g,a,b):b.push(g)});return b};d.flatten=function(g,d){return D(g,d,[])};d.without=function(g){return d.difference(g,b.call(arguments,
|
||||
1))};d.uniq=d.unique=function(g,a,b,f){d.isFunction(a)&&(f=b,b=a,a=!1);b=b?d.map(g,b,f):g;var c=[],n=[];v(b,function(b,f){if(a?!f||n[n.length-1]!==b:!d.contains(n,b))n.push(b),c.push(g[f])});return c};d.union=function(){return d.uniq(d.flatten(arguments,!0))};d.intersection=function(g){var a=b.call(arguments,1);return d.filter(d.uniq(g),function(g){return d.every(a,function(a){return 0<=d.indexOf(a,g)})})};d.difference=function(g){var a=h.apply(j,b.call(arguments,1));return d.filter(g,function(g){return!d.contains(a,
|
||||
g)})};d.zip=function(){for(var g=d.max(d.pluck(arguments,"length").concat(0)),a=Array(g),b=0;b<g;b++)a[b]=d.pluck(arguments,""+b);return a};d.object=function(g,d){if(null==g)return{};for(var a={},b=0,f=g.length;b<f;b++)d?a[g[b]]=d[b]:a[g[b][0]]=g[b][1];return a};d.indexOf=function(g,a,b){if(null==g)return-1;var f=0,c=g.length;if(b)if("number"==typeof b)f=0>b?Math.max(0,c+b):b;else return f=d.sortedIndex(g,a),g[f]===a?f:-1;if(u&&g.indexOf===u)return g.indexOf(a,b);for(;f<c;f++)if(g[f]===a)return f;
|
||||
return-1};d.lastIndexOf=function(g,d,a){if(null==g)return-1;var b=null!=a;if(y&&g.lastIndexOf===y)return b?g.lastIndexOf(d,a):g.lastIndexOf(d);for(a=b?a:g.length;a--;)if(g[a]===d)return a;return-1};d.range=function(g,d,a){1>=arguments.length&&(d=g||0,g=0);a=arguments[2]||1;for(var b=Math.max(Math.ceil((d-g)/a),0),f=0,c=Array(b);f<b;)c[f++]=g,g+=a;return c};var L=function(){};d.bind=function(g,a){var f,c;if(t&&g.bind===t)return t.apply(g,b.call(arguments,1));if(!d.isFunction(g))throw new TypeError;
|
||||
f=b.call(arguments,2);return c=function(){if(!(this instanceof c))return g.apply(a,f.concat(b.call(arguments)));L.prototype=g.prototype;var d=new L;L.prototype=null;var n=g.apply(d,f.concat(b.call(arguments)));return Object(n)===n?n:d}};d.partial=function(d){var a=b.call(arguments,1);return function(){return d.apply(this,a.concat(b.call(arguments)))}};d.bindAll=function(a){var f=b.call(arguments,1);if(0===f.length)throw Error("bindAll must be passed function names");v(f,function(b){a[b]=d.bind(a[b],
|
||||
a)});return a};d.memoize=function(a,b){var f={};b||(b=d.identity);return function(){var c=b.apply(this,arguments);return d.has(f,c)?f[c]:f[c]=a.apply(this,arguments)}};d.delay=function(a,d){var f=b.call(arguments,2);return setTimeout(function(){return a.apply(null,f)},d)};d.defer=function(a){return d.delay.apply(d,[a,1].concat(b.call(arguments,1)))};d.throttle=function(a,d,b){var f,c,n,h=null,k=0;b||(b={});var t=function(){k=!1===b.leading?0:new Date;h=null;n=a.apply(f,c)};return function(){var e=
|
||||
new Date;!k&&!1===b.leading&&(k=e);var m=d-(e-k);f=this;c=arguments;0>=m?(clearTimeout(h),h=null,k=e,n=a.apply(f,c)):!h&&!1!==b.trailing&&(h=setTimeout(t,m));return n}};d.debounce=function(a,d,b){var f,c=null;return function(){var n=this,h=arguments,k=b&&!c;clearTimeout(c);c=setTimeout(function(){c=null;b||(f=a.apply(n,h))},d);k&&(f=a.apply(n,h));return f}};d.once=function(a){var d=!1,b;return function(){if(d)return b;d=!0;b=a.apply(this,arguments);a=null;return b}};d.wrap=function(a,d){return function(){var b=
|
||||
[a];c.apply(b,arguments);return d.apply(this,b)}};d.compose=function(){var a=arguments;return function(){for(var d=arguments,b=a.length-1;0<=b;b--)d=[a[b].apply(this,d)];return d[0]}};d.after=function(a,d){return function(){if(1>--a)return d.apply(this,arguments)}};d.keys=n||function(a){if(a!==Object(a))throw new TypeError("Invalid object");var b=[],f;for(f in a)d.has(a,f)&&b.push(f);return b};d.values=function(a){var b=[],f;for(f in a)d.has(a,f)&&b.push(a[f]);return b};d.pairs=function(a){var b=
|
||||
[],f;for(f in a)d.has(a,f)&&b.push([f,a[f]]);return b};d.invert=function(a){var b={},f;for(f in a)d.has(a,f)&&(b[a[f]]=f);return b};d.functions=d.methods=function(a){var b=[],f;for(f in a)d.isFunction(a[f])&&b.push(f);return b.sort()};d.extend=function(a){v(b.call(arguments,1),function(d){if(d)for(var b in d)a[b]=d[b]});return a};d.pick=function(a){var d={},f=h.apply(j,b.call(arguments,1));v(f,function(b){b in a&&(d[b]=a[b])});return d};d.omit=function(a){var f={},c=h.apply(j,b.call(arguments,1)),
|
||||
n;for(n in a)d.contains(c,n)||(f[n]=a[n]);return f};d.defaults=function(a){v(b.call(arguments,1),function(d){if(d)for(var b in d)void 0===a[b]&&(a[b]=d[b])});return a};d.clone=function(a){return!d.isObject(a)?a:d.isArray(a)?a.slice():d.extend({},a)};d.tap=function(a,d){d(a);return a};var M=function(a,b,f,c){if(a===b)return 0!==a||1/a==1/b;if(null==a||null==b)return a===b;a instanceof d&&(a=a._wrapped);b instanceof d&&(b=b._wrapped);var n=x.call(a);if(n!=x.call(b))return!1;switch(n){case "[object String]":return a==
|
||||
String(b);case "[object Number]":return a!=+a?b!=+b:0==a?1/a==1/b:a==+b;case "[object Date]":case "[object Boolean]":return+a==+b;case "[object RegExp]":return a.source==b.source&&a.global==b.global&&a.multiline==b.multiline&&a.ignoreCase==b.ignoreCase}if("object"!=typeof a||"object"!=typeof b)return!1;for(var h=f.length;h--;)if(f[h]==a)return c[h]==b;var h=a.constructor,k=b.constructor;if(h!==k&&(!d.isFunction(h)||!(h instanceof h&&d.isFunction(k)&&k instanceof k)))return!1;f.push(a);c.push(b);h=
|
||||
0;k=!0;if("[object Array]"==n){if(h=a.length,k=h==b.length)for(;h--&&(k=M(a[h],b[h],f,c)););}else{for(var t in a)if(d.has(a,t)&&(h++,!(k=d.has(b,t)&&M(a[t],b[t],f,c))))break;if(k){for(t in b)if(d.has(b,t)&&!h--)break;k=!h}}f.pop();c.pop();return k};d.isEqual=function(a,d){return M(a,d,[],[])};d.isEmpty=function(a){if(null==a)return!0;if(d.isArray(a)||d.isString(a))return 0===a.length;for(var b in a)if(d.has(a,b))return!1;return!0};d.isElement=function(a){return!!(a&&1===a.nodeType)};d.isArray=m||
|
||||
function(a){return"[object Array]"==x.call(a)};d.isObject=function(a){return a===Object(a)};v("Arguments Function String Number Date RegExp".split(" "),function(a){d["is"+a]=function(d){return x.call(d)=="[object "+a+"]"}});d.isArguments(arguments)||(d.isArguments=function(a){return!(!a||!d.has(a,"callee"))});"function"!==typeof/./&&(d.isFunction=function(a){return"function"===typeof a});d.isFinite=function(a){return isFinite(a)&&!isNaN(parseFloat(a))};d.isNaN=function(a){return d.isNumber(a)&&a!=
|
||||
+a};d.isBoolean=function(a){return!0===a||!1===a||"[object Boolean]"==x.call(a)};d.isNull=function(a){return null===a};d.isUndefined=function(a){return void 0===a};d.has=function(d,b){return a.call(d,b)};d.noConflict=function(){p._=l;return this};d.identity=function(a){return a};d.times=function(a,d,b){for(var f=Array(Math.max(0,a)),c=0;c<a;c++)f[c]=d.call(b,c);return f};d.random=function(a,d){null==d&&(d=a,a=0);return a+Math.floor(Math.random()*(d-a+1))};var K={escape:{"&":"&","<":"<",">":">",
|
||||
'"':""","'":"'","/":"/"}};K.unescape=d.invert(K.escape);var S={escape:RegExp("["+d.keys(K.escape).join("")+"]","g"),unescape:RegExp("("+d.keys(K.unescape).join("|")+")","g")};d.each(["escape","unescape"],function(a){d[a]=function(d){return null==d?"":(""+d).replace(S[a],function(d){return K[a][d]})}});d.result=function(a,b){if(null!=a){var f=a[b];return d.isFunction(f)?f.call(a):f}};d.mixin=function(a){v(d.functions(a),function(b){var f=d[b]=a[b];d.prototype[b]=function(){var a=[this._wrapped];
|
||||
c.apply(a,arguments);a=f.apply(d,a);return this._chain?d(a).chain():a}})};var T=0;d.uniqueId=function(a){var d=++T+"";return a?a+d:d};d.templateSettings={evaluate:/<%([\s\S]+?)%>/g,interpolate:/<%=([\s\S]+?)%>/g,escape:/<%-([\s\S]+?)%>/g};var N=/(.)^/,U={"'":"'","\\":"\\","\r":"r","\n":"n","\t":"t","\u2028":"u2028","\u2029":"u2029"},G=/\\|'|\r|\n|\t|\u2028|\u2029/g;d.template=function(a,b,f){var c;f=d.defaults({},f,d.templateSettings);var n=RegExp([(f.escape||N).source,(f.interpolate||N).source,(f.evaluate||
|
||||
N).source].join("|")+"|$","g"),h=0,k="__p+='";a.replace(n,function(d,b,f,c,n){k+=a.slice(h,n).replace(G,function(a){return"\\"+U[a]});b&&(k+="'+\n((__t=("+b+"))==null?'':_.escape(__t))+\n'");f&&(k+="'+\n((__t=("+f+"))==null?'':__t)+\n'");c&&(k+="';\n"+c+"\n__p+='");h=n+d.length;return d});k+="';\n";f.variable||(k="with(obj||{}){\n"+k+"}\n");k="var __t,__p='',__j=Array.prototype.join,print=function(){__p+=__j.call(arguments,'');};\n"+k+"return __p;\n";try{c=new Function(f.variable||"obj","_",k)}catch(t){throw t.source=
|
||||
k,t;}if(b)return c(b,d);b=function(a){return c.call(this,a,d)};b.source="function("+(f.variable||"obj")+"){\n"+k+"}";return b};d.chain=function(a){return d(a).chain()};d.mixin(d);v("pop push reverse shift sort splice unshift".split(" "),function(a){var b=j[a];d.prototype[a]=function(){var f=this._wrapped;b.apply(f,arguments);("shift"==a||"splice"==a)&&0===f.length&&delete f[0];return this._chain?d(f).chain():f}});v(["concat","join","slice"],function(a){var b=j[a];d.prototype[a]=function(){var a=b.apply(this._wrapped,
|
||||
arguments);return this._chain?d(a).chain():a}});d.extend(d.prototype,{chain:function(){this._chain=!0;return this},value:function(){return this._wrapped}})}).call(this);var Backbone=Backbone||{};
|
||||
(function(){var p=[].slice,l=function(e,m,c){var b;e=-1;var h=m.length;switch(c.length){case 0:for(;++e<h;)(b=m[e]).callback.call(b.ctx);break;case 1:for(;++e<h;)(b=m[e]).callback.call(b.ctx,c[0]);break;case 2:for(;++e<h;)(b=m[e]).callback.call(b.ctx,c[0],c[1]);break;case 3:for(;++e<h;)(b=m[e]).callback.call(b.ctx,c[0],c[1],c[2]);break;default:for(;++e<h;)(b=m[e]).callback.apply(b.ctx,c)}},e=Backbone.Events={on:function(e,m,c){this._events||(this._events={});(this._events[e]||(this._events[e]=[])).push({callback:m,
|
||||
context:c,ctx:c||this});return this},once:function(e,m,c){var b=this,h=_.once(function(){b.off(e,h);m.apply(this,arguments)});h._callback=m;this.on(e,h,c);return this},off:function(e,m,c){var b,h,x,a,k,q,s,f;if(!this._events)return this;if(!e&&!m&&!c)return this._events={},this;a=e?[e]:_.keys(this._events);k=0;for(q=a.length;k<q;k++)if(e=a[k],b=this._events[e]){x=[];if(m||c){s=0;for(f=b.length;s<f;s++)h=b[s],(m&&m!==(h.callback._callback||h.callback)||c&&c!==h.context)&&x.push(h)}this._events[e]=
|
||||
x}return this},trigger:function(e){if(!this._events)return this;var m=p.call(arguments,1),c=this._events[e],b=this._events.all;c&&l(this,c,m);b&&l(this,b,arguments);return this},listenTo:function(e,m,c){var b=this._listeners||(this._listeners={}),h=e._listenerId||(e._listenerId=_.uniqueId("l"));b[h]=e;e.on(m,c||this,this);return this},stopListening:function(e,m,c){var b=this._listeners;if(b){if(e)e.off(m,c,this),!m&&!c&&delete b[e._listenerId];else{for(var h in b)b[h].off(null,null,this);this._listeners=
|
||||
{}}return this}}};e.bind=e.on;e.unbind=e.off;"undefined"!==typeof exports&&("undefined"!==typeof module&&module.exports&&(exports=module.exports=e),exports.Backbone=exports.Backbone||Backbone)})();(function(){function p(c){var b=(new Date).getTime(),h=Math.max(0,16-(b-e)),m=l.setTimeout(function(){c(b+h)},h);e=b+h;return m}var l=this,e=0,j=["ms","moz","webkit","o"];if("undefined"!==typeof exports)"undefined"!==typeof module&&module.exports&&(exports=module.exports=p),exports.requestAnimationFrame=p;else{for(var m=0;m<j.length&&!l.requestAnimationFrame;++m)l.requestAnimationFrame=l[j[m]+"RequestAnimationFrame"],l.cancelAnimationFrame=l[j[m]+"CancelAnimationFrame"]||l[j[m]+"CancelRequestAnimationFrame"];
|
||||
l.requestAnimationFrame||(l.requestAnimationFrame=p);l.cancelAnimationFrame||(l.cancelAnimationFrame=function(c){clearTimeout(c)})}})();(function(){function p(){var a=document.body.getBoundingClientRect(),b=this.width=a.width,a=this.height=a.height;this.renderer.setSize(b,a);this.trigger(f.Events.resize,b,a)}var l=this,e=l.Two||{},j=Math.sin,m=Math.cos,c=Math.atan2,b=Math.sqrt,h=Math.abs,x=Math.PI,a=2*x,k=x/2,q=Math.pow,s={hasEventListeners:_.isFunction(l.addEventListener),bind:function(a,b,d,f){this.hasEventListeners?a.addEventListener(b,d,!!f):a.attachEvent("on"+b,d);return this},unbind:function(a,b,d,f){this.hasEventListeners?
|
||||
a.removeEventListeners(b,d,!!f):a.detachEvent("on"+b,d);return this}},f=l.Two=function(a){a=_.defaults(a||{},{fullscreen:!1,width:640,height:480,type:f.Types.svg,autostart:!1});this.type=a.type;this.renderer=new f[this.type](this);f.Utils.setPlaying.call(this,a.autostart);this.frameCount=0;a.fullscreen?(a=_.bind(p,this),_.extend(document.body.style,{overflow:"hidden",margin:0,padding:0,top:0,left:0,right:0,bottom:0,position:"fixed"}),_.extend(this.renderer.domElement.style,{display:"block",top:0,
|
||||
left:0,right:0,bottom:0,position:"fixed"}),s.bind(l,"resize",a),a()):(this.renderer.setSize(a.width,a.height),this.width=a.width,this.height=a.height);this.scene=new f.Group;this.renderer.add(this.scene);f.Instances.push(this)};_.extend(f,{Array:l.Float32Array||Array,Types:{webgl:"WebGLRenderer",svg:"SVGRenderer",canvas:"CanvasRenderer"},Version:"v0.2.1",Properties:{hierarchy:"hierarchy",demotion:"demotion"},Events:{play:"play",pause:"pause",update:"update",render:"render",resize:"resize",change:"change",
|
||||
remove:"remove",insert:"insert"},Resolution:8,Instances:[],noConflict:function(){l.Two=e;return this},Utils:{Curve:{CollinearityEpsilon:q(10,-30),RecursionLimit:16,CuspLimit:0,Tolerance:{distance:0.25,angle:0,epsilon:0.01}},setPlaying:function(a){_.defer(_.bind(function(){this.playing=!!a},this))},getComputedMatrix:function(a){for(var b=new f.Matrix;a&&a._matrix;){var d=a._matrix.elements;b.multiply(d[0],d[1],d[2],d[3],d[4],d[5],d[6],d[7],d[8],d[9]);a=a.parent}return b},applySvgAttributes:function(a,
|
||||
b){b.cap="butt";b.join="bevel";_.each(a.attributes,function(a){switch(a.nodeName){case "visibility":b.visible=!!a.nodeValue;break;case "stroke-linecap":b.cap=a.nodeValue;break;case "stroke-linejoin":b.join=a.nodeValue;break;case "stroke-miterlimit":b.miter=a.nodeValue;break;case "stroke-width":b.linewidth=parseFloat(a.nodeValue);break;case "stroke-opacity":case "fill-opacity":b.opacity=a.nodeValue;break;case "fill":b.fill=a.nodeValue;break;case "stroke":b.stroke=a.nodeValue}});return b},read:{svg:function(){return f.Utils.read.g.apply(this,
|
||||
arguments)},g:function(a){var b=new f.Group;this.add(b);_.each(a.childNodes,function(a){if(a.localName){var c=a.localName.toLowerCase();c in f.Utils.read&&(a=f.Utils.read[c].call(this,a),b.add(a))}},this);return f.Utils.applySvgAttributes(a,b)},polygon:function(a,b){var d=a.points;if(d){var c=_.map(_.range(d.numberOfItems),function(a){a=d.getItem(a);return new f.Vector(a.x,a.y)}),c=(new f.Polygon(c,!b)).noStroke();return f.Utils.applySvgAttributes(a,c)}},polyline:function(a){return f.Utils.read.polygon(a,
|
||||
!0)},path:function(a){var b=a.getAttribute("d"),b=_.flatten(_.map(_.compact(b.split(/M/g)),function(a){a=_.map(_.compact(a.split(/m/g)),function(a,b){return 0>=b?a:"m"+a});a[0]="M"+a[0];return a})),d=new f.Vector,c=new f.Vector,b=_.map(b,function(b){var h,k=!1,e=!1;b=_.flatten(_.map(b.match(/[a-z][^a-z]*/ig),function(a){var b,n,m=a[0],t=m.toLowerCase();h=a.slice(1).trim().split(/[\s,]+|(?=[+\-])/);k=m===t;var q,j,s;switch(t){case "z":e=!0;break;case "m":case "l":n=parseFloat(h[0]);b=parseFloat(h[1]);
|
||||
b=new f.Vector(n,b);k&&b.addSelf(d);d.copy(b);break;case "h":case "v":n="h"===t?"x":"y";a="x"===n?"y":"x";b=new f.Vector;b[n]=parseFloat(h[0]);b[a]=d[a];k&&(b[n]+=d[n]);d.copy(b);break;case "s":case "c":b=d.x;a=d.y;"c"===t?(m=parseFloat(h[0]),n=parseFloat(h[1]),t=parseFloat(h[2]),q=parseFloat(h[3]),j=parseFloat(h[4]),s=parseFloat(h[5])):(q=f.Utils.getReflection(d,c,k),m=q.x,n=q.y,t=parseFloat(h[0]),q=parseFloat(h[1]),j=parseFloat(h[2]),s=parseFloat(h[3]));k&&(m+=b,n+=a,t+=b,q+=a,j+=b,s+=a);b=f.Utils.subdivide(b,
|
||||
a,m,n,t,q,j,s);d.set(j,s);c.set(t,q);(n=b[b.length-1])&&!n.equals(d)&&b.push(d.clone());break;case "t":case "q":b=d.x;a=d.y;c.isZero()?(m=b,n=a):(m=c.x,a=c.y);"q"===t?(t=parseFloat(h[0]),q=parseFloat(h[1]),j=parseFloat(h[1]),s=parseFloat(h[2])):(q=f.Utils.getReflection(d,c,k),t=q.x,q=q.y,j=parseFloat(h[0]),s=parseFloat(h[1]));k&&(m+=b,n+=a,t+=b,q+=a,j+=b,s+=a);b=f.Utils.subdivide(b,a,m,n,t,q,j,s);d.set(j,s);c.set(t,q);n=b[b.length-1];n.equals(d)||b.push(d.clone());break;case "a":throw new f.Utils.Error("not yet able to interpret Elliptical Arcs.");
|
||||
}return b}));if(!(1>=b.length))return b=_.compact(b),b=(new f.Polygon(b,e)).noStroke(),f.Utils.applySvgAttributes(a,b)});return _.compact(b)},circle:function(b){var c=parseFloat(b.getAttribute("cx")),d=parseFloat(b.getAttribute("cy")),h=parseFloat(b.getAttribute("r")),k=f.Resolution,e=_.map(_.range(k),function(b){var d=b/k*a;b=h*m(d);d=h*j(d);return new f.Vector(b,d)},this),e=(new f.Polygon(e,!0,!0)).noStroke();e.translation.set(c,d);return f.Utils.applySvgAttributes(b,e)},ellipse:function(b){var c=
|
||||
parseFloat(b.getAttribute("cx")),d=parseFloat(b.getAttribute("cy")),h=parseFloat(b.getAttribute("rx")),k=parseFloat(b.getAttribute("ry")),e=f.Resolution,q=_.map(_.range(e),function(b){var d=b/e*a;b=h*m(d);d=k*j(d);return new f.Vector(b,d)},this),q=(new f.Polygon(q,!0,!0)).noStroke();q.translation.set(c,d);return f.Utils.applySvgAttributes(b,q)},rect:function(a){var b=parseFloat(a.getAttribute("x")),d=parseFloat(a.getAttribute("y")),c=parseFloat(a.getAttribute("width")),h=parseFloat(a.getAttribute("height")),
|
||||
c=c/2,h=h/2,k=[new f.Vector(c,h),new f.Vector(-c,h),new f.Vector(-c,-h),new f.Vector(c,-h)],k=(new f.Polygon(k,!0)).noStroke();k.translation.set(b+c,d+h);return f.Utils.applySvgAttributes(a,k)},line:function(a){var b=parseFloat(a.getAttribute("x1")),d=parseFloat(a.getAttribute("y1")),c=parseFloat(a.getAttribute("x2")),h=parseFloat(a.getAttribute("y2")),c=(c-b)/2,h=(h-d)/2,k=[new f.Vector(-c,-h),new f.Vector(c,h)],k=(new f.Polygon(k)).noFill();k.translation.set(b+c,d+h);return f.Utils.applySvgAttributes(a,
|
||||
k)}},subdivide:function(b,k,d,e,m,q,j,s,l){var r=f.Utils.Curve.CollinearityEpsilon,B=f.Utils.Curve.RecursionLimit,u=f.Utils.Curve.CuspLimit,w=f.Utils.Curve.Tolerance,p;l=l||0;if(l>B)return[];var B=(b+d)/2,y=(k+e)/2,G=(d+m)/2,g=(e+q)/2,O=(m+j)/2,P=(q+s)/2,Q=(B+G)/2,R=(y+g)/2,G=(G+O)/2,g=(g+P)/2,E=(Q+G)/2,F=(R+g)/2;p=j-b;var A=s-k,H=h((d-j)*A-(e-s)*p),I=h((m-j)*A-(q-s)*p);if(0<l){if(H>r&&I>r&&(H+I)*(H+I)<=w.distance*(p*p+A*A)){if(w.angle<w.epsilon)return[new f.Vector(E,F)];p=c(q-e,m-d);r=h(p-c(e-k,
|
||||
d-b));p=h(c(s-q,j-m)-p);r>=x&&(r=a-r);p>=x&&(p=a-p);if(r+p<w.angle)return[new f.Vector(E,F)];if(0!==u){if(r>u)return[new f.Vector(d,e)];if(p>u)return[new f.Vector(m,q)]}}}else if(H>r)if(H*H<=w.distance*(p*p+A*A)){if(w.angle<w.epsilon)return[new f.Vector(E,F)];r=h(c(q-e,m-d)-c(e-k,d-b));r>=x&&(r=a-r);if(r<w.angle)return[new f.Vector(d,e),new f.Vector(m,q)];if(0!==u&&r>u)return[new f.Vector(d,e)]}else if(I>r){if(I*I<=w.distance*(p*p+A*A)){if(w.angle<w.epsilon)return[new f.Vector(E,F)];r=h(c(s-q,j-m)-
|
||||
c(q-e,m-d));r>=x&&(r=a-r);if(r<w.angle)return[new f.Vector(d,e),new f.Vector(m,q)];if(0!==u&&r>u)return[new f.Vector2(m,q)]}}else if(p=E-(b+j)/2,A=F-(k+s)/2,p*p+A*A<=w.distance)return[new f.Vector(E,F)];return f.Utils.subdivide(b,k,B,y,Q,R,E,F,l+1).concat(f.Utils.subdivide(E,F,G,g,O,P,j,s,l+1))},getCurveFromPoints:function(a,b){for(var d=[],f=a.length,c=f-1,h=0;h<f;h++){var k=a[h],e={x:k.x,y:k.y};d.push(e);var k=b?y(h-1,f):Math.max(h-1,0),m=b?y(h+1,f):Math.min(h+1,c);u(a[k],e,a[m]);!e.u.x&&!e.u.y&&
|
||||
(e.u.x=e.x,e.u.y=e.y);!e.v.x&&!e.v.y&&(e.v.x=e.x,e.v.y=e.y)}return d},getControlPoints:function(a,b,d){var f=w(a,b),c=w(d,b);a=r(a,b);d=r(d,b);var h=(f+c)/2;if(1E-4>a||1E-4>d)return b.u={x:b.x,y:b.y},b.v={x:b.x,y:b.y},b;a*=0.33;d*=0.33;h=c<f?h+k:h-k;f={x:b.x+m(h)*a,y:b.y+j(h)*a};h-=x;c={x:b.x+m(h)*d,y:b.y+j(h)*d};b.u=f;b.v=c;return b},getReflection:function(a,b,d){var c=a.distanceTo(b);if(1E-4>=c)return d?new f.Vector:a.clone();b=w(a,b);return new f.Vector(c*Math.cos(b)+(d?0:a.x),c*Math.sin(b)+(d?
|
||||
0:a.y))},angleBetween:function(a,b){return c(a.y-b.y,a.x-b.x)},distanceBetweenSquared:function(a,b){var d=a.x-b.x,f=a.y-b.y;return d*d+f*f},distanceBetween:function(a,f){return b(B(a,f))},mod:function(a,b){for(;0>a;)a+=b;return a%b},Collection:function(){Array.call(this);1<arguments.length?Array.prototype.push.apply(this,arguments):arguments[0]&&Array.isArray(arguments[0])&&Array.prototype.push.apply(this,arguments[0])},Error:function(a){this.name="two.js";this.message=a}}});f.Utils.Error.prototype=
|
||||
Error();f.Utils.Error.prototype.constructor=f.Utils.Error;f.Utils.Collection.prototype=[];f.Utils.Collection.constructor=f.Utils.Collection;_.extend(f.Utils.Collection.prototype,Backbone.Events,{pop:function(){var a=Array.prototype.pop.apply(this,arguments);this.trigger(f.Events.remove,[a]);return a},shift:function(){var a=Array.prototype.shift.apply(this,arguments);this.trigger(f.Events.remove,[a]);return a},push:function(){var a=Array.prototype.push.apply(this,arguments);this.trigger(f.Events.insert,
|
||||
arguments);return a},unshift:function(){var a=Array.prototype.unshift.apply(this,arguments);this.trigger(f.Events.insert,arguments);return a},splice:function(){var a=Array.prototype.splice.apply(this,arguments),b;this.trigger(f.Events.remove,a);2<arguments.length&&(b=this.slice(arguments[0],arguments.length-2),this.trigger(f.Events.insert,b));return a}});var r=f.Utils.distanceBetween,B=f.Utils.distanceBetweenSquared,w=f.Utils.angleBetween,u=f.Utils.getControlPoints,y=f.Utils.mod;_.extend(f.prototype,
|
||||
Backbone.Events,{appendTo:function(a){a.appendChild(this.renderer.domElement);return this},play:function(){f.Utils.setPlaying.call(this,!0);return this.trigger(f.Events.play)},pause:function(){this.playing=!1;return this.trigger(f.Events.pause)},update:function(){_.defer(_.bind(function(){var a=!!this._lastFrame,b=(l.performance&&l.performance.now?l.performance:Date).now();this.frameCount++;a&&(this.timeDelta=parseFloat((b-this._lastFrame).toFixed(3)));this._lastFrame=b;var a=this.width,b=this.height,
|
||||
d=this.renderer;(a!==d.width||b!==d.height)&&d.setSize(a,b);this.trigger(f.Events.update,this.frameCount,this.timeDelta);this.render()},this));return this},render:function(){this.renderer.render();return this.trigger(f.Events.render,this.frameCount)},add:function(a){var b=a;_.isArray(a)||(b=_.toArray(arguments));this.scene.add(b);return this},remove:function(a){var b=a;_.isArray(a)||(b=_.toArray(arguments));this.scene.remove(b);return this},clear:function(){_.each(this.scene.children,function(a){a.remove()});
|
||||
return this},makeLine:function(a,b,d,c){d=(d-a)/2;c=(c-b)/2;var h=[new f.Vector(-d,-c),new f.Vector(d,c)],h=(new f.Polygon(h)).noFill();h.translation.set(a+d,b+c);this.scene.add(h);return h},makeRectangle:function(a,b,d,c){d/=2;c/=2;c=[new f.Vector(d,c),new f.Vector(-d,c),new f.Vector(-d,-c),new f.Vector(d,-c)];c=new f.Polygon(c,!0);c.translation.set(a,b);this.scene.add(c);return c},makeCircle:function(a,b,d){return this.makeEllipse(a,b,d,d)},makeEllipse:function(b,c,d,h){var k=f.Resolution,e=_.map(_.range(k),
|
||||
function(b){var c=b/k*a;b=d*m(c);c=h*j(c);return new f.Vector(b,c)},this),e=new f.Polygon(e,!0,!0);e.translation.set(b,c);this.scene.add(e);return e},makeCurve:function(a){var b=arguments.length,d=a;if(!_.isArray(a))for(var d=[],c=0;c<b;c+=2){var h=arguments[c];if(!_.isNumber(h))break;d.push(new f.Vector(h,arguments[c+1]))}var b=arguments[b-1],d=new f.Polygon(d,!(_.isBoolean(b)&&b),!0),b=d.getBoundingClientRect(),k=b.left+b.width/2,e=b.top+b.height/2;_.each(d.vertices,function(a){a.x-=k;a.y-=e});
|
||||
d.translation.set(k,e);this.scene.add(d);return d},makePolygon:function(a){var b=arguments.length,d=a;if(!_.isArray(a))for(var d=[],c=0;c<b;c+=2){var h=arguments[c];if(!_.isNumber(h))break;d.push(new f.Vector(h,arguments[c+1]))}b=arguments[b-1];d=new f.Polygon(d,!(_.isBoolean(b)&&b));b=d.getBoundingClientRect();d.center().translation.set(b.left+b.width/2,b.top+b.height/2);this.scene.add(d);return d},makeGroup:function(a){var b=a;_.isArray(a)||(b=_.toArray(arguments));var d=new f.Group;this.scene.add(d);
|
||||
d.add(b);return d},interpret:function(a){var b=a.tagName.toLowerCase();if(!(b in f.Utils.read))return null;a=f.Utils.read[b].call(this,a);this.add(a);return a}});(function(){_.each(f.Instances,function(a){a.playing&&a.update()});requestAnimationFrame(arguments.callee)})();"function"===typeof define&&define.amd?define(function(){return f}):"undefined"!=typeof module&&module.exports&&(module.exports=f)})();(function(){var p=Two.Vector=function(e,j){this.x=e||0;this.y=j||0};_.extend(p,{MakeGetterSetter:function(e,j,m){var c="_"+j;Object.defineProperty(e,j,{get:function(){return this[c]},set:function(b){this[c]=b;this.trigger(Two.Events.change,j)}});e[c]=m}});_.extend(p.prototype,Backbone.Events,{set:function(e,j){this.x=e;this.y=j;return this},copy:function(e){this.x=e.x;this.y=e.y;return this},clear:function(){this.y=this.x=0;return this},clone:function(){return new p(this.x,this.y)},add:function(e,
|
||||
j){this.x=e.x+j.x;this.y=e.y+j.y;return this},addSelf:function(e){this.x+=e.x;this.y+=e.y;return this},sub:function(e,j){this.x=e.x-j.x;this.y=e.y-j.y;return this},subSelf:function(e){this.x-=e.x;this.y-=e.y;return this},multiplySelf:function(e){this.x*=e.x;this.y*=e.y;return this},multiplyScalar:function(e){this.x*=e;this.y*=e;return this},divideScalar:function(e){e?(this.x/=e,this.y/=e):this.set(0,0);return this},negate:function(){return this.multiplyScalar(-1)},dot:function(e){return this.x*e.x+
|
||||
this.y*e.y},lengthSquared:function(){return this.x*this.x+this.y*this.y},length:function(){return Math.sqrt(this.lengthSquared())},normalize:function(){return this.divideScalar(this.length())},distanceTo:function(e){return Math.sqrt(this.distanceToSquared(e))},distanceToSquared:function(e){var j=this.x-e.x;e=this.y-e.y;return j*j+e*e},setLength:function(e){return this.normalize().multiplyScalar(e)},equals:function(e){return 1E-4>this.distanceTo(e)},lerp:function(e,j){return this.set((e.x-this.x)*
|
||||
j+this.x,(e.y-this.y)*j+this.y)},isZero:function(){return 1E-4>this.length()}});var l={set:function(e,j){this._x=e;this._y=j;return this.trigger(Two.Events.change)},copy:function(e){this._x=e.x;this._y=e.y;return this.trigger(Two.Events.change)},clear:function(){this._y=this._x=0;return this.trigger(Two.Events.change)},clone:function(){return new p(this._x,this._y)},add:function(e,j){this._x=e.x+j.x;this._y=e.y+j.y;return this.trigger(Two.Events.change)},addSelf:function(e){this._x+=e.x;this._y+=
|
||||
e.y;return this.trigger(Two.Events.change)},sub:function(e,j){this._x=e.x-j.x;this._y=e.y-j.y;return this.trigger(Two.Events.change)},subSelf:function(e){this._x-=e.x;this._y-=e.y;return this.trigger(Two.Events.change)},multiplySelf:function(e){this._x*=e.x;this._y*=e.y;return this.trigger(Two.Events.change)},multiplyScalar:function(e){this._x*=e;this._y*=e;return this.trigger(Two.Events.change)},divideScalar:function(e){return e?(this._x/=e,this._y/=e,this.trigger(Two.Events.change)):this.clear()},
|
||||
negate:function(){return this.multiplyScalar(-1)},dot:function(e){return this._x*e.x+this._y*e.y},lengthSquared:function(){return this._x*this._x+this._y*this._y},length:function(){return Math.sqrt(this.lengthSquared())},normalize:function(){return this.divideScalar(this.length())},distanceTo:function(e){return Math.sqrt(this.distanceToSquared(e))},distanceToSquared:function(e){var j=this._x-e.x;e=this._y-e.y;return j*j+e*e},setLength:function(e){return this.normalize().multiplyScalar(e)},equals:function(e){return 1E-4>
|
||||
this.distanceTo(e)},lerp:function(e,j){return this.set((e.x-this._x)*j+this._x,(e.y-this._y)*j+this._y)},isZero:function(){return 1E-4>this.length()}};Two.Vector.prototype.bind=Two.Vector.prototype.on=function(){this._bound||(Two.Vector.MakeGetterSetter(this,"x",this.x),Two.Vector.MakeGetterSetter(this,"y",this.y),_.extend(this,l),this._bound=!0);Backbone.Events.bind.apply(this,arguments);return this}})();(function(){_.range(6);var p=Math.cos,l=Math.sin,e=Math.tan,j=Two.Matrix=function(e,c,b,h,j,a){this.elements=new Two.Array(9);var k=e;_.isArray(k)||(k=_.toArray(arguments));this.identity().set(k)};_.extend(j,{Identity:[1,0,0,0,1,0,0,0,1],Multiply:function(e,c){if(3>=c.length){var b=c[0]||0,h=c[1]||0,j=c[2]||0;return{x:e[0]*b+e[1]*h+e[2]*j,y:e[3]*b+e[4]*h+e[5]*j,z:e[6]*b+e[7]*h+e[8]*j}}var b=e[0],h=e[1],j=e[2],a=e[3],k=e[4],q=e[5],s=e[6],f=e[7],r=e[8],l=c[0],p=c[1],u=c[2],y=c[3],n=c[4],t=c[5],d=c[6],
|
||||
v=c[7],z=c[8];return[b*l+h*y+j*d,b*p+h*n+j*v,b*u+h*t+j*z,a*l+k*y+q*d,a*p+k*n+q*v,a*u+k*t+q*z,s*l+f*y+r*d,s*p+f*n+r*v,s*u+f*t+r*z]}});_.extend(j.prototype,Backbone.Events,{set:function(e,c,b,h,j,a){var k=e;_.isArray(k)||(k=_.toArray(arguments));_.each(k,function(a,b){_.isNumber(a)&&(this.elements[b]=a)},this);return this.trigger(Two.Events.change)},identity:function(){this.set(j.Identity);return this},multiply:function(e,c,b,h,j,a,k,q,s){var f=arguments,r=f.length;if(1>=r)return _.each(this.elements,
|
||||
function(a,b){this.elements[b]=a*e},this),this.trigger(Two.Events.change);if(3>=r)return e=e||0,c=c||0,b=b||0,j=this.elements,{x:j[0]*e+j[1]*c+j[2]*b,y:j[3]*e+j[4]*c+j[5]*b,z:j[6]*e+j[7]*c+j[8]*b};r=this.elements;A0=r[0];A1=r[1];A2=r[2];A3=r[3];A4=r[4];A5=r[5];A6=r[6];A7=r[7];A8=r[8];B0=f[0];B1=f[1];B2=f[2];B3=f[3];B4=f[4];B5=f[5];B6=f[6];B7=f[7];B8=f[8];this.elements[0]=A0*B0+A1*B3+A2*B6;this.elements[1]=A0*B1+A1*B4+A2*B7;this.elements[2]=A0*B2+A1*B5+A2*B8;this.elements[3]=A3*B0+A4*B3+A5*B6;this.elements[4]=
|
||||
A3*B1+A4*B4+A5*B7;this.elements[5]=A3*B2+A4*B5+A5*B8;this.elements[6]=A6*B0+A7*B3+A8*B6;this.elements[7]=A6*B1+A7*B4+A8*B7;this.elements[8]=A6*B2+A7*B5+A8*B8;return this.trigger(Two.Events.change)},inverse:function(e){var c=this.elements;e=e||new Two.Matrix;var b=c[0],h=c[1],j=c[2],a=c[3],k=c[4],q=c[5],s=c[6],f=c[7],c=c[8],r=c*k-q*f,l=-c*a+q*s,p=f*a-k*s,u=b*r+h*l+j*p;if(!u)return null;u=1/u;e.elements[0]=r*u;e.elements[1]=(-c*h+j*f)*u;e.elements[2]=(q*h-j*k)*u;e.elements[3]=l*u;e.elements[4]=(c*b-
|
||||
j*s)*u;e.elements[5]=(-q*b+j*a)*u;e.elements[6]=p*u;e.elements[7]=(-f*b+h*s)*u;e.elements[8]=(k*b-h*a)*u;return e},scale:function(e,c){1>=arguments.length&&(c=e);return this.multiply(e,0,0,0,c,0,0,0,1)},rotate:function(e){var c=p(e);e=l(e);return this.multiply(c,-e,0,e,c,0,0,0,1)},translate:function(e,c){return this.multiply(1,0,e,0,1,c,0,0,1)},skewX:function(j){j=e(j);return this.multiply(1,j,0,0,1,0,0,0,1)},skewY:function(j){j=e(j);return this.multiply(1,0,0,j,1,0,0,0,1)},toString:function(){return this.toArray().join(" ")},
|
||||
toArray:function(e){var c=this.elements,b=parseFloat(c[0].toFixed(3)),h=parseFloat(c[1].toFixed(3)),j=parseFloat(c[2].toFixed(3)),a=parseFloat(c[3].toFixed(3)),k=parseFloat(c[4].toFixed(3)),q=parseFloat(c[5].toFixed(3));if(e){e=parseFloat(c[6].toFixed(3));var s=parseFloat(c[7].toFixed(3)),c=parseFloat(c[8].toFixed(3));return[b,a,e,h,k,s,j,q,c]}return[b,a,h,k,j,q]},clone:function(){return new Two.Matrix(this.elements[0],this.elements[1],this.elements[2],this.elements[3],this.elements[4],this.elements[5],
|
||||
this.elements[6],this.elements[7],this.elements[8])}})})();(function(){function p(c){var b={},e=c.id,l=c.translation,a=c.rotation,k=c.scale,q=c.stroke,s=c.linewidth,f=c.fill,r=c.opacity,p=c.visible,w=c.cap,u=c.join,y=c.miter,n=c.curved,t=c.closed,d=c.vertices;e&&(b.id=m.Identifier+e);l&&(_.isNumber(k)&&_.isNumber(a))&&(b.transform="matrix("+c._matrix.toString()+")");q&&(b.stroke=q);f&&(b.fill=f);r&&(b["stroke-opacity"]=b["fill-opacity"]=r);b.visibility=p?"visible":"hidden";w&&(b["stroke-linecap"]=w);u&&(b["stroke-linejoin"]=u);y&&(b["stroke-miterlimit"]=
|
||||
y);s&&(b["stroke-width"]=s);d&&(b.d=j.toString(d,t,n));return b}var l=Two.Utils.getCurveFromPoints,e=Two.Utils.mod,j={version:1.1,ns:"http://www.w3.org/2000/svg",xlink:"http://www.w3.org/1999/xlink",createElement:function(c,b){var e=document.createElementNS(this.ns,c);"svg"===c&&(b=_.defaults(b||{},{version:this.version}));_.isObject(b)&&this.setAttributes(e,b);return e},setAttributes:function(c,b){_.each(b,function(b,c){this.setAttribute(c,b)},c);return this},removeAttributes:function(c,b){_.each(b,
|
||||
function(b){this.removeAttribute(b)},c);return this},toString:function(c,b,h){var j=c.length,a=j-1;if(!h)return _.map(c,function(c,e){var f;f=(0>=e?"M":"L")+(" "+c.x.toFixed(3)+" "+c.y.toFixed(3));e>=a&&b&&(f+=" Z");return f}).join(" ");var k=l(c,b);return _.map(k,function(c,h){var f,m=b?e(h-1,j):Math.max(h-1,0),l=b?e(h+1,j):Math.min(h+1,a);f=k[m];var l=k[l],m=f.v.x.toFixed(3),p=f.v.y.toFixed(3),u=c.u.x.toFixed(3),y=c.u.y.toFixed(3),n=c.x.toFixed(3),t=c.y.toFixed(3);f=0>=h?"M "+n+" "+t:"C "+m+" "+
|
||||
p+" "+u+" "+y+" "+n+" "+t;h>=a&&b&&(m=c.v.x.toFixed(3),p=c.v.y.toFixed(3),u=l.u.x.toFixed(3),y=l.u.y.toFixed(3),n=l.x.toFixed(3),t=l.y.toFixed(3),f=f+(" C "+m+" "+p+" "+u+" "+y+" "+n+" "+t)+" Z");return f}).join(" ")}},m=Two[Two.Types.svg]=function(){this.count=0;this.domElement=j.createElement("svg");this.elements=[];this.domElement.style.visibility="hidden";this.unveil=_.once(_.bind(function(){this.domElement.style.visibility="visible"},this))};_.extend(m,{Identifier:"two-",Utils:j});_.extend(m.prototype,
|
||||
Backbone.Events,{setSize:function(c,b){this.width=c;this.height=b;j.setAttributes(this.domElement,{width:c,height:b});return this},add:function(c){var b=c,e=this.elements,m=this.domElement;_.isArray(c)||(b=_.map(arguments,function(a){return a}));_.each(b,function(a){var b;b=a instanceof Two.Group;if(_.isUndefined(a.id)){var c=this.count;this.count++;a.id=c}b?(b="g",_.isUndefined(a.parent)&&(a.parent=this,a.unbind(Two.Events.change).bind(Two.Events.change,_.bind(this.update,this))),a=p(a),delete a.stroke,
|
||||
delete a.fill,delete a["fill-opacity"],delete a["stroke-opacity"],delete a["stroke-linecap"],delete a["stroke-linejoin"],delete a["stroke-miterlimit"],delete a["stroke-width"]):(b="path",a=p(a));a=j.createElement(b,a);m.appendChild(a);e.push(a)},this);return this},update:function(c,b,e,m,a){var k=this.elements,q=k[c];switch(b){case Two.Properties.hierarchy:_.each(e,function(a){q.appendChild(k[a])});break;case Two.Properties.demotion:_.each(e,function(a){q.removeChild(k[a])});break;default:a:{c=b;
|
||||
switch(c){case "matrix":c="transform";e="matrix("+e.toString()+")";break;case "visible":c="visibility";e=e?"visible":"hidden";break;case "cap":c="stroke-linecap";break;case "join":c="stroke-linejoin";break;case "miter":c="stroke-miterlimit";break;case "linewidth":c="stroke-width";break;case "vertices":c="d";e=j.toString(e,m,a);break;case "opacity":j.setAttributes(q,{"stroke-opacity":e,"fill-opacity":e});break a}q.setAttribute(c,e)}}return this},render:function(){this.unveil();return this}})})();(function(){var p=Two.Utils.getCurveFromPoints,l=Two.Utils.mod,e=function(b){_.each(b,function(b,c){this[c]=b},this);this.children=[]};_.extend(e.prototype,{appendChild:function(b){var c=b.parent;_.isUndefined(c)||c.removeChild(b);this.children.push(b);b.parent=this;return this},removeChild:function(b){b=_.indexOf(this.children,b);return 0>b?this:this.children.splice(b,1)[0]},render:function(b){var c=this.matrix;b.save();b.transform(c[0],c[1],c[2],c[3],c[4],c[5]);_.each(this.children,function(c){c.render(b)});
|
||||
b.restore();return this}});var j=function(b){_.each(b,function(b,c){this[c]=b},this)};_.extend(j.prototype,{render:function(b){var c=this.matrix,e=this.stroke,a=this.linewidth,k=this.fill,j=this.opacity,m=this.cap,f=this.join,r=this.miter,p=this.curved,w=this.closed,u=this.commands,y=u.length,n=y-1;if(!this.visible)return this;b.save();c&&b.transform(c[0],c[1],c[2],c[3],c[4],c[5]);k&&(b.fillStyle=k);e&&(b.strokeStyle=e);a&&(b.lineWidth=a);r&&(b.miterLimit=r);f&&(b.lineJoin=f);m&&(b.lineCap=m);_.isNumber(j)&&
|
||||
(b.globalAlpha=j);b.beginPath();_.each(u,function(a,d){var f=a.x.toFixed(3),c=a.y.toFixed(3);if(p){var e=w?l(d-1,y):Math.max(d-1,0),h=w?l(d+1,y):Math.min(d+1,n),k=u[e],h=u[h],e=k.v.x.toFixed(3),k=k.v.y.toFixed(3),j=a.u.x.toFixed(3),q=a.u.y.toFixed(3);0>=d?b.moveTo(f,c):(b.bezierCurveTo(e,k,j,q,f,c),d>=n&&w&&(e=a.v.x.toFixed(3),k=a.v.y.toFixed(3),j=h.u.x.toFixed(3),q=h.u.y.toFixed(3),f=h.x.toFixed(3),c=h.y.toFixed(3),b.bezierCurveTo(e,k,j,q,f,c)))}else 0>=d?b.moveTo(f,c):b.lineTo(f,c)});w&&!p&&b.closePath();
|
||||
b.fill();b.stroke();b.restore()}});var m={devicePixelRatio:this.devicePixelRatio||1,getBackingStoreRatio:function(b){return b.webkitBackingStorePixelRatio||b.mozBackingStorePixelRatio||b.msBackingStorePixelRatio||b.oBackingStorePixelRatio||b.backingStorePixelRatio||1},getRatio:function(b){return this.devicePixelRatio/this.getBackingStoreRatio(b)},toArray:function(b,c,e){return!c?_.map(b,function(a){return{x:a.x,y:a.y}}):p(b,e)}},c=Two[Two.Types.canvas]=function(){this.count=0;this.domElement=document.createElement("canvas");
|
||||
this.ctx=this.domElement.getContext("2d");this.overdraw=!1;this.elements=[];this.stage=null};_.extend(c,{Group:e,Element:j,getStyles:function(b){var c={},e=b.id,a=b._matrix,k=b.stroke,j=b.linewidth,s=b.fill,f=b.opacity,l=b.visible,p=b.cap,w=b.join,u=b.miter,y=b.curved,n=b.closed;b=b.vertices;e&&(c.id=e);_.isObject(a)&&(c.matrix=a.toArray());k&&(c.stroke=k);s&&(c.fill=s);_.isNumber(f)&&(c.opacity=f);p&&(c.cap=p);w&&(c.join=w);u&&(c.miter=u);j&&(c.linewidth=j);b&&(c.commands=m.toArray(b,y,n));c.visible=
|
||||
!!l;c.curved=!!y;c.closed=!!n;return c},setStyles:function(b,c,e,a,k){switch(c){case "matrix":c="matrix";e=e.toArray();break;case "vertices":c="commands",b.curved=k,b.closed=a,e=m.toArray(e,b.curved,b.closed)}b[c]=e},Utils:m});_.extend(c.prototype,Backbone.Events,{setSize:function(b,c,e){this.width=b;this.height=c;this.ratio=_.isUndefined(e)?m.getRatio(this.ctx):e;this.domElement.width=b*this.ratio;this.domElement.height=c*this.ratio;_.extend(this.domElement.style,{width:b+"px",height:c+"px"});return this},
|
||||
add:function(b){constructor=Object.getPrototypeOf(this).constructor;var c=b,e=this.elements,a=constructor.Group,k=constructor.Element,j=constructor.getStyles;_.isArray(b)||(c=_.map(arguments,function(a){return a}));_.each(c,function(b){var c;c=b instanceof Two.Group;var h=_.isNull(this.stage);if(_.isUndefined(b.id)){var m=this.count;this.count++;b.id=m}c?(c=j.call(this,b),delete c.stroke,delete c.fill,delete c.opacity,delete c.cap,delete c.join,delete c.miter,delete c.linewidth,c=new a(c),h&&(this.stage=
|
||||
c,this.stage.object=b,b.parent=this,b.unbind(Two.Events.change).bind(Two.Events.change,_.bind(this.update,this)))):c=new k(j.call(this,b));e.push(c);h||this.stage.appendChild(c)},this);return this},update:function(b,c,e,a,k,j){var m=Object.getPrototypeOf(this).constructor,f=this.elements,l=f[b];switch(c){case Two.Properties.hierarchy:_.each(e,function(a){l.appendChild(f[a])});break;case Two.Properties.demotion:_.each(e,function(a){l.removeChild(f[a]);this.elements[a]=null},this);break;default:m.setStyles.call(this,
|
||||
l,c,e,a,k,j)}return this},render:function(){if(_.isNull(this.stage))return this;1!==this.ratio&&(this.ctx.save(),this.ctx.scale(this.ratio,this.ratio));this.overdraw||this.ctx.clearRect(0,0,this.width,this.height);this.stage.render(this.ctx);1!==this.ratio&&this.ctx.restore();return this}})})();(function(){function p(a,b){var c=Math.min(a.top,b.top),e=Math.min(a.left,b.left),f=Math.max(a.right,b.right),h=Math.max(a.bottom,b.bottom);return{top:c,left:e,right:f,bottom:h,width:f-e,height:h-c,centroid:{x:-e,y:-c}}}var l=Two[Two.Types.canvas],e=Two.Matrix.Multiply,j=Two[Two.Types.canvas].Utils.toArray,m=Two.Utils.mod,c=function(a){l.Group.call(this,a)};_.extend(c.prototype,l.Group.prototype,{appendChild:function(){l.Group.prototype.appendChild.apply(this,arguments);this.updateMatrix();return this},
|
||||
updateTexture:function(a){_.each(this.children,function(b){b.updateTexture(a)});return this},updateMatrix:function(a){var b=a&&a._matrix||this.parent&&this.parent._matrix;a=a&&a._scale||this.parent&&this.parent._scale;if(!b)return this;this._matrix=e(this.matrix,b);this._scale=this.scale*a;_.each(this.children,function(a){a.updateMatrix(this)},this);return this},render:function(a,b){_.each(this.children,function(c){c.render(a,b)})}});var b=function(a){l.Element.call(this,a)};_.extend(b.prototype,
|
||||
l.Element.prototype,{updateMatrix:function(a){var b=a&&a._matrix||this.parent&&this.parent._matrix;a=a&&a._scale||this.parent&&this.parent._scale;if(!b)return this;this._matrix=e(this.matrix,b);this._scale=this.scale*a;return this},updateTexture:function(a){h.updateTexture(a,this);return this},render:function(a,b){if(!this.visible||!this.opacity||!this.buffer)return this;a.bindBuffer(a.ARRAY_BUFFER,this.textureCoordsBuffer);a.vertexAttribPointer(b.textureCoords,2,a.FLOAT,!1,0,0);a.bindTexture(a.TEXTURE_2D,
|
||||
this.texture);a.uniformMatrix3fv(b.matrix,!1,this._matrix);a.bindBuffer(a.ARRAY_BUFFER,this.buffer);a.vertexAttribPointer(b.position,2,a.FLOAT,!1,0,0);a.drawArrays(a.TRIANGLES,0,6);return this}});var h={canvas:document.createElement("canvas"),uv:new Two.Array([0,0,1,0,0,1,0,1,1,0,1,1]),getBoundingClientRect:function(a,b,c){var e=Infinity,f=-Infinity,h=Infinity,j=-Infinity;_.each(a,function(a){var b=a.x,k=a.y,m;h=Math.min(k,h);e=Math.min(b,e);f=Math.max(b,f);j=Math.max(k,j);c&&(b=a.u.x,k=a.u.y,m=a.v.x,
|
||||
a=a.v.y,h=Math.min(k,a,h),e=Math.min(b,m,e),f=Math.max(b,m,f),j=Math.max(k,a,j))});_.isNumber(b)&&(h-=b,e-=b,f+=b,j+=b);return{top:h,left:e,right:f,bottom:j,width:f-e,height:j-h,centroid:{x:-e,y:-h}}},getTriangles:function(a){var b=a.top,c=a.left,e=a.right;a=a.bottom;return new Two.Array([c,b,e,b,c,a,c,a,e,b,e,a])},updateCanvas:function(a){var b=a.commands,c=this.canvas,e=this.ctx,f=a._scale,h=a.stroke,j=a.linewidth*f,l=a.fill,p=a.opacity,x=a.cap,n=a.join,t=a.miter,d=a.curved,v=a.closed,z=b.length,
|
||||
J=z-1;c.width=Math.max(Math.ceil(a.rect.width*f),1);c.height=Math.max(Math.ceil(a.rect.height*f),1);a=a.rect.centroid;var C=a.x*f,D=a.y*f;e.clearRect(0,0,c.width,c.height);l&&(e.fillStyle=l);h&&(e.strokeStyle=h);j&&(e.lineWidth=j);t&&(e.miterLimit=t);n&&(e.lineJoin=n);x&&(e.lineCap=x);_.isNumber(p)&&(e.globalAlpha=p);e.beginPath();_.each(b,function(a,c){var h=(a.x*f+C).toFixed(3),j=(a.y*f+D).toFixed(3);if(d){var l=v?m(c-1,z):Math.max(c-1,0),q=v?m(c+1,z):Math.min(c+1,J),n=b[l],q=b[q],l=(n.v.x*f+C).toFixed(3),
|
||||
n=(n.v.y*f+D).toFixed(3),p=(a.u.x*f+C).toFixed(3),g=(a.u.y*f+D).toFixed(3);0>=c?e.moveTo(h,j):(e.bezierCurveTo(l,n,p,g,h,j),c>=J&&v&&(l=(a.v.x*f+C).toFixed(3),n=(a.v.y*f+D).toFixed(3),p=(q.u.x*f+C).toFixed(3),g=(q.u.y*f+D).toFixed(3),h=(q.x*f+C).toFixed(3),j=(q.y*f+D).toFixed(3),e.bezierCurveTo(l,n,p,g,h,j)))}else 0>=c?e.moveTo(h,j):e.lineTo(h,j)});v&&!d&&e.closePath();e.fill();e.stroke()},updateTexture:function(a,b){this.updateCanvas(b);b.texture&&a.deleteTexture(b.texture);a.bindBuffer(a.ARRAY_BUFFER,
|
||||
b.textureCoordsBuffer);b.texture=a.createTexture();a.bindTexture(a.TEXTURE_2D,b.texture);a.texParameteri(a.TEXTURE_2D,a.TEXTURE_WRAP_S,a.CLAMP_TO_EDGE);a.texParameteri(a.TEXTURE_2D,a.TEXTURE_WRAP_T,a.CLAMP_TO_EDGE);a.texParameteri(a.TEXTURE_2D,a.TEXTURE_MIN_FILTER,a.LINEAR);0>=this.canvas.width||0>=this.canvas.height||a.texImage2D(a.TEXTURE_2D,0,a.RGBA,a.RGBA,a.UNSIGNED_BYTE,this.canvas)},updateBuffer:function(a,b,c){_.isObject(b.buffer)&&a.deleteBuffer(b.buffer);b.buffer=a.createBuffer();a.bindBuffer(a.ARRAY_BUFFER,
|
||||
b.buffer);a.enableVertexAttribArray(c.position);a.bufferData(a.ARRAY_BUFFER,b.triangles,a.STATIC_DRAW);_.isObject(b.textureCoordsBuffer)&&a.deleteBuffer(b.textureCoordsBuffer);b.textureCoordsBuffer=a.createBuffer();a.bindBuffer(a.ARRAY_BUFFER,b.textureCoordsBuffer);a.enableVertexAttribArray(c.textureCoords);a.bufferData(a.ARRAY_BUFFER,this.uv,a.STATIC_DRAW)},program:{create:function(a,b){var c=a.createProgram();_.each(b,function(b){a.attachShader(c,b)});a.linkProgram(c);if(!a.getProgramParameter(c,
|
||||
a.LINK_STATUS))throw error=a.getProgramInfoLog(c),a.deleteProgram(c),new Two.Utils.Error("unable to link program: "+error);return c}},shaders:{create:function(a,b,c){c=a.createShader(a[c]);a.shaderSource(c,b);a.compileShader(c);if(!a.getShaderParameter(c,a.COMPILE_STATUS))throw b=a.getShaderInfoLog(c),a.deleteShader(c),new Two.Utils.Error("unable to compile shader "+c+": "+b);return c},types:{vertex:"VERTEX_SHADER",fragment:"FRAGMENT_SHADER"},vertex:"attribute vec2 a_position;\nattribute vec2 a_textureCoords;\n\nuniform mat3 u_matrix;\nuniform vec2 u_resolution;\n\nvarying vec2 v_textureCoords;\n\nvoid main() {\n vec2 projected = (u_matrix * vec3(a_position, 1)).xy;\n vec2 normal = projected / u_resolution;\n vec2 clipspace = (normal * 2.0) - 1.0;\n\n gl_Position = vec4(clipspace * vec2(1.0, -1.0), 0.0, 1.0);\n v_textureCoords = a_textureCoords;\n}",
|
||||
fragment:"precision mediump float;\n\nuniform sampler2D u_image;\nvarying vec2 v_textureCoords;\n\nvoid main() {\n gl_FragColor = texture2D(u_image, v_textureCoords);\n}"}};h.ctx=h.canvas.getContext("2d");var x=Two[Two.Types.webgl]=function(a){this.count=0;this.domElement=document.createElement("canvas");this.elements=[];this.stage=null;a=_.defaults(a||{},{antialias:!1,alpha:!0,premultipliedAlpha:!0,stencil:!0,preserveDrawingBuffer:!1});a=this.ctx=this.domElement.getContext("webgl",a)||this.domElement.getContext("experimental-webgl",
|
||||
a);if(!this.ctx)throw new Two.Utils.Error("unable to create a webgl context. Try using another renderer.");var b=h.shaders.create(a,h.shaders.vertex,h.shaders.types.vertex),c=h.shaders.create(a,h.shaders.fragment,h.shaders.types.fragment);this.program=h.program.create(a,[b,c]);a.useProgram(this.program);this.program.position=a.getAttribLocation(this.program,"a_position");this.program.matrix=a.getUniformLocation(this.program,"u_matrix");this.program.textureCoords=a.getAttribLocation(this.program,"a_textureCoords");
|
||||
a.disable(a.DEPTH_TEST);a.enable(a.BLEND);a.blendEquationSeparate(a.FUNC_ADD,a.FUNC_ADD);a.blendFuncSeparate(a.SRC_ALPHA,a.ONE_MINUS_SRC_ALPHA,a.ONE,a.ONE_MINUS_SRC_ALPHA)};_.extend(x,{Group:c,Element:b,getStyles:function(a){var c={},e=a.id,m=a._matrix,f=a.stroke,l=a.linewidth,p=a.fill,x=a.opacity,u=a.visible,y=a.cap,n=a.join,t=a.miter,d=a.curved,v=a.closed,z=a.vertices;e&&(c.id=e);_.isObject(m)&&(c.matrix=c._matrix=m.toArray(!0),c.scale=c._scale=1);f&&(c.stroke=f);p&&(c.fill=p);_.isNumber(x)&&(c.opacity=
|
||||
x);y&&(c.cap=y);n&&(c.join=n);t&&(c.miter=t);l&&(c.linewidth=l);z&&(c.vertices=j(z,d,v),c.commands=c.vertices,c.rect=h.getBoundingClientRect(c.commands,c.linewidth,c.curved),c.triangles=h.getTriangles(c.rect));c.visible=!!u;c.curved=!!d;c.closed=!!v;a instanceof Two.Polygon&&(h.updateBuffer(this.ctx,c,this.program),b.prototype.updateTexture.call(c,this.ctx));return c},setStyles:function(a,b,c,e,f,m){var l=!1;/matrix/.test(b)?(a[b]=c.toArray(!0),_.isNumber(e)&&(l=a.scale!==e,a.scale=e),a.updateMatrix()):
|
||||
/(stroke|fill|opacity|cap|join|miter|linewidth)/.test(b)?(a[b]=c,a.rect=p(h.getBoundingClientRect(a.commands,a.linewidth,a.curved),a.rect),a.triangles=h.getTriangles(a.rect),h.updateBuffer(this.ctx,a,this.program),l=!0):"vertices"===b?(_.isUndefined(e)||(a.closed=e),_.isUndefined(f)||(a.curved=f),m?a.commands=j(c,a.curved,a.closed):(a.vertices=j(c,a.curved,a.closed),a.commands=a.vertices),a.rect=p(h.getBoundingClientRect(a.vertices,a.linewidth,a.curved),a.rect),a.triangles=h.getTriangles(a.rect),
|
||||
h.updateBuffer(this.ctx,a,this.program),l=!0):a[b]=c;l&&a.updateTexture(this.ctx)}});_.extend(x.prototype,Backbone.Events,l.prototype,{setSize:function(a,b){l.prototype.setSize.apply(this,arguments);this.ratio=1;this.domElement.width=a;this.domElement.height=b;this.ctx.viewport(0,0,a,b);var c=this.ctx.getUniformLocation(this.program,"u_resolution");this.ctx.uniform2f(c,a,b);return this},render:function(){if(_.isNull(this.stage))return this;this.stage.render(this.ctx,this.program);return this}})})();(function(){var p=Two.Shape=function(l){this._matrix=new Two.Matrix;var e=_.debounce(_.bind(function(){var e=this._matrix.identity().translate(this.translation.x,this.translation.y).scale(this.scale).rotate(this.rotation);this.trigger(Two.Events.change,this.id,"matrix",e,this.scale)},this),0);this._rotation=0;Object.defineProperty(this,"rotation",{get:function(){return this._rotation},set:function(j){this._rotation=j;e()}});this._scale="scale";Object.defineProperty(this,"scale",{get:function(){return this._scale},
|
||||
set:function(j){this._scale=j;e()}});this.translation=new Two.Vector;this.rotation=0;this.scale=1;this.translation.bind(Two.Events.change,e);if(l)return this;p.MakeGetterSetter(this,p.Properties);this.fill="#fff";this.stroke="#000";this.opacity=this.linewidth=1;this.visible=!0;this.join=this.cap="round";this.miter=1};_.extend(p,{Properties:"fill stroke linewidth opacity visible cap join miter".split(" "),MakeGetterSetter:function(l,e){_.isArray(e)||(e=[e]);_.each(e,function(e){var m="_"+e;Object.defineProperty(l,
|
||||
e,{get:function(){return this[m]},set:function(c){this[m]=c;this.trigger(Two.Events.change,this.id,e,c,this)}})})}});_.extend(p.prototype,Backbone.Events,{addTo:function(l){l.add(this);return this},noFill:function(){this.fill="transparent";return this},noStroke:function(){this.stroke="transparent";return this},clone:function(){var l=new p;l.translation.copy(this.translation);_.each(p.Properties,function(e){l[e]=this[e]},this);return this}})})();(function(){var p=Two.Group=function(){Two.Shape.call(this,!0);delete this.stroke;delete this.fill;delete this.linewidth;delete this.opacity;delete this.cap;delete this.join;delete this.miter;p.MakeGetterSetter(this,Two.Shape.Properties);this.children={}};_.extend(p,{MakeGetterSetter:function(l,e){_.isArray(e)||(e=[e]);_.each(e,function(e){var m="_"+e;Object.defineProperty(l,e,{get:function(){return this[m]},set:function(c){this[m]=c;_.each(this.children,function(b){b[e]=c})}})})}});_.extend(p.prototype,
|
||||
Two.Shape.prototype,{clone:function(l){l=l||this.parent;var e=_.map(this.children,function(e){return e.clone(l)}),j=new p;l.add(j);j.add(e);j.translation.copy(this.translation);j.rotation=this.rotation;j.scale=this.scale;return j},corner:function(){var l=this.getBoundingClientRect(!0),e={x:l.left,y:l.top};_.each(this.children,function(j){j.translation.subSelf(e)});return this},center:function(){var l=this.getBoundingClientRect(!0);l.centroid={x:l.left+l.width/2,y:l.top+l.height/2};_.each(this.children,
|
||||
function(e){e.translation.subSelf(l.centroid)});return this},add:function(l){var e=l,j=this.children,m=this.parent,c=[];_.isArray(l)||(e=_.toArray(arguments));var b=_.bind(function(b,c,a,e,j,m){this.trigger(Two.Events.change,b,c,a,e,j,m)},this);_.each(e,function(e){if(e){var l=e.id,a=e.parent;_.isUndefined(l)&&(m.add(e),l=e.id);_.isUndefined(j[l])&&(a&&delete a.children[l],j[l]=e,e.parent=this,e.unbind(Two.Events.change).bind(Two.Events.change,b),c.push(l))}},this);0<c.length&&this.trigger(Two.Events.change,
|
||||
this.id,Two.Properties.hierarchy,c);return this},remove:function(l){var e=l,j=this.children,m=this.parent,c=[];if(0>=arguments.length&&m)return m.remove(this),this;_.isArray(l)||(e=_.toArray(arguments));_.each(e,function(b){var e=b.id;e in j&&(delete j[e],delete b.parent,b.unbind(Two.Events.change),c.push(e))});0<c.length&&this.trigger(Two.Events.change,this.id,Two.Properties.demotion,c);return this},getBoundingClientRect:function(l){var e=Infinity,j=-Infinity,m=Infinity,c=-Infinity;_.each(this.children,
|
||||
function(b){b=b.getBoundingClientRect(!0);m&&(e&&j&&c)&&(m=Math.min(b.top,m),e=Math.min(b.left,e),j=Math.max(b.right,j),c=Math.max(b.bottom,c))},this);var b=l?this._matrix:Two.Utils.getComputedMatrix(this);l=b.multiply(e,m,1);b=b.multiply(j,c,1);return{top:l.y,left:l.x,right:b.x,bottom:b.y,width:b.x-l.x,height:b.y-l.y}},noFill:function(){_.each(this.children,function(l){l.noFill()});return this},noStroke:function(){_.each(this.children,function(l){l.noStroke()});return this}})})();(function(){var p=Math.min,l=Math.max,e=Math.round,j=Two.Polygon=function(j,c,b){Two.Shape.call(this);c=!!c;b=!!b;var h=0,x=1,a=!1,k=!1,q,s=[],f=_.debounce(_.bind(function(){var f,j;if(a||k){f=q.length;j=f-1;f=e(h*j);j=e(x*j);for(s.length=0;f<j+1;f++)s.push(q[f])}this.trigger(Two.Events.change,this.id,"vertices",s,c,b,a);k=a=!1},this),0);Object.defineProperty(this,"closed",{get:function(){return c},set:function(a){c=!!a;f()}});Object.defineProperty(this,"curved",{get:function(){return b},set:function(a){b=
|
||||
!!a;f()}});Object.defineProperty(this,"beginning",{get:function(){return h},set:function(b){h=p(l(b,0),1);a=!0;f()}});Object.defineProperty(this,"ending",{get:function(){return x},set:function(b){x=p(l(b,0),1);a=!0;f()}});Object.defineProperty(this,"vertices",{get:function(){return q},set:function(a){var b=_.bind(function(a){_.each(a,function(a){a.bind(Two.Events.change,f)},this);k=!0;f()},this),c=_.bind(function(a){_.each(a,function(a){a.unbind(Two.Events.change,f)},this);k=!0;f()},this);q&&q.unbind();
|
||||
q=new Two.Utils.Collection(a.slice(0));q.bind(Two.Events.insert,b);q.bind(Two.Events.remove,c);k=!0;b(q)}});this.vertices=j};_.extend(j.prototype,Two.Shape.prototype,{clone:function(){var e=_.map(this.vertices,function(b){return new Two.Vector(b.x,b.y)}),c=new j(e,this.closed,this.curved);_.each(Two.Shape.Properties,function(b){c[b]=this[b]},this);c.translation.copy(this.translation);c.rotation=this.rotation;c.scale=this.scale;return c},corner:function(){var e=this.getBoundingClientRect(!0),c={x:e.left,
|
||||
y:e.top};_.each(this.vertices,function(b){b.subSelf(c)});return this},center:function(){var e=this.getBoundingClientRect(!0);e.centroid={x:e.left+e.width/2,y:e.top+e.height/2};_.each(this.vertices,function(c){c.subSelf(e.centroid)});return this},remove:function(){if(!this.parent)return this;this.parent.remove(this);return this},getBoundingClientRect:function(e){var c=this.linewidth,b=Infinity,h=-Infinity,j=Infinity,a=-Infinity;_.each(this.vertices,function(c){var e=c.x;c=c.y;j=Math.min(c,j);b=Math.min(e,
|
||||
b);h=Math.max(e,h);a=Math.max(c,a)});j-=c;b-=c;h+=c;a+=c;c=e?this._matrix:Two.Utils.getComputedMatrix(this);e=c.multiply(b,j,1);c=c.multiply(h,a,1);return{top:e.y,left:e.x,right:c.x,bottom:c.y,width:c.x-e.x,height:c.y-e.y}}})})();
|
||||
2
js/libs/zepto.min.js
vendored
Normal file
2
js/libs/zepto.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
37
js/main.js
Normal file
37
js/main.js
Normal file
@ -0,0 +1,37 @@
|
||||
"use strict";
|
||||
|
||||
$(document).ready(function() {
|
||||
window.c = $('canvas')[0].getContext('2d');
|
||||
|
||||
window.settings = {
|
||||
lineWidth : 5,
|
||||
strokeStyle : 'black',
|
||||
type: 'sketch',
|
||||
lineCap: 'round',
|
||||
lineJoin: 'round'
|
||||
};
|
||||
window.points = [];
|
||||
window.$c = $('canvas');
|
||||
|
||||
sizeAndPos();
|
||||
$(window).resize(sizeAndPos);
|
||||
|
||||
$c.mousedown(function(e) {
|
||||
|
||||
var xy = relative(e.pageX, e.pageY);
|
||||
startPoint(xy.x, xy.y);
|
||||
window.active = true;
|
||||
|
||||
}).mousemove(function(e) {
|
||||
|
||||
if (!window.active || settings.type == 'line') return;
|
||||
var xy = relative(e.pageX, e.pageY);
|
||||
drawPoint(xy.x, xy.y);
|
||||
|
||||
}).mouseup(function() {
|
||||
|
||||
window.active = false;
|
||||
|
||||
})
|
||||
|
||||
})
|
||||
Loading…
Reference in New Issue
Block a user