HTML5 canvas making reference to a function in different image scripts

Similar Questions

• HTML5 Canvas: appeal to a parent function

  Hey guys

  I am currently hitting my head against a brick wall, trying to call the function with the HTML5 Canvas parent.

  I have the following code on the stage:

  function fromStage()

  {

  Console.log ("it is on the stage");

  }

  fromStage();

  This correctly generates this message to the console in the browser.

  However, I have a button in a movie clip that I want to call this function, my code in this clip is as follows:

  this.theButton.addEventListener ("click", fl_MouseClickHandler.bind (this));

  this.theButton.name = 'information ';

  function fl_MouseClickHandler (e)

  {

  this.parent.fromStage ();

  }

  However, this doesn't seem to work, any ideas?

  Thank you

  use:

  on the scene:

  this.fromStage = function)

  {

  Console.log ("it is on the stage");

  }

  this.fromStage ();

   code in that movie clip is as follows:
  

  this.theButton.addEventListener ("click", fl_MouseClickHandler.bind (this));

  this.theButton.name = 'information ';

  function fl_MouseClickHandler (e)

  {

  this.parent.fromStage ();

  }

• How to call a function of my html code to js created by animate cc, I had used 'exportRoot.functionName' and said this function in my document of flash pro with html5 canvas, but now on cc animate this way doesn't work.

  My html code created by animate cc was changed to php for me, because I send and received variables via get and catch the cookies and much more. the function that I used to call function on my .fla of the document is passId() and it worked before when animate was Flash pro with html5 canvas.

  

  And function of .fla, I frame_0 only assign to the variable "id_usuario", this is the feature on fla:

  

  First of all, the title of your thread is horrible. Titles are supposed to be securities, not paragraphs.

  As for your problem, you are probably trying to call catchIdUser before it is defined. handleComplete() is raised when the content is ready to run. He did not actually yet. I guess you should have script code call the function of window parent, not the other way around.

• 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.

• HTML5 Canvas (in Flash (CC) button defective functionality - more States out of service do not work

  I've searched and searched and I can't find a solution.

  In CC Flash, creating in a canvas of Actionscript 3.0, buttons work as expected. Up, more, Down, and Hit States desired to produce results.

  I am creating a lively HTML5 Web page and none of the buttons work as expected. Here are the flaws:

  1. There is no hand when scrolling on a button. It is a problem because there are several objects on stage, of which only half are buttons. The user must be able to know which are clickable.

  2 when I have a picture on the up State, all right. But when I add an image to the over State, it causes a loop. Above all loop in the preview and after that I have to publish regardless of the cursor position and the type of browser (IE, FF, Chrome).

  I searched on the web. A lot of people have this problem, but no answers have surfaced. I don't especially want another 100 hours recreating beachfront animate - which I am not as familiar with. Y at - it a code that can stop the madness?

  At the end of the day, all I have to do. I have fixed all through the timeline. Now everything works!

  HTML5 canvas dislikes tween buttons. He'll do it, but if the buttons contain animations, things go wonky. Instead, I got the bitmap of the tween flash button and once the animation is complete, I've changed over the bitmap for the button in the next keyframe, so that the user can click on it. Its softness, you do not see a hiccup. States of flight hover-over worked after that as the hand.

  Hope this helps other people who have this same problem.

• HTML5 canvas, animated during a cursor

  Hello everyone, my name is Etienne Deswattenne, I am a beginner flash of France so I apologize for my poor English, my question is this, how can we change the cursor to a symbol of the scene when the mouse is on another symbol? I have a 'this' problem I think

  Here's the code I sketched in HTML5 canvas:

  ========================================================

  Hello all, I do not understand how to use the keyword "this" pour run code of this fight, because the function is in another function so the 'this' don't be referred not to the same chose? I tried for 4 hours I found nothing, please help me!

  =========================================================

  frequency of var = 3;

  stage.enableMouseOver (frequency);

  this.zoneinterdite.addEventListener ('mouseover', fl_MouseOverHandler_17);

  function fl_MouseOverHandler_17()

  {

  internship. Canvas.style.Cursor = 'none ';

  this.movieClip_6.mouseEnabled = false;

  this.addEventListener ('check', fl_CustomMouseCursor_15.bind (this));

  function fl_CustomMouseCursor_15() {}

  this.movieClip_6.x = stage.mouseX;

  this.movieClip_6.y = stage.mouseY;

  }

  }

  you have lost your reference to 'this' in fl_MouseOverHandler_17.  (and you should not the following named functions.)

  Try:

  frequency of var = 3;

  stage.enableMouseOver (frequency);

  this.zoneinterdite.addEventListener ('mouseover', fl_MouseOverHandler_17(this) .bind);

  function fl_MouseOverHandler_17()

  {

  internship. Canvas.style.Cursor = 'none ';

  this.movieClip_6.mouseEnabled = false;

  this.addEventListener ('check', fl_CustomMouseCursor_15.bind (this));

  }

  function fl_CustomMouseCursor_15() {}

  this.movieClip_6.x = stage.mouseX;  Although these two lines will probably end your mouseover zoneinterdite

  this.movieClip_6.y = stage.mouseY;

  }

