代码精简
parent
4ae1ddd373
commit
138681c92f
92
src/align.js
92
src/align.js
|
@ -1,92 +0,0 @@
|
|||
// Copyright (c) 2014 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 } from './svg.js'
|
||||
import { is } from './utils.js'
|
||||
|
||||
let box = Snap._.box,
|
||||
firstLetter = /^[^a-z]*([tbmlrc])/i,
|
||||
toString = function () {
|
||||
return 'T' + this.dx + ',' + this.dy
|
||||
}
|
||||
/*\
|
||||
* SnapElement.getAlign
|
||||
[ method ]
|
||||
**
|
||||
* Returns shift needed to align the element relatively to given element.
|
||||
* If no elements specified, parent `<svg>` container will be used.
|
||||
- el (object) @optional alignment element
|
||||
- way (string) one of six values: `"top"`, `"middle"`, `"bottom"`, `"left"`, `"center"`, `"right"`
|
||||
= (object|string) Object in format `{dx: , dy: }` also has a string representation as a transformation string
|
||||
> Usage
|
||||
| el.transform(el.getAlign(el2, "top"));
|
||||
* or
|
||||
| let dy = el.getAlign(el2, "top").dy;
|
||||
\*/
|
||||
SnapElement.prototype.getAlign = function (el, way) {
|
||||
if (way == null && is(el, 'string')) {
|
||||
way = el
|
||||
el = null
|
||||
}
|
||||
el = el || this.paper
|
||||
let bx = el.getBBox ? el.getBBox() : box(el),
|
||||
bb = this.getBBox(),
|
||||
out = {}
|
||||
way = way && way.match(firstLetter)
|
||||
way = way ? way[1].toLowerCase() : 'c'
|
||||
switch (way) {
|
||||
case 't':
|
||||
out.dx = 0
|
||||
out.dy = bx.y - bb.y
|
||||
break
|
||||
case 'b':
|
||||
out.dx = 0
|
||||
out.dy = bx.y2 - bb.y2
|
||||
break
|
||||
case 'm':
|
||||
out.dx = 0
|
||||
out.dy = bx.cy - bb.cy
|
||||
break
|
||||
case 'l':
|
||||
out.dx = bx.x - bb.x
|
||||
out.dy = 0
|
||||
break
|
||||
case 'r':
|
||||
out.dx = bx.x2 - bb.x2
|
||||
out.dy = 0
|
||||
break
|
||||
default:
|
||||
out.dx = bx.cx - bb.cx
|
||||
out.dy = 0
|
||||
break
|
||||
}
|
||||
out.toString = toString
|
||||
return out
|
||||
}
|
||||
/*\
|
||||
* SnapElement.align
|
||||
[ method ]
|
||||
**
|
||||
* Aligns the element relatively to given one via transformation.
|
||||
* If no elements specified, parent `<svg>` container will be used.
|
||||
- el (object) @optional alignment element
|
||||
- way (string) one of six values: `"top"`, `"middle"`, `"bottom"`, `"left"`, `"center"`, `"right"`
|
||||
= (object) this element
|
||||
> Usage
|
||||
| el.align(el2, "top");
|
||||
* or
|
||||
| el.align("middle");
|
||||
\*/
|
||||
SnapElement.prototype.align = function (el, way) {
|
||||
return this.transform('...' + this.getAlign(el, way))
|
||||
}
|
136
src/class.js
136
src/class.js
|
@ -1,136 +0,0 @@
|
|||
/**
|
||||
* {}
|
||||
* @author yutent<yutent.io@gmail.com>
|
||||
* @date 2024/03/06 16:34:24
|
||||
*/
|
||||
|
||||
import { Snap, SnapElement, Paper, Fragment } from './svg.js'
|
||||
|
||||
let rgNotSpace = /\S+/g,
|
||||
rgBadSpace = /[\t\r\n\f]/g,
|
||||
rgTrim = /(^\s+|\s+$)/g,
|
||||
Str = String,
|
||||
elproto = SnapElement.prototype
|
||||
/*\
|
||||
|
||||
**
|
||||
* Adds given class name or list of class names to the element.
|
||||
- value (string) class name or space separated list of class names
|
||||
**
|
||||
= (SnapElement) original element.
|
||||
\*/
|
||||
elproto.addClass = function (value) {
|
||||
let classes = Str(value || '').match(rgNotSpace) || [],
|
||||
elem = this.node,
|
||||
className = elem.className.baseVal,
|
||||
curClasses = className.match(rgNotSpace) || [],
|
||||
j,
|
||||
pos,
|
||||
clazz,
|
||||
finalValue
|
||||
|
||||
if (classes.length) {
|
||||
j = 0
|
||||
while ((clazz = classes[j++])) {
|
||||
pos = curClasses.indexOf(clazz)
|
||||
if (!~pos) {
|
||||
curClasses.push(clazz)
|
||||
}
|
||||
}
|
||||
|
||||
finalValue = curClasses.join(' ')
|
||||
if (className != finalValue) {
|
||||
elem.className.baseVal = finalValue
|
||||
}
|
||||
}
|
||||
return this
|
||||
}
|
||||
/*\
|
||||
|
||||
**
|
||||
* Removes given class name or list of class names from the element.
|
||||
- value (string) class name or space separated list of class names
|
||||
**
|
||||
= (SnapElement) original element.
|
||||
\*/
|
||||
elproto.removeClass = function (value) {
|
||||
let classes = Str(value || '').match(rgNotSpace) || [],
|
||||
elem = this.node,
|
||||
className = elem.className.baseVal,
|
||||
curClasses = className.match(rgNotSpace) || [],
|
||||
j,
|
||||
pos,
|
||||
clazz,
|
||||
finalValue
|
||||
if (curClasses.length) {
|
||||
j = 0
|
||||
while ((clazz = classes[j++])) {
|
||||
pos = curClasses.indexOf(clazz)
|
||||
if (~pos) {
|
||||
curClasses.splice(pos, 1)
|
||||
}
|
||||
}
|
||||
|
||||
finalValue = curClasses.join(' ')
|
||||
if (className != finalValue) {
|
||||
elem.className.baseVal = finalValue
|
||||
}
|
||||
}
|
||||
return this
|
||||
}
|
||||
/*\
|
||||
|
||||
**
|
||||
* Checks if the element has a given class name in the list of class names applied to it.
|
||||
- value (string) class name
|
||||
**
|
||||
= (boolean) `true` if the element has given class
|
||||
\*/
|
||||
elproto.hasClass = function (value) {
|
||||
let elem = this.node,
|
||||
className = elem.className.baseVal,
|
||||
curClasses = className.match(rgNotSpace) || []
|
||||
return !!~curClasses.indexOf(value)
|
||||
}
|
||||
/*\
|
||||
|
||||
**
|
||||
* Add or remove one or more classes from the element, depending on either
|
||||
* the class’s presence or the value of the `flag` argument.
|
||||
- value (string) class name or space separated list of class names
|
||||
- flag (boolean) value to determine whether the class should be added or removed
|
||||
**
|
||||
= (SnapElement) original element.
|
||||
\*/
|
||||
elproto.toggleClass = function (value, flag) {
|
||||
if (flag != null) {
|
||||
if (flag) {
|
||||
return this.addClass(value)
|
||||
} else {
|
||||
return this.removeClass(value)
|
||||
}
|
||||
}
|
||||
let classes = (value || '').match(rgNotSpace) || [],
|
||||
elem = this.node,
|
||||
className = elem.className.baseVal,
|
||||
curClasses = className.match(rgNotSpace) || [],
|
||||
j,
|
||||
pos,
|
||||
clazz,
|
||||
finalValue
|
||||
j = 0
|
||||
while ((clazz = classes[j++])) {
|
||||
pos = curClasses.indexOf(clazz)
|
||||
if (~pos) {
|
||||
curClasses.splice(pos, 1)
|
||||
} else {
|
||||
curClasses.push(clazz)
|
||||
}
|
||||
}
|
||||
|
||||
finalValue = curClasses.join(' ')
|
||||
if (className != finalValue) {
|
||||
elem.className.baseVal = finalValue
|
||||
}
|
||||
return this
|
||||
}
|
|
@ -4,14 +4,11 @@ import './element.js'
|
|||
import './animation.js'
|
||||
import './matrix.js'
|
||||
import './attr.js'
|
||||
import './class.js'
|
||||
import './attradd.js'
|
||||
import './path.js'
|
||||
import './set.js'
|
||||
import './equal.js'
|
||||
import './mouse.js'
|
||||
import './filter.js'
|
||||
import './align.js'
|
||||
// import './colors.js'
|
||||
|
||||
export default Snap
|
||||
|
|
61
src/svg.js
61
src/svg.js
|
@ -1343,6 +1343,67 @@ export class SnapElement {
|
|||
jsonFiller([this], out)
|
||||
return out[0]
|
||||
}
|
||||
|
||||
addClass(value) {
|
||||
this.node.classList.add(value)
|
||||
return this
|
||||
}
|
||||
|
||||
removeClass(value) {
|
||||
this.node.classList.remove(value)
|
||||
return this
|
||||
}
|
||||
|
||||
hasClass(value) {
|
||||
return this.node.classList.contains(value)
|
||||
}
|
||||
|
||||
toggleClass(value, flag) {
|
||||
this.node.classList.toggle(value, flag)
|
||||
return this
|
||||
}
|
||||
|
||||
getAlign(way = 'center') {
|
||||
let bx = this.paper.getBBox()
|
||||
let bb = this.getBBox()
|
||||
let out = {
|
||||
toString() {
|
||||
return 'T' + this.dx + ',' + this.dy
|
||||
}
|
||||
}
|
||||
|
||||
switch (way.toLowerCase()) {
|
||||
case 'top':
|
||||
out.dx = 0
|
||||
out.dy = bx.y - bb.y
|
||||
break
|
||||
case 'bottom':
|
||||
out.dx = 0
|
||||
out.dy = bx.y2 - bb.y2
|
||||
break
|
||||
case 'middle':
|
||||
out.dx = 0
|
||||
out.dy = bx.cy - bb.cy
|
||||
break
|
||||
case 'left':
|
||||
out.dx = bx.x - bb.x
|
||||
out.dy = 0
|
||||
break
|
||||
case 'right':
|
||||
out.dx = bx.x2 - bb.x2
|
||||
out.dy = 0
|
||||
break
|
||||
case 'center':
|
||||
out.dx = bx.cx - bb.cx
|
||||
out.dy = 0
|
||||
break
|
||||
}
|
||||
return out
|
||||
}
|
||||
|
||||
align(way) {
|
||||
return this.transform('' + this.getAlign(way))
|
||||
}
|
||||
}
|
||||
|
||||
// default
|
||||
|
|
Loading…
Reference in New Issue