Datatables DSL
authorTomas Zeman <tzeman@volny.cz>
Tue, 24 Apr 2012 16:42:34 +0200
changeset 77 8f0eddd7aa85
parent 76 2ba4569f2bd6
child 78 7af1b5887759
Datatables DSL
src/main/resources/default.props
src/main/scala/bootstrap/liftweb/Boot.scala
src/main/scala/net/datatables/DataTables.scala
src/main/webapp/jquery/js/dataTables.dateFormat.js
src/main/webapp/jquery/js/jquery.dataTables_defaults.js
src/main/webapp/templates-hidden/datatables.html
src/main/webapp/templates-hidden/default.html
--- a/src/main/resources/default.props	Tue Apr 24 16:41:59 2012 +0200
+++ b/src/main/resources/default.props	Tue Apr 24 16:42:34 2012 +0200
@@ -4,3 +4,9 @@
 #db.fis.pass=
 db.fis.driver=org.postgresql.Driver
 db.fis.url=jdbc:postgresql://localhost:7803/fis_dev
+
+### datatables.net default settings
+# default number of rows
+datatables.rows=50
+# lang defs
+datatables.lang.cs=/jquery/js/dataTables.cs.txt
--- a/src/main/scala/bootstrap/liftweb/Boot.scala	Tue Apr 24 16:41:59 2012 +0200
+++ b/src/main/scala/bootstrap/liftweb/Boot.scala	Tue Apr 24 16:42:34 2012 +0200
@@ -22,6 +22,7 @@
 import fis.crm.ui._
 import fis.geo.ui._
 import fis.db.SquerylTxMgr
+import net.datatables.DataTables
 import net.liftweb.common._
 import net.liftweb.http._
 import net.liftweb.sitemap._
@@ -42,6 +43,7 @@
 
     AuthnSnippet.init()
     SecNav.init()
