Subversion Repositories wimsdev

/*

27/7/2013 version 0.01

"Inspired" by FLY program: http://martin.gleeson.com/fly

*********************************************************************************

* J.M. Evers 7/2013                                                             *

* This is all just amateur scriblings... So no copyrights.                      *

* This source code file, and compiled objects derived from it,                  *

* can be used and distributed without restriction, including for commercial use *

* No warrenty whatsoever                                                        *

*********************************************************************************

*/

#include "../../Lib/libwims.h"

#include "canvasdraw.h"

#include <assert.h>

#include "canvasmacro.c"

/******************************************************************************

**  Internal Functions

******************************************************************************/

void    add_to_buffer(char *tmp); /* add tmp_buffer to the buffer */

void    sync_input(FILE *infile);/* proceed with inputfile */

void    canvas_error(char *msg);

void    add_javascript_functions(int js_functions[], int canvas_root_id);

void    reset();/* reset some global variables like "use_filled" , "use_dashed" */

int     get_token(FILE *infile); /* read next char until EOL*/

int     x2px(double x);

int     y2px(double y);

double  px2x(int x);

double  px2y(int y);

double  get_real(FILE *infile,int last); /* read a value; calculation and symbols allowed */

char    *str_replace ( const char *word, const char *sub_word, const char *rep_word );

char    *get_color(FILE *infile,int last); /* read hex-color or colorname -> hex */

char    *get_string(FILE *infile,int last); /* get the string at the end of a command */

char    *get_string_argument(FILE *infile,int last); /* the same, but with "comma" as  separator */

char    *convert_hex2rgb(char *hexcolor);

void    add_read_canvas(int reply_format,int reply_precision);

void    make_js_include(int canvas_root_id);

void    check_string_length(int length);/* checks if the length of string argument of command is correct */

FILE    *js_include_file;

FILE    *get_file(int *line_number, char **filename);

FILE    *infile;    /* will be stdin */

/******************************************************************************

** global

******************************************************************************/

int finished = FALSE;/* main variable for signalling the end of the fly-script ; if finished = 1 ; write to stdout or canvasz */

int line_number = 1;/* used in canvas_error() ; keep track of line number in canvasdraw/fly - script */

/* set some variables to avoid trouble (NaN) in case of syntax and other usage errors */

int xsize = 320;

int ysize = 320;

double xmin = 0.0;

double xmax = 320.0;

double ymin = 0.0;

double ymax = 320.0;

double tmax = 2;

double tmin = -2;

/* flag to indicate parsing of line status */

int done = FALSE;

int type; /* eg command number */

int onclick = 0;/* 0 = noninteractive ; 1 = onclick ; 2 = draggable*/

int slider = 0;/* slider=1 : x-values ; slider=2 : y-values;slider=3 angle values */

int use_affine = FALSE;

int use_rotate = FALSE;

int use_filled = FALSE;

int use_dashed = FALSE; /* dashing not natively supported in firefox  , for now... */

char buffer[MAX_BUFFER];/* contains js-functions with arguments ... all other basic code is directly printed into js-include file */

/******************************************************************************

** Main Program

******************************************************************************/

