diff options
Diffstat (limited to 'js/components/ui')
7 files changed, 53 insertions, 9 deletions
diff --git a/js/components/ui/color-chip.reel/color-chip.js b/js/components/ui/color-chip.reel/color-chip.js index 7a7411da..4e64b2e8 100755 --- a/js/components/ui/color-chip.reel/color-chip.js +++ b/js/components/ui/color-chip.reel/color-chip.js | |||
@@ -56,6 +56,8 @@ var ColorChip = exports.ColorChip = Montage.create(Component, { | |||
56 | if(this.hasIcon) { | 56 | if(this.hasIcon) { |
57 | var icon = this.iconType || this.mode + "Icon"; | 57 | var icon = this.iconType || this.mode + "Icon"; |
58 | this.application.ninja.colorController.addButton(icon, this.icon); | 58 | this.application.ninja.colorController.addButton(icon, this.icon); |
59 | } else { | ||
60 | this.icon.style.display = "none"; | ||
59 | } | 61 | } |
60 | 62 | ||
61 | this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, offset: this.offset}; | 63 | this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, offset: this.offset}; |
diff --git a/js/components/ui/icon-list-basic/icon.reel/icon.css b/js/components/ui/icon-list-basic/icon.reel/icon.css index 9fb180d2..203db65c 100644 --- a/js/components/ui/icon-list-basic/icon.reel/icon.css +++ b/js/components/ui/icon-list-basic/icon.reel/icon.css | |||
@@ -35,7 +35,7 @@ | |||
35 | 35 | ||
36 | .icon .iconLabel{ | 36 | .icon .iconLabel{ |
37 | margin-top:8px; | 37 | margin-top:8px; |
38 | white-space: nowrap; | 38 | white-space: pre; |
39 | text-overflow: ellipsis; | 39 | text-overflow: ellipsis; |
40 | line-height:15px; | 40 | line-height:15px; |
41 | overflow: hidden; | 41 | overflow: hidden; |
diff --git a/js/components/ui/icon-list-basic/icon.reel/icon.js b/js/components/ui/icon-list-basic/icon.reel/icon.js index 1ef6e277..7d36bc59 100755 --- a/js/components/ui/icon-list-basic/icon.reel/icon.js +++ b/js/components/ui/icon-list-basic/icon.reel/icon.js | |||
@@ -86,7 +86,7 @@ var Icon = exports.Icon = Montage.create(Component, { | |||
86 | this.metadata = "Name: "+this.icondata.name; | 86 | this.metadata = "Name: "+this.icondata.name; |
87 | } | 87 | } |
88 | this.metadata = this.metadata + "<br />" + "Type: "+this.icondata.type; | 88 | this.metadata = this.metadata + "<br />" + "Type: "+this.icondata.type; |
89 | if(this.icondata.size){this.metadata = this.metadata + "<br />" + "Size: "+this.icondata.size;} | 89 | if(this.icondata.size){this.metadata = this.metadata + "<br />" + "Size: "+this.icondata.size+ " bytes";} |
90 | if(this.icondata.creationDate){this.metadata = this.metadata + "<br />" + "Creation date: "+ this.formatTimestamp(this.icondata.creationDate);} | 90 | if(this.icondata.creationDate){this.metadata = this.metadata + "<br />" + "Creation date: "+ this.formatTimestamp(this.icondata.creationDate);} |
91 | if(this.icondata.modifiedDate){this.metadata = this.metadata + "<br />" + "Modified date: "+ this.formatTimestamp(this.icondata.modifiedDate);} | 91 | if(this.icondata.modifiedDate){this.metadata = this.metadata + "<br />" + "Modified date: "+ this.formatTimestamp(this.icondata.modifiedDate);} |
92 | 92 | ||
diff --git a/js/components/ui/input-group.reel/input-group.css b/js/components/ui/input-group.reel/input-group.css index 0b7cd1ef..5707b17e 100755 --- a/js/components/ui/input-group.reel/input-group.css +++ b/js/components/ui/input-group.reel/input-group.css | |||
@@ -23,11 +23,24 @@ | |||
23 | 23 | ||
24 | .propControl .inputRow div .hottext, | 24 | .propControl .inputRow div .hottext, |
25 | .propControl .inputRow div .hottextInput, | 25 | .propControl .inputRow div .hottextInput, |
26 | .prop-controller .nj-skinned | 26 | .prop-controller .nj-skinned, |
27 | .prop-controller .hottext, | ||
28 | .prop-controller .hottextInput | ||
27 | { | 29 | { |
28 | border: 1px solid black; | 30 | border: 1px solid black; |
29 | width: 30px !important; | 31 | width: 30px !important; |
30 | float:left; | 32 | float:left; |
31 | margin: 2px 0; | 33 | margin: 2px 0; |
32 | text-align: center; | 34 | text-align: center; |
35 | } | ||
36 | |||
37 | .prop-controller .file-path | ||
38 | { | ||
39 | width: 170px !important; | ||
40 | } | ||
41 | |||
42 | .propControl .inputRow div.propControl | ||
43 | { | ||
44 | float:left; | ||
45 | margin: 2px 0; | ||
33 | } \ No newline at end of file | 46 | } \ No newline at end of file |
diff --git a/js/components/ui/property-control.reel/property-control.js b/js/components/ui/property-control.reel/property-control.js index 58b1be9f..cd59c02c 100755 --- a/js/components/ui/property-control.reel/property-control.js +++ b/js/components/ui/property-control.reel/property-control.js | |||
@@ -9,7 +9,7 @@ var Montage = require("montage/core/core").Montage, | |||
9 | HotText = require("js/components/hottext.reel").HotText, | 9 | HotText = require("js/components/hottext.reel").HotText, |
10 | HotTextUnit = require("js/components/hottextunit.reel").HotTextUnit, | 10 | HotTextUnit = require("js/components/hottextunit.reel").HotTextUnit, |
11 | Slider = require("js/components/slider.reel").Slider, | 11 | Slider = require("js/components/slider.reel").Slider, |
12 | Button = require("js/components/button.reel").Button, | 12 | Button = require("montage/ui/button.reel").Button, |
13 | Checkbox = require("js/components/checkbox.reel").Checkbox, | 13 | Checkbox = require("js/components/checkbox.reel").Checkbox, |
14 | Combobox = require("js/components/combobox.reel").Combobox, | 14 | Combobox = require("js/components/combobox.reel").Combobox, |
15 | TextField = require("js/components/TextField.reel").TextField, | 15 | TextField = require("js/components/TextField.reel").TextField, |
diff --git a/js/components/ui/tree-basic/treeItem.reel/treeItem.css b/js/components/ui/tree-basic/treeItem.reel/treeItem.css index f8e67541..d33404e7 100755 --- a/js/components/ui/tree-basic/treeItem.reel/treeItem.css +++ b/js/components/ui/tree-basic/treeItem.reel/treeItem.css | |||
@@ -29,7 +29,7 @@ | |||
29 | } | 29 | } |
30 | 30 | ||
31 | .atreeItem .name{ | 31 | .atreeItem .name{ |
32 | white-space: nowrap; | 32 | white-space: pre; |
33 | text-overflow:ellipsis; | 33 | text-overflow:ellipsis; |
34 | line-height:15px; | 34 | line-height:15px; |
35 | overflow: hidden; | 35 | overflow: hidden; |
diff --git a/js/components/ui/tree-basic/treeItem.reel/treeItem.js b/js/components/ui/tree-basic/treeItem.reel/treeItem.js index a67dad43..e9e5c1fb 100755 --- a/js/components/ui/tree-basic/treeItem.reel/treeItem.js +++ b/js/components/ui/tree-basic/treeItem.reel/treeItem.js | |||
@@ -107,8 +107,8 @@ exports.TreeItem = Montage.create(Component, { | |||
107 | //icon or text click sends selection event | 107 | //icon or text click sends selection event |
108 | var contentEls = this.element.querySelectorAll(".atreeItemContent"); | 108 | var contentEls = this.element.querySelectorAll(".atreeItemContent"); |
109 | for(var i=0;i<contentEls.length;i++){ | 109 | for(var i=0;i<contentEls.length;i++){ |
110 | contentEls[i].addEventListener("click", function(evt){that.handleTreeItemContentClick(evt);}, false); | 110 | contentEls[i].addEventListener("click", function(evt){that.handleTreeItemContentClick(evt);}, true); |
111 | contentEls[i].addEventListener("dblclick", function(evt){that.handleTreeItemContentDblclick(evt);}, false); | 111 | contentEls[i].addEventListener("dblclick", function(evt){that.handleTreeItemContentDblclick(evt);}, true); |
112 | } | 112 | } |
113 | 113 | ||
114 | this.element.addEventListener("mouseover", function(evt){that.handleTreeItemMouseover(evt);}, false); | 114 | this.element.addEventListener("mouseover", function(evt){that.handleTreeItemMouseover(evt);}, false); |
@@ -118,12 +118,12 @@ exports.TreeItem = Montage.create(Component, { | |||
118 | this.metadata = "Name: "+this.treeItemData.name; | 118 | this.metadata = "Name: "+this.treeItemData.name; |
119 | } | 119 | } |
120 | this.metadata = this.metadata + "<br />" + "Type: "+this.treeItemData.type; | 120 | this.metadata = this.metadata + "<br />" + "Type: "+this.treeItemData.type; |
121 | if(this.treeItemData.size){this.metadata = this.metadata + "<br />" + "Size: "+this.treeItemData.size;} | 121 | if(this.treeItemData.size){this.metadata = this.metadata + "<br />" + "Size: "+this.treeItemData.size+ " bytes";} |
122 | if(this.treeItemData.creationDate){this.metadata = this.metadata + "<br />" + "Creation date: "+ this.formatTimestamp(this.treeItemData.creationDate);} | 122 | if(this.treeItemData.creationDate){this.metadata = this.metadata + "<br />" + "Creation date: "+ this.formatTimestamp(this.treeItemData.creationDate);} |
123 | if(this.treeItemData.modifiedDate){this.metadata = this.metadata + "<br />" + "Modified date: "+ this.formatTimestamp(this.treeItemData.modifiedDate);} | 123 | if(this.treeItemData.modifiedDate){this.metadata = this.metadata + "<br />" + "Modified date: "+ this.formatTimestamp(this.treeItemData.modifiedDate);} |
124 | 124 | ||
125 | if((this.treeItemData.type === "directory") && (this.expandAfterDraw === true)){ | 125 | if((this.treeItemData.type === "directory") && (this.expandAfterDraw === true)){ |
126 | this.toggleContent(this.treeArrow); | 126 | this.expand(this.treeArrow); |
127 | } | 127 | } |
128 | if(this.treeItemData.uri === this.highlightedUri){ | 128 | if(this.treeItemData.uri === this.highlightedUri){ |
129 | this.itemName.classList.add("selected"); | 129 | this.itemName.classList.add("selected"); |
@@ -171,6 +171,35 @@ exports.TreeItem = Montage.create(Component, { | |||
171 | } | 171 | } |
172 | }, | 172 | }, |
173 | 173 | ||
174 | expand:{ | ||
175 | writable:false, | ||
176 | enumerable:true, | ||
177 | value:function(el){ | ||
178 | //if children already drawn then just hide/show | ||
179 | if(this.element.getElementsByTagName("ul").length > 0){ | ||
180 | var theParent = this.element.getElementsByTagName("ul")[0].parentNode; | ||
181 | if(theParent.classList.contains("hideTree")){//collapsed | ||
182 | theParent.classList.remove("hideTree");//expand | ||
183 | el.innerHTML = "▼"; | ||
184 | } | ||
185 | } | ||
186 | //else send event to draw the children | ||
187 | else{ | ||
188 | var treeClickEvent = document.createEvent("Events"); | ||
189 | treeClickEvent.initEvent("drawTree", false, false); | ||
190 | treeClickEvent.uri = this.treeItemData.uri; | ||
191 | treeClickEvent.uriType = this.treeItemData.type; | ||
192 | var divEl = document.createElement("div"); | ||
193 | this.element.appendChild(divEl); | ||
194 | treeClickEvent.subTreeContainer = divEl; | ||
195 | this.element.dispatchEvent(treeClickEvent); | ||
196 | |||
197 | el.innerHTML = "▼"; | ||
198 | } | ||
199 | } | ||
200 | }, | ||
201 | |||
202 | |||
174 | /** | 203 | /** |
175 | * Event Listeners | 204 | * Event Listeners |
176 | */ | 205 | */ |