Merge pull request #238 from qq99/irc-proxy

Irc proxy

CHANGELOG.md

@@ -1,3 +1,28 @@
+0.2.6
+=====
+
+Major:
+- addition of an IRC proxy server
+  - Echoplexus will bridge a connection to the irc network&channel of your choice (so beware if you assumed you were connecting directly to said network!)
+  - To join a network, join a channel name like: `irc:chat.freenode.net#foo`
+  - Unfortunately, IRC support in echoplexus is not yet multiplexed so each channel you connect to will be its own connection and thus requires a unique nick
+  - This feature must be enabled in server config.coffee; it's not necessarily a feature that every operator would want, so it's opt-in
+
+Minor:
+- "Zzz" for idle users in the user list has been removed in favour of simply colouring the active users a blue colour
+- Client fields are now whitelisted when userlist data is transmitted, ensuring that we only transmit the need-to-know information
+- New users users will now appear with a random human first name, rather than "Anonymous"
+- `/pseudonym` command added, which will give you a new random human name
+- fixed the firefox channel close button bug
+- various fixes for emoji related bugs (using fork of emojify.js)
+- adjusted styles
+
+0.2.5
+=====
+
+Major:
+- new UI, more accessible and appealing to more people (I hope)
+
 0.2.4
 =====
 

Dockerfile

@@ -12,7 +12,7 @@ FROM ubuntu
 RUN apt-get update
 RUN apt-get install -y build-essential python ruby git redis-server nodejs phantomjs npm
 RUN gem install sass
-RUN npm install -g coffee-script grunt grunt-cli supervisor bower
+RUN npm install -g coffee-script grunt grunt-cli supervisor bower testem browserify
 RUN ln -sf /usr/bin/nodejs /usr/bin/node
 RUN service redis-server start
 RUN apt-get install -y tmux

INSTALL.md

@@ -19,35 +19,19 @@ From there, you may do one of the following, depending on your needs:
 ##Dependencies:
 
 ### node.js
