From 29ea706857e9c217c9d27c48cd16ffadb90a7c13 Mon Sep 17 00:00:00 2001
From: Sean Clark Hess <seanhess@gmail.com>
Date: Tue, 19 Nov 2013 11:10:07 -0700
Subject: [PATCH 1/3] Added svg.js

svg.js comments
---
 svgjs/svgjs.d.ts | 238 +++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 238 insertions(+)
 create mode 100644 svgjs/svgjs.d.ts

diff --git a/svgjs/svgjs.d.ts b/svgjs/svgjs.d.ts
new file mode 100644
index 000000000..379cf6a8f
--- /dev/null
+++ b/svgjs/svgjs.d.ts
@@ -0,0 +1,238 @@
+// Type definitions for svg.js
+// Project: http://www.svgjs.com/
+// Definitions by: Sean Hess <https://seanhess.github.io/>
+// Definitions: https://github.com/borisyankov/DefinitelyTyped
+// Reference: http://documentup.com/wout/svg.js
+
+// TODO sets
+// TODO gradients
+
+declare var SVG:svgjs.Library;
+
+declare module svgjs {
+
+    export interface HTMLElement {
+        instance: Element;
+    }
+
+    export interface Library {
+        (selector:string):Doc;
+        (domElement:HTMLElement):Doc;
+        create(name:string):any;
+        Element:ElementStatic;
+        supported:boolean;
+        get(id:string):Element;
+        extend(parent:Object, obj:Object);
+    }
+
+    export interface Doc extends Parent {
+        svg(data:string);
+        pattern(w:number, h:number, add:(e:Element)=>void);
+        
+        defs():Defs;
+
+        use(element:Element):Element;
+
+        clear();
+
+        mask():Mask;
+
+        // TODO gradients
+    }    
+
+    export interface Element {
+        node:HTMLElement;
+
+        nested():Doc;
+
+        animate(duration?:number, ease?:string, delay?:number):Animation;
+        animate(info:{ease?:string; duration?:number; delay?:number}):Animation;
+
+        attr(name:string, value:any, namespace?:string):Element;
+        attr(obj:Object):Element;
+        attr(name:string):any;
+        viewbox():Viewbox;
+        viewbox(obj:Viewbox):Element;
+        viewbox(x:number, y:number, w:number, h:number):Element;
+
+        move(x:number, y:number, anchor?:boolean):Element;
+        x(x:number, anchor?:boolean):Element;
+        y(y:number, anchor?:boolean):Element;
+        
+        center(x:number, y:number, anchor?:boolean):Element;
+        cx(x:number, anchor?:boolean):Element;
+        cy(y:number, anchor?:boolean):Element;
+
+        size(w:number, h:number, anchor?:boolean):Element;
+
+        show():Element;
+        hide():Element;
+        visible():boolean;
+        remove();
+
+        each(iterator:(i?:number, children?:Element[])=>void, deep?:boolean);
+
+        transform(t:Transform);
+        
+        
+        style(name:string, value:string):Element;
+        style(obj:Object):Element;
+        style(name:string):string;
+        style():string;
+        bbox():BBox;
+        rbox():RBox;
+        doc():Doc;
+        data(name:string):any;
+        data(name:string, value:any):Element;
+        remember(name:string, value:any):Element;
+        remember(obj:Object):Element;
+        remember(name:string):any;
+        forget(...keys:string[]):Element;
+
+        fill(fill:{color?:string; opacity?:number}):Element;
+        fill(color:string):Element;
+        fill(pattern:Element):Element;
+        stroke(data:{color?:string; opacity?:number; width?: number}):Element;
+        stroke(color:string):Element;
+        opacity(o:number):Element;
+        rotate(d:number, cx?:number, cy?:number):Element;
+        skew(x:number, y:number):Element;
+        scale(x:number, y:number):Element;
+        translate(x:number, y:number):Element;
+
+        maskWith(element:Element):Element;
+        masker:Element;
+        unmask():Element;
+
+        clipWith(element:Element):Element;
+        clipper:Element;
+        unclip():Element;
+
+        front():Element;
+        back():Element;
+        forward():Element;
+        backward():Element;
+
+        siblings():Element[];
+        position():number;
+        next():Element;
+        previous():Element;
+        before(element:Element):Element;
+        after(element:Element):Element;
+
+
+        click(cb:Function);
+        on(event:string, cb:Function);
+        off(event:string, cb:Function);
+    }
+
+    export interface Mask extends Element {
+        add(element:Element):Mask;
+    }
+
+    export interface Text extends Element {
+        text(text:string);
+        content:string;
+        font(font:{family?:string; size?:number; anchor?:string; leading?:string});
+        tspan(text:string):Text;
+        path(data:string):Text;
+        plot(data:string):Text;
+        track:Text;
+    }
+
+    export interface ElementStatic extends Parent {
+        new(node:any):Element;
+    }
+
+    export interface Defs extends Element {}
+
+
+    export interface Animation extends Element {
+        stop();
+
+        attr(name:string, value:any, namespace:string):Animation;
+        attr(obj:Object):Animation;
+        attr(name:string):any;
+
+        move(x:number, y:number, anchor?:boolean):Animation;
+        x(x:number, anchor?:boolean):Animation;
+        y(y:number, anchor?:boolean):Animation;
+        
+        center(x:number, y:number, anchor?:boolean):Animation;
+        cx(x:number, anchor?:boolean):Animation;
+        cy(y:number, anchor?:boolean):Animation;
+
+        size(w:number, h:number, anchor?:boolean):Animation;
+        during(cb:(pos:number)=>void):Animation;
+        to(value:number):Animation;
+        after(cb:()=>void):Animation;
+
+        // missing during
+    }
+    
+    export interface Parent extends Element {
+        put(element:Element, i?:number):Element;
+        add(element:Element, i?:number):Parent;
+        children:Element[];
+
+        rect(w:number, h:number):Element;
+        ellipse(w:number, h:number):Element;
+        circle(diameter:number):Element;
+        line(x1:number, y1:number, x2:number, y2:number):Element;
+        polyline(data:string):Element;
+        polyline(points:number[][]):Element;
+        polygon(data:string):Element;
+        polygon(points:number[][]):Element;
+        path(data:string):Element;
+        image(url:string, w:number, h:number):Element;
+        text(text:string):Text;
+        text(adder:(element:Text)=>void):Element;        
+
+        group():Parent;
+    }
+
+    export interface BBox {
+        height:number;
+        width:number;
+        y:number;
+        x:number;
+        cx:number;
+        cy:number;
+        merge(bbox:BBox):BBox;
+    }
+
+    export interface RBox extends BBox {}
+
+    export interface Attributes {
+        (name:string, value:any);
+        (obj:Object);
+        (name:string):any;
+    }
+
+    export interface Viewbox {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+        zoom?: number;
+    }
+
+    export interface Transform {
+        x?: number;
+        y?: number;
+        rotation?: number;
+        cx?: number;
+        cy?: number;
+        scaleX?: number;
+        scaleY?: number;
+        skewX?: number;
+        skewY?: number;
+        matrix?: string; // 1,0,0,1,0,0
+        a?: number; // direct digits of matrix
+        b?: number;
+        c?: number;
+        d?: number;
+        e?: number;
+        f?: number;
+    }
+}
\ No newline at end of file

