From 283ae3340fe03e0b3a266bd6ade44f6a3fc449e2 Mon Sep 17 00:00:00 2001
From: Charlie DeTar <cfd@media.mit.edu>
Date: Sat, 15 Sep 2012 13:42:57 -0400
Subject: [PATCH] Add `userColor` query param to set initial color

Add a URL parameter which sets the initial color for a user, e.g.:

    http://example.com/p/mypad?userColor=%2300ff00

Sanitize the given color value to ensure that it's a valid css value
(could be any supported CSS color format -- #fff, rgba(), "red", etc).

Shortly after rejoining a pad, the server responds with a USER_NEWINFO
message which may contain an old color value; however, this message
arrives after we have set and sent the new color value to the server.
To avoid this race condition, if the query parameter has been set,
ignore the color value in a USER_NEWINFO message which matches our user
ID.
---
 src/static/js/collab_client.js |  7 ++++++-
 src/static/js/pad.js           | 27 +++++++++++++++++++++++++++
 2 files changed, 33 insertions(+), 1 deletion(-)

diff --git a/src/static/js/collab_client.js b/src/static/js/collab_client.js
index 437942c84..b0206dd5d 100644
--- a/src/static/js/collab_client.js
+++ b/src/static/js/collab_client.js
@@ -297,7 +297,12 @@ function getCollabClient(ace2editor, serverVars, initialUserInfo, options, _pad)
     {
       var userInfo = msg.userInfo;
       var id = userInfo.userId;
-      
+      // Avoid a race condition.  If our color was set by a query param, ignore
+      // our own "new user" message's color value.
+      if (id === initialUserInfo.userId && initialUserInfo.globalUserColor)
+      {
+        msg.userInfo.colorId = initialUserInfo.globalUserColor;
+      }
       if (userSet[id])
       {
         userSet[id] = userInfo;
diff --git a/src/static/js/pad.js b/src/static/js/pad.js
index d1280694f..71039ae7d 100644
--- a/src/static/js/pad.js
+++ b/src/static/js/pad.js
@@ -98,6 +98,7 @@ function getParams()
   var showControls = params["showControls"];
   var showChat = params["showChat"];
   var userName = params["userName"];
+  var userColor = params["userColor"];
   var showLineNumbers = params["showLineNumbers"];
   var useMonospaceFont = params["useMonospaceFont"];
   var IsnoColors = params["noColors"];
@@ -146,6 +147,11 @@ function getParams()
     // If the username is set as a parameter we should set a global value that we can call once we have initiated the pad.
     settings.globalUserName = decodeURIComponent(userName);
   }
+  if(userColor)
+  {
+    // If the usercolor is set as a parameter we set a global value that we can call once we have initiated the pad.
+    settings.globalUserColor = decodeURIComponent(userColor);
+  }
   if(rtl)
   {
     if(rtl == "true")
@@ -347,6 +353,26 @@ function handshake()
         pad.myUserInfo.name = settings.globalUserName;
         $('#myusernameedit').attr({"value":settings.globalUserName}); // Updates the current users UI
       }
+      if (settings.globalUserColor !== false)
+      {
+        // First, sanitize the color to ensure it's a valid color value.
+        var check = $("<span/>").css("background-color", "white");
+        $("body").append(check);
+        var white = check.css("background-color");
+        check.css("background-color", settings.globalUserColor);
+        // Ensure that setting the element changed the color.
+        if (check.css("background-color") === white) {
+          settings.globalUserColor = "#ff0000";
+        }
+        check.remove();
+
+        // Add a 'globalUserColor' property to myUserInfo, so that collabClient
+        // can avoid a race condition where the server sends collabClient a
+        // "USER_NEWINFO" message with an old colorId after we connect.
+        pad.myUserInfo.globalUserColor = settings.globalUserColor;
+        pad.notifyChangeColor(settings.globalUserColor); // Updates pad.myUserInfo.colorId
+        paduserlist.setMyUserInfo(pad.myUserInfo);
+      }
     }
     //This handles every Message after the clientVars
     else
@@ -1011,6 +1037,7 @@ var settings = {
 , noColors: false
 , useMonospaceFontGlobal: false
 , globalUserName: false
+, globalUserColor: false
 , rtlIsTrue: false
 };