"ext-iconv": "*",
"liuggio/statsd-php-client": "1.0.18",
"mediawiki/at-ease": "1.1.0",
- "oojs/oojs-ui": "0.15.2",
+ "oojs/oojs-ui": "0.15.3",
"oyejorge/less.php": "1.7.0.10",
"php": ">=5.3.3",
"psr/log": "1.0.0",
"KuboF",
"Shirayuki",
"Yekrats",
- "Kvardek du"
+ "Kvardek du",
+ "Psychoslave"
]
},
"ooui-outline-control-move-down": "Movi eron suben",
"ooui-dialog-process-continue": "Daŭrigi",
"ooui-selectfile-button-select": "Elekti dosieron",
"ooui-selectfile-not-supported": "Dosieroselekto ne estas subtenata.",
- "ooui-selectfile-placeholder": "Vi ne selektis dosieron"
+ "ooui-selectfile-placeholder": "Vi ne selektis dosieron",
+ "ooui-selectfile-dragdrop-placeholder": "Ĵetu dosieron ĉi tie."
}
"ooui-dialog-process-dismiss": "Didi",
"ooui-dialog-process-retry": "Itti deebi'ii yaali",
"ooui-dialog-process-continue": "Itti fufi",
+ "ooui-selectfile-button-select": "Faayilii filadhu",
"ooui-selectfile-not-supported": "Faayilii filachuun hin danda'amu.",
- "ooui-selectfile-placeholder": "Faayiliin wayiiyyuu hin filatamne"
+ "ooui-selectfile-placeholder": "Faayiliin wayiiyyuu hin filatamne",
+ "ooui-selectfile-dragdrop-placeholder": "Faayilii as kaa'i"
}
"ooui-dialog-process-retry": "ٻيهر ڪوشش ڪريو",
"ooui-dialog-process-continue": "جاري رکو",
"ooui-selectfile-button-select": "ڪو فائيل چونڊِو",
+ "ooui-selectfile-not-supported": "فائيل جي چونڊ سپورٽ نٿي ڪئي وڃي",
"ooui-selectfile-placeholder": "ڪوبه فائيل چونڊيو نه ويو آهي",
"ooui-selectfile-dragdrop-placeholder": "فائيل کي هتي ڪيرايو"
}
"ooui-dialog-process-error": "Nešto je pošlo naopako",
"ooui-dialog-process-dismiss": "Odbaci",
"ooui-dialog-process-retry": "Pokušaj ponovo",
- "ooui-dialog-process-continue": "Nastavi"
+ "ooui-dialog-process-continue": "Nastavi",
+ "ooui-selectfile-button-select": "Izaberi datoteku",
+ "ooui-selectfile-placeholder": "Nije izabrana nijedna datoteka"
}
/*!
- * OOjs UI v0.15.2
+ * OOjs UI v0.15.3
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-02-02T22:07:00Z
+ * Date: 2016-02-09T21:21:16Z
*/
( function ( OO ) {
/*!
- * OOjs UI v0.15.2
+ * OOjs UI v0.15.3
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-02-02T22:07:06Z
+ * Date: 2016-02-09T21:21:21Z
*/
-@-webkit-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-moz-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-ms-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-o-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
.oo-ui-element-hidden {
display: none !important;
}
/*!
- * OOjs UI v0.15.2
+ * OOjs UI v0.15.3
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-02-02T22:07:06Z
+ * Date: 2016-02-09T21:21:21Z
*/
-@-webkit-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-moz-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
.oo-ui-element-hidden {
display: none !important;
}
left: 0.2em;
}
.oo-ui-buttonElement-framed.oo-ui-widget-disabled > .oo-ui-buttonElement-button {
- background: #dddddd;
+ background-color: #dddddd;
color: #ffffff;
border: 1px solid #dddddd;
}
/*!
- * OOjs UI v0.15.2
+ * OOjs UI v0.15.3
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-02-02T22:07:00Z
+ * Date: 2016-02-09T21:21:16Z
*/
( function ( OO ) {
*/
OO.ui.Element.static.unsafeInfuse = function ( idOrNode, domPromise ) {
// look for a cached result of a previous infusion.
- var id, $elem, data, cls, parts, parent, obj, top, state;
+ var id, $elem, data, cls, parts, parent, obj, top, state, infusedChildren;
if ( typeof idOrNode === 'string' ) {
id = idOrNode;
$elem = $( document.getElementById( id ) );
if ( !$elem.length ) {
throw new Error( 'Widget not found: ' + id );
}
- data = $elem.data( 'ooui-infused' ) || $elem[ 0 ].oouiInfused;
+ if ( $elem[ 0 ].oouiInfused ) {
+ $elem = $elem[ 0 ].oouiInfused;
+ }
+ data = $elem.data( 'ooui-infused' );
if ( data ) {
// cached!
if ( data === true ) {
throw new Error( 'Circular dependency! ' + id );
}
+ if ( domPromise ) {
+ // pick up dynamic state, like focus, value of form inputs, scroll position, etc.
+ state = data.gatherPreInfuseState( $elem );
+ // restore dynamic state after the new element is re-inserted into DOM under infused parent
+ domPromise.done( data.restorePreInfuseState.bind( data, state ) );
+ infusedChildren = $elem.data( 'ooui-infused-children' );
+ if ( infusedChildren && infusedChildren.length ) {
+ infusedChildren.forEach( function ( data ) {
+ var state = data.gatherPreInfuseState( $elem );
+ domPromise.done( data.restorePreInfuseState.bind( data, state ) );
+ } );
+ }
+ }
return data;
}
data = $elem.attr( 'data-ooui' );
}
$elem.data( 'ooui-infused', true ); // prevent loops
data.id = id; // implicit
+ infusedChildren = [];
data = OO.copy( data, null, function deserialize( value ) {
+ var infused;
if ( OO.isPlainObject( value ) ) {
if ( value.tag ) {
- return OO.ui.Element.static.unsafeInfuse( value.tag, domPromise );
+ infused = OO.ui.Element.static.unsafeInfuse( value.tag, domPromise );
+ infusedChildren.push( infused );
+ // Flatten the structure
+ infusedChildren.push.apply( infusedChildren, infused.$element.data( 'ooui-infused-children' ) || [] );
+ infused.$element.removeData( 'ooui-infused-children' );
+ return infused;
}
if ( value.html ) {
return new OO.ui.HtmlSnippet( value.html );
// This element is now gone from the DOM, but if anyone is holding a reference to it,
// let's allow them to OO.ui.infuse() it and do what they expect (T105828).
// Do not use jQuery.data(), as using it on detached nodes leaks memory in 1.x line by design.
- $elem[ 0 ].oouiInfused = obj;
+ $elem[ 0 ].oouiInfused = obj.$element;
}
top.resolve();
}
obj.$element.data( 'ooui-infused', obj );
+ obj.$element.data( 'ooui-infused-children', infusedChildren );
// set the 'data-ooui' attribute so we can identify infused widgets
obj.$element.attr( 'data-ooui', '' );
// restore dynamic state after the new element is inserted into DOM
}
}
if ( !$.isEmptyObject( anim ) ) {
- $sc.stop( true ).animate( anim, config.duration || 'fast' );
+ $sc.stop( true ).animate( anim, config.duration === undefined ? 'fast' : config.duration );
if ( callback ) {
$sc.queue( function ( next ) {
callback();
* Handles mouse up events.
*
* @protected
- * @param {jQuery.Event} e Mouse up event
+ * @param {MouseEvent} e Mouse up event
*/
OO.ui.mixin.ButtonElement.prototype.onMouseUp = function ( e ) {
if ( this.isDisabled() || e.which !== OO.ui.MouseButtons.LEFT ) {
* Handles key up events.
*
* @protected
- * @param {jQuery.Event} e Key up event
+ * @param {KeyboardEvent} e Key up event
*/
OO.ui.mixin.ButtonElement.prototype.onKeyUp = function ( e ) {
if ( this.isDisabled() || ( e.which !== OO.ui.Keys.SPACE && e.which !== OO.ui.Keys.ENTER ) ) {
* Handle mouse up events.
*
* @private
- * @param {jQuery.Event} e Mouse up event
+ * @param {MouseEvent} e Mouse up event
*/
OO.ui.SelectWidget.prototype.onMouseUp = function ( e ) {
var item;
* Handle mouse move events.
*
* @private
- * @param {jQuery.Event} e Mouse move event
+ * @param {MouseEvent} e Mouse move event
*/
OO.ui.SelectWidget.prototype.onMouseMove = function ( e ) {
var item;
this.selecting = item;
}
}
- return false;
};
/**
* Handle key down events.
*
* @protected
- * @param {jQuery.Event} e Key down event
+ * @param {KeyboardEvent} e Key down event
*/
OO.ui.SelectWidget.prototype.onKeyDown = function ( e ) {
var nextItem,
}
if ( handled ) {
- // Can't just return false, because e is not always a jQuery event
e.preventDefault();
e.stopPropagation();
}
* Handle key press events.
*
* @protected
- * @param {jQuery.Event} e Key press event
+ * @param {KeyboardEvent} e Key press event
*/
OO.ui.SelectWidget.prototype.onKeyPress = function ( e ) {
var c, filter, item;
item.scrollElementIntoView();
}
- return false;
+ e.preventDefault();
+ e.stopPropagation();
};
/**
* Handles document mouse down events.
*
* @protected
- * @param {jQuery.Event} e Key down event
+ * @param {MouseEvent} e Mouse down event
*/
OO.ui.MenuSelectWidget.prototype.onDocumentMouseDown = function ( e ) {
if (
}
this.toggleClipping( true );
+ if ( this.getSelectedItem() ) {
+ this.getSelectedItem().scrollElementIntoView( { duration: 0 } );
+ }
+
// Auto-hide
if ( this.autoHide ) {
this.getElementDocument().addEventListener( 'mousedown', this.onDocumentMouseDownHandler, true );
// Events
this.$handle.on( {
click: this.onClick.bind( this ),
- keypress: this.onKeyPress.bind( this )
+ keydown: this.onKeyDown.bind( this )
} );
this.menu.connect( this, { select: 'onMenuSelect' } );
};
/**
- * Handle key press events.
+ * Handle key down events.
*
* @private
- * @param {jQuery.Event} e Key press event
+ * @param {jQuery.Event} e Key down event
*/
-OO.ui.DropdownWidget.prototype.onKeyPress = function ( e ) {
- if ( !this.isDisabled() &&
- ( ( e.which === OO.ui.Keys.SPACE && !this.menu.isVisible() ) || e.which === OO.ui.Keys.ENTER )
+OO.ui.DropdownWidget.prototype.onKeyDown = function ( e ) {
+ if (
+ !this.isDisabled() &&
+ (
+ e.which === OO.ui.Keys.ENTER ||
+ (
+ !this.menu.isVisible() &&
+ (
+ e.which === OO.ui.Keys.SPACE ||
+ e.which === OO.ui.Keys.UP ||
+ e.which === OO.ui.Keys.DOWN
+ )
+ )
+ )
) {
this.menu.toggle();
return false;
.addClass( 'oo-ui-inputWidget' )
.append( this.$input );
this.setValue( config.value );
- this.setAccessKey( config.accessKey );
if ( config.dir ) {
this.setDir( config.dir );
}
return this;
};
-/**
- * Set the input's access key.
- * FIXME: This is the same code as in OO.ui.mixin.ButtonElement, maybe find a better place for it?
- *
- * @param {string} accessKey Input's access key, use empty string to remove
- * @chainable
- */
-OO.ui.InputWidget.prototype.setAccessKey = function ( accessKey ) {
- accessKey = typeof accessKey === 'string' && accessKey.length ? accessKey : null;
-
- if ( this.accessKey !== accessKey ) {
- if ( this.$input ) {
- if ( accessKey !== null ) {
- this.$input.attr( 'accesskey', accessKey );
- } else {
- this.$input.removeAttr( 'accesskey' );
- }
- }
- this.accessKey = accessKey;
- }
-
- return this;
-};
-
/**
* Clean up incoming value.
*
/*!
- * OOjs UI v0.15.2
+ * OOjs UI v0.15.3
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-02-02T22:07:00Z
+ * Date: 2016-02-09T21:21:16Z
*/
( function ( OO ) {
/*!
- * OOjs UI v0.15.2
+ * OOjs UI v0.15.3
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-02-02T22:07:06Z
+ * Date: 2016-02-09T21:21:21Z
*/
-@-webkit-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-moz-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-ms-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-o-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
.oo-ui-popupTool .oo-ui-popupWidget-popup,
.oo-ui-popupTool .oo-ui-popupWidget-anchor {
z-index: 4;
/*!
- * OOjs UI v0.15.2
+ * OOjs UI v0.15.3
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-02-02T22:07:06Z
+ * Date: 2016-02-09T21:21:21Z
*/
-@-webkit-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-moz-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
.oo-ui-popupTool .oo-ui-popupWidget-popup,
.oo-ui-popupTool .oo-ui-popupWidget-anchor {
z-index: 4;
/*!
- * OOjs UI v0.15.2
+ * OOjs UI v0.15.3
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-02-02T22:07:00Z
+ * Date: 2016-02-09T21:21:16Z
*/
( function ( OO ) {
* Handle captured mouse up and key up events.
*
* @protected
- * @param {Event} e Mouse up or key up event
+ * @param {MouseEvent|KeyboardEvent} e Mouse up or key up event
*/
OO.ui.ToolGroup.prototype.onCapturedMouseKeyUp = function ( e ) {
this.getElementDocument().removeEventListener( 'mouseup', this.onCapturedMouseKeyUpHandler, true );
* Handle mouse up and key up events.
*
* @protected
- * @param {jQuery.Event} e Mouse up or key up event
+ * @param {MouseEvent|KeyboardEvent} e Mouse up or key up event
*/
OO.ui.ToolGroup.prototype.onMouseKeyUp = function ( e ) {
var tool = this.getTargetTool( e );
) {
this.pressed.onSelect();
this.pressed = null;
- return false;
+ e.preventDefault();
+ e.stopPropagation();
}
this.pressed = null;
* The event is actually generated from a mouseup/keyup, so it is not a normal blur event object.
*
* @protected
- * @param {jQuery.Event} e Mouse up or key up event
+ * @param {MouseEvent|KeyboardEvent} e Mouse up or key up event
*/
OO.ui.PopupToolGroup.prototype.onBlur = function ( e ) {
// Only deactivate when clicking outside the dropdown element
/*!
- * OOjs UI v0.15.2
+ * OOjs UI v0.15.3
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-02-02T22:07:06Z
+ * Date: 2016-02-09T21:21:21Z
*/
-@-webkit-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-moz-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-ms-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-o-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
.oo-ui-draggableElement {
cursor: -webkit-grab -moz-grab, url(images/grab.cur), move;
}
.oo-ui-progressBarWidget.oo-ui-widget-disabled {
opacity: 0.6;
}
+@-webkit-keyframes oo-ui-progressBarWidget-slide {
+ from {
+ margin-left: -40%;
+ }
+ to {
+ margin-left: 100%;
+ }
+}
+@-moz-keyframes oo-ui-progressBarWidget-slide {
+ from {
+ margin-left: -40%;
+ }
+ to {
+ margin-left: 100%;
+ }
+}
+@keyframes oo-ui-progressBarWidget-slide {
+ from {
+ margin-left: -40%;
+ }
+ to {
+ margin-left: 100%;
+ }
+}
.oo-ui-selectFileWidget {
display: inline-block;
vertical-align: middle;
}
.oo-ui-selectFileWidget-dropTarget {
cursor: default;
+ height: 5.5em;
+ text-align: left;
+ padding: 0;
}
-.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled .oo-ui-selectFileWidget-dropTarget {
- cursor: pointer;
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-dropLabel,
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-selectButton {
+ display: none;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail {
+ height: 5.5em;
+ width: 5.5em;
+ position: absolute;
+ background-size: cover;
+ background-position: center center;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail.oo-ui-pendingElement-pending {
+ background-size: auto;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail > .oo-ui-selectFileWidget-noThumbnail-icon {
+ opacity: 0.4;
+ background-color: #cccccc;
+ height: 5.5em;
+ width: 5.5em;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
+ border: none;
+ background: none;
+ display: block;
+ height: 100%;
+ width: auto;
+ margin-left: 5.5em;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label {
+ position: relative;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileName {
+ display: block;
+ float: none;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileType {
+ display: block;
+ float: none;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton {
+ position: absolute;
+ right: 0.5em;
+}
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget {
+ text-align: center;
+}
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-dropLabel {
+ display: block;
+}
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail,
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
+ display: none;
+}
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-selectButton {
+ display: block;
+ margin: 0.7em;
+}
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget,
+.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget {
+ text-align: center;
+}
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info,
+.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
+ margin: 0;
}
.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-clearButton,
.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-clearButton {
.oo-ui-selectFileWidget-notsupported.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label {
right: 2em;
}
-.oo-ui-selectFileWidget-dropTarget {
- line-height: 3.5em;
- background-color: #ffffff;
- border: 1px dashed #aaaaaa;
- padding: 0.5em 1em;
- margin-bottom: 0.5em;
- text-align: center;
- vertical-align: middle;
-}
-.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled .oo-ui-selectFileWidget-dropTarget:hover,
-.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop oo-ui-selectfilewidget-droptarget {
+.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop .oo-ui-selectFileWidget-dropTarget {
background-color: #e1f3ff;
}
-.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-dropTarget,
+.oo-ui-selectFileWidget-empty.oo-ui-widget-disabled .oo-ui-selectFileWidget-dropTarget,
.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget {
color: #cccccc;
text-shadow: 0 1px 1px #ffffff;
border-color: #dddddd;
background-color: #f3f3f3;
}
+.oo-ui-selectFileWidget-dropTarget {
+ background-color: #ffffff;
+ border: 1px solid #aaaaaa;
+ margin-bottom: 0.5em;
+ vertical-align: middle;
+ border-radius: 0.25em;
+}
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget {
+ border-style: dashed;
+}
.oo-ui-outlineOptionWidget {
position: relative;
cursor: pointer;
color: #555555;
border-radius: 0.25em;
}
-.oo-ui-capsuleItemWidget > .oo-ui-iconElement-icon {
- cursor: pointer;
-}
-.oo-ui-capsuleItemWidget.oo-ui-widget-disabled > .oo-ui-iconElement-icon {
- cursor: default;
-}
.oo-ui-capsuleItemWidget.oo-ui-labelElement .oo-ui-labelElement-label {
- display: block;
+ display: inline-block;
text-overflow: ellipsis;
overflow: hidden;
}
+.oo-ui-capsuleItemWidget .oo-ui-buttonElement {
+ margin-top: -1.6em;
+ padding-left: 0.3em;
+}
+.oo-ui-capsuleItemWidget:focus {
+ outline: none;
+ border-color: #087ecc;
+}
.oo-ui-capsuleItemWidget.oo-ui-indicatorElement > .oo-ui-labelElement-label {
padding-right: 1.3375em;
}
/*!
- * OOjs UI v0.15.2
+ * OOjs UI v0.15.3
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-02-02T22:07:06Z
+ * Date: 2016-02-09T21:21:21Z
*/
-@-webkit-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-moz-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
.oo-ui-draggableElement {
cursor: -webkit-grab -moz-grab, url(images/grab.cur), move;
}
.oo-ui-progressBarWidget.oo-ui-widget-disabled {
opacity: 0.6;
}
+@-webkit-keyframes oo-ui-progressBarWidget-slide {
+ from {
+ margin-left: -40%;
+ }
+ to {
+ margin-left: 100%;
+ }
+}
+@-moz-keyframes oo-ui-progressBarWidget-slide {
+ from {
+ margin-left: -40%;
+ }
+ to {
+ margin-left: 100%;
+ }
+}
+@keyframes oo-ui-progressBarWidget-slide {
+ from {
+ margin-left: -40%;
+ }
+ to {
+ margin-left: 100%;
+ }
+}
.oo-ui-selectFileWidget {
display: inline-block;
vertical-align: middle;
}
.oo-ui-selectFileWidget-dropTarget {
cursor: default;
+ height: 5.5em;
+ text-align: left;
+ padding: 0;
}
-.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled .oo-ui-selectFileWidget-dropTarget {
- cursor: pointer;
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-dropLabel,
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-selectButton {
+ display: none;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail {
+ height: 5.5em;
+ width: 5.5em;
+ position: absolute;
+ background-size: cover;
+ background-position: center center;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail.oo-ui-pendingElement-pending {
+ background-size: auto;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail > .oo-ui-selectFileWidget-noThumbnail-icon {
+ opacity: 0.4;
+ background-color: #cccccc;
+ height: 5.5em;
+ width: 5.5em;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
+ border: none;
+ background: none;
+ display: block;
+ height: 100%;
+ width: auto;
+ margin-left: 5.5em;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label {
+ position: relative;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileName {
+ display: block;
+ float: none;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileType {
+ display: block;
+ float: none;
+}
+.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton {
+ position: absolute;
+ right: 0.5em;
+}
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget {
+ text-align: center;
+}
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-dropLabel {
+ display: block;
+}
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail,
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
+ display: none;
+}
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-selectButton {
+ display: block;
+ margin: 0.7em;
+}
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget,
+.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget {
+ text-align: center;
+}
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info,
+.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
+ margin: 0;
}
.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-clearButton,
.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-clearButton {
.oo-ui-selectFileWidget-notsupported.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label {
right: 2em;
}
-.oo-ui-selectFileWidget-dropTarget {
- line-height: 3.5em;
- background-color: #ffffff;
- border: 1px dashed #cccccc;
- padding: 0.5em 1em;
- margin-bottom: 0.5em;
- text-align: center;
- vertical-align: middle;
-}
-.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled .oo-ui-selectFileWidget-dropTarget:hover {
- background-color: #eeeeee;
-}
.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop .oo-ui-selectFileWidget-dropTarget {
background: rgba(52, 123, 255, 0.1);
}
-.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-dropTarget,
+.oo-ui-selectFileWidget-empty.oo-ui-widget-disabled .oo-ui-selectFileWidget-dropTarget,
.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget {
- color: #cccccc;
- text-shadow: 0 1px 1px #ffffff;
border-color: #dddddd;
background-color: #f3f3f3;
}
+.oo-ui-selectFileWidget-empty.oo-ui-widget-disabled .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info,
+.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info,
+.oo-ui-selectFileWidget-empty.oo-ui-widget-disabled .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-dropLabel,
+.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-dropLabel {
+ color: #cccccc;
+ text-shadow: 0 1px 1px #ffffff;
+}
+.oo-ui-selectFileWidget-dropTarget {
+ background-color: #ffffff;
+ border: 1px solid #cccccc;
+ margin-bottom: 0.5em;
+ vertical-align: middle;
+ overflow: hidden;
+ border-radius: 2px;
+}
+.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget {
+ background-color: #eeeeee;
+ border-style: dashed;
+}
.oo-ui-outlineOptionWidget {
position: relative;
cursor: pointer;
color: #555555;
border-radius: 2px;
}
-.oo-ui-capsuleItemWidget > .oo-ui-iconElement-icon {
- cursor: pointer;
-}
-.oo-ui-capsuleItemWidget.oo-ui-widget-disabled > .oo-ui-iconElement-icon {
- cursor: default;
-}
.oo-ui-capsuleItemWidget.oo-ui-labelElement .oo-ui-labelElement-label {
- display: block;
+ display: inline-block;
text-overflow: ellipsis;
overflow: hidden;
}
+.oo-ui-capsuleItemWidget .oo-ui-buttonElement {
+ margin-top: -1.6em;
+ padding-left: 0.3em;
+}
+.oo-ui-capsuleItemWidget:focus {
+ outline: none;
+ border-color: #347bff;
+}
.oo-ui-capsuleItemWidget.oo-ui-indicatorElement > .oo-ui-labelElement-label {
padding-right: 1.3375em;
}
/*!
- * OOjs UI v0.15.2
+ * OOjs UI v0.15.3
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-02-02T22:07:00Z
+ * Date: 2016-02-09T21:21:16Z
*/
( function ( OO ) {
* @class
* @extends OO.ui.Widget
* @mixins OO.ui.mixin.ItemWidget
- * @mixins OO.ui.mixin.IndicatorElement
* @mixins OO.ui.mixin.LabelElement
* @mixins OO.ui.mixin.FlaggedElement
* @mixins OO.ui.mixin.TabIndexedElement
// Parent constructor
OO.ui.CapsuleItemWidget.parent.call( this, config );
- // Properties (must be set before mixin constructor calls)
- this.$indicator = $( '<span>' );
-
// Mixin constructors
OO.ui.mixin.ItemWidget.call( this );
- OO.ui.mixin.IndicatorElement.call( this, $.extend( {}, config, { $indicator: this.$indicator, indicator: 'clear' } ) );
OO.ui.mixin.LabelElement.call( this, config );
OO.ui.mixin.FlaggedElement.call( this, config );
- OO.ui.mixin.TabIndexedElement.call( this, $.extend( {}, config, { $tabIndexed: this.$indicator } ) );
+ OO.ui.mixin.TabIndexedElement.call( this, config );
// Events
- this.$indicator.on( {
- keydown: this.onCloseKeyDown.bind( this ),
- click: this.onCloseClick.bind( this )
- } );
+ this.closeButton = new OO.ui.ButtonWidget( {
+ framed: false,
+ indicator: 'clear',
+ tabIndex: -1
+ } ).on( 'click', this.onCloseClick.bind( this ) );
+
+ this.on( 'disable', function ( disabled ) {
+ this.closeButton.setDisabled( disabled );
+ }.bind( this ) );
// Initialization
this.$element
+ .on( {
+ click: this.onClick.bind( this ),
+ keydown: this.onKeyDown.bind( this )
+ } )
.addClass( 'oo-ui-capsuleItemWidget' )
- .append( this.$indicator, this.$label );
+ .append( this.$label, this.closeButton.$element );
};
/* Setup */
OO.inheritClass( OO.ui.CapsuleItemWidget, OO.ui.Widget );
OO.mixinClass( OO.ui.CapsuleItemWidget, OO.ui.mixin.ItemWidget );
-OO.mixinClass( OO.ui.CapsuleItemWidget, OO.ui.mixin.IndicatorElement );
OO.mixinClass( OO.ui.CapsuleItemWidget, OO.ui.mixin.LabelElement );
OO.mixinClass( OO.ui.CapsuleItemWidget, OO.ui.mixin.FlaggedElement );
OO.mixinClass( OO.ui.CapsuleItemWidget, OO.ui.mixin.TabIndexedElement );
/**
* Handle close icon clicks
- * @param {jQuery.Event} event
*/
OO.ui.CapsuleItemWidget.prototype.onCloseClick = function () {
var element = this.getElementGroup();
- if ( !this.isDisabled() && element && $.isFunction( element.removeItems ) ) {
+ if ( element && $.isFunction( element.removeItems ) ) {
element.removeItems( [ this ] );
element.focus();
}
};
/**
- * Handle close keyboard events
- * @param {jQuery.Event} event Key down event
+ * Handle click event for the entire capsule
*/
-OO.ui.CapsuleItemWidget.prototype.onCloseKeyDown = function ( e ) {
- if ( !this.isDisabled() && $.isFunction( this.getElementGroup().removeItems ) ) {
- switch ( e.which ) {
- case OO.ui.Keys.ENTER:
- case OO.ui.Keys.BACKSPACE:
- case OO.ui.Keys.SPACE:
- this.getElementGroup().removeItems( [ this ] );
- return false;
- }
+OO.ui.CapsuleItemWidget.prototype.onClick = function () {
+ var element = this.getElementGroup();
+
+ if ( !this.isDisabled() && element && $.isFunction( element.editItem ) ) {
+ element.editItem( this );
}
};
+/**
+ * Handle keyDown event for the entire capsule
+ */
+OO.ui.CapsuleItemWidget.prototype.onKeyDown = function ( e ) {
+ var element = this.getElementGroup();
+
+ if ( e.keyCode === OO.ui.Keys.BACKSPACE || e.keyCode === OO.ui.Keys.DELETE ) {
+ element.removeItems( [ this ] );
+ element.focus();
+ return false;
+ } else if ( e.keyCode === OO.ui.Keys.ENTER ) {
+ element.editItem( this );
+ return false;
+ } else if ( e.keyCode === OO.ui.Keys.LEFT ) {
+ element.getPreviousItem( this ).focus();
+ } else if ( e.keyCode === OO.ui.Keys.RIGHT ) {
+ element.getNextItem( this ).focus();
+ }
+};
+
+/**
+ * Focuses the capsule
+ */
+OO.ui.CapsuleItemWidget.prototype.focus = function () {
+ this.$element.focus();
+};
+
/**
* CapsuleMultiSelectWidgets are something like a {@link OO.ui.ComboBoxInputWidget combo box widget}
* that allows for selecting multiple values.
* @extends OO.ui.Widget
* @mixins OO.ui.mixin.TabIndexedElement
* @mixins OO.ui.mixin.GroupElement
+ * @uses OO.ui.CapsuleItemWidget
+ * @uses OO.ui.FloatingMenuSelectWidget
*
* @constructor
* @param {Object} [config] Configuration options
* @cfg {boolean} [allowArbitrary=false] Allow data items to be added even if not present in the menu.
- * @cfg {Object} [menu] Configuration options to pass to the {@link OO.ui.MenuSelectWidget menu select widget}.
+ * @cfg {Object} [menu] (required) Configuration options to pass to the
+ * {@link OO.ui.MenuSelectWidget menu select widget}.
* @cfg {Object} [popup] Configuration options to pass to the {@link OO.ui.PopupWidget popup widget}.
* If specified, this popup will be shown instead of the menu (but the menu
* will still be used for item labels and allowArbitrary=false). The widgets
- * in the popup should use this.addItemsFromData() or this.addItems() as necessary.
- * @cfg {jQuery} [$overlay] Render the menu or popup into a separate layer.
+ * in the popup should use {@link #addItemsFromData} or {@link #addItems} as necessary.
+ * @cfg {jQuery} [$overlay=this.$element] Render the menu or popup into a separate layer.
* This configuration is useful in cases where the expanded menu is larger than
* its containing `<div>`. The specified overlay layer is usually on top of
* the containing `<div>` and has a larger area. By default, the menu uses
OO.ui.CapsuleMultiSelectWidget = function OoUiCapsuleMultiSelectWidget( config ) {
var $tabFocus;
- // Configuration initialization
- config = config || {};
-
// Parent constructor
OO.ui.CapsuleMultiSelectWidget.parent.call( this, config );
+ // Configuration initialization
+ config = $.extend( {
+ allowArbitrary: false,
+ $overlay: this.$element
+ }, config );
+
// Properties (must be set before mixin constructor calls)
this.$input = config.popup ? null : $( '<input>' );
this.$handle = $( '<div>' );
// Properties
this.$content = $( '<div>' );
- this.allowArbitrary = !!config.allowArbitrary;
- this.$overlay = config.$overlay || this.$element;
+ this.allowArbitrary = config.allowArbitrary;
+ this.$overlay = config.$overlay;
this.menu = new OO.ui.FloatingMenuSelectWidget( $.extend(
{
widget: this,
return this;
};
+/**
+ * Add items to the capsule by providing a label
+ * @param {string} label
+ * @return {boolean} Whether the item was added or not
+ */
+OO.ui.CapsuleMultiSelectWidget.prototype.addItemFromLabel = function ( label ) {
+ var item = this.menu.getItemFromLabel( label, true );
+ if ( item ) {
+ this.addItemsFromData( [ item.data ] );
+ return true;
+ } else if ( this.allowArbitrary && this.$input.val().trim() !== '' ) {
+ this.addItemsFromData( [ label ] );
+ return true;
+ }
+ return false;
+};
+
/**
* Remove items by data
* @chainable
return this;
};
+/**
+ * Removes the item from the list and copies its label to `this.$input`.
+ *
+ * @param {Object} item
+ */
+OO.ui.CapsuleMultiSelectWidget.prototype.editItem = function ( item ) {
+ this.$input.val( item.label );
+ this.updateInputSize();
+ this.focus();
+ this.removeItems( [ item ] );
+};
+
/**
* @inheritdoc
*/
return this;
};
+/**
+ * Given an item, returns the item after it. If its the last item,
+ * returns `this.$input`. If no item is passed, returns the very first
+ * item.
+ *
+ * @param {OO.ui.CapsuleItemWidget} [item]
+ * @return {OO.ui.CapsuleItemWidget|jQuery|boolean}
+ */
+OO.ui.CapsuleMultiSelectWidget.prototype.getNextItem = function ( item ) {
+ var itemIndex;
+
+ if ( item === undefined ) {
+ return this.items[ 0 ];
+ }
+
+ itemIndex = this.items.indexOf( item );
+ if ( itemIndex < 0 ) { // Item not in list
+ return false;
+ } else if ( itemIndex === this.items.length - 1 ) { // Last item
+ return this.$input;
+ } else {
+ return this.items[ itemIndex + 1 ];
+ }
+};
+
+/**
+ * Given an item, returns the item before it. If its the first item,
+ * returns `this.$input`. If no item is passed, returns the very last
+ * item.
+ *
+ * @param {OO.ui.CapsuleItemWidget} [item]
+ * @return {OO.ui.CapsuleItemWidget|jQuery|boolean}
+ */
+OO.ui.CapsuleMultiSelectWidget.prototype.getPreviousItem = function ( item ) {
+ var itemIndex;
+
+ if ( item === undefined ) {
+ return this.items[ this.items.length - 1 ];
+ }
+
+ itemIndex = this.items.indexOf( item );
+ if ( itemIndex < 0 ) { // Item not in list
+ return false;
+ } else if ( itemIndex === 0 ) { // First item
+ return this.$input;
+ } else {
+ return this.items[ itemIndex - 1 ];
+ }
+};
+
/**
* Get the capsule widget's menu.
* @return {OO.ui.MenuSelectWidget} Menu widget
* @param {jQuery.Event} event
*/
OO.ui.CapsuleMultiSelectWidget.prototype.onInputBlur = function () {
- if ( this.allowArbitrary && this.$input.val().trim() !== '' ) {
- this.addItemsFromData( [ this.$input.val() ] );
- }
+ this.addItemFromLabel( this.$input.val() );
this.clearInput();
};
* Handles popup focus out events.
*
* @private
- * @param {Event} e Focus out event
+ * @param {jQuery.Event} e Focus out event
*/
OO.ui.CapsuleMultiSelectWidget.prototype.onPopupFocusOut = function () {
var widget = this.popup;
* @param {jQuery.Event} e Key press event
*/
OO.ui.CapsuleMultiSelectWidget.prototype.onKeyPress = function ( e ) {
- var item;
-
if ( !this.isDisabled() ) {
if ( e.which === OO.ui.Keys.ESCAPE ) {
this.clearInput();
if ( !this.popup ) {
this.menu.toggle( true );
if ( e.which === OO.ui.Keys.ENTER ) {
- item = this.menu.getItemFromLabel( this.$input.val(), true );
- if ( item ) {
- this.addItemsFromData( [ item.data ] );
- this.clearInput();
- } else if ( this.allowArbitrary && this.$input.val().trim() !== '' ) {
- this.addItemsFromData( [ this.$input.val() ] );
+ if ( this.addItemFromLabel( this.$input.val() ) ) {
this.clearInput();
}
return false;
* @param {jQuery.Event} e Key down event
*/
OO.ui.CapsuleMultiSelectWidget.prototype.onKeyDown = function ( e ) {
- if ( !this.isDisabled() ) {
+ if (
+ !this.isDisabled() &&
+ this.$input.val() === '' &&
+ this.items.length
+ ) {
// 'keypress' event is not triggered for Backspace
- if ( e.keyCode === OO.ui.Keys.BACKSPACE && this.$input.val() === '' ) {
- if ( this.items.length ) {
+ if ( e.keyCode === OO.ui.Keys.BACKSPACE ) {
+ if ( e.metaKey || e.ctrlKey ) {
this.removeItems( this.items.slice( -1 ) );
+ } else {
+ this.editItem( this.items[ this.items.length - 1 ] );
}
return false;
+ } else if ( e.keyCode === OO.ui.Keys.LEFT ) {
+ this.getPreviousItem().focus();
+ } else if ( e.keyCode === OO.ui.Keys.RIGHT ) {
+ this.getNextItem().focus();
}
}
};
* @cfg {boolean} [droppable=true] Whether to accept files by drag and drop.
* @cfg {boolean} [showDropTarget=false] Whether to show a drop target. Requires droppable to be true.
* @cfg {boolean} [dragDropUI=false] Deprecated alias for showDropTarget
+ * @cfg {Number} [thumbnailSizeLimit=20] File size limit in MiB above which to not try and show a
+ * preview (for performance)
*/
OO.ui.SelectFileWidget = function OoUiSelectFileWidget( config ) {
var dragHandler;
placeholder: OO.ui.msg( 'ooui-selectfile-placeholder' ),
notsupported: OO.ui.msg( 'ooui-selectfile-not-supported' ),
droppable: true,
- showDropTarget: false
+ showDropTarget: false,
+ thumbnailSizeLimit: 20
}, config );
// Parent constructor
// Properties
this.$info = $( '<span>' );
-
- // Properties
this.showDropTarget = config.showDropTarget;
+ this.thumbnailSizeLimit = config.thumbnailSizeLimit;
this.isSupported = this.constructor.static.isSupported();
this.currentFile = null;
if ( Array.isArray( config.accept ) ) {
this.clearButton = new OO.ui.ButtonWidget( {
classes: [ 'oo-ui-selectFileWidget-clearButton' ],
framed: false,
- icon: 'remove',
+ icon: 'close',
disabled: this.disabled
} );
// Initialization
this.addInput();
- this.updateUI();
this.$label.addClass( 'oo-ui-selectFileWidget-label' );
this.$info
.addClass( 'oo-ui-selectFileWidget-info' )
.append( this.$icon, this.$label, this.clearButton.$element, this.$indicator );
- this.$element
- .addClass( 'oo-ui-selectFileWidget' )
- .append( this.$info, this.selectButton.$element );
+
if ( config.droppable && config.showDropTarget ) {
+ this.selectButton.setIcon( 'upload' );
+ this.$thumbnail = $( '<div>' ).addClass( 'oo-ui-selectFileWidget-thumbnail' );
+ this.setPendingElement( this.$thumbnail );
this.$dropTarget = $( '<div>' )
.addClass( 'oo-ui-selectFileWidget-dropTarget' )
- .text( OO.ui.msg( 'ooui-selectfile-dragdrop-placeholder' ) )
.on( {
click: this.onDropTargetClick.bind( this )
- } );
- this.$element.prepend( this.$dropTarget );
+ } )
+ .append(
+ this.$thumbnail,
+ this.$info,
+ this.selectButton.$element,
+ $( '<span>' )
+ .addClass( 'oo-ui-selectFileWidget-dropLabel' )
+ .text( OO.ui.msg( 'ooui-selectfile-dragdrop-placeholder' ) )
+ );
+ this.$element.append( this.$dropTarget );
+ } else {
+ this.$element
+ .addClass( 'oo-ui-selectFileWidget' )
+ .append( this.$info, this.selectButton.$element );
}
+ this.updateUI();
};
/* Setup */
);
}
this.setLabel( $label );
+
+ if ( this.showDropTarget ) {
+ this.pushPending();
+ this.loadAndGetImageUrl().done( function ( url ) {
+ this.$thumbnail.css( 'background-image', 'url( ' + url + ' )' );
+ }.bind( this ) ).fail( function () {
+ this.$thumbnail.append(
+ new OO.ui.IconWidget( {
+ icon: 'attachment',
+ classes: [ 'oo-ui-selectFileWidget-noThumbnail-icon' ]
+ } ).$element
+ );
+ }.bind( this ) ).always( function () {
+ this.popPending();
+ }.bind( this ) );
+ this.$dropTarget.off( 'click' );
+ }
} else {
+ if ( this.showDropTarget ) {
+ this.$dropTarget.off( 'click' );
+ this.$dropTarget.on( {
+ click: this.onDropTargetClick.bind( this )
+ } );
+ this.$thumbnail
+ .empty()
+ .css( 'background-image', '' );
+ }
this.$element.addClass( 'oo-ui-selectFileWidget-empty' );
this.setLabel( this.placeholder );
}
}
};
+/**
+ * If the selected file is an image, get its URL and load it.
+ *
+ * @return {jQuery.Promise} Promise resolves with the image URL after it has loaded
+ */
+OO.ui.SelectFileWidget.prototype.loadAndGetImageUrl = function () {
+ var deferred = $.Deferred(),
+ file = this.currentFile,
+ reader = new FileReader();
+
+ if (
+ file &&
+ ( OO.getProp( file, 'type' ) || '' ).indexOf( 'image/' ) === 0 &&
+ file.size < this.thumbnailSizeLimit * 1024 * 1024
+ ) {
+ reader.onload = function ( event ) {
+ var img = document.createElement( 'img' );
+ img.addEventListener( 'load', function () {
+ if (
+ img.naturalWidth === 0 ||
+ img.naturalHeight === 0 ||
+ img.complete === false
+ ) {
+ deferred.reject();
+ } else {
+ deferred.resolve( event.target.result );
+ }
+ } );
+ img.src = event.target.result;
+ };
+ reader.readAsDataURL( file );
+ } else {
+ deferred.reject();
+ }
+
+ return deferred.promise();
+};
+
/**
* Add the input to the widget
*
this.$input = $( '<input type="file">' );
this.$input.on( 'change', this.onFileSelectedHandler );
+ this.$input.on( 'click', function ( e ) {
+ // Prevents dropTarget to get clicked which calls
+ // a click on this input
+ e.stopPropagation();
+ } );
this.$input.attr( {
tabindex: -1
} );
/*!
- * OOjs UI v0.15.2
+ * OOjs UI v0.15.3
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-02-02T22:07:06Z
+ * Date: 2016-02-09T21:21:21Z
*/
-@-webkit-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-moz-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-ms-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-o-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
.oo-ui-actionWidget.oo-ui-pendingElement-pending {
background-image: /* @embed */ url(themes/apex/images/textures/pending.gif);
}
/*!
- * OOjs UI v0.15.2
+ * OOjs UI v0.15.3
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-02-02T22:07:06Z
+ * Date: 2016-02-09T21:21:21Z
*/
-@-webkit-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@-moz-keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
-@keyframes oo-ui-progressBarWidget-slide {
- from {
- margin-left: -40%;
- }
- to {
- margin-left: 100%;
- }
-}
.oo-ui-window {
background: transparent;
}
/*!
- * OOjs UI v0.15.2
+ * OOjs UI v0.15.3
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-02-02T22:07:00Z
+ * Date: 2016-02-09T21:21:16Z
*/
( function ( OO ) {
"articleRedirect": { "file": {
"ltr": "images/icons/articleRedirect-ltr.svg",
"rtl": "images/icons/articleRedirect-rtl.svg"
+ } },
+ "upload": { "file": {
+ "ltr": "images/icons/upload-ltr.svg",
+ "rtl": "images/icons/upload-rtl.svg"
} }
}
}
"alignCentre": { "file": "images/icons/align-center.svg" },
"alignLeft": { "file": "images/icons/align-float-left.svg" },
"alignRight": { "file": "images/icons/align-float-right.svg" },
+ "attachment": { "file": {
+ "ltr": "images/icons/attachment-ltr.svg",
+ "rtl": "images/icons/attachment-rtl.svg"
+ } },
"calendar": { "file": {
"ltr": "images/icons/calendar-ltr.svg",
"rtl": "images/icons/calendar-rtl.svg"
--- /dev/null
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-293 385 24 24">
+ <path d="M-274.3 390.9c-1.6-1.6-4.3-1.5-5.8.1l.2.2c.5.5 1.3.7 2.1.4.8-.3 1.7-.1 2.4.6 1 .9.9 2.4 0 3.4l-7.1 7.1c-.9 1-2.4.9-3.4 0s-.9-2.4 0-3.4l4.4-4.4c.3-.3.9-.5 1.3-.1s.2 1-.1 1.3l-3.4 3.4c-.6.6-.6 1.7.1 2.3l4.3-4.3c.8-.8 1.1-1.8.9-2.7-.2-.9-.9-1.6-1.7-1.9-.9-.2-1.9 0-2.6.7l-4.4 4.4c-1.6 1.6-1.6 4.3.1 5.8 1.5 1.6 4.3 1.5 5.8-.1l7-7c.8-.8 1.2-1.9 1.2-3s-.5-2.1-1.3-2.8c-.7-.7.8.7 0 0-.7-.7.8.7 0 0-.7-.7.8.7 0 0-.7-.7.8.7 0 0-.7-.7.8.7 0 0-.7-.7.8.7 0 0-1.5-1.6.8.7 0 0z"/>
+</svg>
--- /dev/null
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-119 70 24 24">
+ <path d="M-113.3 75.6c-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7-1.3 1.7-1.3 2.8 0 1.1.4 2.2 1.2 3l7 7c1.5 1.6 4.3 1.7 5.8.1 1.7-1.5 1.7-4.2.1-5.8l-4.4-4.4c-.7-.7-1.7-.9-2.6-.7-.8.3-1.5 1-1.7 1.9-.2.9.1 1.9.9 2.7l4.3 4.3c.7-.6.7-1.7.1-2.3l-3.4-3.4c-.3-.3-.5-.9-.1-1.3s1-.2 1.3.1l4.4 4.4c.9 1 1 2.5 0 3.4s-2.5 1-3.4 0l-7.1-7.1c-.9-1-1-2.5 0-3.4.7-.7 1.6-.9 2.4-.6.8.3 1.6.1 2.1-.4l.2-.2c-1.5-1.6-4.2-1.8-5.8-.1-.8.7 1.5-1.7 0 0z"/>
+</svg>
<?xml version="1.0" encoding="utf-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
- <g id="translation">
- <path id="english" d="M14.34 9l-3.53 10h2.064l.72-2.406h3.624l.72 2.406H20L16.465 9h-2.12zm1.065 1.53L16.75 15h-2.69z"/>
- <path id="chinese" d="M8.97 4.22c-.43.29-.88.616-1.25.874l.186.312c.14.194.275.393.407.594H4.47v1.47h1.593c.43 1.41 1.11 2.624 2.03 3.624-1.008.664-2.192 1.248-3.624 1.75L4 13c.317.487.714.976 1.03 1.375l.25-.094c1.593-.59 2.91-1.263 4.032-2.06.818.63 1.71 1.16 2.657 1.595l.56-1.624a13.21 13.21 0 0 1-1.908-1.063c.284-.28.59-.634.906-1.156.46-.716.776-1.57 1-2.5h1.657V6h-4.063c-.283-.552-.596-1.083-.97-1.53l-.186-.25zM7.72 7.47h3.186c-.32 1.075-.83 1.937-1.53 2.624-.713-.705-1.26-1.568-1.657-2.625zm6.31 5.31l-.467 1.658c.292-.514.577-1.075.812-1.532l-.344-.125z"/>
+ <g id="A">
+ <path d="M18.738 15.673l1.137 3.15h1.575L17.775 7.448h-2.188l-3.85 11.375h1.575l1.05-3.15h4.375zM16.55 8.76l1.837 5.427h-3.675l1.838-5.425z"/>
+ </g>
+ <g id="文">
+ <path d="M8.325 6.573h.787l-.875-1.75h-1.75l.438.875a1.56 1.56 0 0 0 1.4.875z"/>
+ <path d="m 9.202,12.874 c 0.7,0.525 1.486,0.963 2.45,1.225 l -0.438,1.31 A 9.17,9.17 0 0 1 8.151,13.835 c -1.49,1.137 -3.063,1.837 -4.813,2.363 L 2.9,14.885 C 4.386,14.36 5.874,13.835 7.1,12.872 5.962,11.648 5.174,10.335 4.65,8.758 l -1.663,0 0,-1.31 10.85,0 -0.438,1.312 -1.75,0 c -0.308,1.33 -1.255,2.957 -2.45,4.114 z m 1.05,-4.114 -4.114,0 c 0.35,1.226 1.138,2.363 2.013,3.238 0.926,-1 1.617,-1.957 2.1,-3.237 z"/>
</g>
</svg>
<?xml version="1.0" encoding="utf-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
- <g id="translation">
- <path id="english" d="M7.53 9L4 19h2.063l.72-2.406h3.624l.72 2.406h2.062L9.65 9H7.53zm1.064 1.53L9.938 15H7.25z"/>
- <path id="chinese" d="M14.594 4.22c-.43.29-.88.616-1.25.874l.187.312c.14.194.28.393.41.594h-3.843v1.47h1.594c.43 1.41 1.11 2.624 2.03 3.624-.662.437-1.413.82-2.25 1.187l.563 1.567a15.882 15.882 0 0 0 2.908-1.625 13.82 13.82 0 0 0 3.97 2.125l.28.094c.293-.514.578-1.075.813-1.532l-.375-.125c-1.38-.49-2.49-1.05-3.375-1.654.284-.28.59-.635.906-1.157.46-.717.775-1.572 1-2.5h1.656V6H15.75c-.283-.552-.596-1.083-.97-1.53l-.186-.25zm-1.25 3.25h3.187c-.315 1.075-.825 1.937-1.53 2.624-.71-.705-1.26-1.568-1.653-2.625zM9.97 12.874L9.624 13c.196.3.406.594.625.875l-.28-1z"/>
+ <g id="A">
+ <path d="M5.612 15.673l-1.137 3.15H2.9L6.575 7.448h2.188l3.85 11.375h-1.575l-1.05-3.15H5.613zM7.8 8.76l-1.837 5.427h3.675L7.8 8.762z" id="path5"/>
+ </g>
+ <g id="文">
+ <path d="M16.384 6.573h.787l-.873-1.75h-1.75l.438.875c.26.535.805.874 1.4.875z" id="path7"/>
+ <path d="M15.15 12.874c-.7.525-1.486.963-2.45 1.225l.438 1.31a9.17 9.17 0 0 0 3.063-1.575c1.49 1.137 3.064 1.837 4.814 2.363l.438-1.313c-1.486-.525-2.974-1.05-4.2-2.013 1.138-1.224 1.926-2.537 2.45-4.114h1.663v-1.31h-10.85l.438 1.312h1.75c.308 1.33 1.255 2.957 2.45 4.114zM14.1 8.76h4.114c-.35 1.226-1.138 2.363-2.013 3.238-.925-1-1.616-1.957-2.1-3.237z" id="path11-7"/>
</g>
</svg>
--- /dev/null
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+ <path d="M10 13c0 1.7 1.3 3 3 3V9h3l-4.5-5L7 9h3v4zm7 0v5H7c-.6 0-1-.4-1-1v-4H4v4c0 1.9 1.3 3 3 3h12v-7h-2z"/>
+</svg>
--- /dev/null
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+ <path d="M13 13c0 1.7-1.3 3-3 3V9H7l4.5-5L16 9h-3v4zm-7 0v5h10c.6 0 1-.4 1-1v-4h2v4c0 1.9-1.3 3-3 3H4v-7h2z"/>
+</svg>
"alignCentre": { "file": "images/icons/align-center.svg" },
"alignLeft": { "file": "images/icons/align-float-left.svg" },
"alignRight": { "file": "images/icons/align-float-right.svg" },
+ "attachment": { "file": {
+ "ltr": "images/icons/attachment-ltr.svg",
+ "rtl": "images/icons/attachment-rtl.svg"
+ } },
"calendar": { "file": {
"ltr": "images/icons/calendar-ltr.svg",
"rtl": "images/icons/calendar-rtl.svg"
--- /dev/null
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-293 385 24 24"><style>* { fill: #ffffff }</style>
+ <path d="M-274.3 390.9c-1.6-1.6-4.3-1.5-5.8.1l.2.2c.5.5 1.3.7 2.1.4.8-.3 1.7-.1 2.4.6 1 .9.9 2.4 0 3.4l-7.1 7.1c-.9 1-2.4.9-3.4 0s-.9-2.4 0-3.4l4.4-4.4c.3-.3.9-.5 1.3-.1s.2 1-.1 1.3l-3.4 3.4c-.6.6-.6 1.7.1 2.3l4.3-4.3c.8-.8 1.1-1.8.9-2.7-.2-.9-.9-1.6-1.7-1.9-.9-.2-1.9 0-2.6.7l-4.4 4.4c-1.6 1.6-1.6 4.3.1 5.8 1.5 1.6 4.3 1.5 5.8-.1l7-7c.8-.8 1.2-1.9 1.2-3s-.5-2.1-1.3-2.8c-.7-.7.8.7 0 0-.7-.7.8.7 0 0-.7-.7.8.7 0 0-.7-.7.8.7 0 0-.7-.7.8.7 0 0-.7-.7.8.7 0 0-1.5-1.6.8.7 0 0z"/>
+</svg>
--- /dev/null
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-293 385 24 24">
+ <path d="M-274.3 390.9c-1.6-1.6-4.3-1.5-5.8.1l.2.2c.5.5 1.3.7 2.1.4.8-.3 1.7-.1 2.4.6 1 .9.9 2.4 0 3.4l-7.1 7.1c-.9 1-2.4.9-3.4 0s-.9-2.4 0-3.4l4.4-4.4c.3-.3.9-.5 1.3-.1s.2 1-.1 1.3l-3.4 3.4c-.6.6-.6 1.7.1 2.3l4.3-4.3c.8-.8 1.1-1.8.9-2.7-.2-.9-.9-1.6-1.7-1.9-.9-.2-1.9 0-2.6.7l-4.4 4.4c-1.6 1.6-1.6 4.3.1 5.8 1.5 1.6 4.3 1.5 5.8-.1l7-7c.8-.8 1.2-1.9 1.2-3s-.5-2.1-1.3-2.8c-.7-.7.8.7 0 0-.7-.7.8.7 0 0-.7-.7.8.7 0 0-.7-.7.8.7 0 0-.7-.7.8.7 0 0-.7-.7.8.7 0 0-1.5-1.6.8.7 0 0z"/>
+</svg>
--- /dev/null
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-119 70 24 24"><style>* { fill: #ffffff }</style>
+ <path d="M-113.3 75.6c-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7-1.3 1.7-1.3 2.8 0 1.1.4 2.2 1.2 3l7 7c1.5 1.6 4.3 1.7 5.8.1 1.7-1.5 1.7-4.2.1-5.8l-4.4-4.4c-.7-.7-1.7-.9-2.6-.7-.8.3-1.5 1-1.7 1.9-.2.9.1 1.9.9 2.7l4.3 4.3c.7-.6.7-1.7.1-2.3l-3.4-3.4c-.3-.3-.5-.9-.1-1.3s1-.2 1.3.1l4.4 4.4c.9 1 1 2.5 0 3.4s-2.5 1-3.4 0l-7.1-7.1c-.9-1-1-2.5 0-3.4.7-.7 1.6-.9 2.4-.6.8.3 1.6.1 2.1-.4l.2-.2c-1.5-1.6-4.2-1.8-5.8-.1-.8.7 1.5-1.7 0 0z"/>
+</svg>
--- /dev/null
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-119 70 24 24">
+ <path d="M-113.3 75.6c-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7.7-.7 0 0-.8.7-1.3 1.7-1.3 2.8 0 1.1.4 2.2 1.2 3l7 7c1.5 1.6 4.3 1.7 5.8.1 1.7-1.5 1.7-4.2.1-5.8l-4.4-4.4c-.7-.7-1.7-.9-2.6-.7-.8.3-1.5 1-1.7 1.9-.2.9.1 1.9.9 2.7l4.3 4.3c.7-.6.7-1.7.1-2.3l-3.4-3.4c-.3-.3-.5-.9-.1-1.3s1-.2 1.3.1l4.4 4.4c.9 1 1 2.5 0 3.4s-2.5 1-3.4 0l-7.1-7.1c-.9-1-1-2.5 0-3.4.7-.7 1.6-.9 2.4-.6.8.3 1.6.1 2.1-.4l.2-.2c-1.5-1.6-4.2-1.8-5.8-.1-.8.7 1.5-1.7 0 0z"/>
+</svg>
<?xml version="1.0" encoding="utf-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><style>* { fill: #ffffff }</style>
- <g id="translation">
- <path id="english" d="M14.34 9l-3.53 10h2.064l.72-2.406h3.624l.72 2.406H20L16.465 9h-2.12zm1.065 1.53L16.75 15h-2.69z"/>
- <path id="chinese" d="M8.97 4.22c-.43.29-.88.616-1.25.874l.186.312c.14.194.275.393.407.594H4.47v1.47h1.593c.43 1.41 1.11 2.624 2.03 3.624-1.008.664-2.192 1.248-3.624 1.75L4 13c.317.487.714.976 1.03 1.375l.25-.094c1.593-.59 2.91-1.263 4.032-2.06.818.63 1.71 1.16 2.657 1.595l.56-1.624a13.21 13.21 0 0 1-1.908-1.063c.284-.28.59-.634.906-1.156.46-.716.776-1.57 1-2.5h1.657V6h-4.063c-.283-.552-.596-1.083-.97-1.53l-.186-.25zM7.72 7.47h3.186c-.32 1.075-.83 1.937-1.53 2.624-.713-.705-1.26-1.568-1.657-2.625zm6.31 5.31l-.467 1.658c.292-.514.577-1.075.812-1.532l-.344-.125z"/>
+ <g id="A">
+ <path d="M18.738 15.673l1.137 3.15h1.575L17.775 7.448h-2.188l-3.85 11.375h1.575l1.05-3.15h4.375zM16.55 8.76l1.837 5.427h-3.675l1.838-5.425z"/>
+ </g>
+ <g id="文">
+ <path d="M8.325 6.573h.787l-.875-1.75h-1.75l.438.875a1.56 1.56 0 0 0 1.4.875z"/>
+ <path d="m 9.202,12.874 c 0.7,0.525 1.486,0.963 2.45,1.225 l -0.438,1.31 A 9.17,9.17 0 0 1 8.151,13.835 c -1.49,1.137 -3.063,1.837 -4.813,2.363 L 2.9,14.885 C 4.386,14.36 5.874,13.835 7.1,12.872 5.962,11.648 5.174,10.335 4.65,8.758 l -1.663,0 0,-1.31 10.85,0 -0.438,1.312 -1.75,0 c -0.308,1.33 -1.255,2.957 -2.45,4.114 z m 1.05,-4.114 -4.114,0 c 0.35,1.226 1.138,2.363 2.013,3.238 0.926,-1 1.617,-1.957 2.1,-3.237 z"/>
</g>
</svg>
<?xml version="1.0" encoding="utf-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
- <g id="translation">
- <path id="english" d="M14.34 9l-3.53 10h2.064l.72-2.406h3.624l.72 2.406H20L16.465 9h-2.12zm1.065 1.53L16.75 15h-2.69z"/>
- <path id="chinese" d="M8.97 4.22c-.43.29-.88.616-1.25.874l.186.312c.14.194.275.393.407.594H4.47v1.47h1.593c.43 1.41 1.11 2.624 2.03 3.624-1.008.664-2.192 1.248-3.624 1.75L4 13c.317.487.714.976 1.03 1.375l.25-.094c1.593-.59 2.91-1.263 4.032-2.06.818.63 1.71 1.16 2.657 1.595l.56-1.624a13.21 13.21 0 0 1-1.908-1.063c.284-.28.59-.634.906-1.156.46-.716.776-1.57 1-2.5h1.657V6h-4.063c-.283-.552-.596-1.083-.97-1.53l-.186-.25zM7.72 7.47h3.186c-.32 1.075-.83 1.937-1.53 2.624-.713-.705-1.26-1.568-1.657-2.625zm6.31 5.31l-.467 1.658c.292-.514.577-1.075.812-1.532l-.344-.125z"/>
+ <g id="A">
+ <path d="M18.738 15.673l1.137 3.15h1.575L17.775 7.448h-2.188l-3.85 11.375h1.575l1.05-3.15h4.375zM16.55 8.76l1.837 5.427h-3.675l1.838-5.425z"/>
+ </g>
+ <g id="文">
+ <path d="M8.325 6.573h.787l-.875-1.75h-1.75l.438.875a1.56 1.56 0 0 0 1.4.875z"/>
+ <path d="m 9.202,12.874 c 0.7,0.525 1.486,0.963 2.45,1.225 l -0.438,1.31 A 9.17,9.17 0 0 1 8.151,13.835 c -1.49,1.137 -3.063,1.837 -4.813,2.363 L 2.9,14.885 C 4.386,14.36 5.874,13.835 7.1,12.872 5.962,11.648 5.174,10.335 4.65,8.758 l -1.663,0 0,-1.31 10.85,0 -0.438,1.312 -1.75,0 c -0.308,1.33 -1.255,2.957 -2.45,4.114 z m 1.05,-4.114 -4.114,0 c 0.35,1.226 1.138,2.363 2.013,3.238 0.926,-1 1.617,-1.957 2.1,-3.237 z"/>
</g>
</svg>
<?xml version="1.0" encoding="utf-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><style>* { fill: #ffffff }</style>
- <g id="translation">
- <path id="english" d="M7.53 9L4 19h2.063l.72-2.406h3.624l.72 2.406h2.062L9.65 9H7.53zm1.064 1.53L9.938 15H7.25z"/>
- <path id="chinese" d="M14.594 4.22c-.43.29-.88.616-1.25.874l.187.312c.14.194.28.393.41.594h-3.843v1.47h1.594c.43 1.41 1.11 2.624 2.03 3.624-.662.437-1.413.82-2.25 1.187l.563 1.567a15.882 15.882 0 0 0 2.908-1.625 13.82 13.82 0 0 0 3.97 2.125l.28.094c.293-.514.578-1.075.813-1.532l-.375-.125c-1.38-.49-2.49-1.05-3.375-1.654.284-.28.59-.635.906-1.157.46-.717.775-1.572 1-2.5h1.656V6H15.75c-.283-.552-.596-1.083-.97-1.53l-.186-.25zm-1.25 3.25h3.187c-.315 1.075-.825 1.937-1.53 2.624-.71-.705-1.26-1.568-1.653-2.625zM9.97 12.874L9.624 13c.196.3.406.594.625.875l-.28-1z"/>
+ <g id="A">
+ <path d="M5.612 15.673l-1.137 3.15H2.9L6.575 7.448h2.188l3.85 11.375h-1.575l-1.05-3.15H5.613zM7.8 8.76l-1.837 5.427h3.675L7.8 8.762z" id="path5"/>
+ </g>
+ <g id="文">
+ <path d="M16.384 6.573h.787l-.873-1.75h-1.75l.438.875c.26.535.805.874 1.4.875z" id="path7"/>
+ <path d="M15.15 12.874c-.7.525-1.486.963-2.45 1.225l.438 1.31a9.17 9.17 0 0 0 3.063-1.575c1.49 1.137 3.064 1.837 4.814 2.363l.438-1.313c-1.486-.525-2.974-1.05-4.2-2.013 1.138-1.224 1.926-2.537 2.45-4.114h1.663v-1.31h-10.85l.438 1.312h1.75c.308 1.33 1.255 2.957 2.45 4.114zM14.1 8.76h4.114c-.35 1.226-1.138 2.363-2.013 3.238-.925-1-1.616-1.957-2.1-3.237z" id="path11-7"/>
</g>
</svg>
<?xml version="1.0" encoding="utf-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
- <g id="translation">
- <path id="english" d="M7.53 9L4 19h2.063l.72-2.406h3.624l.72 2.406h2.062L9.65 9H7.53zm1.064 1.53L9.938 15H7.25z"/>
- <path id="chinese" d="M14.594 4.22c-.43.29-.88.616-1.25.874l.187.312c.14.194.28.393.41.594h-3.843v1.47h1.594c.43 1.41 1.11 2.624 2.03 3.624-.662.437-1.413.82-2.25 1.187l.563 1.567a15.882 15.882 0 0 0 2.908-1.625 13.82 13.82 0 0 0 3.97 2.125l.28.094c.293-.514.578-1.075.813-1.532l-.375-.125c-1.38-.49-2.49-1.05-3.375-1.654.284-.28.59-.635.906-1.157.46-.717.775-1.572 1-2.5h1.656V6H15.75c-.283-.552-.596-1.083-.97-1.53l-.186-.25zm-1.25 3.25h3.187c-.315 1.075-.825 1.937-1.53 2.624-.71-.705-1.26-1.568-1.653-2.625zM9.97 12.874L9.624 13c.196.3.406.594.625.875l-.28-1z"/>
+ <g id="A">
+ <path d="M5.612 15.673l-1.137 3.15H2.9L6.575 7.448h2.188l3.85 11.375h-1.575l-1.05-3.15H5.613zM7.8 8.76l-1.837 5.427h3.675L7.8 8.762z" id="path5"/>
+ </g>
+ <g id="文">
+ <path d="M16.384 6.573h.787l-.873-1.75h-1.75l.438.875c.26.535.805.874 1.4.875z" id="path7"/>
+ <path d="M15.15 12.874c-.7.525-1.486.963-2.45 1.225l.438 1.31a9.17 9.17 0 0 0 3.063-1.575c1.49 1.137 3.064 1.837 4.814 2.363l.438-1.313c-1.486-.525-2.974-1.05-4.2-2.013 1.138-1.224 1.926-2.537 2.45-4.114h1.663v-1.31h-10.85l.438 1.312h1.75c.308 1.33 1.255 2.957 2.45 4.114zM14.1 8.76h4.114c-.35 1.226-1.138 2.363-2.013 3.238-.925-1-1.616-1.957-2.1-3.237z" id="path11-7"/>
</g>
</svg>