Hi guys,we have publishers that require a self-contained html file, meaning no external scripts, images, css...Everything would be already taken care of especially with the publishing option (of a canvas document) to have JS included inside the HTML file, however I am not sure how I would be solving for changing image references in the JS to data URI:lib.ssMetadata = [ {name:"Concept1_atlas_P_", frames: [[428,1004,72,72],[0,1004,426,64],[0,0,600,500],[0,502,600,500],[0,1070,56,56]]}, {name:"Concept1_atlas_NP_", frames: [[0,0,600,500],[602,0,300,250],[0,502,600,500]]}];and everytime its' referenced like so:this.spriteSheet = ss["K8DM37_ConceptFunctionality_atlas_P_"];this.spriteSheet = ss["K8DM37_ConceptFunctionality_atlas_NP_"];Can someone please advise? Thanks!

Inspiring

Answered

Self-contained Animate CC Canvas Output

Forum|Forum|7 years ago
December 13, 2018
3 replies
1006 views

Hi guys,

we have publishers that require a self-contained html file, meaning no external scripts, images, css...

Everything would be already taken care of especially with the publishing option (of a canvas document) to have JS included inside the HTML file, however I am not sure how I would be solving for changing image references in the JS to data URI:

lib.ssMetadata = [

{name:"Concept1_atlas_P_", frames: [[428,1004,72,72],[0,1004,426,64],[0,0,600,500],[0,502,600,500],[0,1070,56,56]]},

{name:"Concept1_atlas_NP_", frames: [[0,0,600,500],[602,0,300,250],[0,502,600,500]]}

];

and everytime its' referenced like so:

this.spriteSheet = ss["K8DM37_ConceptFunctionality_atlas_P_"];

this.spriteSheet = ss["K8DM37_ConceptFunctionality_atlas_NP_"];

Can someone please advise? Thanks!

This topic has been closed for replies.

Correct answer bionicgirlny

This should work: https://medium.com/@davidwallin/how-to-get-ads-created-in-adobe-animate-cc-to-work-on-doubleclick-for-publishers-dfp-f5c…

B

bionicgirlnyAuthorCorrect answer

Inspiring

This should work: https://medium.com/@davidwallin/how-to-get-ads-created-in-adobe-animate-cc-to-work-on-doubleclick-for-publishers-dfp-f5c…

B

bionicgirlnyAuthor

Inspiring

Theoretically the above instructions should be working, but they are not for me. Anyway to change it so it doesn't display as the "correct answer"? Anyone could advice as to how to proceed when the output is images combined to Sprites and using the latest Animate CC (2019)? Thanks!

B

bionicgirlnyAuthor

Inspiring

CORRECTION for original post above, should be:

this.spriteSheet = ss["Concept1_atlas_P_"];

this.spriteSheet = ss["Concept1__atlas_NP_"];

C

ClayUUID

Legend

Even if you manage to convert all your images to URIs (which will increase their storage size by 30%), you'll still need the CreateJS runtime. Whether you include it or access it from a CDN, it's not going to be self-contained.

B

bionicgirlnyAuthor

Inspiring

Hey Clay,

the data URIs actually compress quite well, since they will be g-zipped that's not my concern. Why wouldn't the html be self-contained if the scripts are minified and included in the html?

My main concern however is how to edit the published file in order to include the data URIs properly. I tried swapping in the data URI for each sprite - for example 'data URI xyz' for 'Concept1_atlas_NP_.png', but it's not displaying the images giving me a "from origin 'null' has been blocked by CORS policy: Request header field X-Requested-With is not allowed by Access-Control-Allow-Headers in preflight response." error.

Flash Pro - HTML5 Canvas: How create all in one HTML file?

C

ClayUUID

Legend

bionicgirlny wrote
Why wouldn't the html be self-contained if the scripts are minified and included in the html?

When you publish a Canvas project, by default a JS file named createjs-2015.11.26.min.js (or similar) is created, or linked to a CDN. I suppose it's possible to manually copy everything from this file into your HTML document, though that sounds like a rather large nuisance.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded