diff options
Diffstat (limited to 'js/components/layout/document-bar.reel')
3 files changed, 49 insertions, 4 deletions
diff --git a/js/components/layout/document-bar.reel/document-bar.css b/js/components/layout/document-bar.reel/document-bar.css index b86855b7..5eba72e8 100755 --- a/js/components/layout/document-bar.reel/document-bar.css +++ b/js/components/layout/document-bar.reel/document-bar.css | |||
@@ -75,7 +75,7 @@ POSSIBILITY OF SUCH DAMAGE. | |||
75 | padding: 0; | 75 | padding: 0; |
76 | border: none; | 76 | border: none; |
77 | color: #FFF; | 77 | color: #FFF; |
78 | width: 44px; | 78 | width: 46px; |
79 | text-transform: uppercase; | 79 | text-transform: uppercase; |
80 | text-align: left; | 80 | text-align: left; |
81 | float: left; | 81 | float: left; |
@@ -83,6 +83,10 @@ POSSIBILITY OF SUCH DAMAGE. | |||
83 | font-size: 11px; | 83 | font-size: 11px; |
84 | } | 84 | } |
85 | 85 | ||
86 | .preview:focus { | ||
87 | -webkit-box-shadow: none; | ||
88 | } | ||
89 | |||
86 | .documentBar .viewicon { | 90 | .documentBar .viewicon { |
87 | background-repeat: no-repeat; | 91 | background-repeat: no-repeat; |
88 | background-position: center center; | 92 | background-position: center center; |
@@ -98,10 +102,15 @@ POSSIBILITY OF SUCH DAMAGE. | |||
98 | } | 102 | } |
99 | 103 | ||
100 | .documentBar .viewdesign { | 104 | .documentBar .viewdesign { |
101 | background-image: url('../../../../js/panels/Color/colorpanelpopup.reel/img/icon_bitmap.png'); | 105 | background-image: url('../../../../js/panels/color/colorpanelpopup.reel/img/icon_bitmap.png'); |
102 | background-size: 90%; | 106 | background-size: 90%; |
103 | } | 107 | } |
104 | 108 | ||
109 | .documentBar .viewPreview { | ||
110 | background-image: url('../../../../images/optionsbar/edit_mode.png'); | ||
111 | background-size: 100%; | ||
112 | } | ||
113 | |||
105 | .documentBar section.inactive .viewicon{ | 114 | .documentBar section.inactive .viewicon{ |
106 | opacity: .5; | 115 | opacity: .5; |
107 | } | 116 | } |
diff --git a/js/components/layout/document-bar.reel/document-bar.html b/js/components/layout/document-bar.reel/document-bar.html index fbd03221..3e3ac936 100755 --- a/js/components/layout/document-bar.reel/document-bar.html +++ b/js/components/layout/document-bar.reel/document-bar.html | |||
@@ -68,6 +68,15 @@ POSSIBILITY OF SUCH DAMAGE. | |||
68 | "condition": {"<-": "@owner.disabled"} | 68 | "condition": {"<-": "@owner.disabled"} |
69 | } | 69 | } |
70 | }, | 70 | }, |
71 | |||
72 | "menuItemButton": { | ||
73 | "prototype": "montage/ui/native/button.reel", | ||
74 | "properties": { | ||
75 | "element": {"#": "previewButton"}, | ||
76 | "identifier": "preview", | ||
77 | "label": "Preview" | ||
78 | } | ||
79 | }, | ||
71 | 80 | ||
72 | "owner": { | 81 | "owner": { |
73 | "prototype": "js/components/layout/document-bar.reel", | 82 | "prototype": "js/components/layout/document-bar.reel", |
@@ -75,7 +84,8 @@ POSSIBILITY OF SUCH DAMAGE. | |||
75 | "element": {"#": "documentBar"}, | 84 | "element": {"#": "documentBar"}, |
76 | "zoomControl": {"@": "hottext1"}, | 85 | "zoomControl": {"@": "hottext1"}, |
77 | "btnDesign": {"#": "buttonDesign"}, | 86 | "btnDesign": {"#": "buttonDesign"}, |
78 | "btnCode": {"#": "buttonCode"} | 87 | "btnCode": {"#": "buttonCode"}, |
88 | "btnPreview": {"#": "buttonPreview"} | ||
79 | } | 89 | } |
80 | } | 90 | } |
81 | } | 91 | } |
@@ -110,6 +120,14 @@ POSSIBILITY OF SUCH DAMAGE. | |||
110 | <button class="btn_view">Code</button> | 120 | <button class="btn_view">Code</button> |
111 | 121 | ||
112 | </section> | 122 | </section> |
123 | |||
124 | <section data-montage-id="buttonPreview" class="inactive"> | ||
125 | |||
126 | <div class="viewicon viewPreview"></div> | ||
127 | |||
128 | <button data-montage-id="previewButton" class="btn_view preview"></button> | ||
129 | |||
130 | </section> | ||
113 | 131 | ||
114 | <div data-montage-id="disabledCondition" class="panelDisabled"></div> | 132 | <div data-montage-id="disabledCondition" class="panelDisabled"></div> |
115 | 133 | ||
diff --git a/js/components/layout/document-bar.reel/document-bar.js b/js/components/layout/document-bar.reel/document-bar.js index 194b9b23..803d2c3a 100755 --- a/js/components/layout/document-bar.reel/document-bar.js +++ b/js/components/layout/document-bar.reel/document-bar.js | |||
@@ -86,6 +86,17 @@ exports.DocumentBar = Montage.create(Component, { | |||
86 | }, | 86 | }, |
87 | //////////////////////////////////////////////////////////////////// | 87 | //////////////////////////////////////////////////////////////////// |
88 | // | 88 | // |
89 | btnCode: { | ||
90 | value: null | ||
91 | }, | ||
92 | btnDesign: { | ||
93 | value: null | ||
94 | }, | ||
95 | btnPreview: { | ||
96 | value: null | ||
97 | }, | ||
98 | //////////////////////////////////////////////////////////////////// | ||
99 | // | ||
89 | _visible: { | 100 | _visible: { |
90 | value: false | 101 | value: false |
91 | }, | 102 | }, |
@@ -139,6 +150,7 @@ exports.DocumentBar = Montage.create(Component, { | |||
139 | // | 150 | // |
140 | this.btnCode.addEventListener('click', this.showViewCode.bind(this), false); | 151 | this.btnCode.addEventListener('click', this.showViewCode.bind(this), false); |
141 | this.btnDesign.addEventListener('click', this.showViewDesign.bind(this), false); | 152 | this.btnDesign.addEventListener('click', this.showViewDesign.bind(this), false); |
153 | this.btnPreview.addEventListener('click', this, false); | ||
142 | } | 154 | } |
143 | }, | 155 | }, |
144 | //////////////////////////////////////////////////////////////////// | 156 | //////////////////////////////////////////////////////////////////// |
@@ -241,9 +253,15 @@ exports.DocumentBar = Montage.create(Component, { | |||
241 | render(); | 253 | render(); |
242 | } | 254 | } |
243 | } | 255 | } |
256 | }, | ||
257 | |||
258 | handleClick: { | ||
259 | value: function(evt) { | ||
260 | NJevent("executePreview"); | ||
261 | } | ||
244 | } | 262 | } |
245 | //////////////////////////////////////////////////////////////////// | 263 | //////////////////////////////////////////////////////////////////// |
246 | //////////////////////////////////////////////////////////////////// | 264 | //////////////////////////////////////////////////////////////////// |
247 | }); | 265 | }); |
248 | //////////////////////////////////////////////////////////////////////// | 266 | //////////////////////////////////////////////////////////////////////// |
249 | //////////////////////////////////////////////////////////////////////// \ No newline at end of file | 267 | //////////////////////////////////////////////////////////////////////// |