WebSVN – wimsdev – Diff – /trunk/wims/src/Misc/canvasdraw/canvasdragstuff.c



    obj_type = 6 == roundrect /roundrects
    obj_type = 7 == crosshair / crosshairs
    obj_type = 8 == arrow / arrows
    obj_type = 9 == curve
    obj_type = 10== arrow2 / arrows2
    obj_type = 11== parallel (no drag or onclick)
    obj_type = 12== arc : radius is in pixels , so no zooming in/out
    obj_type = 13== circle / circles (will scale on zoom)
    obj_type = 14== text (will not scale or pan on zoom)
    obj_type = 15== animated point on curve
    obj_type = 16== pixels

 1=yoffset
 2=xoffset
 3=xyoffset
 4=centered
 
int onclick = 0; 0 = noninteractive ; 1 = onclick ; 2 = draggable
type= object type
 
verwijderd: direction : dragging in xy=0 , in x=1 in y=2 vervangen dooor use_snap en multisnap_check(x,y,use_snap)
use_snap: 0 = none 1=grid : 2=x-grid : 3=y-grid : 4=snap to points
obj.angle == RADIANS!
use_filled 0=no fill, 1=fill,2=grid,3=hatch,4=diamond,5=dot,6=image
 
rotate+translate+linear: is done in C-functions...e.g. original coordinates are transformed
NO NEED for javascript rotations in dragstuff...except for ANGLE

        case 20: fprintf(js_include_file,"case 20: ctx.arc(this.x[0],this.y[0],this.line_width,0,2*Math.PI,false);var E1 = x2px(px2x(this.x[0]) - this.w[0]);var E2 = x2px(px2x(this.x[0]) + this.h[0]);ctx.moveTo(E1,this.y[0]);ctx.lineTo(E2,this.y[0]);ctx.moveTo(E1,this.y[0]-2*(this.line_width));ctx.lineTo(E1,this.y[0]+2*(this.line_width));ctx.moveTo(E2,this.y[0]-2*(this.line_width));ctx.lineTo(E2,this.y[0]+2*(this.line_width));break;");break;
        case 21: fprintf(js_include_file,"case 21: drawCurvedArrow(ctx,this.x[0],this.y[0],this.x[1],this.y[1],this.x[2],this.y[2],this.h[0],this.h[1]);break;");break;
        case 22: fprintf(js_include_file,"case 22: break;");break;
        case 24: fprintf(js_include_file,"case 24: ctx.save();var start;var end;if(this.h[0] < this.h[1]){start = this.h[0];end = this.h[1]}else{start = this.h[1];end = this.h[0];};start=(360-start)*Math.PI/180;end=(360-end)*Math.PI/180;var w = 0.5*(scale_x_radius(this.w[0]));var wh = 0.5*(scale_y_radius(this.w[1]));ctx.scale(1,wh/w);var f = w/wh;ctx.arc(this.x[0],this.y[0]*f,w,start,end,true); if(this.use_dashed == 1 ){if( ctx.setLineDash ){ ctx.setLineDash([this.dashtype0,this.dashtype1]);}else{ ctx.mozDash = [this.dashtype0,this.dashtype1];};};ctx.stroke();var xh = this.x[0]+ w*Math.cos(start);var yh = f*(this.y[0]+ wh*Math.sin(start));var xh0 = this.x[0]+ w*Math.cos(start+0.1);var yh0 = f*(this.y[0]+ wh*Math.sin(start+0.1));draw_arrowhead(xh,yh,xh0,yh0,ctx);ctx.restore();break;");break;
        case 25: fprintf(js_include_file,"case 25: ctx.save();var start;var end;if(this.h[0] < this.h[1]){start = this.h[0];end = this.h[1]}else{start = this.h[1];end = this.h[0];};start=(360-start)*Math.PI/180;end=(360-end)*Math.PI/180;var w = 0.5*(scale_x_radius(this.w[0]));var wh = 0.5*(scale_y_radius(this.w[1]));ctx.scale(1,wh/w);var f = w/wh;ctx.arc(this.x[0],this.y[0]*f,w,start,end,true); if(this.use_dashed == 1 ){if( ctx.setLineDash ){ ctx.setLineDash([this.dashtype0,this.dashtype1]);}else{ ctx.mozDash = [this.dashtype0,this.dashtype1];};};ctx.stroke();var xh = this.x[0]+ w*Math.cos(end);var yh = f*(this.y[0]+ wh*Math.sin(end));var xh0 = this.x[0]+ wh*Math.cos(end-0.1);var yh0 =  f*(this.y[0]+ wh*Math.sin(end-0.1));draw_arrowhead(xh,yh,xh0,yh0,ctx);ctx.restore();break;");break;
        case 26: fprintf(js_include_file,"case 26: ctx.save();var start;var end;if(this.h[0] < this.h[1]){start = this.h[0];end = this.h[1]}else{start = this.h[1];end = this.h[0];};start=(360-start)*Math.PI/180;end=(360-end)*Math.PI/180;var w = 0.5*(scale_x_radius(this.w[0]));var wh = 0.5*(scale_y_radius(this.w[1]));ctx.scale(1,wh/w);var f = w/wh;ctx.arc(this.x[0],this.y[0]*f,w,start,end,true); if(this.use_dashed == 1 ){if( ctx.setLineDash ){ ctx.setLineDash([this.dashtype0,this.dashtype1]);}else{ ctx.mozDash = [this.dashtype0,this.dashtype1];};};ctx.stroke();var xh = this.x[0]+ w*Math.cos(start);var yh = f*(this.y[0]+ wh*Math.sin(start));var xh0 = this.x[0]+ w*Math.cos(start+0.1);var yh0 = f*(this.y[0]+ wh*Math.sin(start+0.1));draw_arrowhead(xh,yh,xh0,yh0,ctx);xh = this.x[0]+ w*Math.cos(end);yh = f*(this.y[0]+ wh*Math.sin(end));xh0 = this.x[0]+ wh*Math.cos(end-0.1);yh0 = f*(this.y[0]+ wh*Math.sin(end-0.1));draw_arrowhead(xh,yh,xh0,yh0,ctx);ctx.restore();break;");break;
 
        default: break;
      }
    }
  }

    fprintf(js_include_file," var marge = 2*this.org_line_width;\
      switch(this.type){default:break;");
    for( i=0; i < MAX_DRAGSTUFF; i++){
      if( dragstuff[i] == 1 ){
      switch(i){
        case 1: fprintf(js_include_file,"case 1: for(var p = 0 ; p < this.x.length; p++ ){if( mx < this.x[p] + marge && mx > this.x[p] - marge ){if( my < this.y[p]+marge && my > this.y[p] - marge ){return p;};};};break;");break;
        case 2: fprintf(js_include_file,"case 2: for(var p = 0 ; p < this.x.length; p++ ){if( Math.abs(distance(this.x[p],this.y[p],mx,my) ) < this.w[p] + 4*marge ){return p;break;};};break;");break;
        case 3: fprintf(js_include_file,"case 3: for(var p = 0 ; p < this.x.length; p++ ){if( Math.abs(distance(this.x[p],this.y[p],mx,my) ) < scale_x_radius(this.w[p]) + marge ){return p;break;};};break;");break;
        case 4: fprintf(js_include_file,"case 4: var diff;var q;var r;for(var p = 0 ; p < this.x.length-1; p = p+2 ){if( ((this.x[p+1] - this.x[p]) != 0) && ((this.y[p+1]-this.y[p]) != 0) ){r = (this.y[p+1]-this.y[p])/(this.x[p+1]-this.x[p]);q = this.y[p] - (r)*(this.x[p]);diff = distance_to_line(r,q,mx,my);}else{if( (this.y[p+1]-this.y[p]) != 0 ){diff = Math.abs(this.x[p] - mx);}else{diff = Math.abs(this.y[p] - my);};};if( diff < marge ){ return p;};}; break;");break;
        case 5: fprintf(js_include_file,"case 5: marge = 2*marge;for(var p = 0 ; p < this.x.length; p++ ){if( mx < this.x[p] + marge && mx > this.x[p] - marge ){if( my < this.y[p]+marge && my > this.y[p] - marge ){return p;};};};break;");break;
        case 6: fprintf(js_include_file,"case 6: marge = 0.5*this.w[0];for(var p = 0 ; p < this.x.length; p++ ){if( mx < this.x[p] + marge && mx > this.x[p] - marge ){if( my < this.y[p]+marge && my > this.y[p] - marge ){return p;};};};break;");break;
        case 7: fprintf(js_include_file,"case 7: for(var p = 0 ; p < this.x.length; p++ ){if( (this.x[p] - this.w[p] <= mx) && (this.x[p] + this.w[p] >= mx) && (this.y[p] - this.h[p] <= my) && (this.y[p] + this.h[p] >= my) ){return p;};};break;");break;
        case 8: fprintf(js_include_file,"case 8: var diff;var q;var r;for(var p = 0 ; p < this.x.length-1; p = p+2 ){if( ((this.x[p+1] - this.x[p]) != 0) && ((this.y[p+1]-this.y[p]) != 0) ){r = (this.y[p+1]-this.y[p])/(this.x[p+1]-this.x[p]);q = this.y[p] - (r)*(this.x[p]);diff = distance_to_line(r,q,mx,my);}else{if( (this.y[p+1]-this.y[p]) != 0 ){diff = Math.abs(this.x[p] - mx);}else{diff = Math.abs(this.y[p] - my);};};if( diff < marge ){ return p;};}; break;");break;
        case 9: fprintf(js_include_file,"case 9: for(var p = 0 ; p < this.x.length; p++ ){if( (this.x[p] - this.line_width <= mx) && (this.x[p] + this.w[p] + this.line_width >= mx) && (this.y[p] - this.line_width <= my) && (this.y[p] + this.h[p] +this.line_width >= my) ){return p;};};break;");break;
        case 10: fprintf(js_include_file,"case 10: var diff;var q;var r;for(var p = 0 ; p < this.x.length-1; p = p+2 ){if( ((this.x[p+1] - this.x[p]) != 0) && ((this.y[p+1]-this.y[p]) != 0) ){r = (this.y[p+1]-this.y[p])/(this.x[p+1]-this.x[p]);q = this.y[p] - (r)*(this.x[p]);diff = distance_to_line(r,q,mx,my);}else{if( (this.y[p+1]-this.y[p]) != 0 ){diff = Math.abs(this.x[p] - mx);}else{diff = Math.abs(this.y[p] - my);};};if( diff < marge ){ return p;};}; break;");break;
        case 11: fprintf(js_include_file,"case 11: break;");break;
        case 12: fprintf(js_include_file,"case 12: var radius = 0.5*(scale_x_radius(this.w[0]));for(var p = 0 ; p < this.x.length; p++ ){var d = Math.abs(distance(this.x[p],this.y[p],mx,my));if( d < radius + marge && d > radius - marge ){return p;break;};};break;");break;
        case 13: fprintf(js_include_file,"case 13: for(var p = 0 ; p < this.x.length; p++ ){if( Math.abs(distance(this.x[p],this.y[p],mx,my) ) < scale_x_radius(this.w[p]) + marge ){return p;break;};};break;");break;
        case 14: fprintf(js_include_file,"case 14: for(var p = 0 ; p < this.x.length; p++ ){if( my < this.y[p] && my > this.y[p] - this.textheight ){if( mx < this.x[p] + this.textwidth && mx > this.x[p] ){ return p;break;};};};break;");break;
        case 15: fprintf(js_include_file,"case 15: break;");break;
        case 16: fprintf(js_include_file,"case 16: break;");break;
        case 17: fprintf(js_include_file,"case 17: var radius = scale_x_radius(this.w[0]);var d = Math.abs(distance(this.x[0],this.y[0],mx,my));if( d < radius + marge && d > radius - marge ){return 0;break;};break;");break;
        case 18: fprintf(js_include_file,"case 18: var diff;var q;var r;if(((this.x[1] - this.x[0]) != 0) && ((this.y[1]-this.y[0]) != 0)){r = (this.y[1]-this.y[0])/(this.x[1]-this.x[0]);q = this.y[0] - (r)*(this.x[0]);diff = distance_to_line(r,q,mx,my);}else{if((this.y[1]-this.y[0])!= 0){diff = Math.abs(this.x[0] - mx);}else{diff = Math.abs(this.y[0] - my);};};if( diff < marge ){ return 0;};break;");break;
        case 19: fprintf(js_include_file,"case 19: marge = 2*marge;for(var p = 0 ; p < this.x.length; p++ ){if( mx < this.x[p] + marge && mx > this.x[p] - marge ){if( my < this.y[p]+marge && my > this.y[p] - marge ){return p;};};};break;");break;
        case 20: fprintf(js_include_file,"case 20: for(var p = 0 ; p < this.x.length; p++ ){if( (this.x[p] - this.line_width <= mx) && (this.x[p] + this.w[p] + this.line_width >= mx) && (this.y[p] - this.line_width <= my) &&(this.y[p] + this.h[p] +this.line_width >= my) ){return p;};};break;");break;
        case 21: fprintf(js_include_file,"case 21: marge = 2*marge;for(var p = 0 ; p < this.x.length; p++ ){if( mx < this.x[p] + marge && mx > this.x[p] - marge ){if( my < this.y[p]+marge && my > this.y[p] - marge ){return p;};};};break;");break;
        case 22: fprintf(js_include_file,"case 22: break;");break;
        case 24: fprintf(js_include_file,"case 24: var radius = 0.5*(scale_x_radius(this.w[0]));for(var p = 0 ; p < this.x.length; p++ ){var d = Math.abs(distance(this.x[p],this.y[p],mx,my));if( d < radius + marge && d > radius - marge ){return p;break;};};break;");break;
        case 25: fprintf(js_include_file,"case 25: var radius = 0.5*(scale_x_radius(this.w[0]));for(var p = 0 ; p < this.x.length; p++ ){var d = Math.abs(distance(this.x[p],this.y[p],mx,my));if( d < radius + marge && d > radius - marge ){return p;break;};};break;");break;
        case 26: fprintf(js_include_file,"case 26: var radius = 0.5*(scale_x_radius(this.w[0]));for(var p = 0 ; p < this.x.length; p++ ){var d = Math.abs(distance(this.x[p],this.y[p],mx,my));if( d < radius + marge && d > radius - marge ){return p;break;};};break;");break;
        default: break;

  fprintf(js_include_file,"};return -1;};\
 var obj = create_canvas%d(%d,xsize,ysize);\
 var container_div = document.getElementById(\"canvas_div%d\");\
 function CanvasState(canvas,container_div){\
  this.canvas = canvas;this.width = canvas.width;this.height = canvas.height;var ctx = canvas.getContext(\"2d\");this.ctx = ctx;this.valid = false;this.shapes = [];this.moved = [];this.dragging = false;this.selection = null;var myState = this;\
  container_div.addEventListener( 'mouseup'    , mouseup,false);\
  container_div.addEventListener( 'mousemove'  , mousemove,false);\
  container_div.addEventListener( 'mousedown'  , mousedown,false);\
  container_div.addEventListener('touchstart'  , function(e) { e.preventDefault(); mousedown(e.changedTouches[0]);},false);\
  container_div.addEventListener( 'touchmove'  , function(e) { e.preventDefault(); mousemove(e.changedTouches[0]);},false);\
  container_div.addEventListener( 'touchend'   , function(e) { e.preventDefault(); mouseup(  e.changedTouches[0]);},false);\

 /*
 dragdrop + onclick for 'dragstuff', command 'copy' and external 'xml/mathml/javascript objects'
 only the FIRST x,y value-pair is used for the reply !!
 */
  if(reply_format == 100){/* this reply is raw javascript giving ALL object/properties */
    fprintf(js_include_file,"\n/* add reply stuff */\
    CanvasState.prototype.read_dragdrop = function(props){\
    if( wims_status == 'done' || use_dragdrop_reply == -1 ){return null;};\
    if( typeof(props) !== 'object' ){var props = ['clicked','text','angle'];};\
    var s = props.length;\
    var obj = dragstuff.shapes;\

    };\
    return total;\
   };read_dragdrop%d = dragstuff.read_dragdrop;",canvas_root_id);
    } else  {
  /* dragdrop will only report the first x/y eg x[0]:y[0]:radius[0]:angle[0]*/
      fprintf(js_include_file,"\n/* add reply stuff */\
   function set_precision(val){val = (Math.round(dragdrop_precision*val))/dragdrop_precision;if(Number.isNaN(val) ){return 'NaN';}else{return val;};};\
   CanvasState.prototype.read_dragdrop = function(){\
    if( wims_status == \"done\" || use_dragdrop_reply == -1 ){return null;};\
    var len = dragdrop_reply.length;\
    var idx,x,y;\

   };read_dragdrop%d = dragstuff.read_dragdrop;",canvas_root_id);
    }
  }
  else /* use_dragstuff == 1 : no mouse code ! */
  {
    fprintf(js_include_file,"\n/* no mouse actions needed */\
  var container_div = document.getElementById(\"canvas_div%d\");\
  function CanvasState(canvas,container_div){this.canvas = canvas;this.width = canvas.width;this.height = canvas.height;var ctx = canvas.getContext(\"2d\");this.ctx = ctx;this.shapes = [];this.moved = [];this.dragging = false;this.selection = null;this.draw();};\
  CanvasState.prototype.addShape = function(shape){this.shapes.push(shape);this.draw();};\
  CanvasState.prototype.clear = function(){this.ctx.clearRect(0, 0, this.width, this.height);};\
  CanvasState.prototype.draw = function(){var shapes = this.shapes;this.clear();var l = shapes.length;var shape;for(var i = 0; i < l; i++){shape = shapes[i];shape.draw(this.ctx);};};var obj = create_canvas%d(%d,xsize,ysize);\
  var dragstuff = new CanvasState(obj,container_div);",canvas_root_id,canvas_root_id,DRAG_CANVAS);
    if(reply_format != -1 ){ fprintf(js_include_file,"\n/* add reply stuff */read_dragdrop%d = dragstuff.read_dragdrop;\n",canvas_root_id);}
  }
}
Subversion Repositories wimsdev

(root)/trunk/wims/src/Misc/canvasdraw/canvasdragstuff.c – Rev 18553 → 18561
