[Kimchi-devel] [PATCH] [Wok] Adds DataTables.net plugin and Moment.js to Wok

sguimaraes943 at gmail.com sguimaraes943 at gmail.com
Fri Jun 24 20:57:36 UTC 2016


From: Samuel Guimarães <sguimaraes943 at gmail.com>

This commit adds DataTables.net jQuery plugin and Moment.js library to Wok.

DataTables.net is a table plugin that supports pagination, instance search and multi-column ordering. It also has a responsive module and it is compatible with many different CSS libraries.
In this commit it is included a customization for its Bootstrap integration and a default initialization script pre-loaded with Wok styles.

Moment.js is a lightweight JavaScript date library for parsing, validating, manipulating, and formatting dates. It is required in order to filter and sort dates properly in Wok User Logs and Ginger Configuration Backup.

Signed-off-by: Samuel Guimarães <sguimaraes943 at gmail.com>
---
 configure.ac                         |   3 +
 ui/css/Makefile.am                   |   8 +-
 ui/css/datatables.bootstrap.css      | 243 +++++++++++++++++++++++++++++
 ui/css/src/datatables.bootstrap.scss | 289 +++++++++++++++++++++++++++++++++++
 ui/js/src/wok.datatables.js          |  26 ++++
 ui/libs/Makefile.am                  |   2 +-
 ui/libs/datatables/Makefile.am       |  23 +++
 ui/libs/datatables/css/Makefile.am   |  21 +++
 ui/libs/moment/LICENSE               |  22 +++
 ui/libs/moment/Makefile.am           |  21 +++
 ui/pages/login.html.tmpl             |   5 +
 ui/pages/wok-ui.html.tmpl            |   5 +
 12 files changed, 665 insertions(+), 3 deletions(-)
 create mode 100644 ui/css/datatables.bootstrap.css
 create mode 100644 ui/css/src/datatables.bootstrap.scss
 create mode 100644 ui/js/src/wok.datatables.js
 create mode 100644 ui/libs/datatables/Makefile.am
 create mode 100644 ui/libs/datatables/css/Makefile.am
 create mode 100644 ui/libs/moment/LICENSE
 create mode 100644 ui/libs/moment/Makefile.am

