Skip to main content
cartimundi
cartimundi
Known Participant
November 28, 2016
Answered

preview doesn't work after update An CC

  • November 28, 2016
  • 4 replies
  • 2345 views

Hello, last friday i made a very simple animation with animate cc ( something with a mask ) which was working..

so i thought after the working, to go on with it today..

but first did a upgrade of all the cc programs, include animate...and now it in't working anymore...?

an export of a earlier banner in the finder works, but that earlier file in animate doesn't preview...it should be a (new) setting..but where can i fin it?

hope anyone can reply me asap

grt cartimundi

edit@ i restart it, and when i launched the preview again, i get the message" there is a javascript problem"

after that i get the browser with a white screen..

when i preview it again, i don't see the javascript warning anymore, and directly the white screen in the browser

edit@@ when i change the template in export settings to basic ( therefor i had google adwords) i get a view of the animation..only the animation doesn't work  ( it hink because i'm working with code)

i'm using a template (getting from someone in the greensock forum)

it is in the upper selection of the timeline and is called CTA.

the code in CTA is:

if (window.devicePixelRatio > 1) { 

 

    var canvasWidth = canvas.width; 

    var canvasHeight = canvas.height; 

 

 

    canvas.width = canvasWidth * window.devicePixelRatio; 

    canvas.height = canvasHeight * window.devicePixelRatio; 

    canvas.style.width = canvasWidth+"px"; 

    canvas.style.height = canvasHeight+"px"; 

 

    //console.log(window.devicePixelRatio); 

     stage.scaleX=stage.scaleY=window.devicePixelRatio; 

}  //this.cta.on("click", function() {

//  ExitApi.exit();

//});

//TweenMax.from(this.mc_logo, 2, {y:"500",scale:"0",  ease:Back.easeOut});

//gsap timeline

tl = new TimelineMax();

tl.to(this.blok, 3, { x: 555}, "+0.2");

this.stop();

