5 Replies Latest reply on Oct 15, 2016 6:51 AM by Zipzap32

    HTML5 canvas resources and tutorials

    Zipzap32 Level 1

      Hello everyone , i am looking for a manual or a guide for coding in html5 (in the "actions" menu in Animate CC) .

      I was told  that the "EaselJS Module" is similar (EaselJS v0.8.2 API Documentation : EaselJS )but i cant find answers i look for in there , i'm not even sure how we call the language used in Animate (i want html5 not air) Were do you go to find answers ?? thanks for reading me I'm a big noob HELP !! ! =)

        • 1. Re: HTML5 canvas resources and tutorials
          kglad Adobe Community Professional & MVP

          canvas uses easeljs (and it looks like you have a reference) and javascript.  use google to search for code snippets and code help, as well as, your api link.

          • 2. Re: HTML5 canvas resources and tutorials
            Colin Holgate MVP & Adobe Community Professional

            Do you want to pose an example question, and see if we can answer it using the documentation, rather than just telling you the answer?

            • 3. Re: HTML5 canvas resources and tutorials
              Zipzap32 Level 1

              Ok so my problem is this :

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

              /*Mouse APPEAR*/

              var frequency = 3;

              stage.enableMouseOver(frequency);

              this.zoneinterdite.addEventListener("mouseover", fl_MouseOverHandler_18.bind(this));

              function fl_MouseOverHandler_18()

              {

              stage.canvas.style.cursor = "none";

              this.movieClip_6.mouseEnabled = false;

              this.addEventListener("tick", fl_CustomMouseCursor_21.bind(this));

               

              function fl_CustomMouseCursor_21() {

                  this.movieClip_6.x = stage.mouseX;

                  this.movieClip_6.y = stage.mouseY;

              }

              }

               

              /* Mouse Disappear*/

              var frequency = 3;

              stage.enableMouseOver(frequency);

              this.zoneinterdite.addEventListener("mouseout", fl_MouseOutHandler_8.bind(this));

              function fl_MouseOutHandler_8()

              {

              this.removeEventListener("tick", fl_CustomMouseCursor_21.bind(this));

              stage.removeChild(movieClip_6);

              stage.canvas.style.cursor = "default";

              }

               

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

              This code is meant to change the cursors' shape when it touches a symbol called "zoneinterdite" and back to normal when out of this symbol .

               

              Like I said i actually look for a manual or something because i can't code in animate CC and i dunno were to start , KGLAD helped me kindly one time but if you guys can give me some clue were i can find answers by myself that be 200 times better , first what is this language called ??  javascript with easejl ??? i really begin

               

              Thanks guys really

              • 4. Re: HTML5 canvas resources and tutorials
                just.emma Level 4

                The language is JavaScript.  The specific JavaScript libraries that Animate utilizes are CreateJS: CreateJS | A suite of JavaScript libraries and tools designed for working with HTML5

                • 5. Re: HTML5 canvas resources and tutorials
                  Zipzap32 Level 1

                  Hello guys once more , i'm really sorry to ask the same question over and over but i dont understand what's wrong with my code , i actually try to make a custom cursor change into a red arrow (that is a symbol in my scene) and back to normal when the cursor is outside a certain area , please help me or tell me where to find answers !!!

                   

                  "zoneinterdite" is the area and "curseur" is the custom sprite

                   

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

                   

                  /* Evénement MouseOver*/

                  var frequency = 3;

                  stage.enableMouseOver(frequency);

                  this.zoneinterdite.addEventListener("mouseover", fl_MouseOverHandler_22.bind(this));

                   

                  function fl_MouseOverHandler_22()

                  {

                      stage.canvas.style.cursor = "none";

                  this.curseur.mouseEnabled = false;

                  this.addEventListener("tick", fl_CustomMouseCursor_26.bind(this));

                   

                  function fl_CustomMouseCursor_26() {

                      this.curseur.x = stage.mouseX;

                      this.curseur.y = stage.mouseY;

                  }

                  }

                   

                   

                  /* Evénement MouseOut*/

                  var frequency = 3;

                  stage.enableMouseOver(frequency);

                  this.zoneinterdite.addEventListener("mouseout", fl_MouseOutHandler_14.bind(this));

                   

                  function fl_MouseOutHandler_14()

                  {

                   

                      this.curseur.x = stage.mouseX;

                      this.curseur.y = stage.mouseY;

                  }

                   

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

                   

                  Also if you guys could tell me where to find guides and tutorials on the net please do ! I'd like to find answers by myself , thanks in advance