flex-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From carlosrov...@apache.org
Subject [21/40] git commit: [flex-asjs] [refs/heads/feature/mdl] - Remove css defaults fro HTML.swc and some update to actual components implementation fixing styles and behaviors
Date Sun, 06 Nov 2016 12:17:47 GMT
Remove css defaults fro HTML.swc and some update to actual components implementation fixing
styles and behaviors


Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo
Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/b26b6cdb
Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/b26b6cdb
Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/b26b6cdb

Branch: refs/heads/feature/mdl
Commit: b26b6cdbaeeedb6862b2cf62346408b208565652
Parents: 1fd7e92
Author: Carlos Rovira <carlosrovira@apache.org>
Authored: Mon Oct 24 20:19:06 2016 +0200
Committer: Carlos Rovira <carlosrovira@apache.org>
Committed: Sun Nov 6 13:15:38 2016 +0100

----------------------------------------------------------------------
 examples/flexjs/MDLExample/pom.xml              |  1 +
 .../flexjs/MDLExample/src/main/flex/App.mxml    | 18 +++++------
 .../src/main/flex/org/apache/flex/mdl/Button.as | 13 ++++----
 .../main/flex/org/apache/flex/mdl/CheckBox.as   | 32 +++++++++++++++++--
 .../flex/org/apache/flex/mdl/RadioButton.as     | 33 ++++++++++++++++++--
 .../main/flex/org/apache/flex/mdl/TextInput.as  | 18 +++++------
 6 files changed, 82 insertions(+), 33 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b26b6cdb/examples/flexjs/MDLExample/pom.xml
----------------------------------------------------------------------
diff --git a/examples/flexjs/MDLExample/pom.xml b/examples/flexjs/MDLExample/pom.xml
index 207dab5..3a31b25 100644
--- a/examples/flexjs/MDLExample/pom.xml
+++ b/examples/flexjs/MDLExample/pom.xml
@@ -56,6 +56,7 @@
             <configuration>
               <outputJavaScript>true</outputJavaScript>
               <htmlTemplate>${basedir}/src/main/resources/mdl-js-index-template.html</htmlTemplate>
+              <additionalCompilerOptions>-compiler.exclude-defaults-css-files=HTML-0.8.0-SNAPSHOT.swc:defaults.css</additionalCompilerOptions>
             </configuration>
           </execution>
         </executions>

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b26b6cdb/examples/flexjs/MDLExample/src/main/flex/App.mxml
----------------------------------------------------------------------
diff --git a/examples/flexjs/MDLExample/src/main/flex/App.mxml b/examples/flexjs/MDLExample/src/main/flex/App.mxml
index 636b72b..a50dbeb 100644
--- a/examples/flexjs/MDLExample/src/main/flex/App.mxml
+++ b/examples/flexjs/MDLExample/src/main/flex/App.mxml
@@ -33,11 +33,9 @@ limitations under the License.
             <js:Form action="#"> 
 
                 <!-- Buttons https://getmdl.io/components/index.html#buttons-section -->
-                <js:Container>
-                    <js:beads>
-                        <js:HorizontalLayout />
-                    </js:beads>
-                    
+                <js:HContainer>
+                    <mdl:Button/>
+
                     <!-- Fab button -->
                     <mdl:Button mdlEffect="mdl-button--fab mdl-button--colored">
                         <i class="material-icons">add</i>
@@ -54,23 +52,23 @@ limitations under the License.
                     <mdl:Button mdlEffect="mdl-button--raised mdl-js-ripple-effect mdl-button--accent"
text="BUTTON"/>
                     <!-- Raised disabled button ... it seems we don't have "disabled"
implemented yet-->
                     <mdl:Button mdlEffect="mdl-button--raised" text="BUTTON"/>
-                </js:Container>
+                </js:HContainer>
 
                 <!-- Text Fields :: https://getmdl.io/components/index.html#textfields-section
-->
-                <mdl:TextInput id="mdlti"  change="mdlchk.text = mdlti.text" text="Text..."/>
+                <mdl:TextInput id="mdlti" change="mdlchk.text = mdlti.text" text="Text..."/>
 
                 <mdl:TextInput  mdlEffect="mdl-textfield--floating-label" text="Floating
