cygri · animeshmanglik · Oct 15, 2013 · Oct 17, 2013 · Oct 17, 2013 · Oct 17, 2013
diff --git a/doc/Screenshots/Images Handling.png b/doc/Screenshots/Images Handling.png
diff --git a/doc/Screenshots/Metadata Table Appearance.png b/doc/Screenshots/Metadata Table Appearance.png
diff --git a/doc/Screenshots/New look for Table.png b/doc/Screenshots/New look for Table.png
diff --git a/doc/Screenshots/New look for table Zoomed in.png b/doc/Screenshots/New look for table Zoomed in.png
diff --git a/doc/Screenshots/New look to Table.png b/doc/Screenshots/New look to Table.png
diff --git a/doc/Screenshots/Zoomed Out Image 1.png b/doc/Screenshots/Zoomed Out Image 1.png
diff --git a/doc/Screenshots/Zoomed out Imag 2.png b/doc/Screenshots/Zoomed out Imag 2.png
diff --git a/src/main/webapp/WEB-INF/templates/footer.vm b/src/main/webapp/WEB-INF/templates/footer.vm
@@ -1,7 +1,13 @@
 #set ($has_text = false)
+<hr>
     <div id="footer">
+    <div class="container ">
 #if ($sparql_endpoint)
-      This page shows information obtained from the SPARQL endpoint at <a class="sparql-uri" href="$sparql_endpoint">$sparql_endpoint</a>.<br />
+      <p class="muted justify">This page shows information obtained from the SPARQL endpoint at </p>
+      <p class="muted justify">
+<a class="sparql-uri" href="$sparql_endpoint">$sparql_endpoint</a>
+</p>
+<p class="muted justify">
 #end
 #if ($rdf_link)
       <a href="$rdf_link?output=ttl">As Turtle</a> |
@@ -29,6 +35,12 @@
       <a href="$openlink_link">Browse in OpenLink Browser</a>
 #set ($has_text = true)
 #end
+</p>
     </div>
+    </div>
+	</div>
+    </div>
+   <script type="text/javascript" src="${server_base}static/script.js"></script>
+   <script src="${server_base}static/js/jquery.js"></script>
   </body>
 </html>
diff --git a/src/main/webapp/WEB-INF/templates/header.vm b/src/main/webapp/WEB-INF/templates/header.vm
@@ -1,30 +1,58 @@
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!Doctype html>
+<html lang="en">
   <head>
+   <meta charset="utf-8">
     <title>$title | $project_name</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="">
+    <meta name="author" content="Animesh Manglik">
 #if ($rdf_link)
     <link rel="alternate" type="application/rdf+xml" href="$rdf_link" title="RDF" />
 #end
     <link rel="stylesheet" type="text/css" href="${server_base}static/style.css" />
