4 files changed, 101 insertions, 22 deletions
diff --git a/js/panels/presets/content.reel/content.html b/js/panels/presets/content.reel/content.html
index f01e6435..afbdd559 100644
--- a/js/panels/presets/content.reel/content.html
+++ b/js/panels/presets/content.reel/content.html
@@ -62,9 +62,9 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
 <body>
    <section id="presetsPanel" class="presetsPanel">
        <nav id="tab-bar" class="tab-bar">
-            <div id="styles">Style Library</div>
+            <div id="styles">Styles</div>
-            <div id="transitions">Transitions Library</div>
+            <div id="transitions">Transitions</div>
-            <div id="animations">Animations Library</div>
+            <div id="animations">Animations</div>
        </nav>
        <div id="librarySlot" class="librarySlot"></div>
    </section>
diff --git a/js/panels/presets/default-animation-presets.js b/js/panels/presets/default-animation-presets.js
index 10a3e906..2e656e86 100644
--- a/js/panels/presets/default-animation-presets.js
+++ b/js/panels/presets/default-animation-presets.js
@@ -18,23 +18,23 @@ exports.animationPresets = {
                        "-webkit-animation": "border-morph 2s infinite"
                    }
                },
-                {
+                    {
-                    "isKeyFrameRule": true,
+                        "isKeyFrameRule": true,
-                    "keys" : [{
+                        "keys" : [{
-                        "keyText": "0%",
+                            "keyText": "0%",
-                        "styles": { "border-radius": "0" }
+                            "styles": { "border-radius": "0" }
-                    }, {
+                        }, {
-                        "keyText": "50%",
+                            "keyText": "50%",
-                        "styles": {
+                            "styles": {
-                            "border-radius": "100%"
+                                "border-radius": "100%"
-                        }
+                            }
-                    }, {
+                        }, {
-                        "keyText": "100%",
+                            "keyText": "100%",
-                        "styles": {
+                            "styles": {
-                            "border-radius": "0%"
+                                "border-radius": "0%"
-                        }
+                            }
+                        }]
                    }]
-                }]
            }]
    }, {
        "text": "3D Animations",
@@ -50,7 +50,7 @@ exports.animationPresets = {
                        "-webkit-animation-iteration-count": "infinite",
                        "-webkit-animation-direction": "normal",
                        "-webkit-animation-timing-function": "ease-out",
-                        "-webkit-transform-origin": "200% 50%",
+                        "-webkit-transform-origin": "100% 50%",
                        "-webkit-transform-style": "preserve-3d",
                        "-webkit-transform": "perspective(1000)",
                        "-webkit-animation-delay": "0s"
@@ -89,6 +89,51 @@ exports.animationPresets = {
                        }
                    }]
                }]
+            },
+            {
+                "text": "Rotate with Fade In",
+                "selectorBase" : "rotate-with-fade-in",
+                "rules" : [{
+                    "selectorSuffix" : "",
+                    "styles" : {
+                        "-webkit-animation-name": "rotate-with-fade-in",
+                        "-webkit-animation-duration": "5s",
+                        "-webkit-animation-iteration-count": "infinite",
+                        "-webkit-animation-direction": "normal",
+                        "-webkit-animation-timing-function": "ease-out",
+                        "-webkit-transform-origin": "100% 50%",
+                        "-webkit-transform-style": "preserve-3d",
+                        "-webkit-transform": "perspective(1000)",
+                        "-webkit-animation-delay": "0s"
+                    }
+                },{
+                    "isKeyFrameRule": true,
+                    "keys" : [{
+                        "keyText": "0%",
+                        "styles": {
+                            "opacity": "0",
+                            "-webkit-transform": "perspective(1000) rotateY(-90deg)"
+                        }
+                    }, {
+                        "keyText": "15%",
+                        "styles": {
+                            "opacity": "1",
+                            "-webkit-transform": "perspective(1000) rotateY(0deg)"
+                        }
+                    }, {
+                        "keyText": "85%",
+                        "styles": {
+                            "opacity": "1",
+                            "-webkit-transform": "perspective(1000) rotateY(0deg)"
+                        }
+                    }, {
+                        "keyText": "100%",
+                        "styles": {
+                            "opacity": "0",
+                            "-webkit-transform": "perspective(1000) rotateY(95deg)"
+                        }
+                    }]
+                }]
            }]
    }]
 };
 \ No newline at end of file
diff --git a/js/panels/presets/default-style-presets.js b/js/panels/presets/default-style-presets.js
index 3677d976..82bec34f 100644
--- a/js/panels/presets/default-style-presets.js
+++ b/js/panels/presets/default-style-presets.js
@@ -67,6 +67,24 @@ exports.stylePresets = {
                        "text-shadow": "1px 1px 3px #333"
                    }
                }]
+            },
+            {
+                "text": "White Sans-Serif",
+                "selectorBase" : "white-sans-serif",
+                "rules" : [{
+                    "selectorSuffix" : "",
+                    "styles" : {
+                        "color": "#FFFFFF",
+                        "font-family": "helvetica,arial,sans-serif"
+                    }
+                },
+                {
+                    "selectorSuffix" : " h2",
+                    "styles" : {
+                        "color": "#C1C1C1",
+                        "font-family": "helvetica,arial,sans-serif"
+                    }
+                }]
            }]
    }]
 };
 \ No newline at end of file
diff --git a/js/panels/presets/default-transition-presets.js b/js/panels/presets/default-transition-presets.js
index 271ad821..15f4882f 100644
--- a/js/panels/presets/default-transition-presets.js
+++ b/js/panels/presets/default-transition-presets.js
@@ -88,8 +88,7 @@ exports.transitionPresets = {
                        "-webkit-transform": "rotate(180deg)"
                    }
                }]
-            },
+            },{
-            {
                "text": "Scale Up",
                "selectorBase" : "scale-up",
                "rules" : [{
@@ -118,6 +117,23 @@ exports.transitionPresets = {
                        "-webkit-transform": "scale(.5)"
                    }
                }]
+            },
+            {
+                "text": "Remove 3D",
+                "selectorBase" : "remove-3d",
+                "rules" : [{
+                    "selectorSuffix": "",
+                    "styles" : {
+                        "-webkit-transition": "all 0.4s ease-in"
+                    }
+                },
+                    {
+                    "selectorSuffix" : ":hover",
+                    "styles" : {
+                        "-webkit-transform": "rotateX(0deg)",
+                        "opacity": "1"
+                    }
+                }]
            }]
    }]
 };
 \ No newline at end of file

diff --git a/js/panels/presets/content.reel/content.html b/js/panels/presets/content.reel/content.html index f01e6435..afbdd559 100644 --- a/js/panels/presets/content.reel/content.html +++ b/js/panels/presets/content.reel/content.html
@@ -62,9 +62,9 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
62	<body>	62	<body>
63	<section id="presetsPanel" class="presetsPanel">	63	<section id="presetsPanel" class="presetsPanel">
64	<nav id="tab-bar" class="tab-bar">	64	<nav id="tab-bar" class="tab-bar">
65	<div id="styles">Style Library</div>	65	<div id="styles">Styles</div>
66	<div id="transitions">Transitions Library</div>	66	<div id="transitions">Transitions</div>
67	<div id="animations">Animations Library</div>	67	<div id="animations">Animations</div>
68	</nav>	68	</nav>
69	<div id="librarySlot" class="librarySlot"></div>	69	<div id="librarySlot" class="librarySlot"></div>
70	</section>	70	</section>


diff --git a/js/panels/presets/default-animation-presets.js b/js/panels/presets/default-animation-presets.js index 10a3e906..2e656e86 100644 --- a/js/panels/presets/default-animation-presets.js +++ b/js/panels/presets/default-animation-presets.js
@@ -18,23 +18,23 @@ exports.animationPresets = {
18	"-webkit-animation": "border-morph 2s infinite"	18	"-webkit-animation": "border-morph 2s infinite"
19	}	19	}
20	},	20	},
21	{	21	{
22	"isKeyFrameRule": true,	22	"isKeyFrameRule": true,
23	"keys" : [{	23	"keys" : [{
24	"keyText": "0%",	24	"keyText": "0%",
25	"styles": { "border-radius": "0" }	25	"styles": { "border-radius": "0" }
26	}, {	26	}, {
27	"keyText": "50%",	27	"keyText": "50%",
28	"styles": {	28	"styles": {
29	"border-radius": "100%"	29	"border-radius": "100%"
30	}	30	}
31	}, {	31	}, {
32	"keyText": "100%",	32	"keyText": "100%",
33	"styles": {	33	"styles": {
34	"border-radius": "0%"	34	"border-radius": "0%"
35	}	35	}
		36	}]
36	}]	37	}]
37	}]
38	}]	38	}]
39	}, {	39	}, {
40	"text": "3D Animations",	40	"text": "3D Animations",
@@ -50,7 +50,7 @@ exports.animationPresets = {
50	"-webkit-animation-iteration-count": "infinite",	50	"-webkit-animation-iteration-count": "infinite",
51	"-webkit-animation-direction": "normal",	51	"-webkit-animation-direction": "normal",
52	"-webkit-animation-timing-function": "ease-out",	52	"-webkit-animation-timing-function": "ease-out",
53	"-webkit-transform-origin": "200% 50%",	53	"-webkit-transform-origin": "100% 50%",
54	"-webkit-transform-style": "preserve-3d",	54	"-webkit-transform-style": "preserve-3d",
55	"-webkit-transform": "perspective(1000)",	55	"-webkit-transform": "perspective(1000)",
56	"-webkit-animation-delay": "0s"	56	"-webkit-animation-delay": "0s"
@@ -89,6 +89,51 @@ exports.animationPresets = {
89	}	89	}
90	}]	90	}]
91	}]	91	}]
		92	},
		93	{
		94	"text": "Rotate with Fade In",
		95	"selectorBase" : "rotate-with-fade-in",
		96	"rules" : [{
		97	"selectorSuffix" : "",
		98	"styles" : {
		99	"-webkit-animation-name": "rotate-with-fade-in",
		100	"-webkit-animation-duration": "5s",
		101	"-webkit-animation-iteration-count": "infinite",
		102	"-webkit-animation-direction": "normal",
		103	"-webkit-animation-timing-function": "ease-out",
		104	"-webkit-transform-origin": "100% 50%",
		105	"-webkit-transform-style": "preserve-3d",
		106	"-webkit-transform": "perspective(1000)",
		107	"-webkit-animation-delay": "0s"
		108	}
		109	},{
		110	"isKeyFrameRule": true,
		111	"keys" : [{
		112	"keyText": "0%",
		113	"styles": {
		114	"opacity": "0",
		115	"-webkit-transform": "perspective(1000) rotateY(-90deg)"
		116	}
		117	}, {
		118	"keyText": "15%",
		119	"styles": {
		120	"opacity": "1",
		121	"-webkit-transform": "perspective(1000) rotateY(0deg)"
		122	}
		123	}, {
		124	"keyText": "85%",
		125	"styles": {
		126	"opacity": "1",
		127	"-webkit-transform": "perspective(1000) rotateY(0deg)"
		128	}
		129	}, {
		130	"keyText": "100%",
		131	"styles": {
		132	"opacity": "0",
		133	"-webkit-transform": "perspective(1000) rotateY(95deg)"
		134	}
		135	}]
		136	}]
92	}]	137	}]
93	}]	138	}]
94	}; \ No newline at end of file	139	}; \ No newline at end of file


diff --git a/js/panels/presets/default-style-presets.js b/js/panels/presets/default-style-presets.js index 3677d976..82bec34f 100644 --- a/js/panels/presets/default-style-presets.js +++ b/js/panels/presets/default-style-presets.js
@@ -67,6 +67,24 @@ exports.stylePresets = {
67	"text-shadow": "1px 1px 3px #333"	67	"text-shadow": "1px 1px 3px #333"
68	}	68	}
69	}]	69	}]
		70	},
		71	{
		72	"text": "White Sans-Serif",
		73	"selectorBase" : "white-sans-serif",
		74	"rules" : [{
		75	"selectorSuffix" : "",
		76	"styles" : {
		77	"color": "#FFFFFF",
		78	"font-family": "helvetica,arial,sans-serif"
		79	}
		80	},
		81	{
		82	"selectorSuffix" : " h2",
		83	"styles" : {
		84	"color": "#C1C1C1",
		85	"font-family": "helvetica,arial,sans-serif"
		86	}
		87	}]
70	}]	88	}]
71	}]	89	}]
72	}; \ No newline at end of file	90	}; \ No newline at end of file


diff --git a/js/panels/presets/default-transition-presets.js b/js/panels/presets/default-transition-presets.js index 271ad821..15f4882f 100644 --- a/js/panels/presets/default-transition-presets.js +++ b/js/panels/presets/default-transition-presets.js
@@ -88,8 +88,7 @@ exports.transitionPresets = {
88	"-webkit-transform": "rotate(180deg)"	88	"-webkit-transform": "rotate(180deg)"
89	}	89	}
90	}]	90	}]
91	},	91	},{
92	{
93	"text": "Scale Up",	92	"text": "Scale Up",
94	"selectorBase" : "scale-up",	93	"selectorBase" : "scale-up",
95	"rules" : [{	94	"rules" : [{
@@ -118,6 +117,23 @@ exports.transitionPresets = {
118	"-webkit-transform": "scale(.5)"	117	"-webkit-transform": "scale(.5)"
119	}	118	}
120	}]	119	}]
		120	},
		121	{
		122	"text": "Remove 3D",
		123	"selectorBase" : "remove-3d",
		124	"rules" : [{
		125	"selectorSuffix": "",
		126	"styles" : {
		127	"-webkit-transition": "all 0.4s ease-in"
		128	}
		129	},
		130	{
		131	"selectorSuffix" : ":hover",
		132	"styles" : {
		133	"-webkit-transform": "rotateX(0deg)",
		134	"opacity": "1"
		135	}
		136	}]
121	}]	137	}]
122	}]	138	}]
123	}; \ No newline at end of file	139	}; \ No newline at end of file