-
-For server, confirmed working v0.10.10, and should be OK with v0.10.1*.  You might have luck with your current node, so perhaps try that before you do the following:
-
-    $ git pull https://github.com/joyent/node.git
-    $ git checkout v0.10.10
-    $ ./configure
-    $ make
-    $ make install
-
-Known Issues:
-
-- Node v0.10.8 and v0.10.9 have an [incompatibility with socket.io and HTTPS](https://github.com/joyent/node/pull/5624).
-- Node v0.11.* has issues with node-sass.
+Confirmed working nodejs is v0.10.25.  You might have luck with your current node, so perhaps try that before you do the following:
 
 ### node.js Packages
 Install the required server-side packages
 
     $ npm install
-    $ npm install -g coffee-script grunt grunt-cli supervisor (probably need `sudo`)
+    $ npm install -g coffee-script grunt grunt-cli supervisor bower browserify testem (probably need `sudo`)
 
 ### bower Packages
 Install the required client-side libraries
-If you have bower installed globally, you can run:
+If you have bower installed globally (the previous step), you can run:
 
     $ bower install
-
-Otherwise, you should install it:
-
-    $ npm install -g bower
 
 ### Ruby
 
@@ -63,9 +47,11 @@ Echoplexus uses Redis for chatlog persistence
 
 For taking screenshots of websites to embed in the chat.
 
-Download from http://phantomjs.org/
+Recent ubuntus can install it via:
+
+    $ sudo apt-get install phantomjs
 
-Install the binary to `/opt/bin/phantomjs`
+Otherwise, download from http://phantomjs.org/.  Install the binary to `/usr/bin/phantomjs`.
 
 If you don't want to do this step, set "phantomjs_screenshot" to false in `server/config.js`.
 
@@ -77,6 +63,8 @@ If you have grunt installed globally, you can simply run:
 
     $ grunt
 
+This will create all the files you need to run echoplexus, but will leave CSS and JS unminified.
+
 ####Production:
 If you have grunt installed globally, you can simply run:
 
@@ -87,10 +75,9 @@ Create a copy of the sample config file for the server, and change any relevant
 
     $ cp src/server/config.sample.coffee src/server/config.coffee
 
-
 Run `grunt exec` for a dev server, or `grunt exec:production` for a production server.  The former will stop on errors and restart immediately when a file changes.  The latter will wait 60s before restarting.  The server will become available on http://localhost:8080/ under the default configuration.
 
-If you want to host behind nginx, you will have to get a build with WebSockets enabled.  Recommended 1.5.0 or higher
+If you want to host behind nginx, you will have to get a build with WebSockets enabled.  Recommended version of nginx is 1.5.0 or higher
 
 ###Web Server Proxying:
 

README.md

@@ -1,4 +1,4 @@
-[echoplexus](https://echoplex.us) (v0.2.5)
+[echoplexus](https://echoplex.us) (v0.2.6)
 ==================
 
 [![Stories in Ready](https://badge.waffle.io/qq99/echoplexus.png)](http://waffle.io/qq99/echoplexus)

bower.json

@@ -17,7 +17,7 @@
     "backbone": "~1.1.2",
     "hammerjs": "~1.0.6",
     "backbone.stickit": "~0.7.0",
-    "emojify.js": "https://github.com/qq99/emojify.js.git",
+    "emojify.js": "https://github.com/qq99/emojify.js.git#92f56d20310b59bbc3ee905c1ad5fab7dbcf6e09",
     "fontawesome": "~4.0.3",
     "spectrum": "~1.3.4"
   },

package.json

@@ -1,7 +1,7 @@
 {
   "name": "echoplexus",
   "main": "index.nw.html",
-  "version": "0.2.3",
+  "version": "0.2.6",
   "description": "A modular, anonymous, real-time chatting system.",
   "scripts": {
     "test": "bower install; grunt build; testem ci --launch phantomjs --file ./testem.json"
@@ -61,7 +61,9 @@
     "grunt-browserify": "~1.3.0",
     "browserify": "~3.20.2",
     "testem": "~0.6.2",
-    "grunt-contrib-sass": "0.7.3"
+    "grunt-contrib-sass": "0.7.3",
+    "q": "~1.0.1",
+    "irc": "git://github.com/qq99/node-irc.git#70db2d41bc50b29e34e90cc296ef1a639aff954e"
   },
   "devDependencies": {
     "bower": "~0.9.2",

sass/embedded.scss

@@ -149,3 +149,7 @@ body.highlight_mine {
 .emoji {
   width: 20px;
 }
+
+.growl {
+  display: none !important;
+}

sass/left-sidenav.scss

@@ -34,7 +34,7 @@ $module-button-height: 3.5em;
   bottom: 0;
   width: 100%;
 
-  button {
+  .button {
     font-size: 1.5em;
   }
   .button-description {
@@ -65,7 +65,7 @@ $module-button-height: 3.5em;
   .activity-indicator {
     display: none;
     position: absolute;
-    width: 2px;
+    width: 4px;
     height: 100%;
     left: 0;
     top: 0;
@@ -81,7 +81,7 @@ $module-button-height: 3.5em;
   width: 100%;
   overflow-x: hidden;
   overflow-y: auto;
-  button {
+  .button {
     width: 100%;
     font-size: 1.3em;
     .channel-button-content {
@@ -105,7 +105,7 @@ $module-button-height: 3.5em;
       text-shadow: 1px 1px 0px darken($nav-primary, 10%);
     }
   }
-  button.active {
+  .button.active {
     background: lighten($nav-primary, 5%);
   }
   .channel-button-body {
@@ -115,6 +115,7 @@ $module-button-height: 3.5em;
     font-size: 0.9em;
     width: 100%;
     display: block;
+    color: lighten($nav-primary, 30%);
   }
   .topic {
     font-size:0.7em;
@@ -131,19 +132,19 @@ $module-button-height: 3.5em;
       display: inline-block;
     }
     .active {
-      color: #277527;
+      color: $active-color;
     }
   }
-  button.active {
+  .button.active {
     .topic {
       max-height: 100%;
       white-space: normal;
-      color: lighten($nav-primary, 30%);
+      color: lighten($nav-primary, 40%);
     }
   }
 }
 
-.channels button {
+.channels .button {
   border-bottom: 1px solid lighten($nav-primary, 5%);
 }
 

sass/main.scss

@@ -367,26 +367,6 @@ header {
 	position: relative;
 	min-height:26px;
 	z-index:2;
-	.count {
-		position: absolute;
-		top: 0;
-		right: 0;
-		font-size: 0.75em;
-		div	{
-			display:inline-block;
-			margin-left: 0.5em;
-			&.active {
-				.value {
-					color:green;
-				}
-			}
-			&.total {
-				.value {
-					color:yellow;
-				}
-			}
-		}
-	}
 }
 
 #info-overlay {

sass/support-bar.scss

@@ -43,10 +43,14 @@ $nav-secondary: #2A2C2B;
   font-family: $pretty-font-family;
 
   .nick {
+    color: lighten($nav-primary, 50%);
     max-width: 12em;
     text-overflow: ellipsis;
     white-space: nowrap;
     overflow: hidden;
+    &.active {
+      color: $active-color;
+    }
   }
   .body {
     font-size: 0.9em;

sass/tooltips.scss

@@ -1,46 +1,43 @@
-.tooltip-target {
-  cursor:help;
-  > * {
-    cursor:help !important;
-  }
-}
 .tooltip {
   z-index:1000;
-  font-family:$pretty-font-family;
-  &.warn {
-    .title {
-      color:orange;
-    }
-  }
-  &.success {
-    .title {
-      color:green;
-    }
-  }
-  $title-color:rgba(109,116,255,0.15);
+  font-family: $pretty-font-family;
+  color: white;
+  $title-color: black;
   $arrow-width:10px;
   $arrow-height:5px;
   position: absolute;
-  background: $darkgrey;
+  background: black;
+  &.danger, &.error {
+    background: $error;
+  }
+  &.success {
+    background: $success;
+  }
+  color: white;
   margin-top:10px;
   width: 16em;
-  font-size: 1em;
-  border-radius: 1em;
-  margin-left: -8em;
+  font-size: 0.9em;
+  border-radius: 0.5em;
+  margin-left: -14em;
   text-align: center;
-  box-shadow:2px 2px 10px rgba(0,0,0,0.9);
-  @include transition(opacity 0.2s ease-in-out);
+
+  &.from-left {
+    margin-left: 0;
+  }
+
   .title {
-    padding:0.5em;
-    background:$title-color;
+    margin: 0.25em;
+    background: $title-color;
     border-top-left-radius: 1em;
     border-top-right-radius: 1em;
     font-weight:bold;
+    border-top-right-radius: 0.5em;
+    border-top-left-radius: 0.5em;
   }
   .body {
     font-size:0.9em;
-    margin:0.5em 1em 0.75em 1em;
-    color:#ABABAB;
+    margin: 0.5em 0.85em 0.7em 0.85em;
+    word-break: break-word;
   }
   &::before {
     /* upward arrow */
@@ -49,11 +46,31 @@
     border-left: $arrow-width solid transparent;
     border-right: $arrow-width solid transparent;
     border-bottom: $arrow-height solid $title-color;
+    border-top: none;
     width: 0px;
     height: 0px;
     box-sizing: content-box;
     top: -$arrow-height;
-    left: 50%;
+    right: 1em;
     margin-left: -$arrow-width;
+    border-style: inset !important;
+  }
+  &.on-top::before {
+    /* downward arrow */
+    position: absolute;
+    content: "";
+    border-left: $arrow-width solid transparent;
+    border-right: $arrow-width solid transparent;
+    border-top: $arrow-height solid $title-color;
+    border-bottom: none;
+    width: 0px;
+    height: 0px;
+    box-sizing: content-box;
+    top: 100%;
+    right: 1em;
+    margin-left: -$arrow-width;
+  }
+  &.from-left::before, &.on-top.from-left::before {
+    right: 14em;
   }
 }