1

Does anyone know how to reference createjs from Flash CC 2015?

I've been trying out this tutorial page for preloadJS:

http://code.tutsplus.com/tutorials/using-createjs-preloadjs-soundjs-and-tweenjs--net-36292

but when running the next line, the JavaScript console complains that createjs is undefined:

var preload = new createjs.LoadQueue(true);

I'm new to CreateJS and I'm trying to get a good grasp of the HTML5 workflow of CC 2015.

Barett
  • 5,826
  • 6
  • 51
  • 55
object404
  • 71
  • 6
  • Can you show us your HTML file? – Barett Jul 15 '15 at 20:20
  • It's not in the HTML file, it's in the CC 2015 timeline. It's basically: `var preload; function startPreload() { preload = new createjs.LoadQueue(true); preload.on("fileload", handleFileLoad); preload.on("progress", handleFileProgress); preload.on("complete", loadComplete); preload.on("error", loadError); preload.loadManifest(manifest); }` It's this line causing the error: preload = new createjs.LoadQueue(true); – object404 Jul 15 '15 at 21:24
  • Okay, looks like I found the culprit. This isn't being auto-included in Flash CC's .html output: Anyone got ideas to force Flash CC 2015 to stick that in, aside from unchecking "overwrite HTML" in the publish settings? – object404 Jul 15 '15 at 21:52

3 Answers3

1

Okay, we figured it out:

If you don't include a bitmap image in your Flash library, Flash will not put this into the HTML file, causing references to preloadJS to fail:

<script src="http://code.createjs.com/preloadjs-0.6.1.min.js"></script>

To force it to insert include, stick in any external image, and that will force it to put in preloadJS in the HTML file. A 1x1 transparent pixel will do. Cheers all!

object404
  • 71
  • 6
1

With regards to this URL that you referenced above: http://code.tutsplus.com/tutorials/using-createjs-preloadjs-soundjs-and-tweenjs--net-36292 This link looks like it is showing the output from Flash CS6 resultant from the publishing with CreateJS Tool kit.

On the other hand FlashCC has CreateJS "stuff" already baked into the IDE. All you have to do is set up a NEW FLA for "canvas" output. This output depends on the CreateJS tool kit when publishing. In addition, there are some differences between the tool kit for CS6 and canvas output in CC. In particular is the way the two handle imagery within the Flash environment. CreateJS tool kit for CS6 will bring each image separately. In contrast to FlashCC output, if you have two or more images, the code will automatically set up an image sprite sheet and an associated JSON file to tell the code where to "cut" programmatically to get the right imagery.

A sprite sheet for multiple images really helps in loading in assets; its quicker and it reducing the total number of server requests.

The preloadjs.min.js is simply code to aide in the loading in of the imagery assets. It will automatically be put into the HTML IF the code needs it.

I do this all the time with my creative work. I'll start out with crude PSD cuts of images that i need in my final out put. I will test publish to make sure it looks right. I will then, if feasible, make SVG (scale-able vector graphics) to replace the original PNGs, GIFs or JPGs I put into the FLA. After publishing to test, and if I was to remove all images for SVGs, my HTML output would no longer need that prelaodJS file any longer. And generally speaking if I made the correct choices (SVG for images or visa versa), my file overall size would also go down.

Hope this helps,

B

Bryan Wienczkowski
  • 46
  • 1
  • 1
    No, the output above is from Flash CC 2015, not Flash CS6. Thanks for the post, Bry -- it'll help other coders who come upon this post later on! – object404 Aug 17 '15 at 03:46
0

You should have a line that says

<script src="http://code.createjs.com/createjs-2013.12.12.min.js"></script>`

See the preload.html file in your tutorial.

Barett
  • 5,826
  • 6
  • 51
  • 55
  • Yes, it already has that. Flash CC 2015's export includes that CDN library pull. createjs is also referenced correctly as per Publish settings, I have it as: })(lib = lib||{}, images = images||{}, createjs = createjs||{}, ss = ss||{}); in the generated javascript file. I'm not sure what in the line in the original post is causing the error, since it's correct based on tutorials and createjs is being referenced correctly. In fact, there's a section in the generated .html file that looks pretty similar to it. Any ideas? – object404 Jul 15 '15 at 21:08
  • We would need to see the generated html to do anything more than speculate. Can you please post a link, attachment or jsfiddle with your generated source? – Barett Jul 15 '15 at 21:22
  • Are you exporting createjs as an asset? Example: https://helpx.adobe.com/flash/using/creating-publishing-html5-canvas-document.html#Using%20JavaScript%20Code%20Snippets – Barett Jul 15 '15 at 21:56