diff --git a/app/assets/javascripts/mobile/publisher.js b/app/assets/javascripts/mobile/publisher.js index 9bac0f0bf..b94578d7f 100644 --- a/app/assets/javascripts/mobile/publisher.js +++ b/app/assets/javascripts/mobile/publisher.js @@ -48,4 +48,78 @@ $(document).ready(function(){ }); new Diaspora.MarkdownEditor("#status_message_text"); + + $(".dropdown-menu > li").bind("tap click", function(evt) { + var target = $(evt.target).closest('li'); + + // visually toggle the aspect selection + if (target.is('.radio')) { + _toggleRadio(target); + } else if (target.is('.aspect_selector')) { + // don't close the dropdown + evt.stopPropagation(); + _toggleCheckbox(target); + } + + _updateSelectedAspectIds(); + _updateButton('btn-default'); + + // update the globe or lock icon + var icon = $("#visibility-icon"); + if (target.find(".text").text().trim() === Diaspora.I18n.t("stream.public")) { + icon.removeClass("entypo-lock"); + icon.addClass("entypo-globe"); + } else { + icon.removeClass("entypo-globe"); + icon.addClass("entypo-lock"); + } + }); + + function _toggleRadio (target) { + $('.dropdown-menu > li').removeClass('selected'); + target.toggleClass('selected'); + }; + + function _toggleCheckbox (target) { + $('.dropdown-menu > li.radio').removeClass('selected'); + target.toggleClass('selected'); + }; + + // take care of the form fields that will indicate the selected aspects + function _updateSelectedAspectIds() { + var form = $("#new_status_message"); + + // remove previous selection + form.find('input[name="aspect_ids[]"]').remove(); + + // create fields for current selection + $('.dropdown-menu > li.selected').each(function() { + var uid = _.uniqueId('aspect_ids_'); + var id = $(this).data('aspect_id'); + form.append( + '' + ); + }); + }; + + // change class and text of the dropdown button + function _updateButton(inAspectClass) { + var 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 { + buttonText = Diaspora.I18n.t("aspect_dropdown.toggle", { count: selectedAspects.toString() }); + } + } + + button.find('.text').text(buttonText); + } }); diff --git a/app/views/aspects/_aspect_dropdown.mobile.haml b/app/views/aspects/_aspect_dropdown.mobile.haml index 807f295f2..74fcbc6e8 100644 --- a/app/views/aspects/_aspect_dropdown.mobile.haml +++ b/app/views/aspects/_aspect_dropdown.mobile.haml @@ -20,7 +20,7 @@ %i.glyphicon.glyphicon-ok %span.text = t("public") - %li.all_aspects.radio{"data-aspect_id" => "all_aspects"} + %li.all_aspects.radio.selected{"data-aspect_id" => "all_aspects"} %a %span.status_indicator %i.glyphicon.glyphicon-ok