Subversion Repositories wimsdev

Rev

Rev 18556 | Rev 18609 | Go to most recent revision | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
8225 bpr 1
#include "canvasdraw.h"
2
 
15111 schaersvoo 3
void add_js_zoom_buttons(char *stroke_color,double stroke_opacity){
4
fprintf(js_include_file,"\n/* draw zoom buttons */\
8448 schaersvoo 5
var draw_zoom_buttons = function(){\
6
 var obj;var canvas_type =%d;\
7
 if( document.getElementById(\"wims_canvas%d\"+canvas_type) ){\
8
  obj = document.getElementById(\"wims_canvas%d\"+canvas_type);\
16844 bpr 9
 } else {\
8448 schaersvoo 10
  obj = create_canvas%d(canvas_type,xsize,ysize);\
11
 };\
12
 var ctx = obj.getContext(\"2d\");\
15313 schaersvoo 13
 ctx.font =\"20px Arial\";\
8448 schaersvoo 14
 ctx.textAlign = \"right\";\
9406 schaersvoo 15
 ctx.fillStyle=\"rgba(%s,%f)\";\
8448 schaersvoo 16
 ctx.fillText(\"+\",xsize,ysize);\
15111 schaersvoo 17
 ctx.fillText(\"\\u2212\",xsize - 15,ysize-2);\
8448 schaersvoo 18
 ctx.fillText(\"\\u2192\",xsize - 30,ysize-2);\
19
 ctx.fillText(\"\\u2190\",xsize - 45,ysize-2);\
20
 ctx.fillText(\"\\u2191\",xsize - 60,ysize-2);\
21
 ctx.fillText(\"\\u2193\",xsize - 75,ysize-2);\
11002 schaersvoo 22
 ctx.fillText(\"\\u00D7\",xsize - 90,ysize-2);\
8448 schaersvoo 23
 ctx.stroke();\
15111 schaersvoo 24
};draw_zoom_buttons();",BG_CANVAS,canvas_root_id,canvas_root_id,canvas_root_id,stroke_color,stroke_opacity);
8448 schaersvoo 25
}
26
 
15111 schaersvoo 27
void add_js_popup(char *getfile_cmd){
18556 bpr 28
  fprintf(stdout,"\n<!-- begin command popup %d -->\n\
16844 bpr 29
<script>\n\
14038 schaersvoo 30
if( wims_status != 'done'){\
31
 var popup = window.open('','','toolbar=no,scrollbars=yes,menubar=no,location=no,resizable=yes,top=4,left=4,status=no, width = %dpx, height = %dpx');\
32
 var popupHTML =\"<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN' 'http://www.w3.org/TR/html4/loose.dtd'>\\n<html><head></head>\\n<body><div style='width:%dpx;height:%dpx;position:relative' id='canvas_div%d'></div><div id='tooltip_placeholder_div%d' style='display:block;position:relative;margin-left:auto;margin-right:auto;margin-bottom:4px;'><span id='tooltip_placeholder%d' style='display:none;'></span></div></body></html>\";\
33
 popup.document.write(popupHTML);\
34
 var s0 = popup.document.createElement(\"script\");\
35
 s0.text=\"var wims_status = window.opener.wims_status; var use_dragdrop_reply = window.opener.use_dragdrop_reply;window.opener.canvas_scripts.push('%d');\";\
36
 popup.document.getElementsByTagName(\"HEAD\")[0].appendChild(s0);\
37
 var s1 = popup.document.createElement(\"script\");\
38
 s1.src = \"%s\";\
39
 popup.document.getElementsByTagName(\"HEAD\")[0].appendChild(s1);\
40
 popup.document.close();\
16844 bpr 41
 } else {\
42
  var canvas_div = document.getElementById('canvas_div%d');\
43
  canvas_div.style.display='block';\
15111 schaersvoo 44
 };\n</script>\n<!-- end command popup %d -->\n",
9329 schaersvoo 45
canvas_root_id,
9333 schaersvoo 46
xsize+40,ysize+40,
9329 schaersvoo 47
xsize,ysize,
48
canvas_root_id,
49
canvas_root_id,
50
canvas_root_id,
51
canvas_root_id,
52
getfile_cmd,
9331 schaersvoo 53
canvas_root_id,
9329 schaersvoo 54
canvas_root_id);
55
}
56
 
15111 schaersvoo 57
void add_js_tooltip(char *tooltip_text,char *bgcolor){
18556 bpr 58
  fprintf(stdout,"\n<!-- begin command intooltip %d -->\n\
16844 bpr 59
<script>\n\
7614 schaersvoo 60
var xsize = %d;\
61
var ysize = %d;\
62
var tooltip%d_obj_x = 0;\
63
var tooltip%d_obj_y = 0;\
64
var tooltip%d_flipflop = 0;\
65
var tooltip%d_obj = document.getElementById(\"canvas_div%d\");\
66
tooltip%d_obj.style.display=\"none\";\
67
tooltip%d_obj.style.position=\"absolute\";\
68
var tooltip%d_link = document.createElement(\"a\");\
69
tooltip%d_link.addEventListener(\"mousemove\",tooltip%d_drag,false);\
70
tooltip%d_link.setAttribute(\"onclick\",\"tooltip%d_show()\");\
71
tooltip%d_link.innerHTML  = \"%s\";\
72
var tooltip_placeholder = document.getElementById(\"tooltip_placeholder%d\");\
73
tooltip_placeholder.style.display=\"block\";\
74
tooltip_placeholder.style.position=\"absolute\";\
75
tooltip_placeholder.style.backgroundColor=\"%s\";\
76
tooltip_placeholder.appendChild(tooltip%d_link);\
77
function tooltip%d_drag(action){\
14038 schaersvoo 78
 if(!action){ action = event; };\
7614 schaersvoo 79
 if(action.clientX){\
80
  tooltip%d_obj.style.left = (tooltip%d_mouseX(action) + 10) +\"px\";\
81
  var ytop = tooltip%d_mouseY(action);\
82
  if(ytop + ysize < window.innerHeight){\
83
   tooltip%d_obj.style.top = (ytop - 10) +\"px\";\
16844 bpr 84
  } else {\
7614 schaersvoo 85
   tooltip%d_obj.style.top = parseInt(ytop - 0.8*ysize) +\"px\";\
14038 schaersvoo 86
  };\
16844 bpr 87
 } else {\
7614 schaersvoo 88
  return null;\
14038 schaersvoo 89
 };\
90
};\
7614 schaersvoo 91
function tooltip%d_mouseX(action){\
92
 if(action.pageX){\
93
  return action.pageX;\
16844 bpr 94
 } else {\
7614 schaersvoo 95
  if(action.clientX){\
96
   return action.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);\
16844 bpr 97
  } else {\
7614 schaersvoo 98
   return null;\
14038 schaersvoo 99
  };\
100
 };\
101
};\
7614 schaersvoo 102
function tooltip%d_mouseY(action){\
103
 if(action.pageY){\
104
  return action.pageY;\
16844 bpr 105
 } else {\
7614 schaersvoo 106
  if(action.clientY){\
107
   return action.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop :document.body.scrollTop);\
16844 bpr 108
  } else {\
7614 schaersvoo 109
   return null;\
14038 schaersvoo 110
  };\
111
 };\
112
};\
7614 schaersvoo 113
function tooltip%d_show(){\
114
 if(tooltip%d_flipflop == 0){\
115
  tooltip%d_obj.style.display = \"block\";\
116
  tooltip%d_flipflop = 1;\
16844 bpr 117
 } else {\
7614 schaersvoo 118
  tooltip%d_flipflop = 0;\
119
  tooltip%d_obj.style.display = \"none\";\
14038 schaersvoo 120
 };\
14090 schaersvoo 121
};\n</script>\n<!-- end command intooltip %d -->\n",canvas_root_id,xsize,ysize,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,tooltip_text,canvas_root_id,bgcolor,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id);
8224 bpr 122
}
7614 schaersvoo 123
 
8224 bpr 124
/*
7614 schaersvoo 125
 
7991 schaersvoo 126
type = 0 : x-values only [command mousex]
127
type = 1 : y-values only [command mousey]
128
type = 2 : (x:y)         [command mouse]
11017 schaersvoo 129
type = 3 : degree        [command mouse_degree]
130
type = 4 : radian
131
type = 5 : radius
11040 schaersvoo 132
 
15111 schaersvoo 133
  var mouse = getMouse(evt,canvas_div);\
11040 schaersvoo 134
  var x = evt.clientX - mouse_canvas_rect.left;\
135
  var y = evt.clientY - mouse_canvas_rect.top;\
136
 
7991 schaersvoo 137
*/
15111 schaersvoo 138
void add_js_mouse(int canvas_cnt,int precision,char *stroke_color,int font_size,double stroke_opacity,int type){
18556 bpr 139
  fprintf(js_include_file,"\n/* command mouse on mouse canvas */\
7614 schaersvoo 140
function use_mouse_coordinates(){\
11041 schaersvoo 141
 var display_type = %d;\
11006 schaersvoo 142
 var canvas_type = %d;\
143
 var mouse_canvas = create_canvas%d(canvas_type,xsize,ysize);\
11005 schaersvoo 144
 var mouse_context = mouse_canvas.getContext(\"2d\");\
15111 schaersvoo 145
 mouse_canvas.addEventListener(\"mousemove\",show_coordinate%d,false);\
11005 schaersvoo 146
 mouse_canvas.addEventListener(\"touchmove\", function(e){ e.preventDefault();show_coordinate%d(e.changedTouches[0]);},false);\
7614 schaersvoo 147
 var prec = Math.log(%d)/(Math.log(10));\
148
 function show_coordinate%d(evt){\
15111 schaersvoo 149
  var mouse = getMouse(evt,mouse_canvas);\
11002 schaersvoo 150
  var x = mouse.x;\
151
  var y = mouse.y;\
11041 schaersvoo 152
  var m_data = \"\";\
153
  switch(display_type){\
7996 schaersvoo 154
   case 0: m_data = \" \"+(px2x(x)).toFixed(prec)+\" \"+unit_x;break;\
155
   case 1: m_data = \" \"+(px2y(y)).toFixed(prec)+\" \"+unit_y;break;\
7991 schaersvoo 156
   case 2: m_data = \"(\"+(px2x(x)).toFixed(prec)+\":\"+(px2y(y)).toFixed(prec)+\")\";break;\
11017 schaersvoo 157
   case 3: if(userdraw_radius[0]){ m_data = \" \"+( ( userdraw_radius[0])/(Math.PI/180) ).toFixed(prec)+\" \\u00B0 \";};break;\
158
   case 4: if(userdraw_radius[0]){ m_data = \" \"+(userdraw_radius[0]).toFixed(prec)+\" rad \";};break;\
12000 schaersvoo 159
   case 5: if( userdraw_x.length > 0 ){var L = userdraw_x.length;m_data = \" R = \"+((xmax - xmin)*(distance(x,y,userdraw_x[L-1],userdraw_y[L-1]))/xsize).toFixed(prec)+\" \"+unit_x;};break;\
7991 schaersvoo 160
   default:break;\
161
  };\
7614 schaersvoo 162
  var s = parseInt(0.8*%d*(m_data.toString()).length);\
15313 schaersvoo 163
  mouse_context.font = \"%dpx Arial\";\
11005 schaersvoo 164
  mouse_context.fillStyle = \"rgba(%s,%f)\";\
165
  mouse_context.clearRect(0,0,s,1.2*%d);\
166
  mouse_context.fillText(m_data,0,%d);\
7614 schaersvoo 167
 };\
11006 schaersvoo 168
};",type,MOUSE_CANVAS,canvas_root_id,canvas_root_id,canvas_root_id,precision,canvas_root_id,font_size,font_size,stroke_color,stroke_opacity,font_size,font_size);
7856 schaersvoo 169
}
8112 schaersvoo 170
 
8224 bpr 171
/*
14208 schaersvoo 172
Math.sin: angle in radians
173
x1 = x*cos(a) - y*sin(a)
174
y1 = y*cos(a) + x*sin(a)
175
show_display = 0  nothing
176
show_display = 1 delta X
177
show_display = 2 delta Y
178
show_display = 3 delta R radians
179
show_display = 4 delta degrees
180
show_display = 5 delta X:Y
10952 schaersvoo 181
 
8112 schaersvoo 182
*/
15111 schaersvoo 183
void add_slider_display(int precision,int font_size,char *font_color,double stroke_opacity){
18556 bpr 184
  fprintf(js_include_file,"\n/* add_slider_display */\
14208 schaersvoo 185
var slider_prec = Math.log(%d)/(Math.log(10));\
14038 schaersvoo 186
 function show_slider_value(value,use_slider_display){\
8112 schaersvoo 187
 var current_canvas = create_canvas%d(%d,xsize,ysize);\
188
 var current_context = current_canvas.getContext(\"2d\");\
189
 current_context.clearRect(0,0,xsize,ysize);\
190
 var string;\
10952 schaersvoo 191
 switch(use_slider_display){\
14208 schaersvoo 192
  case 0: return;\
193
  case 1: string = '\\u0394 x = '+value.toFixed(slider_prec)+' '+unit_x;break;\
194
  case 2: string = '\\u0394 y = '+value.toFixed(slider_prec)+' '+unit_y;break;\
195
  case 3: string = '\\u2221 = '+value.toFixed(slider_prec)+'\\u03C0 rad';break;\
196
  case 4: string = '\\u2221 = '+(value*(180/Math.PI)).toFixed(slider_prec)+'\\u00B0';break;\
197
  case 5: string = 'not implemented';break;\
198
  default: string = '['+value+']';break;\
8112 schaersvoo 199
 };\
200
 var s = parseInt(1.2*%d*(string).length);\
15313 schaersvoo 201
 current_context.font = '%dpx Arial';\
14208 schaersvoo 202
 current_context.strokeStyle = 'rgba(%s,%.2f)';\
8112 schaersvoo 203
 current_context.clearRect(0,0,s,1.2*%d);\
14208 schaersvoo 204
 current_context.fillText(string,0,%d);};",precision,canvas_root_id,MOUSE_CANVAS,font_size,font_size,font_color,stroke_opacity,font_size,font_size);
8112 schaersvoo 205
}
11002 schaersvoo 206
 
15111 schaersvoo 207
void add_slider(int anim){
18556 bpr 208
  if(anim != 2 ){
209
    fprintf(js_include_file,"\n/* add_slider aux*/\
16872 schaersvoo 210
if( typeof( slidergroup) !== 'object'){var slidergroup = [];};\
14208 schaersvoo 211
function rotateXY(obj,angle){\
212
 if( typeof(angle) === 'undefined' ){console.log('rotateXY() angle undefined');return obj;};\
213
 var len = obj.x.length;\
15111 schaersvoo 214
 if( typeof(len) === 'undefined' ){obj.angle = angle;return obj;};\
215
 var cos = Math.cos(angle - obj.angle);\
216
 var sin = Math.sin(angle - obj.angle);\
14208 schaersvoo 217
 obj.angle = angle;\
15111 schaersvoo 218
 var xc,yc;\
219
 if( obj.use_rotation_center == 0 ){\
220
  xc = obj.x[0];\
221
  yc = obj.y[0];\
222
 }else{\
223
  xc = obj.rotation_center[0];\
224
  yc = obj.rotation_center[1];\
225
 };\
14208 schaersvoo 226
 var x,y;\
227
 for(var p = 0 ; p < len ; p++ ){\
228
  x = obj.x[p];\
229
  y = obj.y[p];\
230
  obj.x[p] = (cos * (x - xc)) + (sin * (y - yc)) + xc;\
15111 schaersvoo 231
  obj.y[p] = (cos * (y - yc)) - (sin * (x - xc)) + yc;\
14208 schaersvoo 232
 };\
233
 return obj;\
234
};\
235
function rotateARC(obj,angle){\
236
 obj.h[0] = angle;\
237
 obj.angle = -1*angle;\
238
 return obj;\
239
};\
15111 schaersvoo 240
function slider_show_it(XYR,dx,value,slider_id){\
241
 if(slidergroup.length != 0){\
242
  var len = slidergroup.length;var use_xml = false;\
243
  for(var i = 0;i < len;i++){\
244
   use_xml = false;var obj = slidergroup[i];\
245
   if( obj !== null ){\
246
    if( obj.use_slider[0] != -1 ){\
247
     var sl = obj.use_slider.length;\
248
     for(var s = 0 ; s < sl;s++ ){\
249
      if(obj.use_slider[s] == slider_id ){\
250
       if( typeof(obj.type) !== 'number' ){use_xml = true;};\
251
       switch(XYR){\
252
        case 'X' : obj = move(obj,dx,0);dragdrop_reply[obj.object_cnt].x = obj.x;break;\
253
        case 'Y' : obj = move(obj,0,dx);dragdrop_reply[obj.object_cnt].y = obj.y;break;\
254
        case 'R' : if(obj.type == 17 ){obj = rotateARC(obj,value);}else{obj = rotateXY(obj,value);};dragdrop_reply[obj.object_cnt].angle = obj.angle;break;\
255
        default : break;\
256
       };\
257
      };\
258
     };\
259
    };\
260
    if( use_xml ){ draw_xml(obj); }\
261
    dragstuff.draw();dragstuff.valid = false;\
262
   };\
263
  };\
264
 };\
265
 return;\
266
};\
267
");
18556 bpr 268
  }
269
  if(anim == 0){fprintf(js_include_file,"\n/* add_slider */\
14208 schaersvoo 270
if( typeof(unit_x) === 'undefined' ){var unit_x = ' ';};\
271
if( typeof(unit_y) === 'undefined' ){var unit_y = ' ';};\
15111 schaersvoo 272
function slider(XYR,text,slider_id ,width,height,linewidth,fillcolor,strokecolor,opacity,min,max,fontfamily,display){\
273
 if( wims_status == \"done\" ){return;};var tooltip_div = document.getElementById(\"tooltip_placeholder_div%d\");\
274
 var xcenter = 0.5*width;var rcenter = 0.5*width;fillcolor = 'rgba('+fillcolor+','+opacity[0]+')' || 'rgba(200,200,0,0.2)';\
15655 schaersvoo 275
 strokecolor = 'rgba('+strokecolor+','+opacity[1]+')';var title = document.createElement('SPAN');title.innerHTML = text;\
15111 schaersvoo 276
 var br = document.createElement('BR');tooltip_div.appendChild(br);tooltip_div.appendChild(title);\
277
 var slider_canvas = document.createElement('canvas');slider_canvas.id = 'canvas'+slider_id;tooltip_div.appendChild(slider_canvas);\
278
 slider_canvas.width = width;slider_canvas.height = height;var slider_ctx = slider_canvas.getContext(\"2d\");\
279
 slider_ctx.font = fontfamily;slider_ctx.strokeStyle = strokecolor;\
280
 slider_ctx.fillStyle = fillcolor;slider_ctx.lineWidth = linewidth;slider_ctx.save();\
281
 slider_ctx.beginPath();slider_ctx.moveTo(0,height-10);slider_ctx.lineTo(width,height-10);\
282
 slider_ctx.moveTo(xcenter-10,10);slider_ctx.lineTo(xcenter+10,10);slider_ctx.lineTo(xcenter,height-10);\
283
 slider_ctx.lineTo(xcenter-10,10);slider_ctx.closePath();slider_ctx.stroke();slider_ctx.fill();\
284
 slider_canvas.addEventListener( 'mousemove' ,slide_me,false);\
285
 slider_canvas.addEventListener( 'mouseup' ,stop_slide_me,false);\
286
 slider_canvas.addEventListener( 'mousedown' ,start_slide_me,false);\
287
 slider_canvas.addEventListener( 'touchstart', function(e){ e.preventDefault();start_slide_me(e.changedTouches[0]);},false);\
288
 slider_canvas.addEventListener( 'touchend',   function(e){ e.preventDefault();stop_slide_me(e.changedTouches[0]);},false);\
289
 slider_canvas.addEventListener( 'touchmove' ,function(e){ e.preventDefault();slide_me(e.changedTouches[0]);},false);\
290
 var slider_active = false;var value;\
291
 function stop_slide_me(evt){slider_active = false;};\
292
 function start_slide_me(evt){slider_active = true;};\
14208 schaersvoo 293
 function slide_me(evt){\
15111 schaersvoo 294
  if( slider_active == false ){return;};\
14208 schaersvoo 295
  var canvas_rect = slider_canvas.getBoundingClientRect();\
296
  slider_ctx.clearRect(0,0,width,height);\
15111 schaersvoo 297
  var px = parseInt(evt.clientX - canvas_rect.left);\
298
  slider_ctx.beginPath();slider_ctx.moveTo(0,height-10);slider_ctx.lineTo(width,height-10);\
299
  slider_ctx.moveTo(px-10,10);slider_ctx.lineTo(px+10,10);slider_ctx.lineTo(px,height-10);\
300
  slider_ctx.lineTo(px-10,10);slider_ctx.closePath();slider_ctx.stroke();slider_ctx.fill();\
301
  value = (px - rcenter)/width*(max - min);\
302
  if( display > 0 ){show_slider_value(value,display);};\
303
  var dx = px - xcenter;xcenter = px;\
304
  slider_show_it(XYR,dx,value,slider_id);\
14208 schaersvoo 305
 };\
15111 schaersvoo 306
};",canvas_root_id);
18556 bpr 307
  }
308
  if( anim == 1){
309
    fprintf(js_include_file,"\n/* add_anim_slider */\
15111 schaersvoo 310
function animslider(XYR,text,slider_id ,width,height,linewidth,fillcolor,strokecolor,opacity,min,max,fontfamily,display)\
311
{\
312
 document.addEventListener('readystatechange',function(event){\
313
  if(event.target.readyState === 'complete'){\
314
   var value= 0;\
315
   var timer = setInterval(function(){\
316
    value++;slider_show_it(XYR,value,value,slider_id);\
317
    if( value > width ){clearInterval( timer );}\
318
   },240);\
319
  };\
320
 },false);\
321
};");
18556 bpr 322
  }
16872 schaersvoo 323
 
18556 bpr 324
  if( anim == 2 ){/* use mouse in stead of a X|Y slider... external images -via command 'copy' NOT supported !! need to add 'copy' to dragstuff library or introduce another command*/
325
    fprintf(js_include_file,"\n/* add group move_ */\
16892 schaersvoo 326
if( typeof( slidergroup) !== 'object'){var slidergroup = [];};\
16882 schaersvoo 327
var move_group = function(num){\
16892 schaersvoo 328
 canvas_div.addEventListener( 'mousemove' ,slidegroup_m,false);\
329
 canvas_div.addEventListener( 'mousedown' ,slidegroup_d,false);\
330
 canvas_div.addEventListener( 'mouseup'   ,slidegroup_u,false);\
331
 canvas_div.addEventListener( 'touchstart', function(e){ e.preventDefault();slidegroup_d(e.changedTouches[0]);},false);\
332
 canvas_div.addEventListener( 'touchend',   function(e){ e.preventDefault();slidegroup_u(e.changedTouches[0]);},false);\
333
 canvas_div.addEventListener( 'touchmove' ,function(e){ e.preventDefault();slidegroup_m(e.changedTouches[0]);},false);\
16872 schaersvoo 334
 var slide_start = false;\
16892 schaersvoo 335
 function slidegroup_d(e){slide_start = true;};\
336
 function slidegroup_u(e){slide_start = false;};\
16872 schaersvoo 337
 function slidegroup_m(e){\
16892 schaersvoo 338
  if(!slide_start){return;};\
16872 schaersvoo 339
  var xy;var d_x;var d_y;var len = slidergroup.length;var use_xml = false;var once = 1;\
340
  for(var i = 0;i < len;i++){\
341
   use_xml = false;\
342
   if( typeof(slidergroup[i]) === 'object' ){\
343
    var obj = slidergroup[i];\
344
    if( obj.use_slider == num ){\
16892 schaersvoo 345
     if( typeof(obj.type) !== 'number' ){use_xml = true;};\
346
     xy = getMouse(e,dragstuff.canvas);\
347
     if( once == 1 ){ d_x = xy.x - obj.x[0];d_y = xy.y - obj.y[0];once = 0;};\
348
     obj = move(obj,d_x,d_y);\
349
     if(obj.use_snap != 0 ){var lx = (obj.x).length;for(var t = 0;t < lx;t++){var xy = multisnap_check(obj.x[t],obj.y[t],obj.use_snap);obj.x[t] = xy[0];obj.y[t] = xy[1];};};\
16872 schaersvoo 350
     dragdrop_reply[obj.object_cnt].x = obj.x;dragdrop_reply[obj.object_cnt].y = obj.y;\
16892 schaersvoo 351
     if( use_xml ){obj.onclick = 5;draw_xml(obj);}else{dragstuff.selection = null;dragstuff.draw();dragstuff.valid = false;};\
352
    };\
353
   };\
354
  };\
16872 schaersvoo 355
  dragstuff.valid = true;\
16892 schaersvoo 356
 };\
16872 schaersvoo 357
};");
18556 bpr 358
  }
16872 schaersvoo 359
 
360
}
15111 schaersvoo 361
/*      dragdrop_reply[obj.object_cnt] = obj;
8097 schaersvoo 362
*/
8224 bpr 363
/*
7833 schaersvoo 364
adds inputfield for x-value: returns the js-calculated y-value after click on 'OK' button
365
draws a non-configurable crosshair on this calculated location
366
*/
15111 schaersvoo 367
void add_calc_y(char *jsmath,int font_size,char *css_class){
18556 bpr 368
  fprintf(js_include_file,"\n/* add_calc_y */\
7858 schaersvoo 369
use_jsmath=1;\
7856 schaersvoo 370
function add_calc_y(){\
11002 schaersvoo 371
 if( wims_status == \"done\" ){return;};\
372
 var fun = to_js_math(\"%s\");if(fun == null){return;};\
373
 function eval_jsmath(x){return parseFloat(eval(fun));};\
374
 var tooltip_div = document.getElementById(\"tooltip_placeholder_div%d\");\
375
 var calc_div = document.createElement('div');\
376
 calc_div.id = \"calc_div\";\
377
 tooltip_div.appendChild(calc_div);\
378
 var label_x = \"x\";var label_y = \"y\";\
11088 schaersvoo 379
 if( typeof(xaxislabel) !== 'undefined' ){label_x = xaxislabel;}\
380
 if( typeof(yaxislabel) !== 'undefined' ){label_y = yaxislabel;}\
18572 bpr 381
 calc_div.innerHTML=\"<br><span style='font-style:italic;font-size:%dpx'>\"+label_x+\" : <input type='text' size='4' value='' id='calc_input_x' style='%s'>&nbsp;\"+ label_y+\" : <input type='text' size='5' value='' id='calc_output_y' style='%s' readonly><input id='calc_button' type='button' value='OK' onclick=''  style='color:red;background-color:lightblue;'></span> \";\
11002 schaersvoo 382
 var calc_button = document.getElementById(\"calc_button\");\
15111 schaersvoo 383
 calc_button.addEventListener(\"mousedown\",show_it,false);\
11002 schaersvoo 384
 calc_button.addEventListener(\"touchstart\", function(e){ e.preventDefault();show_it(e.changedTouches[0]);},false);\
385
 function show_it(){\
386
  var x_value=document.getElementById(\"calc_input_x\").value;\
387
  var y_value = eval_jsmath(x_value);\
388
  document.getElementById(\"calc_output_y\").value = y_value;\
389
  if(isNaN(y_value)){return;};\
390
  var canvas = create_canvas%d(123,xsize,ysize);\
391
  var ctx = canvas.getContext(\"2d\");\
392
  draw_crosshairs(ctx,[x2px(x_value)],[y2px(y_value)],1,5,\"#000000\",1,0,0,0,[0,0]);return;\
393
 };\
394
};\
15111 schaersvoo 395
;add_calc_y();",jsmath,canvas_root_id,font_size,css_class,css_class,canvas_root_id);
7833 schaersvoo 396
}
397
/*
398
 x-value of the mouse will be used to calculate via javascript the corresponding y-value using the verbatim js-math function
399
 a configurable crosshair and vertical/horizontal crosshair lines will be drawn
400
 function is called "use_mouse_coordinates() and thus can not be combined with command 'mouse'
401
*/
16844 bpr 402
void add_trace_js_mouse(int canvas_cnt, char *stroke_color, char *jsmath,
403
  int font_size, double stroke_opacity, int line_width,
404
  int crosshair_size,char *css_class){
18556 bpr 405
    fprintf(js_include_file,"\n/* add_trace_jsmath */\
7858 schaersvoo 406
use_jsmath=1;\
7839 schaersvoo 407
function use_trace_jsmath(){\
7956 schaersvoo 408
if( wims_status == \"done\" ){return;};\
7833 schaersvoo 409
 var label_x = \"x\";var label_y = \"y\";\
11088 schaersvoo 410
 if( typeof(xaxislabel) !== 'undefined' ){label_x = xaxislabel;}\
411
 if( typeof(yaxislabel) !== 'undefined' ){label_y = yaxislabel;}\
7823 schaersvoo 412
 var trace_canvas = create_canvas%d(%d,xsize,ysize);\
413
 var trace_context = trace_canvas.getContext(\"2d\");\
7856 schaersvoo 414
 var tooltip_div = document.getElementById(\"tooltip_placeholder_div%d\");\
7839 schaersvoo 415
 var trace_div = document.createElement('div');\
416
 trace_div.id = \"trace_div\";\
7856 schaersvoo 417
 tooltip_div.appendChild(trace_div);\
18572 bpr 418
 trace_div.innerHTML = \"<br><span style='font-style:italic;font-size:%dpx'>\"+label_x+\" : <input type='text' size='4' value='' id='trace_input_x' style='%s'>\"+label_y+\" : <input type='text' size='5' value='' id='trace_input_y' style='%s' readonly></span> \";\
7858 schaersvoo 419
 canvas_div.addEventListener(\"mousemove\",trace,false);\
11002 schaersvoo 420
 canvas_div.addEventListener(\"touchmove\",function(e){ e.preventDefault();trace(e.changedTouches[0]);},false);\
7981 schaersvoo 421
 var fun = to_js_math(\"%s\");if(fun == null){return;};\
7858 schaersvoo 422
 function eval_jsmath(x){return parseFloat(eval(fun));};\
423
 function trace(evt){\
15111 schaersvoo 424
  var mouse = getMouse(evt,trace_canvas);\
11002 schaersvoo 425
  var x_px = mouse.x;\
7834 schaersvoo 426
  var x = px2x(x_px);\
7823 schaersvoo 427
  var y = eval_jsmath(x);\
428
  if(isNaN(y)){return;};\
7834 schaersvoo 429
  var y_px = y2px(y);\
7823 schaersvoo 430
  trace_context.clearRect(0,0,xsize,ysize);\
7834 schaersvoo 431
  draw_crosshairs(trace_context,[x_px],[y_px],%d,%d,\"%s\",%f,0,0,0,[0,0]);\
7856 schaersvoo 432
  document.getElementById(\"trace_input_x\").value = x;\
433
  document.getElementById(\"trace_input_y\").value = y;\
7823 schaersvoo 434
 };\
435
 return;\
15111 schaersvoo 436
};use_trace_jsmath();",canvas_root_id,canvas_cnt,canvas_root_id,font_size,css_class,css_class,jsmath,line_width,crosshair_size,stroke_color,stroke_opacity);
18556 bpr 437
  }
7663 schaersvoo 438
 
8224 bpr 439
/*
440
add a table with 2 textarea's labeled 'x' 'y' ( or 'xlabel' 'ylabel' if defined)
7749 schaersvoo 441
add two buttons: OK and NOK (OK draws; NOK will delete last item pair from userdraw_x / userdraw_y array's
442
*/
15111 schaersvoo 443
void add_textarea_xy(char *css_class){
18556 bpr 444
  fprintf(js_include_file,"\n/* add_textarea_xy */\
7856 schaersvoo 445
function add_textarea_xy(){\
7956 schaersvoo 446
if( wims_status == \"done\" ){return;};\
7856 schaersvoo 447
var tooltip_div = document.getElementById(\"tooltip_placeholder_div%d\");\
448
var textarea_div = document.createElement('div');\
449
textarea_div.id = \"textarea_div\";\
450
tooltip_div.appendChild(textarea_div);\
7663 schaersvoo 451
var label_x = \"x\";var label_y = \"y\";\
11088 schaersvoo 452
if( typeof(xaxislabel) !== 'undefined' ){label_x = xaxislabel;}\
453
if( typeof(yaxislabel) !== 'undefined' ){label_y = yaxislabel;}\
7856 schaersvoo 454
textarea_div.innerHTML=\"\
455
<table style=\'border:1px solid black;background-color:#ffffa0\' >\
456
<tr>\
18572 bpr 457
 <td><input id='textarea_ok_button' type='button' value='OK' onclick='' style='color:red;background-color:lightblue;'></td>\
458
 <td><input id='textarea_nok_button' type='button' value='NOK' onclick='' style='color:blue;background-color:red;'></td>\
7856 schaersvoo 459
</tr>\
460
<tr>\
461
 <td><em>\"+label_x+\"</em></td>\
462
 <td><em>\"+label_y+\"</em></td>\
463
</tr>\
464
<tr>\
8815 schaersvoo 465
 <td><textarea rows='5' cols='2' id='userinput_x' style='%s' ></textarea></td>\
466
 <td><textarea rows='5' cols='2' id='userinput_y' style='%s' ></textarea></td>\
7856 schaersvoo 467
</tr>\
468
</table>\";\
469
var textarea_ok_button = document.getElementById(\"textarea_ok_button\");\
470
var textarea_nok_button = document.getElementById(\"textarea_nok_button\");\
15111 schaersvoo 471
textarea_ok_button.addEventListener(\"mousedown\",function(e){redraw_userdraw();return;},false);\
472
textarea_nok_button.addEventListener(\"mousedown\",function(e){remove_last();return;},false);\
7856 schaersvoo 473
return;\
15111 schaersvoo 474
};add_textarea_xy();",canvas_root_id,css_class,css_class);
18556 bpr 475
  }
7663 schaersvoo 476
 
7838 schaersvoo 477
/*
478
*/
15111 schaersvoo 479
void add_setlimits(int font_size,char *css_class){
18556 bpr 480
  fprintf(js_include_file,"\n/* add_setlimits */\
7839 schaersvoo 481
function use_setlimits(){\
7956 schaersvoo 482
if( wims_status == \"done\" ){return;};\
7858 schaersvoo 483
var label_x = \"x\";var label_y = \"y\";\
11088 schaersvoo 484
if( typeof(xaxislabel) !== 'undefined' ){label_x = xaxislabel;}\
485
if( typeof(yaxislabel) !== 'undefined' ){label_y = yaxislabel;}\
7856 schaersvoo 486
var tooltip_div = document.getElementById(\"tooltip_placeholder_div%d\");\
7839 schaersvoo 487
var setlim_div = document.createElement('div');\
7856 schaersvoo 488
setlim_div.id = \"setlim_div\";\
489
tooltip_div.appendChild(setlim_div);\
18572 bpr 490
setlim_div.innerHTML=\"<br><span style='font-style:italic;font-size:%dpx'>\"+label_x+\"min = <input type='text' size='4' value='\"+xmin+\"' id='userinput_xmin' style='%s'> \"+label_x+\"max = <input type='text' size='4' value='\"+xmax+\"' id='userinput_xmax' style='%s'><br>\"+label_y+\"min = <input type='text' size='4' value='\"+ymin+\"' id='userinput_ymin' style='%s'> \"+label_y+\"max = <input type='text' size='4' value='\"+ymax+\"' id='userinput_ymax' style='%s'><br><input id='set_limits' type='button' value='OK' onclick='' style='color:red;background-color:lightblue;'>\";\
7838 schaersvoo 491
var setlimit_button = document.getElementById(\"set_limits\");\
492
function set_limits(e){\
493
xmin = safe_eval(document.getElementById('userinput_xmin').value);\
494
xmax = safe_eval(document.getElementById('userinput_xmax').value);\
495
ymin = safe_eval(document.getElementById('userinput_ymin').value);\
496
ymax = safe_eval(document.getElementById('userinput_ymax').value);\
497
if(xmin > xmax || ymin > ymax){alert(\"your limits are not correct...\");return;}\
15111 schaersvoo 498
try{redraw_jsplot();}catch(e){console.log('redraw_jsplot failed:'+e);};\
499
try{redraw_grid();}catch(e){console.log('redraw_grid failed:'+e);};\
500
try{dragstuff.Zoom(xmin,xmax,ymin,ymax)}catch(e){console.log('zooming dragstuff failed:'+e);};return;};\
7839 schaersvoo 501
setlimit_button.addEventListener(\"mousedown\",function(e){set_limits();},false);\
15111 schaersvoo 502
};use_setlimits();",canvas_root_id,font_size,css_class,css_class,css_class,css_class);
7838 schaersvoo 503
}
8193 schaersvoo 504
 
15111 schaersvoo 505
void add_input_jsfunction(char *css_class,char *input_label,int input_cnt,char *stroke_color,float stroke_opacity,int line_width,int use_dashed,int dashtype0,int dashtype1,int font_size){
18556 bpr 506
  fprintf(js_include_file,"\n/* add_input_jsfunction */\
8297 schaersvoo 507
function clear_jsfunction(canvas_plot_id,input_field){\
8193 schaersvoo 508
 try{\
8297 schaersvoo 509
  var canvas_plot = document.getElementById(\"wims_canvas%d\"+canvas_plot_id);\
510
  var canvas_plot_ctx = canvas_plot.getContext(\"2d\");\
8193 schaersvoo 511
  if( confirm(\"clear function plot?\") ){\
8297 schaersvoo 512
   canvas_plot_ctx.clearRect(0,0,xsize,ysize);\
513
   document.getElementById(input_field).value = \"\";\
514
  };\
515
  return;\
516
 }catch(e){alert(e+\"nothing to remove...\");};\
9244 schaersvoo 517
 return;\
518
};\
15111 schaersvoo 519
function add_input_jsfunction(input_cnt,css_class,input_label,line_width,stroke_color,stroke_opacity,use_dashed,dashtype0,dashtype1){\
8297 schaersvoo 520
 var canvas_plot_id = %d+input_cnt;\
15111 schaersvoo 521
 var label = input_label[input_cnt];\
522
 if( typeof(multistrokecolors) === 'object'){ stroke_color = multistrokecolors[input_cnt];};\
8297 schaersvoo 523
 var input_field = \"canvas_input\"+input_cnt;\
524
 var update_button_id = \"update_button\"+input_cnt;\
525
 var delete_button_id = \"delete_button\"+input_cnt;\
526
 if( wims_status == \"done\" ){return;};\
527
 var tooltip_div = document.getElementById(\"tooltip_placeholder_div%d\");\
528
 var input_jsfunction_div = document.createElement('div');\
529
 input_jsfunction_div.id = \"input_jsfunction_div\"+input_cnt;\
530
 tooltip_div.appendChild(input_jsfunction_div);\
18572 bpr 531
 input_jsfunction_div.innerHTML+=\"<br><span style='font-style:italic;font-size:%dpx;color:rgb(\"+stroke_color+\")'><b>\"+label+\" <input type='text' size='16' value='' id='\"+input_field+\"' style='\"+css_class+\"'></b><input id='\"+update_button_id+\"' type='button' value='OK' onclick='' style='color:red;background-color:lightblue;'><input id='\"+delete_button_id+\"' type='button' value='NOK' onclick='' style='color:blue;background-color:red;'></span> \";\
8297 schaersvoo 532
 var update_button = document.getElementById(update_button_id);\
533
 var delete_button = document.getElementById(delete_button_id);\
15111 schaersvoo 534
 update_button.addEventListener(\"mousedown\",function(e){jsplot(canvas_plot_id,[rawmath(document.getElementById(input_field).value)],[line_width],[stroke_color],[stroke_opacity],[use_dashed],dashtype0,dashtype1,0,0,300,0,1);return;},false);\
8297 schaersvoo 535
 delete_button.addEventListener(\"mousedown\",function(e){clear_jsfunction(canvas_plot_id,input_field);return;},false);\
9244 schaersvoo 536
};\
15111 schaersvoo 537
add_input_jsfunction(%d,\"%s\",%s,%d,\"%s\",%.2f,%d,%d,%d);",canvas_root_id,USERDRAW_JSPLOT,canvas_root_id,font_size,input_cnt,css_class,input_label,line_width,stroke_color,stroke_opacity,use_dashed,dashtype0,dashtype1);
8193 schaersvoo 538
}
8224 bpr 539
/*
540
adds 2 inputfields (x:y) and 'ok' | 'nok' button
7668 schaersvoo 541
these are used for user drawing with inputfields...
15529 schaersvoo 542
function update_me(){\
543
 var x = safe_eval(document.getElementById('userinput_x').value);\
544
 var y = safe_eval(document.getElementById('userinput_y').value);\
545
 userdraw_x.push(x2px(x));userdraw_y.push(y2px(y));\
546
 return;\
547
};\
7668 schaersvoo 548
*/
15111 schaersvoo 549
void add_input_xy(int font_size,char *css_class){
18556 bpr 550
  fprintf(js_include_file,"\n/* add_input_xy */\
7856 schaersvoo 551
function add_input_xy(){\
7956 schaersvoo 552
if( wims_status == \"done\" ){return;};\
7856 schaersvoo 553
var tooltip_div = document.getElementById(\"tooltip_placeholder_div%d\");\
554
var input_xy_div = document.createElement('div');\
555
input_xy_div.id = \"input_xy_div\";\
556
tooltip_div.appendChild(input_xy_div);\
7663 schaersvoo 557
var label_x = \"x\";var label_y = \"y\";\
18572 bpr 558
input_xy_div.innerHTML=\"<br><span style='font-style:italic;font-size:%dpx'><b>( <input type='text' size='5' value='' id='userinput_x' style='%s'> : <input type='text' size='5' value='' id='userinput_y' style='%s'> )</b><input id='update_button' type='button' value='OK' onclick=''  style='color:red;background-color:lightblue;'><input id='delete_button' type='button' value='NOK' onclick='' style='color:blue;background-color:red;'></span> \";\
7652 schaersvoo 559
var update_button = document.getElementById(\"update_button\");\
7668 schaersvoo 560
var delete_button = document.getElementById(\"delete_button\");\
15111 schaersvoo 561
update_button.addEventListener(\"mousedown\",function(e){update_me();redraw_userdraw();return;},false);\
562
delete_button.addEventListener(\"mousedown\",function(e){remove_last();return;},false);\
563
};add_input_xy();",canvas_root_id,font_size,css_class,css_class);
7652 schaersvoo 564
}
565
 
7668 schaersvoo 566
/* adds 4 inputfields (x1:y1) --- (x2:y2) and 'ok' + 'nok' button */
15111 schaersvoo 567
void add_input_x1y1x2y2(int font_size,char *css_class){
18556 bpr 568
  fprintf(js_include_file,"\n/* add_input_x1y1x2y2 */\
7856 schaersvoo 569
function add_input_x1y1x2y2(){\
7956 schaersvoo 570
if( wims_status == \"done\" ){return;};\
7856 schaersvoo 571
var tooltip_div = document.getElementById(\"tooltip_placeholder_div%d\");\
572
var input_x1y1x2y2_div = document.createElement('div');\
573
input_x1y1x2y2_div.id = \"input_x1y1x2y2_div\";\
574
tooltip_div.appendChild(input_x1y1x2y2_div);\
18572 bpr 575
input_x1y1x2y2_div.innerHTML=\"<br><span style='font-size:%dpx'><b>( <input type='text' size='5' value='' id='userinput_x1' style='%s'> : <input type='text' size='5' value='' id='userinput_y1' style='%s'> ) ----- ( <input type='text' size='5' value='' id='userinput_x2' style='%s'> : <input type='text' size='5' value='' id='userinput_y2' style='%s'> )</b><input id='update_button' type='button' value='OK' onclick='' style='color:red;background-color:lightblue;'><input id='delete_button' type='button' value='NOK' onclick='' style='color:blue;background-color:red;'></span> \";\
7652 schaersvoo 576
var update_button = document.getElementById(\"update_button\");\
7668 schaersvoo 577
var delete_button = document.getElementById(\"delete_button\");\
15111 schaersvoo 578
update_button.addEventListener(\"mousedown\",function(e){redraw_userdraw();return;},false);\
579
delete_button.addEventListener(\"mousedown\",function(e){remove_last();return;},false);\
580
};add_input_x1y1x2y2();",canvas_root_id,font_size,css_class,css_class,css_class,css_class);
7652 schaersvoo 581
}
582
 
7668 schaersvoo 583
/* adds 3 inputfields Center (x:y) Radius r and 'ok'+'nok' buttons */
15111 schaersvoo 584
void add_input_xyr(int font_size,char *css_class){
18556 bpr 585
  fprintf(js_include_file,"\n/* add_input_xyr */\
7856 schaersvoo 586
function add_input_xyr(){\
7956 schaersvoo 587
if( wims_status == \"done\" ){return;};\
7856 schaersvoo 588
var tooltip_div = document.getElementById(\"tooltip_placeholder_div%d\");\
589
var input_xyr_div = document.createElement('div');\
590
input_xyr_div.id = \"input_xyr_div\";\
591
tooltip_div.appendChild(input_xyr_div);\
18572 bpr 592
input_xyr_div.innerHTML=\"<br><span style='font-style:italic;font-size:%dpx'><b>Center : ( <input type='text' size='5' value='' id='userinput_x' style='%s'> : <input type='text' size='5' value='' id='userinput_y' style='%s'> ) Radius : <input type='text' size='5' value='' id='userinput_r' style='%s'></b><input id='update_button' type='button' value='OK' onclick='' style='color:red;background-color:lightblue;'><input id='delete_button' type='button' value='NOK' onclick='' style='color:blue;background-color:red;'></span> \";\
7652 schaersvoo 593
var update_button = document.getElementById(\"update_button\");\
7668 schaersvoo 594
var delete_button = document.getElementById(\"delete_button\");\
15111 schaersvoo 595
update_button.addEventListener(\"mousedown\",function(e){redraw_userdraw();return;},false);\
596
delete_button.addEventListener(\"mousedown\",function(e){remove_last();return;},false);\
597
};add_input_xyr();",canvas_root_id,font_size,css_class,css_class,css_class);
7652 schaersvoo 598
}
599
 
7749 schaersvoo 600
/* THESE JS-FUNCTIONS COULD BE MADE LESS COPY & PASTE "PROGRAMMING" */
601
 
7663 schaersvoo 602
/* draw circle(s) / point(s) via 3 inputfields */
15111 schaersvoo 603
void add_input_circle(int type,int num){
8224 bpr 604
/*
605
type = 0 : a point ...radius is fixed
7652 schaersvoo 606
type = 1 : a circle ... read inputfield userinput_r
607
num = 1 : a single point / circle
608
num = 2 : multiple points / circles
609
*/
18556 bpr 610
  fprintf(js_include_file,"\n/* add_input_circle */\
7668 schaersvoo 611
function user_redraw(t){\
612
 var type = %d;\
613
 var num = %d;\
7780 schaersvoo 614
 var lu = userdraw_x.length;\
12006 schaersvoo 615
 if( t == -1 && lu > 0){userdraw_x.splice(lu-1,1);userdraw_y.splice(lu-1,1);if(type == 1){userdraw_radius.splice(lu-1,1);};context_userdraw.clearRect(0,0,xsize,ysize);draw_circles(context_userdraw,userdraw_x,userdraw_y,userdraw_radius,line_width,stroke_color,stroke_opacity,use_filled,fill_color,fill_opacity,use_dashed,dashtype0,dashtype1);xy_cnt = userdraw_x.length;return;};\
7749 schaersvoo 616
 var add_x = safe_eval( document.getElementById(\"userinput_x\").value );\
617
 var add_y = safe_eval( document.getElementById(\"userinput_y\").value );\
12006 schaersvoo 618
 if( add_x != null && add_y != null ){if( type == 1 ){var add_r = safe_eval( document.getElementById(\"userinput_r\").value );if( add_r == null ){alert(\"illegal radius input \");return;};if( num == 1 ){userdraw_radius[0] = parseInt(Math.abs(xsize*(add_r)/(xmax - xmin)));}else{userdraw_radius.push( parseInt(Math.abs(xsize*(add_r)/(xmax - xmin))) );};}else{userdraw_radius[lu] = userdraw_radius[0];};if( num == 1 ){userdraw_x[0] = x2px(add_x);userdraw_y[0] = y2px(add_y);xy_cnt=1;}else{userdraw_x.push(x2px(add_x));userdraw_y.push(y2px(add_y));xy_cnt = userdraw_x.length;};context_userdraw.clearRect(0,0,xsize,ysize);draw_circles(context_userdraw,userdraw_x,userdraw_y,userdraw_radius,line_width,stroke_color,stroke_opacity,use_filled,fill_color,fill_opacity,use_dashed,dashtype0,dashtype1);};\
7749 schaersvoo 619
 return;\
620
};",type,num);
7652 schaersvoo 621
}
7663 schaersvoo 622
/* draw crosshairs via inputfields x/y */
15111 schaersvoo 623
void add_input_crosshair(int num){
18556 bpr 624
  fprintf(js_include_file,"\n/* add_input_crosshair */\
7668 schaersvoo 625
function user_redraw(t){\
7780 schaersvoo 626
 var lu = userdraw_x.length;\
627
 if( t == -1 && lu > 0){\
628
  userdraw_x.splice(lu-1,1);\
629
  userdraw_y.splice(lu-1,1);\
7749 schaersvoo 630
  context_userdraw.clearRect(0,0,xsize,ysize);\
631
  draw_crosshairs(context_userdraw,userdraw_x,userdraw_y,line_width,crosshair_size,stroke_color,stroke_opacity,0,0,0,[0,0]);\
632
  return;\
633
 };\
634
 var add_x = safe_eval( document.getElementById(\"userinput_x\").value );\
635
 var add_y = safe_eval( document.getElementById(\"userinput_y\").value );\
636
 if( add_x != null && add_y != null ){\
7654 schaersvoo 637
  if( %d == 1 ){\
638
   userdraw_x[0] = x2px(add_x);\
639
   userdraw_y[0] = y2px(add_y);\
16844 bpr 640
  } else {\
7654 schaersvoo 641
    userdraw_x[lu] = x2px(add_x);\
642
    userdraw_y[lu] = y2px(add_y);\
643
    xy_cnt++;\
644
  };\
645
  context_userdraw.clearRect(0,0,xsize,ysize);\
646
  draw_crosshairs(context_userdraw,userdraw_x,userdraw_y,line_width,crosshair_size,stroke_color,stroke_opacity,0,0,0,[0,0]);\
647
 };\
7749 schaersvoo 648
 return;\
7654 schaersvoo 649
};",num);
650
}
651
 
7663 schaersvoo 652
/* draw arrows via inputfields x/y */
15111 schaersvoo 653
void add_input_arrow(int num){
18556 bpr 654
  fprintf(js_include_file,"\n/* add_input_arrow */\
7668 schaersvoo 655
function user_redraw(t){\
7780 schaersvoo 656
 var lu = userdraw_x.length;\
657
 if( t == -1 && lu > 1 ){\
658
  userdraw_x.splice(lu-2,2);\
659
  userdraw_y.splice(lu-2,2);\
7747 schaersvoo 660
  context_userdraw.clearRect(0,0,xsize,ysize);\
8071 schaersvoo 661
  draw_arrows(context_userdraw,userdraw_x,userdraw_y,arrow_head,line_width,stroke_color,stroke_opacity,use_dashed,dashtype0,dashtype1,type,use_rotate,angle,0,[1,0,0,1,0,0]);\
7747 schaersvoo 662
  return;\
663
 };\
7749 schaersvoo 664
 var add_x1 = safe_eval( document.getElementById(\"userinput_x1\").value );\
665
 var add_y1 = safe_eval( document.getElementById(\"userinput_y1\").value );\
666
 var add_x2 = safe_eval( document.getElementById(\"userinput_x2\").value );\
667
 var add_y2 = safe_eval( document.getElementById(\"userinput_y2\").value );\
668
 if( add_x1 != null && add_y1 != null && add_x2 != null && add_y2 != null ){\
7654 schaersvoo 669
  if( %d == 2 ){\
670
    var s = userdraw_x.length;\
7780 schaersvoo 671
    userdraw_x[lu] = x2px(add_x1);\
672
    userdraw_y[lu] = y2px(add_y1);\
673
    userdraw_x[lu+1] = x2px(add_x2);\
674
    userdraw_y[lu+1] = y2px(add_y2);\
16844 bpr 675
  } else {\
7654 schaersvoo 676
   userdraw_x[0] = x2px(add_x1);\
677
   userdraw_y[0] = y2px(add_y1);\
678
   userdraw_x[1] = x2px(add_x2);\
679
   userdraw_y[1] = y2px(add_y2);\
680
  };\
681
  context_userdraw.clearRect(0,0,xsize,ysize);\
8071 schaersvoo 682
  draw_arrows(context_userdraw,userdraw_x,userdraw_y,arrow_head,line_width,stroke_color,stroke_opacity,use_dashed,dashtype0,dashtype1,type,use_rotate,angle,0,[1,0,0,1,0,0]);\
7654 schaersvoo 683
 };\
7749 schaersvoo 684
 return;\
7654 schaersvoo 685
};",num);
686
}
687
 
7746 schaersvoo 688
/* draw line via inputfields x/y */
15111 schaersvoo 689
void add_input_line(int num){
18556 bpr 690
  fprintf(js_include_file,"\n/* line via inputfields  */\
7746 schaersvoo 691
function user_redraw(t){\
7780 schaersvoo 692
 var lu = userdraw_x.length;\
693
 if( t == -1 && lu > 1){\
694
  userdraw_x.splice(lu-2,2);\
695
  userdraw_y.splice(lu-2,2);\
7746 schaersvoo 696
  context_userdraw.clearRect(0,0,xsize,ysize);\
697
  draw_lines(context_userdraw,userdraw_x,userdraw_y,line_width,stroke_color,stroke_opacity,use_dashed,dashtype0,dashtype1,1,0,0);\
698
  return;\
699
 };\
7749 schaersvoo 700
 var add_x1 = safe_eval( document.getElementById(\"userinput_x1\").value );\
701
 var add_y1 = safe_eval( document.getElementById(\"userinput_y1\").value );\
702
 var add_x2 = safe_eval( document.getElementById(\"userinput_x2\").value );\
703
 var add_y2 = safe_eval( document.getElementById(\"userinput_y2\").value );\
704
 if( add_x1 != null && add_y1 != null && add_x2 != null && add_y2 != null ){\
7746 schaersvoo 705
  if( %d == 2 ){\
7780 schaersvoo 706
    userdraw_x[lu] = x2px(add_x1);\
707
    userdraw_y[lu] = y2px(add_y1);\
708
    userdraw_x[lu+1] = x2px(add_x2);\
709
    userdraw_y[lu+1] = y2px(add_y2);\
16844 bpr 710
  } else {\
7746 schaersvoo 711
   userdraw_x[0] = x2px(add_x1);\
712
   userdraw_y[0] = y2px(add_y1);\
713
   userdraw_x[1] = x2px(add_x2);\
714
   userdraw_y[1] = y2px(add_y2);\
715
  };\
716
  context_userdraw.clearRect(0,0,xsize,ysize);\
717
  draw_lines(context_userdraw,userdraw_x,userdraw_y,line_width,stroke_color,stroke_opacity,use_dashed,dashtype0,dashtype1,1,0,0);\
718
 };\
7749 schaersvoo 719
 return;\
7746 schaersvoo 720
};",num);
721
}
722
 
723
 
7663 schaersvoo 724
/* draw polyline via inputfields x/y */
15111 schaersvoo 725
void add_input_polyline(){
18556 bpr 726
  fprintf(js_include_file,"\n/* polyline_segment via inputfields */\
7668 schaersvoo 727
function user_redraw(t){\
8071 schaersvoo 728
 var lu = userdraw_x.length;\
7962 schaersvoo 729
 cnt = 1;\
7780 schaersvoo 730
 if( t == -1 && lu > 0){\
8071 schaersvoo 731
  userdraw_x.splice(lu-1,1);\
732
  userdraw_y.splice(lu-1,1);\
733
  context_userdraw.clearRect(0,0,xsize,ysize);\
734
  draw_polyline(context_userdraw,userdraw_x,userdraw_y,line_width,stroke_color,stroke_opacity,use_dashed,dashtype0,dashtype1);\
735
  return;\
736
 };\
737
 var add_x = safe_eval( document.getElementById(\"userinput_x\").value );\
738
 var add_y = safe_eval( document.getElementById(\"userinput_y\").value );\
7749 schaersvoo 739
 if(add_x != null && add_y != null ){\
8071 schaersvoo 740
  userdraw_x.push(x2px(add_x));\
741
  userdraw_y.push(y2px(add_y));\
742
  context_userdraw.clearRect(0,0,xsize,ysize);\
743
  draw_polyline(context_userdraw,userdraw_x,userdraw_y,line_width,stroke_color,stroke_opacity,use_dashed,dashtype0,dashtype1);\
744
 };\
745
 return;\
7663 schaersvoo 746
};");
747
}
748
/* draw segment(s) via inputfields x/y */
15111 schaersvoo 749
void add_input_segment(int num){
18556 bpr 750
  fprintf(js_include_file,"\n/* add_input_segment */\
7668 schaersvoo 751
function user_redraw(t){\
7780 schaersvoo 752
 var lu = userdraw_x.length;\
753
 if( t == -1 && lu > 1){\
754
  userdraw_x.splice(lu-2,2);\
755
  userdraw_y.splice(lu-2,2);\
7746 schaersvoo 756
  context_userdraw.clearRect(0,0,xsize,ysize);\
7668 schaersvoo 757
  draw_segments(context_userdraw,userdraw_x,userdraw_y,line_width,stroke_color,stroke_opacity,use_dashed,dashtype0,dashtype1);\
758
  return;\
759
 };\
7749 schaersvoo 760
 var add_x1 = safe_eval( document.getElementById(\"userinput_x1\").value );\
761
 var add_y1 = safe_eval( document.getElementById(\"userinput_y1\").value );\
762
 var add_x2 = safe_eval( document.getElementById(\"userinput_x2\").value );\
763
 var add_y2 = safe_eval( document.getElementById(\"userinput_y2\").value );\
764
 if( add_x1 != null && add_y1 != null && add_x2 != null && add_y2 != null ){\
7652 schaersvoo 765
  if( %d == 2 ){\
766
    var s = userdraw_x.length;\
767
    userdraw_x[s] = x2px(add_x1);\
768
    userdraw_y[s] = y2px(add_y1);\
769
    userdraw_x[s+1] = x2px(add_x2);\
770
    userdraw_y[s+1] = y2px(add_y2);\
16844 bpr 771
  } else {\
7652 schaersvoo 772
   userdraw_x[0] = x2px(add_x1);\
773
   userdraw_y[0] = y2px(add_y1);\
774
   userdraw_x[1] = x2px(add_x2);\
775
   userdraw_y[1] = y2px(add_y2);\
776
  };\
777
  context_userdraw.clearRect(0,0,xsize,ysize);\
778
  draw_segments(context_userdraw,userdraw_x,userdraw_y,line_width,stroke_color,stroke_opacity,use_dashed,dashtype0,dashtype1);\
7668 schaersvoo 779
 };\
7749 schaersvoo 780
 return;\
7652 schaersvoo 781
};",num);
782
}
7663 schaersvoo 783
 
8244 schaersvoo 784
/* draw demilines(s) via inputfields x/y */
15111 schaersvoo 785
void add_input_demiline(int num){
18556 bpr 786
  fprintf(js_include_file,"\n/* add_input_segment */\
8244 schaersvoo 787
function user_redraw(t){\
788
 var lu = userdraw_x.length;\
789
 if( t == -1 && lu > 1){\
790
  userdraw_x.splice(lu-2,2);\
791
  userdraw_y.splice(lu-2,2);\
792
  context_userdraw.clearRect(0,0,xsize,ysize);\
793
  draw_demilines(context_userdraw,userdraw_x,userdraw_y,line_width,stroke_color,stroke_opacity,use_dashed,dashtype0,dashtype1);\
794
  return;\
795
 };\
796
 var add_x1 = safe_eval( document.getElementById(\"userinput_x1\").value );\
797
 var add_y1 = safe_eval( document.getElementById(\"userinput_y1\").value );\
798
 var add_x2 = safe_eval( document.getElementById(\"userinput_x2\").value );\
799
 var add_y2 = safe_eval( document.getElementById(\"userinput_y2\").value );\
800
 if( add_x1 != null && add_y1 != null && add_x2 != null && add_y2 != null ){\
801
  if( %d == 2 ){\
802
    var s = userdraw_x.length;\
803
    userdraw_x[s] = x2px(add_x1);\
804
    userdraw_y[s] = y2px(add_y1);\
805
    userdraw_x[s+1] = x2px(add_x2);\
806
    userdraw_y[s+1] = y2px(add_y2);\
16844 bpr 807
  } else {\
8244 schaersvoo 808
   userdraw_x[0] = x2px(add_x1);\
809
   userdraw_y[0] = y2px(add_y1);\
810
   userdraw_x[1] = x2px(add_x2);\
811
   userdraw_y[1] = y2px(add_y2);\
812
  };\
813
  context_userdraw.clearRect(0,0,xsize,ysize);\
814
  draw_demilines(context_userdraw,userdraw_x,userdraw_y,line_width,stroke_color,stroke_opacity,use_dashed,dashtype0,dashtype1);\
815
 };\
816
 return;\
817
};",num);
818
}
819
 
15111 schaersvoo 820
void add_clear_button(char *css_class,char *button_text){
11001 schaersvoo 821
/* 25/11/2014 added clearing of reply array
8448 schaersvoo 822
all members will be set to 0 eg reply[0] = 0 , reply[1] = 0 ...
16844 bpr 823
hope this does not interfere with existing work...
8448 schaersvoo 824
*/
11001 schaersvoo 825
/*
16844 bpr 826
5/2016 changed  to 'setAttribute()' because of trouble on Chromium/Safari/IE
11080 schaersvoo 827
10/2016 corrected contex-reset-flaw when using "userdraw text,color" and added inputs to the things we can remove
11764 schaersvoo 828
7/2017 added 'userdraw clickfill,color' to removable things...one user_filling per click
16893 schaersvoo 829
 
18572 bpr 830
7/2022: preserve all div's with html ('<' && '>') eg mathml,katex,html and all external objects placed with function 'place_image_on_canvas(id)'
16900 schaersvoo 831
...hope this does not interfere with other things
16893 schaersvoo 832
https://wimsedu.info/?topic=geometrie-interactive-avec-canvasdraw
11001 schaersvoo 833
*/
18556 bpr 834
  fprintf(js_include_file,"\n/* add clear button */\
8349 schaersvoo 835
clear_draw_area%d = function(){\
15111 schaersvoo 836
 if(typeof(fill_canvas_no) === 'number'){\
837
  var chk = document.getElementById('wims_canvas%d'+fill_canvas_no);\
838
  if( chk ){\
839
   var fill_ctx = chk.getContext(\"2d\");fill_ctx.clearRect(0,0,xsize,ysize);\
840
   fill_canvas_no--;userdraw_x.splice(p,1);userdraw_y.splice(p,1);userdraw_radius.splice(p,1);\
841
   return;\
11763 schaersvoo 842
  };\
843
 };\
11088 schaersvoo 844
 if( typeof(context_userdraw) === 'object' ){\
16893 schaersvoo 845
  if(document.getElementById(canvas_div.lastChild.id).tagName == 'DIV'){\
846
   var mathtxt = document.getElementById(canvas_div.lastChild.id).innerHTML;\
18572 bpr 847
   if(mathtxt.indexOf('<') == -1 && mathtxt.indexOf('>') == -1 || canvas_div.lastChild.id.indexOf('placed') != -1){\
16893 schaersvoo 848
    document.getElementById(canvas_div.lastChild.id).innerHTML = null;\
849
    canvas_div.removeChild(document.getElementById(canvas_div.lastChild.id));\
850
   };\
14270 schaersvoo 851
  };\
11001 schaersvoo 852
  context_userdraw.clearRect(0,0,xsize,ysize);\
15111 schaersvoo 853
  if( typeof(userdraw_text) !== 'undefined'){ userdraw_text = []; };\
11080 schaersvoo 854
  if( document.getElementById(\"canvas_input0\") ){\
855
   var p = 0;var inp;\
856
   while( document.getElementById(\"canvas_input\"+p) ){\
857
    inp = document.getElementById(\"canvas_input\"+p);\
858
    canvas_div.removeChild(inp);\
859
    p++;\
860
   };\
861
   input_cnt = 0;start_input_cnt = 0; \
862
  };\
15111 schaersvoo 863
  userdraw_x = [];userdraw_y = [];userdraw_radius = [];xy_cnt = 0;\
11080 schaersvoo 864
 };\
14270 schaersvoo 865
 if( typeof(external_ctx) === 'object'){\
14038 schaersvoo 866
  external_ctx.clearRect(0,0,xsize,ysize);\
867
  for(var p = 0 ; p < userdraw_x.length; p++){\
868
   userdraw_x[p] = null;userdraw_y[p] = null;\
869
  };\
870
 };\
11080 schaersvoo 871
 return;\
8350 schaersvoo 872
};\
873
function add_clear_button(){\
8146 schaersvoo 874
 var tooltip_placeholder_div = document.getElementById(\"tooltip_placeholder_div%d\");\
8350 schaersvoo 875
 var button = document.createElement('input');\
9858 schaersvoo 876
 button.setAttribute(\"type\" , \"button\");\
11024 schaersvoo 877
 button.setAttribute(\"id\" , \"clearbutton%d\");\
15111 schaersvoo 878
 button.setAttribute(\"class\" , \"%s\");\
9858 schaersvoo 879
 button.setAttribute(\"value\" , \"%s\");\
8350 schaersvoo 880
 button.setAttribute(\"onclick\",\"clear_draw_area%d()\");\
881
 tooltip_placeholder_div.appendChild(button);\
8146 schaersvoo 882
};\
15111 schaersvoo 883
add_clear_button();",canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,css_class,button_text,canvas_root_id);
8146 schaersvoo 884
}
7858 schaersvoo 885
 
15111 schaersvoo 886
void add_color_palette(char *css_class){
18556 bpr 887
  fprintf(js_include_file,"\n/* add color palette */\
11767 schaersvoo 888
function add_color_palette(){\
889
 var tooltip_placeholder_div = document.getElementById(\"tooltip_placeholder_div%d\");\
12006 schaersvoo 890
 var clen = palettecolors.length;\
14038 schaersvoo 891
 for( var p = 0 ; p < clen ; p++ ){\
12006 schaersvoo 892
  var button = document.createElement('input');\
893
  button.setAttribute('type', 'button');\
894
  button.setAttribute('value', '  ');\
895
  button.setAttribute('id',palettecolors[p]);\
896
  button.setAttribute('style', \"%s\");\
897
  button.setAttribute('style','background-color:rgb('+palettecolors[p]+')');\
898
  button.setAttribute(\"backgroundColor\",palettecolors[p]);\
899
  button.addEventListener('mousedown',function(e){var id = this.getAttribute('id');multifillcolors[0]=id;multifillcolors[1]=id;multifillcolors[2]=id;},false);\
900
  tooltip_placeholder_div.appendChild(button);\
901
 };\
902
};\
903
add_color_palette();\
15111 schaersvoo 904
",canvas_root_id,css_class);
11767 schaersvoo 905
}
8146 schaersvoo 906
 
14230 schaersvoo 907
 
8225 bpr 908
struct colors colors[]={
7614 schaersvoo 909
 {"#FF0000","red","255,0,0"},
910
 {"#00FF00","lime","0,255,0"},
911
 {"#0000FF","blue","0,0,255"},
912
 {"#FFA500","orange","255,165,0"},
913
 {"#E9967A","darksalmon","233,150,122"},
914
 {"#F0FFFF","azure","240,255,255"},
915
 {"#CD5C5C","indianred","205,92,92"},
916
 {"#E0FFFF","lightcyan","224,255,255"},
917
 {"#FFE4E1","mistyrose","255,228,225"},
918
 {"#DC143C","crimson","220,20,60"},
919
 {"#FFC0CB","pink","255,192,203"},
920
 {"#FFD700","gold","255,215,0"},
921
 {"#E6E6FA","lavender","230,230,250"},
922
 {"#808080","gray","128,128,128"},
923
 {"#F0F8FF","aliceblue","240,248,255"},
924
 {"#C71585","mediumvioletred","199,21,133"},
925
 {"#FFF0F5","lavenderblush","255,240,245"},
926
 {"#DAA520","goldenrod","218,165,32"},
927
 {"#FFB6C1","lightpink","255,182,193"},
928
 {"#00FFFF","aqua","0,255,255"},
929
 {"#FF69B4","hotpink","255,105,180"},
930
 {"#00FFFF","cyan","0,255,255"},
931
 {"#FF1493","deeppink","255,20,147"},
932
 {"#7FFFD4","aquamarine","127,255,212"},
933
 {"#FA8072","salmon","250,128,114"},
934
 {"#DEB887","burlywood","222,184,135"},
935
 {"#DB7093","palevioletred","219,112,147"},
936
 {"#D2B48C","tan","210,180,140"},
937
 {"#BDB76B","darkkhaki","189,183,107"},
938
 {"#B22222","firebrick","178,34,34"},
939
 {"#FF4500","orangered","255,69,0"},
940
 {"#8B4513","saddlebrown","139,69,19"},
941
 {"#FF8C00","darkorange","255,140,0"},
942
 {"#FFFFE0","lightyellow","255,255,224"},
943
 {"#FFFF00","yellow","255,255,0"},
944
 {"#FFFACD","lemonchiffon","255,250,205"},
945
 {"#F5F5DC","beige","245,245,220"},
946
 {"#FFEFD5","papayawhip","255,239,213"},
947
 {"#FAFAD2","lightgoldenrodyellow","250,250,210"},
948
 {"#FFE4B5","moccasin","255,228,181"},
949
 {"#B8860B","darkgoldenrod","184,134,11"},
950
 {"#FFF8DC","cornsilk","255,248,220"},
951
 {"#FFEBCD","blanchedalmond","255,235,205"},
952
 {"#FFE4C4","bisque","255,228,196"},
953
 {"#FFDEAD","navajowhite","255,222,173"},
954
 {"#F5DEB3","wheat","245,222,179"},
955
 {"#CD853F","peru","205,133,63"},
956
 {"#D2691E","chocolate","210,105,30"},
957
 {"#A0522D","sienna","160,82,45"},
958
 {"#A52A2A","brown","165,42,42"},
959
 {"#BC8F8F","rosybrown","188,143,143"},
960
 {"#F08080","lightcoral","240,128,128"},
961
 {"#FFA07A","lightsalmon","255,160,122"},
962
 {"#8B0000","darkred","139,0,0"},
963
 {"#800000","maroon","128,0,0"},
964
 {"#FAA460","sandybrown","250,164,96"},
965
 {"#FF7F50","coral","255,127,80"},
966
 {"#FF6347","tomato","255,99,71"},
967
 {"#FFDAB9","peachpuff","255,218,185"},
968
 {"#EEE8AA","palegoldenrod","238,232,170"},
969
 {"#F0E68C","khaki","240,230,140"},
970
 {"#D8BFD8","thistle","216,191,216"},
971
 {"#DDA0DD","plum","221,160,221"},
972
 {"#FF00FF","fuchsia","255,0,255"},
973
 {"#FF00FF","magenta","255,0,255"},
974
 {"#EE82EE","violet","238,130,238"},
975
 {"#DA70D6","orchid","218,112,214"},
976
 {"#BA55D3","mediumorchid","186,85,211"},
977
 {"#9370DB","mediumpurple","147,112,219"},
978
 {"#8A2BE2","blueviolet","138,43,226"},
979
 {"#9400D3","darkviolet","148,0,211"},
980
 {"#9932CC","darkorchid","153,50,204"},
981
 {"#8B008B","darkmagenta","139,0,139"},
982
 {"#800080","purple","128,0,128"},
983
 {"#4B0082","indigo","75,0,130"},
984
 {"#483D8B","darkslateblue","72,61,139"},
985
 {"#6A5ACD","slateblue","106,90,205"},
986
 {"#7B68EE","mediumslateblue","123,104,238"},
987
 {"#98FB98","palegreen","152,251,152"},
988
 {"#ADFF2F","greenyellow","173,255,47"},
989
 {"#7FFF00","chartreuse","127,255,0"},
990
 {"#7CFC00","lawngreen","124,252,0"},
991
 {"#00FF7F","springgreen","0,255,127"},
992
 {"#00FA9A","mediumspringgreen","0,250,154"},
993
 {"#90EE90","lightgreen","144,238,144"},
994
 {"#32CD32","limegreen","50,205,50"},
995
 {"#3CB371","mediumseagreen","60,179,113"},
996
 {"#2E8B57","seagreen","46,139,87"},
997
 {"#228B22","forestgreen","34,139,34"},
998
 {"#008000","green","0,128,0"},
999
 {"#006400","darkgreen","0,100,0"},
1000
 {"#9ACD32","yellowgreen","154,205,50"},
1001
 {"#6B8E23","olivedrab","107,142,35"},
1002
 {"#808000","olive","128,128,0"},
1003
 {"#556B2F","darkolivegreen","85,107,47"},
1004
 {"#8FBC8F","darkseagreen","143,188,143"},
1005
 {"#66CDAA","mediumaquamarine","102,205,170"},
1006
 {"#20B2AA","lightseagreen","32,178,170"},
1007
 {"#008B8B","darkcyan","0,139,139"},
1008
 {"#008080","teal","0,128,128"},
1009
 {"#AFEEEE","paleturquoise","175,238,238"},
1010
 {"#40E0D0","turquoise","64,224,208"},
1011
 {"#48D1CC","mediumturquoise","72,209,204"},
1012
 {"#00CED1","darkturquoise","0,206,209"},
1013
 {"#5F9EA0","cadetblue","95,158,160"},
1014
 {"#4682B4","steelblue","70,130,180"},
1015
 {"#B0C4DE","lightsteelblue","176,196,222"},
1016
 {"#B0E0E6","powderblue","176,224,230"},
1017
 {"#ADD8E6","lightblue","173,216,230"},
1018
 {"#87CEEB","skyblue","135,206,235"},
1019
 {"#87CEFA","lightskyblue","135,206,250"},
1020
 {"#00BFFF","deepskyblue","0,191,255"},
1021
 {"#1E90FF","dodgerblue","30,144,255"},
1022
 {"#6495ED","cornflowerblue","100,149,237"},
1023
 {"#4169E1","royalblue","65,105,225"},
1024
 {"#0000CD","mediumblue","0,0,205"},
1025
 {"#00008B","darkblue","0,0,139"},
1026
 {"#000080","navy","0,0,128"},
1027
 {"#191970","midnightblue","25,25,112"},
1028
 {"#DCDCDC","gainsboro","220,220,220"},
1029
 {"#D3D3D3","lightgrey","211,211,211"},
1030
 {"#808080","grey","128,128,128"},
1031
 {"#C0C0C0","silver","192,192,192"},
1032
 {"#A9A9A9","darkgray","169,169,169"},
1033
 {"#778899","lightslategray","119,136,153"},
1034
 {"#708090","slategray","112,128,144"},
1035
 {"#696969","dimgray","105,105,105"},
1036
 {"#2F4F4F","darkslategray","47,79,79"},
11877 schaersvoo 1037
 {"#0a0a0a","black","10,10,10"},
7614 schaersvoo 1038
 {"#F5FFFA","mintcream","245,255,250"},
1039
 {"#FFFFFF","white","255,255,255"},
1040
 {"#F0FFF0","honeydew","240,255,240"},
1041
 {"#F5F5F5","whitesmoke","245,245,245"},
1042
 {"#F8F8FF","ghostwhite","248,248,255"},
1043
 {"#FFFFF0","ivory","255,255,240"},
1044
 {"#FFFAFA","snow","255,250,250"},
1045
 {"#FFFAF0","floralwhite","255,250,240"},
1046
 {"#FFF5EE","seashell","255,245,238"},
1047
 {"#FDF5E6","oldlace","253,245,230"},
1048
 {"#FAF0E6","linen","250,240,230"},
1049
 {"#FAEBD7","antiquewhite","250,235,215"},
1050
 };
8225 bpr 1051
int NUMBER_OF_COLORNAMES=(sizeof(colors)/sizeof(colors[0]));
7858 schaersvoo 1052
 
11005 schaersvoo 1053
/* 10/2016 does not react to border color !! just any border will stop the filling */
15111 schaersvoo 1054
void add_js_filltoborder(int canvas_type){
18556 bpr 1055
  fprintf(js_include_file,"\n/* command filltoborder */\
15111 schaersvoo 1056
function filltoborder(xs,ys,bordercolors,colors,fill_canvas_no,use_special_filling,fill_ctx){\
11820 schaersvoo 1057
 document.body.style.cursor = 'wait';\
8199 schaersvoo 1058
 var canvas = document.getElementById(\"wims_canvas%d%d\");\
1059
 if( ! canvas ){ return; };\
11817 schaersvoo 1060
 document.body.style.cursor = 'wait';\
8199 schaersvoo 1061
 var ctx = canvas.getContext(\"2d\");\
1062
 ctx.save();\
1063
 xs = x2px(xs);\
1064
 ys = y2px(ys);\
15111 schaersvoo 1065
 if( xs <= 0 || xs >= xsize || ys <= 0 || ys >= ysize ){ document.body.style.cursor = 'default';return; };\
8098 schaersvoo 1066
 var image = ctx.getImageData(0, 0, xsize, ysize);\
1067
 var imageData = image.data;\
1068
 var pixelStack = [[xs, ys]];\
1069
 var px1;\
1070
 var newPos;\
1071
 var pixelPos;\
1072
 var found_left_border;\
1073
 var found_right_border;\
15111 schaersvoo 1074
 var fill_image;\
1075
 var fill_data;\
1076
 var _setPixel;\
1077
 function finish_filling(){\
1078
  if(document.getElementById(\"wims_canvas%d\"+fill_canvas_no)){\
1079
  console.log('dit canvas nummer '+fill_canvas_no+' bestaat al');\
16844 bpr 1080
  } else {\
15111 schaersvoo 1081
   var fill_canvas = create_canvas%d(fill_canvas_no,xsize,ysize);\
1082
   var fill_canvas_ctx = fill_canvas.getContext(\"2d\");\
1083
   fill_canvas_ctx.clearRect(0,0,xsize,ysize);\
1084
   fill_canvas_ctx.putImageData(image, 0, 0);\
1085
  };\
1086
  document.body.style.cursor = 'default';\
1087
  return;\
1088
 };\
8098 schaersvoo 1089
 function _getPixel(pixelPos){\
1090
  return {r:imageData[pixelPos], g:imageData[pixelPos+1], b:imageData[pixelPos+2], a:imageData[pixelPos+3]};\
11820 schaersvoo 1091
 };\
1092
 if( use_special_filling ){\
15111 schaersvoo 1093
  fill_image = fill_ctx.getImageData(0, 0, xsize, ysize);\
1094
  fill_data = fill_image.data;\
11817 schaersvoo 1095
  _setPixel = function(pixelPos){\
11820 schaersvoo 1096
   var n;var o;\
1097
   for(var p = 0;p < 3; p++){\
1098
    n = fill_data[pixelPos+p];\
1099
    o = imageData[pixelPos+p];\
1100
    if( n != o ){ imageData[pixelPos+p] = n; } else { if( o == 255 ){ o = 253;} imageData[pixelPos+p] = o+1;};\
1101
   };\
1102
   imageData[pixelPos+3] = 255;\
1103
  };\
16844 bpr 1104
 } else {\
11820 schaersvoo 1105
  _setPixel = function(pixelPos){\
11817 schaersvoo 1106
   imageData[pixelPos] = color.r;\
1107
   imageData[pixelPos+1] = color.g;\
1108
   imageData[pixelPos+2] = color.b;\
1109
   imageData[pixelPos+3] = color.a;\
11820 schaersvoo 1110
 };\
18572 bpr 1111
 };\
8098 schaersvoo 1112
 function _comparePixel(px2){\
11023 schaersvoo 1113
  if(px2.r === px1.r && px2.g === px1.g && px2.b === px1.b ){ return true;};\
1114
  return false;\
8098 schaersvoo 1115
 };\
1116
 px1 = _getPixel(((ys * xsize) + xs) * 4);\
15111 schaersvoo 1117
 var color = {\
1118
  r: parseInt(colors[0], 10),\
1119
  g: parseInt(colors[1], 10),\
1120
  b: parseInt(colors[2], 10),\
1121
  a: parseInt(colors[3] || 255, 10)\
8199 schaersvoo 1122
 };\
15111 schaersvoo 1123
 var bordercolor = {\
1124
  r: parseInt(bordercolors[0], 10),\
1125
  g: parseInt(bordercolors[1], 10),\
1126
  b: parseInt(bordercolors[2], 10),\
1127
  a: parseInt(bordercolors[3] || 255, 10)\
8098 schaersvoo 1128
 };\
15111 schaersvoo 1129
 if( _comparePixel(color) ) { return true; };\
1130
var cnt=0;\
1131
var max=(xsize)*(ysize);\
1132
function fill_me_up(){\
8098 schaersvoo 1133
 while (pixelStack.length) {\
1134
  newPos = pixelStack.pop();\
1135
  xs = newPos[0];ys = newPos[1];\
1136
  pixelPos = (ys*xsize + xs) * 4;\
11023 schaersvoo 1137
  while(ys >= 0 && _comparePixel(_getPixel(pixelPos))){\
1138
   ys -= 1;\
8098 schaersvoo 1139
   pixelPos -= xsize * 4;\
15111 schaersvoo 1140
  };\
8098 schaersvoo 1141
  pixelPos += xsize * 4;\
11023 schaersvoo 1142
  ys += 1;\
8098 schaersvoo 1143
  found_left_border = false;\
1144
  found_right_border = false;\
15111 schaersvoo 1145
  while( ys <= ysize-1 && _comparePixel(_getPixel(pixelPos)) ){\
1146
   cnt++;if(cnt>max){console.log('kap er mee');finish_filling();};\
11023 schaersvoo 1147
   ys += 1;\
8098 schaersvoo 1148
   _setPixel(pixelPos);\
11005 schaersvoo 1149
   if( xs > 1 ){\
8098 schaersvoo 1150
    if( _comparePixel(_getPixel(pixelPos - 4)) ){\
1151
    if( !found_left_border ){\
1152
     pixelStack.push( [xs - 1, ys] );\
1153
     found_left_border = true;\
11023 schaersvoo 1154
    };\
8098 schaersvoo 1155
   }\
1156
   else if( found_left_border ){\
1157
     found_left_border = false;\
15111 schaersvoo 1158
    };\
1159
   };\
11005 schaersvoo 1160
   if( xs < xsize - 1 ){\
8098 schaersvoo 1161
    if( _comparePixel(_getPixel(pixelPos + 4)) ){\
1162
     if( !found_right_border){\
1163
      pixelStack.push( [xs + 1, ys] );\
1164
      found_right_border = true;\
15111 schaersvoo 1165
     };\
8098 schaersvoo 1166
    }\
1167
    else if(found_right_border){\
1168
      found_right_border = false;\
15111 schaersvoo 1169
     };\
1170
    };\
8098 schaersvoo 1171
   pixelPos += xsize * 4;\
15111 schaersvoo 1172
  };\
18572 bpr 1173
  };\
15111 schaersvoo 1174
};\
1175
fill_me_up();\
1176
finish_filling();\
1177
return;\
1178
};",canvas_root_id,canvas_type,canvas_root_id,canvas_root_id);
8074 schaersvoo 1179
}
8083 schaersvoo 1180
 
15111 schaersvoo 1181
void add_js_ruler(double x,double y,double sizex,double sizey,char *font,
9289 schaersvoo 1182
char *stroke_color,double stroke_opacity,char *fill_color,double fill_opacity,
14057 schaersvoo 1183
int line_width,int dynamic,int use_snap){
18572 bpr 1184
 fprintf(js_include_file,"\n/* command ruler */\
9289 schaersvoo 1185
 var ruler_data = new Array(3);\
1186
 var ruler%d = function(){\
14057 schaersvoo 1187
  var use_snap = %d;\
9289 schaersvoo 1188
  var full = 2*Math.PI;\
1189
  var once = true;\
1190
  var canvas = create_canvas%d(3000,xsize,ysize);\
1191
  var ctx = canvas.getContext(\"2d\");\
1192
  var canvas_temp =  document.createElement(\"canvas\");\
1193
  var size_x = xsize*(%f)/(xmax - xmin);\
1194
  var size_y = ysize*(%f)/(ymax - ymin);\
1195
  var dx = xsize/(xmax - xmin);\
1196
  var dy = 0.8*ysize/(ymax - ymin);\
1197
  canvas_temp.width = xsize;\
1198
  canvas_temp.height = ysize;\
1199
  var ctx_temp = canvas_temp.getContext(\"2d\");\
1200
  var xcenter = x2px(%f);\
1201
  var ycenter = y2px(%f);\
1202
  var ruler_x = xcenter;\
1203
  var ruler_y = ycenter;\
1204
  ctx_temp.font = \"%s\";\
1205
  ctx_temp.strokeStyle = \"rgba(%s,%f)\";\
1206
  ctx_temp.fillStyle = \"rgba(%s,%f)\";\
1207
  ctx_temp.lineWidth = %d;\
1208
  ctx_temp.save();\
1209
  if(once){\
1210
   ctx_temp.beginPath();\
1211
   ctx_temp.moveTo(ruler_x,ruler_y);\
1212
   ctx_temp.lineTo(ruler_x+size_x,ruler_y);\
1213
   ctx_temp.lineTo(ruler_x+size_x,ruler_y-size_y);\
1214
   ctx_temp.lineTo(ruler_x,ruler_y-size_y);\
1215
   ctx_temp.lineTo(ruler_x,ruler_y);\
1216
   ctx_temp.closePath();\
1217
   ctx_temp.fill();\
1218
   ctx_temp.stroke();\
1219
   ctx_temp.fillStyle = ctx_temp.strokeStyle;\
1220
   var txtsize;\
1221
   var num = 1;\
1222
   for(var p = dx ; p < size_x ; p = p+dx){\
1223
     txtsize = 0.5*(ctx_temp.measureText(num).width);\
1224
     ctx_temp.fillText(num,ruler_x + p -txtsize,ruler_y - 0.9*dy);\
1225
     num++;\
1226
   };\
1227
   ctx_temp.strokeStyle = \"rgba(0,0,255,0.6)\";\
1228
   ctx_temp.lineWidth = 2;\
1229
   for(var p = 0; p < size_x ; p = p+dx){\
1230
    ctx_temp.beginPath();\
1231
    ctx_temp.moveTo(ruler_x+p,ruler_y);\
1232
    ctx_temp.lineTo(ruler_x+p,ruler_y-0.8*dy);\
1233
    ctx_temp.closePath();\
1234
    ctx_temp.stroke();\
1235
   };\
1236
   ctx_temp.strokeStyle = \"rgba(0,0,255,0.6)\";\
1237
   ctx_temp.lineWidth = 1;\
1238
   for(var p = 0; p < size_x ; p = p+0.5*dx){\
1239
    ctx_temp.beginPath();\
1240
    ctx_temp.moveTo(ruler_x+p,ruler_y);\
1241
    ctx_temp.lineTo(ruler_x+p,ruler_y-0.6*dy);\
1242
    ctx_temp.closePath();\
1243
    ctx_temp.stroke();\
1244
   };\
1245
   ctx_temp.strokeStyle = \"rgba(255,0,0,0.6)\";\
1246
   ctx_temp.lineWidth = 0.5;\
1247
   for(var p = 0; p < size_x ; p = p+0.1*dx){\
1248
    ctx_temp.beginPath();\
1249
    ctx_temp.moveTo(ruler_x+p,ruler_y);\
1250
    ctx_temp.lineTo(ruler_x+p,ruler_y-0.4*dy);\
1251
    ctx_temp.closePath();\
1252
    ctx_temp.stroke();\
1253
   };\
1254
   ctx_temp.drawImage(canvas,ruler_x,ruler_y);\
1255
   once = false;\
14057 schaersvoo 1256
  }",canvas_root_id,use_snap,canvas_root_id,sizex,sizey,x,y,font,stroke_color,stroke_opacity,fill_color,fill_opacity,line_width);
16844 bpr 1257
 
9289 schaersvoo 1258
 if( dynamic == -1 ){
1259
 fprintf(js_include_file,"\
1260
 ctx.drawImage(canvas_temp,0,0);\
1261
   if(wims_status != \"done\"){\
1262
    canvas_div.addEventListener( 'mouseup'   , ruler_stop,false);\
1263
    canvas_div.addEventListener( 'mousedown' , ruler_start,false);\
1264
    canvas_div.addEventListener( 'mousemove' , ruler_move,false);\
11002 schaersvoo 1265
    canvas_div.addEventListener( 'touchstart', function(e){ e.preventDefault();ruler_start(e.changedTouches[0]);},false);\
1266
    canvas_div.addEventListener( 'touchmove', function(e){ e.preventDefault();ruler_move(e.changedTouches[0]);},false);\
1267
    canvas_div.addEventListener( 'touchend', function(e){ e.preventDefault();ruler_stop(e.changedTouches[0]);},false);\
9289 schaersvoo 1268
   };\
1269
   function ruler_stop(evt){\
1270
    ruler_data[0] = ruler_x;\
1271
    ruler_data[1] = ruler_y;\
1272
    ruler_data[2] = angle;\
1273
    return;\
1274
   };\
15111 schaersvoo 1275
   var ruler_object_cnt = 0;\
9289 schaersvoo 1276
   function ruler_start(evt){\
15111 schaersvoo 1277
    var mouse = getMouse(evt,canvas);\
11002 schaersvoo 1278
    var mouse_y = mouse.y;\
1279
    if( mouse_y > ysize - 20 ){return;};\
1280
    var mouse_x = mouse.x;\
1281
    if( mouse_x > ruler_x - 50 && mouse_x < ruler_x + size_x + 50){\
1282
     if( mouse_y > ruler_y - 50 && mouse_y < ruler_y + size_y + 50){\
15111 schaersvoo 1283
      ruler_object_cnt++;\
11002 schaersvoo 1284
      ruler_move(evt);\
1285
      return;\
1286
     };\
15111 schaersvoo 1287
    }else{ruler_object_cnt = 0; return;};\
9289 schaersvoo 1288
   };\
1289
   var angle = 0;\
1290
   function ruler_move(evt){\
15111 schaersvoo 1291
    var mouse = getMouse(evt,canvas);\
1292
    switch(ruler_object_cnt){\
9289 schaersvoo 1293
     case 1:\
1294
      angle = 0;\
14057 schaersvoo 1295
      var xy = multisnap_check(mouse.x,mouse.y,use_snap);\
1296
      ruler_y = xy[1];\
9289 schaersvoo 1297
      if( ruler_y > ysize - 20 ){ruler_y = 0.5*ysize;ruler_x = 0.5*xsize;return;};\
14057 schaersvoo 1298
      ruler_x = xy[0];\
9289 schaersvoo 1299
      ctx.clearRect(0,0,xsize,ysize);\
1300
      ctx.save();\
1301
      ctx.translate(ruler_x - xcenter,ruler_y - ycenter);\
1302
      ctx.drawImage(canvas_temp,0,0);\
1303
      ctx.restore();\
1304
      break;\
1305
     case 2:\
11017 schaersvoo 1306
      angle = find_angle(ruler_x,ruler_y,mouse.x,mouse.y);\
9289 schaersvoo 1307
      ctx.clearRect(0,0,xsize,ysize);\
1308
      ctx.save();\
1309
      ctx.translate(ruler_x,ruler_y);\
1310
      ctx.rotate(angle);\
1311
      ctx.translate( -1*xcenter, -1*ycenter );\
1312
      ctx.drawImage( canvas_temp,0,0 );\
1313
      ctx.restore();\
11017 schaersvoo 1314
      userdraw_radius[0] = 2*Math.PI - angle;\
9289 schaersvoo 1315
      break;\
15111 schaersvoo 1316
     case 3:ruler_object_cnt = 0;break;\
9289 schaersvoo 1317
     default:ruler_stop(evt);break;\
1318
    };\
1319
   };\
1320
  };\
15111 schaersvoo 1321
  ruler%d();",canvas_root_id);
9289 schaersvoo 1322
 }
1323
 else
1324
 {
1325
  fprintf(js_include_file,"\
1326
   ctx.clearRect(0,0,xsize,ysize);\
1327
   ctx.save();\
1328
   ctx.translate(ruler_x,ruler_y);\
1329
   ctx.rotate(%d*Math.PI/180);\
1330
   ctx.translate( -1*xcenter, -1*ycenter );\
1331
   ctx.drawImage( canvas_temp,0,0 );\
1332
   ctx.restore();\
1333
  };\
1334
  ruler%d();",dynamic,canvas_root_id);
1335
 }
1336
}
1337
 
15111 schaersvoo 1338
void add_js_protractor(int type,double xcenter,double ycenter,int size,char *font,char *stroke_color,double stroke_opacity,char *fill_color,double fill_opacity,int line_width,int use_scale,int dynamic,int use_snap){
9289 schaersvoo 1339
/*
1340
use_slider_display = 2 : angle in degrees
1341
use_slider_display = 3 : angle in radians
1342
void add_slider_display(FILE *js_include_file,int canvas_root_id,int precision,int font_size,char *font_color,double stroke_opacity){
1343
*/
1344
 
18556 bpr 1345
  if( type == 1 ){ /* geodriehoek */
18572 bpr 1346
 fprintf(js_include_file,"\n/* command protractor type 1 */\
9289 schaersvoo 1347
 var protractor_data = new Array(3);\
1348
 var protractor%d = function(){\
1349
  var once = true;\
14057 schaersvoo 1350
  var use_snap = %d;\
9289 schaersvoo 1351
  var full = 2*Math.PI;\
1352
  var canvas = create_canvas%d(2000,xsize,ysize);\
1353
  var ctx = canvas.getContext(\"2d\");\
1354
  var canvas_temp =  document.createElement(\"canvas\");\
1355
  var size = parseInt(xsize*(%d)/(xmax - xmin));\
1356
  canvas_temp.width = xsize;\
1357
  canvas_temp.height = ysize;\
1358
  var ctx_temp = canvas_temp.getContext(\"2d\");\
1359
  var type = %d;\
1360
  var xcenter = x2px(%f);\
1361
  var ycenter = y2px(%f);\
1362
  var half = 0.5*size;\
1363
  var radius1 = 0.6*half;\
1364
  var radius2 = 0.65*half;\
1365
  var radius3 = 0.7*half;\
1366
  ctx_temp.font = \"%s\";\
1367
  ctx_temp.strokeStyle = \"rgba(%s,%f)\";\
1368
  ctx_temp.fillStyle = \"rgba(%s,%f)\";\
1369
  ctx_temp.lineWidth =%d;\
1370
  var use_scale = %d;\
1371
  if( once ){\
1372
   ctx_temp.clearRect(0,0,canvas_temp.width,canvas_temp.height);\
1373
   ctx_temp.beginPath();\
1374
   ctx_temp.moveTo(xcenter-half,ycenter );\
1375
   ctx_temp.lineTo(xcenter,ycenter-half);\
1376
   ctx_temp.lineTo(xcenter+half,ycenter);\
1377
   ctx_temp.lineTo(xcenter-half,ycenter);\
1378
   ctx_temp.moveTo(xcenter,ycenter );\
1379
   ctx_temp.lineTo(xcenter+0.5*half,ycenter-0.5*half);\
1380
   ctx_temp.moveTo(xcenter,ycenter );\
1381
   ctx_temp.lineTo(xcenter-0.5*half,ycenter-0.5*half);\
1382
   ctx_temp.moveTo(xcenter,ycenter );\
1383
   ctx_temp.lineTo(xcenter,ycenter-half);\
1384
   ctx_temp.closePath();\
1385
   ctx_temp.fill();\
1386
   ctx_temp.stroke();\
1387
   ctx_temp.beginPath();\
1388
   ctx_temp.arc(xcenter,ycenter,radius1,0,Math.PI,false);\
1389
   ctx_temp.closePath();\
1390
   if( use_scale == 1 ){\
1391
    ctx_temp.fillStyle = ctx_temp.strokeStyle;\
1392
    var txtsize;\
1393
    for(var p = 45 ; p < 180;p = p+45){\
1394
     txtsize = 0.5*(ctx_temp.measureText(p).width);\
1395
     ctx_temp.fillText(p,xcenter+0.5*half*Math.cos(p*Math.PI/180) - txtsize,ycenter-0.5*half*Math.sin(p*Math.PI/180));\
1396
    };\
1397
   };\
1398
   for(var p = 10 ; p < 180;p = p+10){\
1399
    ctx_temp.beginPath();\
1400
    ctx_temp.moveTo(xcenter+radius1*Math.cos(p*Math.PI/180),ycenter-radius1*Math.sin(p*Math.PI/180));\
1401
    ctx_temp.lineTo(xcenter+radius3*Math.cos(p*Math.PI/180),ycenter-radius3*Math.sin(p*Math.PI/180));\
1402
    ctx_temp.closePath();\
1403
    ctx_temp.stroke();\
1404
   };\
1405
   for(var p = 0 ; p < 180;p=p+2){\
1406
    if(p%%10 != 0){\
1407
     ctx_temp.beginPath();\
1408
     ctx_temp.moveTo(xcenter+radius1*Math.cos(p*Math.PI/180),ycenter-radius1*Math.sin(p*Math.PI/180));\
1409
     ctx_temp.lineTo(xcenter+radius2*Math.cos(p*Math.PI/180),ycenter-radius2*Math.sin(p*Math.PI/180));\
1410
     ctx_temp.closePath();\
1411
     ctx_temp.stroke();\
1412
    };\
1413
   };\
1414
   ctx_temp.drawImage(canvas,xcenter,ycenter);\
1415
   ctx_temp.save();\
1416
   once = false;\
1417
  };\
14057 schaersvoo 1418
  ",canvas_root_id,use_snap,canvas_root_id,size,type,xcenter,ycenter,font,stroke_color,stroke_opacity,fill_color,fill_opacity,line_width,use_scale);
18556 bpr 1419
  }
1420
  if( type != 1 ){
18572 bpr 1421
 fprintf(js_include_file,"\n/* command protractor type 0 */\
9289 schaersvoo 1422
 var protractor_data = new Array(3);\
1423
 var protractor%d = function(){\
1424
  var once = true;\
14057 schaersvoo 1425
  var use_snap = %d;\
9289 schaersvoo 1426
  var full = 2*Math.PI;\
1427
  var canvas = create_canvas%d(2000,xsize,ysize);\
1428
  var ctx = canvas.getContext(\"2d\");\
1429
  var canvas_temp =  document.createElement(\"canvas\");\
1430
  var size = parseInt(xsize*(%d)/(xmax - xmin));\
1431
  canvas_temp.width = xsize;\
1432
  canvas_temp.height = ysize;\
1433
  var ctx_temp = canvas_temp.getContext(\"2d\");\
1434
  var type = %d;\
1435
  var xcenter = x2px(%f);\
1436
  var ycenter = y2px(%f);\
1437
  var half = 0.5*size;\
1438
  var radius1 = 0.8*half;\
1439
  var radius2 = 0.9*half;\
1440
  var radius3 = half;\
1441
  ctx_temp.font = \"%s\";\
1442
  ctx_temp.strokeStyle = \"rgba(%s,%f)\";\
1443
  ctx_temp.fillStyle = \"rgba(%s,%f)\";\
1444
  ctx_temp.lineWidth =%d;\
1445
  var use_scale = %d;\
1446
  if( once ){\
1447
   ctx_temp.clearRect(0,0,xsize,ysize);\
1448
   ctx_temp.arc(xcenter,ycenter,radius1,0,2*Math.PI,false);\
1449
   ctx_temp.arc(xcenter,ycenter,radius2,0,2*Math.PI,false);\
1450
   ctx_temp.arc(xcenter,ycenter,radius3,0,2*Math.PI,false);\
1451
   ctx_temp.fill();\
1452
   ctx_temp.stroke();\
1453
   if( use_scale == 1 ){\
1454
    ctx_temp.fillStyle = ctx_temp.strokeStyle;\
1455
    var txtsize;\
1456
    for(var p = 0 ; p < 360;p = p+45){\
1457
     txtsize = 0.5*(ctx_temp.measureText(p).width);\
1458
     ctx_temp.fillText(p,xcenter+0.6*half*Math.cos(p*Math.PI/180) - txtsize,ycenter-0.6*half*Math.sin(p*Math.PI/180));\
1459
    };\
1460
   };\
1461
   ctx_temp.strokeStyle = \"rgba(255,0,0,0.4)\";\
1462
   for(var p = 0 ; p < 360;p = p+10){\
1463
    ctx_temp.beginPath();\
1464
    ctx_temp.moveTo(xcenter+radius1*Math.cos(p*Math.PI/180),ycenter-radius1*Math.sin(p*Math.PI/180));\
1465
    ctx_temp.lineTo(xcenter+radius3*Math.cos(p*Math.PI/180),ycenter-radius3*Math.sin(p*Math.PI/180));\
1466
    ctx_temp.closePath();\
1467
    ctx_temp.stroke();\
1468
   };\
1469
   ctx_temp.strokeStyle = \"rgba(0,0,255,0.4)\";\
1470
   for(var p = 0 ; p < 360;p=p+2){\
1471
     ctx_temp.beginPath();\
1472
     ctx_temp.moveTo(xcenter+radius2*Math.cos(p*Math.PI/180),ycenter-radius2*Math.sin(p*Math.PI/180));\
1473
     ctx_temp.lineTo(xcenter+radius3*Math.cos(p*Math.PI/180),ycenter-radius3*Math.sin(p*Math.PI/180));\
1474
     ctx_temp.closePath();\
1475
     ctx_temp.stroke();\
1476
   };\
1477
   ctx_temp.strokeStyle = \"rgba(0,0,0,0.6)\";\
1478
   for(var p = 0 ; p < 360;p=p+45){\
1479
     ctx_temp.beginPath();\
1480
     ctx_temp.moveTo(xcenter,ycenter);\
1481
     ctx_temp.lineTo(xcenter+radius3*Math.cos(p*Math.PI/180),ycenter-radius3*Math.sin(p*Math.PI/180));\
1482
     ctx_temp.closePath();\
1483
     ctx_temp.stroke();\
1484
   };\
1485
   ctx_temp.drawImage(canvas,0,0);\
1486
   ctx_temp.save();\
1487
   once = false;\
15111 schaersvoo 1488
  };",canvas_root_id,use_snap,canvas_root_id,size,type,xcenter,ycenter,font,stroke_color,stroke_opacity,fill_color,fill_opacity,line_width,use_scale);
18556 bpr 1489
  }
1490
  if( dynamic == -1 ){ /* rotate the protractors */
1491
    fprintf(js_include_file,"\
9289 schaersvoo 1492
  var protractor_x = xcenter;\
1493
  var protractor_y = ycenter;\
1494
  ctx.drawImage(canvas_temp,0,0);\
11017 schaersvoo 1495
  var angle = 0;\
9289 schaersvoo 1496
  if(wims_status != \"done\"){\
1497
   canvas_div.addEventListener( 'mouseup'   , protractor_stop,false);\
1498
   canvas_div.addEventListener( 'mousedown' , protractor_start,false);\
1499
   canvas_div.addEventListener( 'mousemove' , protractor_move,false);\
11002 schaersvoo 1500
   canvas_div.addEventListener( 'touchstart', function(e){ e.preventDefault();protractor_start(e.changedTouches[0]);},false);\
1501
   canvas_div.addEventListener( 'touchmove', function(e){ e.preventDefault();protractor_move(e.changedTouches[0]);},false);\
1502
   canvas_div.addEventListener( 'touchend', function(e){ e.preventDefault();protractor_stop(e.changedTouches[0]);},false);\
9289 schaersvoo 1503
  };\
1504
  function protractor_stop(evt){\
1505
   protractor_data[0] = protractor_x;\
1506
   protractor_data[1] = protractor_y;\
1507
   protractor_data[2] = angle;\
1508
   return;\
1509
  };\
15111 schaersvoo 1510
  var protractor_object_cnt = 0;\
9289 schaersvoo 1511
  function protractor_start(evt){\
15111 schaersvoo 1512
   var mouse = getMouse(evt,canvas);\
11002 schaersvoo 1513
   var mouse_y = mouse.y;\
1514
   if( mouse_y > ysize - 20 ){return;};\
1515
   var mouse_x = mouse.x;\
1516
   if( mouse_x > protractor_x - half && mouse_x < protractor_x + half ){\
1517
    if( mouse_y > protractor_y - half && mouse_y < protractor_y + half ){\
15111 schaersvoo 1518
     protractor_object_cnt++;\
11002 schaersvoo 1519
     protractor_move(evt);\
1520
     return;\
1521
    };\
15111 schaersvoo 1522
   }else{protractor_object_cnt = 0; return;};\
9289 schaersvoo 1523
  };\
1524
  function protractor_move(evt){\
15111 schaersvoo 1525
   var mouse = getMouse(evt,canvas);\
1526
   switch(protractor_object_cnt){\
9289 schaersvoo 1527
    case 1:\
14057 schaersvoo 1528
      var xy = multisnap_check(mouse.x,mouse.y,use_snap);\
1529
      mouse.x = xy[0];\
1530
      mouse.y = xy[1];\
9289 schaersvoo 1531
      angle = 0;\
14057 schaersvoo 1532
      protractor_x = mouse.x;\
11002 schaersvoo 1533
      protractor_y = mouse.y;\
9289 schaersvoo 1534
      if( protractor_y > ysize - 20 ){protractor_y = 0.5*ysize;protractor_x = 0.5*xsize;return;};\
1535
      ctx.clearRect(0,0,xsize,ysize);\
1536
      ctx.save();\
1537
      ctx.translate(protractor_x - xcenter,protractor_y - ycenter);\
1538
      ctx.drawImage(canvas_temp,0,0);\
1539
      ctx.restore();\
1540
      break;\
1541
    case 2:\
11017 schaersvoo 1542
     angle = find_angle(protractor_x,protractor_y,mouse.x,mouse.y);\
9289 schaersvoo 1543
     ctx.clearRect(0,0,xsize,ysize);\
1544
     ctx.save();\
1545
     ctx.translate(protractor_x,protractor_y);\
1546
     ctx.rotate(angle);\
1547
     ctx.translate( -1*xcenter, -1*ycenter );\
1548
     ctx.drawImage( canvas_temp,0,0 );\
1549
     ctx.restore();\
11017 schaersvoo 1550
     userdraw_radius[0] =2*Math.PI- angle;\
9289 schaersvoo 1551
     break;\
15111 schaersvoo 1552
    case 3:protractor_object_cnt = 0;break;\
9289 schaersvoo 1553
    default:protractor_stop(evt);\
1554
   };\
1555
  };\
1556
 };\
15111 schaersvoo 1557
 protractor%d();",canvas_root_id);
18556 bpr 1558
  }
1559
  else
1560
  {
18572 bpr 1561
 fprintf(js_include_file,"\
9289 schaersvoo 1562
  ctx.save();\
1563
  ctx.translate(xcenter,ycenter);\
1564
  ctx.rotate(%d*Math.PI/180);\
1565
  ctx.translate( -1*xcenter, -1*ycenter );\
1566
  ctx.drawImage( canvas_temp,0,0 );\
1567
  ctx.restore();\
1568
 };\
1569
 protractor%d();\
1570
",dynamic,canvas_root_id);
18556 bpr 1571
  } /* end dynamic == -1*/
9289 schaersvoo 1572
}