aboutsummaryrefslogtreecommitdiff
path: root/js/components
diff options
context:
space:
mode:
authorJose Antonio Marquez2012-07-16 14:50:50 -0700
committerJose Antonio Marquez2012-07-16 14:50:50 -0700
commita402ae19732f7aeb53de27e3f25f72e9c42a453c (patch)
tree50deead3fd1264d70a98e202197b7f282c9af4be /js/components
parentcdaeb7e05e4d59832b9896f6995e0163e3decf50 (diff)
downloadninja-a402ae19732f7aeb53de27e3f25f72e9c42a453c.tar.gz
New: Added switching view functionality to document UI
This now let's you switch between code and design views in all documents opened that support design view. Code view for these documents is currently unsupported, so this is just to hook up the UI to the new methods. Code view will be added next.
Diffstat (limited to 'js/components')
-rwxr-xr-xjs/components/layout/document-bar.reel/document-bar.html8
-rwxr-xr-xjs/components/layout/document-bar.reel/document-bar.js221
2 files changed, 113 insertions, 116 deletions
diff --git a/js/components/layout/document-bar.reel/document-bar.html b/js/components/layout/document-bar.reel/document-bar.html
index 69f8107f..fbd03221 100755
--- a/js/components/layout/document-bar.reel/document-bar.html
+++ b/js/components/layout/document-bar.reel/document-bar.html
@@ -73,7 +73,9 @@ POSSIBILITY OF SUCH DAMAGE.
73 "prototype": "js/components/layout/document-bar.reel", 73 "prototype": "js/components/layout/document-bar.reel",
74 "properties": { 74 "properties": {
75 "element": {"#": "documentBar"}, 75 "element": {"#": "documentBar"},
76 "zoomControl": {"@": "hottext1"} 76 "zoomControl": {"@": "hottext1"},
77 "btnDesign": {"#": "buttonDesign"},
78 "btnCode": {"#": "buttonCode"}
77 } 79 }
78 } 80 }
79 } 81 }
@@ -93,7 +95,7 @@ POSSIBILITY OF SUCH DAMAGE.
93 95
94 </section> 96 </section>
95 97
96 <section> 98 <section data-montage-id="buttonDesign">
97 99
98 <div class="viewicon viewdesign"></div> 100 <div class="viewicon viewdesign"></div>
99 101
@@ -101,7 +103,7 @@ POSSIBILITY OF SUCH DAMAGE.
101 103
102 </section> 104 </section>
103 105
104 <section class="inactive"> 106 <section data-montage-id="buttonCode">
105 107
106 <div class="viewicon viewcode"></div> 108 <div class="viewicon viewcode"></div>
107 109
diff --git a/js/components/layout/document-bar.reel/document-bar.js b/js/components/layout/document-bar.reel/document-bar.js
index 248bc8c4..1a580284 100755
--- a/js/components/layout/document-bar.reel/document-bar.js
+++ b/js/components/layout/document-bar.reel/document-bar.js
@@ -29,140 +29,115 @@ ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
29POSSIBILITY OF SUCH DAMAGE. 29POSSIBILITY OF SUCH DAMAGE.
30</copyright> */ 30</copyright> */
31 31
32var Montage = require("montage/core/core").Montage; 32////////////////////////////////////////////////////////////////////////
33var Component = require("montage/ui/component").Component; 33//
34 34var Montage = require("montage/core/core").Montage,
35 Component = require("montage/ui/component").Component;
36////////////////////////////////////////////////////////////////////////
37//
35exports.DocumentBar = Montage.create(Component, { 38exports.DocumentBar = Montage.create(Component, {
36 39 ////////////////////////////////////////////////////////////////////
37 _currentDocument: { 40 //
38 enumerable: false, 41 _currentDocument: {value: null},
39 value: null 42 ////////////////////////////////////////////////////////////////////
40 }, 43 //
41
42 currentDocument: { 44 currentDocument: {
43 enumerable: false, 45 get: function() {return this._currentDocument;},
44 get: function() {
45 return this._currentDocument;
46 },
47 set: function(value) { 46 set: function(value) {
47 //
48 if (value === this._currentDocument) { 48 if (value === this._currentDocument) {
49 return; 49 return;
50 } 50 }
51 51 //
52 this._currentDocument = value; 52 this._currentDocument = value;
53
54 this.disabled = !this._currentDocument; 53 this.disabled = !this._currentDocument;
55 54 //
56 if(this._currentDocument && this._currentDocument.currentView === "design") { 55 if(this._currentDocument && this._currentDocument.model && this._currentDocument.model.currentView === this._currentDocument.model.views.design) {
57 this.visible = true; 56 this.btnCode.setAttribute('class', 'inactive');
58 } else if(this._currentDocument && this._currentDocument.currentView === "code") { 57 this.btnDesign.removeAttribute('class');
59 this.visible = false; 58 } else if(this._currentDocument && this._currentDocument.model && this._currentDocument.model.currentView === this._currentDocument.model.views.code) {
59 this.btnDesign.setAttribute('class', 'inactive');
60 this.btnCode.removeAttribute('class');
60 } 61 }
62 //
63 this.visible = true;
61 } 64 }
62 }, 65 },
63 66 ////////////////////////////////////////////////////////////////////
67 //
64 _visible: { 68 _visible: {
65 value: false 69 value: false
66 }, 70 },
67 71 ////////////////////////////////////////////////////////////////////
72 //
68 visible: { 73 visible: {
69 get: function() { 74 get: function() {return this._visible;},
70 return this._visible;
71 },
72 set: function(value) { 75 set: function(value) {
76 //
73 if(this._visible !== value) { 77 if(this._visible !== value) {
74 this._visible = value; 78 this._visible = value;
75 this.needsDraw = true; 79 this.needsDraw = true;
76 } 80 }
77 } 81 }
78 }, 82 },
79 83 ////////////////////////////////////////////////////////////////////
80 designView: { 84 //
81 value: null
82 },
83
84 codeView: {
85 value: null
86 },
87
88 zoomControl: { 85 zoomControl: {
89 value: null, 86 value: null,
90 serializable: true 87 serializable: true
91 }, 88 },
92 89 ////////////////////////////////////////////////////////////////////
93 _type: { 90 //
94 value: null
95 },
96
97 type: {
98 enumerable: false,
99 get: function() { return this._type; },
100 set: function(value) {
101 if (this._type === value) {
102 return;
103 }
104
105 this._type = value;
106 this.needsDraw = true;
107
108 }
109 },
110
111 _currentView: {
112 value: null
113 },
114
115 currentView: {
116 get: function() { return this._currentView},
117 set: function(value) {
118 if (this._currentView === value) {
119 return;
120 }
121
122 this._currentView = value;
123 this.needsDraw = true;
124 }
125 },
126
127 _zoomFactor: { 91 _zoomFactor: {
128 value: 100 92 value: 100
129 }, 93 },
130 94 ////////////////////////////////////////////////////////////////////
95 //
131 zoomFactor: { 96 zoomFactor: {
132 get: function() { return this._zoomFactor; }, 97 get: function() {return this._zoomFactor;},
133 98 set: function(value) {
134 set: function(value) 99 if(value !== this._zoomFactor) {
135 { 100 //
136 if(value !== this._zoomFactor)
137 {
138 this._zoomFactor = value; 101 this._zoomFactor = value;
139 if (!this._firstDraw) 102 //
140 { 103 if (!this._firstDraw) {
141 this.application.ninja.stage.setZoom(value); 104 this.application.ninja.stage.setZoom(value);
142 } 105 }
143 } 106 }
144 } 107 }
145 }, 108 },
146 109 ////////////////////////////////////////////////////////////////////
147 draw: { 110 //
111 prepareForDraw: {
148