Currently, I use Buffer (http://bufferapp.com) as a browser extension and noticed that it stopped working on Twitter recently. If you do not know, this extension adds a 'Buffer' button to many social media websites. Twitter made another UI change, and the Buffer extension no longer add its button to the bottom of tweets.
Thinking that I might do something along these lines in the future (i.e., adding content to other websites via a browser extension), I wanted to know if there are any standard practices when doing so. Are there good tips to avoid this breakage over time? I know its simply impossible to guarantee that the origin site won't break your code, but I hope there are some thoughts on how I can mitigate against it.
Thanks for any thoughts or insights!
copy paste this addon and edit in the "addDiv" and removeDiv functions.
https://addons.mozilla.org/en-US/firefox/addon/ghforkable/
this addon inects javascript into github. you can change it to twitter
https://github.com/Noitidart/ghForkable
if you need more help let me know i can change this to specifically insert on twitter in 10min
Related
This question might not be suitable for this website and I am only asking this for information purposes..
So, please let me know if this is not suitable and I will delete it.
I have created a web application using PHP and Javascript.
what I want to do is to find a way to turn the entire thing into a small javascript code so I only give that piece of javascript code to the users and they can copy and paste it in their website in order to be able to use the application on their own website without being able to edit the contents of it!
could someone please advise on this?
Again, please let me know if this question is not suitable for this site and I will delete it.
There are two ways to go about this, make it available as an iframe widget (which could theoretically be injected through javascript) or make a cross-domain API with which the javascript would interface. From the sound of it going down the iframe route sounds most sensible, although it does come with a clickjacking vulnirability.
There is a website that I visit often... let's call it www.example.com. And, I am able to interact with parts of this website. The interactions send XMLHttpRequest and get a response back through Javascript, jQuery I believe.
I'm not sure what technology will let me achieve what I want to do, and where to start. Basically, I want to add additional options/shortcuts that the site does not provide. I thought about maybe using a macro, but trying to use macro recording software is just a pain in the butt.
I inspected (using Google Chrome's Developer Tools) the XMLHttpRequest being sent back and forth and I noticed that it is simple JSON messages. I figured the best way to add enhancements to the site without waiting for the actual owners of the site to do so would be to simulate the website sending/recieving these XMLHttpRequest/Response and making additional adjustments to the DOM to provide extra shortcuts.
I don't want to interfere with the original site's functionality though... ie if I send a request and receive a response I want both the original script and my script to process the response. So, here is where I'm stuck... I'm not sure whether to go along the paths of creating a C# application or a Google Chrome extension (I use Google Chrome) or something else alltogether. Any pointers on what dev tools/languages will give me the ability to do what I want would be great. Thanks!
Chrome has built in support for user scripts. You can use these to modify the page as you see fit and also to make requests. Without more details regarding what exactly you want to do with these AJAX request it's hard to advise further.
I'm not 100% sure what your question is, but as I understand it, you want to be able to make changes to a certain website. If these changes can be done with js, i would recommend Greasemonkey for Firefox. It basically lets you run a custom script when you are visiting a certain webpage/domain. You can be as specific as you want about which pages use the script. Once your script loads jQuery, it is really easy to add any functionality.
https://addons.mozilla.org/en-US/firefox/addon/greasemonkey/
You can find pre-written scripts for tons of sites here:
http://userscripts.org/
I'm trying to create a simple google gadget and am encountering trouble right out the door. I've read the getting started guide top to bottom and feel like i'm still missing something.
Starting with the Hello World gadget they have provided, how do I begin editing and testing? I'm using the Google Gadget Editor with the preview tab. This works for simple html, but any javascript (such as an "alert") I embed doesn't work.
I can publish the gadget and add it to iGoogle. When I do this, my embeded javascript works. However there seems to be a good bit of caching and latency going on behind the scenes. Right now this process of editing, uploading, publishing, debugging is quite painful. Am I missing something obvious here? What is the "correct" way to develop and test a gadget? Is there a program that can run gadget code on my machine without having to go online?
Ah, the joys of editing a Google Gadget.
From my experience the Google Gadget editor is VERY buggy. So that may be the Javascript issue you are having, try switching browsers.
Also, to disable caching:
http://www.google.com/ig/directory?type=gadgets&url=www.google.com/ig/modules/developer.xml
The answer appears to be "No" as far as I can tell. I have also suffered the painful latency you mention: one code/debug cycle can easily take 10 minutes of waiting for the gadget to update to my latest code.
I hope someone marks me down and provides a "Yes" answer.
Try appending a query string to your gadget URL and then add it to your gmail or iGoogle page. Use a different query parameter every time you make changes to your gadget. Like for example:
www.mycompany.com/gadgets/main.xml?q=1234
Google refreshes the cache every hour or so. So, adding a query string will force it to refresh the gadget immediately.
I'm trying to dissect some well designed sites, in order to learn more about unobtrusive JS. One problem I am experiencing is that one technique for unobtrusive/graceful degradation seems to be loading a base HTML page and heavily modifying/appending elements with JS.
It would be good if there was a tool where I could just selectively load scripts and html resources, so I can more easily see what is modifying what. A great tool would be something like Chrome's resource window and I could right click on a resource and select "don't load" or something...
Thanks!
PS. if anybody has sites they recommend me take a look at, MUCH appreciated. I'm just checking Fanbase.com right now
You could use a Fiddler filter to prevent a URL from loading.
You can also use Firefox's Web Developer Toolbar or IE8's Developer Tools to disable CSS, images, and/or Javascript.
Or you may want to check out googles http://code.google.com/speed/page-speed/
which will show you exactly what js calls and where.
I want to add a button to one of our web sites that will allow the user to file a bug with our bug tracking system.
One of the feature requests is that a screen cap of the page in question be sent along.
Without installing something on the end users machine, how can I do this? Does javascript have some sort of screen cap api?
You may grab the innerHTML of the page and then process it on the server:
document.getElementsByTagName('html')[0].innerHTML;
// this would also be interactive (i.e. if you've
// modified the DOM, that would be included)
No, javascript does not have anything like this.
I'm afraid that this will be quite hard. I can not think anything that would do this without installing on users computer.
I'd like to be proven wrong, but atleast this is an answer for you.
Get as much Info as you can about the user environment using jQuery. (jQuery.support) / user agent / cookies / form input values, the url (for get parameters and to know which page had an error)
Send the source of the page like mentionned by Moff.
Try serializing the DOM as it is now so you can compare what is different from the original page.
It is also useful to send the source of the page if you need to keep it for historic purposes, since when you update the page, it will be become different.
I'd suggest some sort of integration with FireShot which is a Free Firefox/IE addon.
I agree with the other answers -- no dice.
However, there is a firefox plugin, the Pearl Crescent Page Saver, which might be worth looking into for related tasks.
Take a look at pagecrop (implemented with jQuery + jCrop plug-in)
I must be missing something, but can't you just...
Press PrtScr on keyboard and paste into email.
See this question. Basically, no, not with javascript. Perhaps with ActiveX, but that's back to installing things on the client's PC.
Consider writing a server-side script that repeats the user's request exactly (assuming it's not after a POST) and storing the resulting html file.
You might look into using a web based solution such as the one offered at Super Screenshot! or WebShotsPro.com. Depending on your needs, such as screenshots of specific areas of pages, or pages inaccessible from the outside world, it may not work for you, but it is an idea.
Chrome plugin
https://chrome.google.com/extensions/detail/ckibcdccnfeookdmbahgiakhnjcddpki
You can also take a look at how Evernote does its screen capturing and maybe you can tie in to that or create your own chrome extension. https://chrome.google.com/webstore/detail/evernote-web-clipper/pioclpoplcdbaefihamjohnefbikjilc?hl=en