{"id":54053,"date":"2022-02-01T03:01:55","date_gmt":"2022-01-31T17:01:55","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=54053"},"modified":"2022-01-27T20:54:47","modified_gmt":"2022-01-27T10:54:47","slug":"wordpress-blog-collaborative-annotated-email-cedes-to-context-menu-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wordpress-blog-collaborative-annotated-email-cedes-to-context-menu-tutorial\/","title":{"rendered":"WordPress Blog Collaborative Annotated Email Cedes to Context Menu Tutorial"},"content":{"rendered":"
\"WordPress<\/a>

WordPress Blog Collaborative Annotated Email Cedes to Context Menu Tutorial<\/p><\/div>\n

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<\/a> only talked about the inhouse aspects to this functionality, perhaps understandably.<\/p>\n

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.<\/p>\n

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.<\/p>\n

And so, onto this WordPress Blog’s Twenty Ten theme’s header.php we changed<\/font> …<\/p>\n


\nfunction delayshow() {
\n document.getElementById('hfloater').style.display='block';
\n}<\/font>
\n
\nfunction lookforhighlight() {
\n var usualdelay=2000, oRange=null, oRect=null, s_top='0px', s_left='5px', fourhundred=300, isfx='0';
\n usualdelay=9000; \/\/ new bigger delay allowing for normal copy\/paste to get in first, perhaps<\/font>
\n if (hight == ' ') {
\n setTimeout(lfhlater, 12000); \/\/ <\/font>5000);
\n hight='';
\n }
\n if (!document.getElementById('phfloater')) {
\n setTimeout(lookforhighlight, usualdelay);
\n var xsel=window.getSelection().toString();
\n if (xsel.length == 0) {
\n try {
\n xsel=document.selection.createRange().htmlText;
\n xsel=xsel.replace(String.fromCharCode(10),' ').replace(String.fromCharCode(10),' ').replace(String.fromCharCode(10),' ').replace(String.fromCharCode(10),' ');
\n xsel=xsel.replace(String.fromCharCode(13),' ').replace(String.fromCharCode(13),' ').replace(String.fromCharCode(13),' ').replace(String.fromCharCode(13),' ');
\n } catch(ertw) {
\n xsel='';
\n }
\n } else {
\n xsel=xsel.replace(String.fromCharCode(10),' ').replace(String.fromCharCode(10),' ').replace(String.fromCharCode(10),' ').replace(String.fromCharCode(10),' ');
\n xsel=xsel.replace(String.fromCharCode(13),' ').replace(String.fromCharCode(13),' ').replace(String.fromCharCode(13),' ').replace(String.fromCharCode(13),' ');
\n if (xsel != hight && xsel != '') {
\n oRange = window.getSelection().getRangeAt(0); \/\/get the text range
\n oRect = oRange.getBoundingClientRect();
\n s_top = ('' + oRect.top).replace('px','') + 'px';
\n s_left = ('' + oRect.left).replace('px','') + 'px';
\n if (s_top != '0px') {
\n fourhundred=eval('' + s_top.replace('px',''));
\n s_top='0px';
\n var dse='', dde='';
\n if (document.scrollingElement) {
\n if (document.scrollingElement.scrollTop) {
\n dse=('' + document.scrollingElement.scrollTop);
\n }
\n }
\n if (document.documentElement) {
\n if (document.documentElement.scrollTop) {
\n dde=('' + document.documentElement.scrollTop);
\n }
\n }
\n if (dse != '') {
\n fourhundred+=eval('' + dse.replace('px',''));
\n isfx='0';
\n } else if (dde != '') {
\n fourhundred+=eval('' + dde.replace('px',''));
\n isfx='0';
\n } else if (('' + window.scrollY) != '') {
\n fourhundred+=eval('' + ('' + window.scrollY).replace('px',''));
\n isfx='0';
\n } else if (('' + window.pageYOffset) != '') {
\n fourhundred+=eval('' + ('' + window.pageYOffset).replace('px',''));
\n isfx='0';
\n } else {
\n isfx=('' + document.body.scrollTop).replace('px','');
\n if (isfx.replace('0','') == '') {
\n isfx=('' + document.scrollingElement.scrollTop).replace('px','');
\n if (isfx.replace('0','') == '') {
\n isfx=('' + window.scrollY).replace('px','');
\n if (isfx.replace('0','') == '') {
\n isfx=('' + window.pageYOffset).replace('px','');
\n }
\n }
\n }
\n }
\n fourhundred+=100;
\n }
\n }
\n }
\n if (xsel != hight && xsel != '') {
\n hight=xsel;
\n if (s_top == '0px') { s_top = ('' + eval(fourhundred + eval('' + isfx))) + 'px'; }
\n if (document.getElementById('hfloater')) {
\n if (document.getElementById('hfloater').innerHTML == '') {
\n document.getElementById('hfloater').style.position='absolute';
\n document.getElementById('hfloater').style.top=s_top;
\n document.getElementById('hfloater').style.left=s_left;
\n document.getElementById('hfloater').style.zIndex='87';
\n document.getElementById('hfloater').style.backgroundColor='rgba(255,165,0,0.9)';
\n document.getElementById('hfloater').style.border='1px solid purple';
\n document.getElementById('hfloater').style.padding='2px 2px 2px 2px';
\n setTimeout(delayshow, 8000); \/\/<\/font>document.getElementById('hfloater').style.display='block';
\n 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>';
\n 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>' + hight + '<\/a><\/b><br>';
\n document.getElementById('hfloater').innerHTML+='<b>Free Dictionary <a style=\"inline-block;\" href=\"\/\/www.thefreedictionary.com\/\" title=\"\/\/www.thefreedictionary.com\/\" target=_blank onmouseover=\"this.href=this.title + hight.replace(\/\\ \/g,' + \"'+'\" + ');\" ontouchstart=\"this.href=this.title + hight.replace(\/\\ \/g,' + \"'+'\" + ');\" id=b_hfloater_free_dictionary>' + hight + '<\/a><\/b><br>';
\n document.getElementById('hfloater').innerHTML+='<b>Google Search <a style=\"inline-block;\" href=\"\/\/www.google.com\/\" title=\"\/\/www.google.com\/search?q=\" target=_blank onmouseover=\"this.href=this.title + hight.replace(\/\\ \/g,' + \"'+'\" + ');\" ontouchstart=\"this.href=this.title + hight.replace(\/\\ \/g,' + \"'+'\" + ');\" id=b_hfloater_google_search>' + hight + '<\/a><\/b><br>';
\n document.getElementById('hfloater').innerHTML+='<b>Tag Search <a style=\"inline-block;\" href=\"\/\/www.rjmprogramming.com.au\/ITblog\/\" title=\"\/\/www.rjmprogramming.com.au\/ITblog\/tag\/\" target=_blank onmouseover=\"this.href=this.title + hight.replace(\/\\ \/g,' + \"'-'\" + ');\" ontouchstart=\"this.href=this.title + hight.replace(\/\\ \/g,' + \"'-'\" + ');\" id=b_hfloater_tag_search>' + hight + '<\/a><\/b><br>';
\n document.getElementById('hfloater').innerHTML+='<b>Category Search <a style=\"inline-block;\" href=\"\/\/www.rjmprogramming.com.au\/ITblog\/\" title=\"\/\/www.rjmprogramming.com.au\/ITblog\/category\/\" target=_blank onmouseover=\"this.href=this.title + hight.replace(\/\\ \/g,' + \"'-'\" + ');\" ontouchstart=\"this.href=this.title + hight.replace(\/\\ \/g,' + \"'-'\" + ');\" id=b_hfloater_category_search>' + hight + '<\/a><\/b><br>';
\n document.getElementById('hfloater').innerHTML+='<b>Tag First Word Search <a style=\"inline-block;\" href=\"\/\/www.rjmprogramming.com.au\/ITblog\/\" title=\"\/\/www.rjmprogramming.com.au\/ITblog\/tag\/\" target=_blank onmouseover=\"this.href=this.title + hight.replace(\/\\ \/g,' + \"'-'\" + ').replace(' + \"'-','\/?wopenall='\" + ');\" ontouchstart=\"this.href=this.title + hight.replace(\/\\ \/g,' + \"'-'\" + ').replace(' + \"'-','\/?wopenall='\" + ');\" id=b_hfloater_tag_first_word_search>' + hight + '<\/a><\/b><br>';
\n document.getElementById('hfloater').innerHTML+='<b>Posting Title Search <a style=\"inline-block;\" href=\"\/\/www.rjmprogramming.com.au\/itblog\/match\/mapper.php\" title=\"\/\/www.rjmprogramming.com.au\/itblog\/match\/mapper.php?pm=\" target=_blank onmouseover=\"this.href=this.title + encodeURIComponent(hight);\" ontouchstart=\"this.href=this.title + encodeURIComponent(hight);\" id=b_hfloater_posting_title_search>' + hight + '<\/a><\/b><br>';
\n } else {
\n document.getElementById('b_hfloater_wikipedia').innerHTML=hight;
\n document.getElementById('b_hfloater_google_translate').innerHTML=hight;
\n document.getElementById('b_hfloater_free_dictionary').innerHTML=hight;
\n document.getElementById('b_hfloater_google_search').innerHTML=hight;
\n document.getElementById('b_hfloater_tag_search').innerHTML=hight;
\n document.getElementById('b_hfloater_category_search').innerHTML=hight;
\n document.getElementById('b_hfloater_tag_first_word_search').innerHTML=hight;
\n document.getElementById('b_hfloater_posting_title_search').innerHTML=hight;
\n document.getElementById('hfloater').style.top=s_top;
\n document.getElementById('hfloater').style.left=s_left;
\n setTimeout(delayshow, 8000); \/\/<\/font>document.getElementById('hfloater').style.display='block';
\n }
\n }
\n } else if (xsel == '') {
\n if (document.getElementById('hfloater')) {
\n document.getElementById('hfloater').style.display='none';
\n }
\n hight='';
\n }
\n }
\n}
\n<\/code><\/p>\n

… meant that both the “Context Menu” and our “inhouse menu” could co-exist happily.<\/p>\n

\n

\n

Previous relevant WordPress Blog Collaborative Annotated Email FormData Post Tutorial<\/a> is shown below.<\/p>\n

\"WordPress<\/a>

WordPress Blog Collaborative Annotated Email FormData Post Tutorial<\/p><\/div>\n

Yesterday’s WordPress Blog Collaborative Annotated Email User Experience Tutorial<\/a> helped with practicalities regarding user experience with this WordPress Blog highlighting of text accumulated into the body (as HTML attachment) and subject (as text) of an Annotated Email form of collaborative communication.<\/p>\n

The “subject” extension here makes it all the more important to try to look out for long email URLs that will exceed the web server limit here. When too long, that …<\/p>\n