Skip to content

Commit

Permalink
Merge pull request #59 from TimRepke/redesign-form
Browse files Browse the repository at this point in the history
Neudesign des Anmeldeformulars
  • Loading branch information
0x17de authored Oct 25, 2016
2 parents 0d941fb + 7231e00 commit a4fa2dc
Show file tree
Hide file tree
Showing 3 changed files with 117 additions and 93 deletions.
92 changes: 54 additions & 38 deletions registration-system/view/signups/form/index.php
Original file line number Diff line number Diff line change
Expand Up @@ -55,48 +55,57 @@ public function showInlineHTML() {

$link_params = $this->getFormSubmitBaseParams();

echo '<div style="margin: 0 auto;width: 702px;">';
if ($waitlist_mode)
echo '<h1 style="color: red;">Warteliste</h1>
<p>Eintragen und hoffen...</p>';
else
echo '<h1>Anmeldeformular</h1>
<p>Bitte hier verbindlich anmelden.</p>';
echo '</div>';


echo '<div id="stylized" class="myform">
<form id="form" name="form" method="post" action="index.php' . $link_params . '">';

$this->show_formular_helper_hidden_input('signupstats', (isset($bachelorData['signupstats']) ? $bachelorData['signupstats'] : null));

$this->show_formular_helper_input('Vorname', 'forname', $bachelorData['forname'], '');
$this->show_formular_helper_input('Nachname', 'sirname', $bachelorData['sirname'], '');
$this->show_formular_helper_input('Anzeigename', 'pseudo', $bachelorData['pseudo'], '');
echo $soft_prot->add(array('forname', 'sirname', 'pseudo'), $this->environment->config['invalidChars'])->write();
$this->show_formular_helper_input('E-Mail-Adresse', 'mehl', $bachelorData['mehl'], 'regelmäßig lesen!');
$this->show_formular_helper_sel('Du bist', 'studityp', $this->environment->oconfig['studitypen'], $bachelorData['studityp'], '');
$this->show_formular_helper_sel('Alter 18+?', 'virgin', ['UNSET' => '', 'JA' => 'Ja', 'NEIN' => 'Nein'],
isset($bachelorData['virgin']) ? ($bachelorData['virgin'] == 0 ? 'JA' : 'NEIN') : 'UNSET', 'Bist du älter als 18 Jahre?');
$this->show_formular_helper_sel('Essenswunsch', 'essen', $this->environment->oconfig['essen'], $bachelorData['essen'], 'Info für den Koch.');
$this->show_formular_helper_sel2('Anreise', 'anday', array_slice($possible_dates, 0, -1), $bachelorData['anday'],
'antyp', $this->environment->oconfig['reisearten'], $bachelorData['antyp'], '');
$this->show_formular_helper_sel2('Abreise', 'abday', array_slice($possible_dates, 1), $bachelorData['abday'],
'abtyp', $this->environment->oconfig['reisearten'], $bachelorData['abtyp'], '');

echo '<label>Anmerkung</label>
$this->show_formular_helper_input('Vorname', 'forname', $bachelorData['forname'], '', 'width:47%; float:left;');
$this->show_formular_helper_input('Nachname', 'sirname', $bachelorData['sirname'], '', 'width:47%; float:right;');
echo '<div style="clear:both"></div>';
$this->show_formular_helper_input('Anzeigename', 'pseudo', $bachelorData['pseudo'], '', 'width:47%; float:left;');
$this->show_formular_helper_input('E-Mail-Adresse', 'mehl', $bachelorData['mehl'], 'regelmäßig lesen!', 'width:47%; float:right;');
echo '<div style="clear:both"></div>';
$this->show_formular_helper_sel("Du bist", "studityp", $this->environment->oconfig['studitypen'], $bachelorData["studityp"],
"", 'width:47%; float:left;');
$this->show_formular_helper_sel("Alter 18+?", "virgin", ['UNSET'=>'', 'JA'=>'Ja', 'NEIN' => 'Nein'],
isset($bachelorData['virgin']) ? ($bachelorData['virgin'] == 0 ? "JA" : "NEIN") : 'UNSET',
"Bist du älter als 18 Jahre?", 'width:47%; float:right;margin-right:-6px;');
echo '<div style="clear:both;"></div>';
$this->show_formular_helper_sel("Essenswunsch", "essen", $this->environment->oconfig['essen'], $bachelorData["essen"],
"Info für den Koch.", 'width:47%; float:left;');
echo '<div style="clear:both;"></div>';
$this->show_formular_helper_sel2("Anreise", "anday", array_slice($possible_dates, 0, -1), $bachelorData["anday"],
"antyp", $this->environment->oconfig['reisearten'], $bachelorData["antyp"], "",'width:47%; float:left;');
$this->show_formular_helper_sel2("Abreise", "abday", array_slice($possible_dates, 1), $bachelorData["abday"],
"abtyp", $this->environment->oconfig['reisearten'], $bachelorData["abtyp"], "",'width:47%; float:right;margin-right:-6px;');
echo '<div style="clear:both;"></div>
<label>Anmerkung</label>
<textarea id="comment" name ="comment" rows="3" cols="50">' . $bachelorData["comment"] . '</textarea>
<input type="checkbox" name="public" value="public" style="width:40px"><span style="float:left">Anmeldung verstecken</span><br/>
<div style="clear:both">
<input type="checkbox" name="disclaimer" value="disclaimer" style="width:40px"><span style="float:left">
<a style="text-decoration:underline;" target="_blank" href="'.$fahrt->get('disclaimlink').'">Disclaimer</a> gelesen und akzeptiert</span><br/>
<input type="checkbox" name="public" value="public" style="width:40px" /><span>Anmeldung verstecken</span><br/>
<input type="checkbox" name="disclaimer" value="disclaimer" style="width:40px" />
<span><a style="text-decoration:underline;" target="_blank" href="'.$fahrt->get('disclaimlink').'">Disclaimer</a> gelesen und akzeptiert</span><br/>
<div style="clear:both"></div>';

$this->show_formular_helper_input("Captcha eingeben", "captcha", "", "");
echo '<img src="view/captcha.php" /><br/>
$this->show_formular_helper_input("Captcha eingeben", "captcha", "", "",'width:45%; float:left;');
echo '<img src="view/captcha.php" style="float:right; width: 45%;" />
<div style="clear:both"></div>
<button type="submit" name="submit" id="submit" value="submit">Anmelden!</button>
<div class="spacer"></div>';

echo '</form>
</form>
</div>';


echo $soft_prot->add(array('forname', 'sirname', 'pseudo'), $this->environment->config['invalidChars'])->write();
}

