Make HTML paging usable.

base.php

@@ -247,7 +247,9 @@ class Page
     public function isPaginated ()
     {
         global $config;
-        return ($config['cops_max_item_per_page'] != -1 && $this->totalNumber != -1);
+        return ($config['cops_max_item_per_page'] != -1 && 
+                $this->totalNumber != -1 && 
+                $this->totalNumber > $config['cops_max_item_per_page']);
     }
     
     public function getNextLink ()
@@ -271,6 +273,12 @@ class Page
         }
         return NULL;
     }
+    
+    public function getMaxPage ()
+    {
+        global $config;
+        return ceil ($this->totalNumber / $config['cops_max_item_per_page']);
+    }
 
 }
 

index.php

@@ -223,21 +223,24 @@
         $prevLink = $currentPage->getPrevLink ();
         $nextLink = $currentPage->getNextLink ();
 ?> 
-    <div>
+    <div class="foot">
+        <div class="footcenter">
         <?php
             if (!is_null ($prevLink)) {
         ?>
-        <a href="<?php echo $prevLink->hrefXhtml () ?>" >Prev</a>
+        <a href="<?php echo $prevLink->hrefXhtml () ?>" ><img src="<?php echo getUrlWithVersion("images/previous.png") ?>" alt="Previous" /></a>
         <?php
             }
         ?>
+        <p><?php echo "&nbsp;" . $currentPage->n . " / " . $currentPage->getMaxPage () . "&nbsp;" ?></p>
         <?php
             if (!is_null ($nextLink)) {
         ?>
-        <a href="<?php echo $nextLink->hrefXhtml () ?>" >Next</a>
+        <a href="<?php echo $nextLink->hrefXhtml () ?>" ><img src="<?php echo getUrlWithVersion("images/next.png") ?>" alt="Next" /></a>
         <?php
             }
         ?>
+        </div>
     </div>
 <?php
     }

style.css

@@ -12,7 +12,6 @@ background-color:lightgray;
 margin:auto;
 width:100%;
 max-width:800px;
-background-color:white;
 }
 
 .head
@@ -23,6 +22,15 @@ width:100%;
 height:64px;
 }
 
+.foot
+{
+color:white;
+background-color:black;
+width:100%;
+height:32px;
+margin-top:8px;
+}
+
 img
 {
 margin:0;
@@ -52,7 +60,18 @@ height:64px;
 display:table;
 }
 
-.headcenter p
+.footcenter
+{
+margin:auto;
+text-align:center;
+font-size: 1.3em;
+font-weight:bold;
+height:32px;
+display:table;
+}
+
+
+.headcenter p, .footcenter p, .footcenter a
 {
 display: table-cell;
 vertical-align: middle;