-    <script type="text/javascript" src="${server_base}static/script.js"></script>
+    <link rel="stylesheet" type="text/css" href="${server_base}static/css/bootstrap.css" />
+    <link rel="stylesheet" type="text/css" href="${server_base}static/css/bootstrap-responsive.css" />  
+    <style type="text/css">
+      body {
+        padding-top: 20px;
+        padding-bottom: 60px;
+      }
+
+      /* Custom container */
+      .container {
+        margin: 0 auto;
+        max-width: 1000px;
+      }
+      .container > hr {
+        margin: 40px 0;
+     </style>
+
   </head>
-  <body onLoad="init();">
-    <div id="header">
-      <div>
-        <h1 id="title">$title</h1>
-#if ($project_link)
-        <div id="homelink">at <a href="$project_link">$project_name</a></div>
-#else
-        <div id="homelink">at <a href="$server_base">$project_name</a></div>
-#end
-      </div>
-#if ($uri)
-      <div class="page-resource-uri"><a href="$uri">$uri</a></div>
-#end
-#if ($rdf_link)
-      <div id="rdficon"><a href="$rdf_link" title="RDF data"><img src="${server_base}static/rdf-icon.gif" alt="[This page as RDF]" /></a></div>
-#end
-    </div>
+  <body>
+   <div id="wrap">
+   <div class="container">
 
-#if ($back_uri)
-	<p><a href="$back_uri">Back to $back_label</a></p>
-#end
+      <div class="masthead">
+        <ul class="nav nav-pills pull-right">
+          <li><a href="$rdf_link" title="RDF data"><img src="${server_base}static/rdf-icon.gif" alt="[This page as RDF]" /></a></li>
+          #if ($back_uri)
+		  <li><a href="$back_uri">Back to $back_label</a></li>
+		  #end
+        </ul>
+        <h3 class="muted">              
+               #if ($uri)
+			   <a href="$uri">$title</a>
+			   #else
+			   $title
+	  		   #end
+			   #if ($project_link)
+			   <small>at <a href="$project_link">$project_name</a></small>
+			   #else
+			   <small>at <a href="$server_base">$project_name</a></small>
+			   #end         
+        </h3>
+        #if ($uri)
+      <div class="page-resource-uri truncate"><a class="page-resource-uri" href="$uri">$uri</a></div>
+	  	#end
+      </div>
+      <hr>
diff --git a/src/main/webapp/WEB-INF/templates/metadatatable.vm b/src/main/webapp/WEB-INF/templates/metadatatable.vm
@@ -42,7 +42,7 @@
 	#end
 	</div>
 
-	<table id="ele_$idadd" class="metadata-table" style="display: $style">
+	<table id="ele_$idadd" class="table table-striped table-bordered table-condensed truncate" style="display: $style">
 	#foreach  ($statement in $metadataPropList)
 		<tr>
 			<td valign="top" class="metadata-property">#prettyNode ($statement.getPredicate())</td>

diff --git a/src/main/webapp/WEB-INF/templates/page.vm b/src/main/webapp/WEB-INF/templates/page.vm
@@ -1,9 +1,9 @@
 #parse("header.vm")
-
+<div class="row-fluid">
 #if ($image)
-    <div class="image"><img src="$image" alt="Depiction of $title" /></div>
+    <div class="image"><a href="$image"><img src="$image" alt="Depiction of $title" /></a></div>
 #end
-
+</div>
 #if ($comment)
     <p>$comment</p>
 #end
@@ -15,12 +15,14 @@
 #end
 
 #if ($metadata)
+<div class="row-fluid">
 	<a name="meta"></a>
 	<h2>Metadata</h2>
 	<div id="metadata-tables">
 	#parse("metadatatable.vm")
 	</div>
 	<a href="#meta" onclick="showAllMetadata('metadata-tables')">expand all</a>
+</div>	
 #end
 
 #parse("footer.vm")
diff --git a/src/main/webapp/WEB-INF/templates/pathpage.vm b/src/main/webapp/WEB-INF/templates/pathpage.vm
@@ -2,12 +2,12 @@
 
 #foreach ($resource in $resources)
 #if ($resource.Label)
-    <h2>$resource.Title</h2>
+    <h2>$resource.Label</h2>
 #else
     <h2>Anonymous Resource #$velocityCount</h2>
 #end
 #set ($properties = $resource.Properties)
 #parse("proptable.vm")
 #end
 
-#parse("footer.vm")
+#parse("footer.vm")
diff --git a/src/main/webapp/WEB-INF/templates/proptable.vm b/src/main/webapp/WEB-INF/templates/proptable.vm
@@ -1,35 +1,38 @@
-    <table class="description">
-      <tr><th width="25%">Property</th><th>Value</th></tr>
+<div class="row-fluid">
+    <table class="table table-bordered table-hover">
+    <thead>
+      <tr><th>Property</th><th>Value</th></tr>
+     </thead>
+     <tbody> 
 #foreach ($property in $properties)
 #if ($velocityCount % 2 == 0)
-#set ($odd_even = "even")
+#set ($odd_even = "even success")
 #else
-#set ($odd_even = "odd")
+#set ($odd_even = "odd warning")
 #end
       <tr class="$odd_even">
         <td class="property">
+        <p> 
 #if ($property.isInverse())
           <small>is</small>
 #end
-#if ($showLabels && $property.label)
-          <a class="uri" href="$property.URI" title="$property.URI">$property.label</a>
-#elseif ($property.hasPrefix())
-          <a class="uri" href="$property.URI" title="$property.URI"><small>$property.Prefix:</small>$property.LocalName</a>
+#if ($property.hasPrefix())
+          <small>$property.Prefix:</small>
+         <a class="uri" href="$property.URI" title="$property.URI">$property.LocalName</a>
 #else
-          <a class="uri" href="$property.URI" title="$property.URI"><small>?:</small>$property.LocalName</a>
+          <a class="uri" href="$property.URI" title="$property.URI"><small>?:</small><p>$property.LocalName</p></a>
 #end
 #if ($property.isInverse())
           <small>of</small>
 #end
-        </td>
-        <td>
+</p>
+</td>
+        <td class="wrapword">
           <ul>
 #foreach ($value in $property.Values)
             <li>
 #if ($value.Node.isURI())
-#if ($showLabels && $value.label)
-              <a class="uri" href="$value.Node.URI" title="$value.Node.URI">$value.label</a>
-#elseif ($value.hasPrefix())
+#if ($value.hasPrefix())
               <a class="uri" href="$value.Node.URI" title="$value.Node.URI"><small>$value.Prefix:</small>$value.LocalName</a>
 #else
               <small>&lt;</small><a class="uri" href="$value.Node.URI">$value.Node.URI</a><small>&gt;</small>
@@ -50,18 +53,20 @@
 #end
 #if ($property.BlankNodeCount > 0)
 #if ($property.BlankNodeCount == 1)
-#set ($text = "Anonymous resource")
+#set ($text = "1 anonymous resource")
 #elseif ($property.BlankNodeCount > 1)
 #set ($text = "$property.BlankNodeCount anonymous resources")
 #end
 #if ($property.PathPageURL)
             <li>[<a href="$property.PathPageURL">$text</a>]</li>
 #else
-            <li>[$text]</li>
+            <li><p>[$text]</p></li>
 #end
 #end
           </ul>
         </td>
       </tr>
 #end
+</tbody>
     </table>
+</div>