changeset 197:8f352063f277

Finish first version of newly tarted up website.
author Jim Hague <jim.hague@acm.org>
date Sun, 17 Feb 2013 00:27:07 +0000
parents 5b4c478142e1
children 377f5b10f2e8
files dottes.html.footer dottes.html.header dottes.html.tune dottes.html.tuneindex makeAll.sh makeCello.sh makeWeb.sh makeWebItems.sh web/css/dottes.css
diffstat 9 files changed, 145 insertions(+), 40 deletions(-) [+]
line wrap: on
line diff
--- a/dottes.html.footer	Sat Feb 16 23:23:50 2013 +0000
+++ b/dottes.html.footer	Sun Feb 17 00:27:07 2013 +0000
@@ -1,3 +1,4 @@
 </table>
+</div>
 </body>
 </html>
--- a/dottes.html.header	Sat Feb 16 23:23:50 2013 +0000
+++ b/dottes.html.header	Sun Feb 17 00:27:07 2013 +0000
@@ -1,23 +1,44 @@
-<html>
+<!DOCTYPE html>
+<html lang="en">
 <head>
-<title>Cry Havoc tunes - @BOOK@</title>
+  <meta charset="utf-8" />
+  <title>Cry Havoc tunes - @TITLE@</title>
+  <link rel="stylesheet" href="../css/reset.css" />
+  <link rel="stylesheet" href="../css/text.css" />
+  <link rel="stylesheet" href="../css/960.css" />
+  <link rel="stylesheet" href="../css/dottes.css" />
+
+  <link href='http://fonts.googleapis.com/css?family=Pirata+One|Oswald'
+        rel='stylesheet' type='text/css'>
 </head>
 <body>
-<h1>@SUBTITLE@</h1>
-<p>
-@INTRO@
-<p>
-You can download a PDF with a booklet of these tunes. There is an
-<a href="@BOOK@-A5.pdf">A5 landscape book</a> with one
-tune per page, or an <a href="@BOOK@-A4.pdf">A4 book</a> with two or
-more tunes per page.
-<p>
-If you have a printer that can do duplex (i.e. print on both sides of the
-paper), you might like the
-<a href="@BOOK@-A5bookletA4.pdf">A5 booklet</a>.
-Print this onto A4 paper using both sides of the paper, and fold in half
-to make an A5 booklet.
-<p>
-Issue @BUILD@
-<p>
-<table>
+  <div class="container_12">
+    <a href="/">
+      <div class="grid_12 header-strip banner">
+        <h1>Ye Crie Havock Booke of Dottes</h1>
+      </div>
+    </a>
+
+    <div class="clear"></div>
+
+    <div class="grid_12 dottes-body">
+      <h1>@SUBTITLE@</h1>
+      <p>@INTRO@
+      <p>You can download a PDF with a booklet of these tunes. There is an
+        <a href="@BOOK@-A5.pdf">A5 landscape book</a> with one
+        tune per page, or an <a href="@BOOK@-A4.pdf">A4 book</a> with two or
+        more tunes per page.
+      <p>If you have a printer that can do duplex (i.e. print on both sides
+        of the paper), you might like the
+        <a href="@BOOK@-A5bookletA4.pdf">A5 booklet</a>.
+        Print this onto A4 paper using both sides of the paper, and fold in half
+        to make an A5 booklet.
+      <p>When changes to this site are made, the issue number is incremented.
+        This is issue @BUILD@.
+    </div>
+
+    <div class="clear"></div>
+
+    <div class="grid_12 dottes-body">
+      <h1>The tunes</h1>
+      <table class="dottes-tune-table">
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/dottes.html.tune	Sun Feb 17 00:27:07 2013 +0000
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8" />
+  <title>Cry Havoc tunes - @TITLE@</title>
+  <link rel="stylesheet" href="../css/reset.css" />
+  <link rel="stylesheet" href="../css/text.css" />
+  <link rel="stylesheet" href="../css/960.css" />
+  <link rel="stylesheet" href="../css/dottes.css" />
+
+  <link href='http://fonts.googleapis.com/css?family=Pirata+One|Oswald'
+        rel='stylesheet' type='text/css'>
+</head>
+<body>
+  <div class="container_12">
+    <a href="/">
+      <div class="grid_12 header-strip banner">
+        <h1>Ye Crie Havock Booke of Dottes</h1>
+      </div>
+    </a>
+
+    <div class="clear"></div>
+
+    <div class="grid_12 dottes-body">
+      <h1>@TITLE@</h1>
+      <img class="dottes-png" src="@TUNE@.png" alt="@TITLE@ dots">
+      <ul class="tune-data-list">
+        <li><a class="dottes-link-tune dottes-pdf"
+               href="@TUNE@.pdf">PDF</a></li>
+        <li><a class="dottes-link-tune dottes-midi"
+               href="@TUNE@.mid">MIDI</a></li>
+        <li><a class="dottes-link-tune dottes-mp3"
+               href="@TUNE@.mp3">MP3</a></li>
+        <li><a class="dottes-link-tune dottes-abc"
+               href="@TUNE@.abc">ABC</a></li>
+      </ul>
+    </div>
+
+  </div>
+</body>
+</html>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/dottes.html.tuneindex	Sun Feb 17 00:27:07 2013 +0000
@@ -0,0 +1,4 @@
+<tr>
+<td><a class="dottes-tune-link" href="@TUNE@.html">@TITLE@</a></td>
+<td><img class="dottes-tune-table-image" src="firstline-@TUNE@.png" alt="@TITLE@ first line"></td>
+</tr>
--- a/makeAll.sh	Sat Feb 16 23:23:50 2013 +0000
+++ b/makeAll.sh	Sun Feb 17 00:27:07 2013 +0000
@@ -13,9 +13,10 @@
     ./makeBookeA5.sh $1
     ./makeBookeA4.sh $1
     ./makeWebItems.sh $1
