Update OOjs UI to v0.1.0-pre (7788dc6700)

27832b1 Moved PNG icons to their own variant
06cf9a3 Make disabled state inheritable
4dd81c9 Removed some of the drop-shadows on buttons
88efa8e Localisation updates from https://translatewiki.net.

Change-Id: Ie66d907e8edabe722e2c2d2662a902e2aec1e1a7

diff --git a/resources/oojs-ui/i18n/km.json b/resources/oojs-ui/i18n/km.json
new file mode 100644 (file)
index 0000000..2013ee3
--- /dev/null
+++ b/resources/oojs-ui/i18n/km.json
@@ -0,0 +1,11 @@
+{
+    "@metadata": {
+        "authors": [
+            "Sovichet"
+        ]
+    },
+    "ooui-dialog-action-close": "បិទ",
+    "ooui-outline-control-move-down": "រុញ​ទៅ​ក្រោម",
+    "ooui-outline-control-move-up": "រុញ​ទៅ​លើ",
+    "ooui-toolbar-more": "បន្ថែម"
+}
\ No newline at end of file

diff --git a/resources/oojs-ui/oojs-ui.js b/resources/oojs-ui/oojs-ui.js
index a58f65d..07bb2a8 100644 (file)
--- a/resources/oojs-ui/oojs-ui.js
+++ b/resources/oojs-ui/oojs-ui.js
@@ -1,12 +1,12 @@
 /*!
- * OOjs UI v0.1.0-pre (a290673bbd)
+ * OOjs UI v0.1.0-pre (7788dc6700)
  * https://www.mediawiki.org/wiki/OOjs_UI
  *
  * Copyright 2011–2014 OOjs Team and other contributors.
  * Released under the MIT license
  * http://oojs.mit-license.org
  *
- * Date: Wed Feb 12 2014 13:52:08 GMT-0800 (PST)
+ * Date: Thu Feb 13 2014 13:56:07 GMT-0800 (PST)
  */
 ( function () {
 
@@ -176,6 +176,7 @@ OO.ui.Element = function OoUiElement( config ) {
        // Properties
        this.$ = config.$ || OO.ui.Element.getJQuery( document );
        this.$element = this.$( this.$.context.createElement( this.getTagName() ) );
+       this.elementGroup = null;
 
        // Initialization
        if ( Array.isArray( config.classes ) ) {
@@ -559,6 +560,26 @@ OO.ui.Element.prototype.getClosestScrollableElementContainer = function () {
        return OO.ui.Element.getClosestScrollableContainer( this.$element[0] );
 };
 
+/**
+ * Get group element is in.
+ *
+ * @returns {OO.ui.GroupElement|null} Group element, null if none
+ */
+OO.ui.Element.prototype.getElementGroup = function () {
+       return this.elementGroup;
+};
+
+/**
+ * Set group element is in.
+ *
+ * @param {OO.ui.GroupElement|null} group Group element, null if none
+ * @chainable
+ */
+OO.ui.Element.prototype.setElementGroup = function ( group ) {
+       this.elementGroup = group;
+       return this;
+};
+
 /**
  * Scroll element into view
  *
@@ -1654,11 +1675,12 @@ OO.ui.Widget = function OoUiWidget( config ) {
        OO.EventEmitter.call( this );
 
        // Properties
-       this.disabled = config.disabled;
+       this.disabled = null;
+       this.wasDisabled = null;
 
        // Initialization
        this.$element.addClass( 'oo-ui-widget' );
-       this.setDisabled( this.disabled );
+       this.setDisabled( !!config.disabled );
 };
 
 /* Inheritance */
@@ -1667,6 +1689,13 @@ OO.inheritClass( OO.ui.Widget, OO.ui.Element );
 
 OO.mixinClass( OO.ui.Widget, OO.EventEmitter );
 
+/* Events */
+
+/**
+ * @event disable
+ * @param {boolean} disabled Widget is disabled
+ */
+
 /* Methods */
 
 /**
@@ -1679,22 +1708,36 @@ OO.ui.Widget.prototype.isDisabled = function () {
        return this.disabled;
 };
 
+/**
+ * Update the disabled state, in case of changes in parent widget.
+ *
+ * @method
+ * @chainable
+ */
+OO.ui.Widget.prototype.updateDisabled = function () {
+       this.setDisabled( this.disabled );
+       return this;
+};
+
 /**
  * Set the disabled state of the widget.
  *
  * This should probably change the widgets's appearance and prevent it from being used.
  *
  * @method
- * @param {boolean} disabled Disable button
+ * @param {boolean} disabled Disable widget
  * @chainable
  */
 OO.ui.Widget.prototype.setDisabled = function ( disabled ) {
+       var isDisabled;
+
        this.disabled = !!disabled;
-       if ( this.disabled ) {
-               this.$element.addClass( 'oo-ui-widget-disabled' );
-       } else {
-               this.$element.removeClass( 'oo-ui-widget-disabled' );
+       isDisabled = this.isDisabled();
+       if ( isDisabled !== this.wasDisabled ) {
+               this.$element.toggleClass( 'oo-ui-widget-disabled', isDisabled );
+               this.emit( 'disable', isDisabled );
        }
+       this.wasDisabled = isDisabled;
        return this;
 };
 /**
@@ -2058,6 +2101,7 @@ OO.ui.GroupElement.prototype.addItems = function ( items, index ) {
                        }
                        item.connect( this, events );
                }
+               item.setElementGroup( this );
                $items = $items.add( item.$element );
        }
 
@@ -2097,6 +2141,7 @@ OO.ui.GroupElement.prototype.removeItems = function ( items ) {
                        if ( this.aggregate ) {
                                item.disconnect( this );
                        }
+                       item.setElementGroup( null );
                        this.items.splice( index, 1 );
                        item.$element.detach();
                        this.$items = this.$items.not( item.$element );
@@ -2123,6 +2168,7 @@ OO.ui.GroupElement.prototype.clearItems = function () {
                        item.disconnect( this );
                }
        }
+       item.setElementGroup( null );
        this.items = [];
        this.$items.detach();
        this.$items = this.$( [] );
@@ -4516,6 +4562,97 @@ OO.ui.PopupTool.prototype.onSelect = function () {
 OO.ui.PopupTool.prototype.onUpdateState = function () {
        this.setActive( false );
 };
+/**
+ * Group widget.
+ *
+ * Use together with OO.ui.ItemWidget to make disabled state inheritable.
+ *
+ * @class
+ * @abstract
+ * @extends OO.ui.GroupElement
+ *
+ * @constructor
+ * @param {jQuery} $group Container node, assigned to #$group
+ * @param {Object} [config] Configuration options
+ */
+OO.ui.GroupWidget = function OoUiGroupWidget( $element, config ) {
+       // Parent constructor
+       OO.ui.GroupElement.call( this, $element, config );
+};
+
+/* Inheritance */
+
+OO.inheritClass( OO.ui.GroupWidget, OO.ui.GroupElement );
+
+/* Methods */
+
+/**
+ * Set the disabled state of the widget.
+ *
+ * This will also update the disabled state of child widgets.
+ *
+ * @method
+ * @param {boolean} disabled Disable widget
+ * @chainable
+ */
+OO.ui.GroupWidget.prototype.setDisabled = function ( disabled ) {
+       var i, len;
+
+       // Parent method
+       OO.ui.Widget.prototype.setDisabled.call( this, disabled );
+
+       // During construction, #setDisabled is called before the OO.ui.GroupElement constructor
+       if ( this.items ) {
+               for ( i = 0, len = this.items.length; i < len; i++ ) {
+                       this.items[i].updateDisabled();
+               }
+       }
+
+       return this;
+};
+/**
+ * Item widget.
+ *
+ * Use together with OO.ui.GroupWidget to make disabled state inheritable.
+ *
+ * @class
+ * @abstract
+ *
+ * @constructor
+ */
+OO.ui.ItemWidget = function OoUiItemWidget() {
+       //
+};
+
+/* Methods */
+
+/**
+ * Check if widget is disabled.
+ *
+ * Checks parent if present, making disabled state inheritable.
+ *
+ * @returns {boolean} Widget is disabled
+ */
+OO.ui.ItemWidget.prototype.isDisabled = function () {
+       return this.disabled ||
+               ( this.elementGroup instanceof OO.ui.Widget && this.elementGroup.isDisabled() );
+};
+
+/**
+ * Set group element is in.
+ *
+ * @param {OO.ui.GroupElement|null} group Group element, null if none
+ * @chainable
+ */
+OO.ui.ItemWidget.prototype.setElementGroup = function ( group ) {
+       // Parent method
+       OO.ui.Element.prototype.setElementGroup.call( this, group );
+
+       // Initialize item disabled states
+       this.updateDisabled();
+
+       return this;
+};
 /**
  * Container for multiple related buttons.
  *
@@ -5240,6 +5377,7 @@ OO.ui.OptionWidget = function OoUiOptionWidget( data, config ) {
        OO.ui.Widget.call( this, config );
 
        // Mixin constructors
+       OO.ui.ItemWidget.call( this );
        OO.ui.IconedElement.call( this, this.$( '<span>' ), config );
        OO.ui.LabeledElement.call( this, this.$( '<span>' ), config );
        OO.ui.IndicatedElement.call( this, this.$( '<span>' ), config );
@@ -5268,6 +5406,7 @@ OO.ui.OptionWidget = function OoUiOptionWidget( data, config ) {
 
 OO.inheritClass( OO.ui.OptionWidget, OO.ui.Widget );
 
+OO.mixinClass( OO.ui.OptionWidget, OO.ui.ItemWidget );
 OO.mixinClass( OO.ui.OptionWidget, OO.ui.IconedElement );
 OO.mixinClass( OO.ui.OptionWidget, OO.ui.LabeledElement );
 OO.mixinClass( OO.ui.OptionWidget, OO.ui.IndicatedElement );
@@ -5413,7 +5552,7 @@ OO.ui.SelectWidget = function OoUiSelectWidget( config ) {
        OO.ui.Widget.call( this, config );
 
        // Mixin constructors
-       OO.ui.GroupElement.call( this, this.$element, config );
+       OO.ui.GroupWidget.call( this, this.$element, config );
 
        // Properties
        this.pressed = false;
@@ -5437,8 +5576,11 @@ OO.ui.SelectWidget = function OoUiSelectWidget( config ) {
 
 OO.inheritClass( OO.ui.SelectWidget, OO.ui.Widget );
 
+// Need to mixin base class as well
 OO.mixinClass( OO.ui.SelectWidget, OO.ui.GroupElement );
 
+OO.mixinClass( OO.ui.SelectWidget, OO.ui.GroupWidget );
+
 /* Events */
 
 /**

diff --git a/resources/oojs-ui/oojs-ui.svg.css b/resources/oojs-ui/oojs-ui.svg.css
index 185bcf0..be512dd 100644 (file)
--- a/resources/oojs-ui/oojs-ui.svg.css
+++ b/resources/oojs-ui/oojs-ui.svg.css
@@ -1,12 +1,12 @@
 /*!
- * OOjs UI v0.1.0-pre-svg (a290673bbd)
+ * OOjs UI v0.1.0-pre-svg (7788dc6700)
  * https://www.mediawiki.org/wiki/OOjs_UI
  *
  * Copyright 2011–2014 OOjs Team and other contributors.
  * Released under the MIT license
  * http://oojs.mit-license.org
  *
- * Date: Wed Feb 12 2014 13:52:08 GMT-0800 (PST)
+ * Date: Thu Feb 13 2014 13:56:07 GMT-0800 (PST)
  */
 /*csslint vendor-prefix:false */
 
@@ -236,6 +236,9 @@ a.oo-ui-buttonedElement-button {
 .oo-ui-buttonedElement .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator {
        margin-right: -0.75em;
 }
+.oo-ui-buttonedElement.oo-ui-widget-disabled .oo-ui-buttonedElement-button {
+       cursor: default;
+}
 
 .oo-ui-buttonedElement-frameless {
        display: inline-block;
@@ -281,7 +284,6 @@ a.oo-ui-buttonedElement-button {
        border-radius: 0.3em;
        vertical-align: top;
        text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
-       box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1);
        text-align: center;
 
        /* Animation */
@@ -995,14 +997,12 @@ a.oo-ui-buttonedElement-button {
 .oo-ui-buttonGroupWidget {
        display: inline-block;
        border-radius: 0.3em;
-       box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1);
 }
 
 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
        border-radius: 0;
        margin-bottom: -1px;
        margin-left: -1px;
-       box-shadow: none;
 }
 
 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed:first-child .oo-ui-buttonedElement-button {
@@ -1175,7 +1175,7 @@ a.oo-ui-buttonedElement-button {
        display: inline-block;
        font-size: 1em;
        font-family: sans-serif;
-       background-color: #f7f7f7;
+       background-color: #fff;
        border: solid 1px #ccc;
        box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #ddd;
        padding: 0.5em;
@@ -1187,10 +1187,10 @@ a.oo-ui-buttonedElement-button {
        resize: none;
 
        /* Animation */
-       -webkit-transition: border-color 200ms, box-shadow 200ms, background-color 200ms;
-       -moz-transition: border-color 200ms, box-shadow 200ms, background-color 200ms;
-       -o-transition: border-color 200ms, box-shadow 200ms, background-color 200ms;
-       transition: border-color 200ms, box-shadow 200ms, background-color 200ms;
+       -webkit-transition: border-color 200ms, box-shadow 200ms;
+       -moz-transition: border-color 200ms, box-shadow 200ms;
+       -o-transition: border-color 200ms, box-shadow 200ms;
+       transition: border-color 200ms, box-shadow 200ms;
 }
 
 .oo-ui-textInputWidget-pending input,
@@ -1203,7 +1203,6 @@ a.oo-ui-buttonedElement-button {
        outline: none;
        border-color: #a7dcff;
        box-shadow: 0 0 0.3em #a7dcff, 0 0 0 white;
-       background-color: #fff;
 }
 
 .oo-ui-textInputWidget input[readonly],
@@ -1217,6 +1216,7 @@ a.oo-ui-buttonedElement-button {
 .oo-ui-widget-disabled.oo-ui-textInputWidget textarea,
 .oo-ui-widget-disabled.oo-ui-textInputWidget textarea:focus {
        color: #ccc;
+       border-color: #ddd;
        text-shadow: 0 1px 1px #fff;
 }
 
@@ -1304,13 +1304,11 @@ a.oo-ui-buttonedElement-button {
 .oo-ui-buttonSelectWidget {
        display: inline-block;
        border-radius: 0.3em;
-       box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1);
 }
 
 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget .oo-ui-buttonedElement-button {
        border-radius: 0;
        margin-left: -1px;
-       box-shadow: none;
 }
 
 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:first-child .oo-ui-buttonedElement-button {
@@ -1479,6 +1477,7 @@ a.oo-ui-buttonedElement-button {
 
 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
        opacity: 0.5;
+       cursor: default;
 }
 
 .oo-ui-toggleSwitchWidget-grip {
@@ -1540,7 +1539,6 @@ a.oo-ui-buttonedElement-button {
        left: 0;
        border-radius: 1em;
        box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
-       cursor: pointer;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -moz-user-select: none;
@@ -1614,139 +1612,6 @@ a.oo-ui-buttonedElement-button {
 }
 /* Icons */
 
-.oo-ui-icon-add-item {
-       /* @embed */
-       background-image: url(images/icons/add-item.png);
-}
-
-.oo-ui-icon-advanced {
-       /* @embed */
-       background-image: url(images/icons/advanced.png);
-}
-
-.oo-ui-icon-alert {
-       /* @embed */
-       background-image: url(images/icons/alert.png);
-}
-
-.oo-ui-icon-check {
-       /* @embed */
-       background-image: url(images/icons/check.png);
-}
-
-.oo-ui-icon-clear {
-       /* @embed */
-       background-image: url(images/icons/clear.png);
-}
-
-.oo-ui-icon-close {
-       /* @embed */
-       background-image: url(images/icons/close.png);
-}
-
-.oo-ui-icon-code {
-       /* @embed */
-       background-image: url(images/icons/code.png);
-}
-
-.oo-ui-icon-collapse {
-       /* @embed */
-       background-image: url(images/icons/collapse.png);
-}
-
-.oo-ui-icon-comment {
-       /* @embed */
-       background-image: url(images/icons/comment.png);
-}
-
-.oo-ui-icon-expand {
-       /* @embed */
-       background-image: url(images/icons/expand.png);
-}
-
-.oo-ui-icon-help {
-       /* @embed */
-       background-image: url(images/icons/help.png);
-}
-
-.oo-ui-icon-link {
-       /* @embed */
-       background-image: url(images/icons/link.png);
-}
-
-.oo-ui-icon-menu {
-       /* @embed */
-       background-image: url(images/icons/menu.png);
-}
-
-.oo-ui-icon-next {
-       /* @embed */
-       background-image: url(images/icons/move-ltr.png);
-}
-
-.oo-ui-icon-picture {
-       /* @embed */
-       background-image: url(images/icons/picture.png);
-}
-
-.oo-ui-icon-previous {
-       /* @embed */
-       background-image: url(images/icons/move-rtl.png);
-}
-
-.oo-ui-icon-redo {
-       /* @embed */
-       background-image: url(images/icons/arched-arrow-ltr.png);
-}
-
-.oo-ui-icon-remove {
-       /* @embed */
-       background-image: url(images/icons/remove.png);
-}
-
-.oo-ui-icon-search {
-       /* @embed */
-       background-image: url(images/icons/search.png);
-}
-
-.oo-ui-icon-settings {
-       /* @embed */
-       background-image: url(images/icons/settings.png);
-}
-
-.oo-ui-icon-tag {
-       /* @embed */
-       background-image: url(images/icons/tag.png);
-}
-
-.oo-ui-icon-undo {
-       /* @embed */
-       background-image: url(images/icons/arched-arrow-rtl.png);
-}
-
-.oo-ui-icon-window {
-       /* @embed */
-       background-image: url(images/icons/window.png);
-}
-
-/* Indicators */
-
-.oo-ui-indicator-down {
-       /* @embed */
-       background-image: url(images/indicators/down.png);
-}
-
-.oo-ui-indicator-required {
-       /* @embed */
-       background-image: url(images/indicators/required.png);
-}
-
-.oo-ui-indicator-up {
-       /* @embed */
-       background-image: url(images/indicators/up.png);
-}
-/* Icons */
-
 .oo-ui-icon-add-item {
        /* @embed */
        background-image: url(images/icons/add-item.svg);