Skip to content

Commit

Permalink
放开$(this.element).slider().destory();
Browse files Browse the repository at this point in the history 
并新增属性this.groupsLength
当this.groupsLength>1, close预览则清除slider对象
  • Loading branch information
@phillyx
phillyx committed Jan 29, 2016
1 parent a6da615 commit c75ab71
Show file tree
Hide file tree
Showing 2 changed files with 106 additions and 13 deletions.
98 changes: 87 additions & 11 deletions examples/hello-mui/js/mui.js
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
/*!
* =====================================================
* Mui v2.8.0 (http://dev.dcloud.net.cn/mui)
* Mui v2.8.1 (http://dev.dcloud.net.cn/mui)
* Edit by phillyx(github: https://github.com/phillyx/; blog: http://www.cnblogs.com/phillyx; email: [email protected])
* =====================================================
*/
/**
Expand Down Expand Up @@ -320,6 +321,15 @@ var mui = (function(document, undefined) {
$.hooks[type] = hooks;
return $.hooks[type];
};
$.removeActionByHookName = function(type, hookname) {
var hooks = $.hooks[type];
if (hooks) {
for (var i = 0, len = hooks.length; i < len; i++) {
if (hooks[i].name == hookname)
return hooks.splice(i, 1);
}
}
};
$.doAction = function(type, callback) {
if ($.isFunction(callback)) { //指定了callback
$.each($.hooks[type], callback);
Expand Down Expand Up @@ -1630,8 +1640,53 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
* @returns {undefined}
*/
(function($, name) {
//$.removeActionByHookName('gestures', 'tap');

var lastTarget;
var lastTapTime;
/*mui没有提供类似于jq.data('events')获取事件列表的机制
*使用getEventListeners,做测试。妈蛋，都只能在控制台使用
*添加全局变量isLongTapAtived以区分longtap和tap,然而 mui.gesture.longtap.js以下写法，无论dom有无添加longtap事件，$.isLongTapAtived = false;都执行，这样区分longtap和tap是不行的
* var handle = function(event, touch) {
console.log(event.target);
var session = $.gestures.session;
var options = this.options;
switch (event.type) {
case $.EVENT_START:
clearTimeout(timer);
timer = setTimeout(function() {
$.trigger(session.target, name, touch);
$.isLongTapAtived = true;
}, options.holdTimeout);
break;
case $.EVENT_MOVE:
if (touch.distance > options.holdThreshold) {
clearTimeout(timer);
}
break;
case $.EVENT_END:
case $.EVENT_CANCEL:
clearTimeout(timer);
break;
}
};
*解决方案：1目前看来只能重写tap事件并对longtap再新增一个tapOld事件了,tapOld使用框架的代码
* 2.$.isLongTapAtived依然添加，只是在每一次dom添加longtap事件时激活
* document.querySelector("#btn").addEventListener('longtap',function(){
* mui.isLongTapAtived=true;
console.log('你触发了longtap事件');
});
*目前使用第二种方案，代码重复量少，结构清晰，没有新增手势。
*/
var getEvents = function(obj) {
console.log(getEventListeners(obj));
return typeof(getEventListeners) == "function" && getEventListeners(obj);
}
var hasEventype = function(obj, e) {
var es = getEvents(obj);
console.log(es[e]);
return es && !!es[e];
}
var handle = function(event, touch) {
var session = $.gestures.session;
var options = this.options;
Expand All @@ -1644,16 +1699,25 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
if (!target || (target.disabled || (target.classList && target.classList.contains('mui-disabled')))) {
return;
}
if (touch.distance < options.tapMaxDistance && touch.deltaTime < options.tapMaxTime) {
if ($.options.gestureConfig.doubletap && lastTarget && (lastTarget === target)) { //same target
if (lastTapTime && (touch.timestamp - lastTapTime) < options.tapMaxInterval) {
$.trigger(target, 'doubletap', touch);
lastTapTime = $.now();
lastTarget = target;
return;
if (touch.distance < options.tapMaxDistance) {
if (touch.deltaTime < options.tapMaxTime) {
if ($.options.gestureConfig.doubletap && lastTarget && (lastTarget === target)) { //same target
if (lastTapTime && (touch.timestamp - lastTapTime) < options.tapMaxInterval) {
$.trigger(target, 'doubletap', touch);
lastTapTime = $.now();
lastTarget = target;
return;
}
}
$.trigger(target, name, touch);
} else {
//如果当前对象添加了长按侦听，略过，否则仍然视为tap事件
//if (!hasEventype(target, 'longtap')) {
if (!$.isLongTapAtived) {
$.trigger(target, name, touch);
}
$.isLongTapAtived = false;
}
$.trigger(target, name, touch);
lastTapTime = $.now();
lastTarget = target;
}
Expand Down Expand Up @@ -1682,6 +1746,11 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
* @returns {undefined}
*/
(function($, name) {
//$.removeActionByHookName('gestures','longtap');
/**
* @description 添加全局变量以区别longtap 和tap 事件
*/
$.isLongTapAtived = false;
var timer;
var handle = function(event, touch) {
var session = $.gestures.session;
Expand All @@ -1691,6 +1760,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
clearTimeout(timer);
timer = setTimeout(function() {
$.trigger(session.target, name, touch);
//$.isLongTapAtived = true;
}, options.holdTimeout);
break;
case $.EVENT_MOVE:
Expand Down Expand Up @@ -7326,11 +7396,17 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
plus.speech.startRecognize({
engine: 'iFly'
}, function(s) {
self.element.value += s;
//替换全角符号
self.element.value += self.element.value ? '，' : '';
//console.log('___s___'+JSON.stringify(s));
s.length > 1 && s.pop();
self.element.value += s.join('，');
self.element.value = self.element.value.replace(/，，/g, '，');
$.focus(self.element);
plus.speech.stopRecognize();
$.trigger(self.element, 'recognized', {
value: self.element.value
value: self.element.value,
oldValue: oldValue
});
if (oldValue !== self.element.value) {
$.trigger(self.element, 'change');
Expand Down
21 changes: 19 additions & 2 deletions examples/hello-mui/js/mui.previewimage.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
(function($, window) {

var template = '<div id="{{id}}" class="mui-slider mui-preview-image mui-fullscreen"><div class="mui-preview-header">{{header}}</div><div class="mui-slider-group"></div><div class="mui-preview-footer mui-hidden">{{footer}}</div><div class="mui-preview-loading"><span class="mui-spinner mui-spinner-white"></span></div></div>';
var itemTemplate = '<div class="mui-slider-item mui-zoom-wrapper {{className}}"><div class="mui-zoom-scroller"><img src="{{src}}" data-preview-lazyload="{{lazyload}}" style="{{style}}" class="mui-zoom"><div class="mui-slider-img-content">{{content}}</div></div></div>';//新增图片说明
var itemTemplate = '<div class="mui-slider-item mui-zoom-wrapper {{className}}"><div class="mui-zoom-scroller"><img src="{{src}}" data-preview-lazyload="{{lazyload}}" style="{{style}}" class="mui-zoom"><div class="mui-slider-img-content">{{content}}</div></div></div>'; //新增图片说明
var defaultGroupName = '__DEFAULT';
var div = document.createElement('div');
var imgId = 0;
Expand Down Expand Up @@ -37,6 +37,23 @@
this.element.querySelector($.classSelector('.preview-footer')).classList.remove($.className('hidden'));
}
this.addImages();
this.groupsLength=this.getGroupsLength();
};
/**
*@description 获取当前预览分组长度
*/
proto.getGroupsLength = function() {
var imgs = document.querySelectorAll("img[data-preview-src][data-preview-group]");
var tmpGroup;
var len = 0;
$.each(imgs, function(index, item) {
var grp = item.getAttribute('data-preview-group');
if (!tmpGroup || tmpGroup != grp) {
tmpGroup = grp;
len += 1;
}
});
return len || 1;
};
proto.initEvent = function() {
var self = this;
Expand Down Expand Up @@ -377,7 +394,7 @@
for (var i = 0, len = zoomers.length; i < len; i++) {
$(zoomers[i]).zoom().destory();
}
// $(this.element).slider().destory();
this.groupsLength > 1 && $(this.element).slider().destroy();
// this.empty();
};
proto.isShown = function() {
Expand Down

0 comments on commit c75ab71

Please sign in to comment.