-    ./makeWeb.sh $1
+    ./makeWeb.sh $1 $2
 }
 
 makeABooke $1
+
 ./makeCello.sh $1
-makeABooke $1-Cello
+makeABooke $1-Cello cello
--- a/makeCello.sh	Sat Feb 16 23:23:50 2013 +0000
+++ b/makeCello.sh	Sun Feb 17 00:27:07 2013 +0000
@@ -19,6 +19,9 @@
 
 mkdir -p $outdir
 
+# Copy book component items.
+cp $booke/*.txt $outdir
+
 find $booke -name "*.abc" | sort |
     while read filename
     do
--- a/makeWeb.sh	Sat Feb 16 23:23:50 2013 +0000
+++ b/makeWeb.sh	Sun Feb 17 00:27:07 2013 +0000
@@ -4,37 +4,47 @@
 # to be already built.
 #
 
-if [ $# != 1 ]; then
-    echo "Usage: makeWeb.sh <book dir name>"
+if [ $# -lt 1 -o $# -gt 2 ]; then
+    echo "Usage: makeWeb.sh <book dir name> [<instrument name>]"
     exit 1
 fi
 
 dir=`pwd`
 
-booke=$dir/$1
+bookedir=$dir/$1
 webdir=$dir/web/$1
 graphicsdir=$dir/graphics/$1
 output=index.html
+title=$1
+booke=$1
 
 buildno=`cat buildno.txt`
 subtitle=
 intro=
-if [ -r $booke/subtitle.txt ]; then
-    subtitle=`cat $booke/subtitle.txt`
+if [ -r $bookedir/subtitle.txt ]; then
+    subtitle=`cat $bookedir/subtitle.txt`
 fi
-if [ -r $booke/intro.txt ]; then
-    intro=`cat $booke/intro.txt`
+if [ -r $bookedir/intro.txt ]; then
+    intro=`cat $bookedir/intro.txt`
+fi
+
+if [ -n "$2" ]; then
+    title="${title/-.*$//} ($2)"
+    subtitle="${subtitle} ($2)"
 fi
 
 mkdir -p $webdir
 
 sed -e "s/@BUILD@/$buildno/" -e "s/@SUBTITLE@/$subtitle/" \
-    -e "s/@INTRO@/$intro/" -e "s/@BOOK@/$1/" dottes.html.header > $webdir/$output
+    -e "s/@TITLE@/$title/" -e "s/@INTRO@/$intro/" \
+    -e "s/@BOOK@/$booke/" dottes.html.header > $webdir/$output
 
-cp $1-*.pdf $webdir
+# Copy in the book PDFs. Like the graphics, Midi etc. these are assumed
+# to be already generated.
+cp $-*.pdf $webdir
 
 # Now, for each tune, make the tune graphic and sound.
-find $booke -name "*.abc" | sort |
+find $bookedir -name "*.abc" | sort |
     while read filename
     do
         title=`$dir/abcfield.py --field T --html $filename`
@@ -46,14 +56,14 @@
         # And copy the ABC.
         cp $filename $webdir
 
-        echo "<tr>" >> $webdir/$output
-        echo "<td>${title}</td>" >> $webdir/$output
-        echo "<td><a href=\"${name}.png\">PNG</a></td>" >> $webdir/$output
-        echo "<td><a href=\"${name}.pdf\">PDF</a></td>" >> $webdir/$output
-        echo "<td><a href=\"${name}.mid\">MIDI</a></td>" >> $webdir/$output
-        echo "<td><a href=\"${name}.mp3\">MP3</a></td>" >> $webdir/$output
-        echo "<td><a href=\"${name}.abc\">ABC</a></td>" >> $webdir/$output
-        echo "</tr>" >> $webdir/$output
+        # Generate the tune web page.
+        tunepage=${name}.html
+
+        sed -e "s/@TITLE@/${title}/" \
+            -e "s/@TUNE@/${name}/" dottes.html.tune > $webdir/$tunepage
+
+        sed -e "s/@TITLE@/${title}/" \
+            -e "s/@TUNE@/${name}/" dottes.html.tuneindex >> $webdir/$output
     done
 
 cat dottes.html.footer >> $webdir/$output
--- a/makeWebItems.sh	Sat Feb 16 23:23:50 2013 +0000
+++ b/makeWebItems.sh	Sun Feb 17 00:27:07 2013 +0000
@@ -25,12 +25,14 @@
         name=`basename $filename .abc`
         tmpname=${name}.tmp
         convert -density 96 $graphicsdir/${name}.eps $builddir/${tmpname}.png
+        convert -density 96 $graphicsdir/firstline-${name}.eps $builddir/firstline-${tmpname}.png
 
         abc2midi $filename -o $builddir/${tmpname}.mid
         timidity -Ow -o $builddir/${tmpname}.wav $builddir/${tmpname}.mid
         lame --quiet $builddir/${tmpname}.wav $builddir/${tmpname}.mp3
 
         mv $builddir/${tmpname}.png $builddir/${name}.png
+        mv $builddir/firstline-${tmpname}.png $builddir/firstline-${name}.png
         mv $builddir/${tmpname}.mid $builddir/${name}.mid
         mv $builddir/${tmpname}.mp3 $builddir/${name}.mp3
         rm $builddir/${tmpname}.wav
--- a/web/css/dottes.css	Sat Feb 16 23:23:50 2013 +0000
+++ b/web/css/dottes.css	Sun Feb 17 00:27:07 2013 +0000
@@ -90,6 +90,17 @@
 {
 }
 
+table.dottes-tune-table
+{
+    padding: 10px;
+    margin: 10px;
+}
+
+table.dottes-tune-table td
+{
+    vertical-align: middle;
+}
+
 ul.tune-type-list
 {
     list-style-type: none;
@@ -100,3 +111,14 @@
 {
     display: inline;
 }
+
+ul.tune-data-list
+{
+    list-style-type: none;
+    margin: 20px;
+}
+
+ul.tune-data-list li
+{
+    display: inline;
+}