mad_chatter 0.2.9 → 0.3.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (80) hide show
  1. data/.gitignore +2 -1
  2. data/.rvmrc +1 -0
  3. data/Gemfile.lock +1 -3
  4. data/README.md +25 -20
  5. data/lib/mad_chatter/actions/dsl.rb +4 -10
  6. data/lib/mad_chatter/actions.rb +29 -0
  7. data/lib/mad_chatter/channel.rb +56 -0
  8. data/lib/mad_chatter/config.rb +22 -5
  9. data/lib/mad_chatter/connection.rb +29 -0
  10. data/lib/mad_chatter/extensions.rb +12 -0
  11. data/lib/mad_chatter/markdown_renderer.rb +6 -0
  12. data/lib/mad_chatter/message.rb +39 -12
  13. data/lib/mad_chatter/message_history.rb +8 -5
  14. data/lib/mad_chatter/message_listener.rb +17 -0
  15. data/lib/mad_chatter/message_listeners/code.rb +30 -0
  16. data/lib/mad_chatter/message_listeners/image.rb +27 -0
  17. data/lib/mad_chatter/message_listeners/join.rb +30 -0
  18. data/lib/mad_chatter/message_listeners/markdown.rb +45 -0
  19. data/lib/mad_chatter/message_listeners/nick.rb +26 -0
  20. data/lib/mad_chatter/server.rb +0 -55
  21. data/lib/mad_chatter/servers/em_websocket.rb +5 -14
  22. data/lib/mad_chatter/user.rb +78 -0
  23. data/lib/mad_chatter/users.rb +32 -24
  24. data/lib/mad_chatter/version.rb +1 -1
  25. data/lib/mad_chatter.rb +98 -34
  26. data/mad_chatter.gemspec +1 -1
  27. data/screenshot.png +0 -0
  28. data/spec/actions_spec.rb +7 -0
  29. data/spec/message_history_spec.rb +12 -10
  30. data/spec/message_listeners/code_spec.rb +37 -0
  31. data/spec/message_listeners/join_spec.rb +34 -0
  32. data/spec/message_listeners/markdown_spec.rb +47 -0
  33. data/spec/message_spec.rb +28 -16
  34. data/spec/server_spec.rb +43 -0
  35. data/spec/users_spec.rb +23 -0
  36. data/templates/extensions/example.rb +1 -1
  37. data/templates/extensions.rb +16 -14
  38. data/templates/web/css/bootstrap.css +3363 -0
  39. data/templates/web/css/bootstrap.min.css +610 -0
  40. data/templates/web/css/bootstrap.min.responsive.css +3 -0
  41. data/templates/web/css/bootstrap.responsive.css +567 -0
  42. data/templates/web/css/mad_chatter.css +59 -0
  43. data/templates/web/{styles.css → css/styles.css} +26 -20
  44. data/templates/web/img/glyphicons-halflings-white.png +0 -0
  45. data/templates/web/img/glyphicons-halflings.png +0 -0
  46. data/templates/web/index.html +173 -40
  47. data/templates/web/js/bootstrap.js +1722 -0
  48. data/templates/web/js/bootstrap.min.js +1 -0
  49. data/templates/web/js/mad_chatter.js +292 -0
  50. data/templates/web/{mad_chatter_actions.js → js/mad_chatter_actions.js} +0 -0
  51. data/templates/web/js/mad_chatter_config.js +3 -0
  52. data/templates/web/js/swfobject.js +4 -0
  53. data/templates/web/js/web_socket.js +389 -0
  54. data/templates/web/swf/WebSocketMain.swf +0 -0
  55. metadata +65 -62
  56. data/TODO.txt +0 -10
  57. data/templates/web/mad_chatter.js +0 -161
  58. data/templates/web/mad_chatter_config.js +0 -1
  59. data/templates/web/markitup/jquery.markitup.js +0 -593
  60. data/templates/web/markitup/sets/markdown/images/bold.png +0 -0
  61. data/templates/web/markitup/sets/markdown/images/code.png +0 -0
  62. data/templates/web/markitup/sets/markdown/images/h1.png +0 -0
  63. data/templates/web/markitup/sets/markdown/images/h2.png +0 -0
  64. data/templates/web/markitup/sets/markdown/images/h3.png +0 -0
  65. data/templates/web/markitup/sets/markdown/images/h4.png +0 -0
  66. data/templates/web/markitup/sets/markdown/images/h5.png +0 -0
  67. data/templates/web/markitup/sets/markdown/images/h6.png +0 -0
  68. data/templates/web/markitup/sets/markdown/images/italic.png +0 -0
  69. data/templates/web/markitup/sets/markdown/images/link.png +0 -0
  70. data/templates/web/markitup/sets/markdown/images/list-bullet.png +0 -0
  71. data/templates/web/markitup/sets/markdown/images/list-numeric.png +0 -0
  72. data/templates/web/markitup/sets/markdown/images/picture.png +0 -0
  73. data/templates/web/markitup/sets/markdown/images/preview.png +0 -0
  74. data/templates/web/markitup/sets/markdown/images/quotes.png +0 -0
  75. data/templates/web/markitup/sets/markdown/readme.txt +0 -11
  76. data/templates/web/markitup/sets/markdown/style.css +0 -6
  77. data/templates/web/markitup/skins/mad_chatter/images/handle.png +0 -0
  78. data/templates/web/markitup/skins/mad_chatter/images/menu.png +0 -0
  79. data/templates/web/markitup/skins/mad_chatter/images/submenu.png +0 -0
  80. data/templates/web/markitup/skins/mad_chatter/style.css +0 -121