• HTML5 canvas settimeout problem

  Hello

  I have a problem with html5 canvas settimeout.

  I created a round drawing object, the instance name is ball. The following code

  Code:

  This.ball.x = 1000;

  setTimeout (calledFun, 500);

  function calledFun()

  {

  Alert ("fun called");

  This.ball.x = 100;

  }

  The function of this code is worked, alert view only. But ball x position not changed.

  So please help me

  Thanks in advance

  you have lost your reference to "this".  Try:

  var tl = this;

  This.ball.x = 1000;

  setTimeout (calledFun, 500);

  function calledFun()

  {

  Alert ("fun called");

  TL.ball.x = 100;

  }

• HTML5 canvas how to use movieClips created onstage goToAndPlay()

  I created a simple slide show and a series of small navigation buttons on the platform of html5 canvas. The goToAndPlay() function works OK on the main timeline, but not on timeline timeline navigation buttons. I don't know enough createJS to find a workaround. Journal of said browser gotoAndStop is not a function. I just want to do a mouseover and mouseout/mouseouthandler() managers, the button can play the role of his chronology.

  Any ideas?

  You must reference the movieclip.

  for example, if you try to control the movieclip as well as one that contains the code, use:

  this.gotoAndPlay ();

  not

  gotoAndPlay();

• HTML5 Canvas move one image after a period of time

  I'm new to JavaScript and html5 Canvas and you want to move one image after a period of time, for example, after an audio clip is finished playing.

  I tried: setTimeout (function () {this.getStage () .getChildAt (0) .gotoAndPlay (2);}, 36000);

  This code does not work.

  The equivalent AS3 is: function wait() {stop (); var myInterval = setInterval (function () {play (); clearInterval (myInterval);}, 36000) ;} / / end of the function wait();}

  Thank you.

  Is to understand "extended", who looks much more like the ActionScript 2.0. The word 'this' as you have it does not refer to what you think it does. Because it is inside a function (anonymous function for setInterval you did), it comes to this scope.

  Two ways to resolve this problem, assign the current scope and use inside the anonymous function or use the shortcut of exportRoot.

  affect the scope

  This.Stop ();

  var _scope =;

  {setTimeout (function ()}

  _scope.getStage () .getChildAt (0) .gotoAndPlay (2); using the reference _scope retained by the top

  (}, 36000);

  Or this shortcut in the root scope:

  {setTimeout (function ()}

  exportRoot.gotoAndPlay (2);

  (}, 36000);

