diff --git a/app/helpers/publisher_helper.rb b/app/helpers/publisher_helper.rb index 235fafbdb..d38f8a365 100644 --- a/app/helpers/publisher_helper.rb +++ b/app/helpers/publisher_helper.rb @@ -14,4 +14,8 @@ module PublisherHelper def public_helper_text (public_value)? t('javascripts.publisher.public'): t('javascripts.publisher.limited') end + + def all_aspects_selected?(selected_aspects) + @all_aspects_selected ||= all_aspects.size == selected_aspects.size + end end diff --git a/app/views/shared/_publisher.html.haml b/app/views/shared/_publisher.html.haml index 19b10c305..45d429fa5 100644 --- a/app/views/shared/_publisher.html.haml +++ b/app/views/shared/_publisher.html.haml @@ -25,21 +25,43 @@ = image_tag 'icons/camera.svg', :height => 14 - - for aspect_id in aspect_ids - = hidden_field_tag 'aspect_ids[]', aspect_id.to_s + - if all_aspects_selected?(selected_aspects) + = hidden_field_tag 'aspect_ids[]', "all_aspects" + - else + - for aspect_id in aspect_ids + = hidden_field_tag 'aspect_ids[]', aspect_id.to_s .options_and_submit .public_toggle %span#publisher_service_icons - = t("shared.publisher.click_to_share_with") - - if((defined?(for_all_aspects) && for_all_aspects) || aspect == :profile) - = status.hidden_field(:public, :value => public_value ) - = image_tag "icons/globe.png", :title => public_helper_text, :class => "public_icon #{'dim' if !public_value}", :width => 16, :height => 16 - 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}" = link_to (image_tag "icons/monotone_wrench_settings.png"), "#question_mark_pane", :class => 'question_mark', :rel => 'facebox', :title => t('shared.public_explain.manage') - = render "shared/aspect_dropdown", :selected_aspects => selected_aspects, :hang => 'left' + + + // NOTE(dropdown special casing to DRY up -- taken from the aspect_dropdown partial) + .dropdown{:class => "hang_right"} + .button.toggle.publisher + - if selected_aspects.size == all_aspects.size + = t('all_aspects') + - elsif selected_aspects.size == 1 + = selected_aspects.first.name + - else + = t('.toggle', :count => selected_aspects.size) + ▼ + + .wrapper + %ul.dropdown_list{:unSelectable => 'on', 'data-person_id' => (person.id if defined?(person) && person), 'data-service_uid' => (service_uid if defined?(service_uid))} + %li.public.radio{"data-aspect_id" => "public"} + Public + + %li.divider.all_aspects.radio{:style => "border-bottom: 1px solid #ddd;", "data-aspect_id" => "all_aspects", :class => ("selected" if all_aspects_selected?(selected_aspects))} + All Aspects + + - for aspect in all_aspects + = aspect_dropdown_list_item(aspect, !all_aspects_selected?(selected_aspects) && selected_aspects.include?(aspect) ) + = status.submit t('.share'), :disable_with => t('.posting'), :class => 'button creation', :tabindex => 2 .facebox_content diff --git a/config/locales/diaspora/en.yml b/config/locales/diaspora/en.yml index 0f72b83fa..49578223e 100644 --- a/config/locales/diaspora/en.yml +++ b/config/locales/diaspora/en.yml @@ -736,7 +736,6 @@ en: share_with: "share with" whats_on_your_mind: "What's on your mind?" publishing_to: "publishing to: " - click_to_share_with: "Click to share with: " discard_post: "Discard post" add_contact: enter_a_diaspora_username: "Enter a Diaspora username:" diff --git a/features/connects_users.feature b/features/connects_users.feature index 6f698c292..78889f72d 100644 --- a/features/connects_users.feature +++ b/features/connects_users.feature @@ -28,7 +28,8 @@ Feature: following and being followed And I am on the home page And I expand the publisher And I fill in "status_message_fake_text" with "I am ALICE" - And I press the first ".public_icon" within "#publisher" + And I press the first ".toggle" within "#publisher" + And I press the first ".public" within "#publisher" And I press "Share" And I go to the destroy user session page diff --git a/public/javascripts/aspects-dropdown.js b/public/javascripts/aspects-dropdown.js index 8ae0c13bc..02bd67d89 100644 --- a/public/javascripts/aspects-dropdown.js +++ b/public/javascripts/aspects-dropdown.js @@ -34,7 +34,25 @@ var AspectsDropdown = { }, toggleCheckbox: function(check) { + if(!check.hasClass('radio')){ + var selectedAspects = check.closest(".dropdown").find("li.radio"); + AspectsDropdown.uncheckGroup(selectedAspects); + } + check.toggleClass('selected'); + }, + + toggleRadio: function(check) { + var selectedAspects = check.closest(".dropdown").find("li"); + + AspectsDropdown.uncheckGroup(selectedAspects); + AspectsDropdown.toggleCheckbox(check); + }, + + uncheckGroup: function(elements){ + $.each(elements, function(index, value) { + $(value).removeClass('selected'); + }); } }; diff --git a/public/javascripts/publisher.js b/public/javascripts/publisher.js index 398847692..fab617268 100644 --- a/public/javascripts/publisher.js +++ b/public/javascripts/publisher.js @@ -316,19 +316,63 @@ var Publisher = { ''); } }, + + isPublicPost: function(){ + return $('#publisher [name="aspect_ids[]"]').first().val() == "public"; + }, + + isToAllAspects: function(){ + return $('#publisher [name="aspect_ids[]"]').first().val() == "all_aspects"; + }, + selectedAspectIds: function() { var aspects = $('#publisher [name="aspect_ids[]"]'); var aspectIds = []; aspects.each(function() { aspectIds.push( parseInt($(this).attr('value'))); }); return aspectIds; }, - toggleAspectIds: function(aspectId) { - var hidden_field = $('#publisher [name="aspect_ids[]"][value="'+aspectId+'"]'); - if(hidden_field.length > 0){ - hidden_field.remove(); + + removeRadioSelection: function(hiddenFields){ + $.each(hiddenFields, function(index, value){ + var el = $(value); + + if(el.val() == "all_aspects" || el.val() == "public") { + el.remove(); + } + }); + }, + + toggleAspectIds: function(li) { + var aspectId = li.attr('data-aspect_id'), + hiddenFields = $('#publisher [name="aspect_ids[]"]'), + appendId = function(){ + console.log(aspectId); + $("#publisher .content_creation form").append( + ''); + }; + + console.log(aspectId); + + if(li.hasClass('radio')){ + $.each(hiddenFields, function(index, value){ + $(value).remove(); + }); + appendId(); + + // close dropdown after selecting a binary option + li.closest('.dropdown').removeClass('active'); + } else { - $("#publisher .content_creation form").append( - ''); + var hiddenField = $('#publisher [name="aspect_ids[]"][value="'+aspectId+'"]'); + + // remove all radio selections + Publisher.removeRadioSelection(hiddenFields); + + if(hiddenField.length > 0){ + hiddenField.remove(); + } else { + appendId(); + } } }, createCounter: function(service){ @@ -350,10 +394,15 @@ var Publisher = { var li = $(this), button = li.parent('.dropdown').find('.button'); - AspectsDropdown.toggleCheckbox(li); + if(li.hasClass('radio')){ + AspectsDropdown.toggleRadio(li); + } else { + AspectsDropdown.toggleCheckbox(li); + } + AspectsDropdown.updateNumber(li.closest(".dropdown_list"), null, li.parent().find('li.selected').length, ''); - Publisher.toggleAspectIds(li.attr('data-aspect_id')); + Publisher.toggleAspectIds(li); }); }, beforeSubmit: function(){ @@ -378,10 +427,17 @@ var Publisher = { if (Publisher.bookmarklet == false) { var isPostVisible = Diaspora.page.aspectNavigation.selectedAspects().length == 0; var postedTo = Publisher.selectedAspectIds(); - $.each(Diaspora.page.aspectNavigation.selectedAspects(), function(index, value) { - if (postedTo.indexOf(parseInt(value)) > -1) - isPostVisible = true; - }); + + + if(Publisher.isPublicPost() || Publisher.isToAllAspects()){ + isPostVisible = true; + + } else { + $.each(Diaspora.page.aspectNavigation.selectedAspects(), function(index, value) { + if (postedTo.indexOf(parseInt(value)) > -1) + isPostVisible = true; + }); + } if(isPostVisible) { ContentUpdater.addPostToStream(json.html); diff --git a/public/stylesheets/sass/ui.sass b/public/stylesheets/sass/ui.sass index 38060868f..10bd31c2a 100644 --- a/public/stylesheets/sass/ui.sass +++ b/public/stylesheets/sass/ui.sass @@ -11,7 +11,6 @@ $button-border-color: #aaa .button @include border-radius(3px) - @include linear-gradient(rgb(248,250,250),rgb(228,223,223)) @include button-gradient($light-grey) @include box-shadow(0,1px,1px,#cfcfcf) @include transition(border) @@ -96,10 +95,11 @@ input.button .wrapper @include box-shadow(0, 2px, 5px, #666) + @include opacity(0) + @include transition(opacity) :z-index 20 :position absolute - :display none :width 140px :padding 4px 0 :margin-top 2px @@ -166,20 +166,20 @@ input.button @include border-radius(0, 3px, 3px, 3px) :left 0px + .selected + :font-weight bold + &.active .wrapper - :display block + @include opacity(1) .button @include border-radius(3px, 3px, 0, 0) :border 1px solid #444 - .selected - :font-weight bold - .button :background #666 - + .button, .wrapper ul > li:hover :background @@ -196,6 +196,10 @@ input.button :top 2px :bottom 2px + &.divider + :padding + :bottom 3px + a :color #ccc