#!/usr/bin/perl

$form_info = $ENV{'QUERY_STRING'};

($rectInfo, $ovalInfo, $spriteInfo, $animEventInfo, $ltsEventInfo) = split (/&/, $form_info);

($rect, $rectNum) = split(/=/, $rectInfo);
($oval, $ovalNum) = split(/=/, $ovalInfo);
($sprite, $spriteNum) = split(/=/, $spriteInfo);
($animEvent, $animEventNum) = split(/=/, $animEventInfo);
($ltsEvent, $ltsEventNum) = split(/=/, $ltsEventInfo);

print "Content-type: text/html\n";
print "Pragma: no-cache\n\n";

print <<End_of_formScript_p1_until_Var_Declaration;

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
   <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
   <META NAME="Author" CONTENT="Gaurav S. Kc">
   <META NAME="GENERATOR" CONTENT="Mozilla/4.06 [en] (WinNT; I) [Netscape]">
   <TITLE>Use a form to create a new script ...</TITLE>
</HEAD>

<SCRIPT LANGUAGE="javascript">
<!--

End_of_formScript_p1_until_Var_Declaration

print "var numRect = ".$rectNum.";\n";
print "var numOval = ".$ovalNum.";\n";
print "var numSprite = ".$spriteNum.";\n";
print "var numAnimEvent = ".$animEventNum.";\n";
print "var numLtsEvent = ".$ltsEventNum.";\n";

print <<End_of_formScript_p1_until_End;

function ensureCorrectFormData() {
  // this will check for duplicates in object names and/or animaEvent/LtsEvents
}

function checkNum(str) {
  var numRep;
  if (str == "0") {
    // value is zero
    return 1;
  } else if (!(numRep = parseInt(str))) {
    // str isn't numeric
    return 0;
  } else if (numRep.toString().length != str.length) {
    // parseInt converted only the first chars to int
    return 0;
  } else {
    return 1;
  }
}

function print_CheckNum_Code() {
  document.write('onChange="');
  document.write('	if (this.value) {');
  document.write('	  if (!checkNum(this.value)) {');
  document.write('	    alert(\\\'Please enter a number!\\\');');
  document.write('          this.value = 0;');
  document.write('	    this.focus();');
  document.write('	  }');
  document.write('	}');
  document.write('"');
}

function printRect(n) {
  var thisRectangle = 'Rect_'+n+'_';
  document.write('Rect: #',n);

  document.write('<BR>&nbsp;');
  document.write('<TABLE BORDER CELLSPACING=0 CELLPADDING=0 WIDTH="82%" >');
  document.write('<TR>');
  document.write('<TH ALIGN=LEFT COLSPAN="4"><B><FONT SIZE=+2>Rectangle:&nbsp;</FONT></B><INPUT TYPE="text" NAME="',thisRectangle,'Name" SIZE=20 MAXLENGTH=20></TH>');
  document.write('</TR>');

  document.write('<TR>');
  document.write('<TH ALIGN=LEFT>Coordinates:&nbsp;&nbsp;&nbsp; x:&nbsp;<INPUT TYPE="text" NAME="',thisRectangle,'X" SIZE=3 MAXLENGTH=3 ');
  print_CheckNum_Code();
  document.write('>&nbsp;');
  document.write('y:&nbsp;<INPUT TYPE="text" NAME="',thisRectangle,'Y" SIZE=3 MAXLENGTH=3 ');
  print_CheckNum_Code();
  document.write('></TH>');

  document.write('<TH ALIGN=LEFT>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Height:&nbsp;<INPUT TYPE="text" NAME="',thisRectangle,'Ht" SIZE=3 MAXLENGTH=3 ');
  print_CheckNum_Code();
  document.write('></TH>');

  document.write('<TH ALIGN=LEFT>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Width:&nbsp;<INPUT TYPE="text" NAME="',thisRectangle,'Wd" SIZE=3 MAXLENGTH=3 ');
  print_CheckNum_Code();
  document.write('></TH>');

  document.write('<TH ALIGN=LEFT>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Color:&nbsp;<INPUT TYPE="text" NAME="',thisRectangle,'Col" SIZE=7 MAXLENGTH=7></TH>'); 
  document.write('</TR>');

  document.write('<TR>');
  document.write('<TH ALIGN=LEFT COLSPAN="4">Track:&nbsp;<INPUT TYPE="text" NAME="',thisRectangle,'Track" SIZE=80 MAXLENGTH=80></TH>');
  document.write('</TR>');

  document.write('<TR>');
  document.write('<TH ALIGN=LEFT COLSPAN="4">Events:&nbsp;<INPUT TYPE="text" NAME="',thisRectangle,'Events" SIZE=100 MAXLENGTH=100></TH>');
  document.write('</TR>');
  document.write('</TABLE>');
}

