heroku flip bookmarklet

0.md

Link to this page: http://caseywatts.com/flipit

Other gists & tricks: http://caseywatts.com/gists-and-tricks

Flipit

This helps flip between a page the development server and the same page on the production server. Useful for comparing css or functionality changes quickly.

Installation

• create a new bookmark in your browser
  • name: "flip"
  • url: paste something like the code below

single-site-flip.js

javascript:(function() {
  var host = window.location.hostname;
  var path = window.location.pathname;
  var search = window.location.search;
  if (host !== "dashboard.heroku.com") {
    window.open("https://dashboard.heroku.com" + path + search)
  } else {
    window.open("http://localhost:4200" + path + search)
  }
})();

two-sites-flip.js

javascript: (function() {
  var host = window.location.hostname;
  var path = window.location.pathname;
  var port = window.location.port;
  var search = window.location.search;
  var onDashboard =
    host === "dashboard.heroku.com" ||
    (host === "localhost" && port === "4200");
  if (onDashboard) {
    if (host !== "dashboard.heroku.com") {
      window.open("https://dashboard.heroku.com" + path + search);
    } else {
      window.open("http://localhost:4200" + path + search);
    }
  } else {
    if (host !== "elements.heroku.com") {
      window.open("https://elements.heroku.com" + path + search);
    } else {
      window.open("http://localhost:5000" + path + search);
    }
  }
})();