aboutsummaryrefslogtreecommitdiff
path: root/js/panels
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels')
-rwxr-xr-xjs/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.css6
-rwxr-xr-xjs/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.html11
-rwxr-xr-xjs/panels/PanelContainer/PanelContainer.reel/PanelContainer.js4
-rw-r--r--js/panels/presets/content.reel/content.css52
-rw-r--r--js/panels/presets/content.reel/content.html66
-rw-r--r--js/panels/presets/content.reel/content.js79
-rw-r--r--js/panels/presets/default-style-presets.js72
-rw-r--r--js/panels/presets/default-transition-presets.js93
-rw-r--r--js/panels/presets/presets-panel.js15
-rw-r--r--js/panels/presets/style-presets.reel/style-presets.css0
-rw-r--r--js/panels/presets/style-presets.reel/style-presets.html59
-rw-r--r--js/panels/presets/style-presets.reel/style-presets.js79
-rw-r--r--js/panels/presets/transitions-presets.reel/transitions-presets.css0
-rw-r--r--js/panels/presets/transitions-presets.reel/transitions-presets.html58
-rw-r--r--js/panels/presets/transitions-presets.reel/transitions-presets.js46
15 files changed, 638 insertions, 2 deletions
diff --git a/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.css b/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.css
index 27d19e58..1b3c9184 100755
--- a/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.css
+++ b/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.css
@@ -10,6 +10,11 @@
10 -webkit-box-orient: vertical; 10 -webkit-box-orient: vertical;
11 height:100%; 11 height:100%;
12} 12}
13.css_panel .resizer {
14 background-color: #333;
15 cursor: row-resize;
16 height: 1px;
17}
13.nj-section-header { 18.nj-section-header {
14 background-color: #333; 19 background-color: #333;
15 border-top: 1px solid #3D3D3D; 20 border-top: 1px solid #3D3D3D;
@@ -37,7 +42,6 @@
37 -webkit-box-flex: 0; 42 -webkit-box-flex: 0;
38 background-color: #474747; 43 background-color: #474747;
39 color: #FFF; 44 color: #FFF;
40 max-height: 68px;
41 overflow-y: scroll; 45 overflow-y: scroll;
42} 46}
43#nj-section-styles { 47#nj-section-styles {
diff --git a/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.html b/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.html
index 5d6273b6..db630934 100755
--- a/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.html
+++ b/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.html
@@ -10,6 +10,16 @@
10 <link rel="stylesheet" href="CSSPanelBase.css" type="text/css"> 10 <link rel="stylesheet" href="CSSPanelBase.css" type="text/css">
11 <script type="text/montage-serialization"> 11 <script type="text/montage-serialization">
12 { 12 {
13 "resizer1": {
14 "module": "js/panels/Resizer",
15 "name": "Resizer",
16 "properties": {
17 "element": {"#": "subPanelResizer"},
18 "panel": {"#": "nj-section-stylesheets"},
19 "isVertical": true
20 }
21 },
22
13 "ComputedStyleSubPanel1": { 23 "ComputedStyleSubPanel1": {
14 "module": "js/panels/CSSPanel/ComputedStyleSubPanel.reel", 24 "module": "js/panels/CSSPanel/ComputedStyleSubPanel.reel",
15 "name": "ComputedStyleSubPanel", 25 "name": "ComputedStyleSubPanel",
@@ -43,6 +53,7 @@
43 <div id="nj-css-stylesheet-toolbar" class="nj-css-toolbar"> 53 <div id="nj-css-stylesheet-toolbar" class="nj-css-toolbar">
44 <a href="#" id="nj-css-add-stylesheet" title="Add Stylesheet">Add Rule</a> 54 <a href="#" id="nj-css-add-stylesheet" title="Add Stylesheet">Add Rule</a>
45 </div> 55 </div>
56 <div id="subPanelResizer" class="resizer"></div>
46 <!-- Style Rule list subsection --> 57 <!-- Style Rule list subsection -->
47 <h2 id="nj-css-styles-header" class="nj-section-header"> 58 <h2 id="nj-css-styles-header" class="nj-section-header">
48 <div id="nj-css-styles-arrow" class="panelDisclosureIcon"></div> 59 <div id="nj-css-styles-arrow" class="panelDisclosureIcon"></div>
diff --git a/js/panels/PanelContainer/PanelContainer.reel/PanelContainer.js b/js/panels/PanelContainer/PanelContainer.reel/PanelContainer.js
index 66333cc0..b8223471 100755
--- a/js/panels/PanelContainer/PanelContainer.reel/PanelContainer.js
+++ b/js/panels/PanelContainer/PanelContainer.reel/PanelContainer.js
@@ -15,6 +15,7 @@ var CSSPanel = require("js/panels/CSSPanel/CSSPanel").CSSPanel;
15var ComponentsPanel = require("js/panels/Components/ComponentsPanel").ComponentsPanel; 15var ComponentsPanel = require("js/panels/Components/ComponentsPanel").ComponentsPanel;
16var ProjectPanel = require("js/panels/Project/ProjectPanel").ProjectPanel; 16var ProjectPanel = require("js/panels/Project/ProjectPanel").ProjectPanel;
17var MaterialsPanel = require("js/panels/Materials/MaterialsPanel").MaterialsPanel; 17var MaterialsPanel = require("js/panels/Materials/MaterialsPanel").MaterialsPanel;
18var PresetsPanel = require("js/panels/presets/presets-panel").PresetsPanel;
18 19
19exports.PanelContainer = Montage.create(Component, { 20exports.PanelContainer = Montage.create(Component, {
20 lastOffset: { 21 lastOffset: {
@@ -44,7 +45,7 @@ exports.PanelContainer = Montage.create(Component, {
44 }, 45 },
45 46
46 initPanelOrder: { 47 initPanelOrder: {
47 value: ['PropertiesPanel','ColorPanel','ComponentsPanel','ProjectPanel','CSSPanel','MaterialsPanel'] 48 value: ['PropertiesPanel','ColorPanel','ComponentsPanel','ProjectPanel','CSSPanel','MaterialsPanel','PresetsPanel']
48 }, 49 },
49 50
50 panelOrder: { 51 panelOrder: {
@@ -99,6 +100,7 @@ exports.PanelContainer = Montage.create(Component, {
99 this.addEventListener("change@appModel.ComponentsPanel", this, false); 100 this.addEventListener("change@appModel.ComponentsPanel", this, false);
100 this.addEventListener("change@appModel.CSSPanel", this, false); 101 this.addEventListener("change@appModel.CSSPanel", this, false);
101 this.addEventListener("change@appModel.MaterialsPanel", this, false); 102 this.addEventListener("change@appModel.MaterialsPanel", this, false);
103 this.addEventListener("change@appModel.PresetsPanel", this, false);
102 } 104 }
103 }, 105 },
104 106
diff --git a/js/panels/presets/content.reel/content.css b/js/panels/presets/content.reel/content.css
new file mode 100644
index 00000000..08e1d53b
--- /dev/null
+++ b/js/panels/presets/content.reel/content.css
@@ -0,0 +1,52 @@
1.presetsPanel {
2 display: -webkit-box;
3 text-shadow: 1px 1px 1px #000;
4 -webkit-box-orient: vertical;
5 -webkit-box-flex: 1;
6}
7.presetsPanel .treeRoot {
8 margin: 0 8px;
9}
10.tab-bar {
11 -webkit-box-flex: 0;
12 background-color: #282828;
13 color: #FFF;
14 display: -webkit-box;
15 font-size: 12px;
16 -webkit-box-orient: horizontal;
17}
18
19.tab-bar div {
20 -webkit-box-flex: 0;
21 border-top-right-radius: 2px;
22 border-top-left-radius: 2px;
23 background-color: #474747;
24 background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,0.2) 0,rgba(0,0,0,0) 3px);
25 border-top: 1px solid rgb(100, 100, 100);
26 border-left: 1px solid rgba(100, 100, 100, 0.3);
27 border-right: 1px solid rgba(100, 100, 100, 0.3);
28 padding: 4px 9px;
29 cursor: pointer;
30 opacity: 0.6;
31 white-space: nowrap;
32 text-overflow: ellipsis;
33 overflow: hidden;
34 position: relative;
35 z-index: 999;
36}
37.tab-bar div.active-tab {
38 background-image: none;
39 box-shadow: 0 -5px 2px 3px rgba(0,0,0,0.2);
40 position: relative;
41 opacity: 1;
42 text-overflow: clip;
43 z-index: 1001;
44}
45
46.librarySlot {
47 -webkit-box-flex: 1;
48 overflow: auto;
49 background-color: #474747;
50 position: relative;
51 z-index: 1000;
52} \ No newline at end of file
diff --git a/js/panels/presets/content.reel/content.html b/js/panels/presets/content.reel/content.html
new file mode 100644
index 00000000..38de2a6d
--- /dev/null
+++ b/js/panels/presets/content.reel/content.html
@@ -0,0 +1,66 @@
1<!DOCTYPE html>
2<!-- <copyright>
3This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
4No 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 lang="en">
8<head>
9 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
10 <link rel="stylesheet" href="content.css" type="text/css">
11 <script type="text/montage-serialization">
12 {
13 "owner": {
14 "module" : "js/panels/presets/content.reel",
15 "name" : "Content",
16 "properties" : {
17 "element" : {"#" : "presetsPanel"},
18 "activeTabIndex": 0,
19 "tabBar" : {"#": "tab-bar" },
20 "tabs" : [
21 {"key":"styles", "tab": {"#": "styles" }},
22 {"key":"transitions", "tab": {"#": "transitions" }}
23 ]
24 }
25 },
26 "substitution": {
27 "module": "montage/ui/substitution.reel",
28 "name": "Substitution",
29 "properties": {
30 "element": {"#": "librarySlot"},
31 "switchComponents": {
32 "styles": {"@": "stylesLibrary"},
33 "transitions": {"@": "transitionsLibrary"}
34
35 }
36 },
37 "bindings": {
38 "switchValue": {
39 "boundObject": {"@": "owner"},
40 "boundObjectPropertyPath": "contentPanel",
41 "oneway": true