Dateigrösse: 18.37 kb
1<?php /***** dbConnect *****/ require_once '/home/httpd/vhosts/michaelster.ch/httpdocs/include/login_webprog08.php'; $mysqli =& new mysqli($host, $user, $password, $dbase); /***** dbConnect check *****/ if (mysqli_connect_errno()) { printf("Connect failed: %s\n", mysqli_connect_error()); exit(); } ?> <html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>Tischlein deck' dich!</title> <script type="text/javascript"> <!-- var a = 11; var b = 101; var c = 1001; var check=function(arg) { var divs = (a==arg) ? 'arg gleich elf' : (b==arg) ? 'arg gleich hunderteins' : 'arg ungleich elf && hunderteins'; alert(divs); } /* <div onclick="check(11);">arg 11</div> <div onclick="check(101);">arg 101</div> <div onclick="check(007);">arg 007</div> */ //--> </script> <script type="text/javascript"> <!-- var drag = "inaktiv"; var aktivX = 0; var aktivY = 0; var aktivDiv = null; var aktivZindex = 1000; var anz_DIVs = 18; function init() { divs = (document.layers) ? document.layers : (document.all) ? document.all.tags("DIV") : document.getElementsByTagName("DIV"); for (i=0; i< (divs.length-anz_DIVs); i++) { if (divs[i].captureEvents) // Netscape divs[i].captureEvents(Event.MOUSEDOWN); divs[i].onmousedown = mdown; } if (document.captureEvents) // Netscape document.captureEvents(Event.MOUSEMOVE | Event.MOUSEUP); document.onmouseup = mup; document.onmousemove = mmove; var pos_ausDB = ""; <?php if (isset($_POST['liste'])) { echo 'pos_ausDB = "'.$_POST['liste'].'"; '; } if (isset($_POST['vis'])) { echo 'pos_ausDB = "'.$_POST['positionen'].'"; '; } ?> if (pos_ausDB != "") { var divPosArray = pos_ausDB.split("+"); for (i=0; i< (divs.length-anz_DIVs); i++) { var posX = divPosArray[i].split(",")[0]; var posY = divPosArray[i].split(",")[1]; if (document.layers) { divs[i].left = posX; divs[i].top = posY; } else { divs[i].style.left = posX; divs[i].style.top = posY; } } } } // end init() window.onload = init; function mdown(e){ aktivDiv = this; if (document.layers) aktivDiv.zIndex = aktivZindex++; else aktivDiv.style.zIndex = aktivZindex++; drag = "aktiv"; aktivX = (e) ? e.pageX : event.clientX + document.body.scrollLeft; aktivY = (e) ? e.pageY : event.clientY + document.body.scrollTop; return false; } function mmove(e){ if (drag == "inaktiv") return; var neuX = (e) ? e.pageX : event.clientX + document.body.scrollLeft; var neuY = (e) ? e.pageY : event.clientY + document.body.scrollTop; var distX = (neuX-aktivX); var distY = (neuY-aktivY); aktivX = neuX; aktivY = neuY; if (document.layers) { aktivDiv.left += distX; aktivDiv.top += distY; } else { aktivDiv.style.left = parseInt(aktivDiv.style.left) + distX; aktivDiv.style.top = parseInt(aktivDiv.style.top) + distY; } } var positionenString = ""; function mup(e){ drag = "inaktiv"; positionenString = ""; for (i=0; i< (divs.length-anz_DIVs); i++) { var posX = (document.layers) ? divs[i].left : parseInt(divs[i].style.left); var posY = (document.layers) ? divs[i].top : parseInt(divs[i].style.top); if(i==0)positionenString += posX + "," + posY; else positionenString += "+" + posX + "," + posY; } } function nw(url,b,h,fenster) { n=window.open(url, fenster, "width="+b+",height="+h+",left=100,screenX=20,top=10,screenY=2, menubar=0,toolbar=0,scrollbars=0,resizable=0"); n.focus(); } //--> </script> <?php if (isset($_POST['senden'])) { if (strlen($_POST['konstellation']) < 3) { $msg = '<b><font color="#ff3300">Bitte Vorname überprüfen (mindestens 3 Zeichen)</font></b>'; } elseif (strlen($_POST['konstellation']) > 10) { $msg = '<b><font color="#ff3300">Bitte Vorname überprüfen (maximal 10 Zeichen )</font></b>'; } else { $sql = 'INSERT INTO tischlein (datum,name,positionen) VALUES (NOW(NULL),"'.$_POST['konstellation'].'","'.$_POST['positionen'].'")'; if($mysqli->query($sql) !== false) { $msg = '<b><font color="green">Positionen gespeichert - bitte Lösungen anklicken und kontrollieren!</font></b>'; } $pid = $mysqli->insert_id; } echo '<br /><br />'; echo $msg; } ?> <style type="text/css"> body { margin:0; padding-top:15px; padding-left: 12px; font-family: verdana,sans-serif; background-color: #fff; } form { margin:0; padding:0; } input.sub { background-color: #f5f5f5; color: #000; font-size: 13px; font-weight: bold; width: 170px; margin: 0; padding-top: 8px; cursor: pointer; -moz-border-radius: 10px; border-left: 1px solid #000; border-top: 1px solid #000; border-right: 2px solid #808080; border-bottom: 2px solid #808080; } a { margin:0; padding:0 } a img { border:0 !important; cursor: pointer !important; } img { border:0 !important; cursor: move !important; } table.leer { background-color:#f8f8ff; color:#849dbc !important; font-size: 12px !important; } #navpanel0 { margin:0px; padding:0px; background-color: #849dbc; position: absolute; top: 10px; left: 700px; width: 122px; height: 32px; z-index:15; border-top:1px solid #000000; border-bottom:0px solid #849dbc; visibility:<?php echo !empty($pid) ? 'visible' : 'hidden'; ?>; } #navpanel1 { background-color: #849dbc; position: absolute; top: 10px; left: 160px; width: 665px; height: 36px; visibility: visible; z-index:10; border:1px solid #000000; } #navpanel2 { background-color: #849dbc; position: absolute; top: 10px; left: 10px; width: 220px; height: 36px; visibility: visible; z-index:15; border:1px solid #000000; border-right:0px solid #849dbc; } #navpanel_icon img { margin:0px; padding:0px; position: absolute; top: 11px; left: 845px; width: 26px; height: 26px; z-index:33; } #navpanel_link { position: absolute; top: 20px; left: 910px; width: 90px; height: 30px; } #navpanel_link a { color: #006666; font-size: 11px; font-weight: bold; padding: 2px; } #navpanel_link a:hover { font-size: 11px; font-weight: bold; color: #fff; background-color: #066; text-decoration: none } #navpanel_link img, #navpanel_link a img { border: 0px solid white; } #navpanel_titel { position:absolute; top:110px; left:270px; width:250px; height:30px; clip:rect(0px 400px 90px 0px); z-index:6; font-size:20px; } #navpanel_leittext { position:absolute; top:36px; left:838px; width:40px; height:12px; margin:0; padding:0; font-size:10px; } #navpanel_tab { position:absolute; top:85px; left:10px; width:816px; height:532px; clip:rect(0px 816px 532px 0px); background-color: #f8f8ff; z-index:1; } </style> </head> <body> <div id="bild2" style="position: absolute; top: 100px; left: 20px; width: 97px; height: 96px; visibility: visible; display: block; z-index:10"><img src="img/kaese.gif" alt="Linke Mouse-Taste gedrückt halten und das Bild verschieben" width="97" height="96" border="0" /></div> <div id="bild3" style="position: absolute; top: 210px; left: 20px; width: 100px; height: 59px; visibility: visible; display: block; z-index:10"><img src="img/katze.gif" alt="Linke Mouse-Taste gedrückt halten und das Bild verschieben" width="100" height="59" border="0" /></div> <div id="bild4" style="position: absolute; top: 290px; left: 20px; width: 100px; height: 91px; visibility: visible; display: block; z-index:10"><img src="img/kuchen.gif" alt="Linke Mouse-Taste gedrückt halten und das Bild verschieben" width="100" height="91" border="0" /></div> <div id="bild5" style="position: absolute; top: 400px; left: 20px; width: 60px; height: 70px; visibility: visible; display: block; z-index:20"><img src="img/apfel.gif" alt="Linke Mouse-Taste gedrückt halten und das Bild verschieben" width="60" height="70" border="0" /></div> <div id="bild6" style="position: absolute; top: 490px; left: 20px; width: 100px; height: 83px; visibility: visible; display: block; z-index:15"><img src="img/kaffee.gif" alt="Linke Mouse-Taste gedrückt halten und das Bild verschieben" width="100" height="83" border="0" /></div> <div id="bild7" style="position: absolute; top: 430px; left: 100px; width: 100px; height: 59px; visibility: visible; display: block; z-index:10"><img src="img/schuhe.gif" alt="Linke Mouse-Taste gedrückt halten und das Bild verschieben" width="100" height="59" border="0" /></div> <div id="bild8" style="position: absolute; top: 330px; left: 120px; width: 64px; height: 96px; visibility: visible; display: block; z-index:10"><img src="img/eis_coupe.gif" alt="Linke Mouse-Taste gedrückt halten und das Bild verschieben" width="64" height="96" border="0" /></div> <div id="bild9" style="position: absolute; top: 220px; left: 120px; width: 100px; height: 76px; visibility: visible; display: block; z-index:10"><img src="img/kanne-2.gif" alt="Linke Mouse-Taste gedrückt halten und das Bild verschieben" width="100" height="76" border="0" /></div> <div id="bild10" style="position: absolute; top: 120px; left: 105px; width: 100px; height: 95px; visibility: visible; display: block; z-index:10"><img src="img/maus01.gif" alt="Linke Mouse-Taste gedrückt halten und das Bild verschieben" width="100" height="95" border="0" /></div> <div id="bild1" style="cursor: hand !important; position: absolute; top: 240px; left: 200px; width: 350px; height: 331px; visibility: visible; display: block; z-index:5"><img style="cursor:CROSSHAIR !important" src="img/tisch.gif" alt="Linke Mouse-Taste gedrückt halten und das Bild verschieben" width="350" height="331" border="0" /></div> <div id="test1" style="border: 1px solid #000000; font-family:verdana,arial,sans-serif; font-size:12px; padding:4px; font-weight:bold; position:absolute; left:624px; top:85px; width:202px; height:50px; clip:rect(0px 202px 50px 0px); color:#ffffff; background-color:#849dbc; layer-background-color:#849dbc; z-index:20;">Die Katze ist müde. Hilf ein bisserl nach und leg' sie<br>unter den Tisch.</div> <div id="test2" style="border: 1px solid #000000; font-family:verdana,arial,sans-serif; font-size:12px; padding:4px; font-weight:bold; position:absolute; left:624px; top:145px; width:202px; height:50px; clip:rect(0px 202px 50px 0px); color:#ffffff; background-color:#849dbc; layer-background-color:#849dbc; z-index:20;">Links auf den Tisch stellst du den Käse.</div> <div id="test3" style="border: 1px solid #000000; font-family:verdana,arial,sans-serif; font-size:12px; padding:4px; font-weight:bold; position:absolute; left:624px; top:205px; width:202px; height:50px; clip:rect(0px 202px 50px 0px); color:#ffffff; background-color:#849dbc; layer-background-color:#849dbc; z-index:20;">Die Maus lehnt sich an das rechte Tischbein an.</div> <div id="test4" style="border: 1px solid #000000; font-family:verdana,arial,sans-serif; font-size:12px; padding:4px; font-weight:bold; position:absolute; left:624px; top:265px; width:202px; height:50px; clip:rect(0px 202px 50px 0px); color:#ffffff; background-color:#849dbc; layer-background-color:#849dbc; z-index:20;">Vor den Käse stellst du den Apfel.</div> <div id="test5" style="border: 1px solid #000000; font-family:verdana,arial,sans-serif; font-size:12px; padding:4px; font-weight:bold; position:absolute; left:624px; top:325px; width:202px; height:50px; clip:rect(0px 202px 50px 0px); color:#ffffff; background-color:#849dbc; layer-background-color:#849dbc; z-index:20;">Den Kuchen stellst du hinten auf den Tisch.</div> <div id="test6" style="border: 1px solid #000000; font-family:verdana,arial,sans-serif; font-size:12px; padding:4px; font-weight:bold; position:absolute; left:624px; top:385px; width:202px; height:50px; clip:rect(0px 202px 50px 0px); color:#ffffff; background-color:#849dbc; layer-background-color:#849dbc; z-index:20;">Die Tasse stellst du rechts neben den Kuchen.</div> <div id="test7" style="border: 1px solid #000000; font-family:verdana,arial,sans-serif; font-size:12px; padding:4px; font-weight:bold; position:absolute; left:624px; top:445px; width:202px; height:50px; clip:rect(0px 202px 50px 0px); color:#ffffff; background-color:#849dbc; layer-background-color:#849dbc; z-index:20;">Das Eis kommt in die Mitte<br>des Tisches.</div> <div id="test8" style="border: 1px solid #000000; font-family:verdana,arial,sans-serif; font-size:12px; padding:4px; font-weight:bold; position:absolute; left:624px; top:505px; width:202px; height:50px; clip:rect(0px 202px 50px 0px); color:#ffffff; background-color:#849dbc; layer-background-color:#849dbc; z-index:20;">Die Schuhe kommen auf den Boden vor den Tisch.</div> <div id="test9" style="border: 1px solid #000000; font-family:verdana,arial,sans-serif; font-size:12px; padding:4px; font-weight:bold; position:absolute; left:624px; top:565px; width:202px; height:50px; clip:rect(0px 202px 50px 0px); color:#ffffff; background-color:#849dbc; layer-background-color:#849dbc; z-index:20;">Die Kaffeekanne stelle bitte ganz vorne auf den Tisch.</div> <div id="navpanel_titel"> Tischlein deck' dich ! </div> <div id="navpanel_tab"> <table width="816" border="0" cellspacing="0" cellpadding="0" align="left" class="leer"> <tr align="center" valign="middle"> <td width="202" height="172" align="center" valign="middle"></td> <td width="202" height="172" align="center" valign="middle"></td> <td width="202" height="172" align="center" valign="middle"></td> <td width="202" height="172" align="center" valign="middle"></td> </tr> <tr align="center" valign="middle"> <td width="202" height="92" align="center" valign="middle"></td> <td width="202" height="92" align="center" valign="middle"></td> <td width="202" height="92" align="center" valign="middle"></td> <td width="202" height="92" align="center" valign="middle"></td> </tr> <tr align="center" valign="middle"> <td width="202" height="172" align="center" valign="middle"></td> <td width="202" height="172" align="center" valign="middle"></td> <td width="202" height="172" align="center" valign="middle"></td> <td width="202" height="172" align="center" valign="middle"></td> </tr> <tr align="center" valign="middle"> <td width="202" height="94" align="center" valign="middle"></td> <td width="202" height="94" align="center" valign="middle"></td> <td width="202" height="94" align="center" valign="middle"></td> <td width="202" height="94" align="center" valign="middle"></td> </tr> </table> </div> <div id="navpanel1"> <table width="665" height="32" border="0" cellpadding="3" cellspacing="0"> <tr> <form name="EbenenSpeicher" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="POST" onsubmit="this.positionen.value=positionenString;"> <input type="hidden" name="positionen" /> <input type="hidden" name="vis" /> <td width="300" align="right" style="font-size:13px; font-weight: bold; font-family: verdana, sans-serif; color:#fff;"> <a href="img/loesung_tischlein.jpg" target="nwin" onclick="nw(this.href,450,450,'nwin')" onFocus="if(this.blur)this.blur();"><img style="cursor:text !important" src="img/blind.gif" alt="" width="20" height="20" border="0" /></a> Dein Vorname: <input type="text" name="konstellation" maxlength="12" size="15" value="" /></td> <td valign="bottom" align="left"><input style="margin:0px; padding:0px; cursor:pointer;" title="Hier können Sie die Positionen Ihrer Bilder und Texte speichern" type="submit" name="senden" value="Positionen speichern" class="sub" /></td> </form> </tr> </table> </div> <div id="navpanel2"> <table height="34" border="0" cellpadding="4" cellspacing="0"><tr><td> <form name="EbenenMenu" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="POST"> <select name="liste" size="1" onchange="if(this.selectedIndex!=0) this.form.submit();"> <option>gespeicherte Resultate</option> <option>< - - - - - - - - - - - - - - - - - - ></option> <?php function date_mysql2german($datum) { if (ereg('[-]', $datum)) { list($jahr, $monat, $tag) = explode ("-", $datum); } else { $jahr = substr($datum, 0, 4); $monat = substr($datum, 4, 2); $tag = substr($datum, 6, 2); } return sprintf ('%02d.%02d.%04d', $tag, $monat, $jahr); } $sql = 'SELECT * FROM tischlein ORDER BY datum DESC'; $result = $mysqli->query($sql); $anzahl = $result->num_rows; while( $data = mysqli_fetch_array($result, MYSQLI_BOTH) ) { $sel = ''; if ($data['positionen'] == $_POST['liste']) { $sel = ' selected="selected"'; } echo '<option value="' . $data['positionen'] . '" ' . $sel . '>' . $data['name'] . ' | ' . date_mysql2german($data['datum']) . '</option>'; } /***** close result *****/ $result->close(); /***** close dbConnect *****/ $mysqli->close(); ?> </select> </form> </td></tr> </table> </div> <div id="navpanel0"> <table height="32" border="0" cellpadding="0" cellspacing="0"><tr><td> <a href="img/loesung_tischlein.jpg" target="nwin" onclick="nw(this.href,450,450,'nwin')" onFocus="if(this.blur)this.blur();"><img src="img/loesungen.gif" alt="" width="120" height="30" border="0" /></a> </td></tr></table> </div> <div id="navpanel_icon"> <img src="img/icon_help_winxp.gif" alt="" width="26" height="26" border="0" align="center" valign="middle" style="cursor:pointer !important;" /> </div> <div id="navpanel_leittext" onmouseover="alert('Leider deckt sich das Tischlein in den seltesten Fällen von allein. Darum musst du ein wenig nachhelfen! Bewege den Käse, die Maus, den Kuchen, den Apfel, den Kaffee und die Katze an die richtige Stelle. Was wohin gehört, kannst du in den blauen Text-Layers am rechten Bildrand lesen. Und nun.... frisch an die Arbeit.');"> Leittext </div> <div id="navpanel_link"> <a href="papamoll_ddrop.php">weiter</a> <img style="cursor:pointer !important;" src='img/back_turnable.gif' width='25' height='25' alt='nächste Übung' border='0' /> </div> </body> </html>