From d663eecbdcd432abc41913c099317edc41efd398 Mon Sep 17 00:00:00 2001 From: Jollen Chen Date: Sat, 12 Jul 2014 14:22:36 +0800 Subject: [PATCH 1/2] live chatroom --- index.html | 99 +++++++++++++++++++++++++++++++++ javascripts/jquery.websocket.js | 54 ++++++++++++++++++ javascripts/main.js | 3 +- styles/main.css | 67 +++++++++++++++++++++- 4 files changed, 221 insertions(+), 2 deletions(-) create mode 100644 javascripts/jquery.websocket.js diff --git a/index.html b/index.html index 423667c..0ccdccb 100644 --- a/index.html +++ b/index.html @@ -14,6 +14,8 @@ + + @@ -28,6 +30,22 @@
${date}
+ + + +
+
+ +
+

最新訊息 + Showcase Your Work +

+
+ +
+ +
+
+
+
+ Chat + +
+
+
    +
+
+ +
+
+
+
+ +
+
+
@@ -120,6 +195,30 @@

最新文章 + + + diff --git a/javascripts/jquery.websocket.js b/javascripts/jquery.websocket.js new file mode 100644 index 0000000..376307a --- /dev/null +++ b/javascripts/jquery.websocket.js @@ -0,0 +1,54 @@ +(function($) { + +// WebSocket object +var ws; + +// The Div element selected by jQuery selector +var div = this; + +function onWsMessage(message) { + var json = JSON.parse(message.data); + var content = $('#message'); + + if (json.type === 'message') { + //content.prepend('

' + json.data.message + '

'); + $('#chatTemplate') + .tmpl(json.data) + .appendTo('.chat'); + } +} + +$.fn.sendMessage = function () { + $(this).click(function() { + ws.send("[message]"); + }); +}; + +$.fn.createWebSocket = function () { + if ("WebSocket" in window) + { + // Let us open a web socket + ws = new WebSocket("ws://192.168.1.24:8080/start", ['echo-protocol']); + ws.onopen = function() + { + $(this).append("

Done

"); + }; + + ws.onclose = function() + { + // websocket is closed. + }; + ws.onerror = function() + { + $(this).html("

error

"); + }; + ws.onmessage = onWsMessage; + } + else + { + // The browser doesn't support WebSocket + alert("WebSocket NOT supported by your Browser!"); + } +}; + +})($); diff --git a/javascripts/main.js b/javascripts/main.js index abae8ee..7100eff 100644 --- a/javascripts/main.js +++ b/javascripts/main.js @@ -1,7 +1,8 @@ (function($) { $.ajax({ dataType: 'json', - url: 'http://booklog.io/1/post', + type: 'GET', + url: 'http://localhost:3000/1/post', success: function(response, jqXHR, textStatus) { $('#postTemplate') .tmpl(response.posts) diff --git a/styles/main.css b/styles/main.css index 642417a..e798595 100644 --- a/styles/main.css +++ b/styles/main.css @@ -16,4 +16,69 @@ -ms-transform:rotate(360deg); -webkit-transform:rotate(360deg); /*-webkit-font-smoothing:antialiased;*/ -} \ No newline at end of file +} + + +/* Chat styles + * http://www.bootply.com/petrb/104740 + */ + +.chat +{ + list-style: none; + margin: 0; + padding: 0; +} + +.chat li +{ + margin-bottom: 10px; + padding-bottom: 5px; + border-bottom: 1px dotted #B3A9A9; +} + +.chat li.left .chat-body +{ + margin-left: 60px; +} + +.chat li.right .chat-body +{ + margin-right: 60px; +} + + +.chat li .chat-body p +{ + margin: 0; + color: #777777; +} + +.panel .slidedown .glyphicon, .chat .glyphicon +{ + margin-right: 5px; +} + +.panel-body +{ + overflow-y: scroll; + height: 250px; +} + +::-webkit-scrollbar-track +{ + -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); + background-color: #F5F5F5; +} + +::-webkit-scrollbar +{ + width: 12px; + background-color: #F5F5F5; +} + +::-webkit-scrollbar-thumb +{ + -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3); + background-color: #555; +} From 03867993f034546984956fae3d8ddcf371ae295a Mon Sep 17 00:00:00 2001 From: Jollen Chen Date: Sun, 13 Jul 2014 23:14:51 +0800 Subject: [PATCH 2/2] use mongodb --- index.html | 13 +- javascripts/jquery.websocket.js | 15 +- javascripts/main.js | 2 +- javascripts/moment/.bower.json | 31 + javascripts/moment/LICENSE | 22 + javascripts/moment/bower.json | 20 + javascripts/moment/lang/ar-ma.js | 56 + javascripts/moment/lang/ar-sa.js | 96 + javascripts/moment/lang/ar.js | 97 + javascripts/moment/lang/az.js | 102 + javascripts/moment/lang/bg.js | 86 + javascripts/moment/lang/bn.js | 106 + javascripts/moment/lang/br.js | 107 + javascripts/moment/lang/bs.js | 139 + javascripts/moment/lang/ca.js | 66 + javascripts/moment/lang/cs.js | 155 + javascripts/moment/lang/cv.js | 59 + javascripts/moment/lang/cy.js | 77 + javascripts/moment/lang/da.js | 56 + javascripts/moment/lang/de-at.js | 72 + javascripts/moment/lang/de.js | 71 + javascripts/moment/lang/el.js | 90 + javascripts/moment/lang/en-au.js | 62 + javascripts/moment/lang/en-ca.js | 59 + javascripts/moment/lang/en-gb.js | 63 + javascripts/moment/lang/eo.js | 65 + javascripts/moment/lang/es.js | 75 + javascripts/moment/lang/et.js | 76 + javascripts/moment/lang/eu.js | 60 + javascripts/moment/lang/fa.js | 97 + javascripts/moment/lang/fi.js | 103 + javascripts/moment/lang/fo.js | 56 + javascripts/moment/lang/fr-ca.js | 54 + javascripts/moment/lang/fr.js | 58 + javascripts/moment/lang/gl.js | 71 + javascripts/moment/lang/he.js | 77 + javascripts/moment/lang/hi.js | 105 + javascripts/moment/lang/hr.js | 140 + javascripts/moment/lang/hu.js | 105 + javascripts/moment/lang/hy-am.js | 113 + javascripts/moment/lang/id.js | 67 + javascripts/moment/lang/is.js | 124 + javascripts/moment/lang/it.js | 59 + javascripts/moment/lang/ja.js | 58 + javascripts/moment/lang/ka.js | 108 + javascripts/moment/lang/km.js | 55 + javascripts/moment/lang/ko.js | 63 + javascripts/moment/lang/lb.js | 160 + javascripts/moment/lang/lt.js | 118 + javascripts/moment/lang/lv.js | 77 + javascripts/moment/lang/mk.js | 86 + javascripts/moment/lang/ml.js | 64 + javascripts/moment/lang/mr.js | 104 + javascripts/moment/lang/ms-my.js | 66 + javascripts/moment/lang/nb.js | 57 + javascripts/moment/lang/ne.js | 105 + javascripts/moment/lang/nl.js | 67 + javascripts/moment/lang/nn.js | 56 + javascripts/moment/lang/pl.js | 98 + javascripts/moment/lang/pt-br.js | 56 + javascripts/moment/lang/pt.js | 60 + javascripts/moment/lang/ro.js | 72 + javascripts/moment/lang/ru.js | 166 + javascripts/moment/lang/sk.js | 156 + javascripts/moment/lang/sl.js | 144 + javascripts/moment/lang/sq.js | 61 + javascripts/moment/lang/sr-cyrl.js | 106 + javascripts/moment/lang/sr.js | 106 + javascripts/moment/lang/sv.js | 63 + javascripts/moment/lang/ta.js | 112 + javascripts/moment/lang/th.js | 58 + javascripts/moment/lang/tl-ph.js | 58 + javascripts/moment/lang/tr.js | 93 + javascripts/moment/lang/tzm-latn.js | 55 + javascripts/moment/lang/tzm.js | 55 + javascripts/moment/lang/uk.js | 157 + javascripts/moment/lang/uz.js | 55 + javascripts/moment/lang/vi.js | 62 + javascripts/moment/lang/zh-cn.js | 108 + javascripts/moment/lang/zh-tw.js | 84 + javascripts/moment/min/langs.js | 6426 +++++++++++++ javascripts/moment/min/langs.min.js | 4 + javascripts/moment/min/moment-with-langs.js | 8521 +++++++++++++++++ .../moment/min/moment-with-langs.min.js | 9 + javascripts/moment/min/moment.min.js | 6 + javascripts/moment/moment.js | 2610 +++++ javascripts/moment/readme.md | 388 + javascripts/users.js | 14 + styles/animate.min.css | 6 + users.html | 154 + 90 files changed, 24586 insertions(+), 8 deletions(-) create mode 100644 javascripts/moment/.bower.json create mode 100644 javascripts/moment/LICENSE create mode 100644 javascripts/moment/bower.json create mode 100644 javascripts/moment/lang/ar-ma.js create mode 100644 javascripts/moment/lang/ar-sa.js create mode 100644 javascripts/moment/lang/ar.js create mode 100644 javascripts/moment/lang/az.js create mode 100644 javascripts/moment/lang/bg.js create mode 100644 javascripts/moment/lang/bn.js create mode 100644 javascripts/moment/lang/br.js create mode 100644 javascripts/moment/lang/bs.js create mode 100644 javascripts/moment/lang/ca.js create mode 100644 javascripts/moment/lang/cs.js create mode 100644 javascripts/moment/lang/cv.js create mode 100644 javascripts/moment/lang/cy.js create mode 100644 javascripts/moment/lang/da.js create mode 100644 javascripts/moment/lang/de-at.js create mode 100644 javascripts/moment/lang/de.js create mode 100644 javascripts/moment/lang/el.js create mode 100644 javascripts/moment/lang/en-au.js create mode 100644 javascripts/moment/lang/en-ca.js create mode 100644 javascripts/moment/lang/en-gb.js create mode 100644 javascripts/moment/lang/eo.js create mode 100644 javascripts/moment/lang/es.js create mode 100644 javascripts/moment/lang/et.js create mode 100644 javascripts/moment/lang/eu.js create mode 100644 javascripts/moment/lang/fa.js create mode 100644 javascripts/moment/lang/fi.js create mode 100644 javascripts/moment/lang/fo.js create mode 100644 javascripts/moment/lang/fr-ca.js create mode 100644 javascripts/moment/lang/fr.js create mode 100644 javascripts/moment/lang/gl.js create mode 100644 javascripts/moment/lang/he.js create mode 100644 javascripts/moment/lang/hi.js create mode 100644 javascripts/moment/lang/hr.js create mode 100644 javascripts/moment/lang/hu.js create mode 100644 javascripts/moment/lang/hy-am.js create mode 100644 javascripts/moment/lang/id.js create mode 100644 javascripts/moment/lang/is.js create mode 100644 javascripts/moment/lang/it.js create mode 100644 javascripts/moment/lang/ja.js create mode 100644 javascripts/moment/lang/ka.js create mode 100644 javascripts/moment/lang/km.js create mode 100644 javascripts/moment/lang/ko.js create mode 100644 javascripts/moment/lang/lb.js create mode 100644 javascripts/moment/lang/lt.js create mode 100644 javascripts/moment/lang/lv.js create mode 100644 javascripts/moment/lang/mk.js create mode 100644 javascripts/moment/lang/ml.js create mode 100644 javascripts/moment/lang/mr.js create mode 100644 javascripts/moment/lang/ms-my.js create mode 100644 javascripts/moment/lang/nb.js create mode 100644 javascripts/moment/lang/ne.js create mode 100644 javascripts/moment/lang/nl.js create mode 100644 javascripts/moment/lang/nn.js create mode 100644 javascripts/moment/lang/pl.js create mode 100644 javascripts/moment/lang/pt-br.js create mode 100644 javascripts/moment/lang/pt.js create mode 100644 javascripts/moment/lang/ro.js create mode 100644 javascripts/moment/lang/ru.js create mode 100644 javascripts/moment/lang/sk.js create mode 100644 javascripts/moment/lang/sl.js create mode 100644 javascripts/moment/lang/sq.js create mode 100644 javascripts/moment/lang/sr-cyrl.js create mode 100644 javascripts/moment/lang/sr.js create mode 100644 javascripts/moment/lang/sv.js create mode 100644 javascripts/moment/lang/ta.js create mode 100644 javascripts/moment/lang/th.js create mode 100644 javascripts/moment/lang/tl-ph.js create mode 100644 javascripts/moment/lang/tr.js create mode 100644 javascripts/moment/lang/tzm-latn.js create mode 100644 javascripts/moment/lang/tzm.js create mode 100644 javascripts/moment/lang/uk.js create mode 100644 javascripts/moment/lang/uz.js create mode 100644 javascripts/moment/lang/vi.js create mode 100644 javascripts/moment/lang/zh-cn.js create mode 100644 javascripts/moment/lang/zh-tw.js create mode 100644 javascripts/moment/min/langs.js create mode 100644 javascripts/moment/min/langs.min.js create mode 100644 javascripts/moment/min/moment-with-langs.js create mode 100644 javascripts/moment/min/moment-with-langs.min.js create mode 100644 javascripts/moment/min/moment.min.js create mode 100644 javascripts/moment/moment.js create mode 100644 javascripts/moment/readme.md create mode 100644 javascripts/users.js create mode 100644 styles/animate.min.css create mode 100644 users.html diff --git a/index.html b/index.html index 0ccdccb..a6c8b74 100644 --- a/index.html +++ b/index.html @@ -16,6 +16,7 @@ + @@ -24,7 +25,8 @@ -

${subject}

+

${title}

+

${uid.Name}

${date}
@@ -37,7 +39,7 @@
${date}
${username} - 14 mins ago + ${fromNow}

${message} @@ -65,7 +67,7 @@

${date}
  • 所有文章
  • -
  • 張貼文章 +
  • 所有會員
  • @@ -75,11 +77,11 @@
    ${date}
    -
    +
    -

    最新訊息 +

    最新訊息 Showcase Your Work

    @@ -195,6 +197,7 @@

    最新文章 + + + + +
    + +
    + +
    + +
    +

    所有會員 + Showcase Your Work +

    +
    + +
    + +
    + +
    +
    + +
    + +
    + +
    +
      +
    • « +
    • +
    • 1 +
    • +
    • 2 +
    • +
    • 3 +
    • +
    • 4 +
    • +
    • 5 +
    • +
    • » +
    • +
    +
    + +
    + +
    + + +
    + +
    + +
    +
    +
    +

    Copyright © Company 2013

    +
    +
    +
    + +
    + + + + + + + + + + + + +