I build Animate CC HTML5 canvas ads, and we have a new vendor who needs all assets saved in the root folder. When I change this publish setting in Animate, only the stage color loads. We have a test site, so I'm posting the and viewing from a server, not locally.
I'm only changing the publish destinations from the default "/images" (image assets) and "/libs" (CreateJS assets) to "/" for both, and when I publish, the files end up in the correct root folder, but the js can't find them. Everything loads fine when I switch back to using asset folders.
This "new" js code includes 60+ additional lines, including some about fonts, but I'm not using live type. The HTML is the same either way. We don't use spritesheets.
THIS CODE WORKS - AFTER the "// symbols:" LINE, CODE MATCHES IN BOTH FILES.
(function (lib, img, cjs, ss) {
var p; // shortcut to reference prototypes
// library properties:
lib.properties = {
width: 1200,
height: 627,
fps: 24,
color: "#FFFFFF",
opacity: 1.00,
manifest: [
{src:"images/FRWL_DBA_1200x627_B1bkgd.jpg?1546039438038", id:"FRWL_DBA_1200x627_B1bkgd"},
{src:"images/FRWL_DBA_1200x627_B1CTA.png?1546039438038", id:"FRWL_DBA_1200x627_B1CTA"},
{src:"images/FRWL_DBA_1200x627_B1HLacross.png?1546039438038", id:"FRWL_DBA_1200x627_B1HLacross"},
{src:"images/FRWL_DBA_1200x627_B1HLget.png?1546039438038", id:"FRWL_DBA_1200x627_B1HLget"},
{src:"images/FRWL_DBA_1200x627_B1HLnow.png?1546039438038", id:"FRWL_DBA_1200x627_B1HLnow"},
{src:"images/FRWL_DBA_1200x627_B1logo.png?1546039438038", id:"FRWL_DBA_1200x627_B1logo"},
{src:"images/FRWL_DBA_1200x627_B1ppl.png?1546039438038", id:"FRWL_DBA_1200x627_B1ppl"}
]
};
lib.ssMetadata = [];
// symbols:
THIS IS THE "NEW" CODE THAT DOESN'T WORK:
(function (lib, img, cjs, ss) {
var p; // shortcut to reference prototypes
lib.webFontTxtInst = {};
var loadedTypekitCount = 0;
var loadedGoogleCount = 0;
var gFontsUpdateCacheList = [];
var tFontsUpdateCacheList = [];
// library properties:
lib.properties = {
width: 1200,
height: 627,
fps: 24,
color: "#00CC66",
opacity: 1.00,
webfonts: {},
manifest: [
{src:"/FRWL_DBA_1200x627_B1bkgd.jpg", id:"FRWL_DBA_1200x627_B1bkgd"},
{src:"/FRWL_DBA_1200x627_B1CTA.png", id:"FRWL_DBA_1200x627_B1CTA"},
{src:"/FRWL_DBA_1200x627_B1HLacross.png", id:"FRWL_DBA_1200x627_B1HLacross"},
{src:"/FRWL_DBA_1200x627_B1HLget.png", id:"FRWL_DBA_1200x627_B1HLget"},
{src:"/FRWL_DBA_1200x627_B1HLnow.png", id:"FRWL_DBA_1200x627_B1HLnow"},
{src:"/FRWL_DBA_1200x627_B1logo.png", id:"FRWL_DBA_1200x627_B1logo"},
{src:"/FRWL_DBA_1200x627_B1ppl.png", id:"FRWL_DBA_1200x627_B1ppl"}
]
};
lib.ssMetadata = [];
lib.updateListCache = function (cacheList) {
for(var i = 0; i < cacheList.length; i++) {
if(cacheList[i].cacheCanvas)
cacheList[i].updateCache();
}
};
lib.addElementsToCache = function (textInst, cacheList) {
var cur = textInst;
while(cur != exportRoot) {
if(cacheList.indexOf(cur) != -1)
break;
cur = cur.parent;
}
if(cur != exportRoot) { //we have found an element in the list
var cur2 = textInst;
var index = cacheList.indexOf(cur);
while(cur2 != cur) { //insert all it's children just before it
cacheList.splice(index, 0, cur2);
cur2 = cur2.parent;
index++;
}
}
else { //append element and it's parents in the array
cur = textInst;
while(cur != exportRoot) {
cacheList.push(cur);
cur = cur.parent;
}
}
};
lib.gfontAvailable = function(family, totalGoogleCount) {
lib.properties.webfonts[family] = true;
var txtInst = lib.webFontTxtInst && lib.webFontTxtInst[family] || [];
for(var f = 0; f < txtInst.length; ++f)
lib.addElementsToCache(txtInst[f], gFontsUpdateCacheList);
loadedGoogleCount++;
if(loadedGoogleCount == totalGoogleCount) {
lib.updateListCache(gFontsUpdateCacheList);
}
};
lib.tfontAvailable = function(family, totalTypekitCount) {
lib.properties.webfonts[family] = true;
var txtInst = lib.webFontTxtInst && lib.webFontTxtInst[family] || [];
for(var f = 0; f < txtInst.length; ++f)
lib.addElementsToCache(txtInst[f], tFontsUpdateCacheList);
loadedTypekitCount++;
if(loadedTypekitCount == totalTypekitCount) {
lib.updateListCache(tFontsUpdateCacheList);
}
};
// symbols:
Has anyone else had this problem? Is there something I'm missing in Animate, or do I have to manually adjust the code for the js to find the images? I couldn't find anything on the Adobe site saying extra steps were needed, and I'm only a novice coder.
THANKS!
Sheesh. After searching and messing with code for hours, I found the answer 20 minutes after this post. Hopefully this helps someone else...
It WAS something I missed in Animate:
Apparently it's mandatory in Animate CC to use the built-in toggle buttons—the folder icons next to the text fields in the publish settings—and it'll either save assets in folders or at the root, or not at all if you uncheck the boxes. You can't choose your own path without breaking the system.
My mistake was changing the path myself. It now works swimmingly, and oddly enough, I feel stupid and smart at the same time.