Merge pull request #57 from PixelsCommander/effects

Added effects attribute support

bower.json

@@ -16,7 +16,8 @@
     "pixi": "~2.2.9",
     "webcomponents.js": "~0.5.5",
     "promise-polyfill": "~2.0.0",
-    "jquery": "~2.1.3"
+    "jquery": "~2.1.3",
+    "tween.js": "git@github.com:sole/tween.js.git"
   },
   "keywords": ["web-components"]
 }

demo/advanced-content-webgl.html

@@ -172,17 +172,7 @@ <h1>SLIDER BELOW IS RENDERED IN WEBGL, DRAG IT</h1>
         </html-gl>
     </section>
 </div>
-
-<script src="../bower_components/promise-polyfill/Promise.min.js"></script>
-<script src="../bower_components/webcomponents.js/CustomElements.min.js"></script>
-<script src="./js/vendor/velocity.js"></script>
-<script src="./js/vendor/html2canvas.js"></script>
-<script src="../bower_components/pixi/bin/pixi.dev.js"></script>
-<script src="../src/util.js"></script>
-<script src="../src/gl-element-resolver.js"></script>
-<script src="../src/gl-context.js"></script>
-<script src="../src/images-loaded.js"></script>
-<script src="../src/gl-element.js"></script>
+<script src="../dist/htmlgl.js"></script>
 <script src="./js/slider.js"></script>
 <script>
     window.addEventListener('load', function () {

demo/assets/css/appstyle.css

@@ -0,0 +1,71 @@
+/** Generated by FG **/
+@font-face {
+    font-family: 'Conv_InterstatePro-Bold';
+    src: url('../fonts/InterstatePro-Bold.eot');
+    src: local('☺'), url('../fonts/InterstatePro-Bold.woff') format('woff'), url('../fonts/InterstatePro-Bold.ttf') format('truetype'), url('../fonts/InterstatePro-Bold.svg') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}
+/** Generated by FG **/
+@font-face {
+    font-family: 'Conv_InterstatePro-Light';
+    src: url('../fonts/InterstatePro-Light.eot');
+    src: local('☺'), url('../fonts/InterstatePro-Light.woff') format('woff'), url('../fonts/InterstatePro-Light.ttf') format('truetype'), url('../fonts/InterstatePro-Light.svg') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}
+/** Generated by FG **/
+@font-face {
+    font-family: 'Conv_InterstatePro-ExtraLight';
+    src: url('../fonts/InterstatePro-ExtraLight.eot');
+    src: local('☺'), url('../fonts/InterstatePro-ExtraLight.woff') format('woff'), url('../fonts/InterstatePro-ExtraLight.ttf') format('truetype'), url('../fonts/InterstatePro-ExtraLight.svg') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}
+/** Generated by FG **/
+@font-face {
+    font-family: 'Conv_InterstatePro-Regular';
+    src: url('../fonts/InterstatePro-Regular.eot');
+    src: local('☺'), url('../fonts/InterstatePro-Regular.woff') format('woff'), url('../fonts/InterstatePro-Regular.ttf') format('truetype'), url('../fonts/InterstatePro-Regular.svg') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}
+@font-face {
+    font-family: "UPCDigital";
+    src: url(../fonts/DAWN-UPCDiRg.ttf) format("truetype");
+    font-weight: 400;
+}
+@font-face {
+    font-family: 'UPCDigital-bold';
+    src: url(../fonts/DAWN-UPCDiBd.ttf) format('truetype');
+}
+
+body {
+    box-sizing: border-box;
+    padding: 20px 43px 0 43px;
+    margin: 0;
+    font-family: Conv_InterstatePro-Regular;
+    font-weight: normal;
+    font-size: 24px;
+    color: #2c3e50;
+    width: 100%;
+    height: 100%;
+    background-color: #ecf0f1;
+    overflow-x: hidden;
+}
+
+ul {
+    list-style: none;
+}
+
+li {
+    text-align: center;
+    display: inline-block;
+    vertical-align:top;
+    padding: 20px;
+}
+
+p {
+    width: 128px;
+    margin-top: 15px;
+}

demo/filters.html

@@ -355,26 +355,6 @@ <h1>SLIDER BELOW IS RENDERED IN WEBGL, DRAG IT</h1>
 
         pondContainer.filters = filtersToApply.length > 0 ? filtersToApply : null;
 
-        /*for (var i = 0; i < fishs.length; i++)
-        {
-            var fish = fishs[i];
-
-            fish.direction += fish.turnSpeed * 0.01;
-            fish.position.x += Math.sin(fish.direction) * fish.speed;
-            fish.position.y += Math.cos(fish.direction) * fish.speed;
-
-            fish.rotation = -fish.direction - Math.PI/2;
-
-            // wrap..
-
-            if(fish.position.x < bounds.x)fish.position.x += bounds.width;
-            if(fish.position.x > bounds.x + bounds.width)fish.position.x -= bounds.width
-
-            if(fish.position.y < bounds.y)fish.position.y += bounds.height;
-            if(fish.position.y > bounds.y + bounds.height)fish.position.y -= bounds.height
-        }*/
-
-
         displacementFilter.offset.x = count * 10//blurAmount * 40;
         displacementFilter.offset.y = count * 10
 

demo/nested-content-webgl.html

@@ -194,7 +194,7 @@ <h1>SLIDER BELOW IS RENDERED IN WEBGL, DRAG IT</h1>
     });
 
     document.getElementsByTagName('html-gl')[0].addEventListener('htmlglReady', function(e){
-        alert('htmlglReady for ' + e.target);
+        alert('We got htmlglReady event');
     });
 </script>
 </body>