diff --git a/Resources.php b/Resources.php index cb01d805..1d073321 100644 --- a/Resources.php +++ b/Resources.php @@ -146,6 +146,17 @@ $wgResourceModules['ext.uls.preferences'] = array( ), ) + $resourcePaths; +$wgResourceModules['ext.uls.compactlinks'] = array( + 'scripts' => 'resources/js/ext.uls.compactlinks.js', + 'styles' => 'resources/css/ext.uls.compactlinks.css', + 'dependencies' => array( + 'ext.uls.mediawiki', + 'ext.uls.init', + 'jquery.uls.compact', + 'mediawiki.ui.button', + ), +) + $resourcePaths; + $wgResourceModules['ext.uls.webfonts'] = array( 'scripts' => 'resources/js/ext.uls.webfonts.js', 'dependencies' => array( diff --git a/UniversalLanguageSelector.hooks.php b/UniversalLanguageSelector.hooks.php index 9315718a..f740f528 100644 --- a/UniversalLanguageSelector.hooks.php +++ b/UniversalLanguageSelector.hooks.php @@ -62,6 +62,13 @@ class UniversalLanguageSelectorHooks { // If the extension is enabled, basic features (API, language data) available. $out->addModules( 'ext.uls.init' ); + // If compact ULS beta feature is enabled + if ( class_exists( 'BetaFeatures' ) && + BetaFeatures::isFeatureEnabled( $out->getUser(), 'uls-compact-links' ) + ) { + $out->addModules( 'ext.uls.compactlinks' ); + } + if ( is_string( $wgULSGeoService ) ) { $out->addModules( 'ext.uls.geoclient' ); } @@ -327,6 +334,20 @@ class UniversalLanguageSelectorHooks { return true; } + public static function onGetBetaFeaturePreferences( $user, &$prefs ) { + global $wgExtensionAssetsPath; + $prefs['uls-compact-links'] = array( + 'label-message' => 'uls-betafeature-label', + 'desc-message' => 'uls-betafeature-desc', + 'screenshot' => $wgExtensionAssetsPath . + '/UniversalLanguageSelector/resources/images/compact-links-ltr.png', + 'info-link' => + 'https://www.mediawiki.org/wiki/Universal_Language_Selector/Design/Interlanguage_links', + 'discussion-link' => + 'https://www.mediawiki.org/wiki/Talk:Universal_Language_Selector/Design/Interlanguage_links', + ); + } + /** * Hook: SkinTemplateOutputPageBeforeExec * @param Skin $skin diff --git a/UniversalLanguageSelector.i18n.php b/UniversalLanguageSelector.i18n.php index c12250d8..5941686e 100644 --- a/UniversalLanguageSelector.i18n.php +++ b/UniversalLanguageSelector.i18n.php @@ -26,6 +26,7 @@ $messages = array(); * @author Amire80 * @author Nike * @author Kunal Mehta + * @author Niharika */ $messages['en'] = array( 'UniversalLanguageSelector' => 'Universal Language Selector', @@ -36,6 +37,8 @@ $messages['en'] = array( 'ext-uls-select-language-settings-icon-tooltip' => 'Language settings', 'ext-uls-undo-language-tooltip-text' => 'Language changed from $1', 'ext-uls-language-settings-preferences-link' => 'More language settings', + 'uls-betafeature-label' => 'Compacting interlanguage links', + 'uls-betafeature-desc' => 'Displays a shorter version of the language list with the languages that are more relevant to you.', ); /** Message documentation (Message documentation) @@ -58,6 +61,8 @@ This title is shown when there are no interlanguage links there, but an icon tha 'ext-uls-undo-language-tooltip-text' => 'Text for the tooltip appearing when language is changed. Parameters: * $1 - the previous language acronym', 'ext-uls-language-settings-preferences-link' => 'Text for the link showin in user preference screen', + 'uls-betafeature-label' => 'Title for the compact interlanguage links beta feature', + 'uls-betafeature-desc' => 'Description for the compact interlanguage links beta feature' ); /** Arabic (العربية) diff --git a/UniversalLanguageSelector.php b/UniversalLanguageSelector.php index 85178ace..7f9ec456 100644 --- a/UniversalLanguageSelector.php +++ b/UniversalLanguageSelector.php @@ -203,6 +203,8 @@ $GLOBALS['wgHooks']['EnterMobileMode'][] = 'UniversalLanguageSelectorHooks::onEn $GLOBALS['wgDefaultUserOptions']['uls-preferences'] = ''; $GLOBALS['wgHooks']['GetPreferences'][] = 'UniversalLanguageSelectorHooks::onGetPreferences'; +$GLOBALS['wgHooks']['GetBetaFeaturePreferences'][] = + 'UniversalLanguageSelectorHooks::onGetBetaFeaturePreferences'; $GLOBALS['wgExtensionFunctions'][] = function () { global $wgHooks, $wgResourceModules, $wgULSEventLogging, $wgULSGeoService; diff --git a/i18n/en.json b/i18n/en.json index 640a868d..0e8fd714 100644 --- a/i18n/en.json +++ b/i18n/en.json @@ -48,5 +48,6 @@ "ext-uls-input-disable-notification-undo": "Undo", "ext-uls-input-disable-notification-info-personal": "You can enable the input tools at any time from the language settings.", "ext-uls-input-disable-notification-info-interlanguage": "You can enable the input tools at any time from the language settings next to the language list.", -"ext-uls-language-settings-applying": "Applying..." +"ext-uls-language-settings-applying": "Applying...", +"ext-uls-compact-link-count": "{{PLURAL:$1|One more language|$1 more languages}}" } diff --git a/i18n/qqq.json b/i18n/qqq.json index bcc60639..67f99081 100644 --- a/i18n/qqq.json +++ b/i18n/qqq.json @@ -50,5 +50,7 @@ "ext-uls-input-disable-notification-undo": "Undo link text in the input method disable notification bubble.\n\nPreceded by the notification message {{msg-mw|Jquery-uls-ext-uls-input-disable-notification}}.\n{{Identical|Undo}}", "ext-uls-input-disable-notification-info-personal": "Notification bubble text when input methods are disabled, appears if the ULS is at personal toolbar", "ext-uls-input-disable-notification-info-interlanguage": "Notification bubble text when input methods are disabled, appears if the ULS is at interlanguage toolbar", - "ext-uls-language-settings-applying": "Label for apply settings button in language settings screen, while settings being saved. Please keep it short." -} \ No newline at end of file + "ext-uls-language-settings-applying": "Label for apply settings button in language settings screen, while settings being saved. Please keep it short.", + "ext-uls-language-settings-preferences-link": "Text for the link showing in user preference screen", + "ext-uls-compact-link-count": "Message next to list of languages which indicates that there are more languages than the ones shown. Parameters:\n* $1 - number of languages" +} diff --git a/resources/css/ext.uls.compactlinks.css b/resources/css/ext.uls.compactlinks.css new file mode 100644 index 00000000..a71f3d33 --- /dev/null +++ b/resources/css/ext.uls.compactlinks.css @@ -0,0 +1,38 @@ +#more-lang-label { + color: #8b8989; + font-size: 12px; + display: block; +} + +#p-lang-list .uls-trigger { + background-image: none; + padding: 0; +} + +.mw-interlanguage-selector { + cursor: pointer; + margin: 2px 0; + padding: 0 8px; +} + +.interlanguage-uls-menu:after, +.interlanguage-uls-menu:before { + right: 100%; + content: " "; + position: absolute; + border: 1px solid black; +} + +.interlanguage-uls-menu:after { + border-color: transparent; + border-right-color: #FCFCFC; + border-width: 20px; + top: 250px; +} + +.interlanguage-uls-menu:before { + border-color: transparent; + border-right-color: #555555; + border-width: 20px; + top: 250px; +} \ No newline at end of file diff --git a/resources/images/compact-links-ltr.png b/resources/images/compact-links-ltr.png new file mode 100644 index 00000000..8634c89e Binary files /dev/null and b/resources/images/compact-links-ltr.png differ diff --git a/resources/images/compact-links-ltr.svg b/resources/images/compact-links-ltr.svg new file mode 100644 index 00000000..cb5f42cf --- /dev/null +++ b/resources/images/compact-links-ltr.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/resources/images/compact-links-rtl.png b/resources/images/compact-links-rtl.png new file mode 100644 index 00000000..3e2ef633 Binary files /dev/null and b/resources/images/compact-links-rtl.png differ diff --git a/resources/images/compact-links-rtl.svg b/resources/images/compact-links-rtl.svg new file mode 100644 index 00000000..1589d0fb --- /dev/null +++ b/resources/images/compact-links-rtl.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/resources/js/ext.uls.compactlinks.js b/resources/js/ext.uls.compactlinks.js new file mode 100644 index 00000000..c3fdcfca --- /dev/null +++ b/resources/js/ext.uls.compactlinks.js @@ -0,0 +1,228 @@ +/** + * Compact the interlanguage links in the sidebar + * + * Copyright (C) 2012-2014 Alolita Sharma, Amir Aharoni, Arun Ganesh, Brandon Harris, + * Niklas Laxström, Pau Giner, Santhosh Thottingal, Siebrand Mazeland, Niharika Kohli + * and other contributors. See CREDITS for a list. + * + * UniversalLanguageSelector is dual licensed GPLv2 or later and MIT. You don't + * have to do anything special to choose one license or the other and you don't + * have to notify anyone which license you are using. You are free to use + * UniversalLanguageSelector in commercial projects as long as the copyright + * header is left intact. See files GPL-LICENSE and MIT-LICENSE for details. + * + * @file + * @ingroup Extensions + * @licence GNU GPL-2.0+ + * @licence MIT License + */ + +( function ( $, mw ) { + 'use strict'; + + /** + * Add a language to the interlanguage list + * @param {string} name Name of language in Autonym font + * @param {string} url Link of the article in the respective language wiki + */ + function addLanguage( name, url ) { + var $linkNode, + $listNode, + $interlanguageList; + + $linkNode = $( '' ) + .addClass( 'active' ) + .attr( 'href', url ) + .text( name ); + + $listNode = $( '
  • ' ) + .append( $linkNode ); + + $interlanguageList = $( '#p-lang > div > ul' ); + $interlanguageList.append( $listNode ); + } + + /** + * Find out the existing languages supported + * by article and fetch their href + * @return {Object} List of exiting language codes and their hrefs + */ + function getInterlanguageList() { + var interlangList = {}, + selectedElement; + $( '#p-lang > div > ul > li > a' ).each( function() { + selectedElement = $( this ); + interlangList[ selectedElement.attr( 'lang' ) ] = selectedElement.attr( 'href' ); + } ); + return interlangList; + } + + /** + * Fetch list of language names(in Autonym) which are supported by the article + * @return {Object} List of Language names in Autonym supported by article + */ + function getCurrentLanguages() { + var acceptedLanglist = {}, + interlangList = getInterlanguageList(), i; + for ( i in interlangList ) { + if( interlangList.hasOwnProperty( i ) ) { + acceptedLanglist[ i ] = $.uls.data.getAutonym(i); + } + } + return acceptedLanglist; + } + + /** + * Frequently spoken languages which are supported by the article for + * the Common Languages section of the ULS + * @return {Array} List of those language codes which are supported by article and appears + * in the Common Languages section of ULS + */ + function getCommonLanguages() { + // From ext.uls.init.js + var frequentLang = mw.uls.getFrequentLanguageList(), + $acceptedLang = $.map( getCurrentLanguages(), function ( element, index ) { + return index; + } ), + commonLanguages = [], i; + for ( i = 0; i < frequentLang.length; i++ ) { + if ( $.inArray( frequentLang[i], $acceptedLang ) >= 0 ) { + commonLanguages.push( frequentLang[i] ); + } + } + return commonLanguages; + } + + /** + * Add a ULS trigger beneath the interlanguage links + */ + function addULSlink() { + var $newLinknode, + $interlanguageList, + supportedLangs, + posOfTrigger; + + $newLinknode = $( '
    ' ) + .addClass( 'mw-interlanguage-selector mw-ui-button active' ) + .html( '…' ) + .append( $newLinknode ); + + $interlanguageList = $( '#p-lang > div > ul' ); + $interlanguageList.append( $newLinknode ); + posOfTrigger = $newLinknode.offset(); + + $( '.mw-interlanguage-selector' ).uls( { + onReady: function() { + this.$menu.addClass( 'interlanguage-uls-menu' ); + }, + + onSelect: function( language ) { + supportedLangs = getInterlanguageList(); + window.location.href = supportedLangs[language]; + }, + + compact: true, + left: posOfTrigger.left + $newLinknode.width() + 50 + 'px', + top: posOfTrigger.top - $newLinknode.height()/2 - 250 + 'px', + languages: getCurrentLanguages(), + quickList: getCommonLanguages() + } ); + } + + /** + * Hide existing languages displayed on the page + */ + function hideLanguages() { + var $languages = $( '.interlanguage-link' ); + $languages.hide(); + } + + /** + * Returns all languages returned by the commonLanguages function + * and randomly some more if the number falls short of numberOfLanguagesToShow parameter + * @param {number} numberOfLanguagesToShow Number of languages to be shown in sidebar + * @return {Array} Language codes of the final list to be displayed + */ + function displayLanguages( numberOfLanguagesToShow ) { + var commonLang = getCommonLanguages(), + currentLangs = getInterlanguageList(), i, + count, + finalList = []; + + // Check existing languages for ones in common, and add them to final list + for ( i = 0; i < commonLang.length; i++ ) { + finalList.push( commonLang[i] ); + } + + count = commonLang.length; + if ( count < numberOfLanguagesToShow ) { + for ( i in currentLangs ) { + if ( $.inArray( i, commonLang ) === -1 ) { + finalList.push( i ); + count++; + if ( count === numberOfLanguagesToShow ) { + break; + } + } + } + } + + // Sorting the language list in alphabetical order of ISO codes + finalList = finalList.sort(); + return finalList; + } + + /* + * Adds a label stating the number of more languages + * beneath the ULS link + * @param {Number} numberOfLanguagesSupported Number of languages supported by article + * @param {Number} numberOfLanguagesToShow Number of languages to be shown in the sidebar + */ + function addLabel( numberOfLanguagesSupported, numberOfLanguagesToShow ) { + var $interlanguageList = $( '#p-lang > div > ul' ), + newLabel = $( '