aboutsummaryrefslogtreecommitdiff
path: root/js/panels/presets
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/presets')
-rw-r--r--js/panels/presets/animations-presets.reel/animations-presets.css5
-rw-r--r--js/panels/presets/animations-presets.reel/animations-presets.html59
-rw-r--r--js/panels/presets/animations-presets.reel/animations-presets.js28
-rw-r--r--js/panels/presets/content.reel/content.css4
-rw-r--r--js/panels/presets/content.reel/content.html16
-rw-r--r--js/panels/presets/default-animation-presets.js187
-rw-r--r--js/panels/presets/default-style-presets.js29
-rw-r--r--js/panels/presets/default-transition-presets.js48
-rw-r--r--js/panels/presets/style-presets.reel/style-presets.js51
-rw-r--r--js/panels/presets/transitions-presets.reel/transitions-presets.js24
10 files changed, 363 insertions, 88 deletions
diff --git a/js/panels/presets/animations-presets.reel/animations-presets.css b/js/panels/presets/animations-presets.reel/animations-presets.css
new file mode 100644
index 00000000..0441c1cf
--- /dev/null
+++ b/js/panels/presets/animations-presets.reel/animations-presets.css
@@ -0,0 +1,5 @@
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> */ \ No newline at end of file
diff --git a/js/panels/presets/animations-presets.reel/animations-presets.html b/js/panels/presets/animations-presets.reel/animations-presets.html
new file mode 100644
index 00000000..c9d752af
--- /dev/null
+++ b/js/panels/presets/animations-presets.reel/animations-presets.html
@@ -0,0 +1,59 @@
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="animations-presets.css" type="text/css">
11 <script type="text/montage-serialization">
12 {
13 "owner": {
14 "module" : "js/panels/presets/animations-presets.reel",
15 "name" : "AnimationsLibrary",
16 "properties" : {
17 "element" : {"#" : "animationsLibrary"},
18 "treeList" : {"@" : "treeList"}
19 }
20 },
21 "presetsController" : {
22 "module": "js/controllers/tree-controller",
23 "name": "TreeController",
24 "properties" : {
25 "branchKey" : "children",
26 "labelKey" : "text",
27 "delegate": {"@": "owner" }
28 },
29 "bindings": {
30 "content": {
31 "boundObject": {"@": "owner"},
32 "boundObjectPropertyPath": "presetData"
33 }
34 }
35 },
36 "presetsContainer" : {
37 "module" : "js/components/treeview/treeview.reel",
38 "name" : "Treeview",
39 "properties" : {
40 "element" : {"#": "libraryContainer"},
41 "branchComponent" : {"@": "branch" },
42 "contentController": {"@": "presetsController"},
43 "activationEvent" : "dblclick",
44 "showRoot": false
45 }
46 },
47 "branch" : {
48 "module" : "js/components/treeview/ninja-branch.reel",
49 "name" : "Branch"
50 }
51 }
52 </script>
53</head>
54<body>
55<section id="animationsLibrary" class="animationsLibrary">
56 <div id="libraryContainer"></div>
57</section>
58</body>
59</html> \ No newline at end of file
diff --git a/js/panels/presets/animations-presets.reel/animations-presets.js b/js/panels/presets/animations-presets.reel/animations-presets.js
new file mode 100644
index 00000000..92437cfd
--- /dev/null
+++ b/js/panels/presets/animations-presets.reel/animations-presets.js
@@ -0,0 +1,28 @@
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
7var Montage = require("montage/core/core").Montage,
8 Component = require("montage/ui/component").Component,
9 DefaultPresets = require("js/panels/presets/default-animation-presets").animationPresets;
10
11exports.AnimationsLibrary = Montage.create(Component, {
12 hasTemplate: {
13 value: true
14 },
15 presetData : {
16 value: null
17 },
18 deserializedFromTemplate : {
19 value: function() {
20 this.presetData = DefaultPresets;
21 }
22 },
23 handleNodeActivation: {
24 value: function(presetData) {
25 this.application.ninja.presetsController.applyPreset(presetData);
26 }
27 }
28});
diff --git a/js/panels/presets/content.reel/content.css b/js/panels/presets/content.reel/content.css
index c0ccbad4..409e1960 100644
--- a/js/panels/presets/content.reel/content.css
+++ b/js/panels/presets/content.reel/content.css
@@ -10,9 +10,7 @@
10 -webkit-box-orient: vertical; 10 -webkit-box-orient: vertical;
11 -webkit-box-flex: 1; 11 -webkit-box-flex: 1;
12} 12}
13.presetsPanel .treeRoot { 13
14 margin: 0 8px;
15}
16.tab-bar { 14.tab-bar {
17 -webkit-box-flex: 0; 15 -webkit-box-flex: 0;
18 background-color: #282828; 16 background-color: #282828;
diff --git a/js/panels/presets/content.reel/content.html b/js/panels/presets/content.reel/content.html
index 38de2a6d..afbdd559 100644
--- a/js/panels/presets/content.reel/content.html
+++ b/js/panels/presets/content.reel/content.html
@@ -19,7 +19,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
19 "tabBar" : {"#": "tab-bar" }, 19 "tabBar" : {"#": "tab-bar" },
20 "tabs" : [ 20 "tabs" : [
21 {"key":"styles", "tab": {"#": "styles" }}, 21 {"key":"styles", "tab": {"#": "styles" }},
22 {"key":"transitions", "tab": {"#": "transitions" }} 22 {"key":"transitions", "tab": {"#": "transitions" }},
23 {"key":"animations", "tab": {"#": "animations" }}
23 ] 24 ]
24 } 25 }
25 }, 26 },
@@ -30,8 +31,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
30 "element": {"#": "librarySlot"}, 31 "element": {"#": "librarySlot"},
31 "switchComponents": { 32 "switchComponents": {
32 "styles": {"@": "stylesLibrary"}, 33 "styles": {"@": "stylesLibrary"},
33 "transitions": {"@": "transitionsLibrary"} 34 "transitions": {"@": "transitionsLibrary"},
34 35 "animations": {"@": "animationsLibrary"}
35 } 36 }
36 }, 37 },
37 "bindings": { 38 "bindings": {
@@ -49,6 +50,10 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
49 "transitionsLibrary": { 50 "transitionsLibrary": {
50 "module": "js/panels/presets/transitions-presets.reel", 51 "module": "js/panels/presets/transitions-presets.reel",
51 "name": "TransitionsLibrary" 52 "name": "TransitionsLibrary"
53 },
54 "animationsLibrary": {
55 "module": "js/panels/presets/animations-presets.reel",
56 "name": "AnimationsLibrary"
52 } 57 }
53 58
54 } 59 }
@@ -57,8 +62,9 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
57<body> 62<body>
58 <section id="presetsPanel" class="presetsPanel"> 63 <section id="presetsPanel" class="presetsPanel">
59 <nav id="tab-bar" class="tab-bar"> 64 <nav id="tab-bar" class="tab-bar">
60 <div id="styles">Style Library</div> 65 <div id="styles">Styles</div>
61 <div id="transitions">Transitions Library</div> 66 <div id="transitions">Transitions</div>
67 <div id="animations">Animations</div>
62 </nav> 68 </nav>
63 <div id="librarySlot" class="librarySlot"></div> 69 <div id="librarySlot" class="librarySlot"></div>
64 </section> 70 </section>
diff --git a/js/panels/presets/default-animation-presets.js b/js/panels/presets/default-animation-presets.js
new file mode 100644
index 00000000..578c1622
--- /dev/null
+++ b/js/panels/presets/default-animation-presets.js
@@ -0,0 +1,187 @@
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
7exports.animationPresets = {
8 "text": "Animation Presets Library",
9 "children": [{
10 "text": "Border Animations",
11 "children": [
12 {
13 "text": "Border Morph",
14 "selectorBase" : "border-morph",
15 "rules" : [{
16 "styles" : {
17 "-webkit-animation-name": "border-morph",
18 "-webkit-animation-duration": "2s",
19 "-webkit-animation-iteration-count": "infinite"
20 }
21 },
22 {
23 "isKeyFrameRule": true,
24 "keys" : [{
25 "keyText": "0%",
26 "styles": { "border-radius": "0" }
27 }, {
28 "keyText": "50%",
29 "styles": {
30 "border-radius": "100%"