@@ -59,28 +59,33 @@ table {
59
59
  font: 25px Verdana, Geneva, Arial, Helvetica, sans-serif;
60
60
  }
61
61
 
62
- #pick_a_username {
62
+ #login_screen #pick_a_username {
63
63
  text-align: center;
64
64
  background: #fff;
65
65
  padding: 5px 10px 10px;
66
66
  font: 18px Verdana, Geneva, Arial, Helvetica, sans-serif;
67
67
  }
68
68
 
69
- #pick_a_username p {
69
+ #login_screen #pick_a_username p {
70
70
  margin: 10px;
71
71
  }
72
- #pick_a_username input, #pick_a_username button {
72
+ #login_screen #pick_a_username input, #login_screen #pick_a_username button {
73
73
  font: 14px Verdana, Geneva, Arial, Helvetica, sans-serif;
74
74
  padding: 5px;
75
75
  }
76
76
 
77
- #chatroom{
77
+ #chat_wrapper {
78
78
  margin:0;
79
79
  padding:0 0 100px 200px;
80
80
  font: 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
81
81
  }
82
82
 
83
- #sidebar{
83
+ #chat_wrapper ul#tabs {
84
+ float: left;
85
+ background: green;
86
+ }
87
+
88
+ #chat_wrapper .sidebar{
84
89
  position:absolute;
85
90
  top:0;
86
91
  left:0;
@@ -91,42 +96,43 @@ table {
91
96
  padding: 20px 5px 0 15px;
92
97
  }
93
98
 
94
- #sidebar h2 {
99
+ #chat_wrapper .sidebar h2 {
95
100
  font: 14px Verdana, Geneva, Arial, Helvetica, sans-serif;
96
101
  margin-bottom: 10px;
97
102
  }
98
103
 
99
- #sidebar ul#members li {
104
+ #chat_wrapper .room ul.users li {
100
105
  margin-left: 1em;
101
106
  }
102
107
 
103
- #messages {
108
+ #chat_wrapper .room .messages {
104
109
  padding: 20px 10px 0px 40px;
105
110
  }
106
111
 
107
- #messages p {
112
+ #chat_wrapper .room .messages p {
108
113
  padding: 0.25em;
109
114
  clear: both;
110
115
  }
111
116
 
112
- #messages strong { font-weight: bold; }
113
- #messages em { font-style: italic; }
117
+ #chat_wrapper .room .messages strong { font-weight: bold; }
118
+ #chat_wrapper .room .messages em { font-style: italic; }
114
119
 
115
- #messages p.message .username {
120
+ #chat_wrapper .room .messages p.message .username {
116
121
  font-weight: bold;
117
122
  }
118
123
 
119
- #messages p.message time, #messages p.status time {
124
+ #chat_wrapper .room .messages p.message time,
125
+ #chat_wrapper .room .messages p.status time {
120
126
  float: right;
121
127
  color: #999;
122
128
  }
123
129
 
124
- #messages p.status {
130
+ #chat_wrapper .room .messages p.status {
125
131
  text-align: center;
126
132
  color: #999;
127
133
  }
128
134
 
129
- #keyboard {
135
+ #chat_wrapper .room .new_message {
130
136
  bottom: 0;
131
137
  left: 220px;
132
138
  width: 100%;
@@ -134,21 +140,21 @@ table {
134
140
  padding: 0 10px;
135
141
  }
136
142
 
137
- #keyboard input {
143
+ #chat_wrapper .room .new_message input {
138
144
  width: 15%;
139
145
  padding: 5px;
140
146
  }
141
147
 
