From 08e71721514a8fad599832c4846b1cfb45b0f12c Mon Sep 17 00:00:00 2001
From: Harald Eilertsen <haraldei@anduin.net>
Date: Sat, 3 Oct 2015 12:35:48 +0200
Subject: Transform to a Sinatra app

---
 .rspec                    |  3 ++
 Gemfile                   |  5 +++
 Gemfile.lock              | 38 +++++++++++++++++++
 config.ru                 |  2 +
 public/regform.js         | 59 +++++++++++++++++++++++++++++
 public/styles.css         | 39 ++++++++++++++++++++
 registration-form.css     | 39 --------------------
 registration-form.html    | 94 -----------------------------------------------
 registration-form.js      | 59 -----------------------------
 registration.rb           | 10 +++++
 spec/registration_spec.rb | 14 +++++++
 spec/spec_helper.rb       |  3 ++
 views/index.erb           | 94 +++++++++++++++++++++++++++++++++++++++++++++++
 13 files changed, 267 insertions(+), 192 deletions(-)
 create mode 100644 .rspec
 create mode 100644 Gemfile
 create mode 100644 Gemfile.lock
 create mode 100644 config.ru
 create mode 100644 public/regform.js
 create mode 100644 public/styles.css
 delete mode 100644 registration-form.css
 delete mode 100644 registration-form.html
 delete mode 100644 registration-form.js
 create mode 100644 registration.rb
 create mode 100644 spec/registration_spec.rb
 create mode 100644 spec/spec_helper.rb
 create mode 100644 views/index.erb

diff --git a/.rspec b/.rspec
new file mode 100644
index 0000000..43ae203
--- /dev/null
+++ b/.rspec
@@ -0,0 +1,3 @@
+--color
+--require spec_helper
+--format documentation
diff --git a/Gemfile b/Gemfile
new file mode 100644
index 0000000..5ec35cb
--- /dev/null
+++ b/Gemfile
@@ -0,0 +1,5 @@
+source "https://rubygems.org"
+
+gem "sinatra"
+gem "rspec"
+gem "rack-test"
diff --git a/Gemfile.lock b/Gemfile.lock
new file mode 100644
index 0000000..cc8a85b
--- /dev/null
+++ b/Gemfile.lock
@@ -0,0 +1,38 @@
+GEM
+  remote: https://rubygems.org/
+  specs:
+    diff-lcs (1.2.5)
+    rack (1.6.4)
+    rack-protection (1.5.3)
+      rack
+    rack-test (0.6.3)
+      rack (>= 1.0)
+    rspec (3.3.0)
+      rspec-core (~> 3.3.0)
+      rspec-expectations (~> 3.3.0)
+      rspec-mocks (~> 3.3.0)
+    rspec-core (3.3.2)
+      rspec-support (~> 3.3.0)
+    rspec-expectations (3.3.1)
+      diff-lcs (>= 1.2.0, < 2.0)
+      rspec-support (~> 3.3.0)
+    rspec-mocks (3.3.2)
+      diff-lcs (>= 1.2.0, < 2.0)
+      rspec-support (~> 3.3.0)
+    rspec-support (3.3.0)
+    sinatra (1.4.6)
+      rack (~> 1.4)
+      rack-protection (~> 1.4)
+      tilt (>= 1.3, < 3)
+    tilt (2.0.1)
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  rack-test
+  rspec
+  sinatra
+
+BUNDLED WITH
+   1.10.6
diff --git a/config.ru b/config.ru
new file mode 100644
index 0000000..897dd21
--- /dev/null
+++ b/config.ru
@@ -0,0 +1,2 @@
+require './registration.rb'
+run RegistrationApp
diff --git a/public/regform.js b/public/regform.js
new file mode 100644
index 0000000..00e5486
--- /dev/null
+++ b/public/regform.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
diff --git a/public/styles.css b/public/styles.css
new file mode 100644
index 0000000..d0b13fc
--- /dev/null
+++ b/public/styles.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.css b/registration-form.css
deleted file mode 100644
index d0b13fc..0000000
--- a/registration-form.css
+++ /dev/null
@@ -1,39 +0,0 @@
-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
deleted file mode 100644
index 1aeb2e5..0000000
--- a/registration-form.html
+++ /dev/null
@@ -1,94 +0,0 @@
-<!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
deleted file mode 100644
index 00e5486..0000000
--- a/registration-form.js
+++ /dev/null
@@ -1,59 +0,0 @@
-$(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
diff --git a/registration.rb b/registration.rb
new file mode 100644
index 0000000..de9ec75
--- /dev/null
+++ b/registration.rb
@@ -0,0 +1,10 @@
+require 'sinatra/base'
+
+class RegistrationApp < Sinatra::Base
+
+  get '/' do
+    erb :index
+  end
+
+  run! if app_file == $0
+end
diff --git a/spec/registration_spec.rb b/spec/registration_spec.rb
new file mode 100644
index 0000000..1f89321
--- /dev/null
+++ b/spec/registration_spec.rb
@@ -0,0 +1,14 @@
+describe RegistrationApp do
+  include Rack::Test::Methods
+
+  def app
+    RegistrationApp
+  end
+
+  describe 'GET index' do
+    it 'displays the registration form' do
+      get '/'
+      expect(last_response).to be_ok
+    end
+  end
+end
diff --git a/spec/spec_helper.rb b/spec/spec_helper.rb
new file mode 100644
index 0000000..c7171e6
--- /dev/null
+++ b/spec/spec_helper.rb
@@ -0,0 +1,3 @@
+require_relative '../registration'
+require 'rspec'
+require 'rack/test'
diff --git a/views/index.erb b/views/index.erb
new file mode 100644
index 0000000..1aeb2e5
--- /dev/null
+++ b/views/index.erb
@@ -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>
-- 
cgit v1.2.3