text align

3 files changed, 18 insertions, 8 deletions

diff --git a/public/assets/javascripts/mx/primitives/mx.text.js b/public/assets/javascripts/mx/primitives/mx.text.js
index 8db28d0..1d975ec 100644
--- a/public/assets/javascripts/mx/primitives/mx.text.js
+++ b/public/assets/javascripts/mx/primitives/mx.text.js
@@ -40,19 +40,14 @@ MX.Text = MX.Object3D.extend({
     var media = ops.media
     if (media.color) this.el.style.color = media.color;
     if (media.font) this.setFont(media.font)
-    if (media.align) this.setAlign(media.align)
 
     this.setText( media.description )
   },
   
-  setAlign: function(align) {
-    this.el.style.textAlign = "align"
-  },
-    
   setFont: function(font){
-    console.log(font)
     this.inner.style.fontFamily = "'" + font.family + "',sans-serif"
     this.el.style.fontSize = (2 * font.size) + "pt"
+    this.el.style.textAlign = font.align
   },
   
   setText: function(text){
diff --git a/public/assets/javascripts/ui/editor/TextEditor.js b/public/assets/javascripts/ui/editor/TextEditor.js
index c867d94..1e35c12 100644
--- a/public/assets/javascripts/ui/editor/TextEditor.js
+++ b/public/assets/javascripts/ui/editor/TextEditor.js
@@ -10,6 +10,7 @@ var TextEditor = FormView.extend({
 		"mousedown": "stopPropagation",
 		"change [name=font-family]": 'changeFontFamily',
 		"change [name=font-size]": 'changeFontSize',
+		"change [name=text-align]": 'changeTextAlign',
 		"input [name=text-body]": 'changeText',
 		"click [data-role=destroy-text]": "destroy",
 	},
@@ -23,6 +24,7 @@ var TextEditor = FormView.extend({
     this.$fontFamily = this.$("[name=font-family]")
     this.$fontSize = this.$("[name=font-size]")
     this.$textBody = this.$("[name=text-body]")
+    this.$textAlign = this.$("[name=text-align]")
 	},
 
   toggle: function(state){
@@ -35,8 +37,7 @@ var TextEditor = FormView.extend({
         width: 600,
         height: 450,
         scale: 0.5,
-        font: { family: 'Lato', size: 12 },
-        align: 'left',
+        font: { family: 'Lato', size: 12, align: 'left' },
       }
       
       this.createMode(true)
@@ -94,6 +95,10 @@ var TextEditor = FormView.extend({
 		this.bind(scenery)
 		this.$el.toggleClass("active", true)
 		this.$textBody.val( this.scenery.media.description )
+		
+		this.$fontFamily.val( this.scenery.media.font.family )
+		this.$fontSize.val( this.scenery.media.font.size )
+		this.$textAlign.val( this.scenery.media.font.align )
 
     this.createMode(false)
 
@@ -111,6 +116,10 @@ var TextEditor = FormView.extend({
   changeFontFamily: function(){
     this.scenery.setFont({ family: this.$fontFamily.val() })
   },
+
+  changeTextAlign: function(){
+    this.scenery.setFont({ align: this.$textAlign.val() })
+  },
   
   changeFontSize: function(){
     var size = parseInt( this.$fontSize.val() )
diff --git a/views/controls/editor/text-editor.ejs b/views/controls/editor/text-editor.ejs
index a14c469..3a367d5 100644
--- a/views/controls/editor/text-editor.ejs
+++ b/views/controls/editor/text-editor.ejs
@@ -21,6 +21,12 @@
       <option value="36">36pt</option>
       <option value="72">72pt</option>
     </select>
+    <select name="text-align">
+      <option value="left">Left</option>
+      <option value="center">Center</option>
+      <option value="right">Right</option>
+      <option value="justify">Justify</option>
+    </select>
   </div>
   
 	<div class="setting">