function printOval(n) {
  var thisOval = 'Oval_'+n+'_';
  document.write('Oval #',n);

  document.write('<BR>&nbsp;');
  document.write('<TABLE BORDER CELLSPACING=0 CELLPADDING=0 WIDTH="82%" >');
  document.write('<TR>');
  document.write('<TH ALIGN=LEFT COLSPAN="4"><B><FONT SIZE=+2>Oval:&nbsp;</FONT></B><INPUT TYPE="text" NAME="',thisOval,'Name" SIZE=20 MAXLENGTH=20></TH>');
  document.write('</TR>');

  document.write('<TR>');
  document.write('<TH ALIGN=LEFT>Coordinates:&nbsp;&nbsp;&nbsp; x:&nbsp;<INPUT TYPE="text" NAME="',thisOval,'X" SIZE=3 MAXLENGTH=3 ');
  print_CheckNum_Code();
  document.write('>&nbsp;');
  document.write('y:&nbsp;<INPUT TYPE="text" NAME="',thisOval,'Y" SIZE=3 MAXLENGTH=3 ');
  print_CheckNum_Code();
  document.write('></TH>');

  document.write('<TH ALIGN=LEFT>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Height:&nbsp;<INPUT TYPE="text" NAME="',thisOval,'Ht" SIZE=3 MAXLENGTH=3 ');
  print_CheckNum_Code();
  document.write('></TH>');

  document.write('<TH ALIGN=LEFT>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Width:&nbsp;<INPUT TYPE="text" NAME="',thisOval,'Wd" SIZE=3 MAXLENGTH=3 ');
  print_CheckNum_Code();
  document.write('></TH>');

  document.write('<TH ALIGN=LEFT>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Color:&nbsp;<INPUT TYPE="text" NAME="',thisOval,'Col" SIZE=7 MAXLENGTH=7></TH>');
  document.write('</TR>');

  document.write('<TR>');
  document.write('<TH ALIGN=LEFT COLSPAN="4">Track:&nbsp;<INPUT TYPE="text" NAME="',thisOval,'Track" SIZE=80 MAXLENGTH=80></TH>');
  document.write('</TR>');

  document.write('<TR>');
  document.write('<TH ALIGN=LEFT COLSPAN="4">Events:&nbsp;<INPUT TYPE="text" NAME="',thisOval,'Events" SIZE=100 MAXLENGTH=100></TH>');
  document.write('</TR>');
  document.write('</TABLE>');
}

function printSprite(n) {
  var thisSprite = 'Sprite_'+n+'_';
  document.write('Sprite #',n);

  document.write('<BR>&nbsp;');
  document.write('<TABLE BORDER CELLSPACING=0 CELLPADDING=0 WIDTH="82%" >');
  document.write('<TR>');
  document.write('<TH ALIGN=LEFT COLSPAN="4"><B><FONT SIZE=+2>Sprite:&nbsp;</FONT></B><INPUT TYPE="text" NAME="',thisSprite,'Name" SIZE=20 MAXLENGTH=20></TH>');
  document.write('</TR>');

  document.write('<TR>');
  document.write('<TH ALIGN=LEFT>Coordinates:&nbsp;&nbsp;&nbsp; x:&nbsp;<INPUT TYPE="text" NAME="',thisSprite,'X" SIZE=3 MAXLENGTH=3 ');
  print_CheckNum_Code();
  document.write('>&nbsp;');
  document.write('y:&nbsp;<INPUT TYPE="text" NAME="',thisSprite,'Y" SIZE=3 MAXLENGTH=3 ');
  print_CheckNum_Code();
  document.write('></TH>');

  document.write('<TH ALIGN=LEFT COLSPAN="3">&nbsp;Server File:&nbsp;<SELECT NAME="',thisSprite,'ServerFile" SIZE=1><OPTION><OPTION><OPTION><OPTION></SELECT></TH>');
  document.write('</TR>');

  document.write('<TR>');
  document.write('<TH ALIGN=LEFT>&nbsp;File@ :&nbsp;<SELECT name="ImageFileType" size=1><OPTION SELECTED>Server');
  document.write('file<OPTION>Client file</SELECT></TH>');

  document.write('<TH ALIGN=LEFT COLSPAN="3">&nbsp;Client File:&nbsp;<INPUT TYPE="file" NAME="',thisSprite,'ClientFile" SIZE=40 MAXLENGTH=40></TH>');
  document.write('</TR>');

  document.write('<TR>');
  document.write('<TH ALIGN=LEFT>Track:&nbsp;</TH>');

  document.write('<TD COLSPAN="3"><INPUT TYPE="text" NAME="',thisSprite,'Track" SIZE=80 MAXLENGTH=80></TD>');
  document.write('</TR>');

  document.write('<TR>');
  document.write('<TH ALIGN=LEFT>Events:&nbsp;</TH>');

  document.write('<TD COLSPAN="3"><INPUT TYPE="text" NAME="',thisSprite,'Events" SIZE=80 MAXLENGTH=80></TD>');
  document.write('</TR>');
  document.write('</TABLE>');
}

