diff options
Diffstat (limited to 'js/stage/stage.reel')
-rwxr-xr-x | js/stage/stage.reel/stage.css | 3 | ||||
-rwxr-xr-x | js/stage/stage.reel/stage.html | 12 | ||||
-rwxr-xr-x | js/stage/stage.reel/stage.js | 12 |
3 files changed, 20 insertions, 7 deletions
diff --git a/js/stage/stage.reel/stage.css b/js/stage/stage.reel/stage.css index 2271cd8a..2c2e30d3 100755 --- a/js/stage/stage.reel/stage.css +++ b/js/stage/stage.reel/stage.css | |||
@@ -14,6 +14,8 @@ | |||
14 | 14 | ||
15 | .montage-editor-container { | 15 | .montage-editor-container { |
16 | z-index: 8; | 16 | z-index: 8; |
17 | display: none; | ||
18 | position: absolute; | ||
17 | } | 19 | } |
18 | 20 | ||
19 | .stageAndScenesContainer .montage-editor { | 21 | .stageAndScenesContainer .montage-editor { |
@@ -64,3 +66,4 @@ div.CodeMirror span.CodeMirror-matchingbracket {color: #000 !important;backgroun | |||
64 | .cm-s-rubyblue .activeline {background: #3E7087; !important} | 66 | .cm-s-rubyblue .activeline {background: #3E7087; !important} |
65 | .cm-s-lesser-dark .activeline {background: #8da6ce; !important} | 67 | .cm-s-lesser-dark .activeline {background: #8da6ce; !important} |
66 | .cm-s-xq-dark .activeline {background: #8da6ce; !important} | 68 | .cm-s-xq-dark .activeline {background: #8da6ce; !important} |
69 | |||
diff --git a/js/stage/stage.reel/stage.html b/js/stage/stage.reel/stage.html index 2ed596f3..215f8f2e 100755 --- a/js/stage/stage.reel/stage.html +++ b/js/stage/stage.reel/stage.html | |||
@@ -40,7 +40,13 @@ | |||
40 | "focusManager": { | 40 | "focusManager": { |
41 | "object": "js/components/focus-manager.reel" | 41 | "object": "js/components/focus-manager.reel" |
42 | }, | 42 | }, |
43 | 43 | ||
44 | "bindingView": { | ||
45 | "prototype": "js/stage/binding-view.reel", | ||
46 | "properties" : { | ||
47 | "element": {"#": "bindingView" } | ||
48 | } | ||
49 | }, | ||
44 | "owner": { | 50 | "owner": { |
45 | "prototype": "js/stage/stage.reel", | 51 | "prototype": "js/stage/stage.reel", |
46 | "properties": { | 52 | "properties": { |
@@ -53,7 +59,8 @@ | |||
53 | "stageDeps": {"@": "stageDeps"}, | 59 | "stageDeps": {"@": "stageDeps"}, |
54 | "layout": {"@": "layout"}, | 60 | "layout": {"@": "layout"}, |
55 | "textTool": {"@": "textTool"}, | 61 | "textTool": {"@": "textTool"}, |
56 | "focusManager": {"@": "focusManager"} | 62 | "focusManager": {"@": "focusManager"}, |
63 | "bindingView": {"@": "bindingView"} | ||
57 | }, | 64 | }, |
58 | "bindings": { | 65 | "bindings": { |
59 | "currentDocumentStageView": { | 66 | "currentDocumentStageView": { |
@@ -77,6 +84,7 @@ | |||
77 | <canvas data-montage-id="layoutCanvas" class="layoutCanvas"></canvas> | 84 | <canvas data-montage-id="layoutCanvas" class="layoutCanvas"></canvas> |
78 | <canvas data-montage-id="stageCanvas" class="stageCanvas"></canvas> | 85 | <canvas data-montage-id="stageCanvas" class="stageCanvas"></canvas> |
79 | <canvas data-montage-id="drawingCanvas" class="drawingCanvas"></canvas> | 86 | <canvas data-montage-id="drawingCanvas" class="drawingCanvas"></canvas> |
87 | <section data-montage-id="bindingView"></section> | ||
80 | </section> | 88 | </section> |
81 | 89 | ||
82 | </body> | 90 | </body> |
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index fce73882..33c4fd22 100755 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js | |||
@@ -26,6 +26,9 @@ exports.Stage = Montage.create(Component, { | |||
26 | _canvasSelectionPrefs: { value: { "thickness" : 1.0, "color" : "#46a1ff" } }, | 26 | _canvasSelectionPrefs: { value: { "thickness" : 1.0, "color" : "#46a1ff" } }, |
27 | _canvasDrawingPrefs: { value: { "thickness" : 1.0, "color" : "#000" } }, | 27 | _canvasDrawingPrefs: { value: { "thickness" : 1.0, "color" : "#000" } }, |
28 | drawingContextPreferences: { get: function() { return this._canvasDrawingPrefs; } }, | 28 | drawingContextPreferences: { get: function() { return this._canvasDrawingPrefs; } }, |
29 | bindingView: { | ||
30 | value: null | ||
31 | }, | ||
29 | 32 | ||
30 | _iframeContainer: { | 33 | _iframeContainer: { |
31 | value: null, | 34 | value: null, |
@@ -305,9 +308,8 @@ exports.Stage = Montage.create(Component, { | |||
305 | value: function() { | 308 | value: function() { |
306 | if(this.resizeCanvases) { | 309 | if(this.resizeCanvases) { |
307 | // TODO GET THE SCROLL SIZE FROM THE CSS -- 11 px | 310 | // TODO GET THE SCROLL SIZE FROM THE CSS -- 11 px |
308 | this._canvas.width = this._layoutCanvas.width = this._drawingCanvas.width = this._gridCanvas.width = this.element.offsetWidth - 11 ; | 311 | this._canvas.width = this._layoutCanvas.width = this._drawingCanvas.width = this._gridCanvas.width = this.bindingView.width = this.element.offsetWidth - 11; |
309 | this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this._gridCanvas.height = this.element.offsetHeight - 11;// - 26 - 26; | 312 | this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this._gridCanvas.height = this.bindingView.height = this.element.offsetHeight - 11;// - 26 - 26; |
310 | |||
311 | // Hack for now until a full component | 313 | // Hack for now until a full component |
312 | this.layout.draw(); | 314 | this.layout.draw(); |
313 | if(this.currentDocument && (this.currentDocument.currentView === "design")) { | 315 | if(this.currentDocument && (this.currentDocument.currentView === "design")) { |
@@ -386,8 +388,8 @@ exports.Stage = Montage.create(Component, { | |||
386 | } | 388 | } |
387 | 389 | ||
388 | // Recalculate the canvas sizes because of splitter resizing | 390 | // Recalculate the canvas sizes because of splitter resizing |
389 | this._canvas.width = this._layoutCanvas.width = this._drawingCanvas.width = this._gridCanvas.width = this.element.offsetWidth - 11 ; | 391 | this._canvas.width = this._layoutCanvas.width = this._drawingCanvas.width = this._gridCanvas.width = this.bindingView.width = this.element.offsetWidth - 11 ; |
390 | this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this._gridCanvas.height = this.element.offsetHeight - 11; | 392 | this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this._gridCanvas.height = this.bindingView.height = this.element.offsetHeight - 11; |
391 | 393 | ||
392 | designView.iframe.contentWindow.addEventListener("scroll", this, false); | 394 | designView.iframe.contentWindow.addEventListener("scroll", this, false); |
393 | 395 | ||