Add a bit of javascripting to the project
authorSasha Sherstnev <a.sherstnev@dundee.ac.uk>
Fri, 10 Jan 2014 14:56:08 +0000 (14:56 +0000)
committerSasha Sherstnev <a.sherstnev@dundee.ac.uk>
Fri, 10 Jan 2014 14:56:08 +0000 (14:56 +0000)
webapp/view/fragments/header.jsp

index c162050..b7fc695 100644 (file)
@@ -1,4 +1,5 @@
 <%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
+<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
 
 <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
@@ -8,17 +9,54 @@
        <link rel="shortcut icon" href="${favicon}" />
        
        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-       <script src="https://code.jquery.com/jquery.js"></script>
-
-       <spring:url value="/css/proteocache.css" var="internalcss" />
+       <spring:url value="/js/jquery-1.10.2.js" var="jquery" />
+       <!-- Twitter Bootstrap -->
        <spring:url value="/bootstrap-3.0.2/css/bootstrap.min.css" var="bootstrapcss" />
        <spring:url value="/bootstrap-3.0.2/js/bootstrap.js" var="bootstrapjs2" />
        <spring:url value="/bootstrap-3.0.2/js/bootstrap.min.js" var="bootstrapjs1" />
        <spring:url value="/js/modernizr.271.custom.js" var="modernizr" />
+       <!-- dataTables -->
+       <spring:url value="/datatables-1.9.4/media/js/jquery.dataTables.js" var="datatables" />
+       <!-- internal necessities -->
+       <spring:url value="/css/proteocache.css" var="internalcss" />
+       <!-- dataTable & Boostrap integration -->
+       <spring:url value="/css/DT_bootstrap.css" var="DTbootstrapCSS" />
+       <spring:url value="/js/DT_bootstrap.js" var="DTbootstrapJS" />
+       <spring:url value="/js/table2csv.js" var="table2CSVJS" />
 
+       <script type="text/javascript" src="${jquery}"></script>
+       <script type="text/javascript" src="${datatables}"></script>
+       <link rel="stylesheet" type="text/css" href="${DTbootstrapCSS}" />
+       <script type="text/javascript" src="${DTbootstrapJS}"></script>
+       
        <link rel="stylesheet" type="text/css" href="${internalcss}" />
        <link rel="stylesheet" type="text/css" href="${bootstrapcss}" />
        <link rel="stylesheet" type="text/css" href="${jQueryUiCss}" />
-       <script src="${bootstrapjs1}"></script>
-       <script src="${modernizr}"></script>
+       <script type="text/javascript" src="${bootstrapjs1}"></script>
+       <script type="text/javascript" src="${modernizr}"></script>
+       <script type="text/javascript" src="${table2CSVJS}"></script>
+
+       <script type="application/javascript">
+               $(document).ready(function() {
+                       $('#counts').dataTable(
+                               {
+                               "sPaginationType": "bootstrap",
+                               'aaSorting': [[0,'desc']],
+                               'aLengthMenu': [[20, 50, 100, -1], [20, 50, 100, 'All']],
+                               'iDisplayLength': 50
+                               }
+                       );
+               } );
+               $.extend( $.fn.dataTableExt.oStdClasses, {"sWrapper": "dataTables_wrapper form-inline"} );
+       </script>
+
+       <script type="application/javascript">
+               function shorten(text, maxLength) {
+                       var ret = text;
+                       if (ret.length > maxLength) {
+                               ret = ret.substr(0,maxLength-3) + "...";
+                       }
+                       return ret;
+               }
+       </script>
 </head>