UNPKG

4.99 kBJavaScriptView Raw
1var util = require('vis-util');
2var Component = require('./Component');
3var moment = require('../../module/moment');
4var locales = require('../locales');
5
6/**
7 * A current time bar
8 * @param {{range: Range, dom: Object, domProps: Object}} body
9 * @param {Object} [options] Available parameters:
10 * {Boolean} [showCurrentTime]
11 * {String} [alignCurrentTime]
12 * @constructor CurrentTime
13 * @extends Component
14 */
15function CurrentTime (body, options) {
16 this.body = body;
17
18 // default options
19 this.defaultOptions = {
20 rtl: false,
21 showCurrentTime: true,
22 alignCurrentTime: undefined,
23
24 moment: moment,
25 locales: locales,
26 locale: 'en'
27 };
28 this.options = util.extend({}, this.defaultOptions);
29 this.offset = 0;
30
31 this._create();
32
33 this.setOptions(options);
34}
35
36CurrentTime.prototype = new Component();
37
38/**
39 * Create the HTML DOM for the current time bar
40 * @private
41 */
42CurrentTime.prototype._create = function() {
43 var bar = document.createElement('div');
44 bar.className = 'vis-current-time';
45 bar.style.position = 'absolute';
46 bar.style.top = '0px';
47 bar.style.height = '100%';
48
49 this.bar = bar;
50};
51
52/**
53 * Destroy the CurrentTime bar
54 */
55CurrentTime.prototype.destroy = function () {
56 this.options.showCurrentTime = false;
57 this.redraw(); // will remove the bar from the DOM and stop refreshing
58
59 this.body = null;
60};
61
62/**
63 * Set options for the component. Options will be merged in current options.
64 * @param {Object} options Available parameters:
65 * {boolean} [showCurrentTime]
66 * {String} [alignCurrentTime]
67 */
68CurrentTime.prototype.setOptions = function(options) {
69 if (options) {
70 // copy all options that we know
71 util.selectiveExtend(['rtl', 'showCurrentTime', 'alignCurrentTime', 'moment', 'locale', 'locales'], this.options, options);
72 }
73};
74
75/**
76 * Repaint the component
77 * @return {boolean} Returns true if the component is resized
78 */
79CurrentTime.prototype.redraw = function() {
80 if (this.options.showCurrentTime) {
81 var parent = this.body.dom.backgroundVertical;
82 if (this.bar.parentNode != parent) {
83 // attach to the dom
84 if (this.bar.parentNode) {
85 this.bar.parentNode.removeChild(this.bar);
86 }
87 parent.appendChild(this.bar);
88
89 this.start();
90 }
91
92 var now = this.options.moment(new Date().valueOf() + this.offset);
93
94 if (this.options.alignCurrentTime) {
95 now = now.startOf(this.options.alignCurrentTime);
96 }
97
98 var x = this.body.util.toScreen(now);
99
100 var locale = this.options.locales[this.options.locale];
101 if (!locale) {
102 if (!this.warned) {
103 console.log('WARNING: options.locales[\'' + this.options.locale + '\'] not found. See http://visjs.org/docs/timeline/#Localization');
104 this.warned = true;
105 }
106 locale = this.options.locales['en']; // fall back on english when not available
107 }
108 var title = locale.current + ' ' + locale.time + ': ' + now.format('dddd, MMMM Do YYYY, H:mm:ss');
109 title = title.charAt(0).toUpperCase() + title.substring(1);
110
111 if (this.options.rtl) {
112 this.bar.style.right = x + 'px';
113 } else {
114 this.bar.style.left = x + 'px';
115 }
116 this.bar.title = title;
117 }
118 else {
119 // remove the line from the DOM
120 if (this.bar.parentNode) {
121 this.bar.parentNode.removeChild(this.bar);
122 }
123 this.stop();
124 }
125
126 return false;
127};
128
129/**
130 * Start auto refreshing the current time bar
131 */
132CurrentTime.prototype.start = function() {
133 var me = this;
134
135 /**
136 * Updates the current time.
137 */
138 function update () {
139 me.stop();
140
141 // determine interval to refresh
142 var scale = me.body.range.conversion(me.body.domProps.center.width).scale;
143 var interval = 1 / scale / 10;
144 if (interval < 30) interval = 30;
145 if (interval > 1000) interval = 1000;
146
147 me.redraw();
148 me.body.emitter.emit('currentTimeTick');
149
150 // start a renderTimer to adjust for the new time
151 me.currentTimeTimer = setTimeout(update, interval);
152 }
153
154 update();
155};
156
157/**
158 * Stop auto refreshing the current time bar
159 */
160CurrentTime.prototype.stop = function() {
161 if (this.currentTimeTimer !== undefined) {
162 clearTimeout(this.currentTimeTimer);
163 delete this.currentTimeTimer;
164 }
165};
166
167/**
168 * Set a current time. This can be used for example to ensure that a client's
169 * time is synchronized with a shared server time.
170 * @param {Date | string | number} time A Date, unix timestamp, or
171 * ISO date string.
172 */
173CurrentTime.prototype.setCurrentTime = function(time) {
174 var t = util.convert(time, 'Date').valueOf();
175 var now = new Date().valueOf();
176 this.offset = t - now;
177 this.redraw();
178};
179
180/**
181 * Get the current time.
182 * @return {Date} Returns the current time.
183 */
184CurrentTime.prototype.getCurrentTime = function() {
185 return new Date(new Date().valueOf() + this.offset);
186};
187
188module.exports = CurrentTime;