Git Product home page Git Product logo

tinyurl's Introduction

Archive note

After the "tinyurl.com" update, it's no longer possible to use their service as an API (which wasn't even official in the first place). Therefore, this repository is being archived.

Disclaimer

This extension was made with the purpose of studying how browser add-ons work, thus the simple ideia. I also hope that this extension can help people out with their necessities as well as devs with how to code a browser extension.

Introduction

This browser extension's goal is to use the TinyURL service to allow the user to create a short URL for the current page being visited. It also allows the user to choose between a "default" URL, where a random address is generated by the TinyURL website, or an "aliased" URL, which is chosen by the user.

There are two ways of using it:

  • By clicking on the extension's icon;
  • By right clicking anywhere on the current page and going to the TinyURL context menu.

Browser compatibility

This extension is compatible with Firefox; Google Chrome and derivatives; Opera.

Compatibility issues during development

Below the folders chrome/ and firefox/ you will find the extension's code for chrome based web browsers and for firefox, respectivelly.

At first I thought they would be extremelly necessary and that I'd face some serious core rewring when going from chrome based (where I started) to firefox, but that wasn't actually the case. When analysing the code, you'll notice that API calls under the chrome/ folder, starts with chrome.[something] and for the firefox/ folder, browser.[something], and as it turns out this is not really necessary, since firefox can have API calls starting with chrome.[something]. Regardless of that, I decided to keep the difference in the code and document it here.

The very first difference that I noticed was about the options page. In both Google Chrome and Firefox, it'll be defined in the manifest.json file, but for Firefox the key to be used is called options_ui instead of options_page. That happens because options_page is deprecated on Firefox and is still supported by Google Chrome. In this case, it's recommended to use the options_ui key, once it's supported by both browsers. Another relevant thing to notice is that, each browser has a different key for using the browser style; browser_style for Firefox and chrome_style for Google Chrome.

  • Firefox:
"options_ui": {
	[...],
	"browser_style": true
}
  • Google Chrome:
"options_ui": {
	[...],
	"chrome_style": true
}

Another important difference that I noticed was regarding a property called Add-on ID. Firefox asks for a manually defined add-on ID in the manifest.json file, otherwise the storage API won't work. See bugzilla.

In this case, it's necessary to define it as shown below:

"browser_specific_settings": {
  "gecko": {
    "id": "[email protected]"
  }
}

More about the implications of the Add-on ID are discussed here.

One more relevant thing that I noticed was about javascript popup boxes, such as alerts. When using Google Chrome and its based web browsers, it's possible to display popup boxes directly from the background script and it will be displayed in a kind-of different window and this happens to not be the case in Firefox. When trying to display alerts from a background script, the browser will notify that those are not supported by showing an warning, like this one below:

alert() is not supported in background windows; please use console.log instead.;

Known Issues

There might be an issue that prevents this extension from working when currently on a search page, such as google search. As pointed out by this issue, go to the extension's preferences menu and check the Allow access to search page results option.

Installation

  • Firefox: REMOVED
  • Google Chrome: REMOVED
  • Opera: Follow the instructions below.

Install Chrome extension on Opera

  1. Install the Install Chrome Extensions addon for Opera. (link)
  2. Go to the Chrome Web Store page;
  3. Hit the button Add to Opera;
  4. Click OK on the dialogue that will show up;
  5. Click the Install button.

Manual installation

See the specifications regarding unpacked extensions for your particular browser.

Similar repositories

  • savetabs: A web browser extension that allows the user to save every tab's url to a file

tinyurl's People

Contributors

pvpscript avatar

Stargazers

 avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.