• SoundJS with Flash HTML5 Canvas - break sound & update the lib?

  I'm looking to do some basic audio control in the Flash timeline, exporting HTML5 canvas.

  On the frame of 10 I am loading/reading a file with:

  audio1 var is createjs. Sound.Play("Sounds/course3_mod1_2.mp3");

  Who plays, but then I can't figure out how to make a pause as the beep several frames later at a briefing of the animation to a timeline. I read that there is a method. pause() methods, as well as chassis 50 that I use:

  AUDIO1.pause ();

  This does not work for me - I must be missing something pretty obvious regarding variables references on the timeline...? In the console of Firefox, I see the JS error:

  ReferenceError: audio1 is undefined.

  If it's important, the process of publication included "0.5.2.min.js", although I do not have the latest version of CA is "0.6.0.min.js". I'm also very curious how I would update my CC Flash (version 20141) to use this latest version of the library compared with older he current attaches to the HTML code. I guess I can (in the publication settings) uncheck the option 'Hosted libraries', and then manually download new libraries and replace them in the folder. But not this crushed with each publication? And what happens if I still want a link to a hosted version the later?

  somascope wrote:

  On the frame of 10 I am loading/reading a file with:

  audio1 var is createjs. Sound.Play("Sounds/course3_mod1_2.mp3");

  Who plays, but then I can't figure out how to make a pause as the beep several frames later at a briefing of the animation to a timeline.

  That cannot possibly work. If it worked, it is no more. The SoundJS, the documentation is very clear that "before you can play a sound, it must be saved.» You need to do something like this:

  // create global alias to main timeline for event handler
  _main = this;
  // wait for sound to preload
  this.stop();
  // assign load event handler
  createjs.Sound.on("fileload", handleLoad);
  // load and register sound
  createjs.Sound.registerSound("mysound.mp3", "soundID");
  // play sound and start timeline playing
  function handleLoad(event) {
      _main.audio1 = createjs.Sound.play("soundID");
      _main.play();
  }
  

  Then, to put in pause/resume, follow these steps:

  this.audio1.paused = true; // pause
  

  this.audio1.paused = false; // resume
  

  Reference: is there a pause() method? · Number #200 · CreateJS/SoundJS · GitHub

  Note that var creates variables that have only the scope of the framework. To the current scope of timeline, you must use this..

  If it's important, the process of publication included "0.5.2.min.js", although I do not have the latest version of CA is "0.6.0.min.js". I'm also very curious how I would update my CC Flash (version 20141) to use this latest version of the library compared with older he current attaches to the HTML code.

  DO NOT do it. Each new version of Flash CC publishes the files that target a specific version of the CreateJS library, so try to cram in a different version will certainly break things. But why you are still using Flash CC 2014? You should be able to upgrade to CC animate.

• HTML5 Canvas examples/tutorials content scrolling?

  Since ScrollPane component is not supported in HTML5 Canvas of Animate mode, anyone know how to create scrolling content in other ways?  Online pointers to tutorials or examples or books is appreciated.

  you use something like:

  var m;

  var b;

  var tl = this;

  paramF (mask there, buttons parent there, is mask + mask height, height of parent y-buttons buttons parent + height of mask)

  TL.mask_mc.addEventListener ('pressmove', moveF);

  TL.mask_mc.addEventListener ('pressup', stopF);

  function moveF (e) {}

  {if (TL.mask_mc. HitTest (e.localX, e.localY))}

  buttons parent y = m * (e.localY + 40) + b;

  } else {}

  stopF (e);

  }

  }

  function stopF (e) {}

  TL.mask_mc. RemoveEventListener ('pressmove', stopF);

  TL.mask_mc.addEventListener ('pressmove', stopF);

  }

  function paramF(x1,y1,x2,y2) {}

  m =(Y1-Y2) /(x1-x2);

  b = y1 - m * x 1;

  }

• 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!

• "mouseup" does not not in HTML5 canvas

  Hello

  I created a HTML5 canvas where the main timeline is supposed to play so that a button is pressed and stops when the button is released. To do this, I need to stop the "tick" on mouseup event. However, mouseup does not work. I tried to use mouseup on the btn_plus.addEventListener as well (only for debugging purposes), but it does nothing. "mousedown" and "click" works as expected.

  (The next step is to create a back button with similar functionality, this is why I do not use the play/stop to control the timeline.)

  Any input would be much appreciated.

  Thank you.

  This.Stop ();

  This.btn_plus.addEventListener ("mousedown", keyPlus.bind (this));      increase button. "mouseup" does not work here either.

  function keyPlus() {}

  this.addEventListener ('check', increaseDown.bind (this));

  this.removeEventListener ("mouseup", increaseDown.bind (this));      //Trying to remove the ticker here - does not

  }

  function increaseDown() {}

  this.gotoAndStop (this.timeline.position + 1); magic happening here

  Alert ('increase pressed');

  }

  Try, "pressup.

