show service icons on mobile site

app/views/shared/_publisher.mobile.haml

@@ -17,6 +17,11 @@
     = status.text_area :text, :placeholder => t('.whats_on_your_mind'), :style => "width:300px", :rows => 4, :autofocus => "autofocus"
 
   %fieldset
+    %span#publisher_service_icons
+      - if current_user.services
+        - for service in current_user.services
+          = image_tag "social_media_logos/#{service.provider}-16x16.png", :title => service.provider.titleize, :class => "service_icon dim", :id =>"#{service.provider}", :maxchar => "#{service.class::MAX_CHARACTERS}"
+
     %select{:id => "aspect_ids_", :name => "aspect_ids[]", :style => "float:right;"}
       %option{:value => 'public'}
         = t('public')

config/assets.yml

@@ -47,6 +47,7 @@ javascripts:
     - public/javascripts/login.js
   mobile:
     - public/javascripts/vendor/jquery162.min.js
+    - public/javascripts/vendor/jquery.charcount.js
     - public/javascripts/rails.js # we only include this to hijack ajax requests
     - public/javascripts/vendor/mbp-helper.js
     - public/javascripts/mobile.js

public/javascripts/mobile.js

@@ -221,6 +221,39 @@ $(document).ready(function(){
     }, 'html');
   });
 
+
+  $(".service_icon").bind("tap click", function(evt) {
+    var service = $(this).toggleClass("dim"),
+      selectedServices = $("#new_status_message .service_icon:not(.dim)"),
+      provider = service.attr("id"),
+      hiddenField = $("#new_status_message input[name='services[]'][value='" + provider + "']"),
+      publisherMaxChars = 40000,
+      serviceMaxChars;
+
+
+    $("#new_status_message .counter").remove();
+
+    $.each(selectedServices, function() {
+      serviceMaxChars = parseInt($(this).attr("maxchar"));
+      if(publisherMaxChars > serviceMaxChars) {
+        publisherMaxChars = serviceMaxChars;
+      }
+    });
+
+    $('#status_message_text').charCount({allowed: publisherMaxChars, warning: publisherMaxChars/10 });
+
+    if(hiddenField.length > 0) { hiddenField.remove(); }
+    else {
+      $("#new_status_message").append(
+        $("<input/>", {
+          name: "services[]",
+          type: "hidden",
+          value: provider
+        })
+      );
+    }
+  });
+  
   $("#submit_new_message").bind("tap click", function(evt){
     evt.preventDefault();
     $("#new_status_message").submit();

public/stylesheets/sass/mobile.scss

@@ -659,6 +659,14 @@ footer {
 
   fieldset {
     padding: 10px;
+
+    .service_icon {
+      cursor: pointer;
+
+      &.dim {
+        @include opacity(0.6);
+      }
+    }
   }
 
   #message_container {