Creating time event with mousedown |
Post Reply |
Author | |
djju1029
Senior Member Joined: Aug 02 2016 Location: the US Status: Offline Points: 126 |
Post Options
Thanks(0)
Posted: Jan 18 2017 at 8:37pm |
Dear OE Team,
My webapp has a function that power on/off should be operated with mousedown more than 3 seconds on power control icon in order to prevent unintentional operation problem. For example, - power icon is black - mousedown at power icon more than 3 seconds - within 3 sec, the left mouse button should be pressed and no mouseup. - After 3 sec, Popup comes that "Are you sure power on or off" - If user click "power on", then post power on value to system - After checking the power on status of system, icon should be changed to green. However, I tried to implement this feature but OE has mouseclick or mouseover. I have no idea this feature on my webapp. This feature acts like physical key polling mechnism on embedded system but it looks hard to implement on web. Please help me. Thank you so much DJ
|
|
Dmit OE
Admin Group Joined: May 31 2012 Status: Offline Points: 5283 |
Post Options
Thanks(1)
|
Hi,
It's relatively easy to implement it with jQuery, but of course it should be done manually as it's a specific logic. First, try to do it yourself, by consulting the following: jQuery mousedown jQuery mouseup Javascript setTimeout Javascript clearTimeout The idea: on mousedown, do window.timeoutID = setTimeout(function(){ /*your code after 3 sec. ex. alert("Are you sure power on or off") */}, 3000 /* millisecondes*/); on mouseup, do clearTimeout(window.timeoutID) to stop the timer if user releases mouse button too fast |
|
djju1029
Senior Member Joined: Aug 02 2016 Location: the US Status: Offline Points: 126 |
Post Options
Thanks(0)
|
Hi DmitOE,
I wrote mousedown time event as following: var timeout_id = 0; $('.mouse-event').mousedown(function() { timeout_id = setTimeout(function(){ window.open("../Popup/Popup_All_on_off.htm", "Popup", "location=1,status=1,scrollbars=1, resizable=no, directories=1, toolbar=1, titlebar=1, width=350, height=250")}, 3000); }).bind('mouseup mouseleave', function() { clearTimeout(timeout_id); }); But in firefox or opera browser, popup window wouldn't be poped up, it is blocked. However, when I use WELinkImage for popup when it is clicked as following: <div id="WE4db709651f" class="BaseDiv RBoth OEWELinkImage OESK_WELinkImage_Default" style="z-index:12" onclick="return OE.Navigate.popup(event,'../Popup/Popup_All_on_off.htm','',350,250,-1,-1,'toolbar=no,location=no,directories=no,menubar=no,status=no,scrollbars=no,resizable=no')"> <div class="OESZ OESZ_DivContent OESZG_WE4db709651f"> <a href="../Popup/Popup_All_on_off.htm"><img style="width:100%;height:100%;border:none" src="../WEFiles/Image/empty.png" /></a> </div> </div> It is popup on any browser without blocking. How can I pop up the windows as simulated as clicking WELinkImage using mousedown event?
|
|
Dmit OE
Admin Group Joined: May 31 2012 Status: Offline Points: 5283 |
Post Options
Thanks(1)
|
Browsers have their security/antispam policies concerning popups. In the second example, the popup opens on the CLICK event, and in the first you try to open it on mousedown event, and I think that's what browsers dislike. If you change "mousedown" to "click" it may start to work, though it will probably not be what you want (this I can't know)
|
|
djju1029
Senior Member Joined: Aug 02 2016 Location: the US Status: Offline Points: 126 |
Post Options
Thanks(0)
|
I see. I'm gonna look at and try an alternative way.
If I can find a way, let you know. Thanks anyway.
|
|
Dmit OE
Admin Group Joined: May 31 2012 Status: Offline Points: 5283 |
Post Options
Thanks(0)
|
Rather than opening a popup window you can create a tag with an iframe in it to act as popup (you can use the downloadable Modal Popup element - see Elements->More elements) and put the External pageelement inside it. Or, you can open a popup in advance on some user click and reuse it, though it may become complicated.
|
|
Post Reply | |
Tweet
|
Forum Jump | Forum Permissions You cannot post new topics in this forum You cannot reply to topics in this forum You cannot delete your posts in this forum You cannot edit your posts in this forum You cannot create polls in this forum You cannot vote in polls in this forum |