Basic signup for events

This commit is contained in:
2026-03-21 21:02:15 +01:00
parent 23af267896
commit b8341890d3
74 changed files with 4046 additions and 947 deletions

View File

@@ -0,0 +1,48 @@
import React from 'react';
import AmountSelectorContainer from "../components/amount-selector.jsx";
function AddonsContainer({ onStepClick, labels, event_data }) {
const handle_next_step = () => {
onStepClick(7);
}
return (
<p>
{event_data.registration_mode === 'solidarity' && (
<AmountSelectorContainer event_data={event_data} labels={labels} />
)}
{event_data.addons.length > 0 && (
<p>
<h3>{labels.addons.addons.available_addons}</h3>
<table>
{event_data.addons.map((addon, index) => (
<tr>
<td class="addon_checkbox">
<input type="checkbox"
name={"addons["+addon.id+"]"}
id={"addons_"+addon.id} />
</td>
<td class="addon_description">
<label for={"addons_"+addon.id}>
<span class="bold">{addon.name}</span><br />
<span class="small">{labels.common.amount}: {addon.amount}</span><br /><br />
{addon.description}<br /><br />
</label>
</td>
</tr>
))
}
</table>
</p>
)}
<input type="button" value={labels.common.go_back} onClick={() => onStepClick(5)} /> &nbsp;
<input type="button" value={labels.common.next} onClick= {() => handle_next_step()} />
</p>
);
}
export default AddonsContainer;

36
legacy/partials/age.jsx Normal file
View File

@@ -0,0 +1,36 @@
import React from 'react';
function AgeContainer({ onStepClick, labels, configuration }) {
return (
<div>
<div onClick={() => onStepClick(2)} className="solea_age_selector">
<div>
<h3>{labels.age.headline_children}</h3>
{labels.age.text_children}
</div>
<p className="solea_emblems_selection">
<img src={configuration.icon_children} class="solea_participant_icon" />
</p>
</div>
<div onClick={() => onStepClick(3)} className="solea_age_selector">
<div>
<h3>{labels.age.headline_adults}</h3>
{labels.age.text_adults}
</div>
<p className="solea_emblems_selection">
<img src={configuration.icon_adults} className="solea_participant_icon"/>
</p>
</div>
</div>
);
}
export default AgeContainer;

View File

@@ -0,0 +1,60 @@
import React from 'react';
import { ContactDataValidator } from '../../../../assets/javascripts/registration-validator.js'
function AllergiesContainer({ onStepClick, labels, event_data, participant_data }) {
const handle_next_step = () => {
onStepClick(9);
}
return (
<table>
<tr>
<td colSpan="2">
<h3>{labels.headlines.allergies}</h3>
</td>
</tr>
<tr>
<td>{labels.allergies.allergies}:</td>
<td><input defaultValue={participant_data.allergies} type="text" name="allergien" /></td>
</tr>
<tr>
<td>{labels.allergies.intolerances}:</td>
<td><input defaultValue={participant_data.intolerances} type="text" name="intolerances" /></td>
</tr>
<tr>
<td>{labels.allergies.medications}:</td>
<td>
<input defaultValue={participant_data.medications} type="text" name="medikamente" />*<br />
{labels.allergies.medications_hint}
</td>
</tr>
<tr>
<td>{labels.allergies.eating_habits.headline}:</td>
<td>
<select name="essgewohnheit">
<option value="vegetarian">{labels.allergies.eating_habits.vegetarian}</option>
<option value="vegan">{labels.allergies.eating_habits.vegan}</option>
{event_data.enable_all_eating && (
<option value="all">{labels.allergies.eating_habits.meat}</option>
)}
</select>
</td>
</tr>
<tr>
<td>{labels.allergies.notices}:</td>
<td><textarea rows="15" name="anmerkungen"></textarea></td>
</tr>
<tr>
<td colSpan="2">
<input type="button" value={labels.common.go_back} onClick={() => onStepClick(7)} /> &nbsp;
<input type="button" value={labels.common.next} onClick= {() => handle_next_step()} />
</td>
</tr>
</table>
);
}
export default AllergiesContainer;

View File

