Git Product home page Git Product logo

dotjs-addon's Introduction

dotjs

This is a Firefox Add-on port of defunkt's Chrome extension https://github.com/defunkt/dotjs.

dotjs is a Firefox Add-on that executes JavaScript and CoffeeScript files in ~/.js based on their filename and the domain of the site you are visiting.

If you navigate to http://www.google.com/, dotjs will execute ~/.js/google.com.js and/or ~/.js/google.com.coffee. If you have a ~/.js/default.js, it will execute on every page you visit. Also, you can put site specific .css files in ~/.css (C:\Users\<username>\css\. in Windows 7). default.css loads in all sites.

This makes it super easy to spruce up your favorite pages using JavaScript and CSS.

Bonus: files in ~/.js have jQuery 1.12.4 loaded, regardless of whether the site you're hacking uses jQuery.

GreaseMonkey user scripts are great, but you need to publish them somewhere and re-publish after making modifications. With dotjs, just add or edit files in ~/.js.

Example

$ cat ~/.js/github.com.js
// swap github logo with trollface
$('#header .site-logo img')
.css('width', '100px')
.css('margin-top', '-15px')
.attr('src', 'https://img.skitch.com/20110207-x4s8eys3uy641yk72jigt38bby.png');

How to target a specific path

Sometimes, you don’t want to target a whole domain, but only a path.

CSS

You can use the @-moz-document Mozilla Extension:

/* Full path */
@-moz-document url-prefix(http://www.w3.org/Style/) {
    /* CSS here */
}

/* Regex */
@-moz-document regexp("^https?:\/\/www\.w3\.org\/Style\/.*") {
    /* CSS here */
}

Documentation: https://developer.mozilla.org/en/CSS/@-moz-document

JavaScript

You can test the window.location object:

// Search for a string
if (window.location.pathname.indexOf('/Style/') === 0) {
    // JS here
}

// Regex
if (/^\/Style\/.*/.test(window.location.pathname)) === 0) {
    // JS here
}

Documentation: https://developer.mozilla.org/en/DOM/window.location

Installation

Dependencies

Contributors (Thank you!)

Changelog

v1.13 Fix for subdomains (Issue #43).

v1.12 Now scripts run in private browser windows (Issue #35). Fix issue where scripts were loaded multiple times. Now using jpm.

v1.11 This version now looks up the files recursively for the domains. So for example, for "www.example.com" it will attempt to load: www.example.com.js example.com.js com.js

v1.10 Fixed bug with default.js (Issue #28)

v1.9 Performance optimization. Load content scripts on DOM ready.

v1.8 Updated jquery to v1.9 and coffeescript to v1.4.

v1.7 Updated to version 1.7 of addon sdk along with some optimizations.

v1.6: Leaner, meaner dotjs. A bunch of optimizations by canuckistani (Thanks! \o/).

v1.3: Only load into into the main tab document (vs iframes, etc.).Improves memory usage and performance.

v1.2: Updated to jQuery 1.7.1 and some cleanup (Thanks djl!).

v0.9: CSS support!

v0.8: Windows support! Put your scripts in a js folder under your home directory (C:\Users\<username>\js\. in Windows 7).

v0.7: CoffeeScript support! ~/.js/example.com.coffee gets transpiled to JavaScript and executed.

Credits

"I almost wish you could just stick JavaScript in ~/.js. Do you know what I'm saying?"

dotjs-addon's People

Contributors

bpierre avatar djl avatar eridal avatar evanhahn avatar punassuming avatar rlr avatar tdolsen avatar

Stargazers

 avatar

Watchers

 avatar  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.