diff options
| -rw-r--r-- | public/assets/javascripts/defaults.js | 2 | ||||
| -rw-r--r-- | public/assets/javascripts/mx/primitives/mx.text.js | 19 | ||||
| -rw-r--r-- | public/assets/javascripts/rectangles/engine/scenery/types/text.js | 11 | ||||
| -rw-r--r-- | public/assets/javascripts/ui/editor/TextEditor.js | 13 | ||||
| -rwxr-xr-x | public/assets/stylesheets/app.css | 9 |
5 files changed, 44 insertions, 10 deletions
diff --git a/public/assets/javascripts/defaults.js b/public/assets/javascripts/defaults.js index c779233..9ba0b4d 100644 --- a/public/assets/javascripts/defaults.js +++ b/public/assets/javascripts/defaults.js @@ -14,8 +14,6 @@ app.defaults = { } marked.setOptions({ - gfm: true, - breaks: true, sanitize: true, smartypants: true, }) diff --git a/public/assets/javascripts/mx/primitives/mx.text.js b/public/assets/javascripts/mx/primitives/mx.text.js index b4089f3..8db28d0 100644 --- a/public/assets/javascripts/mx/primitives/mx.text.js +++ b/public/assets/javascripts/mx/primitives/mx.text.js @@ -37,11 +37,22 @@ MX.Text = MX.Object3D.extend({ }, load: function(ops){ - if (ops.color) this.el.style.color = ops.color; - if (ops.fontFamily) this.el.style.fontFamily = "'" + ops.fontFamily + "',sans-serif"; - if (ops.fontSize) this.el.style.fontSize = ops.fontSize + "px"; + 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.inner.innerHTML = marked( ops.media.description || "" ) + 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" }, setText: function(text){ diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/text.js b/public/assets/javascripts/rectangles/engine/scenery/types/text.js index 20e9883..a10a332 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/text.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/text.js @@ -7,7 +7,7 @@ Scenery.types.text = Scenery.types.base.extend(function(base){ init: function(opt){ - opt.scale = 1 + opt.scale = 0.5 base.init.call(this, opt) @@ -49,6 +49,15 @@ Scenery.types.text = Scenery.types.base.extend(function(base){ this.media.description = text this.mx.setText( text ) }, + + setFont: function(style){ + for (var i in style) { + if (style.hasOwnProperty(i)) { + this.media.font[i] = style[i] + } + } + this.mx.setFont(this.media.font) + }, serialize: function(){ var data = base.serialize.call(this) diff --git a/public/assets/javascripts/ui/editor/TextEditor.js b/public/assets/javascripts/ui/editor/TextEditor.js index 3d3124b..c867d94 100644 --- a/public/assets/javascripts/ui/editor/TextEditor.js +++ b/public/assets/javascripts/ui/editor/TextEditor.js @@ -30,7 +30,15 @@ var TextEditor = FormView.extend({ this.$el.toggleClass("active", state) if (state) { - Scenery.nextMedia = { type: 'text', width: 300, height: 150 } + Scenery.nextMedia = { + type: 'text', + width: 600, + height: 450, + scale: 0.5, + font: { family: 'Lato', size: 12 }, + align: 'left', + } + this.createMode(true) } }, @@ -101,9 +109,12 @@ var TextEditor = FormView.extend({ }, changeFontFamily: function(){ + this.scenery.setFont({ family: this.$fontFamily.val() }) }, changeFontSize: function(){ + var size = parseInt( this.$fontSize.val() ) + size && this.scenery.setFont({ size: size }) }, changeText: function(e){ diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index 02bbe6a..1c20493 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -4,9 +4,11 @@ margin:0; padding:0; outline:0; - font-family: 'Lato', sans-serif; -webkit-font-smoothing: subpixel-antialiased; } +body,textarea,input { + font-family: 'Lato', sans-serif; +} *, *:before, *:after { moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; @@ -1597,7 +1599,10 @@ input[type="range"]::-webkit-slider-thumb { font-size: 12px; width: 100%; max-height: 200px; - max-width: 180px; +} +#textEditor.settings textarea { + max-height: none; + height: 290px; } .settings input[type="text"]:focus{ |