I'd like to develop an extension for a browser which does the following.
Prerequisite: Text has been selected, add-on has been triggered (e.g. by click in context menu)
read selected text
pass the text to a (e.g. RESTful) webservice
retrieve a list of comments from the webservice
show them in the browser
optional: show also an input field below to send another comment to the webservice
Writing a Firefox add-on became quite annoying since I haven't found a proper documentation and IDE (with a handy build process).
Which Browser/IDE combination do you recommend for rapid add-on development/prototyping?
For Google Chrome, you use web technologies to create extensions. (AFAIK Firefox is the same thing). The documentation for Google Chrome Extensions is documented pretty well: http://code.google.com/chrome/extensions/index.html
For the case you have mentioned, I have answered another user on how to capture selected text and send them to a service with a working example that you can learn from if you want:
Chrome Extension: how to capture selected text and send to a web service
Regarding the tools that you can use, it depends on what your comfortable with. Personally, I just use an editor that has syntax hilighting such as VIM, Notepad2, etc. Some people use dreamweaver, emacs, notepad, etc. At the end it all matters on your taste.
Good luck!
Related
I've seen the "How to link to chrome extension like Chrome Web Store?" question from Oct. 2011, and I tried to implement it.
However, I realized after some testing that the approach described in answer to that question regarding Inline Installation only works in situations where the original developer of the extension links to his own creation in the Chrome Web Store.
I have a daily podcast that I post to my website, and I want to provide a one-click link for Chrome users to click in order to install The RSS Aggregator extension (which I did NOT develop) directly, so that desktop visitors using Chrome can view my podcast feed in a formatted page rather than just seeing XML code.
Since I'm not the original creator of The RSS Aggregator extension, I don't see a way for me to accomplish this.
For the moment, I'm sending visitors to the Chrome Web Store to install it there, but I've been getting feedback from tech-averse visitors that they can't figure out how to install it without step-by-step installation instructions. Sadly, there are still a lot of people out there who have trouble handling something as simple as adding an extension to their Chrome browsers.
Hence my desire to provide a one-click solution on my site.
Is there a way I can implement a solution on my site?
Never used it before, but maybe this helps you:
https://developer.chrome.com/webstore/inline_installation#cws-link
I intend to modify the display of existing websites.
For example, when Google returns search results, can I customize the web page displaying (such as adding some bubble visualizations onto that page's blank places) ? Could it be done using browser plug-in or extension?
Based on my knowledge, a browser extension, such as firefox or chrome extension, is usually for adding tiny icons to the address bar.
Could it be done using browser plug-in or extension?
Yes. But you don't want to write a browser plug-in. They're fairly complicated to write and users are reticent to install them (with good reason) Further, you'd have to write two, as Mozilla and Google can't agree on a format (Chrome is removing the venerable NPAPI, but Mozilla won't implement Google's PPAPI, claiming that it's a moving target with inadequate documentation).
Based on my knowledge, a browser extension, such as firefox or chrome extension, is usually for adding tiny icons to the address bar.
No. Firefox add-ins and Chrome extensions can do a lot more than that, including modifying the page once it's rendered.
So you'll probably want to write a Firefox add-in and a Chrome extension. (Sadly, yes, that's two codebases to maintain, although they use similar technologies — HTML, CSS, JavaScript — so you can share a bit between them.)
There are multiple similar questions in stackoverflow which deal with how to Cut, Copy, and Paste from JavaScript (in response to a button press, for instance) without the user having to use CTRL+X, C, or V.
All these answers suggest either that you are insane for wanting to do this and that users should never have their clipboards violated in such a profane manner, or to use the hack of an invisible Flash movie (which has questionable support).
However, Google Docs does this, and does not use a Flash movie. You can open a Google Document, Go to the Edit menu, choose "Paste" (or Cut or Copy) and NOT get a browser window that tells you "Your browser security settings don't permit the editor to automatically execute copying operations."
However, go to another rich text editor (CKEditor or TinyMCE for instance, but this is common among them all) and try that same command. You will get a message that reads:
"Your browser security settings don't permit the editor to automatically execute copying operations."
So the question is simply: What is Google Docs doing to allow users to Cut, Copy, and Paste via a menu button that doesn't run in to security issues?
A quick look at all my browsers show that I have a Google Docs extension installed. I know for a fact it is possible to do with the use of an extension (Browser extensions play in a different, more "trusted" sandbox), which you could (and people do) use these to expose an API to javascript used within their sites within the browser in which the extension is installed.
Based on the fact that I definitely have extensions from google to allow "for the viewing and editing of google docs" across all my browsers - this is how they do it. Building extensions for browsers is a per-browser project and the code you write for an extension in one browser is typically only partially portable.
Google does it because its user base intrinsically trust it and so they happily download and install the necessary extensions and plugins Google publishes for varying web-based services that extend beyond the capacity of standard web technologies. We trust that Google won't get our stuff pwned.
So the short answer is: You can't do it. Unless you're prepared to write the necessary extensions/plugins for Chrome, Firefox, Safari, IE8+... etc... Google works because of an extension called Google Docs installed within your browser. (IE, in Google Chrome navigate to chrome://extensions/ to see your own google docs extension).
If you want to give extension writing a try for Chrome, visit their guide on how to do so! Be forewarned however, that installing extensions takes significant trust on a user's part and should not be required early in any "sales funnel."
Edits: Because I'm horrible at grammatically correct English
Sometimes while browsing websites using Chrome, you can see a yellow prompt showup. How can I trigger that prompt for my own websites?
For example try going to the The Independent's website and you will be prompted "The Independent now has a Google Chrome Extension. Get the latest news on the topics you like, direct to your browser."
I have previously seen this prompt on Google.com as well, however I assumed that that was something internal for google only websites. This is the first time I have seen the prompt for Non-Google owned websites.
It's a custom look-a-like they've made. Take a look at their javascript file here: http://www.independent.co.uk/independent.co.uk/editorial/javascript/tb.js
It does most of the work. You might be able to get some ideas from there :)
I assume you need to check this question: Chrome - Notify User to install your extension
Looks like there are no standard API for defining extension available for particular site – so you need to imitate such behavior with JS.
If I made a mistake, feel free to correct me in comments.
You are looking for the Infobars API, but this feature is only available for extensions.
I have a site a client is trying to use that doesnt work on their machine using IE7 version 7.0.5730.13CO. We know it works on version 7.0.5730.13 with all. By 'work' I mean it renders different and the javascript functions differently.
I found a site (basically the only site I could find on google about it) that said the CO was for Corporate Administrator.
When you edit with Microsoft's IEAK it seems to add this CO.
How can I find out what changes were applied to the clients machine? I can do a remote desktop sharing with them if needed.
Unfortunately I cannot upload any sample code because of my contract.
This "CO" version is not a separate Microsoft release. It is just an indication that the "official" IE version 7.0.5730.13 was customized using the IE Administration Kit (IEAK) by some administrator at this customer's site. Another 7.0.5730.13CO from another site could be completely different, as it depends on the options chosen with the kit.
If you need to test with this particular version, you need to obtain the distribution stream or whatever media/approach they use at this particular site to push-out IE (and other) updates.
This may be a question better directed at serverfault.com or maybe supersuser.com
You can learn more online with the "IEAK", "Administrator Kit", keywords, or also by using just "CO" and/or "CO suffix" rather than trying to search for this very version number.