• Several ' click is needed with HTML5 Canvas script

  I'm learning the script in the HTML5 Canvas, having recently changed dashboard animate and, before AS3

  I have two buttons and I created a simple condition to detect the alpha value of the STM, control buttons, so that the correct MC can be alpha fainted faded and the new faded faded on. The code works, except that:

  on the first click, the MC fades on correctly, the second click on another button takes 2 clicks, and each requires more clicks on the same key. Can someone explain and give me a way to fix this oddity.

  Thanks in advance!

  That's what I have:

  THE STATES OF LOAD

  this.circleGreen_mc.alpha = 0;

  this.circleRed_mc.alpha = 0;

  this.circleTeal_mc.alpha = 0;

  BUTTON GREEN

  This.green_btn.addEventListener ("click", greenClick.bind (this));

  function greenClick() {}

  FADE IN

  this.addEventListener ('check', fadeIn.bind (this));

  function fadeIn() {}

  this.circleGreen_mc.alpha += 0.1;

  }

  Fade OUT

  If (this.circleRed_mc.alpha == 1); {

  this.addEventListener ('check', fadeOut.bind (this));

  function fadeOut() {}

  this.circleRed_mc.alpha-= 0.1;

  }

  }

  Fade OUT

  If (this.circleTeal_mc.alpha == 1); {

  this.addEventListener ('check', fadeOut.bind (this));

  function fadeOut() {}

  this.circleTeal_mc.alpha-= 0.1;

  }

  }

  }

  RED BUTTON

  This.red_btn.addEventListener ("click", redClick.bind (this));

  function redClick() {}

  FADE IN

  this.addEventListener ('check', fadeIn.bind (this));

  function fadeIn() {}

  this.circleRed_mc.alpha += 0.1;

  }

  Fade OUT

  If (this.circleGreen_mc.alpha == 1); {

  this.addEventListener ('check', fadeOut.bind (this));

  function fadeOut() {}

  this.circleGreen_mc.alpha-= 0.1;

  }

  }

  Fade OUT

  If (this.circleTeal_mc.alpha == 1); {

  this.addEventListener ('check', fadeOut.bind (this));

  function fadeOut() {}

  this.circleTeal_mc.alpha-= 0.1;

  }

  }

  }

  /*

  BUTTON TEAL

  This.teal_btn.addEventListener ("click", tealClick.bind (this));

  function tealClick() {}

  }

  }

  */

  Well, then, if I did what I guess you do, I would like this:

  var i;
  var curBtn;
  var circles = [this.circleRed, this.circleGreen, this.circleBlue];
  var buttons = [this.btnRed, this.btnGreen, this.btnTeal];
  var items = circles.length; // assume same number of buttons and circles
  
  // initialize things
  for (i = 0; i < items; i++) {
      circles[i].alpha = 0;
      buttons[i].btnId = i;
      buttons[i].addEventListener("click", buttonClickHandler.bind(this));
  }
  
  // handler for all button clicks
  function buttonClickHandler(evt) {
      var i;
      var btn = evt.target.btnId;
      if (btn == curBtn) {
          return;
      }
      curBtn = btn;
      for (i = 0; i < items; i++) {
          if (i == btn) {
              createjs.Tween.get(circles[i], {override:true}).to({alpha:1}, 500);
          }
          else if (circles[i].alpha > 0) {
              createjs.Tween.get(circles[i], {override:true}).to({alpha:0}, 500);
          }
      }
  }
  

• How to disable the cc button animate html5 canvas files?

  Hello!

  How to disable the cc button animate html5 canvas files?

  ex:

  this.mc.on('click',function(){alert('this')})
  this.mc.enabled=false
  

  question 1:

  When you click on the 'mc', it always run. How can I control the button of the deactivate and activate?

  question 2:

  The mc is not an image, it's a movieclip. How can I change the colors of the mc? example: default of the mc color red, I want to click change black!

  Thank you!

  use addEventListener instead of 'on '.  You can then use removeEventListener to disable.

  or you can intemperies to use 'on' using the mouseEnabled property to disable this.mc:

  this.mc.mouseEnabled = false;