Change web graphics tune format to SVG.

dottes.html.tune

@@ -38,7 +38,7 @@
             </div>
           </div>
         </div>
-        <img class="dottes-png" src="${name}.png" alt="${title} dots">
+        <img class="dottes-svg" src="${name}.svg" alt="${title} dots">
         <div class="dottes-notes-${notesvisibility}">
           ${notes}
         </div>

dottes.html.tuneindex

@@ -9,7 +9,7 @@
   </div>
   <div class="dottes-tune-list-item-image">
     <a href="../${tunedir}/index.html">
-      <img class="dottes-tune-table-image" src="../${tunedir}/firstline-${name}.png"
+      <img class="dottes-tune-table-image" src="../${tunedir}/firstline-${name}.svg"
            alt="${fulltitle} first line" title="${fulltitle} first line">
     </a>
   </div>

makeWebGraphics.sh

@@ -32,12 +32,12 @@ find $booke -maxdepth 1 -name "*.abc" |
 
         mkdir -p $tunedir
 
-        tmpname=${name}.tmp
-        convert -colors 256 -quality 90 -density 200 $graphicsdir/${name}.pdf $tunedir/${tmpname}.png
-        convert -colors 256 -quality 90 -density 200 $graphicsdir/firstline-${name}.pdf $tunedir/firstline-${tmpname}.png
-
-        mv $tunedir/${tmpname}.png $tunedir/${name}.png
-        mv $tunedir/firstline-${tmpname}.png $tunedir/firstline-${name}.png
+        abcm2ps -g -F singletune -O $tunedir/$name.svg $filename
+        mv $tunedir/${name}001.svg $tunedir/$name.svg
+        $dir/abcfirstline.py $filename > firstline.abc
+        abcm2ps -g -F firstline -O $tunedir/firstline-$name.svg firstline.abc
+        mv $tunedir/firstline-${name}001.svg $tunedir/firstline-$name.svg
+        rm -f firstline.abc
 
         # Make the web downloadable PDF with the tune title.
         abcm2ps -E -F singletuneweb -O $tunedir/$name.eps $filename

web/css/dottes.css

@@ -383,7 +383,7 @@ ul.tune-type-list li
     display: inline-block;
 }
 
-img.dottes-png
+img.dottes-svg
 {
     display: block;
     width: 100%; /* Make image fill width */