Merge "Add SVG versions of enhanced recent changes collapse/show arrows"
authorjenkins-bot <jenkins-bot@gerrit.wikimedia.org>
Fri, 27 Dec 2013 22:38:54 +0000 (22:38 +0000)
committerGerrit Code Review <gerrit@wikimedia.org>
Fri, 27 Dec 2013 22:38:54 +0000 (22:38 +0000)
1  2 
includes/libs/CSSMin.php
resources/Resources.php

diff --combined includes/libs/CSSMin.php
@@@ -38,8 -38,7 +38,8 @@@ class CSSMin 
         * which when base64 encoded will result in a 1/3 increase in size.
         */
        const EMBED_SIZE_LIMIT = 24576;
 -      const URL_REGEX = 'url\(\s*[\'"]?(?P<file>[^\?\)\'"]*)(?P<query>\??[^\)\'"]*)[\'"]?\s*\)';
 +      const URL_REGEX = 'url\(\s*[\'"]?(?P<file>[^\?\)\'"]*?)(?P<query>\?[^\)\'"]*?|)[\'"]?\s*\)';
 +      const EMBED_REGEX = '\/\*\s*\@embed\s*\*\/';
  
        /* Protected Static Members */
  
@@@ -53,6 -52,7 +53,7 @@@
                'tif' => 'image/tiff',
                'tiff' => 'image/tiff',
                'xbm' => 'image/x-xbitmap',
