Index: zpt/viewer_images.zpt
===================================================================
--- zpt/viewer_images.zpt	(revision 500)
+++ zpt/viewer_images.zpt	(revision 501)
@@ -6,17 +6,24 @@
               numPages docinfo/numPages | nothing; dlBaseUrl docinfo/digilibBaseUrl | nothing;">
 <head>
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-  <title tal:content="python:docinfo.get('creator',' ') + ' - ' + docinfo.get('title',' ')" />
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+  <title
+    tal:content="python:docinfo.get('creator',' ') + ' - ' + docinfo.get('title',' ')" />
   <link rel="stylesheet" href="template/docuviewer_css" type="text/css" />
   <script type="text/javascript" tal:attributes="src string:$dlBaseUrl/jquery/jquery.js"></script>
-  <script type="text/javascript" tal:attributes="src string:$dlBaseUrl/jquery/jquery.cookie.js"></script>
-  <script type="text/javascript" tal:attributes="src string:$dlBaseUrl/jquery/jquery.digilib.js"></script>
-  <script type="text/javascript" tal:attributes="src string:$dlBaseUrl/jquery/jquery.digilib.geometry.js"></script>
-  <script type="text/javascript" tal:attributes="src string:$dlBaseUrl/jquery/jquery.digilib.arrows.js"></script>
-  <script type="text/javascript" tal:attributes="src string:$dlBaseUrl/jquery/jquery.digilib.marks.js"></script>
-  <link rel="stylesheet" type="text/css" tal:attributes="href string:$dlBaseUrl/jquery/jquery.digilib.css" />
+  <script type="text/javascript"
+    tal:attributes="src string:$dlBaseUrl/jquery/jquery.cookie.js"></script>
+  <script type="text/javascript"
+    tal:attributes="src string:$dlBaseUrl/jquery/jquery.digilib.js"></script>
+  <script type="text/javascript"
+    tal:attributes="src string:$dlBaseUrl/jquery/jquery.digilib.geometry.js"></script>
+  <script type="text/javascript"
+    tal:attributes="src string:$dlBaseUrl/jquery/jquery.digilib.arrows.js"></script>
+  <script type="text/javascript"
+    tal:attributes="src string:$dlBaseUrl/jquery/jquery.digilib.marks.js"></script>
+  <link rel="stylesheet" type="text/css"
+    tal:attributes="href string:$dlBaseUrl/jquery/jquery.digilib.css" />
 
-<script type="text/javascript"
-  tal:content="string:
+  <script type="text/javascript"
+    tal:content="string:
        var dlOpts = {
             'interactionMode' : 'fullscreen',
@@ -28,19 +35,19 @@
         };"></script>
 
-<script type="text/javascript">
-// <!--
-    $(document).ready(function() {
-        // autosubmit forms
-        $('form.autosubmit').find('.autosubmit').change(function() {
-            this.form.submit();
-        });
-        $('form.autosubmit input[type="submit"]').hide();
-        // get digilib div
-        $digilib = $('div#scaler');
-        // configure digilib
-        $digilib.digilib(dlOpts);
-    });
-// -->
-</script>
+  <script type="text/javascript">
+            // <!--
+            $(document).ready(function() {
+                // autosubmit forms
+                $('form.autosubmit').find('.autosubmit').change(function() {
+                    this.form.submit();
+                });
+                $('form.autosubmit input[type="submit"]').hide();
+                // get digilib div
+                $digilib = $('div#scaler');
+                // configure digilib
+                $digilib.digilib(dlOpts);
+            });
+        // -->
+        </script>
 </head>
 <body tal:condition="numPages">
@@ -48,62 +55,68 @@
     tal:define="docpath docinfo/textURLPath | nothing;
               pn pageinfo/pn; 
-              flowLtr python:pageinfo.get('pageFlow','ltr')!='rtl';
-              prev python:test(pn>1,pn-1,None); next python:test(pn<numPages,pn+1,None);
-              first python:test(pn>1,1,None); last python:test(pn<numPages,numPages,None);
-              left python:test(flowLtr,prev,next); right python:test(flowLtr,next,prev);
-              leftest python:test(flowLtr,first,last); rightest python:test(flowLtr,last,first);">
+              flowLtr python:pageinfo.get('pageFlow','ltr')!='rtl';">
     <div class="page-head">
-      <metal:block metal:use-macro="here/template/head_main/macros/main" />
+      <metal:block metal:use-macro="here/template/common_template/macros/head" />
     </div>
     <div class="page-body" tal:condition="python:here.isAccessible(docinfo)">
-      <!--table of contents-->
+      <!-- table of contents -->
       <div class="col-left">
-        <metal:block metal:use-macro="python:path('here/template/toc_%s/macros/main'%tocMode)" />
+        <metal:block
+          metal:use-macro="python:path('here/template/toc_%s/macros/main'%tocMode)" />
       </div>
       <!-- col-main: text page -->
       <div class="col-main">
         <div class="ruler">
