Canvas, Webgl or ActionScript 3.0

Hi all

A question may be a bit silly... but I started (animate CC 2015).

In which cases do you use Canvas, Webgl or even ActionScript 3.0?

Thank you for your help

Nice day

If you want to do something that can play in a browser on mobile devices, you must use HTML5 Canvas and WebGL. If you are mobile applications, or if you do something to play in desktop browsers, you would use AS3.

There are other cases where you would use AS3. For example, if you create animations you want to export to video, you'd in a document of AS3.

Tags: Adobe Animate

Similar Questions

  • To pass the configurator...

    It's like a progress-update / introduction to tell you he there are users who are faced with the need for the passage of the Extension Builder 3 Configurator.    I tried and even paid for the subscription of one year of Extension Builder 2 with Flash Builder 4.6, but I could only build the samples and try to replace it with a basic script, and I don't think they were HTML5 by whom...     I'm not really a coder/programmer.

    So, last year, I jumped in the Configurator 3 and it was great, I could in my plugin that I created in VBA for CorelDraw Photoshop CS6 and CC to work because, initially, I had been recording my actions to my work in photoshop and action sets for release on the port.  (in my supposed demographic or the market for my automation it was for most of the actions and a standalone program, nothing for CorelDraw).     So me and my partner who already had Corel VBA framework in place, and I jumped right in macro record/debug and build a GUI, etc. in VBA for the draw...   With Configurator then I could finish and do the same actions that I had most of them already in photoshop - then export easily with xtools my actions to .jsx files, I already had built most of the user interface for the version of Corel, which was fall 2012 and mid 2013 after only a few weeks so I was able to build this Panel massive almost like my plugin for Corel... within Photoshop as a unique .zxp that installs at the TIME CS6 and CC.

    Smooth... or so I thought.   Well one of the things that bothered me was I couldn't do both things in the configuration of the Configurator as with VBA (fields to enter values, then enter the code and get the values of GUI etc.) -, but even when I'm not much more than a programmer... most of my stuff is buttons that perform some types of process to the art of preparing for printing.   My specialty is in the graphic design and production pre-press etc, color science / theory and the only surface level on the math/programming for the moment, but I love it because I am a perfectionist and a technician, but the frustrations are endless when you do not know how to do something with a language of coding etc... and I have no idea on javascript in the first place let alone HTML5...  I save the actions and the build being debugged in a way by testing, then export actions in the form of .jsx files.

    Now in the Configurator, that I could do really cool as stuff using the drop down panels/containers containers to create a fake but usable... before GUI script variable selection I was doing this I would have just several rows of buttons to select the one with the variable you need... but that is confusing.    Of course common sense is using an input field in the GUI and whose field of the entry to update your script.    I'm not at that level yet.     I'm at the level where I can take actions or .jsx files as xml... files use find/replace to change all my variables and save them as separate... using the same key files, it works very well in the Configurator placed in containers of mutiple-page... you get the same effect when you choose the page from the drop - label the value to the variable.

    I pulled out my photoshop extension last year in the summer, but due to some demographic and other market variables, I decided to take it down after only a handful of users has been sold to build requested additional features and a series of training together to go with it.   Again, be a perfectionist I felt my extension had this tab any other process for the user population to make it easier to use as well as to work for those who have a lower plugin initial understanding, or involved - more like afflicted 1-click of a very long process of exploitation of other things throughout to finish which normally can be done manually in the other tabs.

    Well one of the problems in some tests... and with the help of advice from Configurator... it was determined that all the "script file" buttons call a .jsx file have a 5 minute delay.    If it is a long process and the system of the user he takes after 5 minutes... it stops there where it was in the script... does not end.

    OK, well we have found a workaround... you use the "script" buttons to call the files from the current directory of extension .jsx.    I didn't understand how to make smart as if it were the case, so I have to make 2 versions of the. ZXP now for CS6 and CC - and also another 2 for Mac.    Before I had 1 job file .zxp for Mac/PC and CS6 / CC.   The Configurator 3.

    Of course I lived and build on almost made patches, replacing all the buttons of my gui with buttons of script can replace images of the graphical interface, using the script and shouting from the buttons .jsx files.      Grand... thought I was almost done building the new upgrade and re-lance version of my extension... then I started reading all this new Flash panel killed and panels Configurator dead and HTML5 with Extension Builder 3...   supposed to be the new photoshop will NOT OVERWRITE the current 14.2 Photoshop, so that anyone who uses my extensions for 14.2 CC will continue to work... the new photoshop CC (15?) will be an additional installation?      I hope so.   Because I'm learning right now... I have installed the Java sdk, the program Eclipse and Extension Builder 3 is located in a folder that I need to know where to put it to get it open so I can start watching videos and demos etc. of construction.

    The huge amount of work I know is going to be a few things like... get all my images in custom gui related to buttons, with multiple labels, namely how to call the switchis .jsx files and to install with the Panel or some etc. wear everywhere is basically only of those things... but I don't know anything about HTML5 or javascript etc as I mentioned right level of the surface of things.    Now, I've built a massive expansion, but which now makes it a pain to have to put it anywhere and learn all this other stuff.

    However, I understand that by learning this, I'll turn myself to jump into the web, etc. and especially for a deeper level of coding the PS and Illy extensions, Indesign etc... and of course the additional capacity with Eclipse and javascript/html5, I guess for me to get really wild with the GUI and the variables/sliders etc etc.      But I don't want to be forced into this that I need time for the learning curve.    I want to continue and get out my new update for my extension of photoshop, maybe just for 14.2 CC for the moment that I keep getting the code has worked other installers .zxp (now need multiple to call .jsx for mac/pc cs6/cc folder locations) - but that's fine.

    Now... it's not currently available 'live' online to buy, but if you want to see which version 1.0 of my extension was like last summer in the first version... Here's a youtube for video of my partner link to make an introduction.    You can see that this is a complex with a GUI Panel custom images... simple bearings and signs of support, and the buttons as I mentioned call .jsx files I created for my actions .jsx conversions then manipulations via some code of surface-level replacement.

    If there is no question in this discussion and I want people to realize that it is what others are going through... made me all creating great panels easily with Configurator I picked built my sign in a few months, its such a smooth "workflow" for someone familiar with their actions... to make images and import them to your recording buttons connected to your conversion .jsx rate... but then Adobe pulled the carpet out under me with this end-of-flash-based-panel-support stuff.

    What happens if I try to release suite CS6 CC 14.2 panel upgraded or for my extension to restart so I have to go live again, and then when Adobe released the new update PS CC - who is NEWLY SUBSCRIBERS - they are not the OLD 14.2 PS.     So they will not be able to install the Configurator my extensions if they do not have the correct previous photoshop?

    So the main question is... how much work do I have to go through just to PORT my CONFIGURATOR extension - that uses GUI buttons to call. JSX files... on HTML5 and/or Extension Builder 3?    I don't expect anyone to do something for me... I will follow all links and assistance offered to the other discussions and video tutorials, learn everything I need... as I have said so far I have installed eclipse and works because I had to install the Java SDK... Extension Builder zip is unzipped but I think that you just put the file somewhere.  So I can start a project after the video tutorials and try to edit / build... as I said I don't know how to surface-level program so I would first want to just copy the way I have my Panel Configurator - custom gui buttons that call for now .jsx files.     I guess it seems that it is better some things I've read that you can contain all the .jsx files automatically and such or it is no longer protected in this way, I don't know.    Is not a type "Please help" issue, but a "I'm in this boat with you now" kind of others out there similar to me.   I'm sure there are many people who find it easy to type "hack-job" of building panels with configurator and then it's like oh it's completely useless, that you spent all year last of your life, learning and building.

    Thanks for any time or assistance... and actually move forward through this sharing discussions, etc.

    -Jeff aka separator full-spectrum / co-author of SimpleSeps Raster for CorelDraw and author of SimpleSeps Raster for Adobe Photoshop

    https://www.YouTube.com/watch?v=J35d1GMQpuc

    http://Adobe.LY/1j3U27z

    http://Adobe.LY/1nrrQjg

    Thanks to the creators of Photoshop and Configurator for allowing me to get this good and also thank you now to th Hallgrímur. Cap to help me get into HTML5 trying to make the transition, now I know I will learn more and be better for it because it will make me learning javascript and html5 and even web stuff (canvas webgl Yes!)   I'll post that I progress and try to help others with what I learn as extension developer.

    Hi Jeff,

    writing for a long time but I have the side "we share the same boat" :-)

    I may be wrong but with optimism the migration path of the Configurator panels HTML (whether you use Extension Builder 3 or something else) should not be very hard. But of course it depends on, but not impossible.

    I can't say, actually, since I used Builder 2 Extension and not the Configurator (one of my very talented friends used for this utility of machine tool of channels ). But personally I had to learn ActionScript from zero just for the fun of building the Flex panels in CS4 (I'm not a programmer), and I ended up forgetting all about Flex in CS6 when the HTML thing became public. Bad times, at the time, so eventually, I understand your feelings now.

    But.

    As long as your GUI is on the buttons trigger scripts (in other words, the clickable things with images on, bearings, etc.), and you do not need the Panel doing all heavy lifting in JS (implementing MVC patterns with AngularJS or something like that - looks like I'm good to talk about these things, but I just started learning ;-) it * could * be easier than you think.)

    Basically, an HTML Panel is 'just' an HTML page that is supported by Javascript. Nice done about HTML is that there is tons of information about it - that is what tags to use, how to style, etc. It's 'just' a question find and learn the pieces you need to know.

    (two already 'just'...)

    Now, CSInterface (JS glue between panels and Photoshop) provides an evalScript() function, which is what its name suggests. Configure you the Panel so that when a user clicks A button, a JSX A function is evaluated (by the way or not data down to the JSX) and if you want a reminder executed. This is 'just'. (three 'just'...)

    I disorders found myself so I put in place a list of Quick panels HTML tips that you might find useful, subjects covering basic example how to include several JSX, how to send complex HTML to JSX and vice versa, data and settings etc. I could be a starting as an FAQ point.

    I do not use Extension Builder myself but reusable code - it's all the same.

    I would say to build a panel of test with buttons (no matter how much style and ugly) that connects your JSX functions, and then try to design the look & feel later when everything is wired more or less correctly.

    After all, we are working with a technology that is completely green (promising but green), so there is no real no matter which set of recommended practices - we are all 'just' learning (and four ;-))

    Kind regards

    Davide Barranca

    ---

    www.davidebarranca.com

    www.cs-extensions.com

  • Source code toolkit

    In February, Richard Bair mentioned in a post that the source code of the Toolbox would become available (http://fxexperience.com/2012/02/a-short-tour-through-javafx-ui-common/). Is that still the case, and when will it be available?
    Maybe if I find the time to play with it, I could experiment with it to see if a WebGL implementation would be difficult?
    This would make possible scenario to create real-world applications in a modern browser where the DOM is not necessary. One of the scenarios would be GWT and run all the code of java on the client (actually a heavy client compiled in javascript). Or have a version (like jsf) server-side but with only the rendering on the client side (thin client). The client lightweight websockets can be used to send commands to render the server to the client (on business networks latency should not be a problem too). I don't know if it's a good idea or someone else is already busy with her.

    All great ideas. Thank you for the patience, sometimes wheels move slowly in a large organization.

    I started (and in fact 2 years we have prototyped) the idea of using the dom / svg / canvas / webgl to render on the client FX, as no native window was necessary. It's something I'm very interested for reasons of safety (long story), and also for the user experience reasons (more like a real web application). However, it still requires a plugin because it requires a JVM.

    Using GWT works around the problem of the FMV - sort of. You don't always have all of the JRE available, and some semantic case corner is not the same. And GWT can produce large files of JS. But it gets you more or less here.

    The application running on the server and sending commands draw down via web shots is another very interesting use cases, in large measure because this action solves the problem of large file GWT. However it will not support the offline sort, shape, or form, so probably it is not really useful in the delivery of web sites to mobile with intermittent connectivity devices (or data caps!).

    IF ONLY THE WEB HAD BYTE CODES! We could then bring Java to something compatible semantically rather than JS and then use the browser for everything (networking, graphics, etc.). In other words, treat it as a BONE more some launcher within various operating systems. Really, I think it's the best account approach to all needs and tradeoffs, but GWT is now the closest, we have this idea.

    In any case, I hope that we can give more information about OS soon enough. If you were very intrepid, you may decompile the sources and provide your own implementation of glass and pipeline Prism - but I don't know if that goes against any terms of use or anything like that (no idea). And it would really gutsy and courageous and likely to break horribly in the coming months, because we are about to refactor the implementation significantly.

    Richard

  • Video loading extended canvas

    So, after a lot of research here I see that the only way to load a video is using the dom manipulation and creating a tag video. And I'm assuming that use CSS to position on your canvas, as if it were part of it.

    Source: How to load the video in Html5 Canvas?

    My other questions include, this work for the addition of let's say a youtube video? I think that Yes cause you're just manipulation of the dom.

    Second and more important issue how to differentiate the code which will work out cloth vs Flash? Is there like a documentation on the reference of the canvas code?

    How can I just write in javascript, and everything will be fine?

    If you work in a HTML5 Canvas and WebGL FLA, you can use Javascript. If you work in an AS3 FLA, you can use ActionScript. If you convert a type to another, the code gets commented on.

  • HTML 5 output & Actionscript Question...

    Hello

    I was wondering if Actionscript is still a viable language?  It will work with HTML 5 output?  (A kind of conversion at the time of publication)?  Or maybe I'm better using JavaScript?  I'm a total newbie when it comes to Animate/Flash.  I used Flash back in the days of Macromedia, but ever since!  I did a job on board animate.  In any case, to stay on the point: what would be the ideal way to script in Animate?

    Thank you

    Jonny

    AS3, this is what you would use for (other than mobile) web applications, desktop AIR apps, apps Android and iOS. At the moment the majority of what people will use is AS3.

    If you do HTML5 Canvas and WebGL, you have no choice but to use Javascript.

    So, the ideal way to script depends on what you are doing.

  • Cannot use the WebGL with PlayBook frame buffer

    I went through the lessons on http://learningwebgl.com/lessons/, but could not get the demo 16 lesson to display on my PlayBook (OS 2.1.0.840). I find myself with an empty white canvas. The demo works fine in Chrome. According to the Documentation of WebGL Blackberry , I think that the functions of WebGL used in the demo are all supported. According to the web Inspector, there is no error on the page.  Does anyone know why it does not display the Web? My guess is that the problem revolves around a problem memory frame buffer that I was not able to get any frame buffer code to render on the PlayBook. Anyone used framebuffers successfully on a PlayBook?

    Thank you!

    Hello.

    Are you a person performs the lessons in the browser or they packaged in an application? I tried here, with the PlayBook on OS 2.0.1.358 and it seems to work well in the browser as shown in the screenshot below. The first was the notification that the page uses WebGL, so I need to give permission and then it worked really well on the device!

  • Animate CC webgl: doesn't understand not all images in assets/Name_atlas.png

    I create a project to animate CC html5 canvas Document.The generated images/Name_atlas_.png is 4096 * 4096, it's enough for me.

    However, after having converted to Document WebGL (preview), the new assets/Name_atlas.png generated is just 2048 * 2048 and most of the images have been lost.

    How can I solve it?

    With canvas just spritesheet is in RAM and can be any size. With WebGL spritesheet texture has if sit in GPU memory, and many devices have a limit of 2048 x 2048. Some are limited to 1024 x 1024.

    You should get more than a PNG however. You see only an image file? If you have any an element that is more than 2048 alone, you will need to rethink things and what to do to be small enough to fit on a spritesheet 2048 x 2048.

  • Animate CC (HTML5 Canvas) chronology cannot choose stream in properties > Sync to sound

    Hello

    I have a problem. Animate CC (HTML5 Canvas) timeline is not Stream select Properties > Sync for the sound.

    This section examines passive. Why would it be.

    Thank you.

    Screen Shot 2016-10-03 at 11.39.44.png

    HTML5 Canvas only supports the synchronization of its event. You can use a document of ActionScript 3.0 for audio streams.

  • Do html5 canvas documents.

    My company does a lot of e-Learning that requires our content is 508 compliant (accessible to people with visual impairments).  With actionscript, we could either give back the focus to items on the screen (text, graphic, button, etc.) with actionscript (tabIndex, accProps) or if it for some reason any doesn't work, we could use the accessibility window to force the screen reader to search for items.  Now, when you create a html5 canvas, the accessibility window is gone all together.  I tried to find references to an equivalent code in JS or html that would replace the tabIndex and accProps scripts that we used before to make our content accessible, but have had no luck.  In the Adobe documentation for accessibility in Animate, they say if you want accessibility, design for actionscript 3 What kind of defeats the purpose of using Animate to convert our content which requires 508 compliance.  He saw someone about how this could be achieved in animate when creating a canvas of html5?

    The problem is that HTML5 canvas text cannot be read by screen readers because once it is made, it's just pixels, not text. To work around this problem, you have to hide the content text 'under' the canvas element, where it is invisible to the user, but accessible by screen readers. Googling "html5 canvas 508" brings up some read about it, like this: https://www.paciellogroup.com/blog/2015/02/html5-canvas-sub-dom/

    Or you can simply include the full text of the lesson in PDF format and call it the version 508 compliant. It's legal!

  • Animate CC - HTML 5 Canvas - on the mouse wheel event necessary Javascript code

    Hi all

    I'm from AS3 transition to JavaScript and it is harder than I thought.

    Can anyone suggest code JS code on the mouse wheel event timeline will play?

    Or even better on scroll down it moves forward and upward timeline scrolling back?

    Very appreciated

    Simon

    document.getElementById('canvas').addEventListener ('mousewheel', f.bind (this));

    document.getElementById('canvas').addEventListener ('DOMMouseScroll', f.bind (this));

    {function equation

    e.Detail

    }

    [left ActionScript 1 and 2 for Adobe host CC - general]

  • Adapt the JSFL Scripts useful for animating/canvas

    As a programmer who likes to automate many I have used/made a lot for Flash jsfl scripts in the past.

    Some new users do not know that these scripts can be easily adapted for Javascript/canvas.

    For example:

    With a selected calendar, try this:

    /*

    * [KC] Add stop frames

    * By Kevin Cao (http://kevincao.com)

    * 2005.6.19

    */

    Insert keyframes with a shutdown command in each image selection

    var dom = fl.getDocumentDOM)

    var timeline = dom.getTimeline)

    var selection = timeline.getSelectedFrames)

    var numSelections = selections.length

    for (s = 0; s < numSelections; s += 3)

    {

    cLayer = selections [s]

    startFrame = selections [s + 1]

    endFrame = selections [s + 2]

    timeline.setSelectedFrames([cLayer,startFrame,endFrame],true);

    timeline.convertToKeyframes ();

    for (f = startFrame; f < endFrame; ++ f)

    {

    Timeline.Layers [cLayer] .frames [f]. ActionScript = "this.stop ();";

    }

    }

    JSFL doesn't care if you use actionScript 'real '.

    Thought that may be useful.

    Hi moccamaximum ,

    Thank you for taking the time to share this information with the community. Very much appreciated.

    Remember that even if no one answers, there are a lot of people who visit this forum just to get information without ever answering.

    Thank you

    Preran

  • Drag and Drop for HTML5 Canvas

    Why can I use the drag and drop snippets for ActionScript 3.0 document, but when I try to do for a HTML5 canvas document that is not yet show the object instance in the browser?

    At the risk of pointing out the obvious: because the HTML5 documents do not work with ActionScript.

  • How to convert (Action Script 3.0) .as files to work on HTML5 Canvas?

    So I did an ActionScript 3.0 game in CC animate using files as with packages and classes rather than use actions for example

    There is a Game.as file:

    package
    {
      import flash.display.MovieClip;
      import flash.events.Event;
      import flash.utils.Timer;
    
      public class Game extends MovieClip
      {
      static var ship:MovieClip;
    
      function Game()
      {
      ship = new Ship(stage, 200, 100);
      var spawnTimer = new Timer(3000);
      spawnTimer.addEventListener("timer",spawn);
      spawnTimer.start();
      }
    
      function spawn(e:Event):void
      {
      var enemy = new Enemy();
      stage.addChildAt(enemy, 1);
      }
      }
    }
    

    I used the commands > convert to other Formats of Document and you select HTML5 Canvas. When I run the project all the code does not work because the .as files are not related to the project (because it is a HTML5 Canvas). So, how can I convert my project an ActionScript 3.0 for a HTML5 Canvas so that the scripts work in the game? Should I use. JSFL files? How to bind the?

    Thanks in advance.

    There is no external class in HTML5 Canvas Javascript file. Also, the variables are not typed. Symbols belong to the library, which will be shortened to 'lib '. You can define listeners on the createjs. Ticker, but using setTimeout() is a simple alternative.

    In view of this, your AS3 could be something like this:

    boat var = new lib. Ship();

    Ship.x = 200;

    Ship.y = 100;

    stage.addChild (ship);

    setTimeout (spawn, 3000);

    spawn() {} function

    enemy of the var = new lib. Enemy();

    Enemy.x = Math.random () * 500;

    Enemy.y = Math.random () * 400;

    stage.addChildAt (enemy, 1);

    setTimeout (spawn, 3000);

    }

  • Cannot add more than one script function to my HTML5 Canvas to animate CC

    I built my project using HTML5 canvas. Everything worked fine until I tried to add a proofreading function to the announcement. Not only it doesn't, actually if I can no longer see the announcement (specifically a gray area appears on the announcement and shows nothing). I was able to add the function stop easily, creating a layer of separate action, make a keyframe and adding the this.stop () to the action.

    The problem when I try to add another code in after it. At first I thought I was just add inefficient code, so I tried to do a simple click to go to the webpage for action, but that would not work either. Any code I want to add this.stop () in addition to the code would kill the ad.

    Does anyone have any suggestions as to why this is?

    Using animate CC 2015.1 edition. Windows 10.

    albertos77769384 wrote:

    function fl_ClickToGoToWebPage_6(event:MouseEvent):void

    {

    navigateToURL (new URLRequest ("http://www.adobe.com"), '_blank');

    }

    It was just the basic action script that should have let me add a link to a button.

    ActionScript does not work using HTML5 Canvas, for what I hope are obvious reasons. There is no such function as navigateToURL() in JavaScript. The equivalent in JS is window.open() to create a new window, or window.location.href = "bla.com" to replace the URL of the current page.

  • How to convert swf Actionscript 3 in HTML5

    Hi guys,.

    I have experience with Flash/Animate but not HTML5. I was under the impression that Animate has the ability to export or convert any project of HTML5 or even Android or iOS. However, I could not find a way to do it. Whenever I try to convert or export, my project loses all its features interactivity Actionscript like buttons or drop-down list boxes.

    Do what I have to start a project as an HTML5 project from the outset? I need to program in JavaScript instead of Actionscript?

    You can convert your AS3 FLA to be an HTML5 Canvas in Florida who has to keep all the layers and symbols, but it will comment all ActionScript. JavaScript have usually the classes and packages, so more likely, you will need to rewrite all the code in Javascript in the timeline panel.

    There are other changes you will have to do too much, for example, sound should be the event and cannot be Stream and numerous color effects and filters do not work.

Maybe you are looking for