Little JS Syntax Bible in Max/MSP


    Feb 09 2022 | 2:03 pm
    Here I want to collect all the less intuitive Javascript syntax and techniques for Max. Feel free to comment everything that comes to your mind related to the subject, I'll add it to the list. Max JS uses ES5 version, so features like "let" and Classes added in ES6 will not work. Max's documentation for JS: https://docs.cycling74.com/max8/vignettes/javascriptinmax Tim's JS Reference: http://max-javascript-reference.tim-schenk.de/ Get keys pressed in JS: https://github.com/cskonopka/maxJS

    Max Scripting

    • Create a new Max object: var myObj = this.patcher.newdefault(<obj_pos_x>, <obj_pos_y>, "<max_obj_name>");
    • Add arguments to Object when creating it: var anotherObject = p.newdefault(100, 100, "combine", "text", "::", "moretext")
    • Move Object:maxObject.message("patching_position", [posX, posY]);
    • Create a new "bpatcher" object with arguments: var myNewObject = p.newdefault(100, 100, "bpatcher", "@name", "myPatch", "@args", name);
    • Rescale Max Object: this.patcher.script("sendbox", <max_obj>.varname, "patching_rect", [ <obj_pos_x>, <obj_pos_y>, <obj_size_x>, <obj_size_y> ]);
    • Bring to Front/Back Max Object: this.patcher.script("bringtofront" / "sendtoback", <max_obj>.varname);
    • Connect two Max objects: this.patcher.connect(<max_obj_1>, <outlet_index>, <max_obj_2>, <inlet_index>);
    • Send a message to a Max "receive" object from within JS: messnamed("<receive_obj_name>");
    • Get a named Max object and assign it to a JS object: var myMaxObj = this.patcher.getnamed("<obj_varname>");
    • Resize a BPatcher that contains the JS object: this.patcher.box.rect = [<leftTopX>, <leftTopY>, <bottomRightX>, <bottomRightY>]

    JSUI

    • Get the rect of the JSUI object box: var objRect = box.rect.slice(); Get size of box.rect = var objSize = [box.rect[2] - box.rect[0], box.rect[3] - box.rect[1]]; box.rect can also be set.

    Folder Object

    • Create a Folder object and read the file names in the folder: var myFolder = new Folder(<folder_path>); Set Folder typelist (an empty typelist will make the Folder object read every file type): myFolder.typelist = ["<file_type>", "<file_type>", etc...]; Read the Folder file names: while (!myFolder.end) { post(myFolder.filename); myFolder.next(); }

    Dict Object

    • Basic querying: function dictionary(dictname) { var d = new Dict(dictname); outlet(0, d.get('layer1key::layer2key'); }
    • Iterating through layers of a Dict: function dictionary(dictname) { var d = new Dict(dictname); var layer1 = d.getkeys(); layer1.forEach(function(key) { var layer2 = d.get(key).getkeys(); } }

    Max Object Listener

    • Listen to a Max Object for attributes or value changes: var myListener = new MaxobjListener(<max_obj>, <callback_function>); The Callback function can be used like this: function MyCallback(data) { data.value; // the output of the Max object data.maxobject; // the object itself }
    • To make the "this" inside a callback refer to the current object, you can write the callback directly inside the object in this way:
    var MyCallback = (function(data) { post(this.myObjProperty); } ).bind(this);

    Jitter in Javascript

    • Create Jitter Matrix: var myMatrix = new JitterMatrix("<name_optional>", <int_number_of_planes>, "<type>", [<int_dim_0>, <int_dim_1>, ... ] );
    • Get name of object as registered from Max: var objRegName = <jsJitterObj>.getregisteredname();
    • Create Jitter Object: var myJitterObj = new JitterObject("<obj_name>", <argument>); Example: var myJitterObj = new JitterObject("jit.gl.gridshape", "<drawto>");
    • Free Jitter Object Memory (must be done every time a Jitter object is deleted in JS): myJitterObj.freepeer();
    • Use a "jit.gl.pix" object within JS (same for "jit.gl.slab"): var myGLPix = new JitterObject("jit.gl.pix"); myGLPix.gen = "<genjit_file_path>";
    Set the input you want to send the next texture: myGLPix.activeinput = <int_input_index> Set parameters: myGLPix.param("<param_name>", <param_value> / [<array_of_param_values>]); Get the processed texture: myGLPix.jit_gl_texture("<texture_to_process_name>"); myGLPix.draw(); // IMPORTANT, the jit.gl.pix obj needs also to draw var myProcessedTexture = myGLPix.out_name;
    • Play a movie with "jit.movie" and get a texture output from within JS: First create a dummy matrix, the dimensions don't matter: var dummyMat = new JitterMatrix(4, "char", 320, 240); jit.movie needs output_texture enabled: var moviePlayer = new JitterObject("jit.movie"); moviePlayer.output_texture = 1; Get new frame and output texture: function LoadNewFrame() { moviePlayer.matrixcalc(dummyMat, dummyMat); outlet(0, moviePlayer.texture_name); }
    • Use a JitterListener to listen to change of state in Jitter Objects: https://docs.cycling74.com/max8/tutorials/jitterchapter47?q=jitterlistener

    Max 4 Live


    • Feb 09 2022 | 3:38 pm
      Hi, I think the real bible is this https://docs.cycling74.com/max8/vignettes/javascriptinmax, isn't it ?
      btw: the JitterListener link doesn't work.
    • Feb 09 2022 | 3:46 pm
      Thank you Olsen, that's a great resource, will pin it to the top. However I find that it's still useful to collect all the Jitter syntax and the more esoteric things (like "activeinput" for jit.gl.pix and jit.gl.slab) which are not immediately recollected from the documentation. If nothing else, I will use this post to note things I encounter and that I wish to remember. Oh yes, Tim's website is a bit funky, thanks for noting
    • Feb 09 2022 | 3:50 pm
      try this link for Tim's JS site - http://max-javascript-reference.tim-schenk.de/
      (and thanks much for collecting these Federico, hugely helpful)
    • Feb 09 2022 | 3:55 pm
      Thank you Rob, wanted to point to a precise article, but will pin Tim's website as well as a resource.
    • Feb 10 2022 | 10:31 pm
      Might be nice to have some more advanced new object examples
      Here are some from my own patches var myNewObject = p.newdefault(100, 100, "bpatcher", "@name", "myPatch", "@args", name);
      var anotherObject = p.newdefault(100, 100, "combine", "text", "::", "moretext")
    • Feb 10 2022 | 10:54 pm
      Feel like Dict stuff needs a section, too. Some examples:
      Basic querying: function dictionary(dictname) { var d = new Dict(dictname); outlet(0, d.get('layer1key::layer2key'); }
      Iterating through layers of a Dict:
      function dictionary(dictname) { var d = new Dict(dictname); var layer1 = d.getkeys(); layer1.forEach(function(key) { var layer2 = d.get(key).getkeys(); } }
    • Feb 11 2022 | 9:28 am
      Awesome NTRM, both added.
    • Mar 22 2022 | 9:20 am
      This thread is going to be very helpful, as js in max related informations are pretty much spread and scarce along a lot of years, and probably under documented, even in the forum, so the learning start might seem scary for our community while i find js in max is powerful,
      I m looking forward to see this growing. Thx Federico!
    • Mar 22 2022 | 12:34 pm
      Here are some JSUIs which accept mouse drag operations to move other objects in locked patchers.
    • Mar 22 2022 | 12:41 pm
      Roald Baudoux collected some examples of buffer~ operations with js in this thread.
    • Mar 22 2022 | 8:09 pm
      Thanks everyone.
    • Mar 24 2022 | 9:47 am
      When you arrive in js, it is sometimes complicated to identify script errors that are related to specificities of js in max. It would be helpfull for js beginners (like me) if we could collect here the things to know about these little particularities that your max logic won't help to figure out :)
      Two examples :
      For jit.gl.text , 2d or 3d has to be specified in the var attribute, and not in the object argument itself (unlike the max externals) var mytext = new JitterObject ("jit.gl.text","context"); mytext.mode = 2d ; // or 3d
      For jit.gl.light, the drawing context has to be specified in the drawto attribute (not in the object argument)
      var mylight = new JitterObject ("jit.gl.light"); mylight.drawto = "mycontext";
      Context set in the argument will generate console error "#N: extra arguments for message "jit_gl_light"
    • Apr 02 2022 | 7:39 am
      Sharing this pretty interesting thread, which links to comprehensive tutorials on how to use Ableton Api in js/m4l. It worths to share it again here: https://cycling74.com/forums/tutorial-using-the-javascript-live-api-in-max-for-live http://compusition.com/writings/js-live-api
    • Apr 02 2022 | 3:53 pm
      Awesome! Loving the contributions
    • May 14 2022 | 7:36 am
      some useful links referenced in here : https://cycling74.com/forums/looking-for-good-inforeference-on-js