diff --git a/configure.ac b/configure.ac
index b7ffee4..12f6c67 100644
--- a/configure.ac
+++ b/configure.ac
@@ -142,6 +142,9 @@ AC_CONFIG_FILES([
     ui/libs/jquery-ui/themes/base/images/Makefile
     ui/libs/list-js/Makefile
     ui/libs/lodash/Makefile
+    ui/libs/moment/Makefile
+    ui/libs/datatables/Makefile
+    ui/libs/datatables/css/Makefile
     ui/libs/typeahead/Makefile
     ui/pages/Makefile
     ui/pages/help/Makefile
diff --git a/ui/css/Makefile.am b/ui/css/Makefile.am
index aee33d7..a779e61 100644
--- a/ui/css/Makefile.am
+++ b/ui/css/Makefile.am
@@ -22,7 +22,7 @@ SUBDIRS = fontawesome opensans
 EXTRA_DIST = theme-default
 
 cssdir = $(datadir)/wok/ui/css
-dist_css_DATA = theme-default.min.css jquery-ui.custom.css wok.css bootstrap.custom.css bootstrap-select.custom.css settings.css
+dist_css_DATA = theme-default.min.css jquery-ui.custom.css wok.css bootstrap.custom.css bootstrap-select.custom.css settings.css datatables.bootstrap.css
 
 wok: src/wok.scss src/modules/*.scss
 	echo "Compiling .scss file $<"
@@ -40,7 +40,11 @@ bootstrap-select: src/bootstrap-select.custom.scss
 	echo "Compiling .scss file $<"
 	sassc -s expanded $< bootstrap-select.custom.css
 
-css: wok bootstrap bootstrap-select settings
+datatables: src/datatables.bootstrap.scss
+	echo "Compiling .scss file $<"
+	sassc -s expanded $< datatables.bootstrap.css
+
+css: wok bootstrap bootstrap-select settings datatables
 
 theme-default.min.css: theme-default/*.css
 	cat $^ > $@
diff --git a/ui/css/datatables.bootstrap.css b/ui/css/datatables.bootstrap.css
new file mode 100644
index 0000000..2ba5811
--- /dev/null
+++ b/ui/css/datatables.bootstrap.css
@@ -0,0 +1,243 @@
+table.dataTable {
+  clear: both;
+  margin-top: 6px !important;
+  margin-bottom: 6px !important;
+  max-width: none !important;
+  border-collapse: separate !important;
+}
+
+table.dataTable td,
+table.dataTable th {
+  -webkit-box-sizing: content-box;
+  -moz-box-sizing: content-box;
+  box-sizing: content-box;
+}
+
+table.dataTable td.dataTables_empty,
+table.dataTable th.dataTables_empty {
+  text-align: center;
+}
+
+table.dataTable.nowrap th,
+table.dataTable.nowrap td {
+  white-space: nowrap;
+}
+
+div.dataTables_wrapper div.dataTables_length {
+  text-align: right;
+  padding-left: 10px;
+}
+
+div.dataTables_wrapper div.dataTables_length label {
+  font-weight: normal;
+  text-align: left;
+  white-space: nowrap;
+}
+
+div.dataTables_wrapper div.dataTables_length select, div.dataTables_wrapper div.dataTables_length .btn {
+  width: 66px;
+  display: inline-block;
+}
+
+div.dataTables_wrapper div.dataTables_filter {
+  text-align: right;
+}
+
+div.dataTables_wrapper div.dataTables_filter label {
+  font-weight: normal;
+  white-space: nowrap;
+  text-align: left;
+}
+
+div.dataTables_wrapper div.dataTables_filter input {
+  margin-left: 0.5em;
+  display: inline-block;
+  width: auto;
+}
+
+div.dataTables_wrapper div.dataTables_filter .form-control {
+  width: 514px;
+  height: 34px;
+}
+
+div.dataTables_wrapper div.dataTables_info {
+  padding-top: 8px;
+  white-space: nowrap;
+  text-align: right;
+}
+
+div.dataTables_wrapper div.dataTables_paginate {
+  margin: 0;
+  white-space: nowrap;
+  text-align: left;
+}
+
+div.dataTables_wrapper div.dataTables_paginate ul.pagination {
+  margin: 2px 0;
+  white-space: nowrap;
+}
+
+div.dataTables_wrapper div.dataTables_processing {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 200px;
+  margin-left: -100px;
+  margin-top: -26px;
+  text-align: center;
+  padding: 1em 0;
+}
+
+table.dataTable thead > tr > th.sorting_asc, table.dataTable thead > tr > th.sorting_desc, table.dataTable thead > tr > th.sorting,
+table.dataTable thead > tr > td.sorting_asc,
+table.dataTable thead > tr > td.sorting_desc,
+table.dataTable thead > tr > td.sorting {
+  padding-right: 30px;
+}
+
+table.dataTable thead > tr > th:active,
+table.dataTable thead > tr > td:active {
+  outline: none;
+}
+
+table.dataTable thead .sorting,
+table.dataTable thead .sorting_asc,
+table.dataTable thead .sorting_desc,
+table.dataTable thead .sorting_asc_disabled,
+table.dataTable thead .sorting_desc_disabled {
+  cursor: pointer;
+  position: relative;
+}
+
+table.dataTable thead .sorting:before, table.dataTable thead .sorting:after,
+table.dataTable thead .sorting_asc:before,
+table.dataTable thead .sorting_asc:after,
+table.dataTable thead .sorting_desc:before,
+table.dataTable thead .sorting_desc:after,
+table.dataTable thead .sorting_asc_disabled:before,
+table.dataTable thead .sorting_asc_disabled:after,
+table.dataTable thead .sorting_desc_disabled:before,
+table.dataTable thead .sorting_desc_disabled:after {
+  position: absolute;
+  bottom: 8px;
+  right: 8px;
+  display: block;
+  opacity: 0.3;
+  font: normal normal normal 19px/1 FontAwesome;
+  text-rendering: auto;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+table.dataTable thead .sorting:after {
+  top: 13px;
+  content: "\f107";
+  /* sort - arrow down */
+}
+
+table.dataTable thead .sorting:before {
+  top: 3px;
+  content: "\f106";
+  /* sort - arrow up */
+}
+
+table.dataTable thead .sorting_asc:after {
+  opacity: 0.8;
+  content: "\f107";
+  /* sort-by-attributes */
+  top: 13px;
+}
+
+table.dataTable thead .sorting_desc:after {
+  opacity: 0.8;
+  content: "\f107";
+  /* sort-by-attributes-alt */
+  top: 3px;
+}
+
+table.dataTable thead .sorting_asc_disabled:after,
+table.dataTable thead .sorting_desc_disabled:after {
+  color: #eee;
+}
+
+table.dataTable tfoot {
+  display: none;
+}
+
+div.dataTables_scrollHead table.dataTable {
+  margin-bottom: 0 !important;
+}
+
+div.dataTables_scrollBody table {
+  border-top: none;
+  margin-top: 0 !important;
+  margin-bottom: 0 !important;
+}
+
+div.dataTables_scrollBody table thead .sorting:after,
+div.dataTables_scrollBody table thead .sorting_asc:after,
+div.dataTables_scrollBody table thead .sorting_desc:after {
+  display: none;
+}
+
+div.dataTables_scrollBody table tbody tr:first-child th,
+div.dataTables_scrollBody table tbody tr:first-child td {
+  border-top: none;
+}
+
+div.dataTables_scrollFoot table {
+  margin-top: 0 !important;
+  border-top: none;
+}
+
+ at media screen and (max-width: 767px) {
+  div.dataTables_wrapper div.dataTables_length,
+  div.dataTables_wrapper div.dataTables_filter,
+  div.dataTables_wrapper div.dataTables_info,
+  div.dataTables_wrapper div.dataTables_paginate {
+    text-align: center;
+  }
+}
+
+table.dataTable.table-condensed > thead > tr > th {
+  padding-right: 20px;
+}
+
+table.dataTable.table-condensed .sorting:after,
+table.dataTable.table-condensed .sorting_asc:after,
+table.dataTable.table-condensed .sorting_desc:after {
+  top: 6px;
+  right: 6px;
+}
+
+table.table-bordered.dataTable th,
+table.table-bordered.dataTable td {
+  border-left-width: 0;
+}
+
+table.table-bordered.dataTable th:last-child, table.table-bordered.dataTable th:last-child,
+table.table-bordered.dataTable td:last-child,
+table.table-bordered.dataTable td:last-child {
+  border-right-width: 0;
+}
+
+table.table-bordered.dataTable tbody th,
+table.table-bordered.dataTable tbody td {
+  border-bottom-width: 0;
+}
+
+div.dataTables_scrollHead table.table-bordered {
+  border-bottom-width: 0;
+}
+
+div.table-responsive > div.dataTables_wrapper > div.row {
+  margin: 0;
+}
+
+div.table-responsive > div.dataTables_wrapper > div.row > div[class^="col-"]:first-child {
+  padding-left: 0;
+}
+
+div.table-responsive > div.dataTables_wrapper > div.row > div[class^="col-"]:last-child {
+  padding-right: 0;
+}
diff --git a/ui/css/src/datatables.bootstrap.scss b/ui/css/src/datatables.bootstrap.scss
new file mode 100644
index 0000000..993162f
--- /dev/null
+++ b/ui/css/src/datatables.bootstrap.scss
@@ -0,0 +1,289 @@
+//
+// Project Wok
+//
+// Copyright IBM Corp, 2016
+//
+// 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.
+//
+
+table.dataTable {
+    clear: both;
+    margin-top: 6px !important;
+    margin-bottom: 6px !important;
+    max-width: none !important;
+    border-collapse: separate !important;
+
+    td,
+    th {
+        -webkit-box-sizing: content-box;
+        -moz-box-sizing: content-box;
+        box-sizing: content-box;
+
+        &.dataTables_empty {
+            text-align: center;
+        }
+    }
+
+    // Style options for the table. Foundation provides its own, but it is also
+    // useful to have a few more for DataTables
+    &.nowrap {
+        th,
+        td {
+            white-space: nowrap;
+        }
+    }
+}
+
+
+// DataTables' built in feature elements
+div.dataTables_wrapper {
+    div.dataTables_length {
+        text-align: right;
+        padding-left: 10px;
+
+        label {
+            font-weight: normal;
+            text-align: left;
+            white-space: nowrap;
+        }
+
+        select, .btn {
+            width: 66px;
+            display: inline-block;
+        }
+    }
+
+    div.dataTables_filter {
+        text-align: right;
+
+        label {
+            font-weight: normal;
+            white-space: nowrap;
+            text-align: left;
+        }
+
+        input {
+            margin-left: 0.5em;
+            display: inline-block;
+            width: auto;
+        }
+
+        .form-control {
+            width: 514px; // Adust filter input with Wok filter size
+            height: 34px;
+        }
+    }
+
+    div.dataTables_info {
+        padding-top: 8px;
+        white-space: nowrap;
+        text-align: right;
+    }
+
+    div.dataTables_paginate {
+        margin: 0;
+        white-space: nowrap;
+        text-align: left;
+
+        ul.pagination {
+            margin: 2px 0;
+            white-space: nowrap;
+        }
+    }
+
+    div.dataTables_processing {
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        width: 200px;
+        margin-left: -100px;
+        margin-top: -26px;
+        text-align: center;
+        padding: 1em 0;
+    }
+}
+
+
+// Sorting - using Glyphicons
+table.dataTable thead {
+    > tr > th,
+    > tr > td {
+        &.sorting_asc,
+        &.sorting_desc,
+        &.sorting {
+            padding-right: 30px;
+        }
+
+        &:active {
+            outline: none;
+        }
+    }
+
+    .sorting,
+    .sorting_asc,
+    .sorting_desc,
+    .sorting_asc_disabled,
+    .sorting_desc_disabled {
+        cursor: pointer;
+        position: relative;
+
+        &:before,
+        &:after {
+            position: absolute;
+            bottom: 8px;
+            right: 8px;
+            display: block;
+            opacity: 0.3;
+            font: normal normal normal 19px/1 FontAwesome;
+            text-rendering: auto;
+            -webkit-font-smoothing: antialiased;
+            -moz-osx-font-smoothing: grayscale;
+        }
+    }
+
+    .sorting:after {
+        top: 13px;
+        content: "\f107"; /* sort - arrow down */
+    }
+
+    .sorting:before {
+        top: 3px;
+        content: "\f106"; /* sort - arrow up */
+    }
+
+    .sorting_asc:after {
+        opacity: 0.8;
+        content: "\f107"; /* sort-by-attributes */
+        top: 13px;
+    }
+
+    .sorting_desc:after {
+        opacity: 0.8;
+        content: "\f107"; /* sort-by-attributes-alt */
+        top: 3px;
+    }
+
+    .sorting_asc_disabled:after,
+    .sorting_desc_disabled:after {
+        color: #eee;
+    }
+}
+
+table.dataTable tfoot {
+    display: none; // Wok doesn't have tfoot on tables
+}
+
+
+// Scrolling
+div.dataTables_scrollHead table.dataTable {
+    margin-bottom: 0 !important;
+}
+
+div.dataTables_scrollBody {
+    table {
+        border-top: none;
+        margin-top: 0 !important;
+        margin-bottom: 0 !important;
+
+        thead { // Hide sort icons
+            .sorting:after,
+            .sorting_asc:after,
+            .sorting_desc:after {
+                display: none;
+            }
+        }
+
+        tbody tr:first-child th,
+        tbody tr:first-child td {
+            border-top: none;
+        }
+    }
+}
+
+div.dataTables_scrollFoot table {
+    margin-top: 0 !important;
+    border-top: none;
+}
+
+
+// Responsive
+ at media screen and (max-width: 767px) {
+    div.dataTables_wrapper {
+        div.dataTables_length,
+        div.dataTables_filter,
+        div.dataTables_info,
+        div.dataTables_paginate {
+            text-align: center;
+        }
+    }
+}
+
+
+//
+// Bootstrap provides a range of styling options for table's via class name
+// that we want to full support. They sometimes require some customisations
+//
+
+// Condensed
+table.dataTable.table-condensed {
+    > thead > tr > th {
+        padding-right: 20px;
+    }
+
+    .sorting:after,
+    .sorting_asc:after,
+    .sorting_desc:after {
+        top: 6px;
+        right: 6px;
+    }
+}
+
+// Frustratingly the border-collapse:collapse used by Bootstrap makes the column
+// width calculations when using scrolling impossible to align columns. We have
+// to use `border-collapse: separate`
+table.table-bordered.dataTable {
+    th,
+    td {
+        border-left-width: 0;
+
+        &:last-child,
+        &:last-child {
+            border-right-width: 0;
+        }
+    }
+
+    tbody th,
+    tbody td {
+        border-bottom-width: 0;
+    }
+}
+
+// Bordered table
+div.dataTables_scrollHead table.table-bordered {
+    border-bottom-width: 0;
+}
+
+// Responsive tables. We use rows inside the Bootstrap responsive wrapper,
+// so they need to have their margin and padding removed
+div.table-responsive > div.dataTables_wrapper > div.row {
+    margin: 0;
+
+    > div[class^="col-"] {
+        &:first-child {
+            padding-left: 0;
+        }
+        &:last-child {
+            padding-right: 0;
+        }
+    }
+}
diff --git a/ui/js/src/wok.datatables.js b/ui/js/src/wok.datatables.js
new file mode 100644
index 0000000..58a672a
--- /dev/null
+++ b/ui/js/src/wok.datatables.js
@@ -0,0 +1,26 @@
+/*
+ * Project Wok
+ *
+ * Copyright IBM Corp, 2015-2016
+ *
+ * Code derived from Project Kimchi
+ *
+ * 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.
+ */
+
+// Sets defalt Datatable options for Wok
+
+$.extend( true, $.fn.dataTable.defaults, {
+    "sPaginationType": "full_numbers",
+    "dom": '<"row"<"col-sm-12 filter"<"pull-right"l><"pull-right"f>>><"row"<"col-sm-12"t>><"row"<"col-sm-6 pages"p><"col-sm-6 info"i>>'
+});
diff --git a/ui/libs/Makefile.am b/ui/libs/Makefile.am
index 5c1140e..9732499 100644
--- a/ui/libs/Makefile.am
+++ b/ui/libs/Makefile.am
@@ -17,4 +17,4 @@
 # See the License for the specific language governing permissions and
 # limitations under the License.
 
-SUBDIRS = bootstrap jquery jquery-ui bootstrap-select es5-shim jquery-i18n list-js jquery-bootgrid bootstrap-switch bootstrap-editable typeahead jquery-containsNC lodash
+SUBDIRS = bootstrap jquery jquery-ui bootstrap-select es5-shim jquery-i18n list-js jquery-bootgrid bootstrap-switch bootstrap-editable typeahead jquery-containsNC lodash datatables moment
diff --git a/ui/libs/datatables/Makefile.am b/ui/libs/datatables/Makefile.am
new file mode 100644
index 0000000..9c3d2af
--- /dev/null
+++ b/ui/libs/datatables/Makefile.am
@@ -0,0 +1,23 @@
+#
+# Project Wok
+#
+# Copyright IBM Corp, 2016
+#
+#
+# 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.
+
+SUBDIRS = css
+
+datatablesdir = $(datadir)/wok/ui/libs/datatables
+
+dist_datatables_DATA = $(wildcard *.js) $(NULL)
diff --git a/ui/libs/datatables/css/Makefile.am b/ui/libs/datatables/css/Makefile.am
new file mode 100644
index 0000000..bedc920
--- /dev/null
+++ b/ui/libs/datatables/css/Makefile.am
@@ -0,0 +1,21 @@
+#
+# Project Wok
+#
+# Copyright IBM Corp, 2016
+#
+#
+# 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.
+
+datatablescssdir = $(datadir)/wok/ui/libs/datatables/css
+
+dist_datatablescss_DATA = $(wildcard *.css) $(NULL)
diff --git a/ui/libs/moment/LICENSE b/ui/libs/moment/LICENSE
new file mode 100644
index 0000000..9ee5374
--- /dev/null
+++ b/ui/libs/moment/LICENSE
@@ -0,0 +1,22 @@
+Copyright (c) 2011-2016 Tim Wood, Iskren Chernev, Moment.js contributors
+
+Permission is hereby granted, free of charge, to any person
+obtaining a copy of this software and associated documentation
+files (the "Software"), to deal in the Software without
+restriction, including without limitation the rights to use,
+copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the
+Software is furnished to do so, subject to the following
+conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+OTHER DEALINGS IN THE SOFTWARE.
diff --git a/ui/libs/moment/Makefile.am b/ui/libs/moment/Makefile.am
new file mode 100644
index 0000000..62f42a5
--- /dev/null
+++ b/ui/libs/moment/Makefile.am
@@ -0,0 +1,21 @@
+#
+# Project Wok
+#
+# Copyright IBM Corp, 2016
+#
+#
+# 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.
+
+momentjsdir = $(datadir)/wok/ui/libs/moment
+
+dist_momentjs_DATA = $(wildcard *.js) $(NULL)
diff --git a/ui/pages/login.html.tmpl b/ui/pages/login.html.tmpl
index b5137b1..5d1371a 100644
--- a/ui/pages/login.html.tmpl
+++ b/ui/pages/login.html.tmpl
@@ -63,9 +63,11 @@
     <link rel="stylesheet" href="$href('css/jquery-ui.custom.css')">
     <link rel="stylesheet" href="$href('css/bootstrap.custom.css')">
     <link rel="stylesheet" href="$href('libs/bootstrap-select/dist/css/bootstrap-select.min.css')">
+    <link rel="stylesheet" href="$href('libs/datatables/css/datatables.min.css')">
     <link rel="stylesheet" href="$href('css/fontawesome/fontawesome.css')">
     <link rel="stylesheet" href="$href('css/opensans/opensans.css')">
     <link rel="stylesheet" href="$href('css/bootstrap-select.custom.css')">
+    <link rel="stylesheet" href="$href('css/datatables.bootstrap.css')">
     <link rel="stylesheet" href="$href('css/wok.css')">
     <script src="$href('libs/es5-shim/es5-shim.min.js')"></script>
     <script src="$href('libs/jquery/jquery.min.js')"></script>
@@ -75,6 +77,9 @@
     <script src="$href('libs/bootstrap/bootstrap.min.js')"></script>
     <script src="$href('libs/bootstrap-select/dist/js/bootstrap-select.min.js')"></script>
     <script src="$href('libs/lodash/lodash.js')"></script>
+    <script src="$href('libs/moment/moment-with-locales.min.js')"></script>
+    <script src="$href('libs/datatables/datatables.min.js')"></script>
+    <script src="$href('libs/datatables/datatables.bootstrap.min.js')"></script>
     <script src="$href('js/wok.min.js')"></script>
 </head>
 <body class="login" onload="wok.login_main()">
diff --git a/ui/pages/wok-ui.html.tmpl b/ui/pages/wok-ui.html.tmpl
index 6ea6e00..6b13ef7 100644
--- a/ui/pages/wok-ui.html.tmpl
+++ b/ui/pages/wok-ui.html.tmpl
@@ -65,9 +65,11 @@
     <link rel="stylesheet" href="$href('libs/jquery-bootgrid/dist/css/jquery.bootgrid.min.css')">
     <link rel="stylesheet" href="$href('libs/bootstrap-switch/dist/css/bootstrap-switch.min.css')">
     <link rel="stylesheet" href="$href('libs/bootstrap-editable/dist/css/bootstrap-editable.css')">
+    <link rel="stylesheet" href="$href('libs/datatables/css/datatables.min.css')">
     <link rel="stylesheet" href="$href('css/fontawesome/fontawesome.css')">
     <link rel="stylesheet" href="$href('css/opensans/opensans.css')">
     <link rel="stylesheet" href="$href('css/bootstrap-select.custom.css')">
+    <link rel="stylesheet" href="$href('css/datatables.bootstrap.css')">
     <link rel="stylesheet" href="$href('css/wok.css')">
     <script src="$href('libs/es5-shim/es5-shim.min.js')"></script>
     <script src="$href('libs/jquery/jquery.min.js')"></script>
@@ -83,6 +85,9 @@
     <script src="$href('libs/bootstrap-editable/dist/js/bootstrap-editable.min.js')"></script>
     <script src="$href('libs/typeahead/typeahead.bundle.min.js')"></script>
     <script src="$href('libs/lodash/lodash.js')"></script>
+    <script src="$href('libs/moment/moment-with-locales.min.js')"></script>
+    <script src="$href('libs/datatables/datatables.min.js')"></script>
+    <script src="$href('libs/datatables/datatables.bootstrap.min.js')"></script>
     <script src="$href('base64/jquery.base64.js')"></script>
     <script src="$href('js/wok.min.js')"></script>
     <!-- This is used for detecting if the UI needs to be built -->
-- 
1.9.3




More information about the Kimchi-devel mailing list