vis.js is a dynamic, browser-based visualization library
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

163 lines
4.1 KiB

  1. var util = require('../../util');
  2. var Component = require('./Component');
  3. var moment = require('../../module/moment');
  4. var locales = require('../locales');
  5. /**
  6. * A current time bar
  7. * @param {{range: Range, dom: Object, domProps: Object}} body
  8. * @param {Object} [options] Available parameters:
  9. * {Boolean} [showCurrentTime]
  10. * @constructor CurrentTime
  11. * @extends Component
  12. */
  13. function CurrentTime (body, options) {
  14. this.body = body;
  15. // default options
  16. this.defaultOptions = {
  17. showCurrentTime: true,
  18. locales: locales,
  19. locale: 'en'
  20. };
  21. this.options = util.extend({}, this.defaultOptions);
  22. this.offset = 0;
  23. this._create();
  24. this.setOptions(options);
  25. }
  26. CurrentTime.prototype = new Component();
  27. /**
  28. * Create the HTML DOM for the current time bar
  29. * @private
  30. */
  31. CurrentTime.prototype._create = function() {
  32. var bar = document.createElement('div');
  33. bar.className = 'vis-current-time';
  34. bar.style.position = 'absolute';
  35. bar.style.top = '0px';
  36. bar.style.height = '100%';
  37. this.bar = bar;
  38. };
  39. /**
  40. * Destroy the CurrentTime bar
  41. */
  42. CurrentTime.prototype.destroy = function () {
  43. this.options.showCurrentTime = false;
  44. this.redraw(); // will remove the bar from the DOM and stop refreshing
  45. this.body = null;
  46. };
  47. /**
  48. * Set options for the component. Options will be merged in current options.
  49. * @param {Object} options Available parameters:
  50. * {boolean} [showCurrentTime]
  51. */
  52. CurrentTime.prototype.setOptions = function(options) {
  53. if (options) {
  54. // copy all options that we know
  55. util.selectiveExtend(['showCurrentTime', 'locale', 'locales'], this.options, options);
  56. }
  57. };
  58. /**
  59. * Repaint the component
  60. * @return {boolean} Returns true if the component is resized
  61. */
  62. CurrentTime.prototype.redraw = function() {
  63. if (this.options.showCurrentTime) {
  64. var parent = this.body.dom.backgroundVertical;
  65. if (this.bar.parentNode != parent) {
  66. // attach to the dom
  67. if (this.bar.parentNode) {
  68. this.bar.parentNode.removeChild(this.bar);
  69. }
  70. parent.appendChild(this.bar);
  71. this.start();
  72. }
  73. var now = new Date(new Date().valueOf() + this.offset);
  74. var x = this.body.util.toScreen(now);
  75. var locale = this.options.locales[this.options.locale];
  76. var title = locale.current + ' ' + locale.time + ': ' + moment(now).format('dddd, MMMM Do YYYY, H:mm:ss');
  77. title = title.charAt(0).toUpperCase() + title.substring(1);
  78. this.bar.style.left = x + 'px';
  79. this.bar.title = title;
  80. }
  81. else {
  82. // remove the line from the DOM
  83. if (this.bar.parentNode) {
  84. this.bar.parentNode.removeChild(this.bar);
  85. }
  86. this.stop();
  87. }
  88. return false;
  89. };
  90. /**
  91. * Start auto refreshing the current time bar
  92. */
  93. CurrentTime.prototype.start = function() {
  94. var me = this;
  95. function update () {
  96. me.stop();
  97. // determine interval to refresh
  98. var scale = me.body.range.conversion(me.body.domProps.center.width).scale;
  99. var interval = 1 / scale / 10;
  100. if (interval < 30) interval = 30;
  101. if (interval > 1000) interval = 1000;
  102. me.redraw();
  103. // start a renderTimer to adjust for the new time
  104. me.currentTimeTimer = setTimeout(update, interval);
  105. }
  106. update();
  107. };
  108. /**
  109. * Stop auto refreshing the current time bar
  110. */
  111. CurrentTime.prototype.stop = function() {
  112. if (this.currentTimeTimer !== undefined) {
  113. clearTimeout(this.currentTimeTimer);
  114. delete this.currentTimeTimer;
  115. }
  116. };
  117. /**
  118. * Set a current time. This can be used for example to ensure that a client's
  119. * time is synchronized with a shared server time.
  120. * @param {Date | String | Number} time A Date, unix timestamp, or
  121. * ISO date string.
  122. */
  123. CurrentTime.prototype.setCurrentTime = function(time) {
  124. var t = util.convert(time, 'Date').valueOf();
  125. var now = new Date().valueOf();
  126. this.offset = t - now;
  127. this.redraw();
  128. };
  129. /**
  130. * Get the current time.
  131. * @return {Date} Returns the current time.
  132. */
  133. CurrentTime.prototype.getCurrentTime = function() {
  134. return new Date(new Date().valueOf() + this.offset);
  135. };
  136. module.exports = CurrentTime;