-          <form class="autosubmit" tal:attributes="action viewerUrl">
-            <input type="hidden" tal:define="params python:here.getParams('pn', None)" tal:repeat="param params"
-              tal:attributes="name param; value python:params[param]" /> page <a tal:condition="leftest"
-              tal:attributes="href python:here.getLink('pn',leftest)">|&lt;</a> <span tal:condition="not:leftest">|&lt;</span> <a
-              tal:condition="left" tal:attributes="href python:here.getLink('pn',left)">&lt;</a> <span tal:condition="not:left">&lt;</span>
-            <input class="autosubmit" size="3" type="text" name="pn" tal:attributes="value pn" />
-            <tal:block tal:define="originalPage pageinfo/pageNumberOrig | nothing" tal:condition="python:originalPage!=None">
-              (<span tal:replace="originalPage" />
-              <span tal:define="originalPageNorm pageinfo/pageNumberOrigNorm | nothing"
-                tal:condition="python:originalPageNorm!=None">[<span tal:replace="originalPageNorm" />]</span>)      
-            </tal:block>
-            <input type="submit" value="Go" />
-            of <span tal:replace="numPages" /> <a tal:condition="right"
-              tal:attributes="href python:here.getLink('pn',right)">&gt;</a> <span tal:condition="not:right">&gt;</span> <a
-              tal:condition="rightest" tal:attributes="href python:here.getLink('pn',rightest)">&gt;|</a> <span
-              tal:condition="not:rightest">&gt;|</span>
-          </form>
-        </div><!-- ruler -->
+          <metal:block metal:use-macro="here/template/common_template/macros/page_ruler" />
+        </div>
         <ul class="switcher">
           <li class="sel">Image</li>
-          <li><a tal:condition="docpath" tal:attributes="href python:here.getLink('viewMode','text')">Text</a></li>
+          <li tal:condition="docpath">
+            <a tal:attributes="href python:here.getLink('viewMode','text')">Text</a>
+          </li>
         </ul>
+        <!-- /switcher -->
         <div class="content">
           <div id="scaler">
-            <img tal:attributes="src string:${docinfo/imageURL}&pn=${pageinfo/pn}&dw=500&dh=500" />
+            <img
+              tal:attributes="src string:${docinfo/imageURL}&pn=${pageinfo/pn}&dw=500&dh=500" />
           </div>
-        </div> <!-- content -->
-      </div> <!-- col-main -->
+        </div>
+        <!-- /content -->
+      </div>
+      <!-- /col-main -->
       <div class="col-right">
-          <div class="digilib-buttons">
-            <div><a href="javascript:$digilib.digilib('zoomBy', 1.4)">zoom in</a></div>
-            <div><a href="javascript:$digilib.digilib('zoomBy', 0.7)">zoom out</a></div>
-            <div><a href="javascript:$digilib.digilib('zoomArea')">zoom area</a></div>
-            <div><a href="javascript:$digilib.digilib('zoomFull')">full page</a></div>
-            <div><a href="javascript:$digilib.digilib('zoomFull', 'width')">page width</a></div>
-            <div><a href="javascript:$digilib.digilib('setMark')">set mark</a></div>
-            <div><a href="javascript:$digilib.digilib('removeMark')">remove mark</a></div>
-            <div><a href="javascript:$digilib.digilib('reference')">get reference</a></div>
-            <div><a href="javascript:$digilib.digilib('digilibUrl', 'open_new')">digilib</a></div>
+        <div class="digilib-buttons">
+          <div>
+            <a href="javascript:$digilib.digilib('zoomBy', 1.4)">zoom in</a>
           </div>
+          <div>
+            <a href="javascript:$digilib.digilib('zoomBy', 0.7)">zoom out</a>
+          </div>
+          <div>
+            <a href="javascript:$digilib.digilib('zoomArea')">zoom area</a>
+          </div>
+          <div>
+            <a href="javascript:$digilib.digilib('zoomFull')">full page</a>
+          </div>
+          <div>
+            <a href="javascript:$digilib.digilib('zoomFull', 'width')">page width</a>
+          </div>
+          <div>
+            <a href="javascript:$digilib.digilib('setMark')">set mark</a>
+          </div>
+          <div>
+            <a href="javascript:$digilib.digilib('removeMark')">remove mark</a>
+          </div>
+          <div>
+            <a href="javascript:$digilib.digilib('reference')">get reference</a>
+          </div>
+          <div>
+            <a href="javascript:$digilib.digilib('digilibUrl', 'open_new')">digilib</a>
+          </div>
+        </div>
       </div>
-    </div> <!-- page-body -->
+    </div>
+    <!-- page-body -->
     <div class="page-body" tal:condition="python:not here.isAccessible(docinfo)">
       <div class="errortext">Sorry, access to this document is restricted.</div>
