aboutsummaryrefslogtreecommitdiff
path: root/js/components/layout/document-bar.reel
diff options
context:
space:
mode:
authorPierre Frisch2011-12-22 07:25:50 -0800
committerValerio Virgillito2012-01-27 11:18:17 -0800
commitb89a7ee8b956c96a1dcee995ea840feddc5d4b27 (patch)
tree0f3136ab0ecdbbbed6a83576581af0a53124d6f1 /js/components/layout/document-bar.reel
parent2401f05d1f4b94d45e4568b81fc73e67b969d980 (diff)
downloadninja-b89a7ee8b956c96a1dcee995ea840feddc5d4b27.tar.gz
First commit of Ninja to ninja-internal
Signed-off-by: Valerio Virgillito <rmwh84@motorola.com>
Diffstat (limited to 'js/components/layout/document-bar.reel')
-rw-r--r--js/components/layout/document-bar.reel/document-bar.css43
-rw-r--r--js/components/layout/document-bar.reel/document-bar.html58
-rw-r--r--js/components/layout/document-bar.reel/document-bar.js101
3 files changed, 202 insertions, 0 deletions
diff --git a/js/components/layout/document-bar.reel/document-bar.css b/js/components/layout/document-bar.reel/document-bar.css
new file mode 100644
index 00000000..588b8952
--- /dev/null
+++ b/js/components/layout/document-bar.reel/document-bar.css
@@ -0,0 +1,43 @@
1/* <copyright>
2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */
6.documentBar {
7 height: 25px;
8 width: 1000px;
9 position: relative;
10 overflow: hidden;
11 color: white;
12}
13
14.documentBar .active {
15 text-decoration: underline;
16 cursor: pointer;
17 color: #666666;
18}
19
20.documentBar .active:hover {
21 color: #ffffff;
22}
23
24.documentBar .selected {
25 text-decoration: underline;
26 cursor: default;
27 color: #ffffff;
28}
29
30.documentBar .selected {
31 color: #ffffff;
32}
33
34.documentBar span{
35 text-decoration: none;
36 cursor: default;
37 color: #3a3a3a;
38}
39
40.documentBar .zoomHotText span {
41 color: white;
42}
43
diff --git a/js/components/layout/document-bar.reel/document-bar.html b/js/components/layout/document-bar.reel/document-bar.html
new file mode 100644
index 00000000..d58f0d14
--- /dev/null
+++ b/js/components/layout/document-bar.reel/document-bar.html
@@ -0,0 +1,58 @@
1<!DOCTYPE html>
2<!-- <copyright>
3 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
4 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
5 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
6 </copyright> -->
7<html>
8
9<head>
10 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
11 <link rel="stylesheet" type="text/css" href="document-bar.css">
12
13 <script type="text/montage-serialization">
14 {
15 "hottext1": {
16 "module": "js/components/hottextunit.reel",
17 "name": "HotTextUnit",
18 "properties": {
19 "element": {"#": "zoomControlHT"},
20 "minValue":25,
21 "maxValue" :2000,
22 "stepSize" :5,
23 "acceptableUnits" : ["%"],
24 "units" : "%"
25 },
26 "bindings": {
27 "value": {
28 "boundObject": {"@": "owner"},
29 "boundObjectPropertyPath": "zoomFactor",
30 "oneway": false
31 }
32 }
33 },
34
35 "owner": {
36 "module": "js/components/layout/document-bar.reel",
37 "name": "DocumentBar",
38 "properties": {
39 "element": {"#": "documentBar"},
40 "designView": {"#": "design"},
41 "codeView": {"#": "code"},
42 "zoomControl": {"@": "hottext1"}
43 }
44 }
45 }
46 </script>
47
48
49</head>
50
51<body>
52 <div id="documentBar">
53 <input class="zoomHotText label" id="zoomControlHT"/>
54 <span class="design-view" id="design">Design View</span>
55 <span class="code-view" id="code">Code View</span>
56 </div>
57</body>
58</html> \ No newline at end of file
diff --git a/js/components/layout/document-bar.reel/document-bar.js b/js/components/layout/document-bar.reel/document-bar.js
new file mode 100644
index 00000000..3eece273
--- /dev/null
+++ b/js/components/layout/document-bar.reel/document-bar.js
@@ -0,0 +1,101 @@
1/* <copyright>
2This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5</copyright> */
6
7var Montage = require("montage/core/core").Montage;
8var Component = require("montage/ui/component").Component;
9
10exports.DocumentBar = Montage.create(Component, {
11
12 designView: { value: null, enumerable: false},
13 codeView: { value: null, enumerable: false},
14 zoomControl: { value: null, enumerable: false },
15 _type: { enumerable: false, value: null },
16
17 type: {
18 enumerable: false,
19 get: function() { return this._type; },
20 set: function(value) {
21 if (this._type === value) {
22 return;
23 }
24
25 this._type = value;
26 this.needsDraw = true;
27
28 }
29 },
30
31 _currentView: { value: null, enumerable: false },
32
33 currentView: {
34 get: function() { return this._currentView},
35 set: function(value) {
36 if (this._currentView === value) {
37 return;
38 }
39
40 this._currentView = value;
41 this.needsDraw = true;
42 }
43 },
44
45 _zoomFactor: { value: 100, enumerable: false },
46
47 zoomFactor: {
48 get: function() { return this._zoomFactor; },
49
50 set: function(value)
51 {
52 if(value !== this._zoomFactor)
53 {
54 this._zoomFactor = value;
55 if (!this._firstDraw)
56 {
57 var viewUtils = this.application.ninja.stage.viewUtils;
58 this.application.ninja.stage.setZoom(value);
59 }
60 }
61 }
62 },
63
64 draw: {
65 value: function() {
66 if(this.type === "htm" || this.type === "html") {
67 this.designView.classList.add("active");
68 this.codeView.classList.add("active");
69
70 if(this.currentView === "design") {
71 this.designView.classList.add("selected");
72 if(this.codeView.classList.contains("selected")) this.codeView.classList.toggle("selected");
73 } else {
74 this.codeView.classList.add("selected");
75 if(this.designView.classList.contains("selected")) this.designView.classList.toggle("selected");
76 }
77
78 } else if(this.type) {
79 this.designView.classList.remove("active");
80 }
81
82 }
83 },
84
85 prepareForDraw: {
86 value: function() {
87 this.designView.addEventListener("click", this, false);
88 this.codeView.addEventListener("click", this, false);
89
90 }
91 },
92
93 handleClick: {
94 value: function(event) {
95 if(event._event.target.id === this.currentView) return;
96
97 this.currentView = event._event.target.id;
98 documentManagerModule.DocumentManager.switchViews();
99 }
100 }
101});