I'm developing a Firefox extension and need some help with it.
My extension is overlayed and uses XBL binding to add new items to the user interface.
Is it possible to convert this extension to a bootstrap type?
I'm trying to add a button to the findbar.
Used XBL to override the findbar interface.
To start with the bootstrap I included "findbar{ -moz-binding:... }" rule to the style.css and register this sheet on startup()
(with nsIStyleSheetService.loadAndRegisterSheet()).
In this case my button is added to the bar without restart.
But when I disable or remove the addon I need to restart the browser so that the button disappear.
I tried to remove it on shutdown() in the bootstrap.js using:
var fb=window.gFindBar.getElement("findbar-container")
var but=window.gFindBar.getElement("the-button")
fb.removeChild(but)
But this didn't remove it. I debugged the code and all the elements (fb, but) were found and removed but it didn't touch the real findbars in any tab I had or opened.
So I tried to unregister the stylesheet which bind my XBL to the findbar. This time the findbar just didn't open in the current tabs.
But in new tabs it opened and without the button (a little better...).
Also I've found that the findbar didn't open in the opened tabs because of a strange error:
"this.browser is undefined".
This error pointed to the findbar.xml line 533 where the code tried to run _unpdateCaseSensitivity() but it couldn't get the "gFindBar._browser" prorperty.
Maybe it's because this property wasn't loaded for the original findbar object from the browser start (it was used by the overriden findbar object)...
So this is the point I stuck on...
And the question now is:
How can I delete the button without restart and so that the findbar opens?
From the Findbar Tweak addon I extracted this method to add new checkbox to the findbar (and changed it for my needs):
var findbar=window.gFindBar
var container = findbar.getElement("findbar-container")
var button = $('<toolbarbutton>')
button.setAttribute('anonid', 'test-find-tabs')
button.setAttribute('label', 'Test')
button.setAttribute('type', 'checkbox')
button.addEventListener('command', test,false)
container.insertBefore(button, findbar.getElement('find-case-sensitive').nextSibling)
But for my final purpose it needs some additional editings. So for now I'll leave this problem. Maybe a wise thought will occur me later. Cause a good idea often comes in mind after we change the focus from the problem and then return to it...
Related
In C# WinForms, I could do this
var data = new DataObject(DataFormats.FileDrop, filePaths);
myControl.DoDragDrop(data, DragDropEffects.Copy);
to make another application, such as Notepad, open the file specified by filePaths. The code is similar in WPF or even in JavaFX. The file path can be any arbitrary file path that is accessible within the system, such as C:\Windows\win.ini or \\myFileServer\sharedDir\sharedFile.txt. I mean making Notepad OPEN the file, NOT displaying the file path text in its editing area. That is, I am d&d'ing a file path, not a string that contains the file path.
Can I do the same thing if I make a desktop application with Electron (only for desktops; don't care about web/mobile)? I have tested it with VS Code, which is said to be created with Electron, and when I dragged a file from its "Explorer" into Notepad, nothing happened. When I did it into Notepad++, it just displayed the file path string in its editing area, so I am guessing Electron doesn't support it, but I want to make it sure.
Yes, there even is a full example in the Electron documentation about this.
Short summary of the example code: when a specific DOM element is being dragged, the renderer sends an event to the main process. For the dragstart event to fire, the DOM element needs to have the attribute draggable="true". In this example, we pass the filename of the file to be dragged along in the message to the main process.
document.getElementById("foo").ondragstart = event => {
event.preventDefault();
ipcRenderer.send("my-drag-start", "test-file.txt");
}
The main process handles the IPC message from the renderer and starts the drag operation. Note that you need to specify an icon to be attached to the cursor during the drag operation, triggering an error message if left out.
ipcMain.on("my-drag-start", (event, filePath) => {
event.sender.startDrag({
file: path.join(__dirname, filePath),
icon: path.join(__dirname, "dnd.png"),
});
});
I just published a Google Chrome extension which loads background images into new, empty tabs. The plugin is found here in the Chrome Web Store.
For detecting new and empty tabs, I need to ask for "tab" permissions in the extension's manifest.json. This, however, gives the extension the permission to read the browser's history. Not all users will want this and we don't actually need it. Is there a way to detect empty tabs without this permission requirement? Currently our check looks like this:
chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab){
if (changeInfo.status == "loading" && tab.url == 'chrome://newtab/')
{ /* load background into tab */ }
});
If you want to customize the new tab page you should add this to your manifest:
"chrome_url_overrides": {
"newtab": "newtab.html"
}
Then place the script you are currently injecting into new tab pages as a <script> tag in the newtab.html file. That won't cause that permission message.
I am creating an app for IOS, I opne the theme res on the editor, add a new GUI element, and when i try to add a Web View, nothing happened, the other components like maps or similar can be added. Only happen with the Web View
There is other way??
Ok I find the way to do it on code
protected void beforeWebcams(Form f) {
WebBrowser browser=new WebBrowser();
f.setLayout(new BorderLayout());
f.addComponent(BorderLayout.CENTER, browser);
}
now I will open a new question, i need to display an HTML code inside this webbrowser
I am creating an Ad Blocker. I am just trying to Automatically on safari extension of "Content Blocker". I went through examples but did't found any solution. Is there any way to "ON" extension or manually we have to start it?
On iOS, Safari Content Blockers are disabled by default.
There is no way to automatically enable them from your app. You must instruct the user to:
Open the Settings app.
Go to Safari > Content Blockers.
Toggle on your Content Blocker extension.
On macOS (as of 10.12), a similar rule applies: Content Blocker extensions (bundled with your app) are disabled by default, and must be toggled on by the user in Safari Preferences > Extensions.
Assuming you want to test your "personal AdBlock program", first prepare a dummy HTML, with this line <div class="ads">hello</div>,
next apply your "personal AdBlock program", assuming it is JavaScript/CSS based and not proxy-like, you either hide, or remove the element (Node) from the DOM.
for example:
document.querySelector('div[class*="ads"]') -- this is nice and (very) generic way to find the element.
this is how to hide "the ads"
document.querySelector('div[class*="ads"]').style.display="none";
or, to make it stronger, related to other rules on the page, make it a local style + important notifier: document.querySelector('div[class*="ads"]').style.cssText="display:none !important;" ;
you can also remove the element (Node) from the DOM:
var e = document.querySelector('div[class*="ads"]') follow by:
e.parentNode.removeChild(e);
now, you probably want to see that "YOUR ADBLOCK" worked,
later (after the page has loaded, and your javascript code runned) type:
console.log(null === document.querySelector('div[class*="ads"]') ? "removed(success)" : "still here(failed)")
note that for this example (to make things simple) I assume there is only one div with that class in the page (avoiding loops :) ).
if you've just going to hide the element, you should query its current (most updated) style-condition, using a native method exist under window:
console.log("none" === window.getComputedStyle(document.querySelector('div[class*="ads"]')) ? "hidden(success)" : "still here(failed)")
Enjoy!
I have a few multiselect boxes from the Jquery UI on a page that work perfectly well in Chrome & Safari but not in Firefox for some reason... when I load the Error Console in Firefox I see:
Error: $.widget is not a function
Source File: http://localhost:3000/javascripts/jquery.multiselect.js?1302660373
Line: 563
Any ideas why?
edit: the line itself is within the open function right where it says "// react to option changes after initialization"
// open the menu
open: function(e){
var self = this,
button = this.button,
menu = this.menu,
speed = this.speed,
o = this.options;
widget: function(){
return this.menu;
},
// react to option changes after initialization
_setOption: function( key, value ){
var menu = this.menu;
switch(key){
case 'header':
menu.find('div.ui-multiselect-header')[ value ? 'show' : 'hide' ]();
I am assuming you are using the jQuery Multiselect plugin… which depends on jQuery UI.
Sounds like you have not included enough of the jQuery UI library or just none of it. You need to include the core parts of jQuery UI (including Widget) if you build a custom download. Or just download the whole jQuery UI and include it instead.
For anyone else who is getting this but has the requirements; make sure you are including the Javascript files in the correct order. This error was being caused by my jquery-ui.js being included after the multiselect js file.
This answer is probably unrelated to the situation of the questioner, but I put it here for the sake of others Googling the question.
I got this error using Rails 3.2 and fixed it by deleting (renaming) the public/assets folder. It seems there are a lot of problems with the assets pipeline still. I don't know the details but have had other Javascript failures that are fixed this way.
Actually if you are getting this error then it's either
a) per #andyb answer - you haven't included the correct jQuery UI components
OR
b) your DOM is not loaded yet with the correct $.widget and therefore your function is attempting to call before $.widget has loaded. to fix the problem, ensure $.widget is called BEFORE your function