/**
Expand All @@ -107,9 +116,12 @@ public function showInlineHTML() {
* @param $values
* @param $selected
* @param $subtext
* @param $style
*/
private function show_formular_helper_sel($name, $id, $values, $selected, $subtext) {
echo '<label>' . $name . '
private function show_formular_helper_sel($name, $id, $values, $selected, $subtext, $style = null) {
$style = (empty($style) ? '' : 'style="'.$style.'"');

echo '<div class="fieldbox" '.$style.'><label>' . $name . '
<span class="small">' . $subtext . '</span>
</label>
<select name="' . $id . '" id="' . $id . '">';
Expand All @@ -118,7 +130,7 @@ private function show_formular_helper_sel($name, $id, $values, $selected, $subte
if ($val == $selected) echo ' selected';
echo '>' . $show . '</option>';
}
echo '</select>';
echo '</select></div>';
}

/**
Expand All @@ -132,31 +144,35 @@ private function show_formular_helper_sel($name, $id, $values, $selected, $subte
* @param $values2
* @param $selected2
* @param $subtext
* @param $style
*/
private function show_formular_helper_sel2($name, $id, $values, $selected, $id2, $values2, $selected2, $subtext) {
echo '<label style="text-align:left">' . $name . '
private function show_formular_helper_sel2($name, $id, $values, $selected, $id2, $values2, $selected2, $subtext, $style = null) {
$style = (empty($style) ? '' : 'style="'.$style.'"');

echo '<div class="fieldbox" '.$style.'><label style="text-align:left">' . $name . '
<span class="small">' . $subtext . '</span>
</label><table style="float:left"><tr><td>
<select name="' . $id . '" id="' . $id . '" style="width:110px; text-align: center">';
</label>
<select style="margin-bottom:0" name="' . $id . '" id="' . $id . '">';
foreach ($values as $val) {
echo '<option value="' . $val . '"';
if ($val == $selected) echo ' selected';
echo '>' . $val . '</option>';
}
echo '</select></td><td><select name="' . $id2 . '" id="' . $id2 . '">';
echo '</select><select name="' . $id2 . '" id="' . $id2 . '">';
foreach ($values2 as $val => $show) {
echo '<option value="' . $val . '"';
if ($val == $selected2) echo ' selected';
echo '>' . $show . '</option>';
}
echo '</select></td></tr></table>';
echo '</select></div>';
}

private function show_formular_helper_input($name, $id, $value, $subtext) {
echo '<label>' . $name . '
private function show_formular_helper_input($name, $id, $value, $subtext, $style=null) {
$style = (empty($style) ? '' : 'style="'.$style.'"');
echo '<div class="fieldbox" '.$style.'><label for="'.$id.'">' . $name . '
<span class="small">' . $subtext . '</span>
</label>
<input type="text" name="' . $id . '" id="' . $id . '" value="' . $value . '" />';
</label><br />
<input type="text" name="' . $id . '" id="' . $id . '" value="' . $value . '" /></div>';
}

private function show_formular_helper_hidden_input($id, $value) {
Expand Down
117 changes: 63 additions & 54 deletions registration-system/view/signups/form/style.css
Original file line number Diff line number Diff line change
@@ -1,61 +1,70 @@
/* ----------- My Form ----------- */
.myform{
margin:0 auto;
width:400px;
padding:14px;
.myform {
margin: 0 auto;
width: 600px;
padding: 14px;
}

/* ----------- stylized ----------- */
#stylized{
border:solid 2px #b7ddf2;
background:#ebf4fb;
#stylized {
border: 1px solid #b7ddf2;
padding: 30px 50px;
}

#stylized h1 {
font-size:1.5em;

color:black;
font-weight:bold;
margin-bottom:8px;
}
#stylized p{
font-size:11px;
color:#666666;
margin-bottom:20px;
border-bottom:solid 1px #b7ddf2;
padding-bottom:10px;
}
#stylized label{
display:block;
font-weight:bold;
text-align:right;
width:140px;
float:left;
}
#stylized .small{
color:#666666;
display:block;
font-size:11px;
font-weight:normal;
text-align:right;
width:140px;
}
#stylized input, #stylized select, #stylized textarea{
float:left;
font-size:12px;
padding:4px 2px;
border:solid 1px #aacfe4;
width:200px;
margin:2px 0 20px 10px;
}
#stylized button{
clear:both;
margin-left:150px;
width:125px;
height:31px;
background:#666666;
text-align:center;
line-height:31px;
color:#FFFFFF;
font-size:11px;
font-weight:bold;
font-size: 1.5em;
color: black;
font-weight: bold;
margin-bottom: 8px;
}

#stylized p {
font-size: 11px;
color: #666666;
margin-bottom: 20px;
border-bottom: 1px solid #b7ddf2;
padding-bottom: 10px;
}

#stylized label {
font-weight: bold;
text-align: left;
width: 140px;
}

#stylized .small {
color: #666666;
font-size: 11px;
font-weight: normal;
text-align: right;
width: 140px;
}

#stylized input, #stylized select, #stylized textarea {
font-size: 13px;
padding: 10px 0 10px 5px;
border: 1px solid #aacfe4;
width: 100%;
margin: 5px 0 20px 0;
background-color: inherit;
}

#stylized button {
display: block;
margin: 50px auto 10px auto;
width: 250px;
height: 50px;
background: #da4cad;
text-align: center;
line-height: 31px;
color: #0912bc;
font-size: 15px;
font-weight: bold;
border: 3px solid #39ff00;
cursor: pointer;
}

#stylized .fieldbox {
width: 100%;
margin: 0 auto;
}
1 change: 0 additions & 1 deletion registration-system/view/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@ Neon Purple: #993CF3
body {
background: #cfdee7;
font-family: sans-serif;
text-align: justify;
font-size: 1em;
}

Expand Down

0 comments on commit a4fa2dc

Please sign in to comment.