@@ -0,0 +1,65 @@
import React from 'react';
import { ArrivalDepratureValidator } from '../../../../assets/javascripts/registration-validator.js'
function ArrivalContainer({ onStepClick, labels, event_data }) {
const handle_next_step = () => {
if (ArrivalDepratureValidator(
new Date(event_data.date_begin),
new Date (event_data.date_end)
) ) {
if (event_data.addons.length > 0 || event_data.registration_mode === 'solidarity') {
onStepClick(6);
} else {
onStepClick(7);
}
}
}
return (
<table>
<tr>
<td colSpan="2">
<h3>{labels.headlines.arrival}</h3>
</td>
</tr>
<tr>
<td>{labels.arrival_data.arrival.headline}:</td>
<td>
<input type="date" name="anreise" id="anreise" defaultValue={event_data.date_begin} /><br />
<select name="anreise_essen">
<option Value="1" selected>{labels.arrival_data.arrival.before_dinner}</option>
<option value="2">{labels.arrival_data.arrival.before_lunch}</option>
<option value="3">{labels.arrival_data.arrival.before_breakfast}</option>
<option value="4">{labels.arrival_data.arrival.no_meal}</option>
</select>
</td>
</tr>
<tr>
<td>{labels.arrival_data.departure.headline}:</td>
<td>
<input type="date" name="abreise" id="abreise" defaultValue={event_data.date_end} /><br />
<select name="abreise_essen">
<option value="1">{labels.arrival_data.departure.after_breakfast}</option>
<option selected value="2">{labels.arrival_data.departure.after_lunch}</option>
<option value="3">{labels.arrival_data.departure.after_dinner}</option>
<option value="4">{labels.arrival_data.departure.no_meal}</option>
</select>
</td>
</tr>
<tr>
<td colSpan="2">
<input type="button" value={labels.common.go_back} onClick={() => onStepClick(4)} /> &nbsp;
<input type="button" value={labels.common.next} onClick= {() => handle_next_step()} />
</td>
</tr>
</table>
);
}
export default ArrivalContainer;

View File

@@ -0,0 +1,68 @@
import React from 'react';
import { ContactPersonValidator } from '../../../../assets/javascripts/registration-validator.js'
function ContactPersonContainer({ onStepClick, labels, participant_data }) {
const handle_next_step = () => {
if (ContactPersonValidator() ) {
onStepClick(3);
}
}
return (
<table>
<tr>
<td colSpan="2">
<h3>{labels.headlines.contactperson}</h3>
</td>
</tr>
<tr>
<td>{labels.common.lastname}, {labels.common.firstname}:</td>
<td><input type="text" name="ansprechpartner" id="ansprechpartner" /></td>
</tr>
<tr>
<td>{labels.common.telephone}:</td>
<td><input type="text" name="telefon_2" id="telefon_2" /></td>
</tr>
<tr>
<td>{labels.common.email}:</td>
<td><input type="text" name="email_2" id="email_2"/></td>
</tr>
<tr>
<td>{labels.swimming_permission.label}:</td>
<td>
<select name="badeerlaubnis" id={"swimming_permission"}>
<option value="-1">{labels.common.please_select}</option>
<option value="none">{labels.swimming_permission.none}</option>
<option value="partial">{labels.swimming_permission.partial}</option>
<option value="complete">{labels.swimming_permission.complete}</option>
</select>
</td>
</tr>
<tr>
<td>{labels.swimming_permission.first_aid_headline}:
</td>
<td>
<select id="first_aid" name="first_aid" required>
<option value="-1">{labels.common.please_select}</option>
<option value="1">{labels.swimming_permission.first_aid_yes}</option>
<option value="0">{labels.swimming_permission.first_aid_no}</option>
</select><br />
<label className="description">{labels.swimming_permission.first_aid_description}</label>
</td>
</tr>
<tr>
<td colSpan="2">
<input type="button" value={labels.common.next} onClick= {() => handle_next_step()} />
</td>
</tr>
</table>
);
}
export default ContactPersonContainer;

View File

