Ohm-Management - Projektarbeit B-ME
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.

VCarousel.js 7.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237
  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. require('../../../src/stylus/components/_carousel.styl');
  6. var _VWindow = require('../VWindow/VWindow');
  7. var _VWindow2 = _interopRequireDefault(_VWindow);
  8. var _VBtn = require('../VBtn');
  9. var _VBtn2 = _interopRequireDefault(_VBtn);
  10. var _VIcon = require('../VIcon');
  11. var _VIcon2 = _interopRequireDefault(_VIcon);
  12. var _buttonGroup = require('../../mixins/button-group');
  13. var _buttonGroup2 = _interopRequireDefault(_buttonGroup);
  14. var _helpers = require('../../util/helpers');
  15. var _console = require('../../util/console');
  16. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  17. // Utilities
  18. // Extensions
  19. exports.default = _VWindow2.default.extend({
  20. name: 'v-carousel',
  21. props: {
  22. cycle: {
  23. type: Boolean,
  24. default: true
  25. },
  26. delimiterIcon: {
  27. type: String,
  28. default: '$vuetify.icons.delimiter'
  29. },
  30. height: {
  31. type: [Number, String],
  32. default: 500
  33. },
  34. hideControls: Boolean,
  35. hideDelimiters: Boolean,
  36. interval: {
  37. type: [Number, String],
  38. default: 6000,
  39. validator: function validator(value) {
  40. return value > 0;
  41. }
  42. },
  43. mandatory: {
  44. type: Boolean,
  45. default: true
  46. },
  47. nextIcon: {
  48. type: [Boolean, String],
  49. default: '$vuetify.icons.next'
  50. },
  51. prevIcon: {
  52. type: [Boolean, String],
  53. default: '$vuetify.icons.prev'
  54. }
  55. },
  56. data: function data() {
  57. return {
  58. changedByDelimiters: false,
  59. internalHeight: this.height,
  60. slideTimeout: undefined
  61. };
  62. },
  63. computed: {
  64. isDark: function isDark() {
  65. return this.dark || !this.light;
  66. }
  67. },
  68. watch: {
  69. internalValue: function internalValue(val) {
  70. this.restartTimeout();
  71. /* @deprecate */
  72. /* istanbul ignore else */
  73. if (!this.$listeners['input']) return;
  74. this.$emit('input', val);
  75. },
  76. interval: 'restartTimeout',
  77. height: function height(val, oldVal) {
  78. if (val === oldVal || !val) return;
  79. this.internalHeight = val;
  80. },
  81. cycle: function cycle(val) {
  82. if (val) {
  83. this.restartTimeout();
  84. } else {
  85. clearTimeout(this.slideTimeout);
  86. this.slideTimeout = undefined;
  87. }
  88. }
  89. },
  90. mounted: function mounted() {
  91. /* @deprecate */
  92. /* istanbul ignore next */
  93. if (this.$listeners['input']) {
  94. (0, _console.deprecate)('@input', '@change', this);
  95. }
  96. this.startTimeout();
  97. },
  98. methods: {
  99. genDelimiters: function genDelimiters() {
  100. return this.$createElement('div', {
  101. staticClass: 'v-carousel__controls'
  102. }, [this.genItems()]);
  103. },
  104. genIcon: function genIcon(direction, icon, fn) {
  105. var _this = this;
  106. return this.$createElement('div', {
  107. staticClass: 'v-carousel__' + direction
  108. }, [this.$createElement(_VBtn2.default, {
  109. props: {
  110. icon: true
  111. },
  112. attrs: {
  113. 'aria-label': this.$vuetify.t('$vuetify.carousel.' + direction)
  114. },
  115. on: {
  116. click: function click() {
  117. _this.changedByDelimiters = true;
  118. fn();
  119. }
  120. }
  121. }, [this.$createElement(_VIcon2.default, {
  122. props: { 'size': '46px' }
  123. }, icon)])]);
  124. },
  125. genIcons: function genIcons() {
  126. var icons = [];
  127. var prevIcon = this.$vuetify.rtl ? this.nextIcon : this.prevIcon;
  128. if (prevIcon && typeof prevIcon === 'string') {
  129. icons.push(this.genIcon('prev', prevIcon, this.prev));
  130. }
  131. var nextIcon = this.$vuetify.rtl ? this.prevIcon : this.nextIcon;
  132. if (nextIcon && typeof nextIcon === 'string') {
  133. icons.push(this.genIcon('next', nextIcon, this.next));
  134. }
  135. return icons;
  136. },
  137. genItems: function genItems() {
  138. var _this2 = this;
  139. var length = this.items.length;
  140. var children = [];
  141. for (var i = 0; i < length; i++) {
  142. var child = this.$createElement(_VBtn2.default, {
  143. class: {
  144. 'v-carousel__controls__item': true
  145. },
  146. props: {
  147. icon: true,
  148. small: true,
  149. value: this.getValue(this.items[i], i)
  150. }
  151. }, [this.$createElement(_VIcon2.default, {
  152. props: { size: 18 }
  153. }, this.delimiterIcon)]);
  154. children.push(child);
  155. }
  156. return this.$createElement(_buttonGroup2.default, {
  157. props: {
  158. value: this.internalValue
  159. },
  160. on: {
  161. change: function change(val) {
  162. _this2.internalValue = val;
  163. }
  164. }
  165. }, children);
  166. },
  167. restartTimeout: function restartTimeout() {
  168. this.slideTimeout && clearTimeout(this.slideTimeout);
  169. this.slideTimeout = undefined;
  170. var raf = requestAnimationFrame || setTimeout;
  171. raf(this.startTimeout);
  172. },
  173. startTimeout: function startTimeout() {
  174. if (!this.cycle) return;
  175. this.slideTimeout = window.setTimeout(this.next, +this.interval > 0 ? +this.interval : 6000);
  176. },
  177. updateReverse: function updateReverse(val, oldVal) {
  178. if (this.changedByDelimiters) {
  179. this.changedByDelimiters = false;
  180. return;
  181. }
  182. _VWindow2.default.options.methods.updateReverse.call(this, val, oldVal);
  183. }
  184. },
  185. render: function render(h) {
  186. var children = [];
  187. var data = {
  188. staticClass: 'v-window v-carousel',
  189. style: {
  190. height: (0, _helpers.convertToUnit)(this.height)
  191. },
  192. directives: []
  193. };
  194. if (!this.touchless) {
  195. data.directives.push({
  196. name: 'touch',
  197. value: {
  198. left: this.next,
  199. right: this.prev
  200. }
  201. });
  202. }
  203. if (!this.hideControls) {
  204. children.push(this.genIcons());
  205. }
  206. if (!this.hideDelimiters) {
  207. children.push(this.genDelimiters());
  208. }
  209. return h('div', data, [this.genContainer(), children]);
  210. }
  211. });
  212. // Mixins
  213. // TODO: Move this into core components v2.0
  214. // Components
  215. // Styles
  216. //# sourceMappingURL=VCarousel.js.map