Rev 16722 | Rev 16828 | Go to most recent revision | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed
Rev 16722 | Rev 16827 | ||
---|---|---|---|
Line 3115... | Line 3115... | ||
3115 | 3115 | ||
3116 | case MULTIDRAW: |
3116 | case MULTIDRAW: |
3117 | /* |
3117 | /* |
3118 | @ multidraw obj_type_1,obj_type_2...obj_type_11 |
3118 | @ multidraw obj_type_1,obj_type_2...obj_type_11 |
3119 | @ for simple single object user drawings you could also use command <a href="#userdraw">userdraw</a> |
3119 | @ for simple single object user drawings you could also use command <a href="#userdraw">userdraw</a> |
3120 | @ implemented obj_types:<ul><li>point | points</li><li>circle | circles</li><li>line | lines</li><li>segment | segments</li><li>arrow | arrows (use command 'arrowhead int' for size (default value 8 pixels))</li><li>curvedarrow | curvedarrows</li><li>rect | rects</li><li>closedpoly<br /><b>only one</b> closedpolygon may be drawn.The number of ''corner points`` is not preset (e.g. not limited, freestyle), the polygon is closed when clicking on the first point again..(+/- 10px)</li><li>triangle | triangles</li><li>parallelogram | parallelograms</li><li>poly[3-9] | polys[3-9] draw 3...9 point polygone(s): polys3 is of course triangles</li><li>images</li><li>crosshair | crosshairs</li></ul> |
3120 | @ implemented obj_types:<ul><li>point | points</li><li>circle | circles</li><li>line | lines</li><li>segment | segments</li><li>arrow | arrows (use command 'arrowhead int' for size (default value 8 pixels))</li><li>curvedarrow | curvedarrows</li><li>rect | rects</li><li>closedpoly<br /><b>only one</b> closedpolygon may be drawn.The number of ''corner points`` is not preset (e.g. not limited, freestyle), the polygon is closed when clicking on the first point again..(+/- 10px)</li><li>triangle | triangles</li><li>parallelogram | parallelograms</li><li>poly[3-9] | polys[3-9] draw 3...9 point polygone(s): polys3 is of course triangles</li><li>images</li><li>crosshair | crosshairs</li><li>function | functions <br/>simple function plotter, command functions will can be used for 2 function user inputs</li></ul> |
3121 | @ additionally objects may be user labelled, using obj_type ''text``...<br />in this case allways a text input field and if <a href='#multiuserinput'> multiuserinput=1 </a> also (x:y) inputfields will be added to the page.<br />use commands ''fontfamily`` and ''fontcolor`` to adjust (command ''multistrokeopacity`` may be set to adjust text opacity)<br />note: text is always centered on the mouse-click or user-input coordinates !<br />note: no keyboard listeners are used |
3121 | @ additionally objects may be user labelled, using obj_type ''text``...<br />in this case allways a text input field and if <a href='#multiuserinput'> multiuserinput=1 </a> also (x:y) inputfields will be added to the page.<br />use commands ''fontfamily`` and ''fontcolor`` to adjust (command ''multistrokeopacity`` may be set to adjust text opacity)<br />note: text is always centered on the mouse-click or user-input coordinates !<br />note: no keyboard listeners are used |
3122 | @ it makes no sense using something like ''multidraw point,points`` ... <br />something like "multidraw polys4,polys7" will only result in drawing a ''4 point polygone`` and not a ''7 point polygone``: this is a design flaw and not a feature... |
3122 | @ it makes no sense using something like ''multidraw point,points`` ... <br />something like "multidraw polys4,polys7" will only result in drawing a ''4 point polygone`` and not a ''7 point polygone``: this is a design flaw and not a feature... |
3123 | @ note: mouselisteners are only active if "$status != done " (eg only drawing in an active/non-finished exercise) <br /> to overrule use command/keyword "status" (no arguments required) |
3123 | @ note: mouselisteners are only active if "$status != done " (eg only drawing in an active/non-finished exercise) <br /> to overrule use command/keyword "status" (no arguments required) |
3124 | @ buttons for changing the obj_type (and in case of ''multiuserinput``, some inputfields and buttons) <br />will be present in the reserved div ''tooltip_div`` and can be styled using command 'css some_css' |
3124 | @ buttons for changing the obj_type (and in case of ''multiuserinput``, some inputfields and buttons) <br />will be present in the reserved div ''tooltip_div`` and can be styled using command 'css some_css' |
3125 | @ the button label will be default the ''object primitive name`` (like ''point``, ''circles``).<br />If you want a different label (e.g. an other language), use command ''multilabel``<br />for example in dutch: <br /><code>multilabel cirkel,lijnstuk,punten,STOP<br />multidraw circle,segment,points</code><br />(see command <a href='#multilabel'>multilabel</a> for more details) |
3125 | @ the button label will be default the ''object primitive name`` (like ''point``, ''circles``).<br />If you want a different label (e.g. an other language), use command ''multilabel``<br />for example in dutch: <br /><code>multilabel cirkel,lijnstuk,punten,STOP<br />multidraw circle,segment,points</code><br />(see command <a href='#multilabel'>multilabel</a> for more details) |
Line 3134... | Line 3134... | ||
3134 | @ a special object type is ''images``.<br />if used together with <a href='#imagepalette'>imagepalette</a> a image table will be integrated in the 'control section' of multidraw (set <code>multiuserinput 1</code> for ''images``) if not used with <a href='#imagepalette'>imagepalette</a>, provide the images or div's (<img> tag with bitmap or SVG or anything in a div element) somewhere on the html exercise page, with an onclick handler like:<br /><code><img src='gifs/images/dog.svg' onclick='javascript:place_image_on_canvas(this.id);' id="ext_image_1" /><br /><img src='gifs/fish.png' onclick='javascript:place_image_on_canvas(this.id);' id="another" /></code><br />etc ... when activating the multidraw ''image`` button, the images can be selected<br /> (left mouse button/onclick) and placed on the canvas...left mouse click.<br />using div's will enable you -amongst other content- to add math typesetting from the exercise page onto the canvas. |
3134 | @ a special object type is ''images``.<br />if used together with <a href='#imagepalette'>imagepalette</a> a image table will be integrated in the 'control section' of multidraw (set <code>multiuserinput 1</code> for ''images``) if not used with <a href='#imagepalette'>imagepalette</a>, provide the images or div's (<img> tag with bitmap or SVG or anything in a div element) somewhere on the html exercise page, with an onclick handler like:<br /><code><img src='gifs/images/dog.svg' onclick='javascript:place_image_on_canvas(this.id);' id="ext_image_1" /><br /><img src='gifs/fish.png' onclick='javascript:place_image_on_canvas(this.id);' id="another" /></code><br />etc ... when activating the multidraw ''image`` button, the images can be selected<br /> (left mouse button/onclick) and placed on the canvas...left mouse click.<br />using div's will enable you -amongst other content- to add math typesetting from the exercise page onto the canvas. |
3135 | @ When you are not content with the default ''multidraw control panel``, you can create your own interface, using a few javascript functions to call the drawprimitives, delete things and ''stop drawing`` in case you also want to drag&drop stuff...</br>To activate this feature, use <a href='#multilabel'>multilabel NOCONTROLS</a><br />The object types are internally represented by the following numbers (making typos will render your exercise null and void)<br/>point = 0<br />points =1<br />circle = 2<br />circles = 3<br />line = 4<br />lines = 5<br />segment = 6<br />segments = 7<br />arrow = 8<br />arrows = 9<br />triangle = 10<br />triangles = 11<br />closedspoly = 12<br />text = 13<br />rect = 14<br />rects = 15<br />poly[3-9] = 16<br />polys[3-9] = 17<br />parallelogram = 18<br />parallelograms = 19<br />images = 20<br />curvedarrow = 21<br />curvedarrows = 22<br />curvedarrow2 = 23<br />curvedarrows2 = 24<br />crosshair = 25<br />crosshairs = 26 <br />controls for example:<br /><code><input type='button' onclick='javascript:userdraw_primitive=null' value='STOP DRAWING' /><br /><input type='button' onclick='javascript:userdraw_primitive=24;multidraw_object_cnt = 0;' value='start drawing curvedarrows2' /> <br /><input type='button' onclick='javascript:var fun=eval("clear_draw_area"+canvas_scripts[0]);fun(24,0);' value='REMOVE LAST CURVEDARROW ' /> </code><br/> If using multiple canvas scripts in a single page, loop through the canvas_scripts[n] <br />note: if using NOCONTROLS and just a single draw primitive (for example, just: 'multidraw circles'), the object may be drawn directly. (analogue to 'userdraw circles,color')<br />And since a right mouse button click will always remove the last drawn object of the current object type, there is no need for a special "remove button" |
3135 | @ When you are not content with the default ''multidraw control panel``, you can create your own interface, using a few javascript functions to call the drawprimitives, delete things and ''stop drawing`` in case you also want to drag&drop stuff...</br>To activate this feature, use <a href='#multilabel'>multilabel NOCONTROLS</a><br />The object types are internally represented by the following numbers (making typos will render your exercise null and void)<br/>point = 0<br />points =1<br />circle = 2<br />circles = 3<br />line = 4<br />lines = 5<br />segment = 6<br />segments = 7<br />arrow = 8<br />arrows = 9<br />triangle = 10<br />triangles = 11<br />closedspoly = 12<br />text = 13<br />rect = 14<br />rects = 15<br />poly[3-9] = 16<br />polys[3-9] = 17<br />parallelogram = 18<br />parallelograms = 19<br />images = 20<br />curvedarrow = 21<br />curvedarrows = 22<br />curvedarrow2 = 23<br />curvedarrows2 = 24<br />crosshair = 25<br />crosshairs = 26 <br />controls for example:<br /><code><input type='button' onclick='javascript:userdraw_primitive=null' value='STOP DRAWING' /><br /><input type='button' onclick='javascript:userdraw_primitive=24;multidraw_object_cnt = 0;' value='start drawing curvedarrows2' /> <br /><input type='button' onclick='javascript:var fun=eval("clear_draw_area"+canvas_scripts[0]);fun(24,0);' value='REMOVE LAST CURVEDARROW ' /> </code><br/> If using multiple canvas scripts in a single page, loop through the canvas_scripts[n] <br />note: if using NOCONTROLS and just a single draw primitive (for example, just: 'multidraw circles'), the object may be drawn directly. (analogue to 'userdraw circles,color')<br />And since a right mouse button click will always remove the last drawn object of the current object type, there is no need for a special "remove button" |
3136 | @%multidraw%size 400,400%xrange -10,10%yrange -10,10%multidash 1,0%multilinewidth 1,2%multistrokecolors red,blue%multisnaptogrid 1,1%multilabel LINES,CIRCLES,STOP DRAWING%multidraw lines,circles |
3136 | @%multidraw%size 400,400%xrange -10,10%yrange -10,10%multidash 1,0%multilinewidth 1,2%multistrokecolors red,blue%multisnaptogrid 1,1%multilabel LINES,CIRCLES,STOP DRAWING%multidraw lines,circles |
3137 | @%multidraw_images%size 400,400%xrange -10,10%yrange -10,10%grid 1,1,grey%drag xy%# use special function to read the drag coordinates%copy 0,0,-1,-1,-1,-1,gifs/images/skull_and_crossbones50.png%fontcolor green%fontfamily Bold 42pt Arial%imagepalette gifs/ca.gif,gifs/en.gif,gifs/nl.gif,gifs/fr.gif,gifs/cn.gif,gifs/de.gif,gifs/kh.gif,gifs/it.gif%multiuserinput 0,0,1%css color:blue;%multisnaptogrid 1,1,1%multilinewidth 0,4,0%# attention: use unicode text input without the slash %# \u222D ---> u222D at least will sometimes work%# otherwise cut&past unicode symbols into inputfield...%multilabel TEXT,REACTION ARROW,FLAGS,STOP DRAWING%multidraw text,arrow,images |
3137 | @%multidraw_images%size 400,400%xrange -10,10%yrange -10,10%grid 1,1,grey%drag xy%# use special function to read the drag coordinates%copy 0,0,-1,-1,-1,-1,gifs/images/skull_and_crossbones50.png%fontcolor green%fontfamily Bold 42pt Arial%imagepalette gifs/ca.gif,gifs/en.gif,gifs/nl.gif,gifs/fr.gif,gifs/cn.gif,gifs/de.gif,gifs/kh.gif,gifs/it.gif%multiuserinput 0,0,1%css color:blue;%multisnaptogrid 1,1,1%multilinewidth 0,4,0%# attention: use unicode text input without the slash %# \u222D ---> u222D at least will sometimes work%# otherwise cut&past unicode symbols into inputfield...%multilabel TEXT,REACTION ARROW,FLAGS,STOP DRAWING%multidraw text,arrow,images |
3138 | @%multidraw_demo%size 800,800%xrange -10,10%yrange -10,10%axis%axisnumbering%precision 1%grid 2,2,grey,2,2,5,grey%css color:blue;%fontfamily Italic 42pt Arial%precision 1%opacity 200,50%snaptogrid%linewidth 3%filled%multistrokecolors red,green,blue,orange,yellow,purple,black,cyan,red,green,blue,orange,green,purple,black,cyan%multifillcolors red,green,blue,orange,yellow,purple,black,cyan,red,green,blue,orange,brown,purple%imagepalette gifs/ca.gif,gifs/en.gif,gifs/nl.gif,gifs/fr.gif,gifs/cn.gif,gifs/de.gif,gifs/kh.gif,gifs/it.gif%multidraw closedpoly,segments,rect,parallelogram,triangles,poly5,points,lines,arrows,circles,text,curvedarrows,curvedarrows2,images |
3138 | @%multidraw_demo%size 800,800%xrange -10,10%yrange -10,10%axis%axisnumbering%precision 1%grid 2,2,grey,2,2,5,grey%css color:blue;%fontfamily Italic 42pt Arial%precision 1%opacity 200,50%snaptogrid%linewidth 3%filled%multistrokecolors red,green,blue,orange,yellow,purple,black,cyan,red,green,blue,orange,green,purple,black,cyan%multifillcolors red,green,blue,orange,yellow,purple,black,cyan,red,green,blue,orange,brown,purple%imagepalette gifs/ca.gif,gifs/en.gif,gifs/nl.gif,gifs/fr.gif,gifs/cn.gif,gifs/de.gif,gifs/kh.gif,gifs/it.gif%multidraw closedpoly,segments,rect,parallelogram,triangles,poly5,points,lines,arrows,circles,text,curvedarrows,curvedarrows2,images |
3139 | @%multidraw_NOCONTROLS%size |
3139 | @%multidraw_NOCONTROLS%size 400,400%xrange -10,10%yrange -10,10%grid 2,2,grey%linewidth 3%strokecolor green%fillcolor blue%filled%opacity 255,60%multilabel NOCONTROLS%multidraw circles%# RIGHT MOUSE CLICK REMOVES LAST OBJECT |
- | 3140 | @%multidraw function%size 400,400%xrange -10,10%yrange -10,10%fontfamily Italic 22px Helvetica%axis%axisnumbering%precision 0%grid 2,2,grey,1,1,5,black%multicolors red,green,blue%fontcolor orange%multilinewidth 1,2,3%multidraw text,functions,line |
|
3140 | */ |
3141 | */ |
3141 | js_function[INTERACTIVE] = 1; |
3142 | js_function[INTERACTIVE] = 1; |
3142 | if(js_function[JS_ZOOM] == 1){use_zoom = 1;} /* use noisy zoom_code, when command zoom is given before command 'multidraw' */ |
3143 | if(js_function[JS_ZOOM] == 1){use_zoom = 1;} /* use noisy zoom_code, when command zoom is given before command 'multidraw' */ |
3143 | if( use_tooltip == 1 ){canvas_error("command 'multidraw' is incompatible with command 'intooltip tip_text'");} |
3144 | if( use_tooltip == 1 ){canvas_error("command 'multidraw' is incompatible with command 'intooltip tip_text'");} |
3144 | if( use_userdraw == 1 ){canvas_error("Only one userdraw primitive may be used in command 'userdraw' use command 'multidraw' for this...");} |
3145 | if( use_userdraw == 1 ){canvas_error("Only one userdraw primitive may be used in command 'userdraw' use command 'multidraw' for this...");} |
Line 3166... | Line 3167... | ||
3166 | line_width, |
3167 | line_width, |
3167 | use_filled, |
3168 | use_filled, |
3168 | use_dashed, |
3169 | use_dashed, |
3169 | str_replace(temp,",","\",\""), |
3170 | str_replace(temp,",","\",\""), |
3170 | arrow_head,font_color,font_family); |
3171 | arrow_head,font_color,font_family); |
- | 3172 | add_js_multidraw(temp,css_class,use_offset,int_data[MAX_MULTI_PRIMITIVES+1],crosshair_size,use_zoom); |
|
- | 3173 | /* no_controls == int_data[MAX_MULTI_PRIMITIVES+1] */ |
|
- | 3174 | reply_precision = precision; |
|
3171 | if(strstr(temp,"text") != NULL){ |
3175 | if(strstr(temp,"text") != NULL){ |
3172 | js_function[JS_SAFE_EVAL] = 1; |
3176 | js_function[JS_SAFE_EVAL] = 1; |
3173 | js_function[DRAW_SUBSUP] = 1; |
3177 | js_function[DRAW_SUBSUP] = 1; |
3174 | } |
3178 | } |
- | 3179 | if(strstr(temp,"function") != NULL){ |
|
- | 3180 | js_function[JS_SAFE_EVAL] = 1; |
|
- | 3181 | js_function[JS_RAWMATH] = 1; |
|
- | 3182 | js_function[DRAW_JSFUNCTION] = 1; |
|
- | 3183 | js_function[JS_MATH] = 1; |
|
- | 3184 | js_function[JS_PLOT] = 1; |
|
- | 3185 | add_input_jsfunction(css_class,function_label,input_cnt,stroke_color,stroke_opacity,line_width,use_dashed,dashtype[0],dashtype[1],font_size); |
|
- | 3186 | input_cnt++; |
|
- | 3187 | jsplot_cnt++; |
|
- | 3188 | if(strstr(temp,"functions") != NULL){ |
|
- | 3189 | add_input_jsfunction(css_class,function_label,input_cnt,stroke_color,stroke_opacity,line_width,use_dashed,dashtype[0],dashtype[1],font_size); |
|
- | 3190 | input_cnt++; |
|
- | 3191 | jsplot_cnt++; |
|
- | 3192 | } |
|
- | 3193 | fprintf(js_include_file,"if(typeof(all_jsplots) !== 'number'){var all_jsplots;};all_jsplots = %d;function redraw_userdraw(){redraw_jsplot();return;};",jsplot_cnt); |
|
3175 | 3194 | } |
|
3176 | /* the canvasses range from 1000 ... 1008 */ |
3195 | /* the canvasses range from 1000 ... 1008 */ |
3177 | add_js_multidraw(temp,css_class,use_offset,int_data[MAX_MULTI_PRIMITIVES+1],crosshair_size,use_zoom); |
- | |
3178 | /* no_controls == int_data[MAX_MULTI_PRIMITIVES+1] */ |
- | |
3179 | reply_precision = precision; |
- | |
3180 | if( reply_format == 0){reply_format = 29;} |
3196 | if( reply_format == 0){reply_format = 29;} |
3181 | reset();/* if command 'filled' / 'dashed' was given...reset all */ |
3197 | reset();/* if command 'filled' / 'dashed' was given...reset all */ |
3182 | break; |
3198 | break; |
3183 | case MULTILABEL: |
3199 | case MULTILABEL: |
3184 | /* |
3200 | /* |