@@ -0,0 +1,91 @@
import React from 'react';
import { ContactDataValidator } from '../../../../assets/javascripts/registration-validator.js'
function PersonalDataContainer({ onStepClick, labels, participant_data, local_groups }) {
const handle_next_step = () => {
if (ContactDataValidator()) {
onStepClick(4);
}
}
return (
<table>
<tr>
<td colSpan="2">
<h3>{labels.headlines.personaldata}</h3>
</td>
</tr>
<tr>
<td>{labels.common.firstname};</td>
<td><input defaultValue={participant_data.firstname} type="text" name="vorname" id="vorname" /></td>
</tr>
<tr>
<td>{labels.common.lastname}:</td>
<td><input defaultValue={participant_data.lastname} type="text" name="nachname" id="nachname" /></td>
</tr>
<tr>
<td>{labels.common.nickname}</td>
<td><input defaultValue={participant_data.nickname} type="text" name="pfadiname" id="pfadiname" /></td>
</tr>
<tr>
<td>{labels.common.localgroup}</td>
<td>
<select id="localgroup" name="localgroup" required placeholder="<?php echo esc_html__( 'Please select', 'solea' ); ?>">
<option value="-1">{labels.common.please_select}</option>
{local_groups.map((local_group, index) => (
<option
value={local_group.id}
selected={participant_data.localgroup == local_group.id}
>{local_group.name}
</option>
))
}
</select>
</td>
</tr>
<tr>
<td>{labels.common.birthday}:</td>
<td><input defaultValue={participant_data.birthday} type="date" name="geburtsdatum" id="geburtsdatum" /></td>
</tr>
<tr>
<td>{labels.common.street}, {labels.common.housenumber}:</td>
<td>
<input type="text" defaultValue={participant_data.street} name="strasse" id="strasse" />
<input type="text" defaultValue={participant_data.number} name="hausnummer" id="hausnummer" />
</td>
</tr>
<tr>
<td>
{labels.common.postal_code}, {labels.common.city}:</td>
<td>
<input type="text" defaultValue={participant_data.zip} name="plz" id="plz" />
<input type="text" defaultValue={participant_data.city} name="ort" id="ort" />
</td>
</tr>
<tr>
<td>{labels.common.telephone}:</td>
<td><input defaultValue={participant_data.phone} type="text" name="telefon_1" id="telefon_1" /></td>
</tr>
<tr>
<td>{labels.common.email}:</td>
<td><input defaultValue={participant_data.email} type="text" name="email_1" id="email_1" /></td>
</tr>
<tr>
<td colSpan="2">
<input type="button" value={labels.common.next} onClick= {() => handle_next_step()} />
</td>
</tr>
</table>
);
}
export default PersonalDataContainer;

View File

@@ -0,0 +1,77 @@
import React from 'react';
function PhotopermissionsContainer({ onStepClick, labels, event_data }) {
const accept_all_permissions = () => {
document.getElementById( 'foto_socialmedia' ).checked = true;
document.getElementById( 'foto_print' ).checked = true;
document.getElementById( 'foto_webseite' ).checked = true;
document.getElementById( 'foto_partner' ).checked = true;
document.getElementById( 'foto_intern' ).checked = true;
handle_next_step();
}
const handle_next_step = () => {
onStepClick(8);
}
const handle_previous_step = () => {
if (event_data.addons.length > 0 || event_data.registration_mode === 'solidarity') {
onStepClick(6);
} else {
onStepClick(5);
}
}
return (
<div>
<p class="phptopermission_container">
<h3>{labels.photopermissions.headline}</h3>
</p>
<p>
<input type="checkbox" name="foto[socialmedia]" value="active" id="foto_socialmedia"/>
<label
htmlFor="foto_socialmedia">{labels.photopermissions.socialmedia}
</label><br/>
</p>
<p>
<input type="checkbox" name="foto[print]" value="active" id="foto_print"/>
<label
htmlFor="foto_print">{labels.photopermissions.printmedia}
</label><br/>
</p>
<p>
<input type="checkbox" name="foto[webseite]" value="active" id="foto_webseite"/>
<label
htmlFor="foto_webseite">{labels.photopermissions.websites}
</label><br/>
</p>
<p>
<input type="checkbox" name="foto[partner]" value="active" id="foto_partner"/>
<label
htmlFor="foto_partner">{labels.photopermissions.partners}
</label><br/>
</p>
<p>
<input type="checkbox" name="foto[intern]" value="active" id="foto_intern"/>
<label
htmlFor="foto_intern">{labels.photopermissions.internalpurpose}
</label><br/>
</p>
<input class="acceptallbutton" type="button"
value={labels.photopermissions.acceptall}
onClick={() => accept_all_permissions()}
/>
<input type="button" value={labels.common.go_back} onClick={() => handle_previous_step()} /> &nbsp;
<input type="button" value={labels.common.next} onClick= {() => handle_next_step()} />
</div>
);
}
export default PhotopermissionsContainer;

View File

