");
49 | builder.append(RoomPage.renderActivity(room, segment));
50 | builder.append("
");
51 | }
52 |
53 | return Reply.with(gson.toJson(ImmutableMap.of(
54 | "html", builder.toString()
55 | ))).type("application/json");
56 | }
57 | }
58 |
--------------------------------------------------------------------------------
/src/main/java/com/wideplay/crosstalk/web/AsyncPostService.java:
--------------------------------------------------------------------------------
1 | package com.wideplay.crosstalk.web;
2 |
3 | import com.google.common.collect.ImmutableMap;
4 | import com.google.common.collect.Lists;
5 | import com.google.gson.Gson;
6 | import com.google.inject.Inject;
7 | import com.google.sitebricks.At;
8 | import com.google.sitebricks.client.Web;
9 | import com.google.sitebricks.headless.Reply;
10 | import com.google.sitebricks.headless.Service;
11 | import com.google.sitebricks.http.Post;
12 | import com.wideplay.crosstalk.data.Message;
13 | import com.wideplay.crosstalk.data.Occupancy;
14 | import com.wideplay.crosstalk.data.Room;
15 | import com.wideplay.crosstalk.data.RoomTextIndex;
16 | import com.wideplay.crosstalk.data.User;
17 | import com.wideplay.crosstalk.data.store.MessageStore;
18 | import com.wideplay.crosstalk.data.store.RoomStore;
19 | import com.wideplay.crosstalk.web.auth.Secure;
20 | import org.slf4j.Logger;
21 | import org.slf4j.LoggerFactory;
22 |
23 | import java.net.URLEncoder;
24 | import java.util.Date;
25 | import java.util.List;
26 | import java.util.UUID;
27 |
28 | /**
29 | * @author dhanji@gmail.com (Dhanji R. Prasanna)
30 | */
31 | @At("/r/async") @Service
32 | public class AsyncPostService {
33 | private static final Logger log = LoggerFactory.getLogger(AsyncPostService.class);
34 | public static final int MAX_WORDS = 20;
35 |
36 | @Inject
37 | private CurrentUser currentUser;
38 |
39 | @Inject
40 | private RoomStore roomStore;
41 |
42 | @Inject
43 | private MessageStore messageStore;
44 |
45 | @Inject
46 | private Gson gson;
47 |
48 | @Inject
49 | private Web web;
50 |
51 | @Inject
52 | private Broadcaster broadcaster;
53 |
54 | @At("/message") @Post @Secure
55 | Reply receiveMessage(ClientRequest request) {
56 | Room room = roomStore.byId(request.getRoom());
57 |
58 | Message message = new Message();
59 | message.setId(UUID.randomUUID().getMostSignificantBits());
60 | message.setText(request.getText());
61 | message.setRoom(room);
62 | message.setPostedOn(new Date());
63 | if (request.getAttachmentId() != null) {
64 | message.setAttachment(request.getAttachmentId());
65 | }
66 |
67 | // Temporary hack while we dont have proper user db.
68 | User author = currentUser.getUser();
69 | message.setAuthor(author);
70 |
71 | log.info("Received post {}", message);
72 |
73 | // Reflect to other clients.
74 | String json = gson.toJson(ImmutableMap.of(
75 | "rpc", "receive",
76 | "post", message
77 | ));
78 | broadcaster.broadcast(room, author, json);
79 |
80 | // Save AFTER broadcast (reduces latency). This is used for activity segments.
81 | room.getOccupancy().incrementNow(); // Increment activity in the room by 1.
82 | roomStore.save(room.getOccupancy());
83 | messageStore.save(message);
84 |
85 | return Reply.saying().ok();
86 | }
87 |
88 | @At("/join") @Post
89 | Reply joinRoom(ClientRequest request) {
90 | Room room = roomStore.byId(request.getRoom());
91 |
92 | User joiner = currentUser.getUser();
93 | log.debug("Received join notification: {}", joiner.getUsername());
94 | String json = gson.toJson(ImmutableMap.of(
95 | "rpc", "join",
96 | "joiner", joiner
97 | ));
98 | broadcaster.broadcast(room, joiner, json);
99 |
100 | // This is a bit hacky, but we update occupancy BEFORE this RPC is called
101 | // in the home screen. We should move it here.
102 |
103 | return Reply.saying().ok();
104 | }
105 |
106 | @At("/leave") @Post
107 | Reply leaveRoom(ClientRequest request) {
108 | Room room = roomStore.byId(request.getRoom());
109 |
110 | User leaver = currentUser.getUser();
111 | log.info("Received leave notification: {}", leaver.getUsername());
112 | String json = gson.toJson(ImmutableMap.of(
113 | "rpc", "leave",
114 | "leaver", leaver
115 | ));
116 | broadcaster.broadcast(room, leaver, json);
117 |
118 | return Reply.saying().ok();
119 | }
120 |
121 | @At("/ping") @Post
122 | Reply ping(ClientRequest request, CurrentUser currentUser) {
123 | String hashtag = URLEncoder.encode("#webstock");
124 |
125 | // Update active status timestamp of this user/connection
126 | //...
127 |
128 | return Reply.saying().ok();
129 | }
130 |
131 | @At("/add-term") @Post @Secure
132 | Reply addTerm(ClientRequest request) {
133 |
134 | Room room = roomStore.byId(request.getRoom());
135 | Occupancy occupancy = room.getOccupancy();
136 | String term = request.getText();
137 | if (!occupancy.getTerms().contains(term)) {
138 | occupancy.getTerms().add(term);
139 | roomStore.save(occupancy);
140 | log.info("New term added {} in room {}", term, room.getName());
141 | }
142 |
143 | return Reply.saying().ok();
144 | }
145 |
146 | @At("/remove-term") @Post @Secure
147 | Reply removeTerm(ClientRequest request) {
148 |
149 | Room room = roomStore.byId(request.getRoom());
150 | Occupancy occupancy = room.getOccupancy();
151 | String term = request.getText();
152 | if (occupancy.getTerms().contains(term)) {
153 | occupancy.getTerms().remove(term);
154 | roomStore.save(occupancy);
155 | log.info("Term deleted {} in room {}", term, room.getName());
156 | }
157 |
158 | return Reply.saying().ok();
159 | }
160 |
161 | @At("/topics") @Post @Secure
162 | Reply topics() {
163 | RoomTextIndex index = roomStore.indexOf();
164 | if (null == index) {
165 | return Reply.with("[]");
166 | }
167 | List
16 |
17 |
21 |
29 |
30 |
31 |
32 |
33 |
34 |
--------------------------------------------------------------------------------
/src/main/webapp/HomePage.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | CrossTalk
18 |Real time chat for events
19 |About Us
20 |
22 |
28 | CrossTalk is a realtime group chat product for cool events like webstock.
23 | It was built by
24 | @themaninblue and
25 | @dhanji, from Google.
26 | Share your thoughts with us in the CrossTalk Room!
27 |
19 |
20 |
24 |
28 |
29 |
64 |
65 |
69 |
70 |
71 |
72 |
--------------------------------------------------------------------------------
/src/main/webapp/RoomAdminPage.html:
--------------------------------------------------------------------------------
1 |
3 |
4 |
5 | CrossTalk
21 |Real time chat for events
22 | 23 |Click Tap on the room you'd like to visit: or create a new chat room
30 |-
31 |
32 | @Repeat(items=rooms, var="room")
33 |
-
34 | 35 | ${room.displayName} 36 | 37 | 38 | 39 | 40 |61 |
41 | 52 |${__page.contributors(room)} Contributors:
42 |-
43 |
47 | @Repeat(items=__page.occupants(room), var="user")
48 |
- ${user.displayName.split(' ')[0]}${!isLast ? ', ' : ''} 49 |
53 | 60 |People are talking about
54 |-
55 | @Repeat(items=__page.trends(room), var="trend")
56 |
- ${trend.word} 57 | 58 |
62 |
Click / tap on a topic you'd like to explore:
66 |-
67 |
10 |
19 |
20 | New room:
11 |
18 |
21 | @Repeat(items=rooms, var="room")
22 |
34 |
35 |
--------------------------------------------------------------------------------
/src/main/webapp/RoomPage.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
23 | ${room.name}
24 |
32 |
33 |
22 |
27 | ${cometToken}
23 | ${room.id}
24 | ${user.username}
25 | ${user.avatar}
26 | CrossTalk
28 |
29 |
38 |
30 |
32 |
36 |
37 | ${room.displayName}
31 |
39 |
90 |
91 |
40 | @Repeat(items=room.occupancy.segments, var="segment")
41 |
46 |
43 | ${ __page.activity(segment) }
44 |
45 |
47 |
70 | 48 | Current contributors 49 |
50 |
51 | @Repeat(items=occupants, var="occupant")
52 | 
54 |
55 |
60 |
54 | 61 | Also pulling buzzes matching: 62 |
63 | 69 |
71 |
89 |
72 |
88 |
73 | @Repeat(items=messages, var="post")
74 |
87 |
75 |
76 |
77 |
86 |
78 |
79 |
85 | ${post.text}
80 | @ShowIf(post.attachmentId != null)
81 |
82 | 
83 |
84 |
92 |
93 |
94 | @ShowIf(user.username != 'anonymous')
95 |
112 |
113 |
114 |
115 |
--------------------------------------------------------------------------------
/src/main/webapp/WEB-INF/appengine-web.xml:
--------------------------------------------------------------------------------
1 |
2 |
96 |
104 |
105 | @ShowIf(user.username == 'anonymous')
106 |
97 |
103 | You
98 |
99 |
100 |
101 |
102 |
107 |
111 |
108 | 
Sign in with ${twitterMode ? 'twitter' : 'Buzz'} to start chatting
109 |
110 | Sign in with ${twitterMode ? 'twitter' : 'Buzz'} to start chatting
109 | ' + term + '
');
122 | input.val('');
123 |
124 | inputContainer.hide();
125 | crosstalk.send("add-term", { room: $('#room-id').text(), text: term }, crosstalk.noop);
126 | }
127 | });
128 |
129 | // Read current user information.
130 | crosstalk.currentUserInfo = {
131 | displayName: $('#current-user').html(),
132 | username: $('#current-user').html(),
133 | avatar: $('#current-user-avatar').html()
134 | };
135 |
136 | // Send leave room signal when the page is unloaded.
137 | $(window).unload(function() {
138 | crosstalk.send("leave", { room: $('#room-id').text() }, crosstalk.noop);
139 | });
140 |
141 | // Kick off timer to refresh the index.
142 | setInterval(crosstalk.refreshIndex, 5 * 60 * 1000 /* 5 minutes */);
143 |
144 | // Kick off timer to ping the server with activity.
145 | setInterval(crosstalk.ping, 30 * 1000 /* seconds */);
146 |
147 | // Join room!
148 | crosstalk.send("join", { room: $('#room-id').text() }, crosstalk.noop);
149 | };
150 |
151 | /**
152 | * Posts a new local message and sends to server.
153 | */
154 | crosstalk.post_ = function() {
155 | scrollToBottom();
156 |
157 | var talkbox = $('#talkbox');
158 | var text = talkbox.val();
159 | if ($.trim(text) == '') {
160 | return;
161 | }
162 | talkbox.val('');
163 | var token = $('#comet-token').html();
164 |
165 | var attachment = talkbox.data('attachmentId');
166 |
167 | // escape html:
168 | text = $('').text(text).html();
169 |
170 | var now = new Date();
171 | var post = {
172 | author: crosstalk.currentUserInfo,
173 | postedOn: now.getHours() + ':' + now.getMinutes(),
174 | text: text
175 | };
176 | var data = { room: $('#room-id').text(), text: text, token: token };
177 | if (attachment) {
178 | data.attachmentId = attachment;
179 | post.attachmentId = attachment;
180 |
181 | // Clear attachments.
182 | talkbox.removeData('attachment');
183 | talkbox.removeData('attachmentId');
184 | }
185 | crosstalk.insertMessage_(post);
186 |
187 | // Send to the server.
188 | crosstalk.send("message", data, crosstalk.noop);
189 | };
190 |
191 | /**
192 | * Inserts message into dom and nothing else.
193 | */
194 | crosstalk.expandLinks_ = function(linkset, target, attachment, msg, refreshScroll) {
195 | var isImages = false;
196 | for (var i = 0; i < linkset.images.length; i ++) {
197 | var image = linkset.images[i];
198 |
199 | if (refreshScroll) {
200 | target.append('' : ''); /** temporary **/
354 | }
355 | };
356 |
357 | crosstalk.leaveRoom_ = function(data) {
358 | if (data.leaver.username == 'anonymous') {
359 | // Treat anonymous leavers as lurkers (they have no avatar).
360 | var countRef = $('#lurker-count');
361 | var count = parseInt(countRef.html());
362 | if (count) // guard against weirdness.
363 | countRef.html(count - 1);
364 | } else {
365 | // Do nothing if we already know about this contributor.
366 | $('#av-' + data.leaver.username).remove();
367 | }
368 | };
369 |
--------------------------------------------------------------------------------
/src/main/webapp/js/main.js:
--------------------------------------------------------------------------------
1 |
2 | var TRANSLATE3D = false;
3 |
4 | if (navigator.userAgent.indexOf('iPhone') >= 0 || navigator.userAgent.indexOf('iPad') >= 0) {
5 | TRANSLATE3D = true;
6 |
7 | $('html').removeClass('notIos');
8 | $('html').addClass('ios');
9 | }
10 |
11 | var touch = null;
12 |
13 | $(init);
14 |
15 | function init() {
16 | if ($('#mobileCheck').css('display') != 'none') {
17 | $('#roomList > li')
18 | .removeClass('active')
19 | .removeClass('future')
20 | .addClass('inactive')
21 |
22 | var APPEAR_TIME = 1000;
23 |
24 | var roomListItems = $('#roomList > li > .anchor');
25 |
26 | // Add click handlers to act as anchors for each card
27 | roomListItems.click(function() {
28 | window.location = $('a', this).get(0).href;
29 |
30 | return false;
31 | });
32 |
33 | // Truncate text in room titles
34 | $('> a', roomListItems).each(function() {
35 | var CHAR_LIMIT = 22;
36 |
37 | var originalText = $(this).text();
38 | var modifiedText = originalText;
39 | modifiedText = modifiedText.substring(0, CHAR_LIMIT);
40 |
41 | if (modifiedText.length < originalText.length) {
42 | modifiedText = modifiedText.replace(/ [^ ]*$/, '');
43 | modifiedText += '…';
44 | }
45 |
46 | $(this).html(modifiedText);
47 | });
48 |
49 | // Setup switcher
50 | $('#switcher').click(switchContent)
51 |
52 | }
53 | else {
54 | var roomListItems = $('#roomList > li > .anchor');
55 |
56 | // Add click handlers to act as anchors for each card
57 | roomListItems.click(function() {
58 | window.location = $('a', this).get(0).href;
59 |
60 | return false;
61 | });
62 | }
63 | }
64 |
65 | function switchContent() {
66 | var ul = $(this);
67 |
68 | if ($('li:first-child', ul).hasClass('on')) {
69 | $('li', ul).removeClass('on');
70 | $('li:last-child', ul).addClass('on');
71 | $('#roomContent').removeClass('on');
72 | setTimeout(initTopics, 650);
73 | }
74 | else {
75 | $('li', ul).removeClass('on');
76 | $('li:first-child', ul).addClass('on');
77 | $('#roomContent').addClass('on');
78 | $('#topicContent').removeClass('on');
79 | }
80 |
81 | return false;
82 | }
83 |
84 | var WORD_LETTERS = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z', ' ', ' ', ' ', ' ', ' ', ' ', ' ', ' '];
85 |
86 | var topicData = [
87 | {
88 | title: "HTML5",
89 | rank: 1
90 | },
91 | {
92 | title: "Gmail",
93 | rank: 2
94 | },
95 | {
96 | title: "Docs",
97 | rank: 2
98 | },
99 | {
100 | title: "Blogger",
101 | rank: 3
102 | },
103 | {
104 | title: "Hubs",
105 | rank: 3
106 | },
107 | {
108 | title: "JAPAC",
109 | rank: 3
110 | },
111 | {
112 | title: "Neon Indian",
113 | rank: 4
114 | },
115 | {
116 | title: "Eng Summit",
117 | rank: 4
118 | },
119 | {
120 | title: "Google Maps",
121 | rank: 4
122 | },
123 | {
124 | title: "MacBook Pro",
125 | rank: 4
126 | },
127 | {
128 | title: "Alan Eustace",
129 | rank: 4
130 | },
131 | {
132 | title: "Short",
133 | rank: 4
134 | },
135 | {
136 | title: "Text",
137 | rank: 4
138 | },
139 | {
140 | title: "Clock",
141 | rank: 4
142 | }
143 | ];
144 |
145 | var snippetTimer = null;
146 | var callToActionTimer = null;
147 |
148 | function initTopics() {
149 | clearTopics();
150 | $.ajax({
151 | url: '/r/async/topics',
152 | type: 'POST',
153 | data: {},
154 | success: buildTopicCloud,
155 | failure: function() {
156 | alert("Error: could not contact server.")
157 | }
158 | });
159 | setTimeout(fetchSnippet, 2000);
160 |
161 | $('#topicContent .callToAction').removeClass('off');
162 |
163 | // Fade out the call to action after 20 seconds (so that it doesn't stay on-screen while projecting)
164 | callToActionTimer = setTimeout(function() {
165 | $('#topicContent .callToAction').addClass('off');
166 | }, 20000);
167 |
168 | $('#topicContent').addClass('on')
169 | }
170 |
171 | function clearTopics() {
172 | clearTimeout(snippetTimer);
173 | clearTimeout(callToActionTimer);
174 |
175 | $('#topicList').html('');
176 | $('#topicContent .snippet').remove();
177 | }
178 |
179 | function buildTopicCloud(data) {
180 | var topicList = $('#topicList');
181 | var positioned = [];
182 |
183 | // Loaded from server.
184 | topicData = eval('(' + data + ')');
185 |
186 | // For each topic, position it so it doesn't overlap any others, but is close to the center
187 | for (var i = 0; i < topicData.length; i++) {
188 | var newTopic = $('' + topicData[i].title + ' ');
190 |
191 | newTopic.appendTo(topicList);
192 |
193 | var x = topicList.outerWidth() / 2 - newTopic.outerWidth() / 2;
194 | var y = topicList.outerHeight() / 2 - newTopic.outerHeight() / 2;
195 |
196 |
197 | var angle = Math.PI * 2 / topicData.length * i;
198 | var minSteps = null;
199 | var minX = x;
200 | var minY = y;
201 | var RETRIES = 3;
202 |
203 | // Try x = RETRIES different angles and see which allows the topic to be closest to the center
204 | for (var k = 0; k < RETRIES; k++) {
205 | newTopic
206 | .css('left', x)
207 | .css('top', y);
208 |
209 | var numSteps = 0;
210 | var newX = null;
211 | var newY = null;
212 |
213 | // While the topic is still intersecting with an existing topic
214 | while (true) {
215 | numSteps++;
216 |
217 | var intersects = false;
218 |
219 | // Check to see whether the topic is intersecting with any of the existing topics, if not: finish the while(true) loop
220 | for (var j = 0; j < positioned.length; j++) {
221 | if (elementsIntersect(positioned[j], newTopic)) {
222 | intersects = true;
223 |
224 | break;
225 | }
226 | }
227 |
228 | if (!intersects) {
229 | break;
230 | }
231 | else {
232 | if (newX == null) {
233 | newX = x;
234 | newY = y;
235 | }
236 |
237 | newX += Math.cos(angle + Math.PI * 2 / RETRIES * k) * 10;
238 | newY += Math.sin(angle + Math.PI * 2 / RETRIES * k) * 10;
239 |
240 | newTopic
241 | .css('left', newX)
242 | .css('top', newY)
243 | }
244 | }
245 |
246 | if ((minSteps == null || numSteps < minSteps) && newX != null) {
247 | minSteps = numSteps;
248 | minX = newX;
249 | minY = newY;
250 | }
251 | }
252 |
253 | newTopic
254 | .css('left', minX)
255 | .css('top', minY)
256 |
257 | positioned.push(newTopic);
258 | }
259 | }
260 |
261 | function elementsIntersect(el1, el2) {
262 | var MARGIN = 13;
263 | var el1Offset = el1.offset();
264 | var el1x1 = el1Offset.left - MARGIN;
265 | var el1x2 = el1x1 + el1.outerWidth() + MARGIN * 2;
266 | var el1y1 = el1Offset.top - MARGIN;
267 | var el1y2 = el1y1 + el1.outerHeight() + MARGIN * 2;
268 |
269 | var el2Offset = el2.offset();
270 | var el2x1 = el2Offset.left;
271 | var el2x2 = el2x1 + el2.outerWidth();
272 | var el2y1 = el2Offset.top;
273 | var el2y2 = el2y1 + el2.outerHeight();
274 |
275 | // If overlapping on x axis
276 | if (((el1x1 >= el2x1 && el1x1 <= el2x2) || (el2x1 >= el1x1 && el2x1 <= el1x2))) {
277 | // If overlapping on y axis
278 | if (((el1y1 >= el2y1 && el1y1 <= el2y2) || (el2y1 >= el1y1 && el2y1 <= el1y2))) {
279 | return true;
280 | }
281 | }
282 |
283 | return false;
284 | }
285 |
286 | function fetchSnippet() {
287 | $.ajax({
288 | url: '/r/async/random_msg',
289 | type: 'POST',
290 | data: {},
291 | success: showSnippets,
292 | failure: function() {
293 | alert("Error: could not contact server.")
294 | }
295 | });
296 | }
297 |
298 | function showSnippets(data) {
299 | var topicListItems = $('#topicList li');
300 | var item = topicListItems.eq(Math.floor(Math.random() * topicListItems.length));
301 |
302 | topicListItems.removeClass('on');
303 | item.addClass('on');
304 |
305 | // Rooms are empty. Reset Timer and leave
306 | data = eval('(' + data + ')');
307 | if (!data.text) {
308 | snippetTimer = setTimeout(fetchSnippet, 2000);
309 | return;
310 | }
311 |
312 | var randomString = data.text;
313 | var author = data.author.displayName;
314 |
315 | $('.snippet').each(function() {
316 | if ($(this).css('opacity') == '0') {
317 | $(this).remove();
318 | }
319 | });
320 |
321 | $('.snippet').css('opacity', 0);
322 |
323 | var newSnippet = $('
' + author + ' ' + randomString + '');
324 | newSnippet.appendTo('#topicContent');
325 |
326 | newSnippet
327 | .css('left', parseInt(item.css('left')) - newSnippet.outerWidth() / 2)
328 | .css('top', parseInt(item.css('top')) - newSnippet.outerHeight() - 75)
329 |
330 | var MIN_LEFT = 40;
331 |
332 | // Snippet is off left side of screen
333 | if (parseInt(newSnippet.css('left')) < MIN_LEFT) {
334 | newSnippet.css('left', parseInt(newSnippet.css('left')) + (MIN_LEFT - parseInt(newSnippet.css('left'))));
335 | }
336 |
337 | var MIN_RIGHT = 30;
338 |
339 | // Snippet is off right side of screen
340 | if (parseInt(newSnippet.css('left')) + newSnippet.outerWidth() > $(window).width() - MIN_RIGHT) {
341 | newSnippet.css('left', $(window).width() - newSnippet.outerWidth() - MIN_RIGHT);
342 | }
343 |
344 | // Snippet is off top of screen
345 | if (parseInt(newSnippet.css('top')) < 20) {
346 | newSnippet.addClass('flipped');
347 |
348 | newSnippet.css('left', parseInt(item.css('left')) + item.outerWidth() - newSnippet.outerWidth() / 2);
349 | newSnippet.css('top', parseInt(item.css('top')) + item.outerHeight() + 75);
350 | }
351 |
352 | $('.cloudPointer1', newSnippet).css('opacity', 1);
353 |
354 | setTimeout(function() {
355 | $('.cloudPointer2', newSnippet).css('opacity', 1);
356 | }, 700)
357 |
358 | setTimeout(function() {
359 | $('.cloud', newSnippet).css('opacity', 1);
360 | }, 1400)
361 |
362 | setTimeout(function() {
363 | $('.content', newSnippet).css('opacity', 1);
364 | }, 1800)
365 |
366 | setTimeout(function() {
367 | $('.content .text span', newSnippet).each(function() {
368 | var self = this;
369 | setTimeout(function() {
370 | $(self).css('opacity', 1);
371 | }, Math.random() * 1000);
372 | });
373 | }, 2100)
374 |
375 | snippetTimer = setTimeout(fetchSnippet, 8000);
376 | }
--------------------------------------------------------------------------------
/src/main/webapp/main_mobile.css:
--------------------------------------------------------------------------------
1 |
2 | /* GENERAL ========================================= */
3 |
4 | html {
5 | height: auto;
6 | }
7 |
8 | body {
9 | height: auto;
10 | overflow: auto;
11 | margin: 0 auto;
12 | }
13 |
14 | #mobileCheck {
15 | display: none;
16 | }
17 |
18 | #page {
19 | width: auto;
20 | height: auto;
21 | overflow: auto;
22 | }
23 |
24 |
25 |
26 |
27 | /* HEADER ========================================= */
28 |
29 | header {
30 | position: relative;
31 | height: 41px;
32 | background-image: none;
33 | }
34 |
35 | header > h1 {
36 | float: left;
37 | width: 155px;
38 | height: 21px;
39 | margin: 10px 0 0 15px;
40 | background-image: url(/images/logo_mobile.gif);
41 | background-repeat: no-repeat;
42 | text-indent: -9999px;
43 | }
44 |
45 | header > h2 {
46 | display: none;
47 | font-family: Arial, Helvetica, sans-serif;
48 | }
49 |
50 | #newRoom {
51 | display: none;
52 | }
53 |
54 |
55 |
56 |
57 | /* CONTENT ========================================= */
58 |
59 | #switcher {
60 | display: none;
61 | }
62 |
63 | .callToAction {
64 | position: static;
65 | width: auto;
66 | margin: 10px 10px 10px 10px;
67 | padding: 5px 10px;
68 | -webkit-border-radius: 6px;
69 | -moz-border-radius: 6px;
70 | border-radius: 6px;
71 | background-color: rgba(255,255,255,0.2);
72 | font-size: 130%;
73 | text-align: center;
74 | opacity: 0.5;
75 | line-height: 1.4;
76 | }
77 |
78 | .callToAction .click {
79 | display: none;
80 | }
81 |
82 | .callToAction .tap {
83 | display: inline;
84 | }
85 |
86 | #roomContent {
87 | display: block;
88 | padding-top: 0;
89 | }
90 |
91 | #roomList {
92 | display: block;
93 | }
94 |
95 | #roomList > li {
96 | display: block;
97 | overflow: hidden;
98 | padding: 0 10px 10px 10px;
99 | opacity: 1;
100 | }
101 |
102 | #roomList > li:first-child {
103 | padding-left: 10px;
104 | }
105 |
106 | #roomList > li:last-child {
107 | padding-right: 10px;
108 | }
109 |
110 | #roomList > li > .anchor {
111 | position: relative;
112 | top: 0;
113 | width: auto;
114 | }
115 |
116 | #roomList .anchor > a {
117 | width: 95%;
118 | overflow: hidden;
119 | font-size: 160%;
120 | font-family: Arial, Helvetica, sans-serif;
121 | }
122 |
123 | #roomList .anchor > a:before {
124 | width: 0.56em;
125 | height: 0.56em;
126 | }
127 |
128 | #roomList h2 {
129 | font-family: Arial, Helvetica, sans-serif;
130 | }
131 |
132 | #roomList time {
133 | font-family: Arial, Helvetica, sans-serif;
134 | }
135 |
136 | #roomList .contributors {
137 | margin-top: 0.7em;
138 | margin-bottom: 0;
139 | border-bottom: 0 none #ffffff;
140 | padding-bottom: 0;
141 | }
142 |
143 | #roomList .contributors ul {
144 | display: none;
145 | }
146 |
147 | #roomList .topics {
148 | display: none;
149 | }
150 |
151 | nav {
152 | display: none;
153 | }
--------------------------------------------------------------------------------
/src/test/java/com/wideplay/crosstalk/data/twitter/JsonTweetParsingTest.java:
--------------------------------------------------------------------------------
1 | package com.wideplay.crosstalk.data.twitter;
2 |
3 | import com.google.gson.Gson;
4 | import com.wideplay.crosstalk.data.buzz.BuzzSearch;
5 | import org.apache.commons.io.IOUtils;
6 | import org.junit.Test;
7 |
8 | import java.io.IOException;
9 |
10 | /**
11 | * @author dhanji@gmail.com (Dhanji R. Prasanna)
12 | */
13 | public class JsonTweetParsingTest {
14 |
15 | @Test
16 | public final void parse() throws IOException {
17 | String json = IOUtils.toString(TwitterSearch.class.getResourceAsStream("example_tweet_search.json"));
18 |
19 | TwitterSearch tweets = new Gson().fromJson(json, TwitterSearch.class);
20 |
21 | System.out.println("Parsed: " + tweets.getResults());
22 | }
23 |
24 |
25 | @Test
26 | public final void parseBuzz() throws IOException {
27 | String json = IOUtils.toString(TwitterSearch.class.getResourceAsStream("example_buzz_@me.json"));
28 |
29 | BuzzSearch tweets = new Gson().fromJson(json, BuzzSearch.Data.class).getData();
30 |
31 | System.out.println("Parsed: " + tweets.getItems());
32 | }
33 |
34 |
35 | }
36 |
--------------------------------------------------------------------------------
/src/test/java/com/wideplay/crosstalk/data/twitter/example_buzz_@me.json:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/dhanji/crosstalk/70a570502eefdb0afdee007074d40163dadea98f/src/test/java/com/wideplay/crosstalk/data/twitter/example_buzz_@me.json
--------------------------------------------------------------------------------
/src/test/java/com/wideplay/crosstalk/data/twitter/example_buzz_search.json:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/dhanji/crosstalk/70a570502eefdb0afdee007074d40163dadea98f/src/test/java/com/wideplay/crosstalk/data/twitter/example_buzz_search.json
--------------------------------------------------------------------------------
/src/test/java/com/wideplay/crosstalk/data/twitter/example_tweet_search.json:
--------------------------------------------------------------------------------
1 | {"results":[
2 | {
3 | "from_user_id_str":"126005",
4 | "profile_image_url":"http://a0.twimg.com/profile_images/1207231225/kal-ginga2-sml_normal.jpg",
5 | "created_at":"Tue, 15 Feb 2011 11:34:32 +0000",
6 | "from_user":"kalena",
7 | "id_str":"37474839820374016",
8 | "metadata":{
9 | "result_type":"recent"
10 | },
11 | "to_user_id":null,
12 | "text":"BIG day tomorrow. Pilgrimage to Te Papa followed by a #webstock workshop with @hotdogsladies. Or as we like to call him, Uncle Merlin.",
13 | "id":37474839820374016,
14 | "from_user_id":126005,
15 | "geo":null,
16 | "iso_language_code":"en",
17 | "to_user_id_str":null,
18 | "source":"<a href="http://www.tweetdeck.com" rel="nofollow">TweetDeck</a>"
19 | },
20 | {
21 | "from_user_id_str":"6447915",
22 | "profile_image_url":"http://a2.twimg.com/profile_images/998695106/kodie_normal.jpg",
23 | "created_at":"Tue, 15 Feb 2011 11:21:39 +0000",
24 | "from_user":"kodiewix",
25 | "id_str":"37471598613102592",
26 | "metadata":{
27 | "result_type":"recent"
28 | },
29 | "to_user_id":null,
30 | "text":"RT @wellingtonista: @themorgan this is what people are doing tomorrow night before #webstock http://twtvite.com/webwarm11",
31 | "id":37471598613102592,
32 | "from_user_id":6447915,
33 | "geo":null,
34 | "iso_language_code":"en",
35 | "to_user_id_str":null,
36 | "source":"<a href="http://www.hootsuite.com" rel="nofollow">HootSuite</a>"
37 | },
38 | {
39 | "from_user_id_str":"23237",
40 | "profile_image_url":"http://a3.twimg.com/profile_images/852042378/shadowfoot_normal.png",
41 | "created_at":"Tue, 15 Feb 2011 10:15:46 +0000",
42 | "from_user":"Shadowfoot",
43 | "id_str":"37455016830701568",
44 | "metadata":{
45 | "result_type":"recent"
46 | },
47 | "to_user_id":1131468,
48 | "text":"@mshel You can sleep next week, after #webstock",
49 | "id":37455016830701568,
50 | "from_user_id":23237,
51 | "to_user":"mshel",
52 | "geo":null,
53 | "iso_language_code":"en",
54 | "to_user_id_str":"1131468",
55 | "source":"<a href="http://www.tweetdeck.com" rel="nofollow">TweetDeck</a>"
56 | },
57 | {
58 | "from_user_id_str":"1131468",
59 | "profile_image_url":"http://a1.twimg.com/profile_images/1244978501/photo_5a_normal.JPG",
60 | "created_at":"Tue, 15 Feb 2011 10:15:17 +0000",
61 | "from_user":"mshel",
62 | "id_str":"37454893400727552",
63 | "metadata":{
64 | "result_type":"recent"
65 | },
66 | "to_user_id":null,
67 | "text":"Having a crazy awesome time at #webstock - SO tired but still, looking forward to tomorrow! :)",
68 | "id":37454893400727552,
69 | "from_user_id":1131468,
70 | "geo":null,
71 | "iso_language_code":"en",
72 | "to_user_id_str":null,
73 | "source":"<a href="http://twitter.com/">web</a>"
74 | },
75 | {
76 | "from_user_id_str":"23237",
77 | "profile_image_url":"http://a3.twimg.com/profile_images/852042378/shadowfoot_normal.png",
78 | "created_at":"Tue, 15 Feb 2011 10:13:16 +0000",
79 | "from_user":"Shadowfoot",
80 | "id_str":"37454385898323968",
81 | "metadata":{
82 | "result_type":"recent"
83 | },
84 | "to_user_id":19072,
85 | "text":"@cperfetti I really enjoyed your Usability Bootcamp workshop at #Webstock today. thank you.",
86 | "id":37454385898323968,
87 | "from_user_id":23237,
88 | "to_user":"cperfetti",
89 | "geo":null,
90 | "iso_language_code":"en",
91 | "to_user_id_str":"19072",
92 | "source":"<a href="http://twitter.com/">web</a>"
93 | },
94 | {
95 | "from_user_id_str":"60852100",
96 | "profile_image_url":"http://a0.twimg.com/profile_images/1234081793/logo-01_normal.png",
97 | "created_at":"Tue, 15 Feb 2011 10:00:39 +0000",
98 | "from_user":"rushdigital",
99 | "id_str":"37451211942658049",
100 | "metadata":{
101 | "result_type":"recent"
102 | },
103 | "to_user_id":26598,
104 | "text":"@majicDave awsm! will flick an eml with my deets, nt sure if u knw bt @KeriHenare is in welly 2mrw 4 #webstock - hes a massiv #chopper fan",
105 | "id":37451211942658049,
106 | "from_user_id":60852100,
107 | "to_user":"majicDave",
108 | "geo":null,
109 | "iso_language_code":"en",
110 | "to_user_id_str":"26598",
111 | "source":"<a href="http://twitter.com/">web</a>"
112 | },
113 | {
114 | "from_user_id_str":"95852",
115 | "profile_image_url":"http://a1.twimg.com/profile_images/1126801420/bestbagel-icon_normal.jpg",
116 | "created_at":"Tue, 15 Feb 2011 09:51:20 +0000",
117 | "from_user":"Ycnt_ibdonlyjen",
118 | "id_str":"37448865821102081",
119 | "metadata":{
120 | "result_type":"recent"
121 | },
122 | "to_user_id":null,
123 | "text":"i'm signed up to @wsbingo, going to #webwarm11 tomorrow nite & looking forward to @globalmoxie workshop tomorrow. but now sleep #webstock",
124 | "id":37448865821102081,
125 | "from_user_id":95852,
126 | "geo":null,
127 | "iso_language_code":"en",
128 | "to_user_id_str":null,
129 | "source":"<a href="http://twitter.com/">web</a>"
130 | },
131 | {
132 | "from_user_id_str":"26735",
133 | "profile_image_url":"http://a0.twimg.com/profile_images/1207093267/nyeme_normal.jpg",
134 | "created_at":"Tue, 15 Feb 2011 09:49:34 +0000",
135 | "from_user":"johubris",
136 | "id_str":"37448422973902848",
137 | "metadata":{
138 | "result_type":"recent"
139 | },
140 | "to_user_id":null,
141 | "text":"I'm at 29,192 tweets right now, I bet I'll crack 30,000 by the time #webstock is over",
142 | "id":37448422973902848,
143 | "from_user_id":26735,
144 | "geo":null,
145 | "iso_language_code":"en",
146 | "to_user_id_str":null,
147 | "source":"<a href="http://www.hootsuite.com" rel="nofollow">HootSuite</a>"
148 | },
149 | {
150 | "from_user_id_str":"2633373",
151 | "profile_image_url":"http://a0.twimg.com/profile_images/1224493772/b_normal.png",
152 | "created_at":"Tue, 15 Feb 2011 09:49:16 +0000",
153 | "from_user":"benpeyer",
154 | "id_str":"37448349716185088",
155 | "metadata":{
156 | "result_type":"recent"
157 | },
158 | "to_user_id":null,
159 | "text":"Workshop with @jasonsantamaria was just great. Thank you! \nSo much more to learn. That's exciting and also a bit frightening... #webstock",
160 | "id":37448349716185088,
161 | "from_user_id":2633373,
162 | "geo":null,
163 | "iso_language_code":"en",
164 | "to_user_id_str":null,
165 | "source":"<a href="http://itunes.apple.com/us/app/twitter/id409789998?mt=12" rel="nofollow">Twitter for Mac</a>"
166 | },
167 | {
168 | "from_user_id_str":"76550538",
169 | "profile_image_url":"http://a2.twimg.com/profile_images/850805265/LinNahCaricature_normal.jpg",
170 | "created_at":"Tue, 15 Feb 2011 09:45:34 +0000",
171 | "from_user":"lin_nah",
172 | "id_str":"37447416399671296",
173 | "metadata":{
174 | "result_type":"recent"
175 | },
176 | "to_user_id":null,
177 | "text":"butlers choc isn't far from #webstock so anyone attending webstock can take advantage of deal too (if have printer to print voucher)",
178 | "id":37447416399671296,
179 | "from_user_id":76550538,
180 | "geo":null,
181 | "iso_language_code":"en",
182 | "to_user_id_str":null,
183 | "source":"<a href="http://www.tweetdeck.com" rel="nofollow">TweetDeck</a>"
184 | },
185 | {
186 | "from_user_id_str":"33239",
187 | "profile_image_url":"http://a1.twimg.com/profile_images/1022712372/me_suspicious_large_normal.jpg",
188 | "created_at":"Tue, 15 Feb 2011 09:40:14 +0000",
189 | "from_user":"gianouts",
190 | "id_str":"37446074822041600",
191 | "metadata":{
192 | "result_type":"recent"
193 | },
194 | "to_user_id":35305673,
195 | "text":"@simonemccallum Excellent. #webstock is the place to be :)",
196 | "id":37446074822041600,
197 | "from_user_id":33239,
198 | "to_user":"simonemccallum",
199 | "geo":null,
200 | "iso_language_code":"en",
201 | "to_user_id_str":"35305673",
202 | "source":"<a href="http://www.tweetdeck.com" rel="nofollow">TweetDeck</a>"
203 | },
204 | {
205 | "from_user_id_str":"3381607",
206 | "profile_image_url":"http://a3.twimg.com/profile_images/1124210252/homepage_me_normal.jpg",
207 | "created_at":"Tue, 15 Feb 2011 09:31:29 +0000",
208 | "from_user":"therussdotcom",
209 | "id_str":"37443874230116353",
210 | "metadata":{
211 | "result_type":"recent"
212 | },
213 | "to_user_id":null,
214 | "text":"RT: @wonkeydonkey42 #webstock, speaker line up not as inspiring as past years - agreed. Seeing Steve Souders tomorrow at a workshop though..",
215 | "id":37443874230116353,
216 | "from_user_id":3381607,
217 | "geo":null,
218 | "iso_language_code":"en",
219 | "to_user_id_str":null,
220 | "source":"<a href="http://www.echofon.com/" rel="nofollow">Echofon</a>"
221 | },
222 | {
223 | "from_user_id_str":"425868",
224 | "profile_image_url":"http://a1.twimg.com/profile_images/1204003906/nboehm_studio_250_normal.jpg",
225 | "created_at":"Tue, 15 Feb 2011 09:29:41 +0000",
226 | "from_user":"NathanaelB",
227 | "id_str":"37443418800001025",
228 | "metadata":{
229 | "result_type":"recent"
230 | },
231 | "to_user_id":null,
232 | "text":"... and I can't afford $120 for an Apple keyboard. Guess I'll just take notes and write blog posts later :) #webstock",
233 | "id":37443418800001025,
234 | "from_user_id":425868,
235 | "geo":{
236 | "type":"Point",
237 | "coordinates":[-43.525,172.6243]
238 | },
239 | "iso_language_code":"en",
240 | "to_user_id_str":null,
241 | "source":"<a href="http://stone.com/Twittelator" rel="nofollow">Twittelator</a>"
242 | },
243 | {
244 | "from_user_id_str":"35305673",
245 | "profile_image_url":"http://a3.twimg.com/profile_images/1166076361/twitter_photo_nov2_normal.jpg",
246 | "created_at":"Tue, 15 Feb 2011 09:29:04 +0000",
247 | "from_user":"simonemccallum",
248 | "id_str":"37443264441352192",
249 | "metadata":{
250 | "result_type":"recent"
251 | },
252 | "to_user_id":33239,
253 | "text":"@gianouts Might see you on Thurs and Fri #webstock",
254 | "id":37443264441352192,
255 | "from_user_id":35305673,
256 | "to_user":"gianouts",
257 | "geo":null,
258 | "iso_language_code":"en",
259 | "to_user_id_str":"33239",
260 | "source":"<a href="http://www.tweetdeck.com" rel="nofollow">TweetDeck</a>"
261 | },
262 | {
263 | "from_user_id_str":"425868",
264 | "profile_image_url":"http://a1.twimg.com/profile_images/1204003906/nboehm_studio_250_normal.jpg",
265 | "created_at":"Tue, 15 Feb 2011 09:28:23 +0000",
266 | "from_user":"NathanaelB",
267 | "id_str":"37443092801921024",
268 | "metadata":{
269 | "result_type":"recent"
270 | },
271 | "to_user_id":null,
272 | "text":"Hmm. Guess my Eee PC isn't coming to #webstock. Can't get 2degrees 3G working on it, although it's always been unreliable with GPRS modems.",
273 | "id":37443092801921024,
274 | "from_user_id":425868,
275 | "geo":{
276 | "type":"Point",
277 | "coordinates":[-43.525,172.6243]
278 | },
279 | "iso_language_code":"en",
280 | "to_user_id_str":null,
281 | "source":"<a href="http://stone.com/Twittelator" rel="nofollow">Twittelator</a>"
282 | }
283 | ],"max_id":37474839820374016,"since_id":0,"refresh_url":"?since_id=37474839820374016&q=%23webstock","next_page":"?page=2&max_id=37474839820374016&q=%23webstock","results_per_page":15,"page":1,"completed_in":0.017795,"since_id_str":"0","max_id_str":"37474839820374016","query":"%23webstock"}
284 |
--------------------------------------------------------------------------------
/src/test/java/com/wideplay/crosstalk/data/twitter/example_twitter_creds.json:
--------------------------------------------------------------------------------
1 | {"following":false,"profile_link_color":"009999","url":"http:\/\/www.wideplay.com","verified":false,"profile_sidebar_border_color":"eeeeee","description":"Senior Custodial Engineer at Google","status":{
2 | "truncated":false,
3 | "text":"RT @crazybob: \"Dependency Injection can be dangerous for your career.\" http:\/\/is.gd\/We9gIa #stackoverflow",
4 | "favorited":false,
5 | "geo":null,
6 | "retweet_count":36,
7 | "in_reply_to_screen_name":null,
8 | "in_reply_to_user_id":null,
9 | "source":"\u003Ca href=\"http:\/\/itunes.apple.com\/us\/app\/twitter\/id409789998?mt=12\" rel=\"nofollow\"\u003ETwitter for Mac\u003C\/a\u003E",
10 | "in_reply_to_status_id_str":null,
11 | "created_at":"Fri Feb 11 23:10:54 +0000 2011",
12 | "contributors":null,
13 | "place":null,
14 | "coordinates":null,
15 | "retweeted":false,
16 | "in_reply_to_user_id_str":null,
17 | "retweeted_status":{
18 | "truncated":false,
19 | "text":"\"Dependency Injection can be dangerous for your career.\" http:\/\/is.gd\/We9gIa #stackoverflow",
20 | "favorited":false,
21 | "geo":null,
22 | "retweet_count":36,
23 | "in_reply_to_screen_name":null,
24 | "in_reply_to_user_id":null,
25 | "source":"web",
26 | "in_reply_to_status_id_str":null,
27 | "created_at":"Fri Feb 11 18:33:23 +0000 2011",
28 | "contributors":null,
29 | "place":null,
30 | "coordinates":null,
31 | "retweeted":false,
32 | "in_reply_to_user_id_str":null,
33 | "id_str":"36130695424393216",
34 | "id":36130695424393216,
35 | "in_reply_to_status_id":null
36 | },
37 | "id_str":"36200533437972480",
38 | "id":36200533437972480,
39 | "in_reply_to_status_id":null
40 | }, "followers_count":1202,"location":"Sydney, Australia","follow_request_sent":false,"profile_use_background_image":true,"profile_image_url":"http:\/\/a3.twimg.com\/profile_images\/53414948\/dj_sp_normal.jpg","show_all_inline_media":false,"contributors_enabled":false,"notifications":false,"friends_count":186,"profile_background_color":"131516","geo_enabled":true,"profile_background_image_url":"http:\/\/a2.twimg.com\/a\/1296081712\/images\/themes\/theme14\/bg.gif","created_at":"Mon Apr 28 01:03:24 +0000 2008","screen_name":"dhanji","listed_count":134,"time_zone":"Sydney","profile_text_color":"333333","protected":false,"lang":"en","statuses_count":5901,"favourites_count":47,"profile_sidebar_fill_color":"efefef","name":"Dhanji R. Prasanna","id_str":"14563623","is_translator":false,"profile_background_tile":true,"id":14563623,"utc_offset":36000}
41 |
--------------------------------------------------------------------------------
')
251 | + ''
252 | // + '
'
253 | + '
');
257 |
258 | var msg = $('#stream .message:last');
259 | var target = $('.images', msg);
260 | crosstalk.expandLinks_(linkset, target, post.attachmentId, msg, refreshScroll);
261 |
262 | };
263 |
264 | /**
265 | * Transform text links into anchor hrefs.
266 | */
267 | crosstalk.linkify = function(text) {
268 | var pieces = text.split(/[ ]+/);
269 | var recombine = [];
270 | var links = [];
271 | var images = [];
272 | for (var i = 0; i < pieces.length; i++) {
273 | var piece = pieces[i];
274 | if (piece.indexOf('http://') === 0) {
275 |
276 | // Images are embedded directly (without oEmbed).
277 | if (piece.match(/(\.jpg|\.png|\.gif)$/)) {
278 | images.push(piece);
279 | } else {
280 | links.push(piece);
281 | }
282 | piece = '' + piece + '';
283 | }
284 | recombine.push(piece);
285 | recombine.push(' ');
286 | }
287 |
288 | return {
289 | text: recombine.join(''),
290 | images: images,
291 | links: links
292 | };
293 | };
294 |
295 | crosstalk.send = function(rpc, args, callback) {
296 | args = { data: JSON.stringify(args) };
297 |
298 | $.ajax({
299 | url: '/r/async/' + rpc,
300 | type: 'POST',
301 | dataType: 'json',
302 | data: args,
303 | success: callback,
304 | failure: crosstalk.noop
305 | });
306 | };
307 |
308 | function log(log) {
309 | $('#debug').text(log);
310 | }
311 |
312 | /*** TIMER CALLBACKS ***/
313 | crosstalk.refreshIndex = function() {
314 | crosstalk.send("index", {
315 | room: $('#room-id').text()
316 | }, function(data) {
317 | // index data back from the server.
318 | if (data.html) {
319 | // Refresh entire activity map.
320 | $('#activity-map').html(data.html);
321 | }
322 | });
323 | };
324 |
325 | // Pings server telling it we're active.
326 | crosstalk.ping = function() {
327 | crosstalk.send("ping", { room: $('#room-id').text() }, crosstalk.noop);
328 | };
329 |
330 |
331 | /*** SERVER RPC CALLBACKS ***/
332 | crosstalk.receiveMessage_ = function(data) {
333 | crosstalk.insertMessage_(data.post);
334 | };
335 |
336 | crosstalk.tweetArrives_ = function(data) {
337 | crosstalk.insertMessage_(data.post);
338 | };
339 |
340 | crosstalk.joinRoom_ = function(data) {
341 | if (data.joiner.username == 'anonymous') {
342 | // Treat anonymous joiners as lurkers (they have no avatar).
343 | var countRef = $('#lurker-count');
344 | var count = parseInt(countRef.html());
345 | countRef.html(count + 1);
346 | } else {
347 | var id = 'av-' + data.joiner.username;
348 |
349 | // Do nothing if we already know about this contributor.
350 | if ($('#' + id).length > 0)
351 | return;
352 | $('.current-contributor-avatars')
353 | .append(''
254 | + ' '
255 | + linkset.text.replace(/(\n\r)|\n|\r/g, '
') 256 | + '
') 256 | + '
'); /** temporary **/
354 | }
355 | };
356 |
357 | crosstalk.leaveRoom_ = function(data) {
358 | if (data.leaver.username == 'anonymous') {
359 | // Treat anonymous leavers as lurkers (they have no avatar).
360 | var countRef = $('#lurker-count');
361 | var count = parseInt(countRef.html());
362 | if (count) // guard against weirdness.
363 | countRef.html(count - 1);
364 | } else {
365 | // Do nothing if we already know about this contributor.
366 | $('#av-' + data.leaver.username).remove();
367 | }
368 | };
369 |
--------------------------------------------------------------------------------
/src/main/webapp/js/main.js:
--------------------------------------------------------------------------------
1 |
2 | var TRANSLATE3D = false;
3 |
4 | if (navigator.userAgent.indexOf('iPhone') >= 0 || navigator.userAgent.indexOf('iPad') >= 0) {
5 | TRANSLATE3D = true;
6 |
7 | $('html').removeClass('notIos');
8 | $('html').addClass('ios');
9 | }
10 |
11 | var touch = null;
12 |
13 | $(init);
14 |
15 | function init() {
16 | if ($('#mobileCheck').css('display') != 'none') {
17 | $('#roomList > li')
18 | .removeClass('active')
19 | .removeClass('future')
20 | .addClass('inactive')
21 |
22 | var APPEAR_TIME = 1000;
23 |
24 | var roomListItems = $('#roomList > li > .anchor');
25 |
26 | // Add click handlers to act as anchors for each card
27 | roomListItems.click(function() {
28 | window.location = $('a', this).get(0).href;
29 |
30 | return false;
31 | });
32 |
33 | // Truncate text in room titles
34 | $('> a', roomListItems).each(function() {
35 | var CHAR_LIMIT = 22;
36 |
37 | var originalText = $(this).text();
38 | var modifiedText = originalText;
39 | modifiedText = modifiedText.substring(0, CHAR_LIMIT);
40 |
41 | if (modifiedText.length < originalText.length) {
42 | modifiedText = modifiedText.replace(/ [^ ]*$/, '');
43 | modifiedText += '…';
44 | }
45 |
46 | $(this).html(modifiedText);
47 | });
48 |
49 | // Setup switcher
50 | $('#switcher').click(switchContent)
51 |
52 | }
53 | else {
54 | var roomListItems = $('#roomList > li > .anchor');
55 |
56 | // Add click handlers to act as anchors for each card
57 | roomListItems.click(function() {
58 | window.location = $('a', this).get(0).href;
59 |
60 | return false;
61 | });
62 | }
63 | }
64 |
65 | function switchContent() {
66 | var ul = $(this);
67 |
68 | if ($('li:first-child', ul).hasClass('on')) {
69 | $('li', ul).removeClass('on');
70 | $('li:last-child', ul).addClass('on');
71 | $('#roomContent').removeClass('on');
72 | setTimeout(initTopics, 650);
73 | }
74 | else {
75 | $('li', ul).removeClass('on');
76 | $('li:first-child', ul).addClass('on');
77 | $('#roomContent').addClass('on');
78 | $('#topicContent').removeClass('on');
79 | }
80 |
81 | return false;
82 | }
83 |
84 | var WORD_LETTERS = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z', ' ', ' ', ' ', ' ', ' ', ' ', ' ', ' '];
85 |
86 | var topicData = [
87 | {
88 | title: "HTML5",
89 | rank: 1
90 | },
91 | {
92 | title: "Gmail",
93 | rank: 2
94 | },
95 | {
96 | title: "Docs",
97 | rank: 2
98 | },
99 | {
100 | title: "Blogger",
101 | rank: 3
102 | },
103 | {
104 | title: "Hubs",
105 | rank: 3
106 | },
107 | {
108 | title: "JAPAC",
109 | rank: 3
110 | },
111 | {
112 | title: "Neon Indian",
113 | rank: 4
114 | },
115 | {
116 | title: "Eng Summit",
117 | rank: 4
118 | },
119 | {
120 | title: "Google Maps",
121 | rank: 4
122 | },
123 | {
124 | title: "MacBook Pro",
125 | rank: 4
126 | },
127 | {
128 | title: "Alan Eustace",
129 | rank: 4
130 | },
131 | {
132 | title: "Short",
133 | rank: 4
134 | },
135 | {
136 | title: "Text",
137 | rank: 4
138 | },
139 | {
140 | title: "Clock",
141 | rank: 4
142 | }
143 | ];
144 |
145 | var snippetTimer = null;
146 | var callToActionTimer = null;
147 |
148 | function initTopics() {
149 | clearTopics();
150 | $.ajax({
151 | url: '/r/async/topics',
152 | type: 'POST',
153 | data: {},
154 | success: buildTopicCloud,
155 | failure: function() {
156 | alert("Error: could not contact server.")
157 | }
158 | });
159 | setTimeout(fetchSnippet, 2000);
160 |
161 | $('#topicContent .callToAction').removeClass('off');
162 |
163 | // Fade out the call to action after 20 seconds (so that it doesn't stay on-screen while projecting)
164 | callToActionTimer = setTimeout(function() {
165 | $('#topicContent .callToAction').addClass('off');
166 | }, 20000);
167 |
168 | $('#topicContent').addClass('on')
169 | }
170 |
171 | function clearTopics() {
172 | clearTimeout(snippetTimer);
173 | clearTimeout(callToActionTimer);
174 |
175 | $('#topicList').html('');
176 | $('#topicContent .snippet').remove();
177 | }
178 |
179 | function buildTopicCloud(data) {
180 | var topicList = $('#topicList');
181 | var positioned = [];
182 |
183 | // Loaded from server.
184 | topicData = eval('(' + data + ')');
185 |
186 | // For each topic, position it so it doesn't overlap any others, but is close to the center
187 | for (var i = 0; i < topicData.length; i++) {
188 | var newTopic = $(' ' + author + ' ' + randomString + '