diff --git a/src/attradd.js b/src/attradd.js index f28fc50..ca3c25b 100644 --- a/src/attradd.js +++ b/src/attradd.js @@ -54,11 +54,9 @@ eve.on('snap.util.attr', function (val) { })(-10) eve.on('snap.util.equal', function (name, b) { - let A, - B, - a = String(this.attr(name) || ''), - el = this, - bplus = String(b).match(reAddon) + let a = String(this.attr(name) || '') + let bplus = String(b).match(reAddon) + if (bplus) { eve.stop() let unit = bplus[3] || '', diff --git a/src/mina.js b/src/mina.js index 029e51c..66221e4 100644 --- a/src/mina.js +++ b/src/mina.js @@ -1,18 +1,10 @@ -// Copyright (c) 2017 Adobe Systems Incorporated. All rights reserved. -// -// Licensed under the Apache License, Version 2.0 (the "License"); -// you may not use this file except in compliance with the License. -// You may obtain a copy of the License at -// -// http://www.apache.org/licenses/LICENSE-2.0 -// -// Unless required by applicable law or agreed to in writing, software -// distributed under the License is distributed on an "AS IS" BASIS, -// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -// See the License for the specific language governing permissions and -// limitations under the License. +/** + * {} + * @author yutent + * @date 2024/03/08 10:20:25 + */ + import eve from './eve.js' -import { Snap } from './svg.js' import { uuid } from './utils.js' let animations = {}, @@ -127,74 +119,71 @@ let animations = {}, a.update() } requestID = len ? requestAnimFrame(frame) : false - }, - /*\ - * mina - [ method ] - ** - * Generic animation of numbers - ** - - a (number) start _slave_ number - - A (number) end _slave_ number - - b (number) start _master_ number (start time in general case) - - B (number) end _master_ number (end time in general case) - - get (function) getter of _master_ number (see @mina.time) - - set (function) setter of _slave_ number - - easing (function) #optional easing function, default is @mina.linear - = (object) animation descriptor - o { - o id (string) animation id, - o start (number) start _slave_ number, - o end (number) end _slave_ number, - o b (number) start _master_ number, - o s (number) animation status (0..1), - o dur (number) animation duration, - o spd (number) animation speed, - o get (function) getter of _master_ number (see @mina.time), - o set (function) setter of _slave_ number, - o easing (function) easing function, default is @mina.linear, - o status (function) status getter/setter, - o speed (function) speed getter/setter, - o duration (function) duration getter/setter, - o stop (function) animation stopper - o pause (function) pauses the animation - o resume (function) resumes the animation - o update (function) calles setter with the right value of the animation - o } - \*/ - mina = function (a, A, b, B, get, set, easing) { - let anim = { - id: uuid('M'), - start: a, - end: A, - b: b, - s: 0, - dur: B - b, - spd: 1, - get: get, - set: set, - easing: easing || mina.linear, - status: sta, - speed: speed, - duration: duration, - stop: stopit, - pause: pause, - resume: resume, - update: update - } - animations[anim.id] = anim - let len = 0, - i - for (i in animations) - if (animations.hasOwnProperty(i)) { - len++ - if (len == 2) { - break - } - } - len == 1 && frame() - return anim } +/*** + * Generic animation of numbers + ** + * a (number) start _slave_ number + * A (number) end _slave_ number + * b (number) start _master_ number (start time in general case) + * B (number) end _master_ number (end time in general case) + * get (function) getter of _master_ number (see @mina.time) + * set (function) setter of _slave_ number + * easing (function) #optional easing function, default is @mina.linear + = (object) animation descriptor + { + id (string) animation id, + start (number) start _slave_ number, + end (number) end _slave_ number, + b (number) start _master_ number, + s (number) animation status (0..1), + dur (number) animation duration, + spd (number) animation speed, + get (function) getter of _master_ number (see @mina.time), + set (function) setter of _slave_ number, + easing (function) easing function, default is @mina.linear, + status (function) status getter/setter, + speed (function) speed getter/setter, + duration (function) duration getter/setter, + stop (function) animation stopper + pause (function) pauses the animation + resume (function) resumes the animation + update (function) calles setter with the right value of the animation + } + */ +export const mina = function (a, A, b, B, get, set, easing) { + let anim = { + id: uuid('M'), + start: a, + end: A, + b: b, + s: 0, + dur: B - b, + spd: 1, + get: get, + set: set, + easing: easing || mina.linear, + status: sta, + speed: speed, + duration: duration, + stop: stopit, + pause: pause, + resume: resume, + update: update + } + animations[anim.id] = anim + let len = 0, + i + for (i in animations) + if (animations.hasOwnProperty(i)) { + len++ + if (len == 2) { + break + } + } + len == 1 && frame() + return anim +} /*\ * mina.time [ method ] diff --git a/src/mouse.js b/src/mouse.js index 49e253d..28b7f68 100644 --- a/src/mouse.js +++ b/src/mouse.js @@ -12,7 +12,7 @@ // See the License for the specific language governing permissions and // limitations under the License. import eve from './eve.js' -import { Snap, SnapElement, Paper } from './svg.js' +import { Snap, SnapElement } from './svg.js' import { is } from './utils.js' import { doc, win } from './lib/constants.js' @@ -169,287 +169,62 @@ let elproto = SnapElement.prototype, } drag = [] } -/*\ - * SnapElement.click - [ method ] - ** - * Adds a click event handler to the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ -/*\ - * SnapElement.unclick - [ method ] - ** - * Removes a click event handler from the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ -/*\ - * SnapElement.dblclick - [ method ] - ** - * Adds a double click event handler to the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ -/*\ - * SnapElement.undblclick - [ method ] - ** - * Removes a double click event handler from the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ - -/*\ - * SnapElement.mousedown - [ method ] - ** - * Adds a mousedown event handler to the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ -/*\ - * SnapElement.unmousedown - [ method ] - ** - * Removes a mousedown event handler from the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ - -/*\ - * SnapElement.mousemove - [ method ] - ** - * Adds a mousemove event handler to the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ -/*\ - * SnapElement.unmousemove - [ method ] - ** - * Removes a mousemove event handler from the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ - -/*\ - * SnapElement.mouseout - [ method ] - ** - * Adds a mouseout event handler to the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ -/*\ - * SnapElement.unmouseout - [ method ] - ** - * Removes a mouseout event handler from the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ - -/*\ - * SnapElement.mouseover - [ method ] - ** - * Adds a mouseover event handler to the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ -/*\ - * SnapElement.unmouseover - [ method ] - ** - * Removes a mouseover event handler from the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ - -/*\ - * SnapElement.mouseup - [ method ] - ** - * Adds a mouseup event handler to the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ -/*\ - * SnapElement.unmouseup - [ method ] - ** - * Removes a mouseup event handler from the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ - -/*\ - * SnapElement.touchstart - [ method ] - ** - * Adds a touchstart event handler to the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ -/*\ - * SnapElement.untouchstart - [ method ] - ** - * Removes a touchstart event handler from the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ - -/*\ - * SnapElement.touchmove - [ method ] - ** - * Adds a touchmove event handler to the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ -/*\ - * SnapElement.untouchmove - [ method ] - ** - * Removes a touchmove event handler from the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ - -/*\ - * SnapElement.touchend - [ method ] - ** - * Adds a touchend event handler to the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ -/*\ - * SnapElement.untouchend - [ method ] - ** - * Removes a touchend event handler from the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ - -/*\ - * SnapElement.touchcancel - [ method ] - ** - * Adds a touchcancel event handler to the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ -/*\ - * SnapElement.untouchcancel - [ method ] - ** - * Removes a touchcancel event handler from the element - - handler (function) handler for the event - = (object) @SnapElement - \*/ for (let i = events.length; i--; ) { - ;(function (eventName) { - Snap[eventName] = elproto[eventName] = function (fn, scope) { - if (is(fn, 'function')) { - this.events = this.events || [] - this.events.push({ - name: eventName, - f: fn, - unbind: addEvent(this.node || document, eventName, fn, scope || this) - }) - } else { - for (let i = 0, ii = this.events.length; i < ii; i++) - if (this.events[i].name == eventName) { - try { - this.events[i].f.call(this) - } catch (e) {} - } - } - return this - } - Snap['un' + eventName] = elproto['un' + eventName] = function (fn) { - let events = this.events || [], - l = events.length - while (l--) - if (events[l].name == eventName && (events[l].f == fn || !fn)) { - events[l].unbind() - events.splice(l, 1) - !events.length && delete this.events - return this + let eventName = events[i] + + Snap[eventName] = elproto[eventName] = function (fn, scope) { + if (is(fn, 'function')) { + this.events = this.events || [] + this.events.push({ + name: eventName, + f: fn, + unbind: addEvent(this.node || document, eventName, fn, scope || this) + }) + } else { + for (let i = 0, ii = this.events.length; i < ii; i++) + if (this.events[i].name == eventName) { + try { + this.events[i].f.call(this) + } catch (e) {} } - return this } - })(events[i]) + return this + } + + Snap['un' + eventName] = elproto['un' + eventName] = function (fn) { + let events = this.events || [], + l = events.length + while (l--) + if (events[l].name == eventName && (events[l].f == fn || !fn)) { + events[l].unbind() + events.splice(l, 1) + !events.length && delete this.events + return this + } + return this + } } -/*\ - * SnapElement.hover - [ method ] - ** - * Adds hover event handlers to the element - - f_in (function) handler for hover in - - f_out (function) handler for hover out - - icontext (object) #optional context for hover in handler - - ocontext (object) #optional context for hover out handler - = (object) @SnapElement - \*/ +/*** + * Adds hover event handlers to the element + * f_in (function) handler for hover in + * f_out (function) handler for hover out + * icontext (object) #optional context for hover in handler + * ocontext (object) #optional context for hover out handler + */ elproto.hover = function (f_in, f_out, scope_in, scope_out) { return this.mouseover(f_in, scope_in).mouseout(f_out, scope_out || scope_in) } -/*\ - * SnapElement.unhover - [ method ] - ** - * Removes hover event handlers from the element - - f_in (function) handler for hover in - - f_out (function) handler for hover out - = (object) @SnapElement - \*/ +/** + * Removes hover event handlers from the element + * f_in (function) handler for hover in + * f_out (function) handler for hover out + */ elproto.unhover = function (f_in, f_out) { return this.unmouseover(f_in).unmouseout(f_out) } let draggable = [] -// SIERRA unclear what _context_ refers to for starting, ending, moving the drag gesture. -// SIERRA SnapElement.drag(): _x position of the mouse_: Where are the x/y values offset from? -// SIERRA SnapElement.drag(): much of this member's doc appears to be duplicated for some reason. -// SIERRA Unclear about this sentence: _Additionally following drag events will be triggered: drag.start. on start, drag.end. on end and drag.move. on every move._ Is there a global _drag_ object to which you can assign handlers keyed by an element's id? -/*\ - * SnapElement.drag - [ method ] - ** - * Adds event handlers for an element's drag gesture - ** - - onmove (function) handler for moving - - onstart (function) handler for drag start - - onend (function) handler for drag end - - mcontext (object) #optional context for moving handler - - scontext (object) #optional context for drag start handler - - econtext (object) #optional context for drag end handler - * Additionaly following `drag` events are triggered: `drag.start.` on start, - * `drag.end.` on end and `drag.move.` on every move. When element is dragged over another element - * `drag.over.` fires as well. - * - * Start event and start handler are called in specified context or in context of the element with following parameters: - o x (number) x position of the mouse - o y (number) y position of the mouse - o event (object) DOM event object - * Move event and move handler are called in specified context or in context of the element with following parameters: - o dx (number) shift by x from the start point - o dy (number) shift by y from the start point - o x (number) x position of the mouse - o y (number) y position of the mouse - o event (object) DOM event object - * End event and end handler are called in specified context or in context of the element with following parameters: - o event (object) DOM event object - = (object) @SnapElement - \*/ + elproto.drag = function ( onmove, onstart, @@ -498,22 +273,7 @@ elproto.drag = function ( el.mousedown(init) return el } -/* - * SnapElement.onDragOver - [ method ] - ** - * Shortcut to assign event handler for `drag.over.` event, where `id` is the element's `id` (see @SnapElement.id) - - f (function) handler for event, first argument would be the element you are dragging over - \*/ -// elproto.onDragOver = function (f) { -// f ? eve.on("snap.drag.over." + this.id, f) : eve.unbind("snap.drag.over." + this.id); -// }; -/*\ - * SnapElement.undrag - [ method ] - ** - * Removes all drag event handlers from the given element - \*/ + elproto.undrag = function () { let i = draggable.length while (i--) diff --git a/src/paper.js b/src/paper.js index ee958d6..06744b0 100644 --- a/src/paper.js +++ b/src/paper.js @@ -14,27 +14,19 @@ let proto = Paper.prototype // gradients ;(function () { // gradients' helpers - /*\ - * SnapElement.stops - [ method ] - ** - * Only for gradients! - * Returns array of gradient stops elements. - = (array) the stops array. - \*/ + /** + * Only for gradients! + * Returns array of gradient stops elements. + */ function Gstops() { return this.selectAll('stop') } - /*\ - * SnapElement.addStop - [ method ] - ** - * Only for gradients! - * Adds another stop to the gradient. - - color (string) stops color - - offset (number) stops offset 0..100 - = (object) gradient element - \*/ + /** + * Only for gradients! + * Adds another stop to the gradient. + * color (string) stops color + * offset (number) stops offset 0..100 + */ function GaddStop(color, offset) { let stop = $('stop'), attr = { @@ -75,17 +67,14 @@ let proto = Paper.prototype return Snap._.box(cx - r, cy - r, r * 2, r * 2) } } - /*\ - * SnapElement.setStops - [ method ] - ** - * Only for gradients! - * Updates stops of the gradient based on passed gradient descriptor. See @Ppaer.gradient - - str (string) gradient descriptor part after `()`. - = (object) gradient element - | let g = paper.gradient("l(0, 0, 1, 1)#000-#f00-#fff"); - | g.setStops("#fff-#000-#f00-#fc0"); - \*/ + /** + * Only for gradients! + * Updates stops of the gradient based on passed gradient descriptor. See @Ppaer.gradient + - str (string) gradient descriptor part after `()`. + = (object) gradient element + | let g = paper.gradient("l(0, 0, 1, 1)#000-#f00-#fff"); + | g.setStops("#fff-#000-#f00-#fc0"); + */ function GsetStops(str) { let grad = str, stops = this.stops() diff --git a/src/path.js b/src/path.js index 3af80b8..bfd288b 100644 --- a/src/path.js +++ b/src/path.js @@ -1,29 +1,21 @@ -// Copyright (c) 2013 Adobe Systems Incorporated. All rights reserved. -// -// Licensed under the Apache License, Version 2.0 (the "License"); -// you may not use this file except in compliance with the License. -// You may obtain a copy of the License at -// -// http://www.apache.org/licenses/LICENSE-2.0 -// -// Unless required by applicable law or agreed to in writing, software -// distributed under the License is distributed on an "AS IS" BASIS, -// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -// See the License for the specific language governing permissions and -// limitations under the License. -import { Snap, SnapElement, Paper, Fragment, unit2px } from './svg.js' +/** + * {} + * @author yutent + * @date 2024/03/08 10:57:37 + */ + +import { Snap, SnapElement, unit2px } from './svg.js' import { is, clone, cacher } from './utils.js' let elproto = SnapElement.prototype, has = 'hasOwnProperty', p2s = /,?([a-z]),?/gi, - toFloat = parseFloat, - math = Math, - PI = math.PI, - mmin = math.min, - mmax = math.max, - pow = math.pow, - abs = math.abs + PI = Math.PI, + mmin = Math.min, + mmax = Math.max, + pow = Math.pow, + abs = Math.abs + function paths(ps) { let p = (paths.ps = paths.ps || {}) if (p[ps]) { @@ -34,11 +26,12 @@ function paths(ps) { } } setTimeout(function () { - for (let key in p) + for (let key in p) { if (p[has](key) && key != ps) { p[key].sleep-- !p[key].sleep && delete p[key] } + } }) return p[ps] } @@ -63,9 +56,9 @@ function box(x, y, width, height) { y2: y + height, cx: x + width / 2, cy: y + height / 2, - r1: math.min(width, height) / 2, - r2: math.max(width, height) / 2, - r0: math.sqrt(width * width + height * height) / 2, + r1: Math.min(width, height) / 2, + r2: Math.max(width, height) / 2, + r0: Math.sqrt(width * width + height * height) / 2, path: rectPath(x, y, width, height), vb: [x, y, width, height].join(' ') } @@ -221,7 +214,7 @@ function findDotsAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t) { ay = t1 * p1y + t * c1y, cx = t1 * c2x + t * p2x, cy = t1 * c2y + t * p2y, - alpha = 90 - (math.atan2(mx - nx, my - ny) * 180) / PI + alpha = 90 - (Math.atan2(mx - nx, my - ny) * 180) / PI // (mx > nx || my < ny) && (alpha += 180); return { x: x, @@ -297,7 +290,7 @@ function bezlen(x1, y1, x2, y2, x3, y3, x4, y4, z) { xbase = base3(ct, x1, x2, x3, x4), ybase = base3(ct, y1, y2, y3, y4), comb = xbase * xbase + ybase * ybase - sum += Cvalues[i] * math.sqrt(comb) + sum += Cvalues[i] * Math.sqrt(comb) } return z2 * sum } @@ -863,15 +856,15 @@ function a2c( y2, recursive ) { - // for more information of where this math came from visit: + // for more information of where this Math came from visit: // http://www.w3.org/TR/SVG11/implnote.html#ArcImplementationNotes let _120 = (PI * 120) / 180, rad = (PI / 180) * (+angle || 0), res = [], xy, rotate = cacher(function (x, y, rad) { - let X = x * math.cos(rad) - y * math.sin(rad), - Y = x * math.sin(rad) + y * math.cos(rad) + let X = x * Math.cos(rad) - y * Math.sin(rad), + Y = x * Math.sin(rad) + y * Math.cos(rad) return { x: X, y: Y } }) if (!rx || !ry) { @@ -884,13 +877,13 @@ function a2c( xy = rotate(x2, y2, -rad) x2 = xy.x y2 = xy.y - let cos = math.cos((PI / 180) * angle), - sin = math.sin((PI / 180) * angle), + let cos = Math.cos((PI / 180) * angle), + sin = Math.sin((PI / 180) * angle), x = (x1 - x2) / 2, y = (y1 - y2) / 2 let h = (x * x) / (rx * rx) + (y * y) / (ry * ry) if (h > 1) { - h = math.sqrt(h) + h = Math.sqrt(h) rx = h * rx ry = h * ry } @@ -898,7 +891,7 @@ function a2c( ry2 = ry * ry, k = (large_arc_flag == sweep_flag ? -1 : 1) * - math.sqrt( + Math.sqrt( abs( (rx2 * ry2 - rx2 * y * y - ry2 * x * x) / (rx2 * y * y + ry2 * x * x) @@ -906,8 +899,8 @@ function a2c( ), cx = (k * rx * y) / ry + (x1 + x2) / 2, cy = (k * -ry * x) / rx + (y1 + y2) / 2, - f1 = math.asin(((y1 - cy) / ry).toFixed(9)), - f2 = math.asin(((y2 - cy) / ry).toFixed(9)) + f1 = Math.asin(((y1 - cy) / ry).toFixed(9)), + f2 = Math.asin(((y2 - cy) / ry).toFixed(9)) f1 = x1 < cx ? PI - f1 : f1 f2 = x2 < cx ? PI - f2 : f2 @@ -931,8 +924,8 @@ function a2c( x2old = x2, y2old = y2 f2 = f1 + _120 * (sweep_flag && f2 > f1 ? 1 : -1) - x2 = cx + rx * math.cos(f2) - y2 = cy + ry * math.sin(f2) + x2 = cx + rx * Math.cos(f2) + y2 = cy + ry * Math.sin(f2) res = a2c(x2, y2, rx, ry, angle, 0, sweep_flag, x2old, y2old, [ f2, f2old, @@ -941,11 +934,11 @@ function a2c( ]) } df = f2 - f1 - let c1 = math.cos(f1), - s1 = math.sin(f1), - c2 = math.cos(f2), - s2 = math.sin(f2), - t = math.tan(df / 4), + let c1 = Math.cos(f1), + s1 = Math.sin(f1), + c2 = Math.cos(f2), + s2 = Math.sin(f2), + t = Math.tan(df / 4), hx = (4 / 3) * rx * t, hy = (4 / 3) * ry * t, m1 = [x1, y1], @@ -1020,7 +1013,7 @@ function curveDim(x0, y0, x1, y1, x2, y2, x3, y3) { continue } b2ac = b * b - 4 * c * a - sqrtb2ac = math.sqrt(b2ac) + sqrtb2ac = Math.sqrt(b2ac) if (b2ac < 0) { continue } @@ -1199,10 +1192,10 @@ function path2curve(path, path2) { seg2len = p2 && seg2.length attrs.x = seg[seglen - 2] attrs.y = seg[seglen - 1] - attrs.bx = toFloat(seg[seglen - 4]) || attrs.x - attrs.by = toFloat(seg[seglen - 3]) || attrs.y - attrs2.bx = p2 && (toFloat(seg2[seg2len - 4]) || attrs2.x) - attrs2.by = p2 && (toFloat(seg2[seg2len - 3]) || attrs2.y) + attrs.bx = +seg[seglen - 4] || attrs.x + attrs.by = +seg[seglen - 3] || attrs.y + attrs2.bx = p2 && (+seg2[seg2len - 4] || attrs2.x) + attrs2.by = p2 && (+seg2[seg2len - 3] || attrs2.y) attrs2.x = p2 && seg2[seg2len - 2] attrs2.y = p2 && seg2[seg2len - 1] } @@ -1272,46 +1265,36 @@ function catmullRom2bezier(crp, z) { // export Snap.path = paths -/*\ - * Snap.path.getTotalLength - [ method ] - ** - * Returns the length of the given path in pixels - ** - - path (string) SVG path string - ** - = (number) length - \*/ +/** + * Returns the length of the given path in pixels + ** + * path (string) SVG path string + ** + */ Snap.path.getTotalLength = getTotalLength -/*\ - * Snap.path.getPointAtLength - [ method ] - ** - * Returns the coordinates of the point located at the given length along the given path - ** - - path (string) SVG path string - - length (number) length, in pixels, from the start of the path, excluding non-rendering jumps - ** - = (object) representation of the point: - o { - o x: (number) x coordinate, - o y: (number) y coordinate, - o alpha: (number) angle of derivative - o } - \*/ +/** + * Returns the coordinates of the point located at the given length along the given path + ** + * path (string) SVG path string + * length (number) length, in pixels, from the start of the path, excluding non-rendering jumps + ** + = (object) representation of the point: + { + x: (number) x coordinate, + y: (number) y coordinate, + alpha: (number) angle of derivative + } +*/ Snap.path.getPointAtLength = getPointAtLength -/*\ - * Snap.path.getSubpath - [ method ] - ** - * Returns the subpath of a given path between given start and end lengths - ** - - path (string) SVG path string - - from (number) length, in pixels, from the start of the path to the start of the segment - - to (number) length, in pixels, from the start of the path to the end of the segment - ** - = (string) path string definition for the segment - \*/ +/** + * Returns the subpath of a given path between given start and end lengths + ** + - path (string) SVG path string + - from (number) length, in pixels, from the start of the path to the start of the segment + - to (number) length, in pixels, from the start of the path to the end of the segment + ** + = (string) path string definition for the segment +*/ Snap.path.getSubpath = function (path, from, to) { if (this.getTotalLength(path) - to < 1e-6) { return getSubpathsAtLength(path, from).end @@ -1319,133 +1302,113 @@ Snap.path.getSubpath = function (path, from, to) { let a = getSubpathsAtLength(path, to, 1) return from ? getSubpathsAtLength(a, from).end : a } -/*\ - * SnapElement.getTotalLength - [ method ] - ** - * Returns the length of the path in pixels (only works for `path` elements) - = (number) length - \*/ +/** + * Returns the length of the path in pixels (only works for `path` elements) + = (number) length +*/ elproto.getTotalLength = function () { if (this.node.getTotalLength) { return this.node.getTotalLength() } } // SIERRA SnapElement.getPointAtLength()/SnapElement.getTotalLength(): If a is broken into different segments, is the jump distance to the new coordinates set by the _M_ or _m_ commands calculated as part of the path's total length? -/*\ - * SnapElement.getPointAtLength - [ method ] - ** - * Returns coordinates of the point located at the given length on the given path (only works for `path` elements) - ** - - length (number) length, in pixels, from the start of the path, excluding non-rendering jumps - ** - = (object) representation of the point: - o { - o x: (number) x coordinate, - o y: (number) y coordinate, - o alpha: (number) angle of derivative - o } - \*/ +/** + * Returns coordinates of the point located at the given length on the given path (only works for `path` elements) + ** + - length (number) length, in pixels, from the start of the path, excluding non-rendering jumps + ** + = (object) representation of the point: + { + x: (number) x coordinate, + y: (number) y coordinate, + alpha: (number) angle of derivative + } +*/ elproto.getPointAtLength = function (length) { return getPointAtLength(this.attr('d'), length) } // SIERRA SnapElement.getSubpath(): Similar to the problem for SnapElement.getPointAtLength(). Unclear how this would work for a segmented path. Overall, the concept of _subpath_ and what I'm calling a _segment_ (series of non-_M_ or _Z_ commands) is unclear. -/*\ - * SnapElement.getSubpath - [ method ] - ** - * Returns subpath of a given element from given start and end lengths (only works for `path` elements) - ** - - from (number) length, in pixels, from the start of the path to the start of the segment - - to (number) length, in pixels, from the start of the path to the end of the segment - ** - = (string) path string definition for the segment - \*/ +/** + * Returns subpath of a given element from given start and end lengths (only works for `path` elements) + ** + - from (number) length, in pixels, from the start of the path to the start of the segment + - to (number) length, in pixels, from the start of the path to the end of the segment + ** + = (string) path string definition for the segment +*/ elproto.getSubpath = function (from, to) { return Snap.path.getSubpath(this.attr('d'), from, to) } Snap._.box = box -/*\ - * Snap.path.findDotsAtSegment - [ method ] - ** - * Utility method - ** - * Finds dot coordinates on the given cubic beziér curve at the given t - - p1x (number) x of the first point of the curve - - p1y (number) y of the first point of the curve - - c1x (number) x of the first anchor of the curve - - c1y (number) y of the first anchor of the curve - - c2x (number) x of the second anchor of the curve - - c2y (number) y of the second anchor of the curve - - p2x (number) x of the second point of the curve - - p2y (number) y of the second point of the curve - - t (number) position on the curve (0..1) - = (object) point information in format: - o { - o x: (number) x coordinate of the point, - o y: (number) y coordinate of the point, - o m: { - o x: (number) x coordinate of the left anchor, - o y: (number) y coordinate of the left anchor - o }, - o n: { - o x: (number) x coordinate of the right anchor, - o y: (number) y coordinate of the right anchor - o }, - o start: { - o x: (number) x coordinate of the start of the curve, - o y: (number) y coordinate of the start of the curve - o }, - o end: { - o x: (number) x coordinate of the end of the curve, - o y: (number) y coordinate of the end of the curve - o }, - o alpha: (number) angle of the curve derivative at the point - o } - \*/ +/** + * Utility method + ** + * Finds dot coordinates on the given cubic beziér curve at the given t + - p1x (number) x of the first point of the curve + - p1y (number) y of the first point of the curve + - c1x (number) x of the first anchor of the curve + - c1y (number) y of the first anchor of the curve + - c2x (number) x of the second anchor of the curve + - c2y (number) y of the second anchor of the curve + - p2x (number) x of the second point of the curve + - p2y (number) y of the second point of the curve + - t (number) position on the curve (0..1) + = (object) point information in format: + { + x: (number) x coordinate of the point, + y: (number) y coordinate of the point, + m: { + x: (number) x coordinate of the left anchor, + y: (number) y coordinate of the left anchor + }, + n: { + x: (number) x coordinate of the right anchor, + y: (number) y coordinate of the right anchor + }, + start: { + x: (number) x coordinate of the start of the curve, + y: (number) y coordinate of the start of the curve + }, + end: { + x: (number) x coordinate of the end of the curve, + y: (number) y coordinate of the end of the curve + }, + alpha: (number) angle of the curve derivative at the point + } +*/ Snap.path.findDotsAtSegment = findDotsAtSegment -/*\ - * Snap.path.bezierBBox - [ method ] - ** - * Utility method - ** - * Returns the bounding box of a given cubic beziér curve - - p1x (number) x of the first point of the curve - - p1y (number) y of the first point of the curve - - c1x (number) x of the first anchor of the curve - - c1y (number) y of the first anchor of the curve - - c2x (number) x of the second anchor of the curve - - c2y (number) y of the second anchor of the curve - - p2x (number) x of the second point of the curve - - p2y (number) y of the second point of the curve - * or - - bez (array) array of six points for beziér curve - = (object) bounding box - o { - o x: (number) x coordinate of the left top point of the box, - o y: (number) y coordinate of the left top point of the box, - o x2: (number) x coordinate of the right bottom point of the box, - o y2: (number) y coordinate of the right bottom point of the box, - o width: (number) width of the box, - o height: (number) height of the box - o } - \*/ +/** + ** + * Returns the bounding box of a given cubic beziér curve + - p1x (number) x of the first point of the curve + - p1y (number) y of the first point of the curve + - c1x (number) x of the first anchor of the curve + - c1y (number) y of the first anchor of the curve + - c2x (number) x of the second anchor of the curve + - c2y (number) y of the second anchor of the curve + - p2x (number) x of the second point of the curve + - p2y (number) y of the second point of the curve + * or + - bez (array) array of six points for beziér curve + = (object) bounding box + o { + o x: (number) x coordinate of the left top point of the box, + o y: (number) y coordinate of the left top point of the box, + o x2: (number) x coordinate of the right bottom point of the box, + o y2: (number) y coordinate of the right bottom point of the box, + o width: (number) width of the box, + o height: (number) height of the box + o } +*/ Snap.path.bezierBBox = bezierBBox -/*\ - * Snap.path.isPointInsideBBox - [ method ] - ** - * Utility method - ** - * Returns `true` if given point is inside bounding box - - bbox (string) bounding box - - x (string) x coordinate of the point - - y (string) y coordinate of the point - = (boolean) `true` if point is inside - \*/ +/** + ** + * Returns `true` if given point is inside bounding box + - bbox (string) bounding box + - x (string) x coordinate of the point + - y (string) y coordinate of the point + = (boolean) `true` if point is inside +*/ Snap.path.isPointInsideBBox = isPointInsideBBox Snap.closest = function (x, y, X, Y) { let r = 100, @@ -1506,108 +1469,75 @@ Snap.closest = function (x, y, X, Y) { = (boolean) `true` if bounding boxes intersect \*/ Snap.path.isBBoxIntersect = isBBoxIntersect -/*\ - * Snap.path.intersection - [ method ] - ** - * Utility method - ** - * Finds intersections of two paths - - path1 (string) path string - - path2 (string) path string - = (array) dots of intersection - o [ - o { - o x: (number) x coordinate of the point, - o y: (number) y coordinate of the point, - o t1: (number) t value for segment of path1, - o t2: (number) t value for segment of path2, - o segment1: (number) order number for segment of path1, - o segment2: (number) order number for segment of path2, - o bez1: (array) eight coordinates representing beziér curve for the segment of path1, - o bez2: (array) eight coordinates representing beziér curve for the segment of path2 - o } - o ] - \*/ +/** + * Finds intersections of two paths + - path1 (string) path string + - path2 (string) path string + = (array) dots of intersection + o [ + o { + o x: (number) x coordinate of the point, + o y: (number) y coordinate of the point, + o t1: (number) t value for segment of path1, + o t2: (number) t value for segment of path2, + o segment1: (number) order number for segment of path1, + o segment2: (number) order number for segment of path2, + o bez1: (array) eight coordinates representing beziér curve for the segment of path1, + o bez2: (array) eight coordinates representing beziér curve for the segment of path2 + o } + o ] +*/ Snap.path.intersection = pathIntersection Snap.path.intersectionNumber = pathIntersectionNumber -/*\ - * Snap.path.isPointInside - [ method ] - ** - * Utility method - ** - * Returns `true` if given point is inside a given closed path. - * - * Note: fill mode doesn’t affect the result of this method. - - path (string) path string - - x (number) x of the point - - y (number) y of the point - = (boolean) `true` if point is inside the path - \*/ +/** + * Returns `true` if given point is inside a given closed path. + * + * Note: fill mode doesn’t affect the result of this method. + - path (string) path string + - x (number) x of the point + - y (number) y of the point + = (boolean) `true` if point is inside the path +*/ Snap.path.isPointInside = isPointInsidePath -/*\ - * Snap.path.getBBox - [ method ] - ** - * Utility method - ** - * Returns the bounding box of a given path - - path (string) path string - = (object) bounding box - o { - o x: (number) x coordinate of the left top point of the box, - o y: (number) y coordinate of the left top point of the box, - o x2: (number) x coordinate of the right bottom point of the box, - o y2: (number) y coordinate of the right bottom point of the box, - o width: (number) width of the box, - o height: (number) height of the box - o } - \*/ +/** + * Returns the bounding box of a given path + - path (string) path string + = (object) bounding box + o { + o x: (number) x coordinate of the left top point of the box, + o y: (number) y coordinate of the left top point of the box, + o x2: (number) x coordinate of the right bottom point of the box, + o y2: (number) y coordinate of the right bottom point of the box, + o width: (number) width of the box, + o height: (number) height of the box + o } +*/ Snap.path.getBBox = pathBBox Snap.path.get = getPath -/*\ - * Snap.path.toRelative - [ method ] - ** - * Utility method - ** - * Converts path coordinates into relative values - - path (string) path string - = (array) path string - \*/ +/** + * Converts path coordinates into relative values + - path (string) path string + = (array) path string +*/ Snap.path.toRelative = pathToRelative -/*\ - * Snap.path.toAbsolute - [ method ] - ** - * Utility method - ** - * Converts path coordinates into absolute values - - path (string) path string - = (array) path string - \*/ +/** + * Converts path coordinates into absolute values + - path (string) path string + = (array) path string +*/ Snap.path.toAbsolute = pathToAbsolute -/*\ - * Snap.path.toCubic - [ method ] - ** - * Utility method - ** - * Converts path to a new path where all segments are cubic beziér curves - - pathString (string|array) path string or array of segments - = (array) array of segments - \*/ +/** + * Converts path to a new path where all segments are cubic beziér curves + - pathString (string|array) path string or array of segments + = (array) array of segments +*/ Snap.path.toCubic = path2curve -/*\ - * Snap.path.map - [ method ] - ** - * Transform the path string with the given matrix - - path (string) path string - - matrix (object) see @Matrix - = (string) transformed path string - \*/ +/** + * Transform the path string with the given matrix + - path (string) path string + - matrix (object) see @Matrix + = (string) transformed path string +*/ Snap.path.map = mapPath Snap.path.toString = toString Snap.path.clone = pathClone