Skip to content

Commit

Permalink
Revert "config options dynamically"
Browse files Browse the repository at this point in the history
This reverts commit 93fecb6.

revert config options dynamically
  • Loading branch information
maggiehe committed Feb 1, 2017
1 parent 93fecb6 commit e5de921
Show file tree
Hide file tree
Showing 2 changed files with 109 additions and 150 deletions.
76 changes: 31 additions & 45 deletions src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,51 +2,37 @@ import Lazy from './lazy'
import LazyComponent from './lazy-component'
import { assign } from './util'

let lazy = null
let getLazyInstance = () => {
if (!!lazy) {
return lazy
}
lazy = new Lazy({})
return lazy
}
export default (Vue, options = {}) => {
const lazy = new Lazy(options)
const isVueNext = Vue.version.split('.')[0] === '2'

export default {
install(Vue, options = {}) {
Object.assign(getLazyInstance().options, options)
const isVueNext = Vue.version.split('.')[0] === '2'
Vue.prototype.$Lazyload = lazy
Vue.component('lazy-component', LazyComponent(lazy))

Vue.prototype.$Lazyload = lazy
Vue.component('lazy-component', LazyComponent(lazy))

if (isVueNext) {
Vue.directive('lazy', {
bind: lazy.add.bind(lazy),
update: lazy.update.bind(lazy),
componentUpdated: lazy.lazyLoadHandler.bind(lazy),
unbind : lazy.remove.bind(lazy)
})
} else {
Vue.directive('lazy', {
bind: lazy.lazyLoadHandler.bind(lazy),
update (newValue, oldValue) {
assign(this.vm.$refs, this.vm.$els)
lazy.add(this.el, {
modifiers: this.modifiers || {},
arg: this.arg,
value: newValue,
oldValue: oldValue
}, {
context: this.vm
})
},
unbind () {
lazy.remove(this.el)
}
})
}
},
config(options = {}) {
Object.assign(getLazyInstance().options, options)
if (isVueNext) {
Vue.directive('lazy', {
bind: lazy.add.bind(lazy),
update: lazy.update.bind(lazy),
componentUpdated: lazy.lazyLoadHandler.bind(lazy),
unbind : lazy.remove.bind(lazy)
})
} else {
Vue.directive('lazy', {
bind: lazy.lazyLoadHandler.bind(lazy),
update (newValue, oldValue) {
assign(this.vm.$refs, this.vm.$els)
lazy.add(this.el, {
modifiers: this.modifiers || {},
arg: this.arg,
value: newValue,
oldValue: oldValue
}, {
context: this.vm
})
},
unbind () {
lazy.remove(this.el)
}
})
}
}
}
183 changes: 78 additions & 105 deletions vue-lazyload.js
Original file line number Diff line number Diff line change
Expand Up @@ -110,7 +110,7 @@ function find(arr, fn) {
}

var getDPR = function getDPR() {
var scale = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
var scale = arguments.length <= 0 || arguments[0] === undefined ? 1 : arguments[0];
return inBrowser && window.devicePixelRatio || scale;
};

Expand Down Expand Up @@ -174,7 +174,7 @@ var loadImageAsync = function loadImageAsync(item, resolve, reject) {
resolve({
naturalHeight: image.naturalHeight,
naturalWidth: image.naturalWidth,
src: image.src
src: item.src
});
};

Expand All @@ -191,14 +191,14 @@ var imageCache = {};

var ReactiveListener = function () {
function ReactiveListener(_ref) {
var el = _ref.el,
src = _ref.src,
error = _ref.error,
loading = _ref.loading,
bindType = _ref.bindType,
$parent = _ref.$parent,
options = _ref.options,
elRenderer = _ref.elRenderer;
var el = _ref.el;
var src = _ref.src;
var error = _ref.error;
var loading = _ref.loading;
var bindType = _ref.bindType;
var $parent = _ref.$parent;
var options = _ref.options;
var elRenderer = _ref.elRenderer;

_classCallCheck$1(this, ReactiveListener);

Expand All @@ -216,7 +216,7 @@ var ReactiveListener = function () {

this.initState();

this.performanceData = {
this.performance = {
init: Date.now(),
loadStart: null,
loadEnd: null
Expand All @@ -240,14 +240,14 @@ var ReactiveListener = function () {
}, {
key: 'record',
value: function record(event) {
this.performanceData[event] = Date.now();
this.performance[event] = Date.now();
}
}, {
key: 'update',
value: function update(_ref2) {
var src = _ref2.src,
loading = _ref2.loading,
error = _ref2.error;
var src = _ref2.src;
var loading = _ref2.loading;
var error = _ref2.error;

this.src = src;
this.loading = loading;
Expand Down Expand Up @@ -289,7 +289,6 @@ var ReactiveListener = function () {
loadImageAsync({
src: this.src
}, function (data) {
_this.src = data.src;
_this.naturalHeight = data.naturalHeight;
_this.naturalWidth = data.naturalWidth;
_this.state.loaded = true;
Expand All @@ -308,25 +307,6 @@ var ReactiveListener = function () {
value: function render(state, notify) {
this.elRenderer(this, state, notify);
}
}, {
key: 'performance',
value: function performance() {
var state = 'loading';
var time = 0;

if (this.state.loaded) {
state = 'loaded';
time = (this.performanceData.loadEnd - this.performanceData.loadStart) / 1000;
}

if (this.state.error) state = 'error';

return {
src: this.src,
state: state,
time: time
};
}
}, {
key: 'destroy',
value: function destroy() {
Expand All @@ -353,16 +333,16 @@ var Lazy = function () {
function Lazy(_ref) {
var _this = this;

var preLoad = _ref.preLoad,
error = _ref.error,
loading = _ref.loading,
attempt = _ref.attempt,
silent = _ref.silent,
scale = _ref.scale,
listenEvents = _ref.listenEvents,
hasbind = _ref.hasbind,
filter = _ref.filter,
adapter = _ref.adapter;
var preLoad = _ref.preLoad;
var error = _ref.error;
var loading = _ref.loading;
var attempt = _ref.attempt;
var silent = _ref.silent;
var scale = _ref.scale;
var listenEvents = _ref.listenEvents;
var hasbind = _ref.hasbind;
var filter = _ref.filter;
var adapter = _ref.adapter;

_classCallCheck(this, Lazy);

Expand Down Expand Up @@ -411,10 +391,12 @@ var Lazy = function () {
return Vue.nextTick(this.lazyLoadHandler);
}

var _valueFormatter = this.valueFormatter(binding.value),
src = _valueFormatter.src,
loading = _valueFormatter.loading,
error = _valueFormatter.error;
var _valueFormatter = this.valueFormatter(binding.value);

var src = _valueFormatter.src;
var loading = _valueFormatter.loading;
var error = _valueFormatter.error;


Vue.nextTick(function () {
var tmp = getBestSelectionFromSrcset(el, _this2.options.scale);
Expand Down Expand Up @@ -459,10 +441,12 @@ var Lazy = function () {
value: function update(el, binding) {
var _this3 = this;

var _valueFormatter2 = this.valueFormatter(binding.value),
src = _valueFormatter2.src,
loading = _valueFormatter2.loading,
error = _valueFormatter2.error;
var _valueFormatter2 = this.valueFormatter(binding.value);

var src = _valueFormatter2.src;
var loading = _valueFormatter2.loading;
var error = _valueFormatter2.error;


var exist = find(this.ListenerQueue, function (item) {
return item.el === el;
Expand Down Expand Up @@ -538,7 +522,12 @@ var Lazy = function () {
var list = [];

this.ListenerQueue.map(function (item) {
list.push(item.performance());
if (item.performance.loadEnd) {
list.push({
src: item.src,
time: (item.performance.loadEnd - item.performance.loadStart) / 1000
});
}
});

return list;
Expand All @@ -547,8 +536,8 @@ var Lazy = function () {
key: 'elRenderer',
value: function elRenderer(listener, state, notify) {
if (!listener.el) return;
var el = listener.el,
bindType = listener.bindType;
var el = listener.el;
var bindType = listener.bindType;


var src = void 0;
Expand Down Expand Up @@ -672,59 +661,43 @@ var LazyComponent = (function (lazy) {
};
});

var lazy = null;
var getLazyInstance = function getLazyInstance() {
if (!!lazy) {
return lazy;
}
lazy = new Lazy({});
return lazy;
};
var index = (function (Vue$$1) {
var options = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];

var index = {
install: function install(Vue$$1) {
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var lazy = new Lazy(options);
var isVueNext = Vue$$1.version.split('.')[0] === '2';

Object.assign(getLazyInstance().options, options);
var isVueNext = Vue$$1.version.split('.')[0] === '2';
Vue$$1.prototype.$Lazyload = lazy;
Vue$$1.component('lazy-component', LazyComponent(lazy));

Vue$$1.prototype.$Lazyload = lazy;
Vue$$1.component('lazy-component', LazyComponent(lazy));

if (isVueNext) {
Vue$$1.directive('lazy', {
bind: lazy.add.bind(lazy),
update: lazy.update.bind(lazy),
componentUpdated: lazy.lazyLoadHandler.bind(lazy),
unbind: lazy.remove.bind(lazy)
});
} else {
Vue$$1.directive('lazy', {
bind: lazy.lazyLoadHandler.bind(lazy),
update: function update(newValue, oldValue) {
assign(this.vm.$refs, this.vm.$els);
lazy.add(this.el, {
modifiers: this.modifiers || {},
arg: this.arg,
value: newValue,
oldValue: oldValue
}, {
context: this.vm
});
},
unbind: function unbind() {
lazy.remove(this.el);
}
});
}
},
config: function config() {
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

Object.assign(getLazyInstance().options, options);
if (isVueNext) {
Vue$$1.directive('lazy', {
bind: lazy.add.bind(lazy),
update: lazy.update.bind(lazy),
componentUpdated: lazy.lazyLoadHandler.bind(lazy),
unbind: lazy.remove.bind(lazy)
});
} else {
Vue$$1.directive('lazy', {
bind: lazy.lazyLoadHandler.bind(lazy),
update: function update(newValue, oldValue) {
assign(this.vm.$refs, this.vm.$els);
lazy.add(this.el, {
modifiers: this.modifiers || {},
arg: this.arg,
value: newValue,
oldValue: oldValue
}, {
context: this.vm
});
},
unbind: function unbind() {
lazy.remove(this.el);
}
});
}
};
});

return index;

})));
})));

0 comments on commit e5de921

Please sign in to comment.