From 5c4013d4bb54e83f8ab2e2745375fc7eaab88c4a Mon Sep 17 00:00:00 2001
From: Sean Clark Hess <seanhess@gmail.com>
Date: Tue, 19 Nov 2013 16:27:46 -0700
Subject: [PATCH 2/3] svgjs: fixed test errors, other tweaks

---
 svgjs/svgjs.d.ts | 46 +++++++++++++++++++++-------------------------
 1 file changed, 21 insertions(+), 25 deletions(-)

diff --git a/svgjs/svgjs.d.ts b/svgjs/svgjs.d.ts
index 379cf6a8f..a338ae141 100644
--- a/svgjs/svgjs.d.ts
+++ b/svgjs/svgjs.d.ts
@@ -11,7 +11,7 @@ declare var SVG:svgjs.Library;
 
 declare module svgjs {
 
-    export interface HTMLElement {
+    export interface LinkedHTMLElement extends HTMLElement {
         instance: Element;
     }
 
@@ -22,18 +22,18 @@ declare module svgjs {
         Element:ElementStatic;
         supported:boolean;
         get(id:string):Element;
-        extend(parent:Object, obj:Object);
+        extend(parent:Object, obj:Object):void;
     }
 
     export interface Doc extends Parent {
-        svg(data:string);
-        pattern(w:number, h:number, add:(e:Element)=>void);
+        svg(data:string):any;
+        pattern(w:number, h:number, add:(e:Element)=>void):Element;
         
         defs():Defs;
 
         use(element:Element):Element;
 
-        clear();
+        clear():void;
 
         mask():Mask;
 
@@ -41,7 +41,7 @@ declare module svgjs {
     }    
 
     export interface Element {
-        node:HTMLElement;
+        node:LinkedHTMLElement;
 
         nested():Doc;
 
@@ -52,8 +52,8 @@ declare module svgjs {
         attr(obj:Object):Element;
         attr(name:string):any;
         viewbox():Viewbox;
-        viewbox(obj:Viewbox):Element;
         viewbox(x:number, y:number, w:number, h:number):Element;
+        viewbox(obj:Viewbox):Element;
 
         move(x:number, y:number, anchor?:boolean):Element;
         x(x:number, anchor?:boolean):Element;
@@ -68,11 +68,11 @@ declare module svgjs {
         show():Element;
         hide():Element;
         visible():boolean;
-        remove();
+        remove():void;
 
-        each(iterator:(i?:number, children?:Element[])=>void, deep?:boolean);
+        each(iterator:(i?:number, children?:Element[])=>void, deep?:boolean):void;
 
-        transform(t:Transform);
+        transform(t:Transform):Element;
         
         
         style(name:string, value:string):Element;
@@ -121,9 +121,9 @@ declare module svgjs {
         after(element:Element):Element;
 
 
-        click(cb:Function);
-        on(event:string, cb:Function);
-        off(event:string, cb:Function);
+        click(cb:Function):void;
+        on(event:string, cb:Function):void;
+        off(event:string, cb:Function):void;
     }
 
     export interface Mask extends Element {
@@ -131,9 +131,9 @@ declare module svgjs {
     }
 
     export interface Text extends Element {
-        text(text:string);
+        text(text:string):Text;
         content:string;
-        font(font:{family?:string; size?:number; anchor?:string; leading?:string});
+        font(font:{family?:string; size?:number; anchor?:string; leading?:string}):Text;
         tspan(text:string):Text;
         path(data:string):Text;
         plot(data:string):Text;
@@ -147,13 +147,15 @@ declare module svgjs {
     export interface Defs extends Element {}
 
 
-    export interface Animation extends Element {
-        stop();
+    export interface Animation {
+        stop():Animation;
 
-        attr(name:string, value:any, namespace:string):Animation;
+        attr(name:string, value:any, namespace?:string):Animation;
         attr(obj:Object):Animation;
         attr(name:string):any;
 
+        viewbox(x:number, y:number, w:number, h:number):Animation;
+
         move(x:number, y:number, anchor?:boolean):Animation;
         x(x:number, anchor?:boolean):Animation;
         y(y:number, anchor?:boolean):Animation;
@@ -167,7 +169,7 @@ declare module svgjs {
         to(value:number):Animation;
         after(cb:()=>void):Animation;
 
-        // missing during
+        // TODO style, etc, bbox... 
     }
     
     export interface Parent extends Element {
@@ -203,12 +205,6 @@ declare module svgjs {
 
     export interface RBox extends BBox {}
 
-    export interface Attributes {
-        (name:string, value:any);
-        (obj:Object);
-        (name:string):any;
-    }
-
     export interface Viewbox {
         x: number;
         y: number;

From fab5ce721c1cbf26377d3183b1c28a2859c18c65 Mon Sep 17 00:00:00 2001
From: Sean Clark Hess <seanhess@gmail.com>
Date: Wed, 20 Nov 2013 09:20:08 -0700
Subject: [PATCH 3/3] added some tests

---
 svgjs/svgjs-tests.ts | 69 ++++++++++++++++++++++++++++++++++++++++++++
 svgjs/svgjs.d.ts     | 29 +++++++++----------
 2 files changed, 83 insertions(+), 15 deletions(-)
 create mode 100644 svgjs/svgjs-tests.ts

diff --git a/svgjs/svgjs-tests.ts b/svgjs/svgjs-tests.ts
new file mode 100644
index 000000000..845702ac4
--- /dev/null
+++ b/svgjs/svgjs-tests.ts
@@ -0,0 +1,69 @@
+/// <reference path='svgjs.d.ts' />
+/// <reference path='../jquery/jquery.d.ts' />
+ 
+// create svg drawing paper
+
+
+// Example from svgjs.com
+function one() {
+    var draw = SVG('canvas')
+
+    // create image
+    var image = draw.image('images/shade.jpg')
+    image.size(600, 600).y(-150)
+
+    // create text
+    var text = draw.text('SVG.JS').move(300, 0)
+    text.font({
+      family: 'Source Sans Pro'
+    , size: 180
+    , anchor: 'middle'
+    , leading: '1em'
+    })
+
+    // clip image with text
+    image.clipWith(text)    
+}
+
+
+// random one I found online
+function two() {
+    var draw = SVG('paper').size(300, 300)
+    var rect = draw.rect(100, 100).attr({ fill: '#f06' })
+    rect.animate().move(150, 150)
+}
+
+
+// Ripped out of a project. 
+function renderSVG(data:string) {
+
+    var el:JQuery;
+
+    var root = SVG(el.get(0))
+
+    // Load the SVG into a container
+    var div = document.createElement("div")
+    var container = SVG(div) // this creates an SVG tag inside
+    container.svg(data) // this creates an SVG inside the SVG
+    var $inner = $(div).find("svg svg")
+    var inner:svgjs.Element = $inner.get(0).instance
+
+    // Copy in the important attributes
+    root.attr('x', inner.attr('x'))
+    root.attr('y', inner.attr('y'))
+    root.attr('width', inner.attr('width'))
+    root.attr('height', inner.attr('height'))
+    root.viewbox(inner.viewbox())
+
+    // Append the children
+    el.append($inner.children())
+
+    // Activate and Label all child paths
+    var index = 0
+    el.find("rect, path, circle, ellipse").each(function() {
+        var $path = $(this)
+        var path = $path.get(0).instance
+        var uniqueId = "path"+index++
+        path.attr({"path-id": uniqueId})
+    })
+}
\ No newline at end of file
diff --git a/svgjs/svgjs.d.ts b/svgjs/svgjs.d.ts
index a338ae141..6b7a7a6ae 100644
--- a/svgjs/svgjs.d.ts
+++ b/svgjs/svgjs.d.ts
@@ -25,7 +25,7 @@ declare module svgjs {
         extend(parent:Object, obj:Object):void;
     }
 
-    export interface Doc extends Parent {
+    export interface Doc extends Element {
         svg(data:string):any;
         pattern(w:number, h:number, add:(e:Element)=>void):Element;
         
@@ -40,7 +40,7 @@ declare module svgjs {
         // TODO gradients
     }    
 
-    export interface Element {
+    export interface Element extends Text, Parent {
         node:LinkedHTMLElement;
 
         nested():Doc;
@@ -130,14 +130,13 @@ declare module svgjs {
         add(element:Element):Mask;
     }
 
-    export interface Text extends Element {
-        text(text:string):Text;
+    export interface Text {
         content:string;
-        font(font:{family?:string; size?:number; anchor?:string; leading?:string}):Text;
-        tspan(text:string):Text;
-        path(data:string):Text;
-        plot(data:string):Text;
-        track:Text;
+        font(font:{family?:string; size?:number; anchor?:string; leading?:string}):Element;
+        tspan(text:string):Element;
+        path(data:string):Element;
+        plot(data:string):Element;
+        track:Element;
     }
 
     export interface ElementStatic extends Parent {
@@ -172,9 +171,9 @@ declare module svgjs {
         // TODO style, etc, bbox... 
     }
     
-    export interface Parent extends Element {
+    export interface Parent {
         put(element:Element, i?:number):Element;
-        add(element:Element, i?:number):Parent;
+        add(element:Element, i?:number):Element;
         children:Element[];
 
         rect(w:number, h:number):Element;
@@ -186,11 +185,11 @@ declare module svgjs {
         polygon(data:string):Element;
         polygon(points:number[][]):Element;
         path(data:string):Element;
-        image(url:string, w:number, h:number):Element;
-        text(text:string):Text;
-        text(adder:(element:Text)=>void):Element;        
+        image(url:string, w?:number, h?:number):Element;
+        text(text:string):Element;
+        text(adder:(element:Element)=>void):Element;        
 
-        group():Parent;
+        group():Element;
     }
 
     export interface BBox {