summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--registration-form.css39
-rw-r--r--registration-form.html94
-rw-r--r--registration-form.js59
3 files changed, 192 insertions, 0 deletions
diff --git a/registration-form.css b/registration-form.css
new file mode 100644
index 0000000..d0b13fc
--- /dev/null
+++ b/registration-form.css
@@ -0,0 +1,39 @@
+body {
+ background-color: whitesmoke;
+ color: darkslategray;
+}
+
+label {
+ width: 8em;
+ display: inline-block;
+ text-align: right;
+ vertical-align: top;
+}
+
+.required:after {
+ content: " *";
+ color: darkred;
+ vertical-align: top;
+}
+
+input[type=text] {
+ border: 0;
+}
+
+textarea {
+ border: 1px dashed slategray;
+ margin-top: 5px;
+ margin-bottom: 5px;
+}
+
+input[type=text], textarea {
+ border-bottom: 1px solid darkslateblue;
+ background-color: whitesmoke;
+ color: darkslateblue;
+
+ font-size: large;
+}
+
+.song-info, .member-info {
+ padding-left: 1em;
+} \ No newline at end of file
diff --git a/registration-form.html b/registration-form.html
new file mode 100644
index 0000000..1aeb2e5
--- /dev/null
+++ b/registration-form.html
@@ -0,0 +1,94 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <link rel="stylesheet" type="text/css" href="registration-form.css">
+ <script src="https://code.jquery.com/jquery-2.1.1.js"></script>
+ <script src="./registration-form.js"></script>
+ <meta charset="UTF-8">
+ <title>Norsk Urskog 2015 - Påmeldingsskjema for band</title>
+ </head>
+ <body>
+ <h1>Norsk Urskog 2015</h1>
+ <h2>Påmeldingsskjema for Band</h2>
+ <p>Felter merket med <span class="required"></span> er obligatoriske og må fylles ut.</p>
+ <form id="registration-form" action="mailto:haraldei@anduin.net">
+ <div id="form-general-info" class="fieldgroup">
+ <h3>Generell info:</h3>
+
+ <div class="field text required">
+ <label>Bandnavn:</label>
+ <input type="text" name="band[name]">
+ </div>
+
+ <div class="field text optional">
+ <label>Hjemsted:</label>
+ <input type="text" name="band[city]">
+ </div>
+
+ <div class="field text optional">
+ <label>Webside:</label>
+ <input type="text" name="band[website]">
+ </div>
+
+ <div class="field text optional">
+ <label>Plateselskap:</label>
+ <input type="text" name="band[label]">
+ </div>
+
+ <div class="field text required">
+ <label>Kort bio:</label>
+ <textarea cols="40" rows="5" name="band[shortbio]"></textarea>
+ </div>
+ </div>
+
+ <div id="form-contact-info" class="fieldgroup">
+ <h3>Kontaktperson</h3>
+ <div class="field text required">
+ <label>Navn:</label>
+ <input type="text" name="band[contact][name]">
+ </div>
+
+ <div class="field textarea required">
+ <label>Postadresse:</label>
+ <textarea cols="40" rows="4" name="band[contact][addr]"></textarea>
+ </div>
+
+ <div class="field text required">
+ <label>Tlf:</label>
+ <input type="text" name="band[contact][phone]">
+ </div>
+
+ <div class="field text required">
+ <label>E-post:</label>
+ <input type="text" name="band[contact][email]">
+ </div>
+ </div>
+
+ <div id="form-members" class="fieldgroup">
+ <h3>Medlemmer</h3>
+ <p>Klikk på knappen under for å legge til medlemmene som er med i bandet. Dette er kun til
+ informasjon for websider, promomateriale og lignende. Har bandmedlemene pseudonymer de
+ foretrekker å bruke, så kan du bruke dem her.</p>
+ </div>
+ <input type="button" name="add_member" value="Legg til medlem" id="add-member-button">
+
+ <div id="form-songs" class="fieldgroup">
+ <h3>Låter</h3>
+ <p>Klikk på knappen under for å legge til låten(e) dere vil ha med på samle-cden. Du kan oppgi
+ flere låter dersom du vil, men vi kan ikke garantere at vi tar med alle låtene på utgivelsen. Vær
+ nøye med å oppgi riktige navn (ingen pseudonymer) på utøvere og komponister, da vi sjekker dette
+ opp imot TONO/NCB for å sikre at evt. vederlag blir betalt riktig.</p>
+ </div>
+ <input type="button" name="add_song" value="Legg til låt" id="add-song-button">
+
+ <p>Ved å sende inn skjema, vil dere bli registrert for deltagelse på Norsk Urskog Metal Sampler 2015.
+ Vi vil sende utfylt skjema og kontrakt som må underskrives og sendes tilbake før vi kan ta med låten(e)
+ på selve CDen.</p>
+
+ <div id="form-action" class="action">
+ <input type="submit" value="Send skjema">
+ <input type="button" value="Nullstill skjema">
+ </div>
+ </form>
+ </body>
+</html>
diff --git a/registration-form.js b/registration-form.js
new file mode 100644
index 0000000..00e5486
--- /dev/null
+++ b/registration-form.js
@@ -0,0 +1,59 @@
+$(function() {
+ var num_members = 0;
+ var num_songs = 0;
+
+ $('#add-member-button').click(function() {
+ num_members += 1;
+ $('#form-members').append(
+ '<div class="member-info">' +
+ ' <h4>Medlem nr. '+num_members+'<input type="button" name="delete" data-member="'+num_members+'" class="delete-member-button" value="X"></h4>' +
+ ' <div class="field text required">' +
+ ' <label>Navn:</label>' +
+ ' <input type="text" name="band[members]['+num_members+'][name]">' +
+ ' </div>' +
+ ' <div class="field text optional">' +
+ ' <label>Instrument:</label>' +
+ ' <input type="text" name="band[members]['+num_members+'][instrument]">' +
+ ' </div>' +
+ ' <div class="field class optional">' +
+ ' <label>Alder:</label>' +
+ ' <input type="text" name="band[members]['+num_members+'][age]" size="3" pattern="[0-9]{1,2}">' +
+ ' </div>' +
+ '</div>'
+ )
+ });
+
+ $('#add-song-button').click(function() {
+ num_songs += 1;
+ $('#form-songs').append(
+ '<div class="song-info" id="song-'+num_songs+'-info">' +
+ ' <h4>Låt nr '+num_songs+'<input type="button" id="delete-song-'+num_songs+'" class="delete-song" value="X"></h4>' +
+ ' <div class="field text required">' +
+ ' <label>Tittel:</label>' +
+ ' <input type="text" name="song['+num_songs+'][title]">' +
+ ' </div>' +
+ ' <div class="field text optional">' +
+ ' <label>Lengde:</label>' +
+ ' <input type="text" pattern="[0-9]{2}:[0-9]{2}" title="Spilletid i min:sek (mm:ss)" name="song['+num_songs+'][time]" size="6">'+
+ ' </div>' +
+ ' <div class="field text optional">' +
+ ' <label>ISRC-kode:</label>' +
+ ' <input type="text" title="Dersom låten har vært utgitt før har den en ISRC-kode. Om du vet den så oppgi den her." name="song['+num_songs+'][isrc]" size="11">'+
+ ' </div>' +
+ ' <div class="field textarea required">' +
+ ' <label>Utøvere:</label>'+
+ ' <textarea cols="40" rows="5" name="song['+num_songs+'][performers]" title="Fullt navn (ingen pseudonymer) på alle som er med på denne innspillingen."></textarea>' +
+ ' </div>' +
+ ' <div class="field textarea required">' +
+ ' <label>Opphavsmenn:</label>'+
+ ' <textarea cols="40" rows="5" name="song['+num_songs+'][composers]" title="Fullt navn (ingen pseudonymer) på alle som har vært med på å skrive denne låten."></textarea>' +
+ ' </div>' +
+ ' <div class="field textarea optional">' +
+ ' <label>Andre merknader:</label>'+
+ ' <textarea cols="40" rows="5" name="song['+num_songs+'][notes]" title="Evt andre ting vi burde vite."></textarea>' +
+ ' </div>' +
+ '</div>'
+ )
+ });
+
+}); \ No newline at end of file
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-21 19:25:33 +0000