diff options
Diffstat (limited to 'assets/javascripts/mx')
18 files changed, 0 insertions, 2911 deletions
diff --git a/assets/javascripts/mx/extensions/mx.movements.js b/assets/javascripts/mx/extensions/mx.movements.js deleted file mode 100644 index 074ca9a..0000000 --- a/assets/javascripts/mx/extensions/mx.movements.js +++ /dev/null @@ -1,285 +0,0 @@ - - -MX.Movements = function (cam, viewHeight) { - - var moveForward, - moveLeft, - moveBackward, - moveRight, - moveUp, - moveDown, - turnLeft, - turnRight, - turnUp, - turnDown, - jumping = false, - creeping = false, - locked = false, - gravity = false, - rotationX_min = PI/-2, - rotationX_max = PI/2 - - var v = 12, - vr = Math.PI * 0.012, - jumpV = 23, - vx = vy = vz = 0, - creepFactor = 0.3 - - var DEFAULT_SCALE = scale = 1.0 - - var pos = { x: 0, y: 0, z: 0, rotationX: 0, rotationY: 0 } - - return { - - init: function () { - - document.addEventListener('keydown', function (e) { - // console.log(e.keyCode) - if (locked) return; - switch ( e.keyCode ) { - - case 16: // shift - creeping = true - break - - case 38: // up - case 87: // w - moveForward = true - break - - case 37: // left - case 65: // a - moveLeft = true - break - - case 40: // down - case 83: // s - moveBackward = true - break - - case 39: // right - case 68: // d - moveRight = true - break - - case 81: // q - turnLeft = true - break - - case 69: // e - turnRight = true - break - - case 82: // r - turnUp = true - break - - case 70: // f - turnDown = true - break - - case 32: // space - if (gravity) { - jumping = true - vy = abs(vy) + jumpV * scale - if (e.shiftKey) { - vy *= -1 - } - } - else { - if (e.shiftKey) { - moveDown = true - } - else { - moveUp = true - } - } - break - - case 27: // esc - map.toggle() - break - } - }) - - document.addEventListener('keyup', function (e) { - if (locked) return; - switch ( e.keyCode ) { - - case 16: // shift - creeping = false - break - - case 38: // up - case 87: // w - moveForward = false - break - - case 37: // left - case 65: // a - moveLeft = false - break - - case 40: // down - case 83: // s - moveBackward = false - break - - case 39: // right - case 68: // d - moveRight = false - break - - case 81: // q - turnLeft = false - break - - case 69: // e - turnRight = false - break - - case 82: // r - turnUp = false - break - - case 70: // f - turnDown = false - break - - case 32: // space - moveUp = moveDown = false - break - - case 48: // 0 - cam.rotationX = 0 - cam.rotationY = 0 - cam.x = 0 - cam.y = viewHeight - cam.z = 0 - break - } - }) - - var mouseX, mouseY, dx, dy, rotX, rotY, dragging = false - document.addEventListener('mousedown', function (e) { - if (locked) return; - mouseX = e.pageX - mouseY = e.pageY - rotX = cam.rotationX - rotY = cam.rotationY - dragging = true - }) - - document.addEventListener('mousemove', function (e) { - if (locked || ! dragging || app.dragging) return - var dx = (e.pageX - mouseX) / window.innerWidth * Math.PI/3 - var dy = (e.pageY - mouseY) / window.innerHeight * Math.PI/3 - cam.rotationY = rotY + dx - cam.rotationX = clamp( rotX - dy, rotationX_min, rotationX_max ) - }) - - document.addEventListener('mouseup', function (e) { - app.dragging = dragging = false - }) - - window.addEventListener('blur', reset) - window.addEventListener('focus', reset) - function reset(){ - moveForward = moveLeft = moveBackward = moveRight = moveUp = moveDown = turnLeft = turnRight = jumping = dragging = creeping = false - } - - }, - - update: function () { - - if (locked) return; - - var ry = cam.rotationY - var s = creeping ? scale * creepFactor : scale - var vrrrr = creeping ? vr * creepFactor * 5 : vr - var moving = moveForward || moveBackward || moveRight || moveLeft || moveUp || moveDown || turnLeft || turnRight || turnUp || turnDown - vx = vz = 0 - - pos.x = cam.x - pos.z = cam.z - - if (moving) { - - if (moveForward) { - vx += v * Math.cos(ry + Math.PI / 2) * s - vz += v * Math.sin(ry + Math.PI / 2) * s - } - if (moveBackward) { - vx -= v * Math.cos(ry + Math.PI / 2) * s - vz -= v * Math.sin(ry + Math.PI / 2) * s - } - if (moveLeft) { - vx -= v * Math.cos(ry) * s - vz -= v * Math.sin(ry) * s - } - if (moveRight) { - vx += v * Math.cos(ry) * s - vz += v * Math.sin(ry) * s - } - if (moveUp) { - pos.y += v * scale - } - if (moveDown) { - pos.y -= v * scale - } - - if (turnUp) { - cam.rotationX = clamp( cam.rotationX - vrrrr*s, rotationX_min, rotationX_max) - } - if (turnDown) { - cam.rotationX = clamp( cam.rotationX + vrrrr*s, rotationX_min, rotationX_max) - } - if (turnLeft) { - cam.rotationY += vrrrr*s - } - if (turnRight) { - cam.rotationY -= vrrrr*s - } - - pos.x += vx - pos.z += vz - } - - if (gravity) { - vy -= 1 * scale - - pos.y += vy - - if (vy) { - moving = true - } - if (pos.y <= viewHeight) { - pos.y = viewHeight - vy = 0 - jumping = false - vz = vz || 1 - } - - var ceiling = (Rooms.mover.room ? Rooms.mover.room.height : 5000) - - if (pos.y >= ceiling) { - vy = 0 - pos.y = ceiling - vz = vz || 1 - } - } - - if (moving) { - app.tube("move", pos) - } - }, - - lock: function(){ locked = true }, - unlock: function(){ locked = false }, - scale: function(n){ if (n) scale = n; return scale }, - resetScale: function(n){ scale = DEFAULT_SCALE }, - gravity: function(g){ return typeof g == "boolean" ? gravity = g : gravity }, - velocity: function(n){ v = clamp(n, 1, 50) }, - jumpVelocity: function(n){ jumpV = clamp(n, 1, 50) }, - } -} diff --git a/assets/javascripts/mx/extensions/mx.rotationControl.js b/assets/javascripts/mx/extensions/mx.rotationControl.js deleted file mode 100644 index 9adb627..0000000 --- a/assets/javascripts/mx/extensions/mx.rotationControl.js +++ /dev/null @@ -1,265 +0,0 @@ -// Usage: -// -// var control = new MX.RotationControl() -// control.init( object{MX.Object3D} [, listener{HTMLElement}] ) -// -// In animation loop: -// -// control.update() -// -// The above code will register handler functions on `listener` -// and will be updating `object`s rotationX and rotationY -// If no `listener` is provided, will default to `object`s el. - -MX.RotationControl = function () { - - var object, - locked = false - - var down = false, - active = false, - lastX, - lastY - - var pointerLockPrefix = - 'pointerLockElement' in document ? '' : - 'mozPointerLockElement' in document ? 'moz' : - 'webkitPointerLockElement' in document ? 'webkit' : null, - hasPointerLock = !(pointerLockPrefix === null) - pointerLockEnabled = false - - var pub = { - - sensitivity : .5, - ease : 10, - drag : true, - - inverseX : false, - inverseY : false, - - disableX : false, - disableY : false, - - rotationX : 0, - rotationY : 0, - - upperBoundX : undefined, - lowerBoundX : undefined, - - upperBoundY : undefined, - lowerBoundY : undefined, - - usePreset: function (name) { - var ops = presets[name] - if (ops) { - if (currentPreset && presets[currentPreset].teardown) { - presets[currentPreset].teardown() - } - for (var op in ops) { - if (op !== 'setup' && op !== 'teardown') { - pub[op] = ops[op] - } - } - if (op.setup) ops.setup() - } - } - } - - var currentPreset - var presets = { - firstPerson: { - drag: false, - ease: 2, - sensitivity: .18, - inverseX: true, - inverseY: true, - upperBoundX: MX.rotationUnit === 'deg' ? 90 : Math.PI / 2, - lowerBoundX: MX.rotationUnit === 'deg' ? -90 : -Math.PI / 2 - }, - skybox: { - sensitivity: .18, - inverseX: true, - inverseY: true, - upperBoundX: MX.rotationUnit === 'deg' ? 90 : Math.PI / 2, - lowerBoundX: MX.rotationUnit === 'deg' ? -90 : -Math.PI / 2 - } - } - - function init (obj, lis) { - if (active) return - - object = obj - pub.rotationX = object.rotationX - pub.rotationY = object.rotationY - - if (lis instanceof HTMLElement) { - listener = lis - } else if (lis instanceof MX.Object3D) { - listener = lis.el - } else { - listener = window.document - } - - listener.addEventListener('mousedown', onDown) - listener.addEventListener('mousemove', onMove) - listener.addEventListener('mouseup', onUp) - listener.addEventListener('touchstart', onDown) - listener.addEventListener('touchmove', onMove) - listener.addEventListener('touchend', onUp) - - active = true - } - - function changeObject (obj) { - object = obj - pub.rotationX = object.rotationX - pub.rotationY = object.rotationY - } - - function changeListener (lis) { - remove() - active = false - init(object, lis) - if (pointerLockEnabled) { - initPointerLock() - } - } - - function remove () { - if (!active) return - listener.removeEventListener('mousedown', onDown) - listener.removeEventListener('mousemove', onMove) - listener.removeEventListener('mouseup', onUp) - listener.removeEventListener('touchstart', onDown) - listener.removeEventListener('touchmove', onMove) - listener.removeEventListener('touchend', onUp) - - if (hasPointerLock) { - document.removeEventListener(pointerLockPrefix + 'pointerlockchange', onPointerLockChange) - document.removeEventListener('mousemove', onPointerLockMove) - document.body[pointerLockPrefix + (pointerLockPrefix ? 'E' : 'e') + 'xitPointerLock']() - } - active = false - } - - function onDown (e) { - e = normalizeEvent(e) - if (!e) return - down = true - lastX = e.pageX - lastY = e.pageY - } - - function onMove (e) { - if (e.type = 'touchmove') { - e.preventDefault() - } - if (pub.drag && !down) return - e = normalizeEvent(e) - if (!e) return - lastX = lastX || e.pageX - lastY = lastY || e.pageY - var dx = e.pageX - lastX, - dy = e.pageY - lastY - lastX = e.pageX - lastY = e.pageY - updateTarget(dx, dy) - } - - function onUp () { - down = false - } - - function initPointerLock () { - - if (pointerLockEnabled) return - - document.addEventListener(pointerLockPrefix + 'pointerlockchange', onPointerLockChange) - document.addEventListener('mousemove', onPointerLockMove) - - document.body[pointerLockPrefix + (pointerLockPrefix ? 'R' : 'r') + 'equestPointerLock']() - } - - function onPointerLockChange () { - var el = document.body - if (document[pointerLockPrefix + (pointerLockPrefix ? 'P' : 'p') + 'ointerLockElement'] === el) { - pointerLockEnabled = true - } else { - pointerLockEnabled = false - } - } - - function onPointerLockMove (e) { - if (!pointerLockEnabled) return - var dx = e[pointerLockPrefix + (pointerLockPrefix ? 'M' : 'm') + 'ovementX'], - dy = e[pointerLockPrefix + (pointerLockPrefix ? 'M' : 'm') + 'ovementY'] - updateTarget(dx, dy) - } - - function normalizeEvent (e) { - if (e.touches) { - return e.touches.length > 1 ? false : e.touches[0] - } else { - return e - } - } - - function updateTarget (dx, dy) { - if (pub.inverseX) dx = -dx - if (pub.inverseY) dy = -dy - if (MX.rotationUnit !== 'deg') { - dx = MX.toRad(dx) - dy = MX.toRad(dy) - } - - if (!pub.disableX) { - pub.rotationX -= dy * pub.sensitivity - if (pub.upperBoundX) pub.rotationX = Math.min(pub.rotationX, pub.upperBoundX) - if (pub.lowerBoundX) pub.rotationX = Math.max(pub.rotationX, pub.lowerBoundX) - } - - if (!pub.disableY) { - pub.rotationY += dx * pub.sensitivity - if (pub.upperBoundY) pub.rotationY = Math.min(pub.rotationY, pub.upperBoundY) - if (pub.lowerBoundY) pub.rotationY = Math.max(pub.rotationY, pub.lowerBoundY) - } - } - - function update () { - if (!object || locked) return - var dx = pub.rotationX - object.rotationX, - dy = pub.rotationY - object.rotationY - if (Math.abs(dx) < 0.0001) { - object.rotationX = pub.rotationX - } else { - object.rotationX += dx / pub.ease - } - if (Math.abs(dy) < 0.0001) { - object.rotationY = pub.rotationY - } else { - object.rotationY += dy / pub.ease - } - } - - function lock () { - locked = true - } - - function unlock () { - pub.rotationX = object.rotationX - pub.rotationY = object.rotationY - locked = false - } - - pub.init = init - pub.remove = remove - pub.update = update - pub.lock = lock - pub.unlock = unlock - pub.initPointerLock = initPointerLock - pub.changeObject = changeObject - pub.changeListener = changeListener - - return pub - -}
\ No newline at end of file diff --git a/assets/javascripts/mx/extensions/mx.scene.js b/assets/javascripts/mx/extensions/mx.scene.js deleted file mode 100644 index 8f11fb0..0000000 --- a/assets/javascripts/mx/extensions/mx.scene.js +++ /dev/null @@ -1,165 +0,0 @@ -// NOTE -// -// This is not a fully functional 3d scene as you might expect. -// The camera can only do pitch (rotationX) and yaw (rotationY), but no roll (rotationZ) -// because I haven't implemented alternative euler orders or quaternions. -// -// For serious 3D scenes with more functionalities you should use -// THREE.js with CSS3D Renderer. - -MX.Camera = MX.Object3D.extend({ - - init: function(){ - this.el = null - this.type = "Camera" - }, - - move: function(s){ - for (var i in s) { - this[i] = s[i] - } - }, - - toString: function(){ - var params = "x y z rotationX rotationY".split(" ") - return this.__toString(params, "scene.camera.move") - }, - - getCameraEuler: function (target) { - var dx = target.x - this.x, - dy = target.y - this.y, - dz = target.z - this.z - r = {} - r.y = Math.atan2(-dx, dz) - r.x = Math.atan2(-dy, Math.sqrt(dx*dx + dz*dz)) - r.z = 0 - if (MX.rotationUnit === 'deg') { - r.x = MX.toDeg(r.x) - r.y = MX.toDeg(r.y) - } - return r - } - -}) - -MX.Scene = (function () { - - var add = MX.Object3D.prototype.add, - remove = MX.Object3D.prototype.remove - - function Scene () { - - this.el = document.createElement('div') - this.el.classList.add('mx-scene') - - var s = this.el.style - - s[MX.transformProp] = 'preserve-3d' - - s.webkitPerspectiveOrigin = '50% 50%' - s.mozPerspectiveOrigin = '50% 50%' - s.perspectiveOrigin = '50% 50%' - - s.webkitUserSelect = 'none' - s.mozUserSelect = 'none' - s.userSelect = 'none' - - s.overflow = 'hidden' - - this.inner = new MX.Object3D().addTo(this.el) - this.inner.el.style.width = '0' - this.inner.el.style.height = '0' - - var self = this - var width, height, perspective - - Object.defineProperty(this, 'width', { - get: function () { - return width - }, - set: function (val) { - width = val - self.el.style.width = val + 'px' - } - }) - - Object.defineProperty(this, 'height', { - get: function () { - return height - }, - set: function (val) { - height = val - self.el.style.height = val + 'px' - } - }) - - Object.defineProperty(this, 'perspective', { - get: function () { - return perspective - }, - set: function (val) { - perspective = val - self.el.style[MX.perspectiveProp] = val + 'px' - self.inner.z = -val - self.camera.z - self.inner.rotationOrigin.z = -val - } - }) - - var cam = this.camera = new MX.Camera() - - this.inner.rotationOrigin = { x:0, y:0, z:0 } - - this.perspective = 0 - } - - Scene.prototype = { - - constructor: Scene, - - add: function () { - add.apply(this.inner, arguments) - return this - }, - - remove: function () { - remove.apply(this.inner, arguments) - return this - }, - - addTo: function (target) { - if (typeof target === 'string') { - target = document.querySelector(target) - } - if (target instanceof HTMLElement && target.appendChild) { - target.appendChild(this.el) - } else { - console.warn('You can only add a Scene to an HTML element.') - } - return this - }, - - update: function () { - // update inner based on camera - - var i = this.inner, - c = this.camera - - c.update() - - i.z = -this.perspective - c.z - i.x = -c.x - i.y = -c.y - - i.rotationX = -c.rotationX - i.rotationY = -c.rotationY - //i.rotationZ = -c.rotationZ - - i.update() - return this - }, - - } - - return Scene - -})()
\ No newline at end of file diff --git a/assets/javascripts/mx/extensions/mx.scrubber.js b/assets/javascripts/mx/extensions/mx.scrubber.js deleted file mode 100644 index 54612f2..0000000 --- a/assets/javascripts/mx/extensions/mx.scrubber.js +++ /dev/null @@ -1,191 +0,0 @@ -/* - Use the scrollwheel to tween between different points and orientations - - scrubber = new MX.Scrubber(cam, [ - { - position: [0, viewHeight, -1000], - rotation: [0, 0] - }, - { - position: [0, 1000, 1000], - rotation: [0, Math.PI] - }, - { - position: [0, viewHeight, -1000], - rotation: [0, 2*Math.PI] - }, - { - position: [0, viewHeight, -2000], - rotation: [0, 0] - } - ]) - - // in your animate function: - scrubber.update() - -*/ - -MX.Scrubber = function (obj, points) { - - obj = obj || {} - points = points || {} - - var reversible = true, loop = false; - - var total = points.length * 100, - distance = 0 - destination = 0, - last_index = -1, - last_name = null, - locked = false, - point_count = points.length + (loop+0) - - var avg_speed = scroll_avg_speed = 5, - click_avg_speed = 20, - webkit_ratio = 0.02 - - if (points[0].position) { - points.forEach(function(p){ - p.x = p.position[0] - p.y = p.position[1] - p.z = p.position[2] - p.rotationX = p.rotation[0] - p.rotationY = p.rotation[1] - }) - } - - document.addEventListener('touchstart', next, false); - document.addEventListener('mousedown', next, false); - document.addEventListener('mousewheel', onDocumentMouseWheel, false); - document.addEventListener('DOMMouseScroll', onDocumentMouseWheel, false); - function onDocumentMouseWheel (e) { - - if (locked) return - - var delta = 0; - - // WebKit - if ( event.wheelDeltaY ) { - delta -= event.wheelDeltaY * webkit_ratio - } - // Opera / Explorer 9 - else if ( event.wheelDelta ) { - delta -= event.wheelDelta * webkit_ratio - } - // Firefox - else if ( event.detail ) { - delta += event.detail * 2 - } - if (! reversible && delta < 0) return; - - if (destination < total-100 || delta < 0) { - e.preventDefault() - } - else { - return - } - - destination += delta - - avg_speed = scroll_avg_speed - } - - function add_point(point){ - if (point.type == "Camera") { - point = { - position: [ point.x, point.y, point.z ], - rotation: [ point.rotationX, point.rotationY ], - callback: noop - } - } - points.push(point) - total = points.length * 100 - } - - function reset(){ - distance = destination = 0 - last_index = -1 - last_name = null - } - - function next(){ - destination = ~~(destination/100) * 100 - destination += 100 - avg_speed = click_avg_speed - } - - function update(){ - if (locked) return - - if (destination > total-100) destination = total-100 - - distance = avg(distance, destination, avg_speed) - var ratio = distance / total - - if (! loop) { - if (ratio < 0) { - destination = 0 - ratio = 0 - } - else if (ratio > 1) { - destination = total - ratio = 1 - } - } - - var diff = ratio * point_count - var step = (distance % 100) / 100 - var src = ~~clamp(diff, 0, point_count-1) - var halfway = ~~clamp(diff + 0.5, 0, point_count-1) - var dest = ~~clamp(diff + 1, 0, point_count-1) - - if (halfway != last_index) { - last_index = halfway - if (points[last_index].name != last_name) { - last_name = points[last_index].name - } - $("#info .active").removeClass("active") - $("#info div[data-name='" + last_name + "']").addClass("active") - points[halfway].callback && points[halfway].callback() - } - - var ry0 = points[src].rotationY - var ry1 = points[dest].rotationY - if (abs(ry0 - ry1) == TWO_PI) { - ry0 = ry1 - } - - obj.x = lerp(step, points[src].x, points[dest].x) - obj.y = lerp(step, points[src].y, points[dest].y) - obj.z = lerp(step, points[src].z, points[dest].z) - obj.rotationX = lerp(step, points[src].rotationX, points[dest].rotationX) - obj.rotationY = lerp(step, ry0, ry1) - if (obj.rotationY > PI) { obj.rotationY -= TWO_PI } - } - - var scrubber = { - init: function(){ - app && app.movements && app.movements.lock() - }, - lock: function(){ - app && app.movements && app.movements.unlock() - locked = true - }, - unlock: function(){ - app && app.movements && app.movements.lock() - locked = false - }, - step: function(n){ - distance = destination = n * 100 - }, - add_point: add_point, - reset: reset, - next: next, - update: update, - - obj: obj, - points: points - } - - return scrubber; -} diff --git a/assets/javascripts/mx/mx.js b/assets/javascripts/mx/mx.js deleted file mode 100644 index df9abe7..0000000 --- a/assets/javascripts/mx/mx.js +++ /dev/null @@ -1,583 +0,0 @@ -/** - * Copyright (C) 2013 by Evan You - * - * Permission is hereby granted, free of charge, to any person obtaining a copy - * of this software and associated documentation files (the "Software"), to deal - * in the Software without restriction, including without limitation the rights - * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell - * copies of the Software, and to permit persons to whom the Software is - * furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in - * all copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, - * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN - * THE SOFTWARE. - */ - -var MX = MX || (function (undefined) { - - var MX = { - version: '0.1.0', - prefix: undefined, - rotationUnit: 'rad' - } - - var floatPrecision = 5 - - // ======================================================================== - // Setup & Compatibility - // ======================================================================== - - var transformProp, - transitionProp, - transformOriginProp, - transformStyleProp, - perspectiveProp, - transitionEndEvent - - var positionAtCenter = true, // whether to auto center objects - centeringCSS // styles to inject for center positioning - - document.addEventListener('DOMContentLoaded', setup) - - function setup () { - - // sniff prefix - - var s = document.body.style - - MX.prefix = - 'webkitTransform' in s ? 'webkit' : - 'mozTransform' in s ? 'moz' : - 'msTransform' in s ? 'ms' : '' - - transformProp = MX.transformProp = addPrefix('transform') - transitionProp = MX.transitionProp = addPrefix('transition') - transformOriginProp = MX.transformOriginProp = addPrefix('transformOrigin') - transformStyleProp = MX.transformStyleProp = addPrefix('transformStyle') - perspectiveProp = MX.perspectiveProp = addPrefix('perspective') - transitionEndEvent = MX.transitionEndEvent = MX.prefix === 'webkit' ? 'webkitTransitionEnd' : 'transitionend' - - // shiv rAF - - var vendors = ['webkit', 'moz', 'ms'] - for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) { - window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame'] - window.cancelAnimationFrame = - window[vendors[x]+'CancelAnimationFrame'] || - window[vendors[x]+'CancelRequestAnimationFrame'] - } - - // inject centering css - - centeringCSS = document.createElement('style') - centeringCSS.type = 'text/css' - centeringCSS.innerHTML = - '.mx-object3d {' - + 'position: absolute;' - + 'top: 50%;' - + 'left: 50%;}' - injectCenteringCSS() - - window.scrollTo(0,0) - } - - function injectCenteringCSS () { - document.head.appendChild(centeringCSS) - } - - function removeCenteringCSS () { - document.head.removeChild(centeringCSS) - } - - // ======================================================================== - // Utils - // ======================================================================== - - function toDeg (rad) { - return rad / Math.PI * 180 - } - - function toRad (deg) { - return deg / 180 * Math.PI - } - - function buildRotationTranslation (obj) { - - // used when rotationOrigin is set - - var origin = obj.rotationOrigin - if (!origin) { - return - } else { - var dx = origin.x - obj.x, - dy = -(origin.y - obj.y), - dz = -(origin.z - obj.z) - return { - before: 'translate3d(' + dx.toFixed(floatPrecision) +'px,' + dy.toFixed(floatPrecision) + 'px,' + dz.toFixed(floatPrecision) + 'px) ', - after: 'translate3d(' + (-dx).toFixed(floatPrecision) + 'px,' + (-dy).toFixed(floatPrecision) + 'px,' + (-dz).toFixed(floatPrecision) + 'px) ' - } - } - } - - function addPrefix (string) { - if (MX.prefix) { - string = MX.prefix + string.charAt(0).toUpperCase() + string.slice(1) - } - return string - } - - // ======================================================================== - // Base Object3D - // ======================================================================== - - function Object3D (el) { - - this.setupDomElement(el) - this.setCSSTransformStyle('preserve-3d') - this.el.classList.add('mx-object3d') - - this.parent = undefined - this.children = [] - this.updateChildren = true - - this.inverseLookAt = false - - this.persisted = true - - this.reset() - -// this.quaternion = new MX.Quaternion () -// this.quaternion._euler = this - - var width, height, - self = this - - Object.defineProperty(this, 'width', { - get: function () { - return width - || parseInt(self.el.style.width, 10) - || 0 - }, - set: function (val) { - width = val - this.el.style.width = width + 'px' - } - }) - - Object.defineProperty(this, 'height', { - get: function () { - return height - || parseInt(self.el.style.height, 10) - || 0 - }, - set: function (val) { - height = val - this.el.style.height = height + 'px' - } - }) - } - - Object3D.prototype = { - - constructor: Object3D, - - reset: function () { - this.x = this.__x = 0 - this.y = this.__y = 0 - this.z = this.__z = 0 - this.rotationX = this.__rotationX = 0 - this.rotationY = this.__rotationY = 0 - this.rotationZ = this.__rotationZ = 0 - this.scaleX = this.__scaleX = 1 - this.scaleY = this.__scaleY = 1 - this.scaleZ = this.__scaleZ = 1 - this.scale = this.__scale = 1 - this.perspective = this.__perspective = 0 - this.rotationOrigin = undefined - this.followTarget = undefined -// this.quaternion = new MX.Quaternion() - this.dirty = true - this.update() - }, - - setupDomElement: function (el) { - this.el = undefined - if (el instanceof HTMLElement) { - this.el = el - } else if (typeof el === 'string') { - var tag = el.match(/^[^.#\s]*/)[1], - id = el.match(/#[^.#\s]*/), - classes = el.match(/\.[^.#\s]*/g) - this.el = document.createElement(tag || 'div') - if (id) { - this.el.id = id[0].slice(1) - } - if (classes) { - var i = classes.length - while (i--) { - this.el.classList.add(classes[i].slice(1)) - } - } - } else { - this.el = document.createElement('div') - } - }, - - update: function () { - - if (this.updateChildren) { - var i = this.children.length - while (i--) { - this.children[i].update() - } - } - - if (this.followTarget) { - this.lookAt(this.followTarget, false) - } - - if (this.scaleX !== this.__scaleX || - this.scaleY !== this.__scaleY || - this.scaleZ !== this.__scaleZ) { - this.__scaleX = this.scaleX - this.__scaleY = this.scaleY - this.__scaleZ = this.scaleZ - this.dirty = true - } - - if (this.scale !== this.__scale) { - this.scaleX = - this.scaleY = - this.scaleZ = - this.__scaleX = - this.__scaleY = - this.__scaleZ = - this.__scale = - this.scale - this.dirty = true - } - - if (this.rotationX !== this.__rotationX || - this.rotationY !== this.__rotationY || - this.rotationZ !== this.__rotationZ) { - this.__rotationX = this.rotationX - this.__rotationY = this.rotationY - this.__rotationZ = this.rotationZ - this.dirty = true - } - - if (this.x !== this.__x || - this.y !== this.__y || - this.z !== this.__z) { - this.__x = this.x - this.__y = this.y - this.__z = this.z - this.dirty = true - } - - if (this.perspective !== this.__perspective) { - this.__perspective = this.perspective - this.dirty = true - } - - if (this.dirty && this.el) { - - var rotationTranslation = buildRotationTranslation(this), - rotation = 'rotateX(' + this.rotationX.toFixed(floatPrecision) + MX.rotationUnit + ') ' - + 'rotateY(' + this.rotationY.toFixed(floatPrecision) + MX.rotationUnit + ') ' - + 'rotateZ(' + this.rotationZ.toFixed(floatPrecision) + MX.rotationUnit + ') ' - - var transformString = - (MX.positionAtCenter ? 'translate3d(-50%, -50%, 0) ' : '') - + (this.perspective ? 'perspective(' + this.perspective + 'px) ' : '') - + 'translate3d(' - + this.x.toFixed(floatPrecision || 0) + 'px,' - + (-this.y).toFixed(floatPrecision) + 'px,' - + (-this.z).toFixed(floatPrecision) + 'px) ' - + 'scale3d(' - + this.scaleX.toFixed(floatPrecision) + ',' - + this.scaleY.toFixed(floatPrecision) + ',' - + this.scaleZ.toFixed(floatPrecision) + ') ' - - if (rotationTranslation) { - transformString += rotationTranslation.before - + rotation - + rotationTranslation.after - - } else { - transformString += rotation - } - - this.el.style[transformProp] = transformString - this.dirty = false - } - - return this - - }, - - // taken from three.js - setFromQuaternion: function ( q, order, update ) { - // q is assumed to be normalized - - // http://www.mathworks.com/matlabcentral/fileexchange/20696-function-to-convert-between-dcm-euler-angles-quaternions-and-euler-vectors/content/SpinCalc.m - - var sqx = q.x * q.x; - var sqy = q.y * q.y; - var sqz = q.z * q.z; - var sqw = q.w * q.w; - - this.rotationX = Math.atan2( 2 * ( q.x * q.w - q.y * q.z ), ( sqw - sqx - sqy + sqz ) ); - this.rotationY = Math.asin( clamp( 2 * ( q.x * q.z + q.y * q.w ), -1, 1 ) ); - this.rotationZ = Math.atan2( 2 * ( q.z * q.w - q.x * q.y ), ( sqw + sqx - sqy - sqz ) ); - }, - - lookAt: function (target, update) { - var r = this.getLookAtEuler(target) - this.setRotation(r) - if (update !== false) this.update() - return this - }, - - getLookAtEuler: function (target) { - // euler order XYZ - var r = {}, - dx = target.x - this.x, - dy = target.y - this.y, - dz = target.z - this.z - if (this.inverseLookAt) { - dx = -dx - dy = -dy - dz = -dz - } - if (dz === 0) dz = 0.001 - r.x = -Math.atan2(dy, dz) - var flip = dz > 0 ? 1 : -1 - r.y = flip * Math.atan2(dx * Math.cos(r.x), dz * -flip) - r.z = Math.atan2(Math.cos(r.x), Math.sin(r.x) * Math.sin(r.y)) - Math.PI / 2 - if (MX.rotationUnit === 'deg') { - r.x = toDeg(r.x) - r.y = toDeg(r.y) - r.z = toDeg(r.z) - } - return r - }, - - add: function () { - if (!this.el) return - var parent = this - Array.prototype.forEach.call(arguments, function (child) { - if (!child instanceof Object3D) return - parent.el.appendChild(child.el) - if (!parent.children) parent.children = [] - parent.children.push(child) - child.parent = parent - }) - return this - }, - - remove: function () { - var parent = this - Array.prototype.forEach.call(arguments, function (child) { - var index = parent.children.indexOf(child) - if (index !== -1) { - parent.children.splice(index, 1) - parent.el.removeChild(child.el) - child.parent = undefined - } - }) - return this - }, - - addTo: function (target) { - if (typeof target === 'string') { - target = document.querySelector(target) - } - if (target instanceof HTMLElement && target.appendChild) { - target.appendChild(this.el) - } else if (target instanceof Object3D || target instanceof Scene) { - target.add(this) - } - return this - }, - - removeElement: function () { - if (this.el.parentNode) { - this.el.parentNode.removeChild(this.el) - } - }, - - setPosition: function (tar) { - this.x = (tar.x || tar.x === 0) ? tar.x : this.x - this.y = (tar.y || tar.y === 0) ? tar.y : this.y - this.z = (tar.z || tar.z === 0) ? tar.z : this.z - }, - - setRotation: function (tar) { - this.rotationX = (tar.x || tar.x === 0) ? tar.x : this.rotationX - this.rotationY = (tar.y || tar.y === 0) ? tar.y : this.rotationY - this.rotationZ = (tar.z || tar.z === 0) ? tar.z : this.rotationZ - }, - - setScale: function (tar) { - this.scaleX = (tar.x || tar.x === 0) ? tar.x : this.scaleX - this.scaleY = (tar.y || tar.y === 0) ? tar.y : this.scaleY - this.scaleZ = (tar.z || tar.z === 0) ? tar.z : this.scaleZ - }, - - setCSSTransformOrigin: function (origin) { - this.el && (this.el.style[transformOriginProp] = origin) - return this - }, - - setCSSTransformStyle: function (style) { - this.el && (this.el.style[transformStyleProp] = style) - return this - }, - - setCSSTransition: function (trans) { - this.el && (this.el.style[transitionProp] = trans) - return this - }, - - setCSSPerspective: function (pers) { - this.el && (this.el.style[perspectiveProp] = pers) - return this - }, - - onTransitionEnd: function (callback) { - this.cancelTransitionEnd() - var el = this.el - el.addEventListener(transitionEndEvent, onEnd) - function onEnd () { - el.removeEventListener(transitionEndEvent, onEnd) - callback() - } - }, - - cancelTransitionEnd: function () { - this.el.removeEventListener(transitionEndEvent) - }, - - toString: function(params){ - params = params || "id width height depth x y z rotationX rotationY rotationZ scale".split(" ") - return this.__toString(params) - }, - - __toString: function(params, func){ - this.id = this.id || guid() - var list = [], - obj = {}, - type = this.type || "Object3d", - name = type.toLowerCase(), - val, - param - for (var i in params) { - param = params[i] - val = this[param] - if (val === 0 && ! func) continue; - if (typeof val == "number") { - if (param.indexOf("rotation") != -1) { - obj[param] = Number(val.toFixed(3)) - } - else { - obj[param] = ~~val - } - } - else { - obj[param] = val - } - } - - return (func || "var " + name + " = new MX." + type ) + "(" + - JSON.stringify(obj, undefined, 2) + - ")\n" + (func ? "" : "scene.add(" + name + ")") - }, - - contains: function(x,y,z){ - var containsX = false, - containsY = false, - containsZ = false - - if (x === null) { - containsX = true - } - else { - containsX = abs(this.x - x) <= this.width/2 - } - - if (y === null) { - containsY = true - } - else { - containsY = abs(this.y - y) <= this.height/2 - } - - if (z === null) { - containsZ = true - } - else { - containsZ = abs(this.z - z) <= this.depth/2 - } - - return (containsX && containsY && containsZ) - } - - } - - // ======================================================================== - // Inheritance - // ======================================================================== - - Object3D.extend = extend.bind(Object3D) - - function extend (props) { - var Super = this - var ExtendedObject3D = function () { - Super.call(this) - props.init && props.init.apply(this, arguments) - } - ExtendedObject3D.prototype = Object.create(Super.prototype) - for (var prop in props) { - if (props.hasOwnProperty(prop) && prop !== 'init') { - ExtendedObject3D.prototype[prop] = props[prop] - } - } - ExtendedObject3D.extend = extend.bind(ExtendedObject3D) - return ExtendedObject3D - } - - // ======================================================================== - // Expose API - // ======================================================================== - - MX.Object3D = Object3D - MX.toRad = toRad - MX.toDeg = toDeg - - // center positioning getter setter - Object.defineProperty(MX, 'positionAtCenter', { - get: function () { - return positionAtCenter - }, - set: function (val) { - if (typeof val !== 'boolean') return - positionAtCenter = val - if (positionAtCenter) { - injectCenteringCSS() - } else { - removeCenteringCSS() - } - } - }) - - return MX - -})()
\ No newline at end of file diff --git a/assets/javascripts/mx/mx.min.js b/assets/javascripts/mx/mx.min.js deleted file mode 100644 index b0f0cdd..0000000 --- a/assets/javascripts/mx/mx.min.js +++ /dev/null @@ -1 +0,0 @@ -var MX=MX||function(undefined){var MX={prefix:undefined,rotationUnit:"rad"};var floatPrecision=5;var transformProp,transitionProp,transformOriginProp,transformStyleProp,perspectiveProp;var positionAtCenter=true,centeringCSS;document.addEventListener("DOMContentLoaded",setup);function setup(){var s=document.body.style;MX.prefix="webkitTransform"in s?"webkit":"mozTransform"in s?"moz":"msTransform"in s?"ms":"";transformProp=MX.transformProp=addPrefix("transform");transitionProp=MX.transitionProp=addPrefix("transition");transformOriginProp=MX.transformOriginProp=addPrefix("transformOrigin");transformStyleProp=MX.transformStyleProp=addPrefix("transformStyle");perspectiveProp=MX.perspectiveProp=addPrefix("perspective");var vendors=["webkit","moz","ms"];for(var x=0;x<vendors.length&&!window.requestAnimationFrame;++x){window.requestAnimationFrame=window[vendors[x]+"RequestAnimationFrame"];window.cancelAnimationFrame=window[vendors[x]+"CancelAnimationFrame"]||window[vendors[x]+"CancelRequestAnimationFrame"]}centeringCSS=document.createElement("style");centeringCSS.type="text/css";centeringCSS.innerHTML=".mx-object3d {"+"position: absolute;"+"top: 50%;"+"left: 50%;}";injectCenteringCSS()}function injectCenteringCSS(){document.head.appendChild(centeringCSS)}function removeCenteringCSS(){document.head.removeChild(centeringCSS)}function toDeg(rad){return rad/Math.PI*180}function toRad(deg){return deg/180*Math.PI}function buildRotationTranslation(obj){var origin=obj.rotationOrigin;if(!origin){return}else{var dx=origin.x-obj.x,dy=-(origin.y-obj.y),dz=-(origin.z-obj.z);return{before:"translate3d("+dx+"px,"+dy+"px,"+dz+"px) ",after:"translate3d("+-dx+"px,"+-dy+"px,"+-dz+"px) "}}}function addPrefix(string){if(MX.prefix){string=MX.prefix+string.charAt(0).toUpperCase()+string.slice(1)}return string}function Object3D(el){this.setupDomElement(el);this.setCSSTransformStyle("preserve-3d");this.el.classList.add("mx-object3d");this.parent=undefined;this.children=[];this.updateChildren=true;this.inverseLookAt=false;this.reset();var width,height,self=this;Object.defineProperty(this,"width",{get:function(){return width||parseInt(self.el.style.width,10)||0},set:function(val){width=val;this.el.style.width=width+"px"}});Object.defineProperty(this,"height",{get:function(){return height||parseInt(self.el.style.height,10)||0},set:function(val){height=val;this.el.style.height=height+"px"}})}Object3D.prototype={constructor:Object3D,reset:function(){this.x=this.__x=0;this.y=this.__y=0;this.z=this.__z=0;this.rotationX=this.__rotationX=0;this.rotationY=this.__rotationY=0;this.rotationZ=this.__rotationZ=0;this.scaleX=this.__scaleX=1;this.scaleY=this.__scaleY=1;this.scaleZ=this.__scaleZ=1;this.scale=this.__scale=1;this.rotationOrigin=undefined;this.followTarget=undefined;this.dirty=true;this.update()},setupDomElement:function(el){this.el=undefined;if(el instanceof HTMLElement){this.el=el}else if(typeof el==="string"){var tag=el.match(/^[^.#\s]*/)[1],id=el.match(/#[^.#\s]*/),classes=el.match(/\.[^.#\s]*/g);this.el=document.createElement(tag||"div");if(id){this.el.id=id[0].slice(1)}if(classes){var i=classes.length;while(i--){this.el.classList.add(classes[i].slice(1))}}}else{this.el=document.createElement("div")}},update:function(){if(this.updateChildren){var i=this.children.length;while(i--){this.children[i].update()}}if(this.followTarget){this.lookAt(this.followTarget,false)}if(this.scaleX!==this.__scaleX||this.scaleY!==this.__scaleY||this.scaleZ!==this.__scaleZ){this.__scaleX=this.scaleX;this.__scaleY=this.scaleY;this.__scaleZ=this.scaleZ;this.dirty=true}if(this.scale!==this.__scale){this.scaleX=this.scaleY=this.scaleZ=this.__scaleX=this.__scaleY=this.__scaleZ=this.__scale=this.scale;this.dirty=true}if(this.rotationX!==this.__rotationX||this.rotationY!==this.__rotationY||this.rotationZ!==this.__rotationZ){this.__rotationX=this.rotationX;this.__rotationY=this.rotationY;this.__rotationZ=this.rotationZ;this.dirty=true}if(this.x!==this.__x||this.y!==this.__y||this.z!==this.__z){this.__x=this.x;this.__y=this.y;this.__z=this.z;this.dirty=true}if(this.dirty&&this.el){var rotationTranslation=buildRotationTranslation(this),rotation="rotateX("+this.rotationX.toFixed(floatPrecision)+MX.rotationUnit+") "+"rotateY("+this.rotationY.toFixed(floatPrecision)+MX.rotationUnit+") "+"rotateZ("+this.rotationZ.toFixed(floatPrecision)+MX.rotationUnit+") ";var transformString=(MX.positionAtCenter?"translate3d(-50%, -50%, 0) ":"")+"translate3d("+this.x.toFixed(floatPrecision)+"px,"+(-this.y).toFixed(floatPrecision)+"px,"+(-this.z).toFixed(floatPrecision)+"px) "+"scale3d("+this.scaleX.toFixed(floatPrecision)+","+this.scaleY.toFixed(floatPrecision)+","+this.scaleZ.toFixed(floatPrecision)+") ";if(rotationTranslation){transformString+=rotationTranslation.before+rotation+rotationTranslation.after}else{transformString+=rotation}this.el.style[transformProp]=transformString;this.dirty=false}return this},lookAt:function(target,update){var r=this.getLookAtEuler(target);this.setRotation(r);if(update!==false)this.update();return this},getLookAtEuler:function(target){var r={},dx=target.x-this.x,dy=target.y-this.y,dz=target.z-this.z;if(this.inverseLookAt){dx=-dx;dy=-dy;dz=-dz}if(dz===0)dz=.001;r.x=-Math.atan2(dy,dz);var flip=dz>0?1:-1;r.y=flip*Math.atan2(dx*Math.cos(r.x),dz*-flip);r.z=Math.atan2(Math.cos(r.x),Math.sin(r.x)*Math.sin(r.y))-Math.PI/2;if(MX.rotationUnit==="deg"){r.x=toDeg(r.x);r.y=toDeg(r.y);r.z=toDeg(r.z)}return r},add:function(){if(!this.el)return;var parent=this;Array.prototype.forEach.call(arguments,function(child){if(!child instanceof Object3D)return;parent.el.appendChild(child.el);if(!parent.children)parent.children=[];parent.children.push(child);child.parent=parent});return this},remove:function(){var parent=this;Array.prototype.forEach.call(arguments,function(child){var index=parent.children.indexOf(child);if(index!==-1){parent.children.splice(index,1);child.parent=undefined}});return this},addTo:function(target){if(typeof target==="string"){target=document.querySelector(target)}if(target instanceof HTMLElement&&target.appendChild){target.appendChild(this.el)}else if(target instanceof Object3D||target instanceof Scene){target.add(this)}return this},removeElement:function(){if(this.el.parentNode){this.el.parentNode.removeChild(this.el)}},setPosition:function(tar){this.x=tar.x||tar.x===0?tar.x:this.x;this.y=tar.y||tar.y===0?tar.y:this.y;this.z=tar.z||tar.z===0?tar.z:this.z},setRotation:function(tar){this.rotationX=tar.x||tar.x===0?tar.x:this.rotationX;this.rotationY=tar.y||tar.y===0?tar.y:this.rotationY;this.rotationZ=tar.z||tar.z===0?tar.z:this.rotationZ},setScale:function(tar){this.scaleX=tar.x||tar.x===0?tar.x:this.scaleX;this.scaleY=tar.y||tar.y===0?tar.y:this.scaleY;this.scaleZ=tar.z||tar.z===0?tar.z:this.scaleZ},setCSSTransformOrigin:function(origin){this.el&&(this.el.style[transformOriginProp]=addPrefix(origin));return this},setCSSTransformStyle:function(style){this.el&&(this.el.style[transformStyleProp]=addPrefix(style));return this},setCSSTransition:function(trans){this.el&&(this.el.style[transitionProp]=addPrefix(trans));return this},setCSSPerspective:function(pers){this.el&&(this.el.style[perspectiveProp]=addPrefix(pers));return this}};Object3D.extend=extend.bind(Object3D);function extend(props){var Super=this;var ExtendedObject3D=function(){Super.call(this);props.init&&props.init.apply(this,arguments)};ExtendedObject3D.prototype=Object.create(Super.prototype);for(var prop in props){if(props.hasOwnProperty(prop)&&prop!=="init"){ExtendedObject3D.prototype[prop]=props[prop]}}ExtendedObject3D.extend=extend.bind(ExtendedObject3D);return ExtendedObject3D}MX.Object3D=Object3D;MX.toRad=toRad;MX.toDeg=toDeg;Object.defineProperty(MX,"positionAtCenter",{get:function(){return positionAtCenter},set:function(val){if(typeof val!=="boolean")return;positionAtCenter=val;if(positionAtCenter){injectCenteringCSS()}else{removeCenteringCSS()}}});return MX}();
\ No newline at end of file diff --git a/assets/javascripts/mx/mx.minimap.js b/assets/javascripts/mx/mx.minimap.js deleted file mode 100644 index 252305c..0000000 --- a/assets/javascripts/mx/mx.minimap.js +++ /dev/null @@ -1,211 +0,0 @@ -MX.Minimap = function () { - var canvas = document.createElement("canvas") - var ctx = canvas.getContext("2d") - var w = canvas.width = 200 - var h = canvas.height = 200 - - var gridSpace; - var zoom = 2.7 - - var gridStroke = '#ddd' - var boxFill = '#fff' - var boxStroke = '#000' - var playerColor = '#888' - - var xmin, xmax, ymin, ymax, xpos, ypos, scale, side; - - this.update = function(){ - this.draw() - } - - this.bounds = function(){ - gridSpace = Math.pow(10, ~~(zoom-0.5)+0.5) - side = Math.pow(10, zoom+1) - scale = w / side - xpos = -cam.x - ypos = cam.z - - xmin = side/-2 - xpos - xmax = side/2 - xpos - ymin = side/-2 - ypos - ymax = side/2 - ypos - } - - this.draw = function(){ - ctx.clearRect(0,0,w,h) - - ctx.fillStyle = "#fff" - ctx.fillRect(0,0,w,h) - this.bounds() - this.grid() - this.boxes() - this.player() - } - - this.grid = function(){ - ctx.strokeStyle = gridStroke - ctx.lineWidth = 1 - ctx.fillStyle = "transparent" - - var xmod = xmin-(xmin % gridSpace) - var ymod = ymin-(ymin % gridSpace) - - for (var x = xmin; x < xmax+gridSpace; x += gridSpace) { - var xline = (x-xmod) * scale - line(xline, 0, xline, h) - } - for (var y = ymin; y < ymax+gridSpace; y += gridSpace) { - var yline = (y-ymod) * scale - line(0, yline, w, yline) - } - - function line(x0,y0,x1,y1) { - ctx.beginPath() - ctx.moveTo(x0, y0) - ctx.lineTo(x1, y1) - ctx.stroke() - } - } - this.player = function(){ - ctx.save() - - ctx.translate(~~(w/2),~~(h/2)); - ctx.rotate(-cam.rotationY) - - var radius = 5 - - ctx.fillStyle = playerColor; - - ctx.beginPath(); - ctx.arc(0, 0, radius, 0, 2*Math.PI, false); - ctx.fill(); - - ctx.beginPath(); - ctx.moveTo(0,0) - ctx.lineTo(-radius,0) - ctx.lineTo(0,radius*3) - ctx.lineTo(radius,0) - ctx.moveTo(0,0) - ctx.fill() - - ctx.fillStyle = "transparent" - ctx.restore() - } - - this.boxes = function(){ - - ctx.save() - ctx.translate(~~(w/2),~~(h/2)); - ctx.lineWidth = 0.5 - var tx = ((-xpos) * scale), - ty = ((-ypos) * scale); - ctx.translate(tx, ty) - - scene.inner.children.forEach(function(obj){ - if (obj.type == "BoxDimensions") { - - ctx.save() - ctx.fillStyle = obj.color - ctx.strokeStyle = obj.borderColor - - var obj_scale = (obj.scale || 1) * scale - - var tx = ~~((obj.x) * obj_scale), - ty = ~~((obj.z) * obj_scale); - ctx.translate(-tx, ty) - ctx.rotate(-obj.rotationY) - - var ww = ~~(obj.width/2 * obj_scale) - var hh = ~~(obj.depth/2 * obj_scale) - ctx.beginPath(); - ctx.moveTo(ww, hh) - - ctx.lineTo(ww, -hh) - ctx.lineTo(-ww, -hh) - ctx.lineTo(-ww, hh) - ctx.closePath() - ctx.fill() - ctx.stroke() - ctx.restore() - } - if (obj.type == "Image") { - - ctx.save() - ctx.strokeStyle = "#444" - - var obj_scale = (obj.scale || 1) * scale - - var tx = ~~((obj.x) * obj_scale), - ty = ~~((obj.z) * obj_scale); - ctx.translate(-tx, ty) - ctx.rotate(-obj.rotationY) - - var ww = ~~(obj.width/2 * obj_scale) - ctx.beginPath(); - ctx.moveTo(ww, 0) - ctx.lineTo(-ww, 0) - ctx.closePath() - ctx.stroke() - ctx.restore() - } - }) - ctx.restore() - } - - var dragging = false, mx = 0, my = 0, mdx = 0, mdy = 0, cx, cy; - canvas.addEventListener("mousedown", function(e){ - e.stopPropagation() - var rect = canvas.getBoundingClientRect() - dragging = true; - mx = e.pageX - rect.left - my = e.pageY - rect.top - mdx = (mx - w/2) / scale - mdy = (my - h/2) / scale - cx = cam.x // -= mdx - cy = cam.z // += mdy - - minimap.update() - }) - document.addEventListener("mousemove", function(e){ - if (dragging) { - e.stopPropagation() - var rect = canvas.getBoundingClientRect() - var mnx = e.pageX - rect.left - var mny = e.pageY - rect.top - mdx = (mnx - mx) / scale - mdy = (mny - my) / scale - - cam.x = cx + mdx - cam.z = cy - mdy - minimap.update() - } - }) - document.addEventListener("mouseup", function(e){ - dragging = false; - }) - - canvas.addEventListener( 'mousewheel', onDocumentMouseWheel, false ); - canvas.addEventListener( 'DOMMouseScroll', onDocumentMouseWheel, false); - function onDocumentMouseWheel (e) { - e.preventDefault() - e.stopPropagation() - // WebKit - if ( event.wheelDeltaY ) { - zoom -= event.wheelDeltaY * 0.0003; - } - // Opera / Explorer 9 - else if ( event.wheelDelta ) { - zoom -= event.wheelDelta * 0.0003; - } - // Firefox - else if ( event.detail ) { - zoom += event.detail * 0.01; - } - minimap.update() - } - - this.draw() - document.querySelector("#minimap .el").appendChild(canvas) - - return this; -}
\ No newline at end of file diff --git a/assets/javascripts/mx/mx.quaternion.js b/assets/javascripts/mx/mx.quaternion.js deleted file mode 100644 index 783f887..0000000 --- a/assets/javascripts/mx/mx.quaternion.js +++ /dev/null @@ -1,414 +0,0 @@ -/** - * quaternion taken from three.js - * @author mikael emtinger / http://gomo.se/ - * @author alteredq / http://alteredqualia.com/ - * @author WestLangley / http://github.com/WestLangley - * @author bhouston / http://exocortex.com - */ - -MX.Quaternion = function ( x, y, z, w ) { - - this._x = x || 0; - this._y = y || 0; - this._z = z || 0; - this._w = ( w !== undefined ) ? w : 1; - -}; - -MX.Quaternion.prototype = { - - constructor: MX.Quaternion, - - _x: 0,_y: 0, _z: 0, _w: 0, - - _euler: undefined, - - _updateEuler: function ( callback ) { - - if ( this._euler !== undefined ) { - - this._euler.setFromQuaternion( this, undefined, false ); - - } - - }, - - get x () { - - return this._x; - - }, - - set x ( value ) { - - this._x = value; - this._updateEuler(); - - }, - - get y () { - - return this._y; - - }, - - set y ( value ) { - - this._y = value; - this._updateEuler(); - - }, - - get z () { - - return this._z; - - }, - - set z ( value ) { - - this._z = value; - this._updateEuler(); - - }, - - get w () { - - return this._w; - - }, - - set w ( value ) { - - this._w = value; - this._updateEuler(); - - }, - - set: function ( x, y, z, w ) { - - this._x = x; - this._y = y; - this._z = z; - this._w = w; - - this._updateEuler(); - - return this; - - }, - - copy: function ( quaternion ) { - - this._x = quaternion._x; - this._y = quaternion._y; - this._z = quaternion._z; - this._w = quaternion._w; - - this._updateEuler(); - - return this; - - }, - - setFromEuler: function ( euler, update ) { - - if ( euler instanceof MX.Euler === false ) { - throw new Error( 'ERROR: Quaternion\'s .setFromEuler() now expects a Euler rotation rather than a Vector3 and order. Please update your code.' ); - } - - // http://www.mathworks.com/matlabcentral/fileexchange/ - // 20696-function-to-convert-between-dcm-euler-angles-quaternions-and-euler-vectors/ - // content/SpinCalc.m - - var c1 = Math.cos( euler._x / 2 ); - var c2 = Math.cos( euler._y / 2 ); - var c3 = Math.cos( euler._z / 2 ); - var s1 = Math.sin( euler._x / 2 ); - var s2 = Math.sin( euler._y / 2 ); - var s3 = Math.sin( euler._z / 2 ); - - this._x = s1 * c2 * c3 + c1 * s2 * s3; - this._y = c1 * s2 * c3 - s1 * c2 * s3; - this._z = c1 * c2 * s3 + s1 * s2 * c3; - this._w = c1 * c2 * c3 - s1 * s2 * s3; - - if ( update !== false ) this._updateEuler(); - - return this; - - }, - - setFromAxisAngle: function ( axis, angle ) { - - // from http://www.euclideanspace.com/maths/geometry/rotations/conversions/angleToQuaternion/index.htm - // axis have to be normalized - - var halfAngle = angle / 2, s = Math.sin( halfAngle ); - - this._x = axis.x * s; - this._y = axis.y * s; - this._z = axis.z * s; - this._w = Math.cos( halfAngle ); - - this._updateEuler(); - - return this; - - }, - - setFromRotationMatrix: function ( m ) { - - // http://www.euclideanspace.com/maths/geometry/rotations/conversions/matrixToQuaternion/index.htm - - // assumes the upper 3x3 of m is a pure rotation matrix (i.e, unscaled) - - var te = m.elements, - - m11 = te[0], m12 = te[4], m13 = te[8], - m21 = te[1], m22 = te[5], m23 = te[9], - m31 = te[2], m32 = te[6], m33 = te[10], - - trace = m11 + m22 + m33, - s; - - if ( trace > 0 ) { - - s = 0.5 / Math.sqrt( trace + 1.0 ); - - this._w = 0.25 / s; - this._x = ( m32 - m23 ) * s; - this._y = ( m13 - m31 ) * s; - this._z = ( m21 - m12 ) * s; - - } else if ( m11 > m22 && m11 > m33 ) { - - s = 2.0 * Math.sqrt( 1.0 + m11 - m22 - m33 ); - - this._w = (m32 - m23 ) / s; - this._x = 0.25 * s; - this._y = (m12 + m21 ) / s; - this._z = (m13 + m31 ) / s; - - } else if ( m22 > m33 ) { - - s = 2.0 * Math.sqrt( 1.0 + m22 - m11 - m33 ); - - this._w = (m13 - m31 ) / s; - this._x = (m12 + m21 ) / s; - this._y = 0.25 * s; - this._z = (m23 + m32 ) / s; - - } else { - - s = 2.0 * Math.sqrt( 1.0 + m33 - m11 - m22 ); - - this._w = ( m21 - m12 ) / s; - this._x = ( m13 + m31 ) / s; - this._y = ( m23 + m32 ) / s; - this._z = 0.25 * s; - - } - - this._updateEuler(); - - return this; - - }, - - inverse: function () { - - this.conjugate().normalize(); - - return this; - - }, - - conjugate: function () { - - this._x *= -1; - this._y *= -1; - this._z *= -1; - - this._updateEuler(); - - return this; - - }, - - lengthSq: function () { - - return this._x * this._x + this._y * this._y + this._z * this._z + this._w * this._w; - - }, - - length: function () { - - return Math.sqrt( this._x * this._x + this._y * this._y + this._z * this._z + this._w * this._w ); - - }, - - normalize: function () { - - var l = this.length(); - - if ( l === 0 ) { - - this._x = 0; - this._y = 0; - this._z = 0; - this._w = 1; - - } else { - - l = 1 / l; - - this._x = this._x * l; - this._y = this._y * l; - this._z = this._z * l; - this._w = this._w * l; - - } - - return this; - - }, - - multiply: function ( q, p ) { - - if ( p !== undefined ) { - - console.warn( 'DEPRECATED: Quaternion\'s .multiply() now only accepts one argument. Use .multiplyQuaternions( a, b ) instead.' ); - return this.multiplyQuaternions( q, p ); - - } - - return this.multiplyQuaternions( this, q ); - - }, - - multiplyQuaternions: function ( a, b ) { - - // from http://www.euclideanspace.com/maths/algebra/realNormedAlgebra/quaternions/code/index.htm - - var qax = a._x, qay = a._y, qaz = a._z, qaw = a._w; - var qbx = b._x, qby = b._y, qbz = b._z, qbw = b._w; - - this._x = qax * qbw + qaw * qbx + qay * qbz - qaz * qby; - this._y = qay * qbw + qaw * qby + qaz * qbx - qax * qbz; - this._z = qaz * qbw + qaw * qbz + qax * qby - qay * qbx; - this._w = qaw * qbw - qax * qbx - qay * qby - qaz * qbz; - - this._updateEuler(); - - return this; - - }, - - multiplyVector3: function ( vector ) { - - console.warn( 'DEPRECATED: Quaternion\'s .multiplyVector3() has been removed. Use is now vector.applyQuaternion( quaternion ) instead.' ); - return vector.applyQuaternion( this ); - - }, - - slerp: function ( qb, t ) { - - var x = this._x, y = this._y, z = this._z, w = this._w; - - // http://www.euclideanspace.com/maths/algebra/realNormedAlgebra/quaternions/slerp/ - - var cosHalfTheta = w * qb._w + x * qb._x + y * qb._y + z * qb._z; - - if ( cosHalfTheta < 0 ) { - - this._w = -qb._w; - this._x = -qb._x; - this._y = -qb._y; - this._z = -qb._z; - - cosHalfTheta = -cosHalfTheta; - - } else { - - this.copy( qb ); - - } - - if ( cosHalfTheta >= 1.0 ) { - - this._w = w; - this._x = x; - this._y = y; - this._z = z; - - return this; - - } - - var halfTheta = Math.acos( cosHalfTheta ); - var sinHalfTheta = Math.sqrt( 1.0 - cosHalfTheta * cosHalfTheta ); - - if ( Math.abs( sinHalfTheta ) < 0.001 ) { - - this._w = 0.5 * ( w + this._w ); - this._x = 0.5 * ( x + this._x ); - this._y = 0.5 * ( y + this._y ); - this._z = 0.5 * ( z + this._z ); - - return this; - - } - - var ratioA = Math.sin( ( 1 - t ) * halfTheta ) / sinHalfTheta, - ratioB = Math.sin( t * halfTheta ) / sinHalfTheta; - - this._w = ( w * ratioA + this._w * ratioB ); - this._x = ( x * ratioA + this._x * ratioB ); - this._y = ( y * ratioA + this._y * ratioB ); - this._z = ( z * ratioA + this._z * ratioB ); - - this._updateEuler(); - - return this; - - }, - - equals: function ( quaternion ) { - - return ( quaternion._x === this._x ) && ( quaternion._y === this._y ) && ( quaternion._z === this._z ) && ( quaternion._w === this._w ); - - }, - - fromArray: function ( array ) { - - this._x = array[ 0 ]; - this._y = array[ 1 ]; - this._z = array[ 2 ]; - this._w = array[ 3 ]; - - this._updateEuler(); - - return this; - - }, - - toArray: function () { - - return [ this._x, this._y, this._z, this._w ]; - - }, - - clone: function () { - - return new MX.Quaternion( this._x, this._y, this._z, this._w ); - - } - -}; - -MX.Quaternion.slerp = function ( qa, qb, qm, t ) { - - return qm.copy( qa ).slerp( qb, t ); - -} diff --git a/assets/javascripts/mx/primitives/mx.box.js b/assets/javascripts/mx/primitives/mx.box.js deleted file mode 100644 index dfe3f5e..0000000 --- a/assets/javascripts/mx/primitives/mx.box.js +++ /dev/null @@ -1,62 +0,0 @@ -MX.Box = MX.Object3D.extend({ - - // this will be called within the contructor - init: function (size, color, borderColor) { - - this.type = "Box" - - size = size || 100 - color = color || 'rgba(0, 255, 122, .1)' - borderColor = borderColor || '#0f3' - - // an Object3D's associated DOM node is the "el" property - this.el.classList.add('box') - - var angle = MX.rotationUnit === 'deg' ? 90 : (Math.PI / 2) - - var top = this.top = new MX.Object3D('.face') - top.rotationX = angle - top.y = size / 2 - - var bottom = this.bottom = new MX.Object3D('.face') - bottom.rotationX = -angle - bottom.y = -size / 2 - - var left = this.left = new MX.Object3D('.face') - left.rotationY = -angle - left.x = -size / 2 - - var right = this.right = new MX.Object3D('.face') - right.rotationY = angle - right.x = size / 2 - - var front = this.front = new MX.Object3D('.face') - front.z = -size / 2 - - var back = this.back = new MX.Object3D('.face') - back.rotationY = angle * 2 - back.z = size / 2 - - // adding children, must also be instances of Object3D - this.add(top, bottom, left, right, front, back) - - this.children.forEach(function (face) { - face.width = size - 2 - face.height = size - 2 - face.el.style.backgroundColor = color - face.el.style.border = '1px solid ' + borderColor - }) - - // this applies the updated CSS style - // required for any change to take effect - // when a parent object's update() is called - // all its children will be updated as well - this.update() - - // if this object's children won't move by themselves - this.updateChildren = false - } - - // other properties will be mixed into the prototype of the new constructor - -})
\ No newline at end of file diff --git a/assets/javascripts/mx/primitives/mx.boxDimensions.js b/assets/javascripts/mx/primitives/mx.boxDimensions.js deleted file mode 100644 index f3edb13..0000000 --- a/assets/javascripts/mx/primitives/mx.boxDimensions.js +++ /dev/null @@ -1,154 +0,0 @@ -MX.BoxDimensions = MX.Object3D.extend({ - - // this will be called within the contructor - init: function (opt) { - - var base = this - - this.type = "BoxDimensions" - - var id = this.id = opt.id || guid() - this.x = opt.x || 0 - this.y = opt.y || 0 - this.z = opt.z || 0 - // this.scale = opt.scale || 1 - var scale = opt.scale || 1 - this.rotationX = opt.rotationX || 0 - this.rotationY = opt.rotationY || 0 - this.rotationZ = opt.rotationZ || 0 - var width = this.width = opt.width || 100 - var height = this.height = opt.height || 100 - var depth = this.depth = opt.depth || 100 - var color = this.color = opt.color || 'rgba(0, 255, 122, .1)' - var backgroundImage = this.backgroundImage = opt.backgroundImage; - var borderColor = this.borderColor = opt.borderColor || '#0f3' - var borderWidth = this.borderWidth = typeof opt.borderWidth !== 'undefined' ? opt.borderWidth : 3; - var borderRadius = this.borderRadius = typeof opt.borderRadius !== 'undefined' ? opt.borderRadius : undefined; - var sides = this.sides = opt.sides || "top bottom left right front back" - var className = this.className = opt.className || null - - // an Object3D's associated DOM node is the "el" property - this.el.classList.add('box') - - var angle = MX.rotationUnit === 'deg' ? 90 : (Math.PI / 2) - - this.top = this.bottom = this.left = this.right = this.front = this.back = null - if (-1 != sides.indexOf("top")) { - var top = this.top = new MX.Object3D('.face.top') - top.rotationX = angle - top.width = width - top.height = depth - top.y = height * scale - top.scale = scale - this.add(top) - } - if (-1 != sides.indexOf("bottom")) { - var bottom = this.bottom = new MX.Object3D('.face.bottom') - bottom.rotationX = -angle - bottom.width = width - bottom.height = depth - bottom.y = 0 - bottom.scale = scale - this.add(bottom) - } - if (-1 != sides.indexOf("left")) { - var left = this.left = new MX.Object3D('.face.left') - left.rotationY = -angle - left.width = depth - left.height = height - left.x = -width/2 * scale - left.y = height/2 * scale - left.scale = scale - this.add(left) - } - if (-1 != sides.indexOf("right")) { - var right = this.right = new MX.Object3D('.face.right') - right.rotationY = angle - right.width = depth - right.height = height - right.x = width/2 * scale - right.y = height/2 * scale - right.scale = scale - this.add(right) - } - if (-1 != sides.indexOf("front")) { - var front = this.front = new MX.Object3D('.face.front') - front.width = width - front.height = height - front.z = -depth/2 * scale - front.y = height/2 * scale - front.scale = scale - this.add(front) - } - if (-1 != sides.indexOf("back")) { - var back = this.back = new MX.Object3D('.face.back') - back.width = width - back.height = height - back.rotationY = angle * 2 - back.z = depth/2 * scale - back.y = height/2 * scale - back.scale = scale - this.add(back) - } - - this.children.forEach(function (face) { - if (borderRadius) { - face.el.style.borderRadius = borderRadius + "px" - } - if (className) { - face.el.classList.add(className) - } - else { - if (backgroundImage) { - face.el.style.backgroundImage = "url(" + backgroundImage + ")" - } - else if (color) { - face.el.style.backgroundColor = color - } - if (borderWidth) { - face.el.style.border = borderWidth + 'px solid ' + borderColor - } - } - }) - - // bottom.el.style.border = "0" - - // this applies the updated CSS style - // required for any change to take effect - // when a parent object's update() is called - // all its children will be updated as well - this.update() - - // if this object's children won't move by themselves - this.updateChildren = true - - this.setWidth = function(w){ - base.width = top.width = bottom.width = front.width = back.width = w - left.x = -w/2 - right.x = w/2 - base.dirty = true - } - this.setHeight = function(h){ - base.height = left.height = right.height = front.height = back.height = h - bottom.y = 0 - left.y = right.y = front.y = back.y = h/2 - top.y = h - base.dirty = true - } - this.setDepth = function(d){ - base.depth = top.height = bottom.height = left.width = right.width = d - front.z = -d/2 - back.z = d/2 - base.dirty = true - } - - }, - - toString: function(){ - var params = "id width height depth x y z rotationX rotationY scale color borderColor borderWidth backgroundImage borderRadius sides".split(" ") - return this.__toString(params) - }, - - // other properties will be mixed into the prototype of the new constructor - -})
\ No newline at end of file diff --git a/assets/javascripts/mx/primitives/mx.coords.js b/assets/javascripts/mx/primitives/mx.coords.js deleted file mode 100644 index 80b148c..0000000 --- a/assets/javascripts/mx/primitives/mx.coords.js +++ /dev/null @@ -1,61 +0,0 @@ -MX.Coords = (function () { - - var colors = { - x: '#f33', - y: '#3f3', - z: '#66f' - } - - var Axis = MX.Object3D.extend({ - init: function (axis, size) { - - var label = document.createElement('span') - label.textContent = axis.toUpperCase() - label.style.position = 'absolute' - label.style.right = '0px' - label.style.bottom = '3px' - label.style.fontSize = Math.round(size / 10) + 'px' - this.el.appendChild(label) - - var faceA = new MX.Object3D(), - faceB = new MX.Object3D() - faceA.rotationX = 90 - this.add(faceA, faceB) - - this.el.style.color = - faceA.el.style.backgroundColor = - faceB.el.style.backgroundColor = colors[axis] - - this.width = - faceA.width = - faceB.width = size - - this.height = - faceA.height = - faceB.height = Math.round(size / 100) - - var angle = MX.rotationUnit === 'deg' ? 90 : (Math.PI / 2) - - if (axis === 'y') { - this.rotationZ = -angle - } else if (axis === 'z') { - this.rotationY = angle - } - } - }) - - var Coords = MX.Object3D.extend({ - init: function (size) { - size = size || 100 - var x = new Axis('x', size), - y = new Axis('y', size), - z = new Axis('z', size) - this.add(x, y, z) - this.update() - this.updateChildren = false - } - }) - - return Coords - -})()
\ No newline at end of file diff --git a/assets/javascripts/mx/primitives/mx.cutout.js b/assets/javascripts/mx/primitives/mx.cutout.js deleted file mode 100644 index 9d9043f..0000000 --- a/assets/javascripts/mx/primitives/mx.cutout.js +++ /dev/null @@ -1,66 +0,0 @@ -MX.Cutout = MX.Object3D.extend({ - init: function (ops) { - - this.type = "Cutout" - - var layer = this - layer.width = 0 - layer.height = 0 - - if (ops.src) this.loadTexture(ops) - - if (ops.texture) { - } - else if (ops.classname) { - layer.el.classList.add(ops.classname) - } - else { - } - layer.el.style.backgroundRepeat = 'no-repeat' - - this.dirty = true - this.updateChildren = true - this.update() - }, - - loadTexture: function(ops){ - var layer = this - var image = new Image() - var pattern = ops.pattern - var texture = ops.texture - - image.onload = function(){ - var canvas = document.createElement("canvas") - var ctx = canvas.getContext('2d') - - layer.width = canvas.width = image.naturalWidth - layer.height = canvas.height = image.naturalHeight - - ctx.drawImage(image, 0, 0, canvas.width, canvas.height) - ctx.globalCompositeOperation = "source-in" - - if (texture) { - ctx.fillStyle = ctx.createPattern(texture, 'repeat') - ctx.fillRect(0, 0, canvas.width, canvas.height) - } - if (pattern) { - ctx.fillStyle = ctx.createPattern(pattern, 'repeat') - ctx.fillRect(0, 0, canvas.width, canvas.height) - } - - layer.scale = ops.scale || 1 - layer.x = ops.x || 0 - layer.y = (ops.y || 0) + layer.height/2 + 1 - layer.z = ops.z || 0 - layer.rotationX = ops.rotationX || 0 - layer.rotationY = ops.rotationY || 0 - layer.el.appendChild(canvas) - - layer.el.classList.add('image') - ops.className && layer.el.classList.add(ops.className) - layer.dirty = true - layer.update() - } - image.src = ops.src; - } -}) diff --git a/assets/javascripts/mx/primitives/mx.face.js b/assets/javascripts/mx/primitives/mx.face.js deleted file mode 100644 index ac47ab4..0000000 --- a/assets/javascripts/mx/primitives/mx.face.js +++ /dev/null @@ -1,41 +0,0 @@ -MX.Face = MX.Object3D.extend({ - - // this will be called within the contructor - init: function (size, color, borderColor) { - - size = size || 100 - color = color || 'rgba(0, 255, 122, .1)' - borderColor = borderColor || '#0f3' - - // an Object3D's associated DOM node is the "el" property - this.el.classList.add('face') - - var angle = MX.rotationUnit === 'deg' ? 90 : (Math.PI / 2) - - var top = this.top = new MX.Object3D('.face') - top.rotationX = angle - top.y = size / 2 - - // adding children, must also be instances of Object3D - this.add(top) - - this.children.forEach(function (face) { - face.width = size - 2 - face.height = size - 2 - face.el.style.backgroundColor = color - face.el.style.border = '1px solid ' + borderColor - }) - - // this applies the updated CSS style - // required for any change to take effect - // when a parent object's update() is called - // all its children will be updated as well - this.update() - - // if this object's children won't move by themselves - this.updateChildren = false - } - - // other properties will be mixed into the prototype of the new constructor - -}) diff --git a/assets/javascripts/mx/primitives/mx.image.js b/assets/javascripts/mx/primitives/mx.image.js deleted file mode 100644 index d1e292d..0000000 --- a/assets/javascripts/mx/primitives/mx.image.js +++ /dev/null @@ -1,69 +0,0 @@ -MX.Image = MX.Object3D.extend({ - init: function (ops) { - - this.type = "Image" - - var layer = this - layer.width = 0 - layer.height = 0 - layer.x = ops.x || 0 - layer.y = ops.y || 0 - layer.z = ops.z || 0 - layer.backface = ops.backface || false - - if (layer.backface) { - layer.el.classList.add("backface-visible") - } - - if (ops.src) { - this.loadTexture(ops) - } - - if (ops.className) { - layer.el.classList.add(ops.className) - } - layer.el.style.backgroundRepeat = 'no-repeat' - - this.dirty = true - this.updateChildren = true - this.update() - }, - - loadTexture: function(ops){ - var layer = this - layer.ops = defaults(ops, layer.ops) - var image = new Image() - image.onload = function(){ - layer.scale = layer.ops.scale || 1 - layer.width = image.naturalWidth - layer.height = image.naturalHeight - layer.x = layer.ops.x || 0 - layer.y = (layer.ops.y || 0) + layer.scale * layer.height/2 + 1 - layer.z = layer.ops.z || 0 - layer.rotationX = layer.ops.rotationX || 0 - layer.rotationY = layer.ops.rotationY || 0 - layer.rotationZ = layer.ops.rotationZ || 0 - layer.el.style.backgroundImage = "url(" + image.src + ")" - layer.el.classList.add('image') - layer.dirty = true - layer.update() - } - image.src = ops.src; - }, - - move: function(ops){ - var layer = this - layer.ops = defaults(ops, layer.ops) - for (var i in ops) { - layer[i] = ops[i] - } - layer.dirty = true - layer.update() - }, - - toString: function(){ - var params = "id src width height depth x y z rotationX rotationY rotationZ scale".split(" ") - return this.__toString(params) - }, - -}) diff --git a/assets/javascripts/mx/primitives/mx.scaleBox.js b/assets/javascripts/mx/primitives/mx.scaleBox.js deleted file mode 100644 index 77f45e9..0000000 --- a/assets/javascripts/mx/primitives/mx.scaleBox.js +++ /dev/null @@ -1,140 +0,0 @@ -MX.ScaleBox = MX.Object3D.extend({ - - // this will be called within the contructor - init: function (opt) { - - var base = this - - this.type = "ScaleBox" - - var id = this.id = opt.id || guid() - this.x = opt.x || 0 - this.y = opt.y || 0 - this.z = opt.z || 0 - this.rotationX = opt.rotationX || 0 - this.rotationY = opt.rotationY || 0 - this.rotationZ = opt.rotationZ || 0 - var scale = this.scale = opt.scale || 1 - var width = this.width = scale * (opt.width || 100) - var height = this.height = scale * (opt.height || 100) - var depth = this.depth = scale * (opt.depth || 100) - var color = this.color = opt.color || 'rgba(0, 255, 122, .1)' - var sides = this.sides = opt.sides || "top bottom left right front back" - - // an Object3D's associated DOM node is the "el" property - this.el.classList.add('box') - - var angle = MX.rotationUnit === 'deg' ? 90 : (Math.PI / 2) - - var top = this.top = new MX.Object3D('.face.top') - top.rotationX = angle - top.width = 1 - top.height = 1 - top.scaleX = width - top.scaleY = 1 - top.scaleZ = depth - top.y = height - - var bottom = this.bottom = new MX.Object3D('.face.bottom') - bottom.rotationX = -angle - bottom.width = 1 - bottom.height = 1 - bottom.scaleX = width - bottom.scaleY = 1 - bottom.scaleZ = depth - bottom.y = 0 - - var left = this.left = new MX.Object3D('.face.left') - left.rotationY = -angle - left.width = 1 - left.height = 1 - left.scaleX = 1 - left.scaleY = height - left.scaleZ = depth - left.x = -width/2 - left.y = height/2 - - var right = this.right = new MX.Object3D('.face.right') - right.rotationY = angle - right.width = 1 - right.height = 1 - right.scaleX = 1 - right.scaleY = height - right.scaleZ = depth - right.x = width/2 - right.y = height/2 - - var front = this.front = new MX.Object3D('.face.front') - front.width = 1 - front.height = 1 - front.scaleX = width - front.scaleY = height - front.scaleZ = 1 - front.z = -depth/2 - front.y = height/2 - - var back = this.back = new MX.Object3D('.face.back') - back.width = 1 - back.height = 1 - back.scaleX = width - back.scaleY = height - back.scaleZ = 1 - back.rotationY = angle * 2 - back.z = depth/2 - back.y = height/2 - - // adding children, must also be instances of Object3D - if (-1 != sides.indexOf("top")) this.add(top) - if (-1 != sides.indexOf("bottom")) this.add(bottom) - if (-1 != sides.indexOf("left")) this.add(left) - if (-1 != sides.indexOf("right")) this.add(right) - if (-1 != sides.indexOf("front")) this.add(front) - if (-1 != sides.indexOf("back")) this.add(back) - - this.children.forEach(function (face) { - face.el.style.backgroundColor = color - }) - - // this applies the updated CSS style - // required for any change to take effect - // when a parent object's update() is called - // all its children will be updated as well - this.update() - - // if this object's children won't move by themselves - this.updateChildren = true - - this.setWidth = function(w){ - base.width = top.width = bottom.width = front.width = back.width = w - left.x = -w/2 - right.x = w/2 - base.dirty = true - } - this.setHeight = function(h){ - base.height = left.height = right.height = front.height = back.height = h - bottom.y = 0 - left.y = right.y = front.y = back.y = h/2 - top.y = h - base.dirty = true - } - this.setDepth = function(d){ - base.depth = top.height = bottom.height = left.width = right.width = d - front.z = -d/2 - back.z = d/2 - base.dirty = true - } - - }, - - toString: function(){ - var params = "id width height depth x y z rotationX rotationY color sides".split(" ") - return this.__toString(params) - }, - - clone: function(){ - return new MX[this.type] (this) - } - - // other properties will be mixed into the prototype of the new constructor - -}) diff --git a/assets/javascripts/mx/primitives/mx.tableau.js b/assets/javascripts/mx/primitives/mx.tableau.js deleted file mode 100644 index 514e206..0000000 --- a/assets/javascripts/mx/primitives/mx.tableau.js +++ /dev/null @@ -1,48 +0,0 @@ - - -var Tableau = function(){ - this.extend = extend.bind(Tableau) - - function extend (props) { - var Super = this - var ExtendedTableau = function () { - Super.call(this) - props.init && props.init.apply(this, arguments) - } - ExtendedTableau.prototype = Object.create(Tableau.prototype) - for (var prop in props) { - if (props.hasOwnProperty(prop) && prop !== 'init') { - ExtendedTableau.prototype[prop] = props[prop] - } - } - ExtendedTableau.extend = extend.bind(ExtendedTableau) - return ExtendedTableau - } -} - -Tableau.prototype.init = function(opt){} -Tableau.prototype.animate = function(t){} -Tableau.prototype.show = function(){} -Tableau.prototype.hide = function(){} - -MX.Tableau = new Tableau() -MX.Tableaux = {} - -/* - -MX.Tableaux.Foo = MX.Tableau.extend({ - // this will be called within the contructor - init: function (opt) { - }, - - show: function(){ - }, - - hide: function(){ - }, - - animate: function() { - } -}) - -*/ diff --git a/assets/javascripts/mx/primitives/mx.text.js b/assets/javascripts/mx/primitives/mx.text.js deleted file mode 100644 index 0c278a9..0000000 --- a/assets/javascripts/mx/primitives/mx.text.js +++ /dev/null @@ -1,34 +0,0 @@ -MX.Text = MX.Object3D.extend({ - init: function (ops) { - - this.type = "Text" - - var layer = new MX.Object3D('text') - layer.width = ops.width || 100 - layer.height = ops.height || 50 - layer.x = ops.x || 0 - layer.y = ops.y || 0 - layer.z = ops.z || 0 - layer.scale = ops.scale || 1 - layer.el.innerHTML = ops.value || "" - if (ops.id) layer.el.id = ops.id; - if (ops.background) layer.el.style.background = ops.background; - if (ops.color) layer.el.style.color = ops.color; - if (ops.fontSize) layer.el.style.fontSize = ops.fontSize + "px"; - - this.add(layer) - - this.children.forEach(function (c, i) { - if (ops.classname) { - c.el.classList.add(ops.classname) - } - else { - } - c.el.style.backgroundRepeat = 'no-repeat' - }) - - this.dirty = true - this.updateChildren = true - this.update() - } -}) diff --git a/assets/javascripts/mx/primitives/mx.texturedBox.js b/assets/javascripts/mx/primitives/mx.texturedBox.js deleted file mode 100644 index daec2d8..0000000 --- a/assets/javascripts/mx/primitives/mx.texturedBox.js +++ /dev/null @@ -1,121 +0,0 @@ -// Creates a box using a given texture image. -// Uses a texture image like this: -// -// ---------- ---------- -// | | | -// | top | bottom | -// | | | -// ---------- ---------- ---------- ---------- -// | | | | | -// | left | front | right | back | -// | | | | | -// ---------- ---------- ---------- ---------- -// -// See `examples/images/skins/` for some minecraft skin examples. - -// Options: -// -// - {number} `width` -// - {number} `height` -// - {number} `depth` -// - {string} `texture` path to texture image -// - {string} `classname` class to be added to dom element - -MX.TexturedBox = MX.Object3D.extend({ - - init: function (ops) { - - this.type = "TexturedBox" - - if (!ops.width || !ops.height || !ops.depth || (!ops.texture && !ops.classname)) { - console.warn('TextureBox: missing arguments') - return - } - - // faces - var angle = MX.rotationUnit === 'deg' ? 90 : (Math.PI / 2), - offsetX = ops.offset ? (ops.offset.x || 0) : 0, - offsetY = ops.offset ? (ops.offset.y || 0) : 0, - overlap = ops.overlap ? ops.overlap : 0 - var multiTexture = typeof ops.texture == "object"; - - var top = this.top = new MX.Object3D() - top.width = ops.width - top.height = ops.depth - top.rotationX = angle - top.y = ops.height / 2 - overlap - if (!multiTexture) - top.el.style.backgroundPosition = - (-(offsetX + ops.depth) + 'px ') + - (-offsetY + 'px') - - var bottom = this.bottom = new MX.Object3D() - bottom.width = ops.width - bottom.height = ops.depth - bottom.rotationX = -angle - bottom.y = -ops.height / 2 + overlap - if (!multiTexture) - bottom.el.style.backgroundPosition = - (-(offsetX + ops.depth + ops.width) + 'px ') + - (-offsetY + 'px') - - var left = this.left = new MX.Object3D() - left.width = ops.depth - left.height = ops.height - left.rotationY = -angle - left.x = -ops.width / 2 + overlap - if (!multiTexture) - left.el.style.backgroundPosition = - (-offsetX + 'px ') + - (-(offsetY + ops.depth) + 'px') - - var right = this.right = new MX.Object3D() - right.width = ops.depth - right.height = ops.height - right.rotationY = angle - right.x = ops.width / 2 - overlap - if (!multiTexture) - right.el.style.backgroundPosition = - (-(offsetX + ops.depth + ops.width) + 'px ') + - (-(offsetY + ops.depth) + 'px') - - var front = this.front = new MX.Object3D() - front.width = ops.width - front.height = ops.height - front.z = -ops.depth / 2 + overlap - if (!multiTexture) - front.el.style.backgroundPosition = - (-(offsetX + ops.depth) + 'px ') + - (-(offsetY + ops.depth) + 'px') - - var back = this.back = new MX.Object3D() - back.width = ops.width - back.height = ops.height - back.rotationY = angle * 2 - back.z = ops.depth / 2 - overlap - if (!multiTexture) - back.el.style.backgroundPosition = - (-(offsetX + ops.depth * 2 + ops.width) + 'px ') + - (-(offsetY + ops.depth) + 'px') - - this.add(top, bottom, left, right, front, back) - - this.children.forEach(function (c,i) { - if (multiTexture) { - c.el.style.backgroundImage = 'url(' + ops.texture[i] + ')' - } - else if (ops.texture) { - c.el.style.backgroundImage = 'url(' + ops.texture + ')' - } - if (ops.classname) { - c.el.classList.add(ops.classname) - } - c.el.style.backgroundRepeat = 'no-repeat' - }) - - this.update() - this.updateChildren = false - - } - -}) |