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


The following commit(s) were added to refs/heads/develop by this push:
     new 853896a  jewel-multiline: add bead for multiple controls like Button, 
DropDownList,... to allow multi line
853896a is described below

commit 853896a01d40243565bea4a511b04c85f081e200
Author: Carlos Rovira <[email protected]>
AuthorDate: Sat Mar 23 19:43:47 2019 +0100

    jewel-multiline: add bead for multiple controls like Button, 
DropDownList,... to allow multi line
---
 .../src/main/royale/ButtonPlayGround.mxml          |  6 ++-
 .../projects/Jewel/src/main/resources/defaults.css | 15 +++----
 .../Jewel/src/main/resources/jewel-manifest.xml    |  2 +-
 .../{button/MultilineLabel.as => MultiLine.as}     | 46 +++++++++++-----------
 .../projects/Jewel/src/main/sass/_global.sass      |  4 ++
 .../Jewel/src/main/sass/components/_button.sass    |  4 +-
 .../src/main/sass/components/_dropdownlist.sass    |  2 +-
 .../Jewel/src/main/sass/components/_label.sass     | 13 ++----
 8 files changed, 46 insertions(+), 46 deletions(-)

diff --git a/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml 
b/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml
index dd0a862..45c58ce 100644
--- a/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml
@@ -53,7 +53,11 @@ limitations under the License.
                                                <j:Disabled/>
                                        </j:beads>
                                </j:Button>
-                               <j:Button text="Button With More Text"/>
+                               <j:Button text="Button With Multi line" 
width="140">
+                                       <j:beads>
+                                               <j:MultiLine multiline="true"/>
+                                       </j:beads>
+                               </j:Button>
                                <j:Button text="Primary" 
emphasis="{Button.PRIMARY}"/>
                                <j:Button text="Secondary" 
emphasis="{Button.SECONDARY}"/>
                                <j:Button text="Emphasized" 
emphasis="{Button.EMPHASIZED}"/>
diff --git a/frameworks/projects/Jewel/src/main/resources/defaults.css 
b/frameworks/projects/Jewel/src/main/resources/defaults.css
index 02edad7..52cdd25 100644
--- a/frameworks/projects/Jewel/src/main/resources/defaults.css
+++ b/frameworks/projects/Jewel/src/main/resources/defaults.css
@@ -133,6 +133,11 @@ hr {
   height: 1px;
 }
 