int main(int argc, char *argv[]){

    /* need unique id for every call to canvasdraw : rand(); is too slow...will result in many identical id's */

    struct timeval tv;struct timezone tz;gettimeofday(&tv, &tz);unsigned int canvas_root_id = (unsigned int) tv.tv_usec;

    infile = stdin;/* read flyscript via stdin */

    int i,c;

    double double_data[MAX_INT+1];

    int int_data[MAX_INT+1];

    for(i=0;i<MAX_INT;i++){int_data[i]=0;double_data[i]=0;}

    int use_parametric = FALSE;/* will be reset after parametric plotting */

    int use_axis = FALSE;

    int use_axis_numbering = FALSE;

    int use_pan_and_zoom = FALSE;

    int use_safe_eval = FALSE; /* if true, add just once : js function to evaluate userinput values for plotting etc */

    int use_js_math = FALSE; /* if true add js-function to convert math_function --> javascript math_function */

    int use_js_plot = FALSE; /* if true , let js-engine plot the curve */

    int line_width = 1;

    int decimals = 2;

    int precision = 100; /* 10 = 1;100=2;1000=3 decimal display for mouse coordinates or grid coordinate */

    int use_userdraw = FALSE; /* flag to indicate user interaction: incompatible with "drag & drop" code !! */

    int drag_type = -1;/* 0,1,2 : xy,x,y */

    int use_tooltip = FALSE;

    char *tooltip_text = "Click here";

    char *temp = ""; /* */

    char *bgcolor = "";/* used for background of canvas_div ; default is tranparent */

    char *stroke_color = "255,0,0";

    char *fill_color = "0,255,0";

    char *font_family = "12px Ariel"; /* commands xaxistext,yaxistext,legend,text/textup/string/stringup may us this */

    char *font_color = "#00000";

    char *draw_type = "points";

    char *fly_font = "normal";

    char *input_style = "";

    char *flytext = "";

    char *affine_matrix = "[1,0,0,1,0,0]";

    int pixelsize = 1;

    int reply_format = 0;

    int input_cnt = 0;

    int ext_img_cnt = 0;

    int slider_cnt = 0;

    int font_size = 12;

    int dashtype[2] = { 4 , 4 };

    int js_function[MAX_JS_FUNCTIONS]; /* javascript functions include objects on demand basis : only once per object type */

    for(i=0;i<MAX_JS_FUNCTIONS;i++){js_function[i]=0;}

    int arrow_head = 8; /* size in px*/

    int crosshair_size = 5; /* size in px*/

    int plot_steps = 250;

    int found_size_command = 0; /* 1 = found size ; 2 = found xrange; 3 = found yrange*/

    int click_cnt = 1;

    int clock_cnt = 0; /* counts the amount of clocks used -> unique object clock%d */

    int linegraph_cnt = 0; /* identifier for command 'linegraph' ; multiple line graphs may be plotted in a single plot*/

    int barchart_cnt = 0; /* identifier for command 'barchart' ; multiple charts may be plotted in a single plot*/

    int legend_cnt = -1; /* to allow multiple legends to be used, for multiple piecharts etc  */

    int reply_precision = 100; /* used for precision of student answers / drawings */

    double angle = 0.0;

    int clickfillmarge = 20;

    int animation_type = 9; /* == object type curve in drag library */

    int use_input_xy = 0; /* 1= input fields 2= textarea 3=calc y value*/

    int use_slider_display = 0; /* in case of a slider, should we display it's value ?*/

    size_t string_length = 0;

    double stroke_opacity = 0.8;

    double fill_opacity = 0.8;

    char *URL = "http://localhost/images";

    memset(buffer,'\0',MAX_BUFFER);

    void *tmp_buffer = "";

    /* default writing a unzipped js-include file into wims getfile directory */

    char *w_wims_session = getenv("w_wims_session");

    if(  w_wims_session == NULL || *w_wims_session == 0 ){

        canvas_error("Hmmm, your wims environment does not exist...\nCanvasdraw should be used within wims.");

    }

    int L0=strlen(w_wims_session) + 21;

    char *getfile_dir = my_newmem(L0); /* create memory to fit string precisely */

    snprintf(getfile_dir,L0, "../sessions/%s/getfile",w_wims_session);/* string will fit precisely  */

    mode_t process_mask = umask(0); /* check if file exists */

    int result = mkdir(getfile_dir, S_IRWXU | S_IRWXG | S_IRWXO);

    if( result == 0 || errno == EEXIST ){

     umask(process_mask); /* be sure to set correct permission */

     char *w_session = getenv("w_session");

     int L1 = (int) (strlen(w_session)) + find_number_of_digits(canvas_root_id) + 48;

    char *getfile_cmd = my_newmem(L1); /* create memory to fit string precisely */

     snprintf(getfile_cmd,L1,"wims.cgi?session=%s&cmd=getfile&special_parm=%d.js",w_session,canvas_root_id);/* extension ".gz" is MANDATORY for webserver */   

    /* write the include tag to html page:<script type="text/javascript" src="wims.cgi?session=%s&cmd=getfile&special_parm=11223344_js"></script> */

    /* now write file into getfile dir*/

    char *w_wims_home = getenv("w_wims_home"); /* "/home/users/wims" : we need absolute path for location */

    int L2 = (int) (strlen(w_wims_home)) + (int) (strlen(w_wims_session)) + find_number_of_digits(canvas_root_id) + 23;

    char *location = my_newmem(L2); /* create memory to fit string precisely */

    snprintf(location,L2,"%s/sessions/%s/getfile/%d.js",w_wims_home,w_wims_session,canvas_root_id);/*absolute path */

    js_include_file = fopen(location,"w");/* open the file location for writing */

    /* check on opening...if nogood : mount readonly? disk full? permissions not set correctly? */

    if(js_include_file == NULL){ canvas_error("SHOULD NOT HAPPEN : could not write to javascript include file...check your system logfiles !" );}

/* ----------------------------------------------------- */

/* while more lines to process */

    while(!finished){

        if(line_number>1 && found_size_command == 0){canvas_error("command \"size xsize,ysize\" needs to come first ! ");}

        type = get_token(infile);

        done = FALSE;

        /*

        @canvasdraw

        @will try use the same syntax as flydraw or svgdraw to paint a html5 bitmap image<br />by generating a tailor-made javascript include file: providing only the js-functionality needed to perform the job.<br />thus ensuring a minimal strain on the client browser <br />(unlike some popular 'canvas-do-it-all' libraries, who have proven to be not suitable for low-end computers found in schools...)

        @General syntax <ul><li>The transparency of all objects can be controlled by command 'opacity [0-255],[0,255]'</il><li>a line based object can be controlled by command 'linewidth int'</li><li>a line based object may be dashed by using keyword 'dashed' before the object command.<br />the dashing type can be controled by command 'dashtype int,int'</li><li>a fillable object can be set fillable by starting the object command with an 'f'<br />(like frect,fcircle,ftriangle...)<br />or by using the keyword 'filled' before the object command.<br />The fill colour will be the stroke colour...(19/10/2013)</li><li> all draggable objects may have a slider for translation / rotation; several objects may be translated / rotated by a single slider</li> <li> a draggable object can be set draggable by a preceding command 'drag x/y/xy'<br />The translation can be read by javascript:read_dragdrop();The replyformat is : object_number : x-orig : y-orig : x-drag : y-drag<br />The x-orig/y-orig will be returned in maximum precision (javascript float)...<br />the x-drag/y-drag will be returned in defined 'precision' number of decimals<br />Multiple objects may be set draggable / clickable (no limit)<br /> not all flydraw objects may be dragged / clicked<br />Only draggable / clickable objects will be scaled on zoom and will be translated in case of panning</li><li> a 'onclick object' can be set 'clickable' by the preceding keyword 'onclick'<br />not all flydraw objects can be set clickable</li><li><b>remarks using a ';' as command separator</b><br />commands with only numeric or colour arguments may be using a ';' as command separator (in stead of a new line)<br />commands with a string argument may not use a ';' as command separator !<br />these exceptions are not really straight forward... so keep this in mind.</li></ul>

        */

        switch(type){

        case END:

        finished = 1;

        done = TRUE;

        break;

        case 0:

            sync_input(infile);

            break;

        case COMMENT:

            sync_input(infile);

            break;

        case EMPTY:

            sync_input(infile);

            break;

        case SIZE:

            /*

            @size width,height

            @set canvas size in pixels

            @mandatory first command

            @if xrange and/or yrange is not given the range will be set to pixels :<br />xrange 0,xsize yrange 0,ysize<br />note: lower left  corner is Origin (0:0) !!! this in contrast to flydraw

            */

            found_size_command = 1;

            xsize = (int)(abs(round(get_real(infile,0)))); /* just to be sure that sizes > 0 */

            ysize = (int)(abs(round(get_real(infile,1))));

            /* sometimes we want xrange / yrange to be in pixels...without telling x/y-range */

            xmin = 0;xmax = xsize;

            ymin = 0;ymax = ysize;

/*

 The sequence in which stuff is finally printed is important !!

 for example, when writing a 'include.js" the may not be a "script tag <script>" etc etc

*/

fprintf(stdout,"\n<script type=\"text/javascript\">var wims_status = \"$status\";</script>\n<!-- canvasdraw div and tooltip placeholder, if needed -->\n<div tabindex=\"0\" id=\"canvas_div%d\" style=\"position:relative;width:%dpx;height:%dpx;margin-left:auto;margin-right:auto;\" ></div><div id=\"tooltip_placeholder_div%d\" style=\"display:block;margin-bottom:4px;\"><span id=\"tooltip_placeholder%d\" style=\"display:none;\"></span></div>\n",canvas_root_id,xsize,ysize,canvas_root_id,canvas_root_id);

fprintf(js_include_file,"\n<!-- begin generated javascript include for canvasdraw -->\n");

fprintf(stdout,"<!-- include actual object code via include file -->\n<script type=\"text/javascript\" src=\"%s\"></script>\n",getfile_cmd);

fprintf(js_include_file,"\

\"use strict\";\n\

var read_dragdrop;\

var read_canvas;\

var set_clock;\

var userdraw_x = [];var userdraw_y = [];var userdraw_radius = [];\

var wims_canvas_function%d = function(){\n<!-- common used stuff -->\n\

var xsize = %d;\

var ysize = %d;\

var precision = 100;\

var canvas_div = document.getElementById(\"canvas_div%d\");\

var create_canvas%d = function(canvas_type,size_x,size_y){var cnv;if(document.getElementById(\"wims_canvas%d\"+canvas_type)){ cnv = document.getElementById(\"wims_canvas%d\"+canvas_type);}else{try{ cnv = document.createElement(\"canvas\"); }catch(e){alert(\"Your browser does not support HTML5 CANVAS:GET FIREFOX !\");return;};canvas_div.appendChild(cnv);};cnv.width = size_x;cnv.height = size_y;cnv.style.top = 0;cnv.style.left = 0;cnv.style.position = \"absolute\";cnv.id = \"wims_canvas%d\"+canvas_type;return cnv;};\

function findPosX(i){ var obj = i;var curleft = 0;if(obj.offsetParent){while(1){curleft += obj.offsetLeft;if(!obj.offsetParent){break;};obj = obj.offsetParent;};}else{if(obj.x){curleft += obj.x;};};return curleft;};function findPosY(i){var obj = i;var curtop = 0;if(obj.offsetParent){while(1){curtop += obj.offsetTop;if(!obj.offsetParent){break;};obj = obj.offsetParent;};}else{if(obj.y){curtop += obj.y;};};return curtop;};\

function x2px(x){if(use_xlogscale == 0 ){return parseFloat(x*xsize/(xmax - xmin) - xsize*xmin/(xmax - xmin));}else{var x_max = Math.log(xmax)/Math.log(xlogbase);var x_min = Math.log(xmin)/Math.log(xlogbase);var x_in = Math.log(x)/Math.log(xlogbase);return x_in*xsize/(x_max - x_min) - xsize*x_min/(x_max - x_min);};};\

function px2x(px){if(use_xlogscale == 0 ){return parseFloat(px*(xmax - xmin)/xsize + xmin);}else{var x_max = Math.log(xmax)/Math.log(xlogbase);var x_min = Math.log(xmin)/Math.log(xlogbase);var x_out = x_min +px*(x_max - x_min)/(xsize);return Math.pow(xlogbase,x_out);};};\

function px2y(py){if(use_ylogscale == 0 ){return parseFloat(ymax - py*(ymax - ymin)/ysize);}else{var y_max = Math.log(ymax)/Math.log(ylogbase);var y_min = Math.log(ymin)/Math.log(ylogbase);var y_out = y_max +py*(y_min - y_max)/(ysize);return Math.pow(ylogbase,y_out);};};\

function y2px(y){if(use_ylogscale == 0){return parseFloat(-1*y*ysize/(ymax - ymin) + ymax*ysize/(ymax - ymin));}else{var y_max = Math.log(ymax)/Math.log(ylogbase);var y_min = Math.log(ymin)/Math.log(ylogbase);var y_in = Math.log(y)/Math.log(ylogbase);return (y_max - y_in)*ysize/(y_max - y_min);};};\

function scale_x_radius(rx){return rx*xsize/(xmax - xmin);};\

function scale_y_radius(ry){return ry*ysize/(ymax - ymin);};\

function distance(x1,y1,x2,y2){return parseInt(Math.sqrt( (x1-x2)*(x1-x2) + (y1-y2)*(y1-y2) ));};\

function distance_to_line (r,q,x,y){var c = (y) - (-1/r)*(x);var xs = r*(c - q)/(r*r+1);var ys = (r)*(xs)+(q);return parseInt(Math.sqrt( (xs-x)*(xs-x) + (ys-y)*(ys-y) ));};\

function move(obj,dx,dy){for(var p = 0 ; p < obj.x.length; p++){obj.x[p] = obj.x[p] + dx;obj.y[p] = obj.y[p] + dy;};return obj;};\

function slide(obj,dx,dy){for(var p = 0 ; p < obj.x.length; p++){obj.x[p] = x2px(obj.xorg[p] + dx);obj.y[p] = y2px(obj.yorg[p] + dy);};return obj;};\

var x_use_snap_to_grid = 0;var y_use_snap_to_grid = 0;var snap_x = 1;var snap_y = 1;\

function snap_to_x(x){return x2px(snap_x*(Math.round((px2x(x))/snap_x)));};\

function snap_to_y(y){return y2px(snap_y*(Math.round((px2y(y))/snap_y)));};\

var xlogbase = 10;\

var ylogbase = 10;\

var use_xlogscale = 0;\

var use_ylogscale = 0;\

var x_strings = null;\

var y_strings = null;\

var use_pan_and_zoom = 0;\

var use_jsmath = 0;\

var xstart = 0;\

var ystart = 0;\

var unit_x=\" \";\

var unit_y=\" \";",canvas_root_id,xsize,ysize,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id,canvas_root_id);

/* default add the drag code : nearly always used ...*/

add_drag_code(js_include_file,DRAG_CANVAS,canvas_root_id);

            break;

        case XRANGE:

        /*

        @ xrange xmin,xmax

        @ if not given: 0,xsize (eg in pixels)

        */

            for(i = 0 ; i<2; i++){

                switch(i){

                    case 0: xmin = get_real(infile,0);break;

                    case 1: xmax = get_real(infile,1);break;

                    default: break;

                }

            }

            if(xmin >= xmax){canvas_error(" xrange is not OK : xmin < xmax !\n");}

            fprintf(js_include_file,"var xmin = %f;var xmax = %f;",xmin,xmax);

            found_size_command++;

            break;

        case YRANGE:

        /*

        @ yrange ymin,ymax

        @ if not given 0,ysize (eg in pixels)

        */

            for(i = 0 ; i<2; i++){

                switch(i){

                    case 0: ymin = get_real(infile,0);break;

                    case 1: ymax = get_real(infile,1);break;

                    default: break;

                }

            }

            if(ymin >= ymax){canvas_error(" yrange is not OK : ymin < ymax !\n");}

            fprintf(js_include_file,"var ymin = %f;var ymax = %f;",ymin,ymax);

            found_size_command++;

            break;

        case TRANGE:

        /*

        @ trange tmin,tmax

        @ default -2,2

        */

            use_parametric = TRUE;

            for(i = 0 ; i<2; i++){

                switch(i){

                    case 0: tmin = get_real(infile,0);break;

                    case 1: tmax = get_real(infile,1);break;

                    default: break;

                }

            }

            if(tmin >= tmax ){canvas_error(" trange is not OK : tmin < tmax!\n");}

            break;

        case LINEWIDTH:

        /*

        @ linewidth int

        @ default 1

        */

            line_width = (int) (get_real(infile,1));

            break;

        case ARROWHEAD:

        /*

        @ arrowhead int

        @ default 8 (pixels)

        */

            arrow_head = (int) (get_real(infile,1));

            break;

        case CROSSHAIRSIZE:

        /*

        @ crosshairsize int

        @ default 10 (px)

        */

            crosshair_size = (int) (get_real(infile,1));

            break;

        case CROSSHAIR:

        /*

        @ crosshair x,y,color

        @ draw a single crosshair point at (x;y) in color 'color'

        @ use command 'crosshairsize int' and / or 'linewidth int'  to adust

        @ may be set draggable / onclick

        */

            for(i=0;i<3;i++){

                switch(i){

                    case 0: double_data[0] = get_real(infile,0);break; /* x */

                    case 1: double_data[1] = get_real(infile,0);break; /* y */

                    case 2: stroke_color = get_color(infile,1);/* name or hex color */

                        decimals = find_number_of_digits(precision);

                        fprintf(js_include_file,"dragstuff.addShape(new Shape(%d,%d,%d,7,[%.*f],[%.*f],[%d],[%d],%d,\"%s\",%.2f,\"%s\",%.2f,%d,%d,%d,%d,%d,%.1f,\"%s\",%d,\"%s\",%d,%s,%d,%d));\n",click_cnt,onclick,drag_type,decimals,double_data[0],decimals,double_data[1],crosshair_size,crosshair_size,line_width,stroke_color,stroke_opacity,fill_color,fill_opacity,use_filled,0,0,0,use_rotate,angle,flytext,font_size,font_family,use_affine,affine_matrix,slider,slider_cnt);

                        click_cnt++;reset();

                        break;

                    default:break;

                }

            }

            break;

        case CROSSHAIRS:

        /*

        @ crosshairs color,x1,y1,x2,y2,...,x_n,y_n

        @ draw multiple crosshair points at given coordinates in color 'color'

        @ use command 'crosshairsize int' and / or 'linewidth int'  to adust

        @ may be set draggable / onclick individually (!)

        */

            stroke_color=get_color(infile,0); /* how nice: now the color comes first...*/

            fill_color = stroke_color;

            i=0;

            while( ! done ){     /* get next item until EOL*/

                if(i > MAX_INT - 1){canvas_error("to many points in argument: repeat command multiple times to fit");}

                if(i%2 == 0 ){

                    double_data[i] = get_real(infile,0); /* x */

                }

                else

                {

                    double_data[i] = get_real(infile,1); /* y */

                }

                i++;

            }

            decimals = find_number_of_digits(precision);

            for(c=0 ; c < i-1 ; c = c+2){

                fprintf(js_include_file,"dragstuff.addShape(new Shape(%d,%d,%d,7,[%.*f],[%.*f],[%d],[%d],%d,\"%s\",%.2f,\"%s\",%.2f,%d,%d,%d,%d,%d,%.1f,\"%s\",%d,\"%s\",%d,%s,%d,%d));\n",click_cnt,onclick,drag_type,decimals,double_data[c],decimals,double_data[c+1],crosshair_size,crosshair_size,line_width,stroke_color,stroke_opacity,stroke_color,stroke_opacity,1,0,0,0,use_rotate,angle,flytext,font_size,font_family,use_affine,affine_matrix,slider,slider_cnt);

                click_cnt++;

            }

            reset();

            break;

        case POINT:

        /*

        @ point x,y,color

        @ draw a single point at (x;y) in color 'color'

        @ use command 'linewidth int'  to adust size

        @ may be set draggable / onclick

        @ will not resize on zooming <br />(command 'circle x,y,r,color' will resize on zooming)

        */

            for(i=0;i<3;i++){

                switch(i){

                    case 0: double_data[0] = get_real(infile,0);break; /* x */

                    case 1: double_data[1] = get_real(infile,0);break; /* y */

                    case 2: stroke_color = get_color(infile,1);/* name or hex color */

                    decimals = find_number_of_digits(precision);

                    fprintf(js_include_file,"dragstuff.addShape(new Shape(%d,%d,%d,2,[%.*f],[%.*f],[%d],[%d],%d,\"%s\",%.2f,\"%s\",%.2f,%d,%d,%d,%d,%d,%.1f,\"%s\",%d,\"%s\",%d,%s,%d,%d));\n",click_cnt,onclick,drag_type,decimals,double_data[0],decimals,double_data[1],line_width,line_width,line_width,stroke_color,stroke_opacity,stroke_color,stroke_opacity,1,0,0,0,use_rotate,angle,flytext,font_size,font_family,use_affine,affine_matrix,slider,slider_cnt);

                    click_cnt++;break;

                    default: break;

                }

            }

            reset();

            break;

        case POINTS:

        /*

        @ points color,x1,y1,x2,y2,...,x_n,y_n

        @ draw multiple points at given coordinates in color 'color'

        @ use command 'linewidth int'  to adust size

        @ may be set draggable / onclick individually (!)

        */

            stroke_color=get_color(infile,0); /* how nice: now the color comes first...*/

            fill_color = stroke_color;

            i=0;

            while( ! done ){     /* get next item until EOL*/

                if(i > MAX_INT - 1){canvas_error("to many points in argument: repeat command multiple times to fit");}

                if(i%2 == 0 ){

                    double_data[i] = get_real(infile,0); /* x */

                }

                else

                {

                    double_data[i] = get_real(infile,1); /* y */

                }

                i++;

            }

            decimals = find_number_of_digits(precision);           

            for(c = 0 ; c < i-1 ; c = c+2){

                fprintf(js_include_file,"dragstuff.addShape(new Shape(%d,%d,%d,2,[%.*f],[%.*f],[%d],[%d],%d,\"%s\",%.2f,\"%s\",%.2f,%d,%d,%d,%d,%d,%.1f,\"%s\",%d,\"%s\",%d,%s,%d,%d));\n",click_cnt,onclick,drag_type,decimals,double_data[c],decimals,double_data[c+1],line_width,line_width,line_width,stroke_color,stroke_opacity,stroke_color,stroke_opacity,1,0,0,0,use_rotate,angle,flytext,font_size,font_family,use_affine,affine_matrix,slider,slider_cnt);

                click_cnt++;

            }

            reset();

            break;

        case SEGMENT:

        /*

        @ segment x1,y1,x2,y2,color

        @ draw a line segment between points (x1:y1)--(x2:y2) in color 'color'

        @ may be set draggable / onclick

        */

            for(i=0;i<5;i++) {

                switch(i){

                    case 0: double_data[0]= get_real(infile,0);break; /* x1-values */

                    case 1: double_data[1]= get_real(infile,0);break; /* y1-values */

                    case 2: double_data[2]= get_real(infile,0);break; /* x2-values */

                    case 3: double_data[3]= get_real(infile,0);break; /* y2-values */

                    case 4: stroke_color=get_color(infile,1);/* name or hex color */

                        decimals = find_number_of_digits(precision);

                        fprintf(js_include_file,"dragstuff.addShape(new Shape(%d,%d,%d,4,[%.*f,%.*f],[%.*f,%.*f],[30,30],[30,30],%d,\"%s\",%.2f,\"%s\",%.2f,%d,%d,%d,%d,%d,%.1f,\"%s\",%d,\"%s\",%d,%s,%d,%d));\n",click_cnt,onclick,drag_type,decimals,double_data[0],decimals,double_data[2],decimals,double_data[1],decimals,double_data[3],line_width,stroke_color,stroke_opacity,stroke_color,stroke_opacity,0,use_dashed,dashtype[0],dashtype[1],use_rotate,angle,flytext,font_size,font_family,use_affine,affine_matrix,slider,slider_cnt);

                        click_cnt++;reset();

                        break;

                    default: break;

                }

            }

            break;

        case LINE:

        /*

        @ line x1,y1,x2,y2,color

        @ draw a line through points (x1:y1)--(x2:y2) in color 'color'

        @ or use command 'curve color,formula' to draw the line <br />(uses more points to draw the line; is however better draggable)

        @ may be set draggable / onclick

        */

            for(i=0;i<5;i++){

                switch(i){

                    case 0: double_data[10]= get_real(infile,0);break; /* x-values */

                    case 1: double_data[11]= get_real(infile,0);break; /* y-values */

                    case 2: double_data[12]= get_real(infile,0);break; /* x-values */

                    case 3: double_data[13]= get_real(infile,0);break; /* y-values */

                    case 4: stroke_color=get_color(infile,1);/* name or hex color */

                    if( double_data[10] == double_data[12] ){ /* vertical line*/

                        double_data[1] = xmin;

                        double_data[3] = ymax;

                        double_data[0] = double_data[10];

                        double_data[2] = double_data[10];

                    }

                    else

                    {

                        if( double_data[11] == double_data[13] ){ /* horizontal line */

                            double_data[1] = double_data[11];

                            double_data[3] = double_data[11];

                            double_data[0] = ymin;

                            double_data[2] = xmax;

                        }

                        else

                        {

                        /* m */

                        double_data[5] = (double_data[13] - double_data[11]) /(double_data[12] - double_data[10]);

                        /* q */

                        double_data[6] = double_data[11] - ((double_data[13] - double_data[11]) /(double_data[12] - double_data[10]))*double_data[10];

                        /*xmin,m*xmin+q,xmax,m*xmax+q*/

                            double_data[1] = (double_data[5])*(xmin)+(double_data[6]);

                            double_data[3] = (double_data[5])*(xmax)+(double_data[6]);

                            double_data[0] = xmin;

                            double_data[2] = xmax;

                        }

                    }

                    decimals = find_number_of_digits(precision);

                    fprintf(js_include_file,"dragstuff.addShape(new Shape(%d,%d,%d,4,[%.*f,%.*f],[%.*f,%.*f],[30,30],[30,30],%d,\"%s\",%.2f,\"%s\",%.2f,%d,%d,%d,%d,%d,%.1f,\"%s\",%d,\"%s\",%d,%s,%d,%d));\n",click_cnt,onclick,drag_type,decimals,double_data[0],decimals,double_data[2],decimals,double_data[1],decimals,double_data[3],line_width,stroke_color,stroke_opacity,stroke_color,stroke_opacity,0,use_dashed,dashtype[0],dashtype[1],use_rotate,angle,flytext,font_size,font_family,use_affine,affine_matrix,slider,slider_cnt);

                    click_cnt++;reset();

                    break;

                }

            }

            break;

        case HLINE:

        /*

        @ hline x,y,color

        @ draw a horizontal line through point (x:y) in color 'color'

        @ or use command 'curve color,formula' to draw the line <br />(uses more points to draw the line; is however better draggable)

        @ may be set draggable / onclick

        */

            for(i=0;i<3;i++) {

                switch(i){

                    case 0: double_data[0] = get_real(infile,0);break; /* x-values */

                    case 1: double_data[1] = get_real(infile,0);break; /* y-values */

                    case 2: stroke_color = get_color(infile,1);/* name or hex color */

                    double_data[3] = double_data[1];

                    decimals = find_number_of_digits(precision);

                    fprintf(js_include_file,"dragstuff.addShape(new Shape(%d,%d,%d,4,[%.*f,%.*f],[%.*f,%.*f],[30,30],[30,30],%d,\"%s\",%.2f,\"%s\",%.2f,%d,%d,%d,%d,%d,%.1f,\"%s\",%d,\"%s\",%d,%s,%d,%d));\n",click_cnt,onclick,drag_type,decimals,xmin,decimals,xmax,decimals,double_data[1],decimals,double_data[3],line_width,stroke_color,stroke_opacity,stroke_color,stroke_opacity,0,use_dashed,dashtype[0],dashtype[1],use_rotate,angle,flytext,font_size,font_family,use_affine,affine_matrix,slider,slider_cnt);

                    click_cnt++;reset();

                    break;

                }

            }

            break;

        case VLINE:

        /*

        @ vline x,y,color

        @ draw a vertical line through point (x:y) in color 'color'

        @ may be set draggable / onclick

        */

            for(i=0;i<3;i++) {

                switch(i){

                    case 0: double_data[0] = get_real(infile,0);break; /* x-values */

                    case 1: double_data[1] = get_real(infile,0);break; /* y-values */

                    case 2: stroke_color=get_color(infile,1);/* name or hex color */

                        double_data[2] = double_data[0];

                        decimals = find_number_of_digits(precision);

                        fprintf(js_include_file,"dragstuff.addShape(new Shape(%d,%d,%d,4,[%.*f,%.*f],[%.*f,%.*f],[30],[30],%d,\"%s\",%.2f,\"%s\",%.2f,%d,%d,%d,%d,%d,%.1f,\"%s\",%d,\"%s\",%d,%s,%d,%d));\n",click_cnt,onclick,drag_type,decimals,double_data[0],decimals,double_data[2],decimals,ymin,decimals,ymax,line_width,stroke_color,stroke_opacity,fill_color,fill_opacity,use_filled,use_dashed,dashtype[0],dashtype[1],use_rotate,angle,flytext,font_size,font_family,use_affine,affine_matrix,slider,slider_cnt);

                        click_cnt++;reset();

                    break;

                }

            }

            break;

        case SQUARE:

        /*

        @ square x,y,side (px) ,color

        @ draw a square with left top corner (x:y) with side 'side' in color 'color'

        @ use command 'fsquare x,y,side,color' for a filled square

        @ use command/keyword  'filled' before command 'square x,y,side,color'

        @ use command 'fillcolor color' before 'fsquare' to set the fill colour.

        @ may be set draggable / onclick

        */

            for(i=0;i<5;i++){

                switch(i){

                    case 0:double_data[0] = get_real(infile,0);break; /* x1-values */

                    case 1:double_data[1] = get_real(infile,0);break; /* y1-values */

                    case 2:double_data[2] = (int) (get_real(infile,0));break; /* width in px */

                    case 3:

                        stroke_color = get_color(infile,1);/* name or hex color */

                        decimals = find_number_of_digits(precision);

                        double_data[3] = double_data[0] + (xmax - xmin)*double_data[2]/xsize;

                        double_data[4] = double_data[1] + -1*(ymax - ymin)*double_data[2]/ysize;

                        fprintf(js_include_file,"dragstuff.addShape(new Shape(%d,%d,%d,1,[%.*f,%.*f,%.*f,%.*f],[%.*f,%.*f,%.*f,%.*f],[%d],[%d],%d,\"%s\",%.2f,\"%s\",%.2f,%d,%d,%d,%d,%d,%.1f,\"%s\",%d,\"%s\",%d,%s,%d,%d));\n",click_cnt,onclick,drag_type,decimals,double_data[0],decimals,double_data[3],decimals,double_data[3],decimals,double_data[0],decimals,double_data[1],decimals,double_data[1],decimals,double_data[4],decimals,double_data[4],line_width,line_width,line_width,stroke_color,stroke_opacity,stroke_color,fill_opacity,use_filled,use_dashed,dashtype[0],dashtype[1],use_rotate,angle,flytext,font_size,font_family,use_affine,affine_matrix,slider,slider_cnt);

                        click_cnt++;reset();

                        break;

                }

            }

            break;

        case ROUNDRECT:

        /*

        @ roundrect x1,y1,x2,y2,radius,color

        @ use command 'froundrect x1,y1,x2,y2,radius,color' for a filled rectangle

        @ use command/keyword  'filled' before command 'roundrect x1,y1,x2,y2,radius,color'

        @ use command 'fillcolor color' before 'froundrect' to set the fill colour.

        @ may be set draggable / onclick

        */

            for(i=0;i<6;i++){

                switch(i){

                    case 0:double_data[0] = get_real(infile,0);break; /* x-values */

                    case 1:double_data[1] = get_real(infile,0);break; /* y-values */

                    case 2:double_data[2] = get_real(infile,0);break; /* x-values */

                    case 3:double_data[3] = get_real(infile,0);break; /* y-values */

                    case 4:int_data[0] = (int) (get_real(infile,0));break; /* radius value in pixels */

                    case 5:stroke_color = get_color(infile,1);/* name or hex color */

                        /* ensure no inverted roundrect is produced... */

                        if( double_data[0] > double_data[2] ){double_data[4] = double_data[0];double_data[0] = double_data[2];double_data[2] = double_data[4];}

                        if( double_data[3] > double_data[1] ){double_data[4] = double_data[1];double_data[1] = double_data[3];double_data[3] = double_data[4];}

                        decimals = find_number_of_digits(precision);

                        fprintf(js_include_file,"dragstuff.addShape(new Shape(%d,%d,%d,6,[%.*f,%.*f],[%.*f,%.*f],[%d,%d],[%d,%d],%d,\"%s\",%.2f,\"%s\",%.2f,%d,%d,%d,%d,%d,%.1f,\"%s\",%d,\"%s\",%d,%s,%d,%d));\n",click_cnt,onclick,drag_type,decimals,double_data[0],decimals,double_data[2],decimals,double_data[1],decimals,double_data[3],int_data[0],int_data[0],int_data[0],int_data[0],line_width,stroke_color,stroke_opacity,stroke_color,fill_opacity,use_filled,use_dashed,dashtype[0],dashtype[1],use_rotate,angle,flytext,font_size,font_family,use_affine,affine_matrix,slider,slider_cnt);

                        click_cnt++;reset();

                    break;

                }

            }

            break;

        case RECT:

        /*

        @ rect x1,y1,x2,y2,color

        @ use command 'rect x1,y1,x2,y2,color' for a filled rectangle

        @ use command/keyword  'filled' before command 'rect x1,y1,x2,y2,color'

        @ use command 'fillcolor color' before 'frect' to set the fill colour.

        @ may be set draggable / onclick

        */

            for(i=0;i<5;i++){

                switch(i){

                    case 0:double_data[0] = get_real(infile,0);break; /* x-values */

                    case 1:double_data[1] = get_real(infile,0);break; /* y-values */

                    case 2:double_data[2] = get_real(infile,0);break; /* x-values */

                    case 3:double_data[3] = get_real(infile,0);break; /* y-values */

                    case 4:stroke_color = get_color(infile,1);/* name or hex color */

                        decimals = find_number_of_digits(precision);

                        fprintf(js_include_file,"dragstuff.addShape(new Shape(%d,%d,%d,1,[%.*f,%.*f,%.*f,%.*f],[%.*f,%.*f,%.*f,%.*f],[%d],[%d],%d,\"%s\",%.2f,\"%s\",%.2f,%d,%d,%d,%d,%d,%.1f,\"%s\",%d,\"%s\",%d,%s,%d,%d));\n",click_cnt,onclick,drag_type,decimals,double_data[0],decimals,double_data[2],decimals,double_data[2],decimals,double_data[0],decimals,double_data[1],decimals,double_data[1],decimals,double_data[3],decimals,double_data[3],line_width,line_width,line_width,stroke_color,stroke_opacity,stroke_color,fill_opacity,use_filled,use_dashed,dashtype[0],dashtype[1],use_rotate,angle,flytext,font_size,font_family,use_affine,affine_matrix,slider,slider_cnt);

                        click_cnt++;reset();

                        break;

                }

            }

            break;

        case POLYLINE:

        /*

        @ polyline color,x1,y1,x2,y2...x_n,y_n

        @ may be set draggable / onclick

        */

            stroke_color=get_color(infile,0); /* how nice: now the color comes first...*/

            i=0;

            c=0;

            while( ! done ){     /* get next item until EOL*/

                if(i > MAX_INT - 1){canvas_error("to many points in argument: repeat command multiple times to fit");}