function printAnimEvent(n) {
  var thisAnimEvent = 'AnimEvent_'+n+'_';
  document.write('AnimEvent #',n);

  document.write('<BR>&nbsp;');
  document.write('<TABLE BORDER CELLSPACING=0 CELLPADDING=0 WIDTH="82%" >');
  document.write('<TR>');
  document.write('<TH ALIGN=LEFT><B><FONT SIZE=+2>AnimEvent:&nbsp;</FONT></B></TH>');

  document.write('<TD><INPUT TYPE="text" NAME="',thisAnimEvent,'Name" SIZE=20 MAXLENGTH=20></TD>');
  document.write('</TR>');

  document.write('<TR>');
  document.write('<TH ALIGN=LEFT>AnimationObject:&nbsp;</TH>');

  document.write('<TD><INPUT TYPE="text" NAME="',thisAnimEvent,'Object" SIZE=80 MAXLENGTH=80></TD>');
  document.write('</TR>');

  document.write('<TR>');
  document.write('<TH ALIGN=LEFT>Action:&nbsp;</TH>');

  document.write('<TD><INPUT TYPE="text" NAME="',thisAnimEvent,'Action" SIZE=80 MAXLENGTH=80></TD>');
  document.write('</TR>');
  document.write('</TABLE>');

}

function printLtsEvent(n) {
  var thisLtsEvent = 'LtsEvent_'+n+'_';
  document.write('LtsEvent #',n);

  document.write('<BR>&nbsp;');
  document.write('<TABLE BORDER CELLSPACING=0 CELLPADDING=0 WIDTH="82%" >');
  document.write('<TR>');
  document.write('<TH ALIGN=LEFT><B><FONT SIZE=+2>LtsEvent:&nbsp;</FONT></B></TH>');

  document.write('<TD><INPUT TYPE="text" NAME="',thisLtsEvent,'Name" SIZE=20 MAXLENGTH=20></TD>');
  document.write('</TR>');

  document.write('<TR>');
  document.write('<TH ALIGN=LEFT>AnimEvents:&nbsp;</TH>');

  document.write('<TD><INPUT TYPE="text" NAME="',thisLtsEvent,'AnimEvents" SIZE=80 MAXLENGTH=80></TD>');
  document.write('</TR>');
  document.write('</TABLE>');
}

// -->
</SCRIPT>

<BODY>

<H1>Easa-Form for specifying a script</H1><BR>

<FORM ENCTYPE="multipart/form-data" METHOD="POST" ACTION="formScript_p2.cgi">

<SCRIPT LANGUAGE="javascript">
<!--

// provide hidden variables for the CGI script:
document.write("<INPUT TYPE=HIDDEN NAME=NUMBER_RECTANGLES VALUE=", numRect, ">");
document.write("<INPUT TYPE=HIDDEN NAME=NUMBER_OVALS VALUE=", numOval, ">");
document.write("<INPUT TYPE=HIDDEN NAME=NUMBER_SPRITES VALUE=", numSprite, ">");
document.write("<INPUT TYPE=HIDDEN NAME=NUMBER_ANIMEVENTS VALUE=", numAnimEvent, ">");
document.write("<INPUT TYPE=HIDDEN NAME=NUMBER_LTSEVENTS VALUE=", numLtsEvent, ">");

// -->
</SCRIPT>

<H2>Please enter the data for rectangles ... </H2>
<SCRIPT LANGUAGE="javascript">
<!--
for (i=1; i<=numRect; i++) {
  printRect(i);
}
// -->
</SCRIPT>
<H2>Please enter the data for ovals ... </H2>
<SCRIPT LANGUAGE="javascript">
<!--
for (i=1; i<=numOval; i++) {
  printOval(i);
}
// -->
</SCRIPT>
<H2>Please enter the data for sprites ... </H2>
<SCRIPT LANGUAGE="javascript">
<!--
for (i=1; i<=numSprite; i++) {
  printSprite(i);
}
// -->
</SCRIPT>
<H2>Please enter the data for AnimEvents ... </H2>
<SCRIPT LANGUAGE="javascript">
<!--
for (i=1; i<=numAnimEvent; i++) {
  printAnimEvent(i);
}
// -->
</SCRIPT>
<H2>Please enter the data for LtsEvents ... </H2>
<SCRIPT LANGUAGE="javascript">
<!--
for (i=1; i<=numLtsEvent; i++) {
  printLtsEvent(i);
}
// -->
</SCRIPT>

<CENTER><INPUT TYPE="submit" VALUE="Submit form">
<INPUT TYPE="reset" VALUE="Clear form"></CENTER>
</FORM>
</BODY>
</HTML>

End_of_formScript_p1_until_End
