base index
diff --git a/player/index.html b/player/index.html
index 624eecd..d0aeabd 100644
--- a/player/index.html
+++ b/player/index.html
@@ -2,27 +2,6 @@
<meta charset="UTF-8">
<head>
<style>
-
- .bm_color1 {
- fill: #EC592B;
- stroke: #EC592B;
- }
-
- .bm_color2 {
- fill: #F8C916;
- stroke: #F8C916;
- }
-
- .bm_color3 {
- fill: #3CC6F2;
- stroke: #3CC6F2;
- }
-
- .bm_color4 {
- fill: #7A54A2;
- stroke: #7A54A2;
- }
-
body{
background-color:#ccc;
margin: 0px;
@@ -31,8 +10,8 @@
}
#bodymovin{
background-color:#fff;
- width:300px;
- height:300px;
+ width:100%;
+ height:100%;
/*width:800px;
height:500px;*/
display:block;
@@ -112,53 +91,23 @@
<script src="js/utils/expressions/LayerInterface.js"></script>
<!-- endbuild -->
<script src="js/module.js"></script>
- <script src="http://lab.nearpod.com/bodymovin/demo/colors/jscolor.min.js"></script>
<!-- <script src="bodymovin.js"></script> -->
</head>
<body>
-<div class="colorControls">
- <input class="jscolor" value="EC592B" id="color1">
- <input class="jscolor" value="F8C916" id="color2">
- <input class="jscolor" value="3CC6F2" id="color3">
- <input class="jscolor" value="7A54A2" id="color4">
-</div>
<div id="bodymovin"></div>
<script>
- var sheet = document.styleSheets[0];
- var rules = sheet.cssRules || sheet.rules;
- var color1 = document.getElementById('color1');
- var color2 = document.getElementById('color2');
- var color3 = document.getElementById('color3');
- var color4 = document.getElementById('color4');
-
-
- function changeRuleColor(rule, color) {
- rules[rule].style.fill = '#' + color;
- rules[rule].style.stroke = '#' + color;
- }
-
- function checkColor() {
- changeRuleColor(0, color1.value);
- changeRuleColor(1, color2.value);
- changeRuleColor(2, color3.value);
- changeRuleColor(3, color4.value);
- }
-
- setInterval(checkColor, 10);
-
- var bodymovinContainer = document.getElementById('bodymovin');
var count = 0;
var animData = {
container: document.getElementById('bodymovin'),
- renderer: 'svg',
+ renderer: 'canvas',
loop: true,
prerender: false,
autoplay: true,
autoloadSegments: false,
//animationData: anim2
- path: 'exports/render/gift.json'
+ path: 'exports/bm/data.json'
};
var anim;