philipmwhiteside / Better GetPlan.co

// ==UserScript==
// @name         Better GetPlan.co
// @description  Automatically create different tags and links (#hashtag, +contacttag, ~contexttag, URL, Email)
// @author       Philiphlop
// @match        https://getplan.co/*
// @require      http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// @require      https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant        GM_addStyle
// @run-at       document-load
// @version      0.1
// @license      MIT
// ==/UserScript==

waitForKeyElements("div.event-info span.inputEdit-name", autoTag);
waitForKeyElements("div.fc-plan-calendar div.fc-title", autoTag);

function autoTag(jNode) {
  jNode[0].innerHTML = jNode[0].innerHTML.replace(/(^|[ ])#(\S+)/g, '$1<a class="hashtag $2" title="Tag #$2">#$2</a>'); // Just tagging, no linking. a tag kept for consistenty in CSS once linking is supported.
  jNode[0].innerHTML = jNode[0].innerHTML.replace(/(^|[ ])\+(\S+)/g, '$1<a class="contacttag $2" title="Contact +$2">+$2</a>'); // Just tagging, no linking. a tag kept for consistenty in CSS once linking is supported.
  jNode[0].innerHTML = jNode[0].innerHTML.replace(/(^|[ ])~(\S+)/g, '$1<a class="contexttag $2" title="Context ~$2">~$2</a>'); // Just tagging, no linking. a tag kept for consistenty in CSS once linking is supported.
  jNode[0].innerHTML = jNode[0].innerHTML.replace(/(\S+)@(\S+)/g, '<a class="mailtag $1@$2" title="Mail $1@$2" href="mailto://$1@$2">$1@$2</a>');
  jNode[0].innerHTML = jNode[0].innerHTML.replace(/(^|[ ])http(\S+)/g, '$1<a title="http$2" href="http$2" target="_blank">http$2</a>');
}

var tagColours =
  "/******************************************************/ " +
  "/*                        INFO                        */ " +
  "/*                                                    */ " +
  "/* Note that these are just CSS Rules as an example.  */ " +
  "/*                                                    */ " +
  "/* As this script is updated, your rules may get      */ " +
  "/* overwritten. I would recommend pairing this with a */ " +
  "/* Stylus https://github.com/openstyles/stylus CSS    */ " +
  "/* of your own to avoid clashing. Any #tags get a CSS */ " +
  "/* class you can use based on the word used.          */ " +
  "/*                                                    */ " +
  "/* Additionally you can overwrite the default generic */ " +
  "/* tag syles listed here. I avoid using !important    */ " +
  "/* here so that you can more easily do this.          */ " +
  "/*                                                    */ " +
  "/******************************************************/ " +
  "/*                                         GLOBAL     */ " +
  "/******************************************************/ " +
  "a.hashtag              {padding:1px 5px; border-radius:3px; text-decoration:none; background-color:rgb(000, 192, 192); color:#fff;} " +
  "a.contacttag           {color:rgb(057, 136, 255);} " +
  "a.contexttag           {color:rgb(000, 192, 192);} " +
  "/******************************************************/ " +
  "/*                                         PERSONAL   */ " +
  "/******************************************************/ " +
  "a.hashtag.General      {background-color:rgb(057, 136, 255); color:#fff;} " +
  "a.hashtag.Finance      {background-color:rgb(180, 255, 000); color:#666;} " +
  "a.hashtag.Health       {background-color:rgb(252, 017, 128); color:#fff;} " +
  "a.hashtag.Home         {background-color:rgb(176, 208, 000); color:#fff;} " +
  "a.hashtag.Activities   {background-color:rgb(192, 000, 000); color:#fff;} " +
  "/******************************************************/ " +
  "/*                                         WORK       */ " +
  "/******************************************************/ " +
  "a.hashtag.Work         {background-color:rgb(192, 000, 000); color:#fff;} " +
  "a.hashtag.Client       {background-color:rgb(180, 255, 000); color:#666;} " +
  "a.hashtag.ProjectX     {background-color:rgb(252, 017, 128); color:#fff;} " +
  "a.hashtag.ProjectY     {background-color:rgb(255, 198, 000); color:#fff;} " +
  "a.hashtag.TeamMeeting  {background-color:rgb(176, 208, 000); color:#fff;} " +
  "";

GM_addStyle(tagColours);