GitList
Browse code

Uprava svojej status spravy a statusu (on/away/dnd)

Cinan Rakosnik authored on 06/04/2013 at 23:22:37
Showing 6 changed files
app/assets/javascripts/_main.js.coffee
History View file @ c4a1e74
... ... 
@@ -53,6 +53,9 @@ this.App =
53 53 
         )
54 54 
       )
55 55
56 
+    updateMyStatus: (message, state)->
57 
+      App.Com.trigger(event: 'app.roster.updateMyStatus', data: {message: message, state: state})
58 
+
56 59 
     removeContactRemote: (contact, client) ->
57 60 
       App.Com.trigger(event: 'app.roster.removeContact', data: {jid: contact, client: client})
58 61
app/assets/javascripts/backbone/templates/contacts/me.hamlc
History View file @ c4a1e74
... ... 
@@ -1,10 +1,22 @@
1 1 
 .user
2 2 
   .avatar.bigger{ title: "#{@jid}" }
3 
-    %img{ src: "#{@avatar || 'assets/avatar.png'}", alt: I18n.t("chat.roster.avatar_alt") }
3 
+    %img{ src: "#{@avatar || 'assets/avatar.png'}", alt: I18n.t('chat.roster.avatar_alt') }
4 4 
   %h1{ title: "#{@jid}"} #{@name }
5 
-  %h2 #{@message || '<i>'+I18n.t('chat.roster.change_status_msg')+'</i>'}
5 
+  %h2 #{@message || '<input type="text" class="js-click-edit empty" value="'+I18n.t('chat.roster.change_status_msg')+'">'}
6 6 
   %h3
7 
-    %span.status.icon-record{ class: "#{@status}" }
8 
-    %a{ href: "#"}
9 
-      #{@status}
10 
-      %span.icon-arrow-down.drop-down
11 7 
\ No newline at end of file
8 
+    .rolldown.js-change-state
9 
+      .js-state-clickable{ 'data-state': 'online' }
10 
+        %span.status.icon-record.online
11 
+        %a.active{ href: '#' }
12 
+          Online
13 
+          %br
14 
+      .hidden.js-state-clickable{ 'data-state': 'away' }
15 
+        %span.status.icon-record.away
16 
+        %a{ href: '#' }
17 
+          Away
18 
+          %br
19 
+      .hidden.js-state-clickable{ 'data-state': 'dnd' }
20 
+        %span.status.icon-record.dnd
21 
+        %a{ href: '#' }
22 
+          DND
23 
+    %span.icon-arrow-down.drop-down
12 24 
\ No newline at end of file
app/assets/javascripts/backbone/views/contacts/me.js.coffee
History View file @ c4a1e74
... ... 
@@ -4,6 +4,12 @@ class Xmpp.Views.Contacts.MeView extends Backbone.View
4 4 
   template: JST["backbone/templates/contacts/me"]
5 5 
   el: $('#js-me')
6 6
7 
+  events:
8 
+    'click .js-click-edit': (e) -> @editMyStatus(e)
9 
+    'keypress .js-click-edit': (e) -> @confirmMyStatus(e)
10 
+    'click .js-change-state': (e) -> @openChangeState(e)
11 
+    'click .js-state-clickable': (e) -> @confirmChangeState(e)
12 
+
7 13 
   initialize: () ->
8 14 
     _.bindAll(this)
9 15
... ... 
@@ -16,4 +22,61 @@ class Xmpp.Views.Contacts.MeView extends Backbone.View
16 16 
   render: ->
17 17 
     contact = @model.toJSON()
18 18 
     $(@el).html(@template(contact))
19 
-    this
20 19 
\ No newline at end of file
20 
+    this
21 
+
22 
+  editMyStatus: (e) ->
23 
+    $this = $(e.currentTarget)
24 
+
25 
+    if ($this.hasClass('empty'))
26 
+      $this.val('')
27 
+
28 
+    if (! $this.hasClass('editing'))
29 
+      $this.removeClass('empty')
30 
+           .addClass('editing')
31 
+
32 
+  confirmMyStatus: (e) ->
33 
+    if (e.which != 13 && e.which != 10)
34 
+      return
35 
+
36 
+    $this = $(e.currentTarget)
37 
+
38 
+    if ($this.val() == '')
39 
+      $this.removeClass('editing')
40 
+        .addClass('empty')
41 
+        .val(I18n.t('chat.roster.change_status_msg'))
42 
+    else
43 
+      $this.removeClass('editing')
44 
+
45 
+    $this.blur()
46 
+    App.Com.updateMyStatus(@_getStatusMessage(), @_getState())
47 
+
48 
+  openChangeState: (e) ->
49 
+    $this = $(e.currentTarget)
50 
+
51 
+    $this.addClass('editing')
52 
+         .find('.hidden').removeClass('hidden')
53 
+
54 
+    $('.rolldown').removeClass('js-change-state')
55 
+
56 
+  confirmChangeState: (e) ->
57 
+    $this = $(e.currentTarget)
58 
+
59 
+    $('.rolldown').removeClass('editing')
60 
+      .addClass('js-change-state')
61 
+      .children().addClass('hidden')
62 
+
63 
+    $('.rolldown').find('a').removeClass('active')
64 
+
65 
+    $this.removeClass('hidden')
66 
+      .find('a').addClass('active')
67 
+
68 
+    App.Com.updateMyStatus(@_getStatusMessage(), @_getState())
69 
+
70 
+  _getStatusMessage: ->
71 
+    if $('.js-click-edit').hasClass('empty')
72 
+      return ''
73 
+    else
74 
+      $('.js-click-edit').val()
75 
+
76 
+  _getState: ->
77 
+    $('.js-state-clickable:not(.hidden)').data('state')
app/assets/stylesheets/chat.css.scss
History View file @ c4a1e74
... ... 
@@ -41,10 +41,30 @@
41 41 
   }