+.jewel.multiline {
+  white-space: pre-wrap !important;
+  word-wrap: break-word;
+}
+
 .responsiveSizeMonitor {
   background: rgba(0, 0, 0, 0.8);
   color: white;
@@ -234,9 +239,6 @@ j|Alert {
 .jewel.button[disabled] {
   cursor: default;
 }
-.jewel.button.multiline {
-  white-space: pre-wrap;
-}
 .jewel.button .fonticon {
   cursor: inherit;
 }
@@ -717,7 +719,6 @@ j|DrawerContent {
   -ms-appearance: none;
   appearance: none;
   width: 200px;
-  height: 38px;
   margin: 0;
   padding: 0.68em 2.38em 0.68em 1.12em;
   cursor: pointer;
@@ -876,12 +877,6 @@ j|ImageButton {
   white-space: nowrap;
 }
 
-.jewel.label.multiline {
-  white-space: pre-wrap;
-  word-wrap: break-word;
-  width: 100%;
-}
-
 j|Label {
   IBeadModel: ClassReference("org.apache.royale.jewel.beads.models.TextModel");
 }
diff --git a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml 
b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
index 2f2b39c..50e89a0 100644
--- a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
+++ b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
@@ -124,10 +124,10 @@
     
     <component id="ResponsiveDrawer" 
class="org.apache.royale.jewel.beads.controls.drawer.ResponsiveDrawer"/>
     
+    <component id="MultiLine" 
class="org.apache.royale.jewel.beads.controls.MultiLine"/>
     <component id="NavigationActionNotifier" 
class="org.apache.royale.jewel.beads.controls.NavigationActionNotifier"/>
     <component id="CleanValidationErrors" 
class="org.apache.royale.jewel.beads.controls.application.CleanValidationErrors"/>
 
-    <component id="MultilineLabel" 
class="org.apache.royale.jewel.beads.controls.button.MultilineLabel"/>
     <component id="DispatchChangeOnStartup" 
class="org.apache.royale.jewel.beads.controls.DispatchChangeOnStartup"/>
     <component id="DropDownListTextPrompt" 
class="org.apache.royale.jewel.beads.controls.dropdownlist.DropDownListTextPrompt"/>
     <component id="RequireSelection" 
class="org.apache.royale.jewel.beads.controls.dropdownlist.RequireSelection"/>
diff --git 
a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/button/MultilineLabel.as
 
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/MultiLine.as
similarity index 67%
rename from 
frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/button/MultilineLabel.as
rename to 
frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/MultiLine.as
index 1bc457c..157abe6 100644
--- 
a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/button/MultilineLabel.as
+++ 
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/MultiLine.as
@@ -16,22 +16,24 @@
 //  limitations under the License.
 //
 
////////////////////////////////////////////////////////////////////////////////
-package org.apache.royale.jewel.beads.controls.button
+package org.apache.royale.jewel.beads.controls
 {
        import org.apache.royale.core.IBead;
        import org.apache.royale.core.IStrand;
-       import org.apache.royale.jewel.Button;
+       import org.apache.royale.utils.IClassSelectorListSupport;
        
        /**
-        *  The MultilineLabel bead is a specialty bead that can be used with
-        *  any DropDownList control to force a data item always be selected in 
the control
+        *  The MultiLine bead is a specialty bead that can be used with
+        *  any IClassSelectorListSupport control to allow more than one line
+        *  i.e: Button, DropDownList, ...
+        *  Note that Label has multiline property baked since is very used on 
that component
         *  
         *  @langversion 3.0
         *  @playerversion Flash 10.2
         *  @playerversion AIR 2.6
         *  @productversion Royale 0.9.6
         */
-       public class MultilineLabel implements IBead
+       public class MultiLine implements IBead
        {
                /**
                 *  constructor.
@@ -41,35 +43,35 @@ package org.apache.royale.jewel.beads.controls.button
                 *  @playerversion AIR 2.6
                 *  @productversion Royale 0.9.6
                 */
-               public function MultilineLabel()
+               public function MultiLine()
                {
                }
                
-               private var button:Button;
-               
+               protected var control:IClassSelectorListSupport;
                /**
                 *  @copy org.apache.royale.core.IBead#strand
                 *  
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
-                *  @productversion Royale 0.9.6
+                *  @productversion Royale 0.9.4
+                *  @royaleignorecoercion 
org.apache.royale.events.IEventDispatcher
                 */
                public function set strand(value:IStrand):void
                {
-                       button = value as Button;
-                       updateHost();
-               }       
+                       control = value as IClassSelectorListSupport;
+            updateControl();
+               }
 
-               private var _multiline:Boolean;
+        private var _multiline:Boolean;
         /**
                 *  A boolean flag to activate "multiline" effect selector.
-                *  Allow the Button to have more than one line label if needed
+                *  Allow the label to have more than one line if needed
          *
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
-                *  @productversion Royale 0.9.6
+                *  @productversion Royale 0.9.4
                 */
         public function get multiline():Boolean
         {
@@ -81,16 +83,16 @@ package org.apache.royale.jewel.beads.controls.button
             if (_multiline != value)
             {
                 _multiline = value;
-                               updateHost();
+                updateControl();
             }
         }
 
-               protected function updateHost():void
+        protected function updateControl():void
                {
-                       if (button)
-                       {
-                button.toggleClass("multiline", _multiline);
-            }
-               }
+                       if(control)
+            {
+                               control.toggleClass("multiline", _multiline);
+                       }
+        }
        }
 }
diff --git a/frameworks/projects/Jewel/src/main/sass/_global.sass 
b/frameworks/projects/Jewel/src/main/sass/_global.sass
index f095e54..89fe5b1 100644
--- a/frameworks/projects/Jewel/src/main/sass/_global.sass
+++ b/frameworks/projects/Jewel/src/main/sass/_global.sass
@@ -136,6 +136,10 @@ hr
        border: 0
        height: 1px
 
+.jewel
+       &.multiline
+               white-space: pre-wrap !important
+               word-wrap: break-word
 
 .responsiveSizeMonitor
        background: rgba(0,0,0,0.8)
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_button.sass 
b/frameworks/projects/Jewel/src/main/sass/components/_button.sass
index bdd0d87..c21ee34 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_button.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_button.sass
@@ -52,8 +52,8 @@ $button-padding: 0.68em 1.12em !default
     &[disabled]
         cursor: default
 
-    &.multiline
-        white-space: pre-wrap
+    //&.multiline
+    //   white-space: pre-wrap
 
     .fonticon
         cursor: inherit
diff --git 
a/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass 
b/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass
index 1349890..09c3194 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass
@@ -32,7 +32,7 @@ $dropdownlist-button-yoffset: calc(50% - 
#{$combobox-button-size/2})
         +appear(none)
 
         width: 200px
-        height: 38px
+        // height: 38px
         
         margin: $dropdownlist-margin
         padding: $dropdownlist-padding-vertical 
$dropdownlist-padding-horizontal + 1.26em $dropdownlist-padding-vertical 
$dropdownlist-padding-horizontal 
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_label.sass 
b/frameworks/projects/Jewel/src/main/sass/components/_label.sass
index d26c0ea..1d0e9fb 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_label.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_label.sass
@@ -17,15 +17,10 @@
 //
 
////////////////////////////////////////////////////////////////////////////////
 
-.jewel.label
-       cursor: default
-       white-space: nowrap
-
-.jewel.label.multiline
-       white-space: pre-wrap
-       word-wrap: break-word
-       width: 100%
-
+.jewel
+       &.label
+               cursor: default
+               white-space: nowrap
 
 j|Label
        IBeadModel: 
ClassReference("org.apache.royale.jewel.beads.models.TextModel")

Reply via email to