"use strict"; var ruler = function (e) { this.api = this.builder(), this.api.constructRulers.call(this, e) }; ruler.prototype.builder = function () { function o(e, t) { switch (e.canvas.style.left = ruler.prototype.utils.pixelize(-(e.canvas.width / 2 - e.canvas.height)), t) { case "top": e.orgPos = parseInt(e.canvas.style.left); break; case "left": e.canvas.style.top = ruler.prototype.utils.pixelize(-e.canvas.height - 1), e.orgPos = parseInt(e.canvas.style.top), n = e, i = "rotate(" + (r = 90) + "deg)", r = ruler.prototype.utils.pixelize(Math.abs(parseInt(n.canvas.style.left))) + " 100%", n.canvas.style.webkitTransform = i, n.canvas.style.MozTransform = i, n.canvas.style.OTransform = i, n.canvas.style.msTransform = i, n.canvas.style.transform = i, n.canvas.style.webkitTransformOrigin = r, n.canvas.style.MozTransformOrigin = r, n.canvas.style.OTransformOrigin = r, n.canvas.style.msTransformOrigin = r, n.canvas.style.transformOrigin = r }var n, r, i } function s(e, t) { function n(e) { r(t.dimension, e.clientX, e.clientY, e) } t.canvas.addEventListener("mousedown", n), t.clearListeners = function () { t.canvas.removeEventListener("mousedown", n) } } var u, c = 0, p = 0, d = 1, l = {}, f = [], y = document.createElement("div"), a = [], t = { rulerHeight: 15, fontFamily: "arial", fontSize: "8px", strokeStyle: "gray", sides: ["top", "left"], cornerSides: ["TL"], lineWidth: 1, enableMouseTracking: !0, enableToolTip: !0 }, r = function (e, t, n, r, i) { var o, s = document.createElement("div"), l = 1 === e ? "rul_lineVer" : "rul_lineHor", a = 1 === e ? c : p; s.title = "Double click to delete", ruler.prototype.utils.addClasss(s, ["rul_line", l]), s = y.appendChild(s), 1 === e ? (s.style.left = ruler.prototype.utils.pixelize(t - u.container.getBoundingClientRect().left), i && (s.style.left = ruler.prototype.utils.pixelize(Math.round(t / d) + u.rulerHeight))) : (s.style.top = ruler.prototype.utils.pixelize(n - u.container.getBoundingClientRect().top), i && (s.style.top = ruler.prototype.utils.pixelize(Math.round(n / d) + u.rulerHeight))), f.push({ dimension: e, line: ruler.prototype.guideLine(s, u.container.querySelector(".rul_wrapper"), e, u, a, function (n, e, t) { t = 1 === n.dimension ? e : t; n.assigned() ? t < u.rulerHeight && (f.some(function (e, t) { if (e.line === n) return o = t, !0 }), n.destroy(), f.splice(o, 1)) : t > u.rulerHeight && n.assigned(!0) }, r) }) }, n = function (i, e) { e.forEach(function (e) { var t, n, r = (t = i, n = e, e = document.createElement("div"), n = "rul_corner" + n.toUpperCase(), e.title = "Clear Guide lines", ruler.prototype.utils.addClasss(e, ["rul_corner", n]), e.style.width = ruler.prototype.utils.pixelize(u.rulerHeight + 1), e.style.height = ruler.prototype.utils.pixelize(u.rulerHeight), t.appendChild(e)); r.addEventListener("mousedown", v), r.destroy = function () { r.removeEventListener("mousedown", v), r.parentNode.removeChild(r) }, a.push(r) }) }; function v(e) { e.stopPropagation(), g() } function i(e) { f.forEach(function (e) { e.line.stopDrag() }) } function e(e) { var t, n = 0; for (t in l) l.hasOwnProperty(t) && e(l[t], n++) } var g = function () { f.forEach(function (e) { e.line.destroy() }), f = [] }; return { VERTICAL: 1, HORIZONTAL: 2, setPos: function (t) { var n, r, i = 0, o = 0; e(function (e) { 1 === e.dimension ? (r = e.canvas.style.top, e.canvas.style.top = ruler.prototype.utils.pixelize(e.orgPos + parseInt(t.y)), o = parseInt(r) - parseInt(e.canvas.style.top)) : (n = e.canvas.style.left, e.canvas.style.left = ruler.prototype.utils.pixelize(e.orgPos + parseInt(t.x)), i = parseInt(n) - parseInt(e.canvas.style.left)) }), f.forEach(function (e) { 2 === e.dimension ? (e.line.guideLine.style.top = ruler.prototype.utils.pixelize(parseInt(e.line.guideLine.style.top) - o), e.line.curPosDelta(parseInt(t.y))) : (e.line.guideLine.style.left = ruler.prototype.utils.pixelize(parseInt(e.line.guideLine.style.left) - i), e.line.curPosDelta(parseInt(t.x))) }), c = parseInt(t.x), p = parseInt(t.y) }, setScale: function (t) { var n, r, i; e(function (e) { e.context.clearRect(0, 0, e.canvas.width, e.canvas.height), e.context.beginPath(), e.setScale(t), e.context.stroke(), d = t }), f.forEach(function (e) { 2 === e.dimension ? (n = parseInt(e.line.guideLine.style.top), r = u.rulerHeight + 1, i = parseFloat(t) / e.line.curScale(), e.line.guideLine.style.top = ruler.prototype.utils.pixelize((n - r - p) / i + r + p)) : (n = parseInt(e.line.guideLine.style.left), r = u.rulerHeight + 1, i = parseFloat(t) / e.line.curScale(), e.line.guideLine.style.left = ruler.prototype.utils.pixelize((n - r - c) / i + r + c)), e.line.curScale(t) }) }, clearGuides: g, getGuides: function () { return f.map(function (e) { return { posX: Math.round((parseInt(e.line.guideLine.style.left) - c - u.rulerHeight) * d), posY: Math.round((parseInt(e.line.guideLine.style.top) - p - u.rulerHeight) * d), dimension: e.dimension } }) }, setGuides: function (e) { e && e.forEach(function (e) { r(e.dimension, e.posX, e.posY, null, !0) }) }, constructRulers: function (e) { y = ruler.prototype.utils.addClasss(y, "rul_wrapper"), u = ruler.prototype.utils.extend(t, e), y = u.container.appendChild(y), u.sides.forEach(function (e) { var t, n, r, i; t = y, i = 1 == (r = "left" === (n = e) || "right" === n ? 1 : 2) ? "rul_ruler_Vertical" : "rul_ruler_Horizontal", e = document.createElement("canvas"), ruler.prototype.utils.addClasss(e, ["rul_ruler", i, "rul_align_" + n]), e = t.appendChild(e), l[n] = ruler.prototype.rulerConstructor(e, u, r), l[n].drawRuler(t.offsetWidth, u.rulerHeight), o(l[n], n), s(0, l[n]) }), n(y, u.cornerSides), u.container.addEventListener("mouseup", i) }, toggleRulerVisibility: function (e) { var t = e ? "block" : "none"; y.style.display = t; e = u.container.querySelectorAll(".rul_tracker"); 0 < e.length && (e[0].style.display = t, e[1].style.display = t) }, toggleGuideVisibility: function (e) { var t = e ? "show" : "hide"; f.forEach(function (e) { e.line[t]() }) }, destroy: function () { g(), e(function (e) { e.destroy() }), a.forEach(function (e) { e.destroy() }), u.container.removeEventListener("mouseup", i), y.parentNode.removeChild(y) } } }, ruler.prototype.rulerConstructor = function (e, r, t) { function n(e) { var t = e.clientX, e = e.clientY; 2 === o ? s.style.left = ruler.prototype.utils.pixelize(t - parseInt(r.container.getBoundingClientRect().left)) : s.style.top = ruler.prototype.utils.pixelize(e - parseInt(r.container.getBoundingClientRect().top)) } var i = e, l = i.getContext("2d"), a = 0, u = 0, c = 1, o = t || 2, s = document.createElement("div"), p = function () { for (var e, t = 0, n = "", r = !1, i = a / 2, o = a / 2, s = 0; s <= u; s += 1)r = !1, n = "", (e = u / 2 - s) % 50 == 0 ? (t = 0, n = 10 < Math.abs(e) * c || Math.abs(e) * c == 0 ? Math.round(Math.abs(e) * c) : parseFloat(Math.abs(e) * c).toFixed(1), r = !0) : e % 25 == 0 ? (t = i, r = !0) : e % 5 == 0 && (t = o, r = !0), r && (l.moveTo(s + .5, a + .5), l.lineTo(s + .5, t + .5), l.fillText(n, s + 1.5, a / 2 + 1)) }; return r.enableMouseTracking && function () { s = r.container.appendChild(s), ruler.prototype.utils.addClasss(s, "rul_tracker"); var e = ruler.prototype.utils.pixelize(r.rulerHeight); 2 === o ? s.style.height = e : s.style.width = e, r.container.addEventListener("mousemove", n) }(), { getLength: function () { return u }, getThickness: function () { return a }, getScale: function () { return c }, setScale: function (e) { return c = parseFloat(e), p(), c }, dimension: o, orgPos: 0, canvas: i, context: l, drawRuler: function (e, t, n) { u = i.width = 4 * e, a = i.height = t, c = n || c, l.strokeStyle = r.strokeStyle, l.font = r.fontSize + " " + r.fontFamily, l.lineWidth = r.lineWidth, l.beginPath(), p(), l.stroke() }, drawPoints: p, destroy: function () { r.container.removeEventListener("mousemove", n), s.parentNode.removeChild(s), this.clearListeners && this.clearListeners() } } }, ruler.prototype.guideLine = function (e, t, n, p, r, i, o) { function s() { v.stopMoving(), i = null, d.removeEventListener("mousedown", x), d.removeEventListener("mouseup", L), d.removeEventListener("dblclick", C), d.parentNode && d.parentNode.removeChild(d) } var l, d = e, a = 1, u = !1, c = r || 0, f = t, y = n || 2, i = i || function () { }, v = { move: function (e, t) { d.style.left = ruler.prototype.utils.pixelize(e), d.style.top = ruler.prototype.utils.pixelize(t), h(e, t), i(l, e, t) }, startMoving: function (e) { ruler.prototype.utils.addClasss(d, ["rul_line_dragged"]); var t = (e = e || window.event) ? e.clientX : 0, n = e ? e.clientY : 0, r = parseInt(d.style.top || 0), i = parseInt(d.style.left || 0), o = parseInt(d.offsetWidth), s = parseInt(d.offsetHeight), l = parseInt(f.offsetWidth), a = parseInt(f.offsetHeight), e = 2 === y ? "ns-resize" : "ew-resize"; p.container.style.cursor = e, d.style.cursor = e; var u = t - i, c = n - r; document.onmousemove = function (e) { var t = (e = e || window.event).clientX, e = e.clientY, t = t - u, e = e - c; t < 0 && (t = 0), e < 0 && (e = 0), l < t + o && (t = l - o), a < e + s && (e = a - s), v.move(t, e) }, g() }, stopMoving: function () { p.container.style.cursor = null, d.style.cursor = null, document.onmousemove = function () { }, m(), ruler.prototype.utils.removeClasss(d, ["rul_line_dragged"]) } }, g = function (e) { p.enableToolTip && ruler.prototype.utils.addClasss(d, "rul_tooltip") }, h = function (e, t) { d.dataset.tip = t ? "Y: " + Math.round((t - p.rulerHeight - 1 - c) * a) + " px" : "X: " + Math.round((e - p.rulerHeight - 1 - c) * a) + " px" }, m = function (e) { ruler.prototype.utils.removeClasss(d, "rul_tooltip") }, x = function (e) { e.stopPropagation(), v.startMoving() }, L = function (e) { v.stopMoving() }, C = function (e) { e.stopPropagation(), s() }; return d.addEventListener("mousedown", x), d.addEventListener("mouseup", L), d.addEventListener("dblclick", C), o && v.startMoving(o), l = { setAsDraggable: v, startDrag: v.startMoving, stopDrag: v.stopMoving, destroy: s, curScale: function (e) { return void 0 === e ? a : a = e }, assigned: function (e) { return void 0 === e ? u : u = e }, curPosDelta: function (e) { return void 0 === e ? c : c = e }, guideLine: d, dimension: y, hide: function () { d.style.display = "none" }, show: function () { d.style.display = "block" } } }, ruler.prototype.utils = { extend: function () { for (var e = 1; e < arguments.length; e++)for (var t in arguments[e]) arguments[e].hasOwnProperty(t) && (arguments[0][t] = arguments[e][t]); return arguments[0] }, pixelize: function (e) { return e + "px" }, prependChild: function (e, t) { return e.insertBefore(t, e.firstChild) }, addClasss: function (t, e) { return e instanceof Array || (e = [e]), e.forEach(function (e) { t.className += " " + e }), t }, removeClasss: function (e, t) { var n = e.className; return t instanceof Array || (t = [t]), t.forEach(function (e) { n = n.replace(e, "") }), e.className = n, e } };