diff options
| author | hwc487 | 2012-03-06 11:41:28 -0800 |
|---|---|---|
| committer | hwc487 | 2012-03-06 11:41:28 -0800 |
| commit | 5e640e24c3b4658b8060cde837ae98dabd3ba5bf (patch) | |
| tree | 527f183b5e485282ce1efe15d96b6b8ddc26801e /js/panels/Panel.reel/Panel.html | |
| parent | 182f05f2f7a8f43f1589c9b8c15bf00d6e983676 (diff) | |
| parent | 2815adfd7c19b3dff89dc3e1bda9af8d30dca8d6 (diff) | |
| download | ninja-5e640e24c3b4658b8060cde837ae98dabd3ba5bf.tar.gz | |
Merge branch 'TimelineUber' of github.com:imix23ways/ninja-internal into integration
Diffstat (limited to 'js/panels/Panel.reel/Panel.html')
| -rwxr-xr-x | js/panels/Panel.reel/Panel.html | 116 |
1 files changed, 97 insertions, 19 deletions
diff --git a/js/panels/Panel.reel/Panel.html b/js/panels/Panel.reel/Panel.html index 7556952c..04e2930a 100755 --- a/js/panels/Panel.reel/Panel.html +++ b/js/panels/Panel.reel/Panel.html | |||
| @@ -8,22 +8,86 @@ | |||
| 8 | <head> | 8 | <head> |
| 9 | <script type="text/montage-serialization"> | 9 | <script type="text/montage-serialization"> |
| 10 | { | 10 | { |
| 11 | "resizer1": { | 11 | "Resizer": { |
| 12 | "module": "js/panels/Resizer", | 12 | "module": "js/panels/resize-composer", |
| 13 | "name": "Resizer", | 13 | "name": "ResizeComposer", |
| 14 | "properties": { | 14 | "properties": { |
| 15 | "element": {"#": "resizeBar"}, | 15 | "element": {"#": "resizeBar"}, |
| 16 | "panel": {"#": "panel"}, | 16 | "component": {"@": "owner"} |
| 17 | "isVertical": true, | ||
| 18 | "willSave": false | ||
| 19 | }, | 17 | }, |
| 20 | "bindings": { | 18 | "listeners": [ |
| 21 | "ownerId": { | 19 | { |
| 22 | "boundObject": {"@": "owner"}, | 20 | "type": "resizeStart", |
| 23 | "boundObjectPropertyPath": "panelBase.panelName", | 21 | "listener": {"@": "owner"} |
| 24 | "oneway": true | 22 | }, |
| 23 | { | ||
| 24 | "type": "resizeMove", | ||
| 25 | "listener": {"@": "owner"} | ||
| 26 | }, | ||
| 27 | { | ||
| 28 | "type": "resizeEnd", | ||
| 29 | "listener": {"@": "owner"} | ||
| 25 | } | 30 | } |
| 26 | } | 31 | ] |
| 32 | }, | ||
| 33 | |||
| 34 | "DragDrop": { | ||
| 35 | "module": "js/panels/drag-drop-composer", | ||
| 36 | "name": "DragDropComposer", | ||
| 37 | "properties": { | ||
| 38 | "element": {"@": "panelTitle"}, | ||
| 39 | "component": {"@": "owner"} | ||
| 40 | }, | ||
| 41 | "listeners": [ | ||
| 42 | { | ||
| 43 | "type": "dragStart", | ||
| 44 | "listener": {"@": "owner"} | ||
| 45 | }, | ||
| 46 | { | ||
| 47 | "type": "dropHover", | ||
| 48 | "listener": {"@": "owner"} | ||
| 49 | }, | ||
| 50 | { | ||
| 51 | "type": "dropped", | ||
| 52 | "listener": {"@": "owner"} | ||
| 53 | }, | ||
| 54 | { | ||
| 55 | "type": "dropEnd", | ||
| 56 | "listener": {"@": "owner"} | ||
| 57 | } | ||
| 58 | ] | ||
| 59 | }, | ||
| 60 | |||
| 61 | "btnCollapse": { | ||
| 62 | "module": "montage/ui/toggle-button.reel", | ||
| 63 | "name": "ToggleButton", | ||
| 64 | "properties": { | ||
| 65 | "element": {"#": "btnCollapse"}, | ||
| 66 | "pressedClass": "hide", | ||
| 67 | "identifier": "btnCollapse" | ||
| 68 | }, | ||
| 69 | "listeners": [ | ||
| 70 | { | ||
| 71 | "type": "action", | ||
| 72 | "listener": {"@": "owner"} | ||
| 73 | } | ||
| 74 | ] | ||
| 75 | }, | ||
| 76 | |||
| 77 | "btnClose": { | ||
| 78 | "module": "montage/ui/button.reel", | ||
| 79 | "name": "Button", | ||
| 80 | "properties": { | ||
| 81 | "element": {"#": "btnClose"}, | ||
| 82 | "pressedClass": "hide", | ||
| 83 | "identifier": "btnClose" | ||
| 84 | }, | ||
| 85 | "listeners": [ | ||
| 86 | { | ||
| 87 | "type": "action", | ||
| 88 | "listener": {"@": "owner"} | ||
| 89 | } | ||
| 90 | ] | ||
| 27 | }, | 91 | }, |
| 28 | 92 | ||
| 29 | "slot1": { | 93 | "slot1": { |
| @@ -34,14 +98,28 @@ | |||
| 34 | } | 98 | } |
| 35 | }, | 99 | }, |
| 36 | 100 | ||
| 101 | "panelTitle": { | ||
| 102 | "module": "montage/ui/dynamic-text.reel", | ||
| 103 | "name": "DynamicText", | ||
| 104 | "properties": { | ||
| 105 | "element": {"#": "panelTitle"} | ||
| 106 | }, | ||
| 107 | "bindings": { | ||
| 108 | "value": { | ||
| 109 | "boundObject": {"@": "owner"}, | ||
| 110 | "boundObjectPropertyPath": "name", | ||
| 111 | "oneway": true | ||
| 112 | } | ||
| 113 | } | ||
| 114 | }, | ||
| 115 | |||
| 37 | "owner": { | 116 | "owner": { |
| 38 | "module": "js/panels/Panel.reel", | 117 | "module": "js/panels/Panel.reel", |
| 39 | "name": "Panel", | 118 | "name": "Panel", |
| 40 | "properties": { | 119 | "properties": { |
| 41 | "element": {"#": "panel"}, | 120 | "element": {"#": "panel"}, |
| 42 | "resizer": {"@": "resizer1"}, | 121 | "resizer": {"@": "Resizer"}, |
| 43 | "panelContent": {"@": "slot1"} | 122 | "panelContent": {"@": "slot1"} |
| 44 | |||
| 45 | } | 123 | } |
| 46 | } | 124 | } |
| 47 | } | 125 | } |
| @@ -50,11 +128,11 @@ | |||
| 50 | </head> | 128 | </head> |
| 51 | <body> | 129 | <body> |
| 52 | 130 | ||
| 53 | <article id="panel"> | 131 | <article id="panel" class="panel" draggable="draggable"> |
| 54 | <div id="head" class="head"> | 132 | <div id="head" class="head"> |
| 55 | <span class="arrowIcon"></span> | 133 | <span id="btnCollapse" class="arrowIcon"></span> |
| 56 | <span class="panelTitle">Panel</span> | 134 | <span id="panelTitle" class="panelTitle">Panel</span> |
| 57 | <span class="closeBtn"></span> | 135 | <span id="btnClose" class="closeBtn"></span> |
| 58 | </div> | 136 | </div> |
| 59 | <div class="panelBody"> | 137 | <div class="panelBody"> |
| 60 | <div class="panelBodyContent"> | 138 | <div class="panelBodyContent"> |
| @@ -63,7 +141,7 @@ | |||
| 63 | </div> | 141 | </div> |
| 64 | </div> | 142 | </div> |
| 65 | </div> | 143 | </div> |
| 66 | <div data-montage-id="resizeBar" class="resizeBar"></div> | 144 | <div id="resizeBar" class="resizeBar"></div> |
| 67 | </article> | 145 | </article> |
| 68 | 146 | ||
| 69 | </body> | 147 | </body> |