summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--public/regform.js14
-rw-r--r--public/styles.css20
-rw-r--r--views/index.erb17
-rw-r--r--views/song.erb9
4 files changed, 40 insertions, 20 deletions
diff --git a/public/regform.js b/public/regform.js
new file mode 100644
index 0000000..bcea7fa
--- /dev/null
+++ b/public/regform.js
@@ -0,0 +1,14 @@
+document.addEventListener("DOMContentLoaded", function() {
+ for (let details of document.getElementsByClassName('song-details')) {
+ details.classList.add('collapsed');
+ };
+
+ for (let toggler of document.getElementsByClassName('add-song-button')) {
+ toggler.onclick = function() {
+ this.style.display = "none";
+ let n = toggler.dataset.songNumber;
+ let details = document.getElementById('song-' + n + '-details');
+ details.classList.remove('collapsed');
+ }
+ };
+});
diff --git a/public/styles.css b/public/styles.css
index a236448..3c41e64 100644
--- a/public/styles.css
+++ b/public/styles.css
@@ -107,23 +107,13 @@ input[type=text], textarea {
font-size: small;
}
-.delete-member-button,
-.delete-song {
- background-color: #a00;
- color: white;
- border: 1px dotted #800;
- border-radius: 5px;
-}
-
-#add-member-button,
-#add-song-button {
- background-color: #0a0;
- border: 1px dotted #080;
- border-radius: 5px;
+.add-song-button {
+ margin-left: 5mm;
}
.song-info, .member-info {
padding-left: 1em;
+ margin-top: 0.5em;
}
.error {
@@ -136,3 +126,7 @@ input[type=text], textarea {
font-size: 110%;
color: whitesmoke;
}
+
+.collapsed {
+ display: none;
+}
diff --git a/views/index.erb b/views/index.erb
index bbd5bb5..7d069a1 100644
--- a/views/index.erb
+++ b/views/index.erb
@@ -91,17 +91,24 @@
<div id="form-songs" class="fieldgroup">
<h3>Låter</h3>
+ <p>Dere kan registrere intill tre låter. Dersom dere vil registrere færre enn
+ tre låter, så er det bare å ikke fylle ut de resterene skjemaene. Klikk på
+ knappene nedenfor for å legge til informasjon om låtene dere vil ha med.</p>
+
<% @band.songs.each_index do |i| %>
<%= erb :song, layout: false, locals: { song_number: i + 1, song: @band.songs[i] } %>
<% end %>
</div>
- <p>Ved å sende inn skjema, vil dere bli registrert for deltagelse på Norsk Urskog Metal Sampler 2019.
- 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 class="fieldgroup">
+ <h3>Innsending</h3>
+
+ <p>Ved å sende inn skjemaet, vil dere bli registrert for deltagelse på Norsk Urskog
+ Metal Sampler 2019. 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>
<div id="form-action" class="action">
- <input type="submit" value="Send skjema">
- <input type="button" value="Nullstill skjema">
+ <button type="submit">Send skjema</button>
</div>
</form>
diff --git a/views/song.erb b/views/song.erb
index 56848d8..55cf921 100644
--- a/views/song.erb
+++ b/views/song.erb
@@ -1,6 +1,11 @@
<div class="song-info" id="song-<%= song_number %>-info">
- <label>Låt nr. <%= song_number %></label>
- <div class="song-details">
+ <label>
+ Låt nr. <%= song_number %>
+ <button type="button" class="add-song-button" data-song-number="<%= song_number %>">
+ Legg til...
+ </button>
+ </label>
+ <div class="song-details" id="song-<%= song_number %>-details">
<div class="field text required">
<label for="band-song-<%= song_number %>-title">Låttittel:</label>
<input type="text" id="band-song-<%= song_number %>-title"