Peripheral input MIDI CC Flash / Html Canvas

Hello world

First of all, if this isn't the right place for my question, would you please tell me where I can ask questions about CC Flash / actionscript 3.

I'm building a game (with CC Flash / Html Canvas / AS3, on a Mac) for players to help them play it by ear. The app plays a few notes (.wav or Mp3 files) and the user has to play on a piano.
Here is an example of level 3. (Sorry it's a french version for the moment).

For now, it works fine with the included virtual piano but as I want to add the ability to play more than one note at a time (ex: agreements), I want users to use their keyboard as input device.
The only information I found on the Internet about the midi input/output are too old, and I have not found anything on the use of this feature with Flash.

So, how to set a midi piano keyboard as input device and collect the notes?

Can I use the W3org WebMidiApi? If yes how?

Thanks for any help or idea.

F.

It works!

I tried with ExternalInterface, but I was getting a lot of errors.
Looking forward for an example using this method, I found another solution simpler. So simple I don't know why I didn't try it before.

I just need to add 2 lines on my html page:

event.data = playednote [1] / / this is the value of the note played on the keyboard this line replaces the alert.

document.myFunction (playednote); MyFunc is a function in Flash/AS

Your last tip about unchecking the output HTML is very useful! I have a lot of time.

Thanks for your help, now I can continue. I am happy

Here's the script in my html page:

Tags: Adobe Animate

Similar Questions

  • Problem with button Flash HTML Canvas document click on opening multiple browser windows

    Here is the code I use. When I click on the buttons, they open a new browser window.

    If I go back to the new buttons and click on them, they open two browser windows.

    If I repeat the process again a click will open three windows, etc. etc.

    It does in 6.1.6 Safari and in Firefox 35.0.1 but it functions correctly - just open a browser by clicking window, in Google Chrome.

    What I'm doing wrong or is it a problem with the browsers themselves?

    / * Click here to go to the Web Page

    Click on the specified symbol instance loads the URL in a new browser window.

    Directions for use:

    1. replace http://www.adobe.com with the desired URL.

    Keep the quotation marks ("").

    */

    this.learnMore2.addEventListener ("click", fl_ClickToGoToWebPage_6);

    function fl_ClickToGoToWebPage_6() {}

    window.open ("http://www.google.com", "_blank");

    }

    / * Click here to go to the Web Page

    Click on the specified symbol instance loads the URL in a new browser window.

    Directions for use:

    1. replace http://www.adobe.com with the desired URL.

    Keep the quotation marks ("").

    */

    this.bookingRequest2.addEventListener ("click", fl_ClickToGoToWebPage_7);

    function fl_ClickToGoToWebPage_7() {}

    window.open ("http://www.apple.com", "_blank");

    }

    Gotcha now.

    I found this thread, can be to the address you are looking for.

    Flash html5 canvas opens several tabs when the animation loop

  • New CC Flash & HTML canvas errors

    Hi, I just upgraded to Flash CC but I have questions that I think are simple new user errors. My problem is when I create a new canvas HTLM5 and copy images in the library. 1 a background image and a tree. Both were originally png cut and pasted through Fireworks.

    So I put the background on the new document and publish everything works fine a static image is displayed

    Then I put the (static) tree on the bottom in a new layer or on the same layer can publish and white canvas is displayed.

    When I publish, I get the following warning is displayed on the output tab

    WARNINGS:

    * 2 Bitmaps packed with success in 1 spritesheet (s).

    Safari reports TypeError: undefined is not an object (evaluation of "this.spriteSheet.getNumFrames")

    IE 11 reports

    HTML1300: Navigation has occurred.

    test.html

    HTML1202: file://mac/Home/Desktop/untitled%20folder%205/test.html is running in compatibility mode, because "Display intranet sites in compatibility view" is checked.

    test.html

    DOM7011: the code on this page off backward and forward caching. For more information, see: http://go.microsoft.com/fwlink/?LinkID=291337

    test.html

    [object Error]

    {

    Description: "object does not support property or method 'defineProperties ', '.

    message: "object does not support property or method 'defineProperties ', '.

    name: 'Type ',.

    Number :-2146827850

    }

    [object Error]

    {

    Description: "object does not support property or method 'defineProperties ', '.

    message: "object does not support property or method 'defineProperties ', '.

    name: 'Type ',.

    Number :-2146827850

    }

    SCRIPT445: Object doesn't support this action

    Untitled - 3.js (20.1)

    SCRIPT445: Object doesn't support this action

    test.html (21.2)

    The only post I found indicated that running the files locally on the desktop computer rather the a web server may cause this error.

    I use an iMac with safari and IE11 (running in Parallels)

    No indication on my simple mistake would be appreciated

    When you have made a test movie, did the images appear ok? It is normal when you use spritesheets so it fails if you try to open the HTML document locally. If you've seen ok with a test film images, so it should all work when the files are on a server.

    You can go into the publication settings and disable the spritesheet option. Then, the HTML code should work as a local test.

  • Flash Pro CS5: Why I don't see 'Copy to HTML canvas' command?

    Suite: http://CS5.org/?p=3 & cpage = 1

    Could you please tell me why I can't see menu 'Copy on canvas HTML' on Flash Professional CS5?

    Where can I get information on "renderFXG.js" and there is any Web site used this?

    Hello

    The demo of MAX was a foretaste of a proof of concept.  The command 'Copy HTML canvas' and renderFXG.js do not ship in Flash and Dreamweaver CS 5.

    However, HTML5 is definitely an area that we focus on the future.  Please describe the workflow HTML5 that you want to use.  HTML5 what types of content do you use with Flash and Dreamweaver.

    Thank you

    Amel

  • Center of html in the browser (html canvas). Help, please.

    Hi guys.

    I'm really stuck here and I hope someone can help. I looked online and found some answers but I'm not good enough with the code to be able to figure out how to change this option for centering in the browser window. This code - published from flash with html canvas cc - looks different to other peoples code. Could someone please indicate where I need to add the ' align: Center ' or 100% or whatever is needed. Thanks to you all!

    <! DOCTYPE html >

    < html >

    < head >

    < meta charset = "UTF-8" >

    animation of curve < title > change flash < / title >

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

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

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

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

    < script src = "edit the curve animation flash.js" > < / script >

    < script >

    var canvas, stage, exportRoot;

    function init() {}

    canvas = document.getElementById ("canvas");

    images = images | {};

    var loader = new createjs. LoadQueue (false);

    loader.addEventListener ("fileload", handleFileLoad);

    loader.addEventListener ("complete", handleComplete);

    loader.loadManifest (lib.properties.manifest);

    }

    function handleFileLoad (evt) {}

    If (evt.item.type == 'image') {[evt.item.id] = evt.result ;} images

    }

    function handleComplete (evt) {}

    exportRoot = new lib.changecurveanimationflash ();

    Stadium is new createjs. Internship (Canvas);

    stage.addChild (exportRoot);

    internship. Update();

    stage.enableMouseOver ();

    createjs. Ticker.setfps(25) (lib.properties.fps);

    createjs. Ticker.addEventListener ("tick", stage);

    }

    < /script >

    < / head >

    < onload = "init (); the body"style =" background-color: #D4D4D4 ">

    < canvas id = "canvas" width = "1024" height = "768" style = "background-color: #FFFFFF" > < / canvas >

    < / body >

    < / html >

    Change this

    to do this:

    Add the following CSS code to yourtag.  You can put under your

  • Flash HTML CC of the trial project

    Hi all

    Hoping it's something simple I did not bad!

    I downloaded the demo version of Flash CC and sought to create a HTML project but I don't seem to have the opportunity. I have only options for AIR or ActionScript projects.

    Can anyone help with what Miss me?

    Thank you

    Chris

    You can check the Flash version in the About dialog box. You should have #13.1.0.217 or #13.1.0.226 to see HTML canvas of document type.

    Please update Cretaive cloud application or help-> Update menu. You can also download the update of stanadlone of: http://www.adobe.com/support/flash/downloads.html#flashCC

    -Reynaud

  • How to include the code as AS2, create files html (canvas)?

    Like this:

    AS2 may include codes :'aaa.as' #include.

    How can I do it in cc animate html (canvas) files?

    I have several documents, using the same set of code. If you can refer to the external code, duplicated code these easy to modify and use need not.

    Sorry my English!

    Thank you very much for the help!

    Insert your code in a function. Put the function in the external .js file. Call the function everywhere where this code used to be.

    Get rid of 'which = this. It will not work because 'this' will be the wrong scope. 'That' in the function as an argument, then call the function like myFunction ((this)); Or replace all 'that' s '_root' that is already defined by the script as pointing to the main scenario loader. Or replace "_root" in the script loader 'who' (not recommended, because "this" is not descriptive).

  • Random MovieClips does not work in HTML canvas

    This code works for as3, but why it works not for HTML canvas?

    Can someone help me?

    var MovieArray:Array = new Array(btr,btg,bty);

    for (var i: int = 0;  I < MovieArray.length;.  i++){

    var RandomNumber:Number = Math.floor (Math.random () * MovieArray.length)

    var MoviePosX:Number = MovieArray [NombrAl] .x;

    var MoviePosY:Number = MovieArray [NombrAl] there;

    MovieArray [NombrAl] .x is MovieArray [i] .x;.

    MovieArray there [NombrAl] = there MovieArray [i];

    MovieArray [i] .x = MoviePosX

    MovieArray [i] = MoviePosY there

    }

    There are still a few errors in your code. Use it instead:

    var MovieArray is [this.btr, this.btg, this.bty];.

    for (var I = 0; i)< moviearray.length;="" i++)="">

    var NombrAl = Math.floor (Math.random () * MovieArray.length)

    var MoviePosX = MovieArray [NombrAl] .x;

    var MoviePosY = MovieArray [NombrAl] there;

    MovieArray [NombrAl] .x is MovieArray [i] .x;.

    MovieArray there [NombrAl] = there MovieArray [i];

    MovieArray [i] .x = MoviePosX;

    MovieArray [i] there = MoviePosY;

    }

    In general, during the transition from AS3 to JS, you must make the following changes mainly:

    1. all instance names must be referenced as 'this principaltype.instance-name '.

    2. all the ': type' prescribers should be deleted.

  • Pouvez Edge animation scale/resize Flash and canvas

    One of our biggest concern is now animation made with Adobe Edge cannot scale and resize as Flash or canvas (and we don't mean design fluid or reactive) is this true? Our animations should allow the user zoom or zoom out without any restrictions, we can build our animation with Adobe Edge?

    Thank you

    Ah might as well post it here as well - I have a tutorial to see how to go about this here http://www.youtube.com/watch?feature=player_embedded&v=hrLt0Y9QAY8

    Sarah

  • Export html canvas animation Flash... receptive CC?

    When you export Flash CC animations like html5, can you do the code responsive resulting?

    Looked at the html + tried to change:

    < canvas id = "canvas" width = "980" height = "579" style = "background-color: #5F5F5F" > < / canvas >

    TO

    < canvas id = "canvas" width = "100%" height = "100%" style = "background-color: #5F5F5F" > < / canvas >

    as well as trying to "exactfit" and "*", etc... But each of these attempts of a malfunction of the size.

    It would be great to be able to export html5 Flash animation and have the means to make them sensitive. It's perhaps easier to do with edge animate - but can be done with Flash, too?

    Thank you!

    There is a resize event, spoken here:

    Make the sensitive canvas size / CreateJS / Discussion area - CreateJS Support

    The simplest solution is to put all your Flash experience in a movieclip, while on stage, he is just a movieclip. When there is a resize event you can scale the movieclip to adapt to the new area and whether you can use the code to move the items to the new space.

  • Flash AS3.0 to the Html Canvas convertion

    Hello again,

    I'm in a little correction here.

    I converted my Flash project to canvas of Html in Flash CC.

    But my actions in timeline got commented and created a js file.

    His does not work according to what I've created.

    Did some research and knew the shares could be placed in comment and js should be written for the actions given wehave.

    As I have no knowledge in programming Java Script, any help in this would be very appreciated.

    This is the script that I worked on...

    Thanks in advance...

    import flash.events.MouseEvent;
      
    Wall1.stop();
      
    Wall1.RedCove.visible = false;
    Wall1.PearlGrey.visible = false;
    Wall1.Boulder.visible = false;
    Wall1.Lava.visible = false;
      
    RedCove_btn.visible = false;
    PearlGrey_btn.visible = false;
    Boulder_btn.visible = false;
    Lava_btn.visible = false;
        
    Wall_btn.addEventListener(MouseEvent.CLICK,panels);
    function panels(event:MouseEvent):void
    {
              RedCove_btn.visible = true;
              PearlGrey_btn.visible = true;
              Boulder_btn.visible = true;
              Lava_btn.visible = true;
    }
      
    RedCove_btn.addEventListener(MouseEvent.CLICK, redcove);
    function redcove(event:MouseEvent):void
    {
              Wall1.RedCove.visible = true;
              Wall1.PearlGrey.visible = false;
              Wall1.Boulder.visible = false;
              Wall1.Lava.visible = false;
    }
    PearlGrey_btn.addEventListener(MouseEvent.CLICK, pearlgrey);
    function pearlgrey(event:MouseEvent):void
    {
              Wall1.PearlGrey.visible = true;
              Wall1.RedCove.visible = false;
              Wall1.Boulder.visible = false;
              Wall1.Lava.visible = false;
    }
    Boulder_btn.addEventListener(MouseEvent.CLICK, boulder);
    function boulder(event:MouseEvent):void
    {
              Wall1.Boulder.visible = true;
              Wall1.RedCove.visible = false;
              Wall1.Lava.visible = false;
              Wall1.PearlGrey.visible = false;
    }
    Lava_btn.addEventListener(MouseEvent.CLICK, lava);
    function lava(event:MouseEvent):void
    {
              Wall1.Lava.visible = true;
              Wall1.RedCove.visible = false;
              Wall1.Boulder.visible = false;
              Wall1.PearlGrey.visible = false;
    }
    
     Original_Image.addEventListener(MouseEvent.CLICK, hide);
    function hide (event:MouseEvent):void
    {
              RedCove_btn.visible = false;
              PearlGrey_btn.visible = false;
              Boulder_btn.visible = false;
              Lava_btn.visible = false;
    }
    
    

    Doing this involves manually code was rewritten?

    Yes, you have to edit the js file that flash generates after you publish to Web

    EaselJS is a entirely different from the law AS 3.0?

    EaselJS is essentially a framework that lets you write JavaScript with classes (similar to actionscript).

    A feature that you need to put all of the clips/Sprites in your javascript library

    Check out this tutorial to get a basic understanding of:

    http://code.tutsplus.com/articles/getting-started-with-Easeljs-a-Flash-like-interface-for-Le-HTML5-toile--active-10382

  • Flash HTML 5 Canvas banner for emergency assistance

    So I have a banner which must go to the next section and stop (html5 canvas flash) and he continues to go to '0' - and no framework 221 - then my video on 221 I need help how to get my mp4 playing on 221-HELP.

    html5 frames begin with the number 0, not 1.

    So what looks like the 221 on your pro flash timeline frame must be referenced by 220 in your code of createjs.

    If you do not understand how to use this info, copy / paste the relevant code goto.

  • SoundJS with Flash HTML5 Canvas - break sound &amp; 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.

  • No noise in the browsers HTML Canvas

    Create a simple with a classic Tween canvas and its document.  Publish it with the default settings.  example: http://www.3rcode.com/HTMLtest.html

    When published locally it works OK.  There is no sound on Firefox or Chrome when I upload it to my server.  CTRL/Shift/J shows 13 errors.  I use a PC, Windows 7, and version track Flash nc6.     If a simple audio file will not play on the browsers, you will lose sales.  I tried to paste in its code of createjs.com and I just syntax errors.

    This problem is not new.  See January 28, 2013

    CreateJS not sound in browsers / SoundJS / Discussion area - CreateJS Support

    Hi runjay,

    It seems that the file (mp3) audio is missing from the server. You can not downloaded the 'sounds' as well as the published html file and the file js to your server.

    Can you try again and confirm if it works fine now.

  • Pleeeeease help (question Flash HTML)

    Hi all
    I wonder, how do I add things like the identification label, or tags META HTML Flash document. Only way I know to date is to take together over Flash animation and incorporate it into the new HTML document created for example with TACO or some other HTML editors. This way I can add ID, META tags, etc. But I can go to the original HTML document created by Flash and add it?
    Thank you very much for any information or input.
    Janek

    Yes - just edit the html published from flash.

    ******************************************
    --> * Adobe Certified Expert *.
    --> www.mudbubble.com
    --> www.keyframer.com

    Janek Mohavlec wrote:
    > Hello all,.
    > I wonder, how do I add things like the identification label, or tags META HTML Flash
    > document. Only I know to date is to take together over Flash animation and
    > incorporate into the new HTML document created for example with TACO or some other HTML
    > publishers. This way I can add ID, META tags, etc. But then I go to original HTML
    > document created by Flash and he add?
    > Thanks a lot for any advice or input.
    > Janek
    >

Maybe you are looking for

  • -2002F

    Hi all earlier today, I upgraded my Mac mini (end 2012) to the latest version of macOS Sierra. After 1 hour of use, I realized that many of my plugins FCPX were not working. I contacted the developers, and they said does not update the plugins and th

  • using OpenCV FileStorage in LabVIEW

    I would use the LabVIEW function of the OpenCV FileStorage. Mainly because I want to transfer a c++ project to a LabVIEW project. But in this case, I can't load the xml file. I tested it in a project consolo, it seems to work. Here is the code: #incl

  • HP 15 r204ne: r204ne 15 hp ram slots how this laptop has one or two

    When I checked my ram I found only 4 GBNow I want to upgrade my ramIs that my laptop (hp 15 r204ne) has one or two slots of ram and what is the maximum memory I can update in every situation My operating system is Windows Home Edition unilingual 64 1

  • After SP 2 download my computer will not die after one hour

    before, I downloaded vist pak2 my computer turn off after about an hour of non-use.  Now it does not it stays on all the time.

  • Ipv4 and ipv6 on the same ACL line vty

    Hello everyone. I just want to confirm if I can protect a router (telnet and ssh) put 2 ACL (an IPv4 and other IPv6) on the same line vty. Something like: line vty 0 4 access-class hostsIPv4 in ipv6 access-class hostsIPv6 in I have to use named ACL?