By tim, Section Tutorials, Topic MaxMSP
Posted on Mon May 15, 2006 at 06:00:27 PM EST
Welcome to the second installment of Stupid JS Tricks. If you missed the previous installment, you can take trip back in time to see us resize our patcher's interface. In this trick we will rise to a brave new challenge: to drag a window around on our screen without using the standard drag-able region provided on that window by the operating system.
Prior to our revealing of Andrew Pask's top-secret new formula for window dragging, the alternatives you have are:

The method discussed here can allow you to create a custom look for your windows and let people move them around. This screenshot is from radiaL - an application for loop-based performances built using Max/MSP.
And now the drum roll please...
// windowdragger.js
// by Andrew Pask
var vrgb2 = [0.35,0.35,0.35,1.];
var last_x = 0;
var last_y = 0;
sketch.default2d();
draw();
// DRAWING ************************************************
function draw()
{
var theta;
var width = box.rect[2] - box.rect[0];
with (sketch) {
moveto(0,0);
glclearcolor(vrgb2);
glclear();
glcolor(vrgb2);
quad(0., 0., 0., 1., 0., 0., 1., 1., 0., 0., 1., 0.);
}
}
// MOUSE EVENTS ************************************************
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.
function ondrag(x,y,but,cmd,shift,capslock,option,ctrl)
{
var dx, dy;
// calculate delta movements from onclick()
dx = x - last_x;
dy = y - last_y;
if (dx || dy) {
pos = this.patcher.wind.location;
pos[0] += dx;
pos[1] += dy;
pos[2] += dx;
pos[3] += dy;
this.patcher.message("window", "size", pos[0], pos[1], pos[2], pos[3]);
this.patcher.message("window", "exec");
}
}
ondrag.local = 1; //private.
function onresize(w,h)
{
draw();
refresh();
}
onresize.local = 1; //private
For this to work, you need to load the Javascript file into JSUI (The JS object's user-interface cousin). This lets us draw a color for the drag-able region and process the mouse dragging. While we are sending messages to this.patcher, the result is a lot more direct than sending messages to a thispatcher object in a Max patch - and we get the smooth window-dragging love we are looking are for...
Toodles... and PS. If you really don't feel like typing all of that in, you can download it here!
| < Cycling '74 Releases UpMix (0 comments) | 5.1 Overview (0 comments) > |
Navigate the Articles
To navigate the articles:
- sort by Topic or Section by clicking on the Topic/Section link at the top of any article
- sort by Author's name to get a complete list of his/her articles
We are always open to new ideas and potential contributions for the site. If this interests you, please contact us.


