Creating dynamic child context menu based on AJAX call - google-chrome-extension

I'm developing a chrome extension where I need to create dynamic sub-contextMenus based on some selected text. Like If you select a text, it'll send an ajaxrequest from the background.html and create some child context menu based on the returned results. Is that possible? I've been trying for sometime. But no luck.

You can add right mouse button event listener in a content script:
document.addEventListener("mousedown", function(event){
if(event.button == 2) {
//get selected text and send request to bkgd page to create menu
}
}, true);
There is also oncontextmenu event, can try it as well (I think mousedown is fired earlier though).

Related

Is it possible to attach event on the *opening* of the context menu?

I am developing a WebExtension and as you know it is impossible to inject content script on chrome://* pages and https://chrome.google.com/webstore/*. I have a buttons in a context menu and for correct UX I would like to drop my item from context menu on such protected page.
According to the documentation I can handle click on my context menu item, but looks like no way to check the url of the page on the moment of right mouse click without trying to inject content script into every page?
As a workaround I have a code that checks url after click to the menu item.

How to display busy status in Kentico custom module

I have a custom module that contains a button. The button click performs a process that sometimes takes 5-10 seconds to complete. Is there a way in Kentico to display a custom busy message like the "Loading" message that Kentico displays during lengthy processes? I would like to show the same "Loading" msg that Kentico shows with my own custom message.
If your module is built using the out of the box page templates and webparts, this is included by default. If it is not and you're using custom aspx template pages, you'll need to ensure that the page in inherited properly and add that in. You might want to reference another out of the box module which is using code already like the Users in the Membership module.
Yes, but it depends on how things are set up.
If the button executes an Ajax Panel (it does a postback through an ajax call), then you can capture the ajax call and put your loading message there.
<script type="text/javascript>
var AjaxHandler = Sys.WebForms.PageRequestManager.getInstance();
AjaxHandler.add_beginRequest(beginRequestHandler);
AjaxHandler.add_endRequest(endRequestHandler);
function beginRequestHandler(sender, args) {
// Waiting
}
function endRequestHandler(sender, args) {
// close waiting
}
</script>
If you have it postbacking on the page, you can try to put a hook when the button is clicked to show the waiting, when the page refreshes then the waiting will of course be gone.
$("#mybutton").click(function() {
// Waiting
});

Dynamic CRM 2011. Hide/show tabs using radio buttons issue

I have this code that hides tabs and shows tabs in CRM 2011. By default all tabs are hidden, but when the client has the product purchased (yes selected), the tab is showen.
The issue I am having is when I click yes and save & close. Then reopen the account, the tab is hidden, but the option is still yes.
The code is:
function showTab(tabNumber, optionField, optionValue) {
if (Xrm.Page.getAttribute(optionField).getValue() == optionValue) {
Xrm.Page.ui.tabs.get(tabNumber).setVisible(true);
}
else {
Xrm.Page.ui.tabs.get(tabNumber).setVisible(false);
}
}
The option I have is:
2,"new_server",'1'
I got the code from this place:
Show a Tab Dynamics CRM 2011
I am still working on this.
You need to register this function on both the form's OnLoad event and the field's OnChange event. It sounds, from your description, that it is registered and working for the OnChange event but the OnLoad event.
You currently have the function registered on the onChange event for the radio button control.
Additionally, you need to register an onLoad event for the form.
Create a new web resource.
Open Form Properties.
Add form to available resources.
Add event handler onLoad, and call your webresource.
In the web resource you can just have a call to your showTab function.
When you open the form for customization, look at the top ribbon of the form. You will see Form Properties icon right next to Preview. Click on Form Properties and then add the JavaScript web resource in the Form Library.
Choose Event: OnLoad from the drop down and then click add under the Event Handler.
Choose the web resource of your choice, add the function name being used in your code (showTab).
This will add the function to your Onload event of the form.

XPages remove documents on server and trigger partial refresh

