module.exports = function(el, gate, cb){
if(typeof gate === 'function'){
cb = gate
gate = false
}
gate = gate || false
touch.start(el);
el.addEventListener('touchdown', Switch);
el.addEventListener('liftoff', Switch);
function Switch(e){
gate = !gate
if(cb) cb(gate)
else{
var evt = new CustomEvent('switch', {bubbles: true, cancelable: true, detail : gate });
this.dispatchEvent(evt);
}
};
return el
}
module.exports = function(el, cb, point){
cb = cb || function(){}
var w = parseFloat(el.style.width)
var h = parseFloat(el.style.height)
var pos = findPos(el)
var center = [pos[0] + w / 2, pos[1] + h / 2]
var r = w / h
var last = []
touchdown.start(el)
el.addEventListener('touchdown', handler)
el.addEventListener('deltavector', handler)
el.addEventListener('liftoff', handlerOff)
function handlerOff(evt){
cb(xy(evt), [evt.detail.offsetX, evt.detail.offsetY], true)
}
function handler(evt){
cb(xy(evt), [evt.detail.offsetX, evt.detail.offsetY], false)
}
function xy(evt){
if(!(evt.detail.target == el)) return last
last = [evt.detail.offsetX / w, (h - evt.detail.offsetY) / h]
return last
}
//if(point) cb(point, [point[0] * w, (h - point[1]) * h])
return el
}
module.exports = function(el){
el.touchdown = [];
var clockswise = [];
var quadrants = [];
var points = [];
var w = parseInt(getCSS(el, 'width'));
var h = w// parseInt(el, 'height');
var p = findPos(el)
, SWITCH = false
, LEFT = false, TOP = false
, clockwise = undefined
, quad = undefined
, degree = 0
, pad = 25
, lastPoint = [];
;
el.center = [p[0] + (w/2), p[1] + (h/2)]
console.log(el.center)
el.zero = [el.center[0] + w / 2, el.center[1]]
el._b = el.center[1] - ( h / 2 ) ;
events.start(el);
el.addEventListener('touchdown', touchdown)
el.addEventListener('deltavector', vectorChange)
el.addEventListener('liftoff', vectorChange)
function touchdown(e){
var event = e.detail;
var el = this;
var point = [e.detail.x, e.detail.y]
lastPoint = point.slice(0);
var a = distance(el.zero, point);
var b = distance(el.zero, el.center);
var c = distance(point, el.center);
var angle = 360 - getAngle(a,b,c);
el.lastAngle = angle;
el.touchdown = [e.detail.x, e.detail.y];
var evt = new CustomEvent('spinstart', { cancelable: true, bubbles: true, detail : event});
evt.dxcenter = distance(el.center, point);
this.dispatchEvent(evt);
quad = getQuadrant(point, el.center)
}
function vectorChange(e){
var event = e.detail;
var el = this;
var point = [e.detail.x, e.detail.y]
var lq = quad;
if(distance(point, el.center)<5) return;
quad = getQuadrant(point, el.center);
console.log(el.center)
var a = distance(el.zero, point);
var b = distance(el.zero, el.center);
var c = distance(point, el.center);
var angle = (quad==1||quad==2) ? 360 - getAngle(a,b,c) : getAngle(a,b,c);
var la = el.lastAngle;
el.clockwise = (angle - el.lastAngle > 0) ? 1 : -1;
if(!(quad==lq)){// new quadrant
if((lq==1&&quad==3)||(lq==3&&quad==1)){ // crossed the zero line
var r = clockswise.slice(0,5).reduce(function(acc,i){
return acc+=i;
},0)
if(r<0) el.clockwise = -1
else if(r>0) el.clockwise = 1;
else el.clockwise = clockswise[0];
};
};
clockswise.unshift(el.clockwise);
var a = distance(lastPoint, point);
var b = distance(lastPoint, el.center);
var c = distance(point, el.center);
degree += getAngle(a,b,c) * el.clockwise;
var evt = new CustomEvent('spin', { cancelable: true, bubbles: true, detail : event});
el.lastAngle = angle;
evt.detail.degree = degree;
evt.detail.clockwise = el.clockwise;
evt.detail.lastPoint = lastPoint.slice(0);
lastPoint = point.slice(0);
evt.detail.dxcenter = distance(el.center, point);
evt.detail.delta = getAngle(a,b,c) * el.clockwise
this.dispatchEvent(evt);
}
}
var touchdown = require('touchdown')
var envelope = require('./deCasteljau');
var Context = document.getElementById('context');
var context = window.context = Context.getContext('2d');
var w = Context.width = window.innerWidth
var h = Context.height = window.innerHeight
touchdown.start(Context)
Context.addEventListener('deltavector', function(evt){
drawCurve(evt.detail.x, evt.detail.y)
})
drawCurve(w/2, h/3+100)
function drawCurve(x,y){
var r = Math.round(Math.abs((w/2) - x))
var g = Math.round(Math.abs(255 - distance([w/2,h/2],[x,y])))
var b = Math.round(Math.abs((h/2) - y))
context.fillStyle = 'rgba(100,66,100,255)'
// context.strokeRect(w/2 -100,h/3,200,200)
context.beginPath();
context.lineWidth = 3
context.moveTo(w/2-100, h/3 + 200)
context.quadraticCurveTo(x,y,w/2 + 100,h/3)
context.strokeStyle = ['rgba(',r,',',g,',',b,',',157,')'].join('')
context.stroke()
console.log(['rgba(',r,',',g,',',b,',',255,')'].join(''))
}
function distance(p1, p2){