+    DataTables.init()
 
     /* Authn wiring */
     UserVendors.cur.default.set(Vendor(() => AuthnSnippet.cur))
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/main/scala/net/datatables/DataTables.scala	Tue Apr 24 16:42:34 2012 +0200
@@ -0,0 +1,96 @@
+/*
+ * Copyright 2012 Tomas Zeman <tzeman@volny.cz>
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+package net.datatables
+
+import fis.base.ui._
+import net.liftweb.http._
+import net.liftweb.http.js._
+import net.liftweb.http.js.JE._
+import net.liftweb.http.js.JsCmds._
+import net.liftweb.http.js.jquery._
+import net.liftweb.http.js.jquery.JqJE._
+import net.liftweb.http.js.jquery.JqJsCmds._
+import net.liftweb.json._
+import net.liftweb.json.Extraction._
+import net.liftweb.record.RecordHelpers._
+import net.liftweb.sitemap.Loc.Snippet
+import net.liftweb.util._
+import net.liftweb.util.Helpers._
+import net.tz.lift.snippet._
+import scala.xml.NodeSeq
+
+/**
+ * datatables.net typesafe datatable.
+ */
+object DataTables {
+
+  def init() {
+    LiftRules.snippets.append {
+      case List("datatables") => { _ => initHeader(loadTpl) }
+    }
+  }
+
+  protected def loadTpl = 
+    Templates(List("templates-hidden", "datatables")) openOr NodeSeq.Empty
+
+  protected def initHeader: CssTr = {
+    val rows = Props.getInt("datatables.rows") map { i =>
+      SetExp(JsVar("$.fn.dataTable.defaults.iDisplayLength"), i) }
+    val lang = Props.get("datatables.lang." + CurLanguage.getLanguage) map { l =>
+      SetExp(JsVar("$.fn.dataTable.defaults.oLanguage.sUrl"), l) }
+    "#datatables-defaults" #> Script((rows ++ lang) toSeq)
+  }
+
+  def onLoad(selector: String, opts: Options): NodeSeq = {
+    val s = Script(JqOnLoad(jsRender(selector, opts)))
+    <head>
+      {s}
+    </head>
+  }
+
+  def jsRender(selector: String, opts: Options): JsExp =
+    JqId(selector) ~> fun(opts)
+
+  private def fun(opts: Options): JsMember = 
+    new JsRaw("dataTable(%s);".format(opt2js(opts).toJsCmd)) with JsMember
+
+  private def opt2js(opts: Options): JsExp = {
+    implicit val formats = DefaultFormats
+    decompose(opts)
+  }
+
+  case class Options(oLanguage: Option[Language], aoColumnDefs: List[ColumnDef])
+  {
+    def lang(l: Language) = this.copy(oLanguage = Some(l))
+    def col(c: ColumnDef) = this.copy(aoColumnDefs = c :: aoColumnDefs)
+  }
+  object Options extends Options(None, Nil)
+
+  case class Language(sUrl: Option[String]) {
+    def url(url: String) = this.copy(sUrl = Some(url))
+  }
+  object Language extends Language(None)
+
+  case class ColumnDef(sType: Option[String], aTargets: List[Int]) {
+    def dtype(t: String) = this.copy(sType = Some(t))
+    def dtype(t: Symbol) = this.copy(sType = Some(t.name))
+    def target(i: Int) = this.copy(aTargets = i :: aTargets)
+  }
+  object ColumnDef extends ColumnDef(None, Nil)
+
+  val TYPE_EU_DATE = 'eu_date
+}
+// vim: set ts=2 sw=2 et:
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/main/webapp/jquery/js/dataTables.dateFormat.js	Tue Apr 24 16:42:34 2012 +0200
@@ -0,0 +1,74 @@
+/**
+ * https://github.com/sedovsek/DataTables-EU-date-Plug-In
+ * commit 4069413
+ *
+ * Copyright 2011 https://github.com/sedovsek
+ *
+ * DataTables-EU-date-Plug-In is a plug-in for sorting EU Date (european date
+ * format), (d)d.mm(.yyyy) or (d)d/mm(/yyyy)
+ * 
+ * Example:
+ * <script type="text/javascript" src="jquery.dataTables.js"></script>
+ * <script type="text/javascript" src="dataTables.dateFormat.js"></script>
+ * <script type="text/javascript">
+ * 	$(document).ready(function() {
+ * 		$('#example').dataTable( {
+ * 			"aoColumns": [
+ * 				null,
+ * 				null,
+ * 				null,
+ * 				{ "sType": "eu_date" },
+ * 				null
+ * 			]
+ * 		} );
+ * 	} );
+ * </script>
+ * 
+ */
+
+function calculate_date(date) {
+	var date = date.replace(" ", "");
+	
+	if (date.indexOf('.') > 0) {
+		/*date a, format dd.mn.(yyyy) ; (year is optional)*/
+		var eu_date = date.split('.');
+	} else {
+		/*date a, format dd/mn/(yyyy) ; (year is optional)*/
+		var eu_date = date.split('/');
+	}
+	
+	/*year (optional)*/
+	if (eu_date[2]) {
+		var year = eu_date[2];
+	} else {
+		var year = 0;
+	}
+	
+	/*month*/
+	var month = eu_date[1];
+	if (month.length == 1) {
+		month = 0+month;
+	}
+	
+	/*day*/
+	var day = eu_date[0];
+	if (day.length == 1) {
+		day = 0+day;
+	}
+	
+	return (year + month + day) * 1;
+}
+
+jQuery.fn.dataTableExt.oSort['eu_date-asc'] = function(a, b) {
+	x = calculate_date(a);
+	y = calculate_date(b);
+	
+	return ((x < y) ? -1 : ((x > y) ?  1 : 0));
+};
+
+jQuery.fn.dataTableExt.oSort['eu_date-desc'] = function(a, b) {
+	x = calculate_date(a);
+	y = calculate_date(b);
+	
+	return ((x < y) ? 1 : ((x > y) ?  -1 : 0));
+};
--- a/src/main/webapp/jquery/js/jquery.dataTables_defaults.js	Tue Apr 24 16:41:59 2012 +0200
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,28 +0,0 @@
-/*
- * Copyright 2011-2012 Tomas Zeman <tzeman@volny.cz>
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/* Grid layout w.r.t. Bootstrap. */
-$.extend( $.fn.dataTableExt.oStdClasses, {
-  "sDom": "<'row'<'span6'l><'span6'f>r>t<'row'<'span6'i><'span6'p>>",
-});
-
-/* Default number of displayed rows. */
-$.fn.dataTable.defaults.iDisplayLength = 50;
-
-/* CZ l10n */
-/* XXX: Set oLanguage programmatically based on the user langugage...
-$.fn.dataTable.defaults.oLanguage.sUrl = "/jquery/js/dataTables.cs.txt";
-*/
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/main/webapp/templates-hidden/datatables.html	Tue Apr 24 16:42:34 2012 +0200
@@ -0,0 +1,19 @@
+<head_merge>
+  <script id="jquery.dataTables" type="text/javascript" src="/jquery/js/jquery.dataTables.js"></script>
+  <script type="text/javascript" src="/jquery/js/dataTables.dateFormat.js"></script>
+  <script type="text/javascript" src="/jquery/js/jquery.dataTables_bootstrap.js"></script>
+  <script id="datatables-defaults"></script>
+  <link rel="stylesheet" href="/jquery/css/jquery.dataTables.css" type="text/css" media="screen, projection"/>
+  <link rel="stylesheet" href="/jquery/css/jquery.dataTables_bootstrap.css" type="text/css" media="screen, projection"/>
+  <script type="text/javascript">
+    /* Grid layout w.r.t. Bootstrap. */
+    $.extend( $.fn.dataTableExt.oStdClasses, {
+      "sDom": "<'row'<'span6'l><'span6'f>r>t<'row'<'span6'i><'span6'p>>",
+    });
+
+    $(document).ready(function() {
+      $('.datatable').dataTable();
+    })
+  </script>
+
+</head_merge>
--- a/src/main/webapp/templates-hidden/default.html	Tue Apr 24 16:41:59 2012 +0200
+++ b/src/main/webapp/templates-hidden/default.html	Tue Apr 24 16:42:34 2012 +0200
@@ -8,19 +8,10 @@
     <link rel="stylesheet" href="/bootstrap/css/bootstrap.css" />
     <link rel="stylesheet" href="/bootstrap/css/bootstrap-responsive.css" />
     <script id="jquery" type="text/javascript" src="/jquery/js/jquery.js"></script>
-    <script id="jquery.dataTables" type="text/javascript" src="/jquery/js/jquery.dataTables.js"></script>
-    <script type="text/javascript" src="/jquery/js/jquery.dataTables_bootstrap.js"></script>
-    <script type="text/javascript" src="/jquery/js/jquery.dataTables_defaults.js"></script>
-    <link rel="stylesheet" href="/jquery/css/jquery.dataTables.css" type="text/css" media="screen, projection"/>
-    <link rel="stylesheet" href="/jquery/css/jquery.dataTables_bootstrap.css" type="text/css" media="screen, projection"/>
-    <script type="text/javascript">
-      $(document).ready(function() {
-        $('.datatable').dataTable();
-      })
-    </script>
     <link type="text/css" href="/css/base.css" rel="stylesheet" />
   </head>
   <body>
+    <span class="lift:datatables"></span>
     <div class="container">
       <div class="hero-unit">
         <h1>Functional Information System</h1>