Tag Archives: two finf=ger gesture

WordPress Blog Collaborative Annotated Email Cedes to Context Menu Tutorial

Up until the work of this blog posting (a few days ago by the time this posting “goes to air”) the “highlighted text” on this WordPress Blog work talked about with WordPress Blog Collaborative Annotated Email FormData Post Tutorial only talked about the inhouse aspects to this functionality, perhaps understandably. This was quite brazen, and today we set out to “un”brazen it. What happens when you highlight text on a webpage and two finger gesture on macOS or right click on Windows? Yes, you are presented with a “Context Menu” (containing “Copy” option at the very least) dependent on the web browser and operating system overseeing that webpage. Well, quite often our “inhouse work” was effectively “swallowing up” the chance to get to the “Context Menu” because not enough delay had been coded into our functionality. And so, onto this WordPress Blog’s Twenty Ten theme’s header.php we changed … function delayshow() { document.getElementById(‘hfloater’).style.display=’block’; } function lookforhighlight() { var usualdelay=2000, oRange=null, oRect=null, s_top=’0px’, s_left=’5px’, fourhundred=300, isfx=’0′; usualdelay=9000; // new bigger delay allowing for normal copy/paste to get in first, perhaps if (hight == ‘ ‘) { setTimeout(lfhlater, 12000); // 5000); hight=”; } if (!document.getElementById(‘phfloater’)) { setTimeout(lookforhighlight, usualdelay); var xsel=window.getSelection().toString(); if (xsel.length == 0) { try { xsel=document.selection.createRange().htmlText; xsel=xsel.replace(String.fromCharCode(10),’ ‘).replace(String.fromCharCode(10),’ ‘).replace(String.fromCharCode(10),’ ‘).replace(String.fromCharCode(10),’ ‘); xsel=xsel.replace(String.fromCharCode(13),’ ‘).replace(String.fromCharCode(13),’ ‘).replace(String.fromCharCode(13),’ ‘).replace(String.fromCharCode(13),’ ‘); } catch(ertw) { xsel=”; } } else { xsel=xsel.replace(String.fromCharCode(10),’ ‘).replace(String.fromCharCode(10),’ ‘).replace(String.fromCharCode(10),’ ‘).replace(String.fromCharCode(10),’ ‘); xsel=xsel.replace(String.fromCharCode(13),’ ‘).replace(String.fromCharCode(13),’ ‘).replace(String.fromCharCode(13),’ ‘).replace(String.fromCharCode(13),’ ‘); if (xsel != hight && xsel != ”) { oRange = window.getSelection().getRangeAt(0); //get the text range oRect = oRange.getBoundingClientRect(); s_top = (” + oRect.top).replace(‘px’,”) + ‘px’; s_left = (” + oRect.left).replace(‘px’,”) + ‘px’; if (s_top != ‘0px’) { fourhundred=eval(” + s_top.replace(‘px’,”)); s_top=’0px’; var dse=”, dde=”; if (document.scrollingElement) { if (document.scrollingElement.scrollTop) { dse=(” + document.scrollingElement.scrollTop); } } if (document.documentElement) { if (document.documentElement.scrollTop) { dde=(” + document.documentElement.scrollTop); } } if (dse != ”) { fourhundred+=eval(” + dse.replace(‘px’,”)); isfx=’0′; } else if (dde != ”) { fourhundred+=eval(” + dde.replace(‘px’,”)); isfx=’0′; } else if ((” + window.scrollY) != ”) { fourhundred+=eval(” + (” + window.scrollY).replace(‘px’,”)); isfx=’0′; } else if ((” + window.pageYOffset) != ”) { fourhundred+=eval(” + (” + window.pageYOffset).replace(‘px’,”)); isfx=’0′; } else { isfx=(” + document.body.scrollTop).replace(‘px’,”); if (isfx.replace(‘0’,”) == ”) { isfx=(” + document.scrollingElement.scrollTop).replace(‘px’,”); if (isfx.replace(‘0’,”) == ”) { isfx=(” + window.scrollY).replace(‘px’,”); if (isfx.replace(‘0’,”) == ”) { isfx=(” + window.pageYOffset).replace(‘px’,”); } } } } fourhundred+=100; } } } if (xsel != hight && xsel != ”) { hight=xsel; if (s_top == ‘0px’) { s_top = (” + eval(fourhundred + eval(” + isfx))) + ‘px’; } if (document.getElementById(‘hfloater’)) { if (document.getElementById(‘hfloater’).innerHTML == ”) { document.getElementById(‘hfloater’).style.position=’absolute’; document.getElementById(‘hfloater’).style.top=s_top; document.getElementById(‘hfloater’).style.left=s_left; document.getElementById(‘hfloater’).style.zIndex=’87’; document.getElementById(‘hfloater’).style.backgroundColor=’rgba(255,165,0,0.9)’; document.getElementById(‘hfloater’).style.border=’1px solid purple’; document.getElementById(‘hfloater’).style.padding=’2px 2px 2px 2px’; setTimeout(delayshow, 8000); //document.getElementById(‘hfloater’).style.display=’block’; document.getElementById(‘hfloater’).innerHTML='<b>Wikipedia <a style=”inline-block;” href=”//wikipedia.org/wiki/Main_Page” title=”//wikipedia.org/wiki/” target=_blank onmouseover=”this.href=this.title + hight.replace(/\ /g,’ + “‘_'” + ‘);” ontouchstart=”this.href=this.title + hight.replace(/\ /g,’ + “‘_'” + ‘);” id=b_hfloater_wikipedia>’ + hight + ‘</a></b><br>’; document.getElementById(‘hfloater’).innerHTML+='<b>Google Translate <a style=”inline-block;” href=”//translate.google.com” title=”//translate.google.com/#view=home&op=translate&sl=auto&tl=en&text=” target=_blank onmouseover=”this.href=this.title + encodeURIComponent(hight);” ontouchstart=”this.href=this.title + encodeURIComponent(hight);” id=b_hfloater_google_translate>’ … Continue reading →

Posted in eLearning, Event-Driven Programming, Tutorials | Tagged , , , , , , , , , , , , , , , | Leave a comment