summaryrefslogtreecommitdiff
path: root/public/assets/javascripts/mx/primitives/mx.texturedBox.js
diff options
context:
space:
mode:
authorJules Laplace <jules@okfoc.us>2014-06-03 17:51:34 -0400
committerJules Laplace <jules@okfoc.us>2014-06-03 17:51:34 -0400
commit90142bd07f926ef8a7f3ea86a563ec0ca648ca5d (patch)
tree2851e990b4b71e215ad2fff4dbcaf80229953c35 /public/assets/javascripts/mx/primitives/mx.texturedBox.js
parent607f69c67a5b4dc72d2754192e3cdf67d0ad11d0 (diff)
pulling in more stuff from posthang
Diffstat (limited to 'public/assets/javascripts/mx/primitives/mx.texturedBox.js')
-rw-r--r--public/assets/javascripts/mx/primitives/mx.texturedBox.js121
1 files changed, 121 insertions, 0 deletions
diff --git a/public/assets/javascripts/mx/primitives/mx.texturedBox.js b/public/assets/javascripts/mx/primitives/mx.texturedBox.js
new file mode 100644
index 0000000..daec2d8
--- /dev/null
+++ b/public/assets/javascripts/mx/primitives/mx.texturedBox.js
@@ -0,0 +1,121 @@
+// 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
+
+ }
+
+})