diff --git a/Koha/Template/Plugin/KohaDates.pm b/Koha/Template/Plugin/KohaDates.pm
index e87d478adc..042268fc97 100644
--- a/Koha/Template/Plugin/KohaDates.pm
+++ b/Koha/Template/Plugin/KohaDates.pm
@@ -23,6 +23,7 @@ use Template::Plugin::Filter;
 use base qw( Template::Plugin::Filter );
 
 use Koha::DateUtils;
+use C4::Context;
 our $DYNAMIC = 1;
 
 sub filter {
@@ -42,4 +43,8 @@ sub output_preference {
     return output_pref( @params );
 }
 
+sub tz {
+    return C4::Context->tz->name;
+}
+
 1;
diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/js-date-format.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/js-date-format.inc
new file mode 100644
index 0000000000..91a770a5a6
--- /dev/null
+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/js-date-format.inc
@@ -0,0 +1,62 @@
+[% USE Koha %]
+[% USE raw %]
+[% USE Asset %]
+[% USE KohaDates %]
+[% Asset.js("lib/moment/moment.min.js") | $raw %]
+[% Asset.js("lib/moment/moment-timezone-with-data-10-year-range.min.js") | $raw %]
+<script>
+    (function() {
+        var def_date_format = '[% Koha.Preference('dateformat') | html %]';
+        var def_time_format = '[% Koha.Preference('TimeFormat') | html %]';
+        var def_tz = '[% KohaDates.tz | html %]';
+
+        var get_date_pattern = function(format) {
+            var date_pattern = 'YYYY-MM-DD';
+            if(format == 'us') date_pattern = 'MM/DD/YYYY';
+            if(format == 'metric') date_pattern = 'DD/MM/YYYY';
+            if(format == 'dmydot') date_pattern = 'DD.MM.YYYY';
+            return date_pattern;
+        };
+
+        var get_time_pattern = function(format) {
+            var time_pattern = 'HH:mm';
+            if(format == '12hr') time_pattern = 'hh:mm a';
+            return time_pattern;
+        };
+
+        window.$date = function(value, options) {
+            var tz = (options&&options.tz)||def_tz;
+            var m = moment(value);
+            if(tz) m.tz(tz);
+
+            var dateformat = (options&&options.dateformat)||def_date_format;
+            var withtime = (options&&options.withtime)||false;
+
+            if(dateformat=='rfc3339' && withtime) return m.format();
+
+            var timeformat = (options&&options.timeformat)||def_time_format;
+            var date_pattern = get_date_pattern(dateformat);
+            var time_pattern = !withtime?'':' '+get_time_pattern(timeformat);
+
+            return m.format(date_pattern+time_pattern);
+        }
+
+        window.$datetime = function(value, options) {
+            options = options||{};
+            options.withtime = true;
+            return $date(value, options);
+        };
+
+        window.$time = function(value, options) {
+            var tz = (opitons&&options.tz)||def_tz;
+            var m = moment(value);
+            if(tz) m.tz(tz);
+
+            var dateformat = (options&&options.dateformat);
+            var timeformat = (dateformat=='rfc3339'&&'24hr')||(options&&options.timeformat)||def_time_format;
+
+            return m.format(get_time_pattern(timeformat)+(dateformat=='rfc3339'?':ss'+(!m.isUTC()?'Z':''):''))+(dateformat=='rfc3339' && m.isUTC()?'Z':'');
+        }
+
+    })();
+</script>
\ No newline at end of file
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/includes/js-date-format.inc b/koha-tmpl/opac-tmpl/bootstrap/en/includes/js-date-format.inc
new file mode 100644
index 0000000000..9381684bc6
--- /dev/null
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/includes/js-date-format.inc
@@ -0,0 +1,62 @@
+[% USE Koha %]
+[% USE raw %]
+[% USE Asset %]
+[% USE KohaDates %]
+[% Asset.js("lib/moment.min.js") | $raw %]
+[% Asset.js("lib/moment-timezone-with-data-10-year-range.min.js") | $raw %]
+<script>
+    (function() {
+        var def_date_format = '[% Koha.Preference('dateformat') | html %]';
+        var def_time_format = '[% Koha.Preference('TimeFormat') | html %]';
+        var def_tz = '[% KohaDates.tz | html %]';
+
+        var get_date_pattern = function(format) {
+            var date_pattern = 'YYYY-MM-DD';
+            if(format == 'us') date_pattern = 'MM/DD/YYYY';
+            if(format == 'metric') date_pattern = 'DD/MM/YYYY';
+            if(format == 'dmydot') date_pattern = 'DD.MM.YYYY';
+            return date_pattern;
+        };
+
+        var get_time_pattern = function(format) {
+            var time_pattern = 'HH:mm';
+            if(format == '12hr') time_pattern = 'hh:mm a';
+            return time_pattern;
+        };
+
+        window.$date = function(value, options) {
+            var tz = (options&&options.tz)||def_tz;
+            var m = moment(value);
+            if(tz) m.tz(tz);
+
+            var dateformat = (options&&options.dateformat)||def_date_format;
+            var withtime = (options&&options.withtime)||false;
+
+            if(dateformat=='rfc3339' && withtime) return m.format();
+
+            var timeformat = (options&&options.timeformat)||def_time_format;
+            var date_pattern = get_date_pattern(dateformat);
+            var time_pattern = !withtime?'':' '+get_time_pattern(timeformat);
+
+            return m.format(date_pattern+time_pattern);
+        }
+
+        window.$datetime = function(value, options) {
+            options = options||{};
+            options.withtime = true;
+            return $date(value, options);
+        };
+
+        window.$time = function(value, options) {
+            var tz = (opitons&&options.tz)||def_tz;
+            var m = moment(value);
+            if(tz) m.tz(tz);
+
+            var dateformat = (options&&options.dateformat);
+            var timeformat = (dateformat=='rfc3339'&&'24hr')||(options&&options.timeformat)||def_time_format;
+
+            return m.format(get_time_pattern(timeformat)+(dateformat=='rfc3339'?':ss'+(!m.isUTC()?'Z':''):''))+(dateformat=='rfc3339' && m.isUTC()?'Z':'');
+        }
+
+    })();
+</script>
\ No newline at end of file