Basic Javascript help request


    Feb 23 2013 | 1:36 pm
    Hi there, I don't usually dabble with JS so forgive this very basic question! I'm using JSUI to do some drawing. I have set up an if/else argument to define two different drawing modes, that section of code:
    if (loop == 0)
    {
    		circle(1,90-val*360,90); // keep the begining point static
    }
    else
    {
    		circle(1,90-val*360,90-val*360+10); // move the begining point
    }
    that bit works just fine if I change the var loop = 0; at the beginning of the code. I now want to control this from within Max with a toggle, how do I set that up? I'm guessing I need to write a short function for that, I tried this:
    function setvalueof(loop)
    {
    	 loop();
    }
    but that didn't work. Any help would be massively appreciated! Here is the rest of the code for those that might be kind enough to help:
    /*
    
    simple 2d dial
    
    arguments: fgred fggreen fgblue bgred bggreen bgblue dialred dialgreen dialblue
    
    */
    
    sketch.default2d();
    var val = 0;
    var loop = 0;
    var vorgb = [1.,1.,1.,1.]; // this defines the arc outline colour
    var vbrgb = [0.,0.,0.,1.];
    var vfrgb = [0.,0.,0.,1.];
    var vrgb2 = [0.,0.,0.,1.];
    var last_x = 0;
    var last_y = 0;
    
    // process arguments
    if (jsarguments.length>1)
    	vfrgb[0] = jsarguments[1]/255.;
    if (jsarguments.length>2)
    	vfrgb[1] = jsarguments[2]/255.;
    if (jsarguments.length>3)
    	vfrgb[2] = jsarguments[3]/255.;
    
    if (jsarguments.length>4)
    	vbrgb[0] = jsarguments[4]/255.;
    if (jsarguments.length>5)
    	vbrgb[1] = jsarguments[5]/255.;
    if (jsarguments.length>6)
    	vbrgb[2] = jsarguments[6]/255.;
    
    if (jsarguments.length>7)
    	vrgb2[0] = jsarguments[7]/255.;
    if (jsarguments.length>8)
    	vrgb2[1] = jsarguments[8]/255.;
    if (jsarguments.length>9)
    	vrgb2[2] = jsarguments[9]/255.;
    
    if (jsarguments.length>10)
    	vegbr[0] = jsarguments[10]/255.;
    if (jsarguments.length>11)
    	vegbr[1] = jsarguments[11]/255.;
    if (jsarguments.length>12)
    	vegbr[2] = jsarguments[12]/255.;
    
    draw();
    
    function draw()
    {
    	var theta;
    	var width = box.rect[2] - box.rect[0];
    
    	with (sketch) {
    		shapeslice(360,1);
    		// erase background
    		glclearcolor(vbrgb[0],vbrgb[1],vbrgb[2],vbrgb[3]);
    		glclear();
    		moveto(0,0);
    		// fill bgcircle
    		glcolor(vrgb2);
    		circle(0.8);
    		// draw arc outline
    		glcolor(vorgb);
    
    		if (loop == 0)
    {
    		circle(1,90-val*360,90); // keep the begining point static
    }
    else
    {
    		circle(1,90-val*360,90-val*360+10); // move the begining point
    }
    
    		// fill arc
    		glcolor(vfrgb);
    		circle(0.7,90-val*360,90);
    	}
    }
    
    function bang()
    {
    	draw();
    	refresh();
    	outlet(0,val);
    }
    
    function msg_float(v)
    {
    	val = Math.min(Math.max(0,v),1);
    	notifyclients();
    	bang();
    }
    
    function set(v)
    {
    	val = Math.min(Math.max(0,v),1);
    	notifyclients();
    	draw();
    	refresh();
    }
    
    function fsaa(v)
    {
    	sketch.fsaa = v;
    	bang();
    }
    
    function frgb(r,g,b)
    {
    	vfrgb[0] = r/255.;
    	vfrgb[1] = g/255.;
    	vfrgb[2] = b/255.;
    	draw();
    	refresh();
    }
    
    function rgb2(r,g,b)
    {
    	vrgb2[0] = r/255.;
    	vrgb2[1] = g/255.;
    	vrgb2[2] = b/255.;
    	draw();
    	refresh();
    }
    
    function brgb(r,g,b)
    {
    	vbrgb[0] = r/255.;
    	vbrgb[1] = g/255.;
    	vbrgb[2] = b/255.;
    	draw();
    	refresh();
    }
    
    function orgb(r,g,b)
    {
    	vorgb[0] = r/255.;
    	vorgb[1] = g/255.;
    	vorgb[2] = b/255.;
    	draw();
    	refresh();
    }
    
    function setvalueof(v)
    {
    	msg_float(v);
    }
    
    function getvalueof()
    {
    	return val;
    }
    
    function setvalueof(loop)
    {
    	 loop();
    }
    // all mouse events are of the form:
    // onevent , , , , , , , 
    // if you don't care about the additonal modifiers args, you can simply leave them out.
    // one potentially confusing thing is that mouse events are in absolute screen coordinates,
    // with (0,0) as left top, and (width,height) as right, bottom, while drawing
    // coordinates are in relative world coordinates, with (0,0) as the center, +1 top, -1 bottom,
    // and x coordinates using a uniform scale based on the y coordinates. to convert between screen
    // and world coordinates, use sketch.screentoworld(x,y) and sketch.worldtoscreen(x,y,z).
    
    function onclick(x,y,but,cmd,shift,capslock,option,ctrl)
    {
    	// cache mouse position for tracking delta movements
    	last_x = x;
    	last_y = y;
    }
    onclick.local = 1; //private. could be left public to permit "synthetic" events
    
    function ondrag(x,y,but,cmd,shift,capslock,option,ctrl)
    {
    	var f,dy;
    
    	// calculate delta movements
    	dy = y - last_y;
    	if (shift) {
    		// fine tune if shift key is down
    		f = val - dy*0.001;
    	} else {
    		f = val - dy*0.01;
    	}
    	msg_float(f); //set new value with clipping + refresh
    	// cache mouse position for tracking delta movements
    	last_x = x;
    	last_y = y;
    }
    ondrag.local = 1; //private. could be left public to permit "synthetic" events
    
    function ondblclick(x,y,but,cmd,shift,capslock,option,ctrl)
    {
    	last_x = x;
    	last_y = y;
    	msg_float(0); // reset dial?
    }
    ondblclick.local = 1; //private. could be left public to permit "synthetic" events
    
    function forcesize(w,h)
    {
    	if (w!=h) {
    		h = w;
    		box.size(w,h);
    	}
    }
    forcesize.local = 1; //private
    
    function onresize(w,h)
    {
    	forcesize(w,h);
    	draw();
    	refresh();
    }
    onresize.local = 1; //private

    • Feb 23 2013 | 1:52 pm
      function setvalueofloop( val ) {
      loop = val;
      }
      Make sure your loop is declared goobal with
      Var loop;
      In global code
    • Feb 23 2013 | 2:54 pm
      that's got it! thanks leehu! :)