Label"/>
 
                 <!-- Toggles :: https://getmdl.io/components/index.html#toggles-section
-->
-                <mdl:CheckBox id="mdlchk" text="This Checks" selected="true"/>
+                <mdl:CheckBox id="mdlchk" text="This Checks" selected="true" mdlEffect="mdl-js-ripple-effect"/>
                 <mdl:CheckBox id="mdlchk1" text="This is disabled at start" />
                 
-                <mdl:RadioButton groupName="g1" text="Black"/>
+                <mdl:RadioButton groupName="g1" text="Black" mdlEffect="mdl-js-ripple-effect"/>
                 <mdl:RadioButton groupName="g1" text="White"/>
                 <mdl:RadioButton groupName="g1" text="Red"/>
 
             </js:Form>
-            
+
         </js:View>
     </js:initialView>
 </js:Application>

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b26b6cdb/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Button.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Button.as
b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Button.as
index 61bcc20..7c17757 100644
--- a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Button.as
+++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Button.as
@@ -63,20 +63,19 @@ package org.apache.flex.mdl
             positioner.style.position = 'relative';
             element.flexjs_wrapper = this;
 
-            element.className = 'mdl-button mdl-js-button';
-			className = "";
-			typeNames = "MDLButton";
-			return element;
+			className = typeNames = "mdl-button mdl-js-button";
+			
+            return element;
 		}
 
-        public static const RAISED_EFFECT:String = "mdl-button--raised";
+        /*public static const RAISED_EFFECT:String = "mdl-button--raised";
         public static const FAB_EFFECT:String = "mdl-button--fab";
         public static const MINI_FAB_EFFECT:String = "mdl-button--mini-fab";
         public static const ICON_EFFECT:String = "mdl-button--icon";
         public static const COLORED_EFFECT:String = "mdl-button--colored";
         public static const PRIMARY_EFFECT:String = "mdl-button--primary";
         public static const ACCENT_EFFECT:String = "mdl-button--accent";
-        public static const RIPPLE_EFFECT:String = "mdl-js-ripple-effect";
+        public static const RIPPLE_EFFECT:String = "mdl-js-ripple-effect";*/
 
         private var _mdlEffect:String = "";
 
@@ -90,7 +89,7 @@ package org.apache.flex.mdl
             _mdlEffect = value;
             COMPILE::JS 
             {
-                element.className = 'mdl-button mdl-js-button ' + _mdlEffect;
+                className = _mdlEffect;
             }
         }
 	}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b26b6cdb/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/CheckBox.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/CheckBox.as
b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/CheckBox.as
index 082b99f..60db161 100644
--- a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/CheckBox.as
+++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/CheckBox.as
@@ -53,6 +53,18 @@ package org.apache.flex.mdl
 		{
 			super();
 		}
+
+        private var _mdlEffect:String = "";
+
+        public function get mdlEffect():String
+        {
+            return _mdlEffect;
+        }
+        
+        public function set mdlEffect(value:String):void
+        {
+            _mdlEffect = value;
+        }
 	}
     
     COMPILE::JS
@@ -74,7 +86,6 @@ package org.apache.flex.mdl
         override protected function createElement():WrappedHTMLElement
         {
                 label = document.createElement('label') as HTMLLabelElement;
-                label.className = 'mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect';
                 element = label as WrappedHTMLElement;
                 
                 input = document.createElement('input') as HTMLInputElement;
@@ -91,8 +102,6 @@ package org.apache.flex.mdl
                 
                 textNode = document.createTextNode('') as Text;
                 checkbox.appendChild(textNode);
-                //label.className = 'CheckBox';
-                typeNames = 'CheckBox';
                 
                 positioner = element;
                 positioner.style.position = 'relative';
@@ -100,6 +109,8 @@ package org.apache.flex.mdl
                 (checkbox as WrappedHTMLElement).flexjs_wrapper = this;
                 element.flexjs_wrapper = this;
                 
+                className = typeNames = 'mdl-checkbox mdl-js-checkbox';
+
                 return element;
             };
         
@@ -157,6 +168,21 @@ package org.apache.flex.mdl
                 checkbox.className = 'checkbox-icon';*/
         }
 
