ui.calendar.navigator.js 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. /**
  2. * DevExtreme (ui/calendar/ui.calendar.navigator.js)
  3. * Version: 19.1.16
  4. * Build date: Tue Oct 18 2022
  5. *
  6. * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  7. * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
  8. */
  9. "use strict";
  10. var $ = require("../../core/renderer");
  11. var extend = require("../../core/utils/extend").extend;
  12. var Widget = require("../widget/ui.widget");
  13. var Button = require("../button");
  14. var CALENDAR_NAVIGATOR_CLASS = "dx-calendar-navigator";
  15. var CALENDAR_NAVIGATOR_PREVIOUS_MONTH_CLASS = "dx-calendar-navigator-previous-month";
  16. var CALENDAR_NAVIGATOR_NEXT_MONTH_CLASS = "dx-calendar-navigator-next-month";
  17. var CALENDAR_NAVIGATOR_PREVIOUS_VIEW_CLASS = "dx-calendar-navigator-previous-view";
  18. var CALENDAR_NAVIGATOR_NEXT_VIEW_CLASS = "dx-calendar-navigator-next-view";
  19. var CALENDAR_NAVIGATOR_DISABLED_LINK_CLASS = "dx-calendar-disabled-navigator-link";
  20. var CALENDAR_NAVIGATOR_CAPTION_BUTTON_CLASS = "dx-calendar-caption-button";
  21. var Navigator = Widget.inherit({
  22. _getDefaultOptions: function() {
  23. return extend(this.callBase(), {
  24. onClick: null,
  25. onCaptionClick: null,
  26. text: ""
  27. })
  28. },
  29. _init: function() {
  30. this.callBase();
  31. this._initActions()
  32. },
  33. _initActions: function() {
  34. this._clickAction = this._createActionByOption("onClick");
  35. this._captionClickAction = this._createActionByOption("onCaptionClick")
  36. },
  37. _initMarkup: function() {
  38. this.callBase();
  39. this.$element().addClass(CALENDAR_NAVIGATOR_CLASS);
  40. this._renderButtons();
  41. this._renderCaption()
  42. },
  43. _renderButtons: function() {
  44. var that = this;
  45. var direction = this.option("rtlEnabled") ? -1 : 1;
  46. this._prevButton = this._createComponent($("<a>"), Button, {
  47. focusStateEnabled: false,
  48. icon: "chevronleft",
  49. onClick: function(e) {
  50. that._clickAction({
  51. direction: -direction,
  52. event: e
  53. })
  54. },
  55. integrationOptions: {}
  56. });
  57. var $prevButton = this._prevButton.$element().addClass(CALENDAR_NAVIGATOR_PREVIOUS_VIEW_CLASS).addClass(CALENDAR_NAVIGATOR_PREVIOUS_MONTH_CLASS);
  58. this._nextButton = this._createComponent($("<a>"), Button, {
  59. focusStateEnabled: false,
  60. icon: "chevronright",
  61. onClick: function(e) {
  62. that._clickAction({
  63. direction: direction,
  64. event: e
  65. })
  66. },
  67. integrationOptions: {}
  68. });
  69. var $nextButton = this._nextButton.$element().addClass(CALENDAR_NAVIGATOR_NEXT_VIEW_CLASS).addClass(CALENDAR_NAVIGATOR_NEXT_MONTH_CLASS);
  70. this._caption = this._createComponent($("<a>").addClass(CALENDAR_NAVIGATOR_CAPTION_BUTTON_CLASS), Button, {
  71. focusStateEnabled: false,
  72. onClick: function(e) {
  73. that._captionClickAction({
  74. event: e
  75. })
  76. },
  77. integrationOptions: {}
  78. });
  79. var $caption = this._caption.$element();
  80. this.$element().append($prevButton, $caption, $nextButton)
  81. },
  82. _renderCaption: function() {
  83. this._caption.option("text", this.option("text"))
  84. },
  85. toggleButton: function(buttonPrefix, value) {
  86. var buttonName = "_" + buttonPrefix + "Button";
  87. var button = this[buttonName];
  88. if (button) {
  89. button.option("disabled", value);
  90. button.$element().toggleClass(CALENDAR_NAVIGATOR_DISABLED_LINK_CLASS, value)
  91. }
  92. },
  93. _optionChanged: function(args) {
  94. switch (args.name) {
  95. case "text":
  96. this._renderCaption();
  97. break;
  98. default:
  99. this.callBase(args)
  100. }
  101. }
  102. });
  103. module.exports = Navigator;