Finishing Touches

app/assets/javascripts/app/views/aspects_dropdown_view.js

@@ -27,16 +27,14 @@ app.views.AspectsDropdown = app.views.Base.extend({
   },
 
   // change class and text of the dropdown button
-  _updateButton: function(inAspectClass) {
-    var button = this.$('.btn.dropdown-toggle'),
+  _updateButton: function() {
+    let button = this.$(".btn.dropdown-toggle"),
       selectedAspects = this.$(".dropdown-menu > li.selected").length,
       buttonText;
 
     if (selectedAspects === 0) {
-      button.removeClass(inAspectClass).addClass('btn-default');
       buttonText = Diaspora.I18n.t("aspect_dropdown.select_aspects");
     } else {
-      button.removeClass('btn-default').addClass(inAspectClass);
       if (selectedAspects === 1) {
         buttonText = this.$(".dropdown-menu > li.selected .text").first().text();
       } else {

app/assets/javascripts/app/views/publisher/aspect_selector_view.js

@@ -31,7 +31,7 @@ app.views.PublisherAspectSelector  = app.views.AspectsDropdown.extend({
     }
 
     this._updateSelectedAspectIds();
-    this._updateButton('btn-default');
+    this._updateButton();
 
     // update the globe or lock icon
     var icon = this.$("#visibility-icon");
@@ -48,7 +48,7 @@ app.views.PublisherAspectSelector  = app.views.AspectsDropdown.extend({
   updateAspectsSelector: function(ids){
     this._selectAspects(ids);
     this._updateSelectedAspectIds();
-    this._updateButton('btn-default');
+    this._updateButton();
   },
 
   // take care of the form fields that will indicate the selected aspects

app/assets/javascripts/mobile/publisher.js

@@ -50,7 +50,7 @@ $(document).ready(function(){
   new Diaspora.MarkdownEditor("#status_message_text");
 
   $(".dropdown-menu > li").bind("tap click", function(evt) {
-    var target = $(evt.target).closest("li");
+    let target = $(evt.target).closest("li");
 
     // visually toggle the aspect selection
     if (target.is(".radio")) {
@@ -62,10 +62,10 @@ $(document).ready(function(){
     }
 
     _updateSelectedAspectIds();
-    _updateButton("btn-default");
+    _updateButton();
 
     // update the globe or lock icon
-    var icon = $("#visibility-icon");
+    let icon = $("#visibility-icon");
     if (target.find(".text").text().trim() === Diaspora.I18n.t("stream.public")) {
       icon.removeClass("entypo-lock");
       icon.addClass("entypo-globe");
@@ -87,37 +87,35 @@ $(document).ready(function(){
 
   // take care of the form fields that will indicate the selected aspects
   function _updateSelectedAspectIds() {
-    var form = $("#new_status_message");
+    let form = $("#new_status_message");
 
     // remove previous selection
     form.find('input[name="aspect_ids[]"]').remove();
 
     // create fields for current selection
     form.find(".dropdown-menu > li.selected").each(function() {
-      var uid = _.uniqueId("aspect_ids_");
-      var id = $(this).data("aspect_id");
+      let uid = _.uniqueId("aspect_ids_");
+      let id = $(this).data("aspect_id");
       form.append('<input id="' + uid + '" name="aspect_ids[]" type="hidden" value="' + id + '">');
     });
   }
 
   // change class and text of the dropdown button
-  function _updateButton(inAspectClass) {
-    var button = $(".btn.dropdown-toggle"),
+  function _updateButton() {
+    let button = $(".btn.dropdown-toggle"),
         selectedAspects = $(".dropdown-menu > li.selected").length,
         buttonText;
 
-    if (selectedAspects === 0) {
-      button.removeClass(inAspectClass).addClass("btn-default");
-      buttonText = Diaspora.I18n.t("aspect_dropdown.select_aspects");
-    } else {
-      button.removeClass("btn-default").addClass(inAspectClass);
-      if (selectedAspects === 1) {
-        buttonText = this.$(".dropdown-menu > li.selected .text").first().text();
-      } else {
+    switch (selectedAspects) {
+      case 0:
+        buttonText = Diaspora.I18n.t("aspect_dropdown.select_aspects");
+        break;
+      case 1:
+        buttonText = $(".dropdown-menu > li.selected .text").first().text();
+        break;
+      default:
         buttonText = Diaspora.I18n.t("aspect_dropdown.toggle", {count: selectedAspects.toString()});
-      }
     }
-
     button.find(".text").text(buttonText);
   }
 });

app/assets/stylesheets/mobile/mobile.scss

@@ -658,24 +658,18 @@ form#update_profile_form {
   .submit_block { margin-bottom: 20px; }
 }
 
-select#user_language,
-select#user_color_theme,
-#user_auto_follow_back_aspect_id {
-  padding: 3px;
-}
-
 .hero-unit-mobile {
-  padding: 10px;
-  font-size: 14px;
-  line-height: 18px;
-  color: inherit;
   background-color: $background-grey;
   border-radius: 10px;
+  color: inherit;
+  font-size: 14px;
+  line-height: 18px;
+  padding: 10px;
 }
 
 .search-mobile {
-  text-align: center;
   padding-top: 30px;
+  text-align: center;
 }
 
 input#q.search {
@@ -717,8 +711,9 @@ input#q.search {
   top: 0;
 }
 
-#publisher_mobile {
+#publisher-mobile {
   float: right;
+  margin-left: 5px;
 }
 
 #file-upload-publisher {

app/assets/stylesheets/mobile/settings.scss

@@ -57,3 +57,9 @@
     }
   }
 }
+
+.user-language,
+.user-color-theme,
+.aspect-id {
+  padding: 3px;
+}

app/views/aspects/_aspect_dropdown.mobile.haml

@@ -1,14 +1,7 @@
 -# Note: all_aspects is a global in the ApplicationController
-:ruby
-  dropdown_css = {"data-toggle" => "dropdown"}
-  if current_user.getting_started?
-    dropdown_css[:title] = popover_with_close_html("2. #{t('shared.public_explain.control_your_audience')}")
-    dropdown_css["data-content"] = t("shared.public_explain.visibility_dropdown")
-  end
 
 .btn-group.aspect-dropdown
-  %button.btn.btn-default.dropdown-toggle{dropdown_css}
-    %i.entypo-lock.small#visibility-icon
+  %button.btn.btn-default.dropdown-toggle{data: {toggle: "dropdown"}}
     %span.text
       = t("all_aspects")
     %span.caret

app/views/publisher/_publisher.mobile.haml

@@ -17,19 +17,18 @@
             title: service.provider.titleize, class: "service_icon dim",
             id: "#{service.provider}", maxchar: "#{service.class::MAX_CHARACTERS}"
 
-    .btn-toolbar.pull-right
-      = render partial: "aspects/aspect_dropdown"
-
     .clear
     #publisher-textarea-wrapper
       %ul#photodropzone
     #fileInfo-publisher
-
-    #file-upload-publisher{class: "btn btn-default"}
-      %i.entypo-camera.middle
-    #publisher_mobile
-      = submit_tag t("shared.publisher.share"),
-        class: "btn btn-primary",
-        id: "submit_new_message",
-        data: {"disable-with" => t("shared.publisher.posting")}
     .clearfix
+    .btn-toolbar
+      .pull-left#file-upload-publisher
+        %i.entypo-camera.middle
+      .pull-right#publisher-mobile
+        = submit_tag t("shared.publisher.share"),
+          class: "btn btn-primary",
+          id: "submit_new_message",
+          data: {"disable-with" => t("shared.publisher.posting")}
+      .pull-right
+        = render partial: "aspects/aspect_dropdown"

app/views/users/_edit.haml

@@ -62,7 +62,7 @@
         %h3= t(".change_language")
         = form_for "user", url: edit_user_path, html: {method: :put} do |f|
           .form-inline.clearfix
-            = f.select :language, available_language_options, {}, class: "form-control form-group"
+            = f.select :language, available_language_options, {}, class: "form-control form-group user-language"
             = f.submit t(".change_language"), class: "btn btn-primary pull-right"
     %hr
 
@@ -71,7 +71,7 @@
         %h3= t(".change_color_theme")
         = form_for "user", url: edit_user_path, html: {method: :put} do |f|
           .form-inline.clearfix
-            = f.select :color_theme, available_color_themes, {}, class: "form-control form-group"
+            = f.select :color_theme, available_color_themes, {}, class: "form-control form-group color-theme"
             = f.submit t(".change_color_theme"), class: "btn btn-primary pull-right"
     %hr
 
@@ -110,7 +110,7 @@
               = f.select :auto_follow_back_aspect_id,
                 aspect_options_for_select(current_user.aspects),
                 {},
-                class: "form-control"
+                class: "form-control aspect-id"
 
           .small-horizontal-spacer
           .clearfix= f.submit t(".change"), class: "btn btn-primary pull-right"

features/desktop/posts_from_main_page.feature

@@ -153,7 +153,7 @@ Feature: posting from the main page
       And I go to the aspects page
       Then I should not see "I am eating a yogurt"
 
-    Scenario: change post target aspects with the aspect_dropdown before posting
+    Scenario: change post target aspects with the aspect-dropdown before posting
       When I expand the publisher
       And I press the aspect dropdown
       And I toggle the aspect "PostingTo"

features/mobile/posts_from_main_page.feature

@@ -23,13 +23,29 @@ Feature: posting from the mobile main page
     And I append "I am eating yogurt" to the publisher
     And I press the aspect dropdown
     And I toggle the aspect "Unicorns"
-    And I press the aspect dropdown
-    And I press "Share"
+    And I press the share button
     When I go to the stream page
     Then I should see "I am eating yogurt"
     When I confirm the alert after I click on selector "a.remove"
     Then I should not see "I am eating yogurt"
 
+  Scenario: post in multiple aspects
+    Given I visit the mobile publisher page
+    And I append "I am selecting my friends" to the publisher
+    And I press the aspect dropdown
+    And I toggle the aspect "PostingTo"
+    And I toggle the aspect "Unicorns"
+    And I press the share button
+
+    When I visit the stream with aspect "PostingTo"
+    Then I should see "I am selecting my friends"
+    
+    When I visit the stream with aspect "Unicorns"
+    Then I should see "I am selecting my friends"
+
+    When I visit the stream with aspect "NotPostingThingsHere"
+    Then I should not see "I am selecting my friends"
+
   Scenario: post a photo without text
     Given I visit the mobile publisher page
     When I attach the file "spec/fixtures/button.png" to hidden "qqfile" within "#file-upload-publisher"

features/step_definitions/aspects_steps.rb

@@ -2,7 +2,11 @@
 
 module AspectCukeHelpers
   def click_aspect_dropdown
-    find(".aspect-dropdown .dropdown-toggle").trigger "click"
+    find(".aspect-dropdown > .dropdown-toggle").click
+  end
+
+  def click_share_button
+    find("#submit_new_message").trigger "click"
   end
 
   def toggle_aspect(a_name)
@@ -112,6 +116,17 @@ When /^I press the aspect dropdown$/ do
   click_aspect_dropdown
 end
 
+When /^I press the share button$/ do
+  # There were issues 'clicking' the share button on mobile
+  click_share_button
+end
+
+When /^I visit the stream with aspect "([^"]*)"$/ do |aspect_name|
+  # In mobile view aspects are single anchors
+  a_id = @me.aspects.where(name: aspect_name).pick(:id)
+  visit("/aspects?a_ids[]=#{a_id}")
+end
+
 When /^(.*) in the aspect creation modal$/ do |action|
   within("#newAspectModal") do
     step action