I am struggling with the following.
On my XPage I have a viewpanel component, but it is not bound to a notesview datasource, but to a hashmap stored in viewScope. Reasons for this is beyond scope of my question.
Since the lines in my view are not actually linked to the documents I cannot use the standard checkboxes and the related getSelectedDocIds. I do however want a way to remove the selected documents. I have a column with checkboxes containing the unid of the corresponding row.
So long story short. I have an array of unids and want to perform an action that does the following:
Display a dijit.Dialog asking for confirmation
If OK clicked call a function that does the following:
Remove the documents based on the unids
Refresh the viewpanel
I am thinking of the following 2 solutions, but in doubt what would be best (maybe a third, even simpler solution?)
Have the OK button of the dojo dialog call a function that does an XmlHttpRequest to an XAgent or plain old LS agent
Have the OK button trigger an eventhandler that runs on the server as described by JeremyHodge here. But how would I pass the unids as parameter and refresh the view afterwards?
Thanks!
Cant you just make use of the extension library dialog with the dialog button control. In this button control you can then
A third option would be to add a column to your datatable/view which contains checkboxes. On the onchange event of these boxes you add an eventhander which adds the value to a viewScope variable.
A button on the bottom (or top.) of the page you add the code you need to remove the selected items from the hashmap, delete the documents associate with the selected id's. this button can be a ordinary button with a partial refresh on the viewpanel. When you run into the bug that you cant use buttons in a dialog please use the extension library dialog control because this fixes that issue for you.
If the current user does not have the correct access level to delete documents you could use the sessionAsSigner global (assuming the signer of the design element has the correct access levels).
This way you dont need to go call an xAgent by xmlthttprequest and can stay with the default xpage methodology.
I hope this helps in some way
I would second #jjbsomhorst in the use of the extension library for the dialog box - if you use one at all. Usually users don't read dialog boxes. So the approach would be add the column with the checkboxes, but don't bother with an event handler, but bind them ALL with their value to ONE scopeVariable. On submission that variable will then hold an array with the selected UNID.
Then render a page that lists these documents and have a confirm button. While the new page affords a server round-trip the likelihood, that users actually pay attention is way higher. What you can do:
Have the normal page that renders the dialog with editable checkboxes and when the user clicks "Delete" you set something like viewScope.confirmDeleteMode=true; and use that as condition for the checkboxes and make them read-only AND set the class of the selected rows to "morituri" which in your CSS would have something like .morituri { color: white; background-color : red; font-weight: bold } and a new button "Confirm Delete" (and hide the Delete button).
This way you only have one page to deal with.
I went for option 2, which has the possibility to provide the partial refresh id. I passed the unids as a submitvalue like:
function doRemove(unids){
XSP.executeOnServer(ISP.UI.removeEventID, ISP.UI.removeRefreshID, {
params: {
'$$xspsubmitvalue': unids
},
onComplete : function() {
//alert('test')
}
});
}
The ISP.UI.removeEventID performs the following code:
var unids = context.getSubmittedValue();
removeDocuments(unids); //SSJS function performing the actual delete
viewScope.reload = 'reload' //triggers the hashmap to be rebuild based on new documentcollection

How can I get the dimensions of an image the user right-clicked on using Chrome's Extension API?

I'm writing an extension that reacts to right-clicks on images on the page. I'd like to know the image's dimensions to do further processing.
Out of the box, my callback gets a reference to the tab and an "info" object (OnClickData), which only exposes minimal information.
Has anyone hit this scenario before? I'm thinking of either
loading the image again based on the srcUrl (may not be reproducible if the URL is dynamic) and interrogating it
trying to walk the DOM of the tab to find the image and interrogate it (not sure if this would require a content script to cross the boundary from extension to webpage)
What the Image Properties Context Menu extension does is to use a user script in combination with the context menu API.
The user script is injected into all pages, listens for context menu events, and sends the information about the image to the extension via chrome.extension.sendRequest:
document.addEventListener("contextmenu", function (e) {
var elem = e.srcElement;
if (elem instanceof HTMLImageElement) {
var img = {
src: elem.src,
alt: elem.alt,
height: elem.height,
width: elem.width
}
chrome.extension.sendRequest(img);
}
}, true);
The background page uses chrome.extension.onRequest.addListener to receive this data, and stores it in a global variable. The context menu API click callback reads data from this global variable.
That assumes that the chrome.extension.sendRequest call is always handled before the click callback, which may not always be the case. You may want to make the callback check if the data has arrived, and if not, try again a little while later (by using setTimeout).

Resources