142
148
  @media screen{
143
- #chatroom > div#sidebar { position:fixed; }
144
- #chatroom > div#keyboard { position:fixed; }
149
+ #chat_wrapper .sidebar { position:fixed; }
150
+ #chat_wrapper .room .new_message { position:fixed; }
145
151
  }
146
152
 
147
- * html #chatroom{
153
+ * html #chat_wrapper {
148
154
  overflow:hidden;
149
155
  }
150
156
 
151
- * html div#messages{
157
+ * html #chat_wrapper .room .messages {
152
158
  height:100%;
153
159
  overflow:auto;
154
160
  }
@@ -1,49 +1,182 @@
1
1
  <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <title>Mad Chatter</title>
5
- <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js'></script>
6
- <script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js'></script>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <title>Mad Chatter</title>
6
+ <meta name="description" content="Mad Chatter">
7
+ <meta name="author" content="Andrew Havens">
7
8
 
8
- <!-- markdown editor -->
9
- <script type="text/javascript" src="markitup/jquery.markitup.js"></script>
10
- <link rel="stylesheet" type="text/css" href="markitup/skins/mad_chatter/style.css" />
11
- <link rel="stylesheet" type="text/css" href="markitup/sets/markdown/style.css" />
9
+ <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
10
+ <!--[if lt IE 9]>
11
+ <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
12
+ <![endif]-->
13
+
14
+ <!-- Le styles -->
15
+ <link href="css/bootstrap.css" rel="stylesheet">
16
+ <link href="css/mad_chatter.css" rel="stylesheet">
17
+
18
+ <!-- Le fav and touch icons -->
19
+ <link rel="shortcut icon" href="img/favicon.ico">
20
+ <link rel="apple-touch-icon" href="img/apple-touch-icon.png">
21
+ <link rel="apple-touch-icon" sizes="72x72" href="img/apple-touch-icon-72x72.png">
22
+ <link rel="apple-touch-icon" sizes="114x114" href="img/apple-touch-icon-114x114.png">
23
+ </head>
24
+
25
+ <body>
26
+
27
+ <div id="login_screen" class="container-fluid">
28
+ <div class="hero-unit">
29
+ <h1>Welcome to Mad&nbsp;Chatter!</h1>
30
+ <p>You are about to experience the best chat application evah!</p>
31
+ <form id="pick_a_username" class="well form-search">
32
+ <input id="username" type="text" placeholder="What is your name?">
33
+ <button id="join" class="btn">Join</button>
34
+ </form>
35
+ </div>
36
+ </div>
37
+
38
+ <div id="chat_wrapper hide">
39
+
40
+ <div class="navbar navbar-fixed-top">
41
+ <div class="navbar-inner">
42
+ <div class="container-fluid">
43
+ <a class="brand" href="#">Mad Chatter</a>
44
+ <ul id="channel_tabs" class="nav"></ul>
45
+ <p id="users-nav" class="navbar-text pull-right hide">Who's Here?</p>
46
+ </div>
47
+ </div>
48
+ </div>
49
+
50
+ <div data-channel="lobby" class="channel container-fluid hide">
51
+ <h2>Rooms</h2>
52
+ <ul id="channels"></ul>
53
+ <p class="create_room" style="display:none">
54
+ It doesn't look like there are any rooms here.
55
+ Why don't you create one? <button class="btn btn-large">Create a Room</button>
56
+ </p>
57
+ </div>
58
+
59
+ <div id="channel_template" class="channel container-fluid hide">
60
+
61
+ <div class="users-list hide">
62
+ <ul class="users"></ul>
63
+ </div>
64
+
65
+ <div class="messages container-fluid"></div>
66
+
67
+ <div class="new_message well row-fluid">
68
+ <div class="span10">
69
+ <input type="text"></input>
70
+ </div>
71
+ <div class="btn-toolbar span2" style="margin-top:0">
72
+ <div class="share btn-group">
73
+ <a class="send_message btn" href="#">Share</a>
74
+ <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
75
+ <span class="caret"></span>
76
+ </a>
77
+ <ul class="dropdown-menu bottom-up">
78
+ <li><a data-toggle="modal" href="#share_photo">Photo</a></li>
79
+ <li><a data-toggle="modal" href="#share_file">Document</a></li>
80
+ <li><a data-toggle="modal" href="#share_code">Code Sample</a></li>
81
+ </ul>
82
+ </div>
83
+ </div>
84
+ </div>
85
+ </div>
86
+
87
+ <div id="share_photo" class="modal fade hide">
88
+ <div class="modal-header">
89
+ <a class="close" data-dismiss="modal">×</a>
90
+ <h3>Share Photo</h3>
91
+ </div>
92
+ <div class="modal-body form-horizontal">
93
+ <div class="control-group">
94
+ <label class="control-label" for="upload">Upload File</label>
95
+ <div class="controls">
96
+ <input class="input-file" type="file" name="upload">
97
+ <span class="help-block">Doesn't Work Yet</span>
98
+ </div>
99
+ </div>
100
+ <div class="control-group">
101
+ <label class="control-label" for="url">Photo URL</label>
102
+ <div class="controls">
103
+ <input type="text" class="input-xlarge" name="url">
104
+ </div>
105
+ </div>
106
+ </div>
107
+ <div class="modal-footer">
108
+ <a href="#" class="btn btn-primary">Share</a>
109
+ <a href="#" class="btn" data-dismiss="modal">Cancel</a>
110
+ </div>
111
+ </div>
112
+
113
+ <div id="share_file" class="modal fade hide">
114
+ <div class="modal-header">
115
+ <a class="close" data-dismiss="modal">×</a>
116
+ <h3>Share Document</h3>
117
+ </div>
118
+ <div class="modal-body form-horizontal">
119
+ <div class="control-group">
120
+ <label class="control-label" for="upload">Upload File</label>
121
+ <div class="controls">
122
+ <input class="input-file" type="file" name="upload">
123
+ <span class="help-block">Doesn't Work Yet</span>
124
+ </div>
125
+ </div>
126
+ </div>
127
+ <div class="modal-footer">
128
+ <a href="#" class="btn btn-primary">Share</a>
129
+ <a href="#" class="btn" data-dismiss="modal">Cancel</a>
130
+ </div>
131
+ </div>
132
+
133
+
134
+ <div id="share_code" class="modal fade hide">
135
+ <div class="modal-header">
136
+ <a class="close" data-dismiss="modal">×</a>
137
+ <h3>Share Code Sample</h3>
138
+ </div>
139
+ <div class="modal-body">
140
+ <textarea name="code" rows="10"></textarea>
141
+ </div>
142
+ <div class="modal-footer">
143
+ <a href="#" class="btn btn-primary">Share</a>
144
+ <a href="#" class="btn" data-dismiss="modal">Cancel</a>
145
+ </div>
146
+ </div>
147
+
148
+ </div>
12
149
 