+        private var _mdlEffect:String = "";
+
+        public function get mdlEffect():String
+        {
+            return _mdlEffect;
+        }
+        
+        public function set mdlEffect(value:String):void
+        {
+            _mdlEffect = value;
+            COMPILE::JS 
+            {
+                className = _mdlEffect;
+            }
+        }
     }
 
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b26b6cdb/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/RadioButton.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/RadioButton.as
b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/RadioButton.as
index d7e9b2f..d19ce78 100644
--- a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/RadioButton.as
+++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/RadioButton.as
@@ -52,6 +52,18 @@ package org.apache.flex.mdl
 		{
 			super();
 		}
+
+        private var _mdlEffect:String = "";
+
+        public function get mdlEffect():String
+        {
+            return _mdlEffect;
+        }
+        
+        public function set mdlEffect(value:String):void
+        {
+            _mdlEffect = value;
+        }
 	}
     
     COMPILE::JS
@@ -91,15 +103,12 @@ package org.apache.flex.mdl
             textNode = document.createTextNode('') as Text;
             
             label = document.createElement('label') as HTMLLabelElement;
-            label.className = "mdl-radio mdl-js-radio mdl-js-ripple-effect";
             label.appendChild(input);
             label.appendChild(radio);
             radio.appendChild(textNode);
             label.style.position = 'relative';
             
             element = label as WrappedHTMLElement;
-            //element.className = 'RadioButton';
-            typeNames = 'RadioButton';
             
             positioner = element;
             positioner.style.position = 'relative';
@@ -108,6 +117,8 @@ package org.apache.flex.mdl
             element.flexjs_wrapper = this;
             (textNode as WrappedHTMLElement).flexjs_wrapper = this;
             
+            className = typeNames = 'mdl-radio mdl-js-radio';
+            
             return element;
         };
         
@@ -244,6 +255,22 @@ package org.apache.flex.mdl
             }
         }
 
+        private var _mdlEffect:String = "";
+
+        public function get mdlEffect():String
+        {
+            return _mdlEffect;
+        }
+        
+        public function set mdlEffect(value:String):void
+        {
+            _mdlEffect = value;
+            COMPILE::JS 
+            {
+                className = _mdlEffect;
+            }
+        }
+
     }
 
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b26b6cdb/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TextInput.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TextInput.as
b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TextInput.as
index 48d71bf..b387b81 100644
--- a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TextInput.as
+++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TextInput.as
@@ -70,7 +70,6 @@ package org.apache.flex.mdl
             var textNode:Text;
             
             div = document.createElement('div') as HTMLDivElement;
-            div.className = "mdl-textfield mdl-js-textfield";
 
             input = document.createElement('input') as HTMLInputElement;
             input.setAttribute('type', 'text');
@@ -86,9 +85,7 @@ package org.apache.flex.mdl
             div.appendChild(label);
 
             element = div as WrappedHTMLElement;
-            //element.className = 'TextInput';
-            typeNames = 'TextInput';
-
+            
             //attach input handler to dispatch flexjs change event when user write in textinput
             //goog.events.listen(element, 'change', killChangeHandler);
             goog.events.listen(input, 'input', textChangeHandler);
@@ -100,6 +97,8 @@ package org.apache.flex.mdl
             (label as WrappedHTMLElement).flexjs_wrapper = this;
             element.flexjs_wrapper = this;
             
+            className = typeNames = "mdl-textfield mdl-js-textfield";
+
             return element;
         }        
         
@@ -115,25 +114,24 @@ package org.apache.flex.mdl
             _mdlEffect = value;
             COMPILE::JS 
             {
-                element.className = 'mdl-textfield mdl-js-textfield ' + _mdlEffect;
+                className = _mdlEffect;
             }
         }
 
         /**
          *  @private
-         *  @flexjsignorecoercion HTMLInputElement
          */
 		override public function set text(value:String):void
 		{
-            COMPILE::SWF
-            {
+            //COMPILE::SWF
+            //{
                 //inSetter = true;
                 //ITextModel(model).text = value;
                 //inSetter = false;                    
-            }
+            //}
             COMPILE::JS
             {
-                _textNode.text = value;
+                _textNode.nodeValue = value;
                 dispatchEvent(new Event('textChange'));
             }
 		}


Mime
View raw message