@@ -0,0 +1,51 @@
import React from 'react';
import { ContactDataValidator } from '../../../../assets/javascripts/registration-validator.js'
function GroupBasedRegistrationContainer({ onStepClick, labels, participant_data, local_groups, event_data }) {
const handle_next_step = () => {
onStepClick(5);
}
return (
<table>
<input defaultChecked={"checked"} type="radio" name="beitrag" value="regular" id="amount_regular" hidden />
<tr>
<td colSpan="2"><h3>{labels.registration_mode.group_based.headline}:</h3></td>
</tr>
{event_data.possible_participation_groups.map((participation_group, index) => (
<tr>
<td colSpan="2" >
<input type="radio"
defaultChecked={'participant' === participation_group.name}
name="participant_group"
value={participation_group.name}
id={participation_group.name} />
<label for={participation_group.name}>
{participation_group.name_readable}
{participation_group.description !== '' && (
<span><br /><span class="solea-group-info-text">{participation_group.description}</span><br /><br /></span>
)}
</label>
</td>
</tr>
))
}
<tr>
<td colSpan="2">
<input type="button" value={labels.common.go_back} onClick={() => onStepClick(3)} /> &nbsp;
<input type="button" value={labels.common.next} onClick= {() => handle_next_step()} />
</td>
</tr>
</table>
);
}
export default GroupBasedRegistrationContainer;

View File

@@ -0,0 +1,47 @@
import React from 'react';
import { ContactDataValidator } from '../../../../assets/javascripts/registration-validator.js'
function SolidarityRegistrationContainer({ onStepClick, labels, participant_data, local_groups, event_data }) {
const handle_next_step = () => {
onStepClick(5);
}
return (
<table>
<tr>
<td colSpan="2">
<h3>{labels.headlines.solidarity_headline}</h3>
</td>
</tr>
<tr>
<td>{labels.registration_mode.solidarity.headline}...</td>
<td>
{event_data.possible_participation_groups.map((participation_group, index) => (
<span>
<input
class="registratration_mode_solidatory_checkbox"
type="radio"
name="participant_group"
value="team"
defaultChecked={'participant' === participation_group.name}
id={participation_group.name}
/>
<label for={participation_group.name}>...{participation_group.description}</label><br/>
</span>
))
}
</td>
</tr>
<tr>
<td colSpan="2">
<input type="button" value={labels.common.go_back} onClick={() => onStepClick(3)} /> &nbsp;
<input type="button" value={labels.common.next} onClick={() => handle_next_step()}/>
</td>
</tr>
</table>
);
}
export default SolidarityRegistrationContainer;

View File

@@ -0,0 +1,75 @@
import React from 'react';
import { ContactDataValidator } from '../../../../assets/javascripts/registration-validator.js'
function SummaryContainer({ onStepClick, labels, participant_data, local_groups }) {
const handle_next_step = () => {
onStepClick(4);
if (ContactDataValidator()) {
onStepClick(4);
}
}
return (
<table>
<tr>
<td colSpan="2">
<h3>{labels.headlines.summary}</h3>
</td>
</tr>
<tr>
<td>{labels.summary.event_name}:</td>
<td><span id="summary_eventname" /></td>
</tr>
<tr>
<td>{labels.summary.arrival}</td>
<td><span id="summary_arrival" /></td>
</tr>
<tr>
<td>{labels.summary.departure}:</td>
<td><span id="summary_departure" /></td>
</tr>
<tr><td colSpan="2"><br /><br /></td></tr>
<tr>
<td colSpan="2">
<input type="checkbox" id="summary_information_correct"/>
<label htmlFor="summary_information_correct" id="summary_information_correct_label">
{labels.summary.information_correct}
</label>
</td>
</tr>
<tr>
<td colSpan="2">
<input type="checkbox" id="summary_accept_terms"/>
<label htmlFor="summary_accept_terms" id="summary_accept_terms_label">
{labels.summary.accept_terms}
</label>
</td>
</tr>
<tr>
<td colSpan="2">
<input type="checkbox" id="legal_accepted"/>
<label htmlFor="legal_accepted" id="legal_accepted_label">
{labels.summary.legal_acceptance}
</label>
</td>
</tr>
<tr>
<td colSpan="2">
<input type="checkbox" id="payment"/>
<label htmlFor="payment" id="payment_label">
{labels.summary.amount_text_1} <span class="bold" id="payment_information_label"></span> {labels.summary.amount_text_2}
</label>
</td>
</tr>
</table>
);
}
export default SummaryContainer;