13
- <!-- Mad Chatter -->
14
- <script src='mad_chatter.js'></script>
15
- <script src='mad_chatter_actions.js'></script>
16
- <script src='mad_chatter_config.js'></script>
17
- <link rel="stylesheet" href="styles.css">
150
+ <div id="disconnected" class="modal fade hide">
151
+ <div class="modal-header">
152
+ <a class="close" data-dismiss="modal">×</a>
153
+ <h3>Disconnected</h3>
154
+ </div>
155
+ <div class="modal-body">
156
+ <p>Looks like you've been disconnected from the server. We'll try to reconnect you.</p>
157
+ </div>
158
+ <div class="modal-footer">
159
+ <a href="#" class="btn btn-primary">Okay</a>
160
+ <a href="#" class="btn" data-dismiss="modal">Cancel</a>
161
+ </div>
162
+ </div>
163
+
164
+ <!-- Le javascript
165
+ ================================================== -->
166
+ <!-- Placed at the end of the document so the pages load faster -->
167
+ <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
168
+ <script src="js/bootstrap.min.js"></script>
169
+ <script src="js/swfobject.js"></script>
170
+ <script src="js/web_socket.js"></script>
18
171
 
172
+ <!-- Mad Chatter -->
173
+ <script src='js/mad_chatter.js'></script>
174
+ <script src='js/mad_chatter_actions.js'></script>
175
+ <script src='js/mad_chatter_config.js'></script>
19
176
  <script>
20
177
  $(document).ready(function(){
21
178
  MadChatter.init(mad_chatter_config);
22
179
  });
23
180
  </script>
24
- </head>
25
- <body>
26
-
27
- <div id="login_screen">
28
- <header>
29
- <h1>Welcome!</h1>
30
- </header>
31
- <div id="pick_a_username">
32
- <p>What is your name?</p>
33
- <input id="username" type="text"> <button id="join">Join</button>
34
- </div>
35
- </div>
36
-
37
- <div id="chatroom">
38
- <div id="sidebar">
39
- <h2>Members</h2>
40
- <ul id="members"></ul>
41
- </div>
42
- <div id="keyboard">
43
- <textarea></textarea>
44
- </div>
45
- <div id="messages"></div>
46
- </div>
47
-
48
- </body>
49
- </html>
181
+ </body>
182
+ </html>