diff --git a/components/Std/Makefile b/components/Std/Makefile index f515882..28aaf05 100644 --- a/components/Std/Makefile +++ b/components/Std/Makefile @@ -1,5 +1,5 @@ OutputName=stdLib -SourceFiles=src/justAnExample.ts +SourceFiles=src/justAnExample.ts src/Text.ts src/colors.ts src/position.ts BaseDir=../.. OutputDir=$(BaseDir)/js @@ -8,7 +8,7 @@ Out=$(OutputDir)/$(OutputName).js all: $(Out) $(Out): lib.ts $(SourceFiles) - tsc --removeComments --declaration --sourceMap --out $@ lib.ts + tsc --removeComments --target es5 --declaration --sourceMap --out $@ lib.ts sed -i "/\/\/\/\ * +/// +/// +/// +/// +/// + module Sanara.Std { - export var dictionary : Sanara.Core.Dictionary = (function() { - var entries = []; - // - entries.push(Sanara.Std.Circle); - entries.push(Sanara.Std.Bitree); - entries.push(Sanara.Std.FillColor); - // - return new Sanara.Core.Dictionary(entries); - })(); + export var dictionary : Core.Dictionary = new Sanara.Core.Dictionary([ + Circle, + Bitree, + Text, + Background, + FillColor + ]); } diff --git a/components/Std/src/Text.ts b/components/Std/src/Text.ts new file mode 100644 index 0000000..703b68a --- /dev/null +++ b/components/Std/src/Text.ts @@ -0,0 +1,59 @@ +/// + +module Sanara.Std { + export class Text extends Sanara.Core.Fragment { + + private static TEST_CONTEXT = document.createElement("canvas").getContext("2d"); + + private font : string; // SIZEpx FONT_FAMITY_NAME eg. 18px serif + + private myText; + + constructor (children, parameters : Sanara.Core.Value[]) { + if(parameters.length < 1) { + throw Sanara.Core.Exception.FEW_PARAMETERS; + } + this.font = parameters[0].toString(); + + this.myText = ""; + + super(null,null,[ + {name:"width", value:this.calcWidth()}, + {name:"height", value:this.calcHeight()} + ]); + } + + get text() : string { + return this.myText; + } + set text(newText) { + this.myText = newText; + this.setPropertyValue("width",this.calcWidth()); + this.setPropertyValue("height",this.calcHeight()); + } + + private calcHeight() { + if(this.text.length === 0) return Sanara.Core.Value.ZERO; + + return new Sanara.Core.Value(parseInt(this.font)); + } + + private calcWidth() { + if(this.text.length === 0) return Sanara.Core.Value.ZERO; + + var w = 0; + Text.TEST_CONTEXT.save(); { + Text.TEST_CONTEXT.font = this.font; + w = Text.TEST_CONTEXT.measureText(this.text).width; + }; Text.TEST_CONTEXT.restore(); + return new Sanara.Core.Value(w); + } + + paintImplementation(context : Sanara.Core.SanaraContext) { + context.font = this.font; + context.textAlign = 'left' + context.textBaseline = 'top' + context.fillText(this.text,0,0); + } + } +} diff --git a/components/Std/src/colors.ts b/components/Std/src/colors.ts new file mode 100644 index 0000000..222789d --- /dev/null +++ b/components/Std/src/colors.ts @@ -0,0 +1,109 @@ +/// + + + +module Sanara.Std { + export class Background extends Sanara.Core.Fragment { + static doc:Sanara.Core.FragmentClassDoc = { + name: "background", + discription: "Adds background to child", + children : [ + { + name : "frontground", + discription : "fragment that will have background" + } + ], + parameters : [ + { + name: "color", + discription : "Background color. e.g. \"#f3422e\"" + } + ] + } + + private color : Sanara.Core.Value; + private child : Sanara.Core.Fragment; + + constructor(children:Sanara.Core.Fragment[], parameters: Sanara.Core.Value[]) { + if(children.length < 1) { + throw Sanara.Core.Exception.FEW_CHILDREN; + } + if(parameters.length < 1) { + throw Sanara.Core.Exception.FEW_PARAMETERS; + } + this.color = parameters[0]; + this.child = children[0]; + + super(null,null,[ + {name:"width",value:this.calcWidth()}, + {name:"height",value:this.calcHeight()} + ]); + } + + private calcWidth() { + return this.child.getPropertyValue("width"); + } + + private calcHeight() { + return this.child.getPropertyValue("height"); + } + + paintImplementation(context: Sanara.Core.SanaraContext) { + context.save(); { + context.fillStyle = this.color.toColor(); + context.fillRect(0,0,this.child.width(), this.child.height()); + }; context.restore(); + this.child.paint(context); + } + } + export class FillColor extends Sanara.Core.Fragment { + static doc:Sanara.Core.FragmentClassDoc = { + name: "fill-color", + discription: "Changes fill color for child environment", + children : [ + { + name : "colored", + discription : "fragment that will recieve new fill color" + } + ], + parameters : [ + { + name: "color", + discription : "New color. e.g. \"#f3422e\"" + } + ] + } + + private color : Sanara.Core.Value; + private child : Sanara.Core.Fragment; + + constructor(children:Sanara.Core.Fragment[], parameters: Sanara.Core.Value[]) { + if(children.length < 1) { + throw Sanara.Core.Exception.FEW_CHILDREN; + } + if(parameters.length < 1) { + throw Sanara.Core.Exception.FEW_PARAMETERS; + } + this.color = parameters[0]; + this.child = children[0]; + + super(null,null,[ + {name:"width",value:this.calcWidth()}, + {name:"height",value:this.calcHeight()} + ]); + } + + private calcWidth() { + return this.child.getPropertyValue("width"); + } + + private calcHeight() { + return this.child.getPropertyValue("height"); + } + + paintImplementation(context: Sanara.Core.SanaraContext) { + context.fillStyle = this.color.toColor(); + this.child.paint(context); + } + } +} diff --git a/components/Std/src/justAnExample.ts b/components/Std/src/justAnExample.ts index 138a096..5d7a537 100644 --- a/components/Std/src/justAnExample.ts +++ b/components/Std/src/justAnExample.ts @@ -103,54 +103,4 @@ module Sanara.Std { context.fill(); } } - export class FillColor extends Sanara.Core.Fragment { - static doc:Sanara.Core.FragmentClassDoc = { - name: "fill-color", - discription: "Changes fill color for child environment", - children : [ - { - name : "colored", - discription : "fragment that will recieve new fill color" - } - ], - parameters : [ - { - name: "color", - discription : "New color. e.g. \"#f3422e\"" - } - ] - } - - private color : Sanara.Core.Value; - private child : Sanara.Core.Fragment; - - constructor(children:Sanara.Core.Fragment[], parameters: Sanara.Core.Value[]) { - if(children.length < 1) { - throw Sanara.Core.Exception.FEW_CHILDREN; - } - if(parameters.length < 1) { - throw Sanara.Core.Exception.FEW_PARAMETERS; - } - this.color = parameters[0]; - this.child = children[0]; - - super(null,null,[ - {name:"width",value:this.calcWidth()}, - {name:"height",value:this.calcHeight()} - ]); - } - - private calcWidth() { - return this.child.getPropertyValue("width"); - } - - private calcHeight() { - return this.child.getPropertyValue("height"); - } - - paintImplementation(context: Sanara.Core.SanaraContext) { - context.fillStyle = this.color.toColor(); - this.child.paint(context); - } - } } diff --git a/components/Std/src/position.ts b/components/Std/src/position.ts new file mode 100644 index 0000000..4c1ab12 --- /dev/null +++ b/components/Std/src/position.ts @@ -0,0 +1,60 @@ + +/// + +module Sanara.Std { + export class Translate extends Sanara.Core.Fragment { + static doc:Sanara.Core.FragmentClassDoc = { + name : "translate", + discription : "Translate a fragment", + parameters : [ + { + name: "dx", + discription : "translate x" + }, + { + name: "dy", + discription : "translate y" + } + ], + children : [ + { + name: "translated", + discription : "fragment to be translated", + } + ] + } + + private child : Sanara.Core.Fragment; + private dx : Sanara.Core.Value; + private dy : Sanara.Core.Value; + + constructor(children : Sanara.Core.Fragment[] , parameters : Sanara.Core.Value[]) { + if(children.length < 1) { + throw Sanara.Core.Exception.FEW_CHILDREN; + } + if(parameters.length < 2) { + throw Sanara.Core.Exception.FEW_PARAMETERS; + } + this.dx = parameters[0]; + this.dy = parameters[1]; + this.child = children[0]; + + super(null,null,[ + {name:"width",value:this.calcWidth()}, + {name:"height",value:this.calcHeight()} + ]); + } + + private calcWidth() : Sanara.Core.Value { + return new Sanara.Core.Value(this.dx.toNumber() + this.child.width()); + } + private calcHeight() : Sanara.Core.Value { + return new Sanara.Core.Value(this.dy.toNumber() + this.child.height()); + } + + paintImplementation(context : Sanara.Core.SanaraContext) { + context.translate(this.dx.toNumber(), this.dy.toNumber()); + this.child.paint(context); + } + } +} diff --git a/components/Std/tsconfig.json b/components/Std/tsconfig.json index f972429..e92a773 100644 --- a/components/Std/tsconfig.json +++ b/components/Std/tsconfig.json @@ -11,6 +11,9 @@ "files": [ "./declareFiles/coreLib.d.ts", "./lib.ts", - "./src/justAnExample.ts" + "./src/Text.ts", + "./src/colors.ts", + "./src/justAnExample.ts", + "./src/position.ts" ] } diff --git a/components/declareFiles/coreLib.d.ts b/components/declareFiles/coreLib.d.ts index 0b24ce8..c105dda 100644 --- a/components/declareFiles/coreLib.d.ts +++ b/components/declareFiles/coreLib.d.ts @@ -12,7 +12,6 @@ declare module Sanara.Core { interface Paper { domElement: HTMLCanvasElement; context: SanaraContext; - root: Fragment; repaint(time: number): void; } class BasicPaper implements Paper { diff --git a/components/declareFiles/stdLib.d.ts b/components/declareFiles/stdLib.d.ts index 396fd94..e74ac56 100644 --- a/components/declareFiles/stdLib.d.ts +++ b/components/declareFiles/stdLib.d.ts @@ -16,6 +16,29 @@ declare module Sanara.Std { constructor(); paintImplementation(context: Sanara.Core.SanaraContext): void; } +} +declare module Sanara.Std { + class Text extends Sanara.Core.Fragment { + private static TEST_CONTEXT; + private font; + private myText; + constructor(children: any, parameters: Sanara.Core.Value[]); + text: string; + private calcHeight(); + private calcWidth(); + paintImplementation(context: Sanara.Core.SanaraContext): void; + } +} +declare module Sanara.Std { + class Background extends Sanara.Core.Fragment { + static doc: Sanara.Core.FragmentClassDoc; + private color; + private child; + constructor(children: Sanara.Core.Fragment[], parameters: Sanara.Core.Value[]); + private calcWidth(); + private calcHeight(); + paintImplementation(context: Sanara.Core.SanaraContext): void; + } class FillColor extends Sanara.Core.Fragment { static doc: Sanara.Core.FragmentClassDoc; private color; @@ -27,5 +50,17 @@ declare module Sanara.Std { } } declare module Sanara.Std { - var dictionary: Sanara.Core.Dictionary; + class Translate extends Sanara.Core.Fragment { + static doc: Sanara.Core.FragmentClassDoc; + private child; + private dx; + private dy; + constructor(children: Sanara.Core.Fragment[], parameters: Sanara.Core.Value[]); + private calcWidth(); + private calcHeight(); + paintImplementation(context: Sanara.Core.SanaraContext): void; + } +} +declare module Sanara.Std { + var dictionary: Core.Dictionary; }