diff options
Diffstat (limited to 'src')
-rwxr-xr-x | src/defs.js | 1 | ||||
-rwxr-xr-x | src/element.js | 15 | ||||
-rwxr-xr-x | src/gradient.js | 2 | ||||
-rw-r--r-- | src/helpers.js | 7 | ||||
-rw-r--r-- | src/marker.js | 80 | ||||
-rwxr-xr-x | src/pattern.js | 2 | ||||
-rwxr-xr-x | src/regex.js | 3 | ||||
-rw-r--r-- | src/selector.js | 5 | ||||
-rwxr-xr-x | src/set.js | 8 | ||||
-rwxr-xr-x | src/svg.js | 6 | ||||
-rw-r--r-- | src/symbol.js | 17 | ||||
-rwxr-xr-x | src/text.js | 4 |
12 files changed, 138 insertions, 12 deletions
diff --git a/src/defs.js b/src/defs.js index a50ad94..ad66cc5 100755 --- a/src/defs.js +++ b/src/defs.js @@ -5,4 +5,5 @@ SVG.Defs = SVG.invent({ // Inherit from , inherit: SVG.Container + })
\ No newline at end of file diff --git a/src/element.js b/src/element.js index e63b57e..b12947b 100755 --- a/src/element.js +++ b/src/element.js @@ -61,10 +61,9 @@ SVG.Element = SVG.invent({ , size: function(width, height) { var p = proportionalSize(this.bbox(), width, height) - return this.attr({ - width: new SVG.Number(p.width) - , height: new SVG.Number(p.height) - }) + return this + .width(new SVG.Number(p.width)) + .height(new SVG.Number(p.height)) } // Clone element , clone: function() { @@ -308,6 +307,10 @@ SVG.Element = SVG.invent({ return this } + // Get / set id + , id: function(id) { + return this.attr('id', id) + } // Get bounding box , bbox: function() { return new SVG.BBox(this) @@ -384,6 +387,10 @@ SVG.Element = SVG.invent({ } return this } + // Get referenced element form attribute value + , reference: function(attr) { + return SVG.get(this.attr(attr)) + } // Private: find svg parent by instance , _parent: function(parent) { var element = this diff --git a/src/gradient.js b/src/gradient.js index 895f8ca..56c1376 100755 --- a/src/gradient.js +++ b/src/gradient.js @@ -47,7 +47,7 @@ SVG.Gradient = SVG.invent({ } // Return the fill id , fill: function() { - return 'url(#' + this.attr('id') + ')' + return 'url(#' + this.id() + ')' } // Alias string convertion to fill , toString: function() { diff --git a/src/helpers.js b/src/helpers.js index 5a1dd6d..c63c215 100644 --- a/src/helpers.js +++ b/src/helpers.js @@ -114,6 +114,13 @@ function parseMatrix(o) { return o } +// Get id from reference string +function idFromReference(url) { + var m = url.toString().match(SVG.regex.reference) + + if (m) return m[1] +} + // Shim layer with setTimeout fallback by Paul Irish window.requestAnimFrame = (function(){ return window.requestAnimationFrame || diff --git a/src/marker.js b/src/marker.js new file mode 100644 index 0000000..30b09a4 --- /dev/null +++ b/src/marker.js @@ -0,0 +1,80 @@ +SVG.Marker = SVG.invent({ + // Initialize node + create: 'marker' + + // Inherit from +, inherit: SVG.Container + + // Add class methods +, extend: { + // Set width of element + width: function(width) { + return this.attr('markerWidth', width) + } + // Set height of element + , height: function(height) { + return this.attr('markerHeight', height) + } + // Set marker refX and refY + , ref: function(x, y) { + return this.attr('refX', x).attr('refY', y) + } + // Update marker + , update: function(block) { + /* remove all content */ + this.clear() + + /* invoke passed block */ + if (typeof block == 'function') + block.call(this, this) + + return this + } + // Return the fill id + , toString: function() { + return 'url(#' + this.id() + ')' + } + } + + // Add parent method +, construct: { + marker: function(width, height, block) { + // Create marker element in defs + return this.defs().marker(width, height, block) + } + } + +}) + +SVG.extend(SVG.Defs, { + // Create marker + marker: function(width, height, block) { + // Set default viewbox to match the width and height, set ref to cx and cy and set orient to auto + return this.put(new SVG.Marker) + .size(width, height) + .ref(width / 2, height / 2) + .viewbox(0, 0, width, height) + .attr('orient', 'auto') + .update(block) + } + +}) + +SVG.extend(SVG.Line, SVG.Polyline, SVG.Polygon, SVG.Path, { + // Create and attach markers + marker: function(marker, width, height, block) { + var attr = ['marker'] + + // Build attribute name + if (marker != 'all') attr.push(marker) + attr = attr.join('-') + + // Set marker attribute + marker = arguments[1] instanceof SVG.Marker ? + arguments[1] : + this.doc().marker(width, height, block) + + return this.attr(attr, marker) + } + +})
\ No newline at end of file diff --git a/src/pattern.js b/src/pattern.js index e5398d2..76190ef 100755 --- a/src/pattern.js +++ b/src/pattern.js @@ -9,7 +9,7 @@ SVG.Pattern = SVG.invent({ , extend: { // Return the fill id fill: function() { - return 'url(#' + this.attr('id') + ')' + return 'url(#' + this.id() + ')' } // Update pattern by rebuilding , update: function(block) { diff --git a/src/regex.js b/src/regex.js index 433952b..13f62d8 100755 --- a/src/regex.js +++ b/src/regex.js @@ -8,6 +8,9 @@ SVG.regex = { /* parse rgb value */ , rgb: /rgb\((\d+),(\d+),(\d+)\)/ + + /* parse reference id */ +, reference: /#([a-z0-9\-_]+)/i /* test hex value */ , isHex: /^#[a-f0-9]{3,6}$/i diff --git a/src/selector.js b/src/selector.js new file mode 100644 index 0000000..905e9f9 --- /dev/null +++ b/src/selector.js @@ -0,0 +1,5 @@ +// Method for getting an element by id +SVG.get = function(id) { + var node = document.getElementById(idFromReference(id) || id) + if (node) return node.instance +}
\ No newline at end of file @@ -52,6 +52,14 @@ SVG.Set = SVG.invent({ , get: function(i) { return this.members[i] } + // Get first member + , first: function() { + return this.get(0) + } + // Get last member + , last: function() { + return this.get(this.members.length - 1) + } // Default value , valueOf: function() { return this.members @@ -55,12 +55,6 @@ SVG.extend = function() { SVG.Set.inherit() } -// Method for getting an element by id -SVG.get = function(id) { - var node = document.getElementById(id) - if (node) return node.instance -} - // Initialize parsing element SVG.prepare = function(element) { /* select document body and create invisible svg element */ diff --git a/src/symbol.js b/src/symbol.js new file mode 100644 index 0000000..e8907a3 --- /dev/null +++ b/src/symbol.js @@ -0,0 +1,17 @@ + +SVG.Symbol = SVG.invent({ + // Initialize node + create: 'symbol' + + // Inherit from +, inherit: SVG.Container + + // Add parent method +, construct: { + // Create a new symbol + symbol: function() { + return this.defs().put(new SVG.Symbol) + } + } + +})
\ No newline at end of file diff --git a/src/text.js b/src/text.js index 1d05362..1b6bd94 100755 --- a/src/text.js +++ b/src/text.js @@ -217,6 +217,10 @@ SVG.extend(SVG.Text, SVG.TSpan, { return this } + // Get length of text element +, length: function() { + return this.node.getComputedTextLength() + } }) // Register rebuild event |