Update OOjs UI to v0.1.0-pre (70f1886a35)
authorJames D. Forrester <jforrester@wikimedia.org>
Wed, 30 Apr 2014 00:13:15 +0000 (17:13 -0700)
committerJames D. Forrester <jforrester@wikimedia.org>
Wed, 30 Apr 2014 00:13:15 +0000 (17:13 -0700)
New changes:
c486e35 Add info icon and alert indicator
5928259 Add a 'ready' event to the window open sequence
d2f1933 Improve info and alert icons/indicators
6d78021 Defer window 'ready' event to let rendering happen
7705a94 Add focus method to SearchWidget
70f1886 Improve alert and required indicators

Change-Id: I58ae4c8154d45b34e2dcd404a5d8c3c9bbffd32f

resources/lib/oojs-ui/images/icons/info.png [new file with mode: 0644]
resources/lib/oojs-ui/images/icons/info.svg [new file with mode: 0644]
resources/lib/oojs-ui/images/indicators/alert.png [new file with mode: 0644]
resources/lib/oojs-ui/images/indicators/alert.svg [new file with mode: 0644]
resources/lib/oojs-ui/images/indicators/required.png
resources/lib/oojs-ui/images/indicators/required.svg
resources/lib/oojs-ui/oojs-ui-apex.css
resources/lib/oojs-ui/oojs-ui.js
resources/lib/oojs-ui/oojs-ui.svg.css

diff --git a/resources/lib/oojs-ui/images/icons/info.png b/resources/lib/oojs-ui/images/icons/info.png
new file mode 100644 (file)
index 0000000..f43804d
Binary files /dev/null and b/resources/lib/oojs-ui/images/icons/info.png differ
diff --git a/resources/lib/oojs-ui/images/icons/info.svg b/resources/lib/oojs-ui/images/icons/info.svg
new file mode 100644 (file)
index 0000000..8c5672a
--- /dev/null
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24" height="24" viewBox="0, 0, 24, 24">
+  <g id="help" opacity="0.75">
+    <path d="M11.499,17 C8.463,17 6,14.536 6,11.5 C6,8.463 8.462,6 11.499,6 C14.536,6 17,8.462 17,11.5 C17,14.536 14.536,17 11.499,17 z M11.501,5 C7.91,5 5,7.91 5,11.5 C5,15.09 7.91,18 11.501,18 C15.089,18 18,15.089 18,11.5 C18,7.911 15.089,5 11.501,5 z" fill="#000000"/>
+    <path d="M12,10 L12,14 L13,14 L13,15 L10,15 L10,14 L11,14 L11,11 L10,11 L10,10 z" fill="#000000"/>
+    <path d="M11,8 L12,8 L12,9 L11,9 z" fill="#000000"/>
+  </g>
+  <defs/>
+</svg>
diff --git a/resources/lib/oojs-ui/images/indicators/alert.png b/resources/lib/oojs-ui/images/indicators/alert.png
new file mode 100644 (file)
index 0000000..bfc83e7
Binary files /dev/null and b/resources/lib/oojs-ui/images/indicators/alert.png differ
diff --git a/resources/lib/oojs-ui/images/indicators/alert.svg b/resources/lib/oojs-ui/images/indicators/alert.svg
new file mode 100644 (file)
index 0000000..8ce4b25
--- /dev/null
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="12" height="12" viewBox="0, 0, 12, 12">
+  <g id="deprecated" opacity="0.75">
+    <path d="M6,12 C2.686,12 -0,9.314 -0,6 C-0,2.686 2.686,-0 6,-0 C9.314,-0 12,2.686 12,6 C12,9.314 9.314,12 6,12 z M5,7 L7,7 L7,2 L5,2 z M5,10 L7,10 L7,8 L5,8 z" fill="#000000"/>
+  </g>
+  <defs/>
+</svg>
index aeb35a3..d10e0d4 100644 (file)
Binary files a/resources/lib/oojs-ui/images/indicators/required.png and b/resources/lib/oojs-ui/images/indicators/required.png differ
index 7c60ec0..ee1baf7 100644 (file)
@@ -2,7 +2,9 @@
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
 <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="12" height="12" viewBox="0, 0, 12, 12">
   <g id="required" opacity="0.75">
-    <path d="M7,0 L7,4.268 L10.696,2.134 L11.696,3.866 L8,6 L11.696,8.134 L10.696,9.866 L7,7.732 L7,12 L5,12 L5,7.732 L1.304,9.866 L0.304,8.134 L4,6 L0.304,3.866 L1.304,2.134 L5,4.268 L5,0 z" fill="#000000"/>
+    <path d="M5,1 L7,1 L7,11 L5,11 z" fill="#000000"/>
+    <path d="M9.83,2.634 L10.83,4.366 L2.17,9.366 L1.17,7.634 z" fill="#000000"/>
+    <path d="M1.17,4.366 L2.17,2.634 L10.83,7.634 L9.83,9.366 z" fill="#000000"/>
   </g>
   <defs/>
 </svg>
