diff --git a/inc/functions.php b/inc/functions.php index 70e00dfb..8233487b 100644 --- a/inc/functions.php +++ b/inc/functions.php @@ -229,10 +229,31 @@ function preferred_languages_load_textdomain_mofile( $mofile ) { function preferred_languages_register_scripts() { $suffix = SCRIPT_DEBUG ? '' : '.min'; - wp_register_script( 'preferred-languages', plugin_dir_url( dirname( __FILE__ ) ) . 'js/preferred-languages' . $suffix . '.js', array( - 'jquery', - 'jquery-ui-sortable', - ), '20170513', true ); + wp_register_script( + 'preferred-languages', + plugin_dir_url( dirname( __FILE__ ) ) . 'js/preferred-languages' . $suffix . '.js', + array( + 'jquery', + 'jquery-ui-sortable', + 'wp-a11y' + ), + '20170930', + true + ); + + wp_localize_script( + 'preferred-languages', + 'preferredLanguages', + array( + 'l10n' => array( + 'localeAdded' => __( 'Locale added to list' ), + 'localeRemoved' => __( 'Locale removed from list' ), + 'movedUp' => __( 'Locale moved up' ), + 'movedDown' => __( 'Locale moved down' ), + ), + ) + ); + wp_enqueue_style( 'preferred-languages', plugin_dir_url( dirname( __FILE__ ) ) . 'css/preferred-languages.css', array(), '20170513', 'screen' ); } diff --git a/js/preferred-languages.js b/js/preferred-languages.js index af787def..011926d5 100644 --- a/js/preferred-languages.js +++ b/js/preferred-languages.js @@ -1,4 +1,4 @@ -(function( $, settings ) { +(function( wp, settings, $ ) { var $activeLocales = $( '.active-locales-list' ), $activeLocalesControls = $( '.active-locales-controls' ), $inactiveLocales = $( '.inactive-locales-list' ), @@ -77,6 +77,9 @@ // 3. Update buttons. changeButtonState( $selectedLocale ); + + // 4. Announce to assistive technologies. + wp.a11y.speak( settings.l10n.movedUp ); } /** @@ -93,6 +96,9 @@ // 3. Update buttons. changeButtonState( $selectedLocale ); + + // 4. Announce to assistive technologies. + wp.a11y.speak( settings.l10n.movedDown ); } /** @@ -133,6 +139,9 @@ // 5. Make visible in dropdown again. $inactiveLocales.find( 'select option[value="' + locale + '"]' ).removeClass('hidden'); + + // 6. Announce to assistive technologies. + wp.a11y.speak( settings.l10n.localeRemoved ); } /** @@ -180,6 +189,9 @@ // 5. Update hidden input field. updateHiddenInput(); + + // 6. Announce to assistive technologies. + wp.a11y.speak( settings.l10n.localeAdded ); } // Hide original language settings. @@ -249,4 +261,4 @@ // Remove locale from list. $activeLocalesControls.find( '.locales-remove' ).on( 'click', removeActiveLocale ); -})( jQuery, window.preferredLanguages ); +})( wp, preferredLanguages, jQuery ); diff --git a/js/preferred-languages.min.js b/js/preferred-languages.min.js index fd65eb7b..23487172 100644 --- a/js/preferred-languages.min.js +++ b/js/preferred-languages.min.js @@ -1 +1 @@ -(function($,settings){var $activeLocales=$(".active-locales-list"),$activeLocalesControls=$(".active-locales-controls"),$inactiveLocales=$(".inactive-locales-list"),$inactiveLocalesControls=$(".inactive-locales-controls"),$selectedLocale=$activeLocales.find('li[aria-selected="true"]'),$inputField=$('input[name="preferred_languages"]');function changeButtonState(activeLocale){$activeLocalesControls.find(".locales-move-up").attr("disabled",0===activeLocale.index());$activeLocalesControls.find(".locales-move-down").attr("disabled",activeLocale.index()===$activeLocales.children("li").length-1);$activeLocalesControls.find(".locales-remove").attr("disabled",1===$activeLocales.children("li").length)}function toggleLocale(locale){var selected=locale.attr("aria-selected"),newState=!!selected;if(true===selected){return}$selectedLocale.attr("aria-selected",false);locale.attr("aria-selected",newState);if(true===newState){$selectedLocale=locale;$activeLocales.attr("aria-activedescendant",$selectedLocale.attr("id"))}changeButtonState(locale)}function updateHiddenInput(){var locales=[];$activeLocales.children("li").each(function(){locales.push($(this).attr("id"))});$inputField.val(locales.join(","))}function moveLocaleUp(){$selectedLocale.insertBefore($selectedLocale.prev());updateHiddenInput();changeButtonState($selectedLocale)}function moveLocaleDown(){$selectedLocale.insertAfter($selectedLocale.next());updateHiddenInput();changeButtonState($selectedLocale)}function removeActiveLocale(){var locale=$selectedLocale.attr("id"),$successor;if(1===$activeLocales.children("li").length){return}$successor=$selectedLocale.prev();if(0===$successor.length){$successor=$selectedLocale.next()}$selectedLocale.remove();toggleLocale($successor);changeButtonState($selectedLocale);updateHiddenInput();if("en_US"===locale){locale=""}$inactiveLocales.find('select option[value="'+locale+'"]').removeClass("hidden")}function removeInactiveLocale(option){var $newLocale=$("
",{id:option.val()||"en_US",text:option.text(),"aria-selected":false}),$successor;$successor=option.prev(":not(.hidden)");if(0===$successor.length){$successor=option.next(":not(.hidden)")}if(0===$successor.length){$successor=$inactiveLocales.find("option").first()}$successor.attr("selected",true);$inactiveLocalesControls.val($successor.val());option.removeAttr("selected").addClass("hidden");if($activeLocales.find("#"+(option.val()||"en_US")).length>0){return}$activeLocales.append($newLocale);toggleLocale($newLocale);$activeLocales.animate({scrollTop:$newLocale.offset().top-$activeLocales.offset().top+$activeLocales.scrollTop()});updateHiddenInput()}$(".user-language-wrap").remove();$("#WPLANG").parent().parent().remove();changeButtonState($selectedLocale);$.each($inputField.val().split(","),function(index,value){value="en_US"===value?"":value;removeInactiveLocale($inactiveLocales.find('[value="'+value+'"]'))});$activeLocales.sortable({axis:"y",cursor:"move"});$activeLocales.on("keydown",function(e){if(38===e.which){if(e.altKey){moveLocaleUp()}else{$selectedLocale.prev().length&&toggleLocale($selectedLocale.prev())}e.preventDefault()}if(40===e.which){if(e.altKey){moveLocaleDown()}else{$selectedLocale.next().length&&toggleLocale($selectedLocale.next())}e.preventDefault()}if(8===e.which){removeActiveLocale();e.preventDefault()}});$inactiveLocalesControls.find(".locales-add").on("click",function(){removeInactiveLocale($inactiveLocales.find("select option:selected"))});$activeLocales.on("click","li",function(){toggleLocale($(this))});$activeLocalesControls.find(".locales-move-up").on("click",moveLocaleUp);$activeLocalesControls.find(".locales-move-down").on("click",moveLocaleDown);$activeLocalesControls.find(".locales-remove").on("click",removeActiveLocale)})(jQuery,window.preferredLanguages); \ No newline at end of file +(function(wp,settings,$){var $activeLocales=$(".active-locales-list"),$activeLocalesControls=$(".active-locales-controls"),$inactiveLocales=$(".inactive-locales-list"),$inactiveLocalesControls=$(".inactive-locales-controls"),$selectedLocale=$activeLocales.find('li[aria-selected="true"]'),$inputField=$('input[name="preferred_languages"]');function changeButtonState(activeLocale){$activeLocalesControls.find(".locales-move-up").attr("disabled",0===activeLocale.index());$activeLocalesControls.find(".locales-move-down").attr("disabled",activeLocale.index()===$activeLocales.children("li").length-1);$activeLocalesControls.find(".locales-remove").attr("disabled",1===$activeLocales.children("li").length)}function toggleLocale(locale){var selected=locale.attr("aria-selected"),newState=!!selected;if(true===selected){return}$selectedLocale.attr("aria-selected",false);locale.attr("aria-selected",newState);if(true===newState){$selectedLocale=locale;$activeLocales.attr("aria-activedescendant",$selectedLocale.attr("id"))}changeButtonState(locale)}function updateHiddenInput(){var locales=[];$activeLocales.children("li").each(function(){locales.push($(this).attr("id"))});$inputField.val(locales.join(","))}function moveLocaleUp(){$selectedLocale.insertBefore($selectedLocale.prev());updateHiddenInput();changeButtonState($selectedLocale);wp.a11y.speak(settings.l10n.movedUp)}function moveLocaleDown(){$selectedLocale.insertAfter($selectedLocale.next());updateHiddenInput();changeButtonState($selectedLocale);wp.a11y.speak(settings.l10n.movedDown)}function removeActiveLocale(){var locale=$selectedLocale.attr("id"),$successor;if(1===$activeLocales.children("li").length){return}$successor=$selectedLocale.prev();if(0===$successor.length){$successor=$selectedLocale.next()}$selectedLocale.remove();toggleLocale($successor);changeButtonState($selectedLocale);updateHiddenInput();if("en_US"===locale){locale=""}$inactiveLocales.find('select option[value="'+locale+'"]').removeClass("hidden");wp.a11y.speak(settings.l10n.localeRemoved)}function makeLocaleActive(option){var $newLocale=$("",{id:option.val()||"en_US",text:option.text(),"aria-selected":false}),$successor;$successor=option.prev(":not(.hidden)");if(0===$successor.length){$successor=option.next(":not(.hidden)")}if(0===$successor.length){$successor=$inactiveLocales.find("option").first()}$successor.attr("selected",true);$inactiveLocalesControls.val($successor.val());option.removeAttr("selected").addClass("hidden");if($activeLocales.find("#"+(option.val()||"en_US")).length>0){return}$activeLocales.append($newLocale);toggleLocale($newLocale);$activeLocales.animate({scrollTop:$newLocale.offset().top-$activeLocales.offset().top+$activeLocales.scrollTop()});updateHiddenInput();wp.a11y.speak(settings.l10n.localeAdded)}$(".user-language-wrap").remove();$("#WPLANG").parent().parent().remove();changeButtonState($selectedLocale);$.each($inputField.val().split(","),function(index,value){value="en_US"===value?"":value;makeLocaleActive($inactiveLocales.find('[value="'+value+'"]'))});$activeLocales.sortable({axis:"y",cursor:"move"});$activeLocales.on("keydown",function(e){if(38===e.which){if(e.altKey){moveLocaleUp()}else{$selectedLocale.prev().length&&toggleLocale($selectedLocale.prev())}e.preventDefault()}if(40===e.which){if(e.altKey){moveLocaleDown()}else{$selectedLocale.next().length&&toggleLocale($selectedLocale.next())}e.preventDefault()}if(8===e.which){removeActiveLocale();e.preventDefault()}});$inactiveLocalesControls.find(".locales-add").on("click",function(){makeLocaleActive($inactiveLocales.find("select option:selected"))});$activeLocales.on("click","li",function(){toggleLocale($(this))});$activeLocalesControls.find(".locales-move-up").on("click",moveLocaleUp);$activeLocalesControls.find(".locales-move-down").on("click",moveLocaleDown);$activeLocalesControls.find(".locales-remove").on("click",removeActiveLocale)})(wp,preferredLanguages,jQuery); \ No newline at end of file