I've searched for contextmenu with icon and Additional 3 sub menu items and can't seem to find a way to do that process to my Safari extension. Are either of these things possible in Safari extensions?
As my Experience there is no way to put icon in context menu item and also it is not possible to put second level menu(sub menu) in context menu. In Extension Builder of Safari browser there is no option available to set icon.
You can add an icon in your context menu, see the image on the Turn Off the Lights blog post (of the Turn Off the Lights Safari extension:
https://www.turnoffthelights.com/blog/apple-safari-support-is-dead/
lampmenu = safari.extension.createMenu("lampmenu");
sharemenu = safari.extension.createMenu("sharemenu");
lampmenu.appendMenuItem("totl", "Turn Off the Lights");
lampmenu.appendSeparator();
lampmenu.appendMenuItem("welcomeguide", "Welcome Guide");
lampmenu.appendMenuItem("supportdev", "Support Development");
var itemrate = lampmenu.appendMenuItem("ratethis", "Rate this extension");
itemrate.image = safari.extension.baseURI + "images/browser_star#2x.png";
See source of the open source Turn Off the Lights Safari extension: https://github.com/turnoffthelights/
Related
I am putting up a new window like so:
var myWindow = window.open('', "RWindow", "dialog=yes, close=no, height=900, width=1400, top=70");
I have modified the relevant configuration parameters of the user agent (Firefox 58.0.1) —refer to: Firefox and UniversalBrowserWrite privilege
Mozilla window.open API (
https://developer.mozilla.org/en-US/docs/Web/API/Window/open#Window_features )
specifies a close feature (that requires a privilege):
When set to no or 0, this feature removes the system close command icon and system close menu item. It will only work for dialog windows (dialog feature set). close=no will override minimizable=yes.
to no avail for me (please see the code quoted hereabove). What is it I am doing wrong?
I want to create an extension for chrome browsers: item menu in context menu with two different actions when you use left or right click on item menu.
For Firefox it can be realized, but for Chrome? How?
background.js:
chrome.runtime.onInstalled.addListener(function() {
chrome.contextMenus.create({
title: 'do action (left cl. - first, right cl. - second)',
id: 'test',
contexts: ['link'],
});
});
chrome.contextMenus.onClicked.addListener(function(info, tab) {
if (info.menuItemId === "test") {
console.log("first action completed")
}
});
Distinguishing between two clicks in a context menu is impossible in Chrome.
To be fair, it's a very confusing idea, I don't think people expect that from a context menu UI.
Now, clicking with a modifier key is something more common (e.g. Delete vs Shift+Delete in a file manager), but Chrome does not support it either.
You can see the full list of data available here.
I have am using html2canvas to enable screenshots of divs within my web application. It's working well enough in Chrome (including Android), Safari (including iOS) and FireFox. In IE 11, however the image won't save.
Code looks like this:
function displayModalWithImage(canvas, filename) {
var modalcontainer = $('#snapshot');
var modalcontainer_body = modalcontainer.children().find('.snap_shot_container');
var modalcontainer_save = modalcontainer.children().find('.save_snapshot');
var image = new Image();
var data = canvas.toDataURL("image/png");
image.src = data;
modalcontainer_save.attr('download', filename +".png");
modalcontainer_save.attr('href',
data.replace(/^data[:]image\/png[;]/i, "data:application/octet-stream;"));
$(modalcontainer_body).html('');
$(image).appendTo(modalcontainer_body);
$(modalcontainer_save).on('click', function() {
modalcontainer.modal('hide');
});
modalcontainer.modal();
}
Browser behavior varies:
Chrome: displays modal and then saves the file when "Save" is clicked. (acceptable)
Firefox: displays modal and then displays a separate dialog when "Save" is clicked (acceptable)
Safari: display modal and then loads image in a separate tab when "Save" is clicked (acceptable... maybe)
IE 11: displays modal, but does nothing but hide the dialog when "Save" is clicked (unacceptable)
The data.replace was suggested by another SO answer, but it did not appear to have any effect on the behavior of any of the browsers. Previously the href attribute was simply set to data.
So, anyway, at this point replacing the modal dialog with a simple window.location = data is a viable alternative. But, since Chrome works well and Safari and FF work well enough, i'd like to simply do a feature detection that would window.location for IE but show the modal for the other browsers. But, I don't know what "feature" is missing in IE to check for.
tl;dr
is there simply a change or bug in my javascript that would enable IE to work (save the image encoded as data to a file).
if not, which feature in IE should I detect for that would enable me to customize the behavior for IE
if that's not an option; what's the current best practices for old-fashioned browser detection?
I am creating a Safari Extension Bar and was wanting to have multiple Links in it and by clicking on the link have a popover specific to that link appear.
So far I have found these:
https://developer.apple.com/library/archive/documentation/Tools/Conceptual/SafariExtensionGuide/AddingPopovers/AddingPopovers.html
https://developer.apple.com/documentation/safariextensions/safariextension/1635377-popovers
However everything seems to be referring to using them with toolbar items, not extension bars.
I was wondering if it is even possible to make popovers work with links in an extension bar and if so if someone could point me in the right direction with this.
Sure, why not? Here's some sample code to get you started.
Say your extension bar has a couple of links like this:
Open Popover 0
Open Popover 1
(Not the most elegant way to run some JavaScript when you click a link, but whatever.)
Furthermore, say you have a single toolbarItem (toolbar button) and you want a different popover to pop up under it depending on which link on the bar you click. The openPopover function can be as simple as this:
function openPopover(pid) {
var tbItem = safari.extension.toolbarItems[0];
var thisPop = safari.extension.popovers.filter(function (p) {
return p.identifier == pid;
})[0];
tbItem.popover = thisPop;
tbItem.showPopover();
}
Since the extension bar has access to the global safari object of your extension, it can directly manipulate toolbarItems and open popovers, without having to pass messages to the global page. Indeed, your extension may not need a global page at all.
The script I am using can be found at this example
It works in Safari, but not IE9.
Any ideas on how to make it work?
event.target.value where's the event variable coming from? Maybe you forgot to specify the parameter?
Try:
document.getElementById('filter').onchange = function (event) {
document.getElementById('field').value = event.target.value
}
document.getElementById('filter').onchange = function (event) {
document.getElementById('field').value = event.target.value
}
Have you enabled JS in IE9?
If not, then do this in IE9:
1. Click on the "Tools" icon. (Tools icon is on the top right-hand corner of IE9, or Tools can also be found on the Menu bar as "Tools").
2. Then click -> Internet Options" -> Security tab -> Custom Level button -> Scroll to the "Scripting" section near the bottom, and under "Active scripting" select Enable.
3. Click OK.
Now just close down IE9 completely, and restart a new instance of IE9 for javascript to get enabled and start working.
Regards,
Reno Jones