42 42
43 43 
   h2 {
44 
-    font-size: 11px;
45 
-    font-weight: normal;
46 
-    color: #7e8b90;
47 
-    text-shadow: white 1px 1px;
44 
+    input {
45 
+      border: 0;
46 
+      background: transparent;
47 
+      width: 151px;
48 
+      padding: 0;
49 
+      outline: none;
50 
+      margin: 0;
51 
+      font-style: italic;
52 
+      font-size: 11px;
53 
+      font-weight: normal;
54 
+      color: #7e8b90;
55 
+      text-shadow: white 1px 1px;
56 
+      height: 18px;
57 
+
58 
+      &:focus {
59 
+        border: none !important;
60 
+      }
61 
+
62 
+      &.editing {
63 
+        padding: 3px 0;
64 
+        font-style: normal;
65 
+        text-shadow: none;
66 
+      }
67 
+    }
48 68 
   }
49 69
50 70 
   h3 {
... ... 
@@ -52,10 +72,28 @@
52 52 
     color: $status-color;
53 53 
     margin-top: -3px;
54 54
55 
+    .rolldown {
56 
+      clear: both;
57 
+      left: 54px;
58 
+      position: relative;
59 
+      top: -8px;
60 
+      width: 67px;
61 
+      font-weight: normal;
62 
+      float: left;
63 
+
64 
+      &.editing {
65 
+        background: white;
66 
+      }
67 
+
68 
+      .active {
69 
+        font-weight: bold;
70 
+      }
71 
+    }
72 
+
55 73 
     .drop-down {
56 74 
       position: relative;
57 75 
       top: 2px;
58 
-      left: -2px;
76 
+      left: 36px;
59 77 
       font-size: 13px;
60 78 
     }
61 79 
   }
... ... 
@@ -107,8 +145,18 @@
107 107 
     }
108 108 
   }
109 109
110 
-  .user:hover {
111 
-    background: #fbfbfb;
110 
+  .user {
111 
+    h2 {
112 
+      font-size: 11px;
113 
+      font-weight: normal;
114 
+      color: #7e8b90;
115 
+      text-shadow: white 1px 1px;
116 
+    }
117 
+
118 
+    &:hover {
119 
+      background: #fbfbfb;
120 
+    }
121 
+
112 122 
   }
113 123
114 124 
   .active-group {
app/controllers/ws_roster_controller.rb
History View file @ c4a1e74
... ... 
@@ -153,6 +153,29 @@ class WsRosterController < WebsocketRails::BaseController
153 153 
         trigger_success jid: jid, vcard: vcard, status: presence
154 154 
     end
155 155
156 
+    def me_update_status
157 
+        status_message = message[:message]
158 
+        state = message[:state]
159 
+
160 
+        xmpp_state = case state
161 
+                     when 'away' then :away
162 
+                     when 'dnd' then :dnd
163 
+                     else nil
164 
+        end
165 
+
166 
+        presence = Jabber::Presence.new
167 
+        presence.show = xmpp_state
168 
+        presence.status = status_message
169 
+
170 
+        connection_store[:clients].each do |client|
171 
+            client.send(presence)
172 
+        end
173 
+    end
174 
+
175 
+    def me_update_vcard
176 
+
177 
+    end
178 
+
156 179 
     def disconnect
157 180 
         connection_store[:clients] && connection_store[:clients].each do |client|
158 181 
             client.close()
config/initializers/events.rb
History View file @ c4a1e74
... ... 
@@ -54,6 +54,8 @@ WebsocketRails::EventMap.describe do
54 54 
             subscribe :startPolling,        to: WsRosterController, with_method: :start_polling_contacts_state
55 55 
             subscribe :setPresence,         to: WsRosterController, with_method: :set_presence
56 56 
             subscribe :myself,              to: WsRosterController, with_method: :myself
57 
+            subscribe :updateMyStatus,      to: WsRosterController, with_method: :me_update_status
58 
+            subscribe :updateMyVcard,       to: WsRosterController, with_method: :me_update_vcard
57 59 
             subscribe :removeContact,       to: WsRosterController, with_method: :remove_contact
58 60 
         end
59 61