i hope someone can help me, otherwise i will downgrade and wait for a solution

    This topic has been closed for replies.
    Correct answer Colin Holgate

    thanks, i think i've got it from a greensock forum...

    ( isn't it possible to look at the template and to correct it....i don't know were i can see the template and his settings )


    That had me confused too. You can do an Export, then click on Default, and Export again. Now you'll have the two files to compare. Below <title>$TITLE</title> in the custom HTML you have these lines:

    <meta name="ad.size" content="width=$WT,height=$HT">

    <script src="https://s0.2mdn.net/ads/studio/cached_libs/createjs_2015.11.26_54e1c3722102182bb133912ad4442e19_min.js"></script>

    <script src="https://s0.2mdn.net/ads/studio/cached_libs/tweenmax_1.18.0_499ba64a23378545748ff12d372e59e9_min.js"></script>

    <script src="https://tpc.googlesyndication.com/pagead/gadgets/html5/api/exitapi.js"></script>

    <script src="$TITLE.js"></script>

    copy those lines and put them in place of this line in the exported default template:

    <!-- write your code here -->

    Save that with a sensible name and then do an import, to make it be your new template.

    4 replies

    cartimundi
    cartimundiAuthor
    Known Participant
    November 30, 2016

    ?? so i have to delete that line? that the only thing?

    cartimundi
    cartimundiAuthor
    Known Participant
    November 30, 2016

    hello..hmm..i thought it was right..but now i'm getting an error by google adwords..

    Your banner trying to get an item outside the zip folder?

    Does anybody know where it goes wrong..?

    below 2 html's, one that did succeed...and below that, the one, which has the error...hope that someone will see it...

    —————————GOOD HTML (with Animate cc 2015)————————————————

    <!DOCTYPE html>

    <html>

    <head>

    <meta charset="UTF-8">

    <title>47n-300x250stuart</title>

    <meta name="ad.size" content="width=300,height=250">

    <script src="https://s0.2mdn.net/ads/studio/cached_libs/createjs_2015.11.26_54e1c3722102182bb133912ad4442e19_min.js"></script>

    <script src="https://s0.2mdn.net/ads/studio/cached_libs/tweenmax_1.18.0_499ba64a23378545748ff12d372e59e9_min.js"></script>

    <script src="47n-300x250stuart.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.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;

      var ssMetadata = lib.ssMetadata;

      for(i=0; i<ssMetadata.length; i++) {

      ss[ssMetadata.name] = new createjs.SpriteSheet( {"images": [queue.getResult(ssMetadata.name)], "frames": ssMetadata.frames} )

      }

      exportRoot = new lib._47n300x250stuart();

      stage = new createjs.Stage(canvas);

      stage.addChild(exportRoot);

      createjs.Ticker.setFPS(lib.properties.fps);

      createjs.Ticker.addEventListener("tick", stage);

    }

    </script>

    </head>

    <body onload="init();" style="margin:0px;">

      <canvas id="canvas" width="300" height="250"></canvas>

    </body>

    </html>

    ——————————————————————————————————————————————————

    —————————WRONG (with Animate cc 2017)————————————————

    <!DOCTYPE html>

    <!--

      NOTES:

      1. All tokens are represented by '$' sign in the template.

      2. You can write your code only wherever mentioned.

      3. All occurrences of existing tokens will be replaced by their appropriate values.

      4. Blank lines will be removed automatically.

      5. Remove unnecessary comments before creating your template.

    -->

    <html>

    <head>

    <meta charset="UTF-8">

    <meta name="authoring-tool" content="Adobe_Animate_CC">

    <title>49n-300x250</title>

    <meta name="ad.size" content="width=300,height=250">

    <script src="https://s0.2mdn.net/ads/studio/cached_libs/createjs_2015.11.26_54e1c3722102182bb133912ad4442e19_min.js"></script>

    <script src="https://s0.2mdn.net/ads/studio/cached_libs/tweenmax_1.18.0_499ba64a23378545748ff12d372e59e9_min.js"></script>

    <script src="49n-300x250.js"></script>

    <script src="https://code.createjs.com/createjs-2015.11.26.min.js"></script>

    <script src="49n-300x250.js?1480513035300"></script>

    <script>

    var canvas, stage, exportRoot, anim_container, dom_overlay_container, fnStartAnimation;

    function init() {

      canvas = document.getElementById("canvas");

      anim_container = document.getElementById("animation_container");

      dom_overlay_container = document.getElementById("dom_overlay_container");

      images = images||{};

      ss = ss||{};

      var loader = new createjs.LoadQueue(false);

      loader.addEventListener("fileload", handleFileLoad);

      loader.addEventListener("complete", handleComplete);

      loader.loadManifest(lib.properties.manifest);

    }

    function handleFileLoad(evt) {

      if (evt.item.type == "image") { images[evt.item.id] = evt.result; }

    }

    function handleComplete(evt) {

      //This function is always called, irrespective of the content. You can use the variable "stage" after it is created in token create_stage.

      var queue = evt.target;

      var ssMetadata = lib.ssMetadata;

      for(i=0; i<ssMetadata.length; i++) {

      ss[ssMetadata.name] = new createjs.SpriteSheet( {"images": [queue.getResult(ssMetadata.name)], "frames": ssMetadata.frames} )

      }

      exportRoot = new lib._49n300x250();

      stage = new createjs.Stage(canvas);

      stage.addChild(exportRoot);

      //Registers the "tick" event listener.

      fnStartAnimation = function() {

      createjs.Ticker.setFPS(lib.properties.fps);

      createjs.Ticker.addEventListener("tick", stage);

      }     

      //Code to support hidpi screens and responsive scaling.

      function makeResponsive(isResp, respDim, isScale, scaleType) {

      var lastW, lastH, lastS=1;

      window.addEventListener('resize', resizeCanvas);

      resizeCanvas();

      function resizeCanvas() {

      var w = lib.properties.width, h = lib.properties.height;

      var iw = window.innerWidth, ih=window.innerHeight;

      var pRatio = window.devicePixelRatio || 1, xRatio=iw/w, yRatio=ih/h, sRatio=1;

      if(isResp) {               

      if((respDim=='width'&&lastW==iw) || (respDim=='height'&&lastH==ih)) {                   

      sRatio = lastS;               

      }

      else if(!isScale) {

      if(iw<w || ih<h)

      sRatio = Math.min(xRatio, yRatio);

      }

      else if(scaleType==1) {

      sRatio = Math.min(xRatio, yRatio);

      }

      else if(scaleType==2) {

      sRatio = Math.max(xRatio, yRatio);

      }

      }

      canvas.width = w*pRatio*sRatio;

      canvas.height = h*pRatio*sRatio;

      canvas.style.width = dom_overlay_container.style.width = anim_container.style.width =  w*sRatio+'px';

      canvas.style.height = anim_container.style.height = dom_overlay_container.style.height = h*sRatio+'px';

      stage.scaleX = pRatio*sRatio;

      stage.scaleY = pRatio*sRatio;

      lastW = iw; lastH = ih; lastS = sRatio;

      }

      }

      makeResponsive(false,'both',false,2);

      fnStartAnimation();

    }

    </script>

    <!-- write your code here -->

    </head>

    <body onload="init();" style="margin:0px;">

      <div id="animation_container" style="background-color:rgba(153, 153, 153, 1.00); width:300px; height:250px">

      <canvas id="canvas" width="300" height="250" style="position: absolute; display: block; background-color:rgba(153, 153, 153, 1.00);"></canvas>

      <div id="dom_overlay_container" style="pointer-events:none; overflow:hidden; width:300px; height:250px; position: absolute; left: 0px; top: 0px; display: block;">

      </div>

      </div>

    </body>

    </html>

    ——————————————————————————————————————————————————

    just.emma
    just.emma
    Inspiring
    November 30, 2016

    This issue is due to the <script src="https://code.createjs.com/createjs-2015.11.26.min.js"></script>

    You're already linking to the Doubleclick-hosted version of CreateJS and you should only be using that for Adwords.

    <script src="https://s0.2mdn.net/ads/studio/cached_libs/createjs_2015.11.26_54e1c3722102182bb133912ad44 42e19_min.js"></script> should replace the $CREATEJS_LIBRARY_SCRIPTS token in your template

    Colin Holgate
    Colin Holgate
    Inspiring
    November 28, 2016

    By the way, you can have both versions installed at the same time, no need to uninstall 2017 while testing 2015.2.

    cartimundi
    cartimundiAuthor
    Known Participant
    November 28, 2016

    thanks...i 'm gonna try your 1th reaction...and install the both versions...i've tried it...but i can only see the 2017 version in creative cloud install view..

    if i click previous versions, i only see a previous version of photoshop, no Adobe animate....or indesign or illustrator

    Colin Holgate
    Colin Holgate
    Inspiring
    November 28, 2016

    There is a section named Previous Versions, that's not where you should look. In the section Find Addictional Apps, on the right side there is an option for what kind of app you want, and it says Filter Apps By:. The bottom option of that list is View Previous Versions.

    That's where you'll find the previous versions. You may notice that there is a 2015.2.1 as well as a 2015.2 and 2015.1. You want to get the 2015.2 version, not the 2015.2.1.

    Colin Holgate
    Colin Holgate
    Inspiring
    November 28, 2016

    When you do a test do you see any warnings in the Output window? In the browser if you look in the error console are there any messages?

    It's quite likely that the HTML has changed, and you're publishing with the option to override the HTML turned off. Make a copy of your current HTML, and then try turning on that option, to see if that makes it work. If it does, then you can copy across any custom code you had added to the old HTML.

    If it's still not working you could install the 2015.2 version again, to confirm that it then works.

    If after all that it always works in 2015, but never in 2017, you should submit a bug report: Feature Request/Bug Report Form

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices