mand-mobile/lib/scroll-view/refresh.js

A Vue.js 2.0 Mobile UI Toolkit

;(function(){
(function (global, factory) {
  if (typeof define === "function" && define.amd) {
    define(['exports', '../_locale', '../activity-indicator/roller', '../_style/global.css', './style/refresh.css'], factory);
  } else if (typeof exports !== "undefined") {
    factory(exports, require('../_locale'), require('../activity-indicator/roller'), require('../_style/global.css'), require('./style/refresh.css'));
  } else {
    var mod = {
      exports: {}
    };
    factory(mod.exports, global._locale, global.roller, global.global, global.refresh);
    global.refresh = mod.exports;
  }
})(this, function (exports, _locale, _roller) {
  'use strict';

  Object.defineProperty(exports, "__esModule", {
    value: true
  });

  var _roller2 = _interopRequireDefault(_roller);

  function _interopRequireDefault(obj) {
    return obj && obj.__esModule ? obj : {
      default: obj
    };
  }

  function _defineProperty(obj, key, value) {
    if (key in obj) {
      Object.defineProperty(obj, key, {
        value: value,
        enumerable: true,
        configurable: true,
        writable: true
      });
    } else {
      obj[key] = value;
    }

    return obj;
  }

  exports.default = {
    name: 'md-scroll-view-refresh',

    components: _defineProperty({}, _roller2.default.name, _roller2.default),

    props: {
      scrollTop: {
        type: Number,
        default: 0
      },
      isRefreshing: {
        type: Boolean,
        default: false
      },
      isRefreshActive: {
        type: Boolean,
        default: false
      },
      refreshText: {
        type: String,
        default: (0, _locale.t)('md.scroll_view.refresh.pullDownRefresh')
      },
      refreshActiveText: {
        type: String,
        default: (0, _locale.t)('md.scroll_view.refresh.freedRefresh')
      },
      refreshingText: {
        type: String,
        default: (0, _locale.t)('md.scroll_view.refresh.refreshing')
      },
      rollerColor: {
        type: String,
        default: '#2F86F6'
      }
    },

    computed: {
      process: function process() {
        if (!this.$el || !this.scrollTop) {
          return +this.scrollTop;
        }

        var refreshHeight = this.$el.clientHeight;

        if (Math.abs(this.scrollTop) < refreshHeight / 2) {
          return 0;
        }

        return (Math.abs(this.scrollTop) - refreshHeight / 2) / (refreshHeight / 2);
      },
      refreshTip: function refreshTip() {
        if (this.isRefreshing) {
          return this.refreshingText;
        } else if (this.isRefreshActive) {
          return this.refreshActiveText;
        } else {
          return this.refreshText;
        }
      }
    }
  };
});
})()
if (module.exports.__esModule) module.exports = module.exports.default
var __vue__options__ = (typeof module.exports === "function"? module.exports.options: module.exports)
__vue__options__.render = function render () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"md-scroll-view-refresh"},[_c('md-activity-indicator-rolling',{attrs:{"process":!_vm.isRefreshing ? _vm.process : undefined,"width":10,"color":_vm.rollerColor}}),_vm._v(" "),_c('p',{staticClass:"refresh-tip"},[_vm._v(_vm._s(_vm.refreshTip))])],1)}
__vue__options__.staticRenderFns = []