index 40e76d2..ac07802 100644 (file)
   padding-right: 1.5em;
 }
 
+.oo-ui-outlineItemWidget.oo-ui-indicatedElement .oo-ui-indicatedElement-indicator {
+  opacity: 0.5;
+}
+
 .oo-ui-outlineItemWidget-level-0 {
   padding-left: 3.5em;
 }
   font-style: italic;
 }
 
-.oo-ui-outlineItemWidget.oo-ui-flaggableElement-empty .oo-ui-iconedElement-icon,
-.oo-ui-outlineItemWidget.oo-ui-flaggableElement-empty .oo-ui-indicatedElement-indicator {
+.oo-ui-outlineItemWidget.oo-ui-flaggableElement-empty .oo-ui-iconedElement-icon {
   opacity: 0.5;
 }
 
index 60476d5..d965ffa 100644 (file)
@@ -1,12 +1,12 @@
 /*!
- * OOjs UI v0.1.0-pre (b91660e612)
+ * OOjs UI v0.1.0-pre (70f1886a35)
  * 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: Mon Apr 28 2014 12:57:47 GMT-0700 (PDT)
+ * Date: Tue Apr 29 2014 17:13:10 GMT-0700 (PDT)
  */
 ( function ( OO ) {
 
@@ -1297,7 +1297,9 @@ OO.ui.Window.prototype.teardown = function () {
  * Do not override this method. See #setup for a way to make changes each time the window opens.
  *
  * @param {Object} [data] Window opening data
+ * @fires opening
  * @fires open
+ * @fires ready
  * @chainable
  */
 OO.ui.Window.prototype.open = function ( data ) {
@@ -1308,13 +1310,16 @@ OO.ui.Window.prototype.open = function ( data ) {
                        this.visible = true;
                        this.emit( 'opening', data );
                        this.setup( data );
-                       // Focus the content div (which has a tabIndex) to inactivate
-                       // (but not clear) selections in the parent frame.
-                       // Must happen after setup runs (otherwise focusing it doesn't work)
-                       // but before 'open' is emitted (so subclasses can give focus to something else)
-                       this.frame.$content.focus();
                        this.emit( 'open', data );
-                       this.opening = false;
+                       setTimeout( OO.ui.bind( function () {
+                               // Focus the content div (which has a tabIndex) to inactivate
+                               // (but not clear) selections in the parent frame.
+                               // Must happen after 'open' is emitted (to ensure it is visible)
+                               // but before 'ready' is emitted (so subclasses can give focus to something else)
+                               this.frame.$content.focus();
+                               this.emit( 'ready', data );
+                               this.opening = false;
+                       }, this ) );
                }, this ) );
        }
 
@@ -1327,6 +1332,7 @@ OO.ui.Window.prototype.open = function ( data ) {
  * See #teardown for a way to do something each time the window closes.
  *
  * @param {Object} [data] Window closing data
+ * @fires closing
  * @fires close
  * @chainable
  */
@@ -7788,6 +7794,13 @@ OO.ui.SearchWidget.prototype.clear = function () {
        this.query.setValue( '' );
 };
 
+/**
+ * Focus the query input.
+ */
+OO.ui.SearchWidget.prototype.focus = function () {
+       this.query.$input[0].focus();
+};
+
 /**
  * Get the results list.
  *
index 321f3f8..d19eb80 100644 (file)
@@ -1,12 +1,12 @@
 /*!
- * OOjs UI v0.1.0-pre (b91660e612)
+ * OOjs UI v0.1.0-pre (70f1886a35)
  * 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: Mon Apr 28 2014 12:57:47 GMT-0700 (PDT)
+ * Date: Tue Apr 29 2014 17:13:10 GMT-0700 (PDT)
  */
 
 /* Textures */
   background-image: /* @embed */ url(images/icons/help.svg);
 }
 
+.oo-ui-icon-info {
+  background-image: /* @embed */ url(images/icons/info.svg);
+}
+
 .oo-ui-icon-link {
   background-image: /* @embed */ url(images/icons/link.svg);
 }
 
 /* Indicators */
 
+.oo-ui-indicator-alert {
+  background-image: /* @embed */ url(images/indicators/alert.svg);
+}
+
 .oo-ui-indicator-down {
   background-image: /* @embed */ url(images/indicators/down.svg);
 }