Como subir una pagina HTML5 a blogger? Tengo una duda que se ha vuelto un problema -.-
Se que blogger solo acepta archivos .xml pero mi animacion del "boton" esta hecha en FLASH CC y la publique en HTML5 (me da esa opcion)...
asi que opte por copiar el codigo manualmente a blogger(no subirlo como plantilla)pero como soy novato en esto,dentro del codigo HTML5 hay codigo .JSON .JS que corresponden a la animacion del "boton"
No me aparece el boton solo el background -.- este es el codigo(por separado como me lo mando FLASHCC al guardar en HTML5)
HTML
Cita:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>grtgtgtgt</title>
<script src="http://code.createjs.com/easeljs-0.8.1.min.js"></script>
<script src="http://code.createjs.com/tweenjs-0.6.1.min.js"></script>
<script src="http://code.createjs.com/movieclip-0.8.1.min.js"></script>
<script src="http://code.createjs.com/preloadjs-0.6.1.min.js"></script>
<script src="grtgtgtgt.js"></script>
<script>
var canvas, stage, exportRoot;
function init() {
canvas = document.getElementById("canvas");
images = images||{};
ss = ss||{};
var loader = new createjs.LoadQueue(false);
loader.addEventListener("fileload", handleFileLoad);
loader.addEventListener("complete", handleComplete);
loader.loadFile({src:"images/grtgtgtgt_atlas_.json", type:"spritesheet", id:"grtgtgtgt_atlas_"}, true);
loader.loadManifest(lib.properties.manifest);
}
function handleFileLoad(evt) {
if (evt.item.type == "image") { images[evt.item.id] = evt.result; }
}
function handleComplete(evt) {
var queue = evt.target;
ss["grtgtgtgt_atlas_"] = queue.getResult("grtgtgtgt_atlas_");
exportRoot = new lib.grtgtgtgt();
stage = new createjs.Stage(canvas);
stage.addChild(exportRoot);
stage.update();
stage.enableMouseOver();
createjs.Ticker.setFPS(lib.properties.fps);
createjs.Ticker.addEventListener("tick", stage);
}
</script>
</head>
<body onload="init();" style="background-color:#D4D4D4">
<canvas id="canvas" width="550" height="400" style="background-color:#FFFFFF"></canvas>
</body>
</html>
<html>
<head>
<meta charset="UTF-8">
<title>grtgtgtgt</title>
<script src="http://code.createjs.com/easeljs-0.8.1.min.js"></script>
<script src="http://code.createjs.com/tweenjs-0.6.1.min.js"></script>
<script src="http://code.createjs.com/movieclip-0.8.1.min.js"></script>
<script src="http://code.createjs.com/preloadjs-0.6.1.min.js"></script>
<script src="grtgtgtgt.js"></script>
<script>
var canvas, stage, exportRoot;
function init() {
canvas = document.getElementById("canvas");
images = images||{};
ss = ss||{};
var loader = new createjs.LoadQueue(false);
loader.addEventListener("fileload", handleFileLoad);
loader.addEventListener("complete", handleComplete);
loader.loadFile({src:"images/grtgtgtgt_atlas_.json", type:"spritesheet", id:"grtgtgtgt_atlas_"}, true);
loader.loadManifest(lib.properties.manifest);
}
function handleFileLoad(evt) {
if (evt.item.type == "image") { images[evt.item.id] = evt.result; }
}
function handleComplete(evt) {
var queue = evt.target;
ss["grtgtgtgt_atlas_"] = queue.getResult("grtgtgtgt_atlas_");
exportRoot = new lib.grtgtgtgt();
stage = new createjs.Stage(canvas);
stage.addChild(exportRoot);
stage.update();
stage.enableMouseOver();
createjs.Ticker.setFPS(lib.properties.fps);
createjs.Ticker.addEventListener("tick", stage);
}
</script>
</head>
<body onload="init();" style="background-color:#D4D4D4">
<canvas id="canvas" width="550" height="400" style="background-color:#FFFFFF"></canvas>
</body>
</html>
.JS
Cita:
(function (lib, img, cjs, ss) {
var p; // shortcut to reference prototypes
// library properties:
lib.properties = {
width: 550,
height: 400,
fps: 24,
color: "#FFFFFF",
manifest: []
};
// symbols:
(lib.lekoo = function() {
this.spriteSheet = ss["grtgtgtgt_atlas_"];
this.gotoAndStop(0);
}).prototype = p = new cjs.Sprite();
(lib.lekoo1 = function() {
this.spriteSheet = ss["grtgtgtgt_atlas_"];
this.gotoAndStop(1);
}).prototype = p = new cjs.Sprite();
(lib.Animar1 = function() {
this.initialize();
// Capa 1
this.instance = new lib.lekoo1();
this.instance.setTransform(-41.7,-34,0.739,0.739);
this.addChild(this.instance);
}).prototype = p = new cjs.Container();
p.nominalBounds = new cjs.Rectangle(-41.7,-34,83.5,68);
(lib.lekoverde = function(mode,startPosition,loop) {
this.initialize(mode,startPosition,loop,{});
// timeline functions:
this.frame_4 = function() {
/* stop();*/
}
// actions tween:
this.timeline.addTween(cjs.Tween.get(this).wait(4) .call(this.frame_4).wait(1));
// Capa 1
this.instance = new lib.Animar1("synched",0);
this.instance_1 = new lib.lekoo();
this.instance_1.setTransform(-58.5,-70.1);
this.timeline.addTween(cjs.Tween.get({}).to({state :[{t:this.instance}]}).to({state:[{t:this.instance_1}]},4).wait(1));
this.timeline.addTween(cjs.Tween.get(this.instance ).to({_off:true,x:-58.5,y:-70.1},4).wait(1));
}).prototype = p = new cjs.MovieClip();
p.nominalBounds = new cjs.Rectangle(-41.7,-34,83.5,68);
(lib.lekonormal = function(mode,startPosition,loop) {
this.initialize(mode,startPosition,loop,{});
// Capa 1
this.instance = new lib.lekoo1();
this.instance.setTransform(-41.7,-34,0.739,0.739);
this.instance_1 = new lib.lekoverde();
this.timeline.addTween(cjs.Tween.get({}).to({state :[{t:this.instance}]}).to({state:[{t:this.instance_1}]},1).wait(1));
}).prototype = p = new cjs.MovieClip();
p.nominalBounds = new cjs.Rectangle(-41.7,-34,83.5,68);
// stage content:
(lib.grtgtgtgt = function(mode,startPosition,loop) {
this.initialize(mode,startPosition,loop,{});
// Capa 1
this.contacto = new lib.lekonormal();
this.contacto.setTransform(234,195);
new cjs.ButtonHelper(this.contacto, 0, 1, 1);
this.timeline.addTween(cjs.Tween.get(this.contacto ).wait(26));
}).prototype = p = new cjs.MovieClip();
p.nominalBounds = new cjs.Rectangle(467.2,361,83.5,68);
})(lib = lib||{}, images = images||{}, createjs = createjs||{}, ss = ss||{});
var lib, images, createjs, ss;
var p; // shortcut to reference prototypes
// library properties:
lib.properties = {
width: 550,
height: 400,
fps: 24,
color: "#FFFFFF",
manifest: []
};
// symbols:
(lib.lekoo = function() {
this.spriteSheet = ss["grtgtgtgt_atlas_"];
this.gotoAndStop(0);
}).prototype = p = new cjs.Sprite();
(lib.lekoo1 = function() {
this.spriteSheet = ss["grtgtgtgt_atlas_"];
this.gotoAndStop(1);
}).prototype = p = new cjs.Sprite();
(lib.Animar1 = function() {
this.initialize();
// Capa 1
this.instance = new lib.lekoo1();
this.instance.setTransform(-41.7,-34,0.739,0.739);
this.addChild(this.instance);
}).prototype = p = new cjs.Container();
p.nominalBounds = new cjs.Rectangle(-41.7,-34,83.5,68);
(lib.lekoverde = function(mode,startPosition,loop) {
this.initialize(mode,startPosition,loop,{});
// timeline functions:
this.frame_4 = function() {
/* stop();*/
}
// actions tween:
this.timeline.addTween(cjs.Tween.get(this).wait(4) .call(this.frame_4).wait(1));
// Capa 1
this.instance = new lib.Animar1("synched",0);
this.instance_1 = new lib.lekoo();
this.instance_1.setTransform(-58.5,-70.1);
this.timeline.addTween(cjs.Tween.get({}).to({state :[{t:this.instance}]}).to({state:[{t:this.instance_1}]},4).wait(1));
this.timeline.addTween(cjs.Tween.get(this.instance ).to({_off:true,x:-58.5,y:-70.1},4).wait(1));
}).prototype = p = new cjs.MovieClip();
p.nominalBounds = new cjs.Rectangle(-41.7,-34,83.5,68);
(lib.lekonormal = function(mode,startPosition,loop) {
this.initialize(mode,startPosition,loop,{});
// Capa 1
this.instance = new lib.lekoo1();
this.instance.setTransform(-41.7,-34,0.739,0.739);
this.instance_1 = new lib.lekoverde();
this.timeline.addTween(cjs.Tween.get({}).to({state :[{t:this.instance}]}).to({state:[{t:this.instance_1}]},1).wait(1));
}).prototype = p = new cjs.MovieClip();
p.nominalBounds = new cjs.Rectangle(-41.7,-34,83.5,68);
// stage content:
(lib.grtgtgtgt = function(mode,startPosition,loop) {
this.initialize(mode,startPosition,loop,{});
// Capa 1
this.contacto = new lib.lekonormal();
this.contacto.setTransform(234,195);
new cjs.ButtonHelper(this.contacto, 0, 1, 1);
this.timeline.addTween(cjs.Tween.get(this.contacto ).wait(26));
}).prototype = p = new cjs.MovieClip();
p.nominalBounds = new cjs.Rectangle(467.2,361,83.5,68);
})(lib = lib||{}, images = images||{}, createjs = createjs||{}, ss = ss||{});
var lib, images, createjs, ss;
y dentro de una carpeta llamada "images"
.JSON
Cita:
y obviamente la imagen .PNG{"images": ["images/grtgtgtgt_atlas_.png"], "frames": [[0,0,117,97],[0,99,113,92]]}
tengo esos archivos... quisiera que fueran uno solo... los junte manualmente pero no aparece el boton
salu2