+               'svg' => 'image/svg+xml',
        );
  
        /* Static Methods */
        }
  
        /**
 -       * Remaps CSS URL paths and automatically embeds data URIs for URL rules
 -       * preceded by an /* @embed * / comment
 +       * Build a CSS 'url()' value for the given URL, quoting parentheses (and other funny characters)
 +       * and escaping quotes as necessary.
 +       *
 +       * @param string $url URL to process
 +       * @return string 'url()' value, usually just `"url($url)"`, quoted/escaped if necessary
 +       */
 +      public static function buildUrlValue( $url ) {
 +              // The list below has been crafted to match URLs such as:
 +              //   scheme://user@domain:port/~user/fi%20le.png?query=yes&really=y+s
 +              //   data:image/png;base64,R0lGODlh/+==
 +              if ( preg_match( '!^[\w\d:@/~.%+;,?&=-]+$!', $url ) ) {
 +                      return "url($url)";
 +              } else {
 +                      return 'url("' . strtr( $url, array( '\\' => '\\\\', '"' => '\\"' ) ) . '")';
 +              }
 +      }
 +
 +      /**
 +       * Remaps CSS URL paths and automatically embeds data URIs for CSS rules or url() values
 +       * preceded by an / * @embed * / comment.
         *
         * @param string $source CSS data to remap
         * @param string $local File path where the source was read from
         * @return string Remapped CSS data
         */
        public static function remap( $source, $local, $remote, $embedData = true ) {
 -              $pattern = '/((?P<embed>\s*\/\*\s*\@embed\s*\*\/)(?P<pre>[^\;\}]*))?' .
 -                      self::URL_REGEX . '(?P<post>[^;]*)[\;]?/';
 -              $offset = 0;
 -              while ( preg_match( $pattern, $source, $match, PREG_OFFSET_CAPTURE, $offset ) ) {
 -                      // Skip fully-qualified URLs and data URIs
 -                      $urlScheme = parse_url( $match['file'][0], PHP_URL_SCHEME );
 -                      if ( $urlScheme ) {
 -                              // Move the offset to the end of the match, leaving it alone
 -                              $offset = $match[0][1] + strlen( $match[0][0] );
 -                              continue;
 -                      }
 -                      // URLs with absolute paths like /w/index.php need to be expanded
 -                      // to absolute URLs but otherwise left alone
 -                      if ( $match['file'][0] !== '' && $match['file'][0][0] === '/' ) {
 -                              // Replace the file path with an expanded (possibly protocol-relative) URL
 -                              // ...but only if wfExpandUrl() is even available.
 -                              // This will not be the case if we're running outside of MW
 -                              $lengthIncrease = 0;
 -                              if ( function_exists( 'wfExpandUrl' ) ) {
 -                                      $expanded = wfExpandUrl( $match['file'][0], PROTO_RELATIVE );
 -                                      $origLength = strlen( $match['file'][0] );
 -                                      $lengthIncrease = strlen( $expanded ) - $origLength;
 -                                      $source = substr_replace( $source, $expanded,
 -                                              $match['file'][1], $origLength
 -                                      );
 -                              }
 -                              // Move the offset to the end of the match, leaving it alone
 -                              $offset = $match[0][1] + strlen( $match[0][0] ) + $lengthIncrease;
 -                              continue;
 +              // High-level overview:
 +              // * For each CSS rule in $source that includes at least one url() value:
 +              //   * Check for an @embed comment at the start indicating that all URIs should be embedded
 +              //   * For each url() value:
 +              //     * Check for an @embed comment directly preceding the value
 +              //     * If either @embed comment exists:
 +              //       * Embedding the URL as data: URI, if it's possible / allowed
 +              //       * Otherwise remap the URL to work in generated stylesheets
 +
 +              // Guard against trailing slashes, because "some/remote/../foo.png"
 +              // resolves to "some/remote/foo.png" on (some?) clients (bug 27052).
 +              if ( substr( $remote, -1 ) == '/' ) {
 +                      $remote = substr( $remote, 0, -1 );
 +              }
 +
 +              // Note: This will not correctly handle cases where ';', '{' or '}' appears in the rule itself,
 +              // e.g. in a quoted string. You are advised not to use such characters in file names.
 +              // We also match start/end of the string to be consistent in edge-cases ('@import url(…)').
 +              $pattern = '/(?:^|[;{])\K[^;{}]*' . CSSMin::URL_REGEX . '[^;}]*(?=[;}]|$)/';
 +              return preg_replace_callback( $pattern, function ( $matchOuter ) use ( $local, $remote, $embedData ) {
 +                      $rule = $matchOuter[0];
 +
 +                      // Check for global @embed comment and remove it
 +                      $embedAll = false;
 +                      $rule = preg_replace( '/^(\s*)' . CSSMin::EMBED_REGEX . '\s*/', '$1', $rule, 1, $embedAll );
 +
 +                      // Build two versions of current rule: with remapped URLs and with embedded data: URIs (where possible)
 +                      $pattern = '/(?P<embed>' . CSSMin::EMBED_REGEX . '\s*|)' . CSSMin::URL_REGEX . '/';
 +
 +                      $ruleWithRemapped = preg_replace_callback( $pattern, function ( $match ) use ( $local, $remote ) {
 +                              $remapped = CSSMin::remapOne( $match['file'], $match['query'], $local, $remote, false );
 +                              return CSSMin::buildUrlValue( $remapped );
 +                      }, $rule );
 +
 +                      if ( $embedData ) {
 +                              $ruleWithEmbedded = preg_replace_callback( $pattern, function ( $match ) use ( $embedAll, $local, $remote ) {
 +                                      $embed = $embedAll || $match['embed'];
 +                                      $embedded = CSSMin::remapOne( $match['file'], $match['query'], $local, $remote, $embed );
 +                                      return CSSMin::buildUrlValue( $embedded );
 +                              }, $rule );
                        }
  
 -                      // Guard against double slashes, because "some/remote/../foo.png"
 -                      // resolves to "some/remote/foo.png" on (some?) clients (bug 27052).
 -                      if ( substr( $remote, -1 ) == '/' ) {
 -                              $remote = substr( $remote, 0, -1 );
 +                      if ( $embedData && $ruleWithEmbedded !== $ruleWithRemapped ) {
 +                              // Build 2 CSS properties; one which uses a base64 encoded data URI in place
 +                              // of the @embed comment to try and retain line-number integrity, and the
 +                              // other with a remapped an versioned URL and an Internet Explorer hack
 +                              // making it ignored in all browsers that support data URIs
 +                              return "$ruleWithEmbedded;$ruleWithRemapped!ie";
 +                      } else {
 +                              // No reason to repeat twice
 +                              return $ruleWithRemapped;
                        }
 +              }, $source );
  
 -                      // Shortcuts
 -                      $embed = $match['embed'][0];
 -                      $pre = $match['pre'][0];
 -                      $post = $match['post'][0];
 -                      $query = $match['query'][0];
 -                      $url = "{$remote}/{$match['file'][0]}";
 -                      $file = "{$local}/{$match['file'][0]}";
 +              return $source;
 +      }
 +
 +      /**
 +       * Remap or embed a CSS URL path.
 +       *
 +       * @param string $file URL to remap/embed
 +       * @param string $query
 +       * @param string $local File path where the source was read from
 +       * @param string $remote URL path to the file
 +       * @param bool $embed Whether to do any data URI embedding
 +       * @return string Remapped/embedded URL data
 +       */
 +      public static function remapOne( $file, $query, $local, $remote, $embed ) {
 +              // The full URL possibly with query, as passed to the 'url()' value in CSS
 +              $url = $file . $query;
  
 -                      $replacement = false;
 +              // Skip fully-qualified and protocol-relative URLs and data URIs
 +              $urlScheme = substr( $url, 0, 2 ) === '//' || parse_url( $url, PHP_URL_SCHEME );
 +              if ( $urlScheme ) {
 +                      return $url;
 +              }
 +
 +              // URLs with absolute paths like /w/index.php need to be expanded
 +              // to absolute URLs but otherwise left alone
 +              if ( $url !== '' && $url[0] === '/' ) {
 +                      // Replace the file path with an expanded (possibly protocol-relative) URL
 +                      // ...but only if wfExpandUrl() is even available.
 +                      // This will not be the case if we're running outside of MW
 +                      if ( function_exists( 'wfExpandUrl' ) ) {
 +                              return wfExpandUrl( $url, PROTO_RELATIVE );
 +                      } else {
 +                              return $url;
 +                      }
 +              }
  
 -                      if ( $local !== false && file_exists( $file ) ) {
 +              if ( $local === false ) {
 +                      // Assume that all paths are relative to $remote, and make them absolute
 +                      return $remote . '/' . $url;
 +              } else {
 +                      // We drop the query part here and instead make the path relative to $remote
 +                      $url = "{$remote}/{$file}";
 +                      // Path to the actual file on the filesystem
 +                      $localFile = "{$local}/{$file}";
 +                      if ( file_exists( $localFile ) ) {
                                // Add version parameter as a time-stamp in ISO 8601 format,
                                // using Z for the timezone, meaning GMT
 -                              $url .= '?' . gmdate( 'Y-m-d\TH:i:s\Z', round( filemtime( $file ), -2 ) );
 -                              // Embedding requires a bit of extra processing, so let's skip that if we can
 -                              if ( $embedData && $embed && $match['embed'][1] > 0 ) {
 -                                      $data = self::encodeImageAsDataURI( $file );
 +                              $url .= '?' . gmdate( 'Y-m-d\TH:i:s\Z', round( filemtime( $localFile ), -2 ) );
 +                              if ( $embed ) {
 +                                      $data = self::encodeImageAsDataURI( $localFile );
                                        if ( $data !== false ) {
 -                                              // Build 2 CSS properties; one which uses a base64 encoded data URI in place
 -                                              // of the @embed comment to try and retain line-number integrity, and the
 -                                              // other with a remapped an versioned URL and an Internet Explorer hack
 -                                              // making it ignored in all browsers that support data URIs
 -                                              $replacement = "{$pre}url({$data}){$post};{$pre}url({$url}){$post}!ie;";
 +                                              return $data;
                                        }
                                }
 -                              if ( $replacement === false ) {
 -                                      // Assume that all paths are relative to $remote, and make them absolute
 -                                      $replacement = "{$embed}{$pre}url({$url}){$post};";
 -                              }
 -                      } elseif ( $local === false ) {
 -                              // Assume that all paths are relative to $remote, and make them absolute
 -                              $replacement = "{$embed}{$pre}url({$url}{$query}){$post};";
                        }
 -                      if ( $replacement !== false ) {
 -                              // Perform replacement on the source
 -                              $source = substr_replace(
 -                                      $source, $replacement, $match[0][1], strlen( $match[0][0] )
 -                              );
 -                              // Move the offset to the end of the replacement in the source
 -                              $offset = $match[0][1] + strlen( $replacement );
 -                              continue;
 -                      }
 -                      // Move the offset to the end of the match, leaving it alone
 -                      $offset = $match[0][1] + strlen( $match[0][0] );
 +                      // If any of these conditions failed (file missing, we don't want to embed it
 +                      // or it's not embeddable), return the URL (possibly with ?timestamp part)
 +                      return $url;
                }
 -              return $source;
        }
  
        /**
diff --combined resources/Resources.php
@@@ -50,59 -50,6 +50,59 @@@ return array
        // Scripts for the dynamic language specific data, like grammar forms.
        'mediawiki.language.data' => array( 'class' => 'ResourceLoaderLanguageDataModule' ),
  
 +      /**
 +       * Common skin styles, grouped into three graded levels.
 +       *
 +       * Level 1 "elements":
 +       *     The base level that only contains the most basic of common skin styles.
 +       *     Only styles for single elements are included, no styling for complex structures like the TOC
 +       *     is present. This level is for skins that want to implement the entire style of even content area
 +       *     structures like the TOC themselves.
 +       *
 +       * Level 2 "content":
 +       *     The most commonly used level for skins implemented from scratch. This level includes all the single
 +       *     element styles from "elements" as well as styles for complex structures such as the TOC that are output
 +       *     in the content area by MediaWiki rather than the skin. Essentially this is the common level that lets
 +       *     skins leave the style of the content area as it is normally styled, while leaving the rest of the skin
 +       *     up to the skin implementation.
 +       *
 +       * Level 3 "interface":
 +       *     The highest level, this stylesheet contains extra common styles for classes like .firstHeading, #contentSub,
 +       *     et cetera which are not outputted by MediaWiki but are common to skins like MonoBook, Vector, etc...
 +       *     Essentially this level is for styles that are common to MonoBook clones. And since practically every skin
 +       *     that currently exists within core is a MonoBook clone, all our core skins currently use this level.
 +       *
 +       * These modules are typically loaded by addModuleStyles which has absolutely no concept of dependency
 +       * management. As a result the skins.common.* modules contain duplicate stylesheet references instead of
 +       * setting 'dependencies' to the lower level the module is based on. For this reason avoid including multiple
 +       * skins.common.* modules into your skin as this will result in duplicate css.
 +       */
 +      'skins.common.elements' => array(
 +              'styles' => array(
 +                      'common/commonElements.css' => array( 'media' => 'screen' ),
 +              ),
 +              'remoteBasePath' => $GLOBALS['wgStylePath'],
 +              'localBasePath' => $GLOBALS['wgStyleDirectory'],
 +      ),
 +      'skins.common.content' => array(
 +              'styles' => array(
 +                      'common/commonElements.css' => array( 'media' => 'screen' ),
 +                      'common/commonContent.css' => array( 'media' => 'screen' ),
 +              ),
 +              'remoteBasePath' => $GLOBALS['wgStylePath'],
 +              'localBasePath' => $GLOBALS['wgStyleDirectory'],
 +      ),
 +      'skins.common.interface' => array(
 +              // Used in the web installer. Test it after modifying this definition!
 +              'styles' => array(
 +                      'common/commonElements.css' => array( 'media' => 'screen' ),
 +                      'common/commonContent.css' => array( 'media' => 'screen' ),
 +                      'common/commonInterface.css' => array( 'media' => 'screen' ),
 +              ),
 +              'remoteBasePath' => $GLOBALS['wgStylePath'],
 +              'localBasePath' => $GLOBALS['wgStyleDirectory'],
 +      ),
 +
        /**
         * Skins
         * Be careful not to add 'scripts' to these modules,
                'remoteBasePath' => $GLOBALS['wgStylePath'],
                'localBasePath' => $GLOBALS['wgStyleDirectory'],
        ),
 +      // FIXME: Remove in favour of skins.monobook.styles when cache expires
        'skins.monobook' => array(
                'styles' => array(
                        'common/commonElements.css' => array( 'media' => 'screen' ),
                'remoteBasePath' => $GLOBALS['wgStylePath'],
                'localBasePath' => $GLOBALS['wgStyleDirectory'],
        ),
 +      // FIXME: Remove in favour of skins.vector.styles when cache expires
        'skins.vector' => array(
 -              // Used in the web installer. Test it after modifying this definition!
                'styles' => array(
                        'common/commonElements.css' => array( 'media' => 'screen' ),
                        'common/commonContent.css' => array( 'media' => 'screen' ),
                'remoteBasePath' => $GLOBALS['wgStylePath'],
                'localBasePath' => $GLOBALS['wgStyleDirectory'],
        ),
 -      'skins.vector.beta' => array(
 -              // Keep in sync with skins.vector
 +      'skins.vector.styles' => array(
 +              // Used in the web installer. Test it after modifying this definition!
                'styles' => array(
 -                      'common/commonElements.css' => array( 'media' => 'screen' ),
 -                      'common/commonContent.css' => array( 'media' => 'screen' ),
 -                      'common/commonInterface.css' => array( 'media' => 'screen' ),
 -                      'vector/styles-beta.less',
 +                      'vector/styles.less',
 +              ),
 +              'remoteBasePath' => $GLOBALS['wgStylePath'],
 +              'localBasePath' => $GLOBALS['wgStyleDirectory'],
 +      ),
 +      'skins.monobook.styles' => array(
 +              'styles' => array(
 +                      'monobook/main.css' => array( 'media' => 'screen' ),
                ),
                'remoteBasePath' => $GLOBALS['wgStylePath'],
                'localBasePath' => $GLOBALS['wgStyleDirectory'],
        'jquery.autoEllipsis' => array(
                'scripts' => 'resources/jquery/jquery.autoEllipsis.js',
                'dependencies' => 'jquery.highlightText',
 +              'targets' => array( 'desktop', 'mobile' ),
        ),
        'jquery.badge' => array(
                'scripts' => 'resources/jquery/jquery.badge.js',
        'jquery.byteLimit' => array(
                'scripts' => 'resources/jquery/jquery.byteLimit.js',
                'dependencies' => 'jquery.byteLength',
 +              'targets' => array( 'desktop', 'mobile' ),
        ),
        'jquery.checkboxShiftClick' => array(
                'scripts' => 'resources/jquery/jquery.checkboxShiftClick.js',
        'jquery.highlightText' => array(
                'scripts' => 'resources/jquery/jquery.highlightText.js',
                'dependencies' => 'jquery.mwExtension',
 +              'targets' => array( 'desktop', 'mobile' ),
        ),
        'jquery.hoverIntent' => array(
                'scripts' => 'resources/jquery/jquery.hoverIntent.js',
        'mediawiki.api' => array(
                'scripts' => 'resources/mediawiki.api/mediawiki.api.js',
                'dependencies' => 'mediawiki.util',
 +              'targets' => array( 'desktop', 'mobile' ),
        ),
        'mediawiki.api.category' => array(
                'scripts' => 'resources/mediawiki.api/mediawiki.api.category.js',
                'messages' => array( 'htmlform-chosen-placeholder' ),
        ),
        'mediawiki.icon' => array(
-               'styles' => 'resources/mediawiki/mediawiki.icon.css',
+               'styles' => 'resources/mediawiki/mediawiki.icon.less',
        ),
        'mediawiki.inspect' => array(
                'scripts' => 'resources/mediawiki/mediawiki.inspect.js',
                'dependencies' => array(
                        'mediawiki.page.startup',
                ),
 +              'targets' => array( 'desktop', 'mobile' ),
        ),
        'mediawiki.notify' => array(
                'scripts' => 'resources/mediawiki/mediawiki.notify.js',
                        'jquery.byteLength',
                        'mediawiki.util',
                ),
 +              'targets' => array( 'desktop', 'mobile' ),
        ),
        'mediawiki.Uri' => array(
                'scripts' => 'resources/mediawiki/mediawiki.Uri.js',
 +              'targets' => array( 'desktop', 'mobile' ),
        ),
        'mediawiki.user' => array(
                'scripts' => 'resources/mediawiki/mediawiki.user.js',
                        'user.options',
                        'user.tokens',
                ),
 +              'targets' => array( 'desktop', 'mobile' ),
        ),
        'mediawiki.util' => array(
                'scripts' => 'resources/mediawiki/mediawiki.util.js',
        'mediawiki.action.history.diff' => array(
                'styles' => 'resources/mediawiki.action/mediawiki.action.history.diff.css',
                'group' => 'mediawiki.action.history',
 +              'targets' => array( 'desktop', 'mobile' ),
        ),
        'mediawiki.action.view.dblClickEdit' => array(
                'scripts' => 'resources/mediawiki.action/mediawiki.action.view.dblClickEdit.js',
        'mediawiki.special.changeslist' => array(
                'styles' => 'resources/mediawiki.special/mediawiki.special.changeslist.css',
        ),
 +      'mediawiki.special.changeslist.js' => array(
 +              'scripts' => 'resources/mediawiki.special/mediawiki.special.changeslist.js',
 +              'dependencies' => array(
 +                      'jquery.makeCollapsible',
 +                      'jquery.cookie',
 +              ),
 +      ),
        'mediawiki.special.changeslist.enhanced' => array(
                'styles' => 'resources/mediawiki.special/mediawiki.special.changeslist.enhanced.css',
        ),
                'skinStyles' => array(
                        'vector' => 'skins/vector/special.preferences.less',
                ),
 +              'messages' => array(
 +                      'prefs-tabs-navigation-hint',
 +              ),
        ),
        'mediawiki.special.recentchanges' => array(
                'scripts' => 'resources/mediawiki.special/mediawiki.special.recentchanges.js',
                        'mediawiki.util',
                ),
        ),
 -      'mediawiki.special.userlogin' => array(
 +      'mediawiki.special.userlogin.common.styles' => array(
                'styles' => array(
 -                      'resources/mediawiki.special/mediawiki.special.vforms.css',
 -                      'resources/mediawiki.special/mediawiki.special.userLogin.css',
 +                      'resources/mediawiki.special/mediawiki.special.userlogin.common.css',
                ),
                'position' => 'top',
        ),
 -      'mediawiki.special.createaccount' => array(
 +      'mediawiki.special.userlogin.signup.styles' => array(
                'styles' => array(
 -                      'resources/mediawiki.special/mediawiki.special.vforms.css',
 -                      'resources/mediawiki.special/mediawiki.special.createAccount.css',
 +                      'resources/mediawiki.special/mediawiki.special.userlogin.signup.css',
                ),
 +              'position' => 'top',
        ),
 -      'mediawiki.special.createaccount.js' => array(
 -              'scripts' => 'resources/mediawiki.special/mediawiki.special.createAccount.js',
 +      'mediawiki.special.userlogin.login.styles' => array(
 +              'styles' => array(
 +                      'resources/mediawiki.special/mediawiki.special.userlogin.login.css',
 +              ),
 +              'position' => 'top',
 +      ),
 +      'mediawiki.special.userlogin.common.js' => array(
 +              'scripts' => array(
 +                      'resources/mediawiki.special/mediawiki.special.userlogin.common.js',
 +              ),
                'messages' => array(
                        'createacct-captcha',
 +                      'createacct-imgcaptcha-ph',
 +              ),
 +      ),
 +      'mediawiki.special.userlogin.signup.js' => array(
 +              'scripts' => 'resources/mediawiki.special/mediawiki.special.userlogin.signup.js',
 +              'messages' => array(
                        'createacct-emailrequired',
 -                      'createacct-imgcaptcha-ph'
                ),
                'dependencies' => 'mediawiki.jqueryMsg',
 -              'position' => 'top',
        ),
        'mediawiki.special.javaScriptTest' => array(
                'scripts' => 'resources/mediawiki.special/mediawiki.special.javaScriptTest.js',
                        'vector' => 'resources/mediawiki.ui/vector.less',
                ),
                'position' => 'top',
 +              'targets' => array( 'desktop', 'mobile' ),
 +      ),
 +      // Lightweight module for button styles
 +      'mediawiki.ui.button' => array(
 +              'skinStyles' => array(
 +                      'default' => 'resources/mediawiki.ui/components/default/buttons.less',
 +                      'vector' => 'resources/mediawiki.ui/components/vector/buttons.less',
 +              ),
 +              'position' => 'top',
 +              'targets' => array( 'desktop', 'mobile' ),
 +      ),
 +
 +      /* OOJS */
 +      // WARNING: oojs is NOT COMPATIBLE with older browsers and
 +      // WILL BREAK if loaded in browsers that don't support ES5
 +      'oojs' => array(
 +              'scripts' => array(
 +                      'resources/oojs/oojs.js',
 +              ),
 +              'targets' => array( 'desktop', 'mobile' ),
        ),
  );