mirror of
https://github.com/lxsang/antos-frontend.git
synced 2024-12-26 17:38:20 +01:00
fix: simulate contextmenu on mobile device
This commit is contained in:
parent
6ac2429dba
commit
5605d6c35a
2
d.ts/antos.d.ts
vendored
2
d.ts/antos.d.ts
vendored
@ -4164,7 +4164,6 @@ declare namespace OS {
|
|||||||
* @type {TagEventCallback<ListItemEventData>}
|
* @type {TagEventCallback<ListItemEventData>}
|
||||||
* @memberof ListViewItemTag
|
* @memberof ListViewItemTag
|
||||||
*/
|
*/
|
||||||
private _onctxmenu;
|
|
||||||
/**
|
/**
|
||||||
* Click event callback placeholder
|
* Click event callback placeholder
|
||||||
*
|
*
|
||||||
@ -4223,7 +4222,6 @@ declare namespace OS {
|
|||||||
*
|
*
|
||||||
* @memberof ListViewItemTag
|
* @memberof ListViewItemTag
|
||||||
*/
|
*/
|
||||||
set onctxmenu(v: TagEventCallback<ListViewItemTag>);
|
|
||||||
/**
|
/**
|
||||||
* Set the item click event handle
|
* Set the item click event handle
|
||||||
*
|
*
|
||||||
|
@ -245,11 +245,11 @@ jQuery.event.special.dbltap = {
|
|||||||
var handleObj = event.handleObj,
|
var handleObj = event.handleObj,
|
||||||
targetData = jQuery.data(event.target),
|
targetData = jQuery.data(event.target),
|
||||||
now = new Date().getTime(),
|
now = new Date().getTime(),
|
||||||
delta = targetData.lastTouch ? now - targetData.lastTouch : 0,
|
delta = targetData.lastTouchEnd ? now - targetData.lastTouchEnd : 0,
|
||||||
delay = delay == null ? 300 : delay;
|
delay = delay == null ? 300 : delay;
|
||||||
|
|
||||||
if (delta < delay && delta > 30) {
|
if (delta < delay && delta > 30) {
|
||||||
targetData.lastTouch = null;
|
targetData.lastTouchEnd = null;
|
||||||
event.type = handleObj.origType;
|
event.type = handleObj.origType;
|
||||||
['clientX', 'clientY', 'pageX', 'pageY'].forEach(function (property) {
|
['clientX', 'clientY', 'pageX', 'pageY'].forEach(function (property) {
|
||||||
event[property] = event.originalEvent.changedTouches[0][property];
|
event[property] = event.originalEvent.changedTouches[0][property];
|
||||||
@ -258,11 +258,46 @@ jQuery.event.special.dbltap = {
|
|||||||
// let jQuery handle the triggering of "dbltap" event handlers
|
// let jQuery handle the triggering of "dbltap" event handlers
|
||||||
handleObj.handler.apply(this, arguments);
|
handleObj.handler.apply(this, arguments);
|
||||||
} else {
|
} else {
|
||||||
targetData.lastTouch = now;
|
targetData.lastTouchEnd = now;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* JQuery event-extensions to support long touch event on
|
||||||
|
* mobile device
|
||||||
|
*/
|
||||||
|
jQuery.event.special.longtouch = {
|
||||||
|
bindType: 'touchstart',
|
||||||
|
//delegateType: 'touchstart',
|
||||||
|
|
||||||
|
handle: function (evt: any) {
|
||||||
|
let targetData = jQuery.data(evt.target);
|
||||||
|
let handleObj = evt.handleObj;
|
||||||
|
targetData.lastTouchStart = new Date().getTime();
|
||||||
|
|
||||||
|
$(evt.target).on("touchend", (event) => {
|
||||||
|
let now = new Date().getTime();
|
||||||
|
let end_targetData = jQuery.data(event.target);
|
||||||
|
let delta = end_targetData.lastTouchStart ? now - end_targetData.lastTouchStart : 0;
|
||||||
|
$(event.target).off("touchend");
|
||||||
|
const offset_top = Math.abs(event.originalEvent.changedTouches[0].clientY - evt.originalEvent.changedTouches[0].clientY);
|
||||||
|
const offset_left = Math.abs(event.originalEvent.changedTouches[0].clientX - evt.originalEvent.changedTouches[0].clientX);
|
||||||
|
console.log(offset_left, offset_top);
|
||||||
|
if(delta > 1000 && offset_top < 10 && offset_left < 10)
|
||||||
|
{
|
||||||
|
['clientX', 'clientY', 'pageX', 'pageY'].forEach(function (property) {
|
||||||
|
evt[property] = event.originalEvent.changedTouches[0][property];
|
||||||
|
})
|
||||||
|
event.preventDefault();
|
||||||
|
evt.type = handleObj.origType;
|
||||||
|
handleObj.handler.apply(this, arguments);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* This namespace is the main entry point of AntOS
|
* This namespace is the main entry point of AntOS
|
||||||
* API
|
* API
|
||||||
|
@ -1099,7 +1099,7 @@ namespace OS {
|
|||||||
|
|
||||||
const ctxmenu = $("#contextmenu")[0];
|
const ctxmenu = $("#contextmenu")[0];
|
||||||
ctxmenu.uify(undefined);
|
ctxmenu.uify(undefined);
|
||||||
$("#wrapper").on("contextmenu", (e) => bindContextMenu(e));
|
$("#wrapper").on(OS.mobile?"longtouch":"contextmenu", (e) => bindContextMenu(e as JQuery.MouseEventBase));
|
||||||
// tooltip
|
// tooltip
|
||||||
$(document).on("mouseover", function (e) {
|
$(document).on("mouseover", function (e) {
|
||||||
const el: any = $(e.target).closest("[tooltip]");
|
const el: any = $(e.target).closest("[tooltip]");
|
||||||
|
@ -42,7 +42,7 @@ namespace OS {
|
|||||||
* @type {TagEventCallback<ListItemEventData>}
|
* @type {TagEventCallback<ListItemEventData>}
|
||||||
* @memberof ListViewItemTag
|
* @memberof ListViewItemTag
|
||||||
*/
|
*/
|
||||||
private _onctxmenu: TagEventCallback<ListItemEventData>;
|
//private _onctxmenu: TagEventCallback<ListItemEventData>;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Click event callback placeholder
|
* Click event callback placeholder
|
||||||
@ -77,7 +77,7 @@ namespace OS {
|
|||||||
*/
|
*/
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this._onselect = this._onctxmenu = this._onclick = this._ondbclick = this._onclose = (
|
this._onselect /*= this._onctxmenu*/ = this._onclick = this._ondbclick = this._onclose = (
|
||||||
e
|
e
|
||||||
) => {};
|
) => {};
|
||||||
}
|
}
|
||||||
@ -134,9 +134,11 @@ namespace OS {
|
|||||||
*
|
*
|
||||||
* @memberof ListViewItemTag
|
* @memberof ListViewItemTag
|
||||||
*/
|
*/
|
||||||
|
/*
|
||||||
set onctxmenu(v: TagEventCallback<ListViewItemTag>) {
|
set onctxmenu(v: TagEventCallback<ListViewItemTag>) {
|
||||||
this._onctxmenu = v;
|
this._onctxmenu = v;
|
||||||
}
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Set the item click event handle
|
* Set the item click event handle
|
||||||
@ -173,10 +175,11 @@ namespace OS {
|
|||||||
*/
|
*/
|
||||||
protected mount(): void {
|
protected mount(): void {
|
||||||
$(this).addClass("afx-list-item");
|
$(this).addClass("afx-list-item");
|
||||||
$(this.refs.item).on("contextmenu", (e) => {
|
/*
|
||||||
|
$(this.refs.item).on(OS.mobile?"longtouch":"contextmenu", (e) => {
|
||||||
this._onctxmenu({ id: this.aid, data: this });
|
this._onctxmenu({ id: this.aid, data: this });
|
||||||
});
|
});
|
||||||
|
*/
|
||||||
$(this.refs.item).on("click",(e) => {
|
$(this.refs.item).on("click",(e) => {
|
||||||
this._onclick({ id: this.aid, data: this, originalEvent: e });
|
this._onclick({ id: this.aid, data: this, originalEvent: e });
|
||||||
//e.stopPropagation();
|
//e.stopPropagation();
|
||||||
@ -960,9 +963,10 @@ namespace OS {
|
|||||||
el[0].uify(this.observable);
|
el[0].uify(this.observable);
|
||||||
const element = el[0] as ListViewItemTag;
|
const element = el[0] as ListViewItemTag;
|
||||||
$(element).attr("list-id",this.aid);
|
$(element).attr("list-id",this.aid);
|
||||||
|
/*
|
||||||
element.onctxmenu = (e) => {
|
element.onctxmenu = (e) => {
|
||||||
return this.iclick(e, true);
|
return this.iclick(e, true);
|
||||||
};
|
};*/
|
||||||
element.onitemdbclick = (e) => {
|
element.onitemdbclick = (e) => {
|
||||||
this.idbclick(e);
|
this.idbclick(e);
|
||||||
this.iclick(e, false);
|
this.iclick(e, false);
|
||||||
|
@ -2,6 +2,7 @@ afx-apps-dock{
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
-webkit-user-select:none;
|
||||||
}
|
}
|
||||||
afx-apps-dock afx-button button{
|
afx-apps-dock afx-button button{
|
||||||
width: 40px;
|
width: 40px;
|
||||||
|
@ -49,6 +49,7 @@ body
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
user-select:none;
|
user-select:none;
|
||||||
|
-webkit-user-select:none;
|
||||||
cursor: default;
|
cursor: default;
|
||||||
padding:0px;
|
padding:0px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
Loading…
Reference in New Issue
Block a user