You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@royale.apache.org by ca...@apache.org on 2020/06/15 17:23:51 UTC

[royale-asjs] 05/08: jewel-button: add ITextButton interface to buttons with text label (included checkbox and radiobutton) and make text label use a span to make it more usable

This is an automated email from the ASF dual-hosted git repository.

carlosrovira pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git

commit cb8dde4bf601f3d6c2c978061b48450a4f7292dd
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Mon Jun 15 18:10:46 2020 +0200

    jewel-button: add ITextButton interface to buttons with text label (included checkbox and radiobutton) and make text label use a span to make it more usable
---
 .../main/royale/org/apache/royale/jewel/Button.as  | 46 +++++++++++++++++++---
 .../royale/org/apache/royale/jewel/CheckBox.as     | 29 ++++++++++----
 .../royale/org/apache/royale/jewel/IconButton.as   | 23 +----------
 .../royale/org/apache/royale/jewel/RadioButton.as  | 29 ++++++++++----
 .../royale/org/apache/royale/jewel/ToggleButton.as |  2 +-
 5 files changed, 86 insertions(+), 43 deletions(-)

diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/Button.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/Button.as
index 504fedf..21db9ed 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/Button.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/Button.as
@@ -28,8 +28,10 @@ package org.apache.royale.jewel
     //but IE11 will break if the following import is removed:
     //@carlosrovira: Probably the above issue is due to the need to be in COMPILE::JS, so IDEs organizing imports don't remove this one
     import org.apache.royale.events.Event;
+    import org.apache.royale.core.WrappedHTMLElement;
     }
     import org.apache.royale.jewel.supportClasses.button.SimpleButton;
+    import org.apache.royale.core.ITextButton;
 
     [DefaultProperty("text")]
 
@@ -46,7 +48,7 @@ package org.apache.royale.jewel
      *  @playerversion AIR 2.6
      *  @productversion Royale 0.9.4
      */
-    public class Button extends SimpleButton
+    public class Button extends SimpleButton implements ITextButton
     {
 		/**
 		 *  Constructor.
@@ -80,7 +82,7 @@ package org.apache.royale.jewel
 			}
 			COMPILE::JS
 			{
-			return (element as HTMLButtonElement).textContent;
+			return spanLabel.textContent;
 			}
 		}
 		/**
@@ -94,7 +96,7 @@ package org.apache.royale.jewel
 			}
 			COMPILE::JS
 			{
-			(element as HTMLButtonElement).textContent = value;
+			spanLabel.textContent = value;
 			dispatchEvent(new Event('textChange'));
 			}
 		}
@@ -119,7 +121,7 @@ package org.apache.royale.jewel
 			}
 			COMPILE::JS
 			{
-			return (element as HTMLButtonElement).innerHTML;
+			return spanLabel.innerHTML;
 			}
 		}
 		/**
@@ -133,9 +135,43 @@ package org.apache.royale.jewel
 			}
 			COMPILE::JS
 			{
-			(element as HTMLButtonElement).innerHTML = value;
+			spanLabel.innerHTML = value;
 			dispatchEvent(new Event('htmlChange'));
 			}
 		}
+
+		COMPILE::JS
+		private var _spanLabel:HTMLSpanElement;
+		/**
+         *  the span for the label text
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion Royale 0.10.0
+         */
+		COMPILE::JS
+		public function get spanLabel():HTMLSpanElement {
+			return _spanLabel;
+		}
+		COMPILE::JS
+		public function set spanLabel(value:HTMLSpanElement):void {
+			_spanLabel = value;
+		}
+
+		/**
+		 * @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
+         */
+		COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+			super.createElement();
+            
+			spanLabel = document.createElement('span') as HTMLSpanElement;
+			spanLabel.textContent = text;
+			element.appendChild(spanLabel);
+
+            return element;
+        }
 	}
 }
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/CheckBox.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/CheckBox.as
index f8ca27b..112f565 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/CheckBox.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/CheckBox.as
@@ -31,6 +31,7 @@ package org.apache.royale.jewel
     import org.apache.royale.html.util.addElementToWrapper;
     }
 
+    import org.apache.royale.core.ITextButton;
     import org.apache.royale.jewel.supportClasses.IInputButton;
     import org.apache.royale.jewel.supportClasses.button.SelectableButtonBase;
     
@@ -49,7 +50,7 @@ package org.apache.royale.jewel
      *  @playerversion AIR 2.6
      *  @productversion Royale 0.9.4
      */
-    public class CheckBox extends SelectableButtonBase implements IInputButton
+    public class CheckBox extends SelectableButtonBase implements IInputButton, ITextButton
     {
         /**
          *  Constructor.
@@ -141,7 +142,7 @@ package org.apache.royale.jewel
             if(!textNode)
             {
                 textNode = document.createTextNode('') as Text;
-                checkbox.appendChild(textNode);
+                spanLabel.appendChild(textNode);
             }
             
             textNode.nodeValue = value;
@@ -202,11 +203,23 @@ package org.apache.royale.jewel
         }
 
         COMPILE::JS
-        /**
-         * a HTMLSpanElement decorator for this component
-         * added to the positioner.
+		private var _spanLabel:HTMLSpanElement;
+		/**
+         *  the span for the label text
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion Royale 0.10.0
          */
-        protected var checkbox:HTMLSpanElement;
+		COMPILE::JS
+		public function get spanLabel():HTMLSpanElement {
+			return _spanLabel;
+		}
+		COMPILE::JS
+		public function set spanLabel(value:HTMLSpanElement):void {
+			_spanLabel = value;
+		}
         
         COMPILE::JS
         /**
@@ -225,7 +238,7 @@ package org.apache.royale.jewel
         {
             input = addElementToWrapper(this,'input') as HTMLInputElement;
             input.type = 'checkbox';
-            checkbox = document.createElement('span') as HTMLSpanElement;
+            spanLabel = document.createElement('span') as HTMLSpanElement;
             positioner = document.createElement('label') as WrappedHTMLElement;   
             return element;
         }
@@ -251,7 +264,7 @@ package org.apache.royale.jewel
 			_positioner = value;
             _positioner.royale_wrapper = this;
 			_positioner.appendChild(element);
-            _positioner.appendChild(checkbox);
+            _positioner.appendChild(spanLabel);
 		}
     }
 }
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/IconButton.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/IconButton.as
index 1d72e54..e8427eb 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/IconButton.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/IconButton.as
@@ -54,9 +54,6 @@ package org.apache.royale.jewel
 		}
 
         COMPILE::JS
-        protected var textNode:Text;
-
-        COMPILE::JS
         private var _text:String = "";
 
         [Bindable("textChange")]
@@ -79,10 +76,10 @@ package org.apache.royale.jewel
         COMPILE::JS
 		override public function set text(value:String):void
 		{
-            if (textNode)
+            if (spanLabel)
             {
                 _text = value;
-                textNode.nodeValue = value;
+                spanLabel.textContent = value;
                 dispatchEvent(new Event('textChange'));
             }
 		}
@@ -150,21 +147,5 @@ package org.apache.royale.jewel
             addElementAt(_icon, rightPosition? numElements : 0);
             }
         }
-
-        /**
-		 * @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
-		 * @royaleignorecoercion org.apache.royale.html.util.addElementToWrapper
-         */
-        COMPILE::JS
-        override protected function createElement():WrappedHTMLElement
-        {
-			addElementToWrapper(this, 'button');
-            element.setAttribute('type', 'button');
-            
-            textNode = document.createTextNode(_text) as Text;
-            element.appendChild(textNode);
-
-            return element;
-        }
 	}
 }
\ No newline at end of file
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/RadioButton.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/RadioButton.as
index edda47c..a229e79 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/RadioButton.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/RadioButton.as
@@ -32,6 +32,7 @@ package org.apache.royale.jewel
     import org.apache.royale.html.util.addElementToWrapper;
     }
 
+    import org.apache.royale.core.ITextButton;
     import org.apache.royale.events.MouseEvent;
     import org.apache.royale.jewel.supportClasses.IInputButton;
     import org.apache.royale.jewel.supportClasses.button.SelectableButtonBase;
@@ -50,7 +51,7 @@ package org.apache.royale.jewel
      *  @playerversion AIR 2.6
      *  @productversion Royale 0.9.4
      */
-    public class RadioButton extends SelectableButtonBase implements IInputButton
+    public class RadioButton extends SelectableButtonBase implements IInputButton, ITextButton
     {
         /**
          *  Constructor.
@@ -309,11 +310,23 @@ package org.apache.royale.jewel
         }
         
         COMPILE::JS
-        /**
-         * a HTMLSpanElement decorator for this component
-         * added to the positioner.
+		private var _spanLabel:HTMLSpanElement;
+		/**
+         *  the span for the label text
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion Royale 0.10.0
          */
-        protected var radio:HTMLSpanElement;
+		COMPILE::JS
+		public function get spanLabel():HTMLSpanElement {
+			return _spanLabel;
+		}
+		COMPILE::JS
+		public function set spanLabel(value:HTMLSpanElement):void {
+			_spanLabel = value;
+		}
 
         COMPILE::JS
         /**
@@ -336,8 +349,8 @@ package org.apache.royale.jewel
             icon.value = String(value);
             
             textNode = document.createTextNode('') as Text;
-            radio = document.createElement('span') as HTMLSpanElement;
-            radio.appendChild(textNode);
+            spanLabel = document.createElement('span') as HTMLSpanElement;
+            spanLabel.appendChild(textNode);
             
             positioner = document.createElement('label') as WrappedHTMLElement;
             
@@ -365,7 +378,7 @@ package org.apache.royale.jewel
 			_positioner = value;
             _positioner.royale_wrapper = this;
 			_positioner.appendChild(element);
-            _positioner.appendChild(radio);
+            _positioner.appendChild(spanLabel);
 		}
 
         /**
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/ToggleButton.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/ToggleButton.as
index 929727f..df3009c 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/ToggleButton.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/ToggleButton.as
@@ -211,7 +211,7 @@ package org.apache.royale.jewel
 
             COMPILE::JS
 			{
-                textNode.nodeValue = _selected ? selectedText : text;
+                spanLabel.textContent = _selected ? selectedText : text;
 			}
         }