I'm working on a Chrome extension but I don't seem to be able to go past the first few lines.
The problem is that when I click on the context menu it fails to grab the selection from the document. It works fine obviously when I use it as a simple script included in an HTML page.
Here's the code:
var id = chrome.contextMenus.create({
"title" : "Search",
"contexts" : ["selection"],
"onclick" : openUrl
});
function openUrl() {
var sel = window.getSelection().toString().trim()
alert(sel)
}
This code returns an empty alert box.
I have a script that on mouseup grabs the word that the user has selected and searches for this word on a dictionary. This script works fine I just need to execute it when the user clicks "Search" in the context menu.
So what I'm looking for is:
1) User selects a word from the document
2) Right clicks on it and clicks on the context menu
3) The script containing all instruction to be executed on that click.
I looked around before asking this question but I couldn't find anything probably because I'm pretty new to this awesome site. Please feel free to redirect me to other similiar question if I missed any. Thanks!
function openUrl(info, tab) {
alert(info.selectionText);
}
Related
Using Cognos Analtyics 11.1.7IF9.
I have a user who, oddly enough, wants Cognos to make his workflow more efficient. (The nerve!) He thinks that if he can use the TAB button to navigate a prompt page, he'll be faster because he never needs to reach for the mouse.
To test this I created a simple report with a very simple prompt page using only textbox prompts. As I tab I notice it tabs to everything in the browser: browser tabs, the address bar, other objects in Cognos, ...even the labels (text items) I created for the prompts. Oh... and yes, at some point focus lands on a prompt control.
Within Cognos, I see that the tab order generally appears to be from the top down. (I haven't tried multiple columns of prompts in a table yet.) I must tab through the visual elements between the prompts. Also, while value prompts get focus, there is no visible indication of this.
Is there a way to set the tab order for the prompts on a prompt page?
Can I force it to skip the non-prompt elements?
Can the prompts be made to indicate that they have focus?
I tagged this question with javascript because I figure the answer will likely involve a Custom Control or a Page Module.
Of course, then I'll need to figure out how all this will work with cascading prompts and conditional blocks.
I found a similar post complaining about this being a problem in Cognos 8. The answer contains no detail. It just says to go to a non-existent web page.
I had the same frustration as your user and I made a solution a while back that could work for you. It's not the most elegant javascript and I get a weird error in the console but functionally it works so I haven't needed to fix it.
I created a custom control script that does 2 things on a prompt page.
First, it removes the ability to "select" text item elements on the page. If you only have text items and prompts on the page it sets it's "Tabindex" to "-1". This allows you to tab from one prompt field to the next without it selecting invisible elements or text elements between prompts.
Secondly, if you press "Enter" on the keyboard it automatically submits the form. I am pasting the code below which you can save as a .js and call it in a custom control on a prompt page. Set the UI Type to "None"
define( function() {
"use strict";
function AdvancedControl()
{
};
AdvancedControl.prototype.initialize = function( oControlHost, fnDoneInitializing )
{
function enterSubmit (e)
{
if(e.keyCode === 13)
{
try {oControlHost.finish();} catch {}
}
};
function setTab () {
let nL = [...document.querySelectorAll("[specname=textItem]")]
//console.log(nL)
nL.forEach((node) =>{
node.setAttribute('tabindex','-1')
})
};
setTab();
let exec_submit = document.addEventListener("keydown", enterSubmit, false);
try {exec_submit;} catch {}
fnDoneInitializing();
};
return AdvancedControl;
});
i'm facing this strange problem for the first time.
Probably is something really easy but i can't get out.
If you open the menu in this page:
https://danielepinazzi.com/fabric/
and you try to navigate into that page with anchor link, it works perfectly.
If you open the "contact us" page and then try to click on another link in the menu, like "what we do" it will close the menu and do nothing. But if you try to right click and select "open in a new tab", it work.
Edit because i need to explain better:
I've already added the absolute link in the menu, not only the anchor.
The section #whatwedo is linked with https://danielepinazzi.com/fabric/#whatwedo
I'm using Chrome on a Mac.
Can someone explain this to me?
Thank you and have a nice day you all.
I inspected whats going on there, you have a code block as mentioned below;
When i do what you said on the problem, isSamePage returns true because you are splitting anchor tag on href variable
$this.attr("href").split("#")[0]
and it returns https://danielepinazzi.com/fabric/ which is already in url.
That makes isSamePage true according the code and prevents the action.
$(".mk-fullscreen-nav-close, .mk-fullscreen-nav-wrapper, #fullscreen-navigation a").on("click", function(e) {
$(".mk-fullscreen-nav").removeClass("opened"),
$(".mk-dashboard-trigger").removeClass("fullscreen-active"),
$("body").removeClass("fullscreen-nav-opened");
var anchor = MK.utils.detectAnchor(this)
, $this = $(this)
, href = $this.attr("href").split("#")[0]
, url = window.location.href
, isSamePage = -1 !== url.indexOf(href);
anchor.length ? (isSamePage && e.preventDefault(),
MK.utils.scrollToAnchor(anchor)) : "#" === $this.attr("href") && e.preventDefault()
})
You have probably added anchor links via the menu like #link. Those links only work if you are on the page where these anchors are placed. If you want them to work when you are on another page, you should add them as /fabric/#link since the homepage for your project is /fabric/.
Note: it is easiest if you use absolute URL's in your menu (i.e. https://danielepinazzi.com/fabric/#whatwedo instead of just #whatwedo. Don't forget to update those if you migrate to a production environment.
I'm currently using window.location.href.indexOf in my current project. I've noticed that it doesn't seem to work properly. For example this code that I made.
$(document).ready(function () {
//Show Sign Up drawer if user clicks on referral link
//It will show the Sign Up drawer once the word "referral" is found in the URL
if (window.location.href.indexOf("?referral") > -1) {
console.log('Sign Up Drawer');
$(".header-form-container.signup").addClass("show"),
}
});
This code what it does is to add a class in an element if the word referral is found in the URL. The add class being inserted will then slide a sign up drawer. Here is what happened during testing.
In my first test, I tried inserting the word referral in the url. After typing in the word and pressing the Enter key, the javascript I'm trying to run did not trigger
But after refreshing the browser or inserting the word again it now works. It currently shows the sign up section.
How can I ensure that the code window.location.href.indexOf will work in the first try or without refreshing the browser again. The website is built on a angular framework
If you only change the URL after the # sign, the page won't reload, since you're only changing the anchor part of the URL.
Your code wrapped in $(document).ready(function () { ... will only run once, when the page loads.
What you want to do is to add a listener for the route change event and run your code in that handler, something like this:
$rootScope.$on("$routeChangeSuccess", function() {
if (window.location.href.indexOf("?referral") > -1) {
console.log('Sign Up Drawer');
$(".header-form-container.signup").addClass("show"),
}
});
It does not work because your script (e.g: main.js) is executed only one time when the page load.
You might want to use window.historyto manipulate the browser history. You can update the query string with pushState()
History API
Hope it helps.
I have set up a pop up sign up box to show on first site arrival that is loaded using a .js file called inside the <head> tag and this all works fine.
How can i get it to re-show if a menu link is clicked?
Obviously when i link it like this below it will open the file itself containing the codes.
Mailing List
So how do i get it to carry out the function that's in popup.js when the above link is clicked?
Edit: I was able to get the pop up to show by using the below thank you all who contributed.
Mailing List
Now to complete what i'm trying to achieve is to ignore/disable the cookie being set that stops the popup from showing the next time the link is clicked.
function AlreadyBeenNewsletter()
and
function SetNewsletterCookie()
Link to the actual js file
If the JS is already included, you could use the onclick attribute. It will run JS code when a link is clicked.
Mailing List
For the second part of your question, I would create two functions. One that shows the popup without checking if the cookie is set, and another (you already have it) that checks the cookie.
Function that shows popup without checking:
function showPopup(){
var id;
id = "popupSignup";
if (jq(".popupWindow").length) {
jq(".popupWindow").prop("id", id);
} else {
jq("#aspnetForm").after('<div id="popupSignup" class="popupWindow"><a class="popupClose" href="javascript:;"></a><div class="popupDetails"></div></div><div class="backgroundPopup"></div>');
}
jq("#" + id + " .popupDetails").html('<iframe class="popupiframe" src="/user/files/newsletter.html"></iframe>');
InitialisePopup(id, 99, false, true);
ShowPopup();
CenterPopup();
}
Function that you already have popup()
jq(function popup() {
if (!AlreadyBeenNewsletter()) {
SetNewsletterCookie();
showPopup();
}
});
Then you can do the following for your link:
Mailing List
By separating the two functions apart like this you are free to show the popup without preventing it from showing again.
I am currently applying for an Internship Internship Link
One of the things that I noticed right away is that you click on upload cover letter or paste cover letter, you're redirected to the home page of the job invite site Job Invite and sadly you can't upload your cover letter. On the other hand, the upload resume works perfectly fine but paste resume has the same issue.
Does anyone know how to resolve this issue and and be able to submit a cover letter?
I am not a web guru but since I am applying for an engineering position, I am trying to find a way around this. I right clicked the upload cover letter link and inspected the link with the inspect element tool. I found that this function
onclick="jvAddAttachment2('jvcoverletter', 'qLY9Vfwx')
was going to get called when the button is clicked. Now going into the JavaScript file for this html page, Inspect Element -> Sources -> *careers_8.js?v=303, I tried to do a basic alert statement, from alert dialog, to do some debugging to see what the issue is. Here's the code now
function jvAddAttachment2(id, companyId){
alert("I got here");
....
}
I then did control s and the Inspect Element console outputted "Recompilation and update succeeded." so I am assuming the JavaScript file has been updated. However when I click the link(via right click, open new window), no alert box shows up. Does anyone know how to get the alert dialog to show up? I think I've done as much as I can with my working knowledge from one web development course haha.
You're looking for the contextmenu event for right click:
element.addEventListener('contextmenu', function() {
// code here
});
Please don't use inline js, like onclick in your html. The above sample is the proper way to attach event listeners.
You should get your element reference in javascript with var myElem = document.getElementById('the-id') or some similar function like document.querySelector, etc.
Then, you can easily attach both events like this:
// left click
myElem.addEventListener('click', myFn);
// right click
myElem.addEventListener('contextmenu', myFn);
If you're adamant to do this with inline js, that would be:
<div onclick="myFn()" oncontextmenu="myFn()"></div>
Full demo of both approaches for ya:
var myElem = document.getElementById('my-element');
myElem.addEventListener('click', myClickFn);
myElem.addEventListener('contextmenu', myClickFn);
function myClickFn() {
console.log('this is myClickFn!');
}
function someFn() {
console.log('this is someFn!');
}
<div id="my-element" onclick="someFn()" oncontextmenu="someFn()">Left or Right click me!</div>
Also, since you're wanting to pass parameters to the function you'll be calling on click, it is good to use an intermediary function for the event, and have that function call the other function, passing the parameters, like this:
function myClickFn() { // this is called on click
myOtherFunction('some', 'params');
}
That prevents you having to repeat the same function call, passing those same parameters in both places.
Make sure to close your onclick string at the end with a ":
onclick="jvAddAttachment2('jvcoverletter', 'qLY9Vfwx')"
And left click instead of right clicking.
onclick="jvAddAttachment2('jvcoverletter', 'qLY9Vfwx')"
I think that double quotation was absent.
demo