Initial commit

2020-06-15 10:58:47 +08:00
commit 4f1dfe7564
8590 changed files with 1516878 additions and 0 deletions
@@ -0,0 +1,77 @@
+var CoreView = require('backbone/core-view');
+var template = require('./custom-carousel-item.tpl');
+var TipsyTooltipView = require('builder/components/tipsy-tooltip-view');
+
+module.exports = CoreView.extend({
+
+  className: 'Carousel-item',
+  tagName: 'li',
+
+  events: {
+    'mouseenter': '_onMouseEnter',
+    'mouseleave': '_onMouseLeave',
+    'click': '_onClick'
+  },
+
+  initialize: function (opts) {
+    this._itemClassName = opts && opts.itemOptions ? opts.itemOptions.className : '';
+    this._initBinds();
+  },
+
+  render: function () {
+    // NOTE: this function calls destroyTipsy for each tooltip, which calls:
+    // this.$el.unbind('mouseleave mouseenter');
+    // So we need to bind the events again after calling clearSubViews
+    this.clearSubViews();
+
+    this.$el.bind('mouseenter', this._onMouseEnter.bind(this));
+    this.$el.bind('mouseleave', this._onMouseLeave.bind(this));
+
+    this.$el.html(
+      template({
+        name: this.model.getName(),
+        className: this._itemClassName,
+        template: this.model.get('template')()
+      })
+    );
+
+    if (this.model.getValue()) {
+      this.$el.addClass('js-' + this.model.getValue());
+    }
+    this.$el.toggleClass('is-selected', !!this.model.get('selected'));
+
+    this._initViews();
+
+    return this;
+  },
+
+  _initViews: function () {
+    if (this.model.get('tooltip')) {
+      var tooltip = new TipsyTooltipView({
+        el: this.$el,
+        gravity: 's',
+        title: function () {
+          return this.model.get('tooltip');
+        }.bind(this)
+      });
+      this.addView(tooltip);
+    }
+  },
+
+  _initBinds: function () {
+    this.model.bind('change:selected', this.render, this);
+  },
+
+  _onMouseEnter: function () {
+    this.model.set('highlighted', true);
+  },
+
+  _onMouseLeave: function () {
+    this.model.set('highlighted', false);
+  },
+
+  _onClick: function (e) {
+    this.killEvent(e);
+    this.model.set('selected', true);
+  }
+});