Love this commit :) On Fri, Jan 13, 2017, 20:34 <carlosrov...@apache.org> wrote:
> Repository: flex-asjs > Updated Branches: > refs/heads/develop 2e52060f3 -> b0b41aefe > > > MDL Table component and example initial implementation > > > Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo > Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/b0b41aef > Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/b0b41aef > Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/b0b41aef > > Branch: refs/heads/develop > Commit: b0b41aefe2a419d310c010299430ba56bf87d974 > Parents: 2e52060 > Author: Carlos Rovira <carlosrov...@apache.org> > Authored: Fri Jan 13 20:34:17 2017 +0100 > Committer: Carlos Rovira <carlosrov...@apache.org> > Committed: Fri Jan 13 20:34:17 2017 +0100 > > ---------------------------------------------------------------------- > .../src/main/flex/MainNavigation.mxml | 1 + > .../flexjs/MDLExample/src/main/flex/Tables.mxml | 41 ++++++ > .../src/main/flex/models/MainNavigationModel.as | 1 + > .../src/main/flex/models/TablesModel.as | 41 ++++++ > .../MDLExample/src/main/flex/vos/MaterialVO.as | 35 +++++ > .../main/flex/org/apache/flex/mdl/Navigation.as | 2 +- > .../src/main/flex/org/apache/flex/mdl/Table.as | 30 ++-- > .../flex/mdl/itemRenderers/TableItemRenderer.as | 145 +++++++++++++++++++ > .../src/main/resources/defaults.css | 10 ++ > .../src/main/resources/mdl-manifest.xml | 2 + > 10 files changed, 293 insertions(+), 15 deletions(-) > ---------------------------------------------------------------------- > > > > http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b0b41aef/examples/flexjs/MDLExample/src/main/flex/MainNavigation.mxml > ---------------------------------------------------------------------- > diff --git a/examples/flexjs/MDLExample/src/main/flex/MainNavigation.mxml > b/examples/flexjs/MDLExample/src/main/flex/MainNavigation.mxml > index f056f18..a2414b8 100644 > --- a/examples/flexjs/MDLExample/src/main/flex/MainNavigation.mxml > +++ b/examples/flexjs/MDLExample/src/main/flex/MainNavigation.mxml > @@ -74,6 +74,7 @@ limitations under the License. > <local:Toggles id="toggles_panel"/> > <local:Snackbar id="snackbar_panel"/> > <local:Lists id="lists_panel"/> > + <local:Tables id="tables_panel"/> > <local:Loading id="loading_panel"/> > <local:Menus id="menus_panel"/> > <local:Badges id="badges_panel"/> > > > http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b0b41aef/examples/flexjs/MDLExample/src/main/flex/Tables.mxml > ---------------------------------------------------------------------- > diff --git a/examples/flexjs/MDLExample/src/main/flex/Tables.mxml > b/examples/flexjs/MDLExample/src/main/flex/Tables.mxml > new file mode 100644 > index 0000000..a5591d7 > --- /dev/null > +++ b/examples/flexjs/MDLExample/src/main/flex/Tables.mxml > @@ -0,0 +1,41 @@ > +<?xml version="1.0" encoding="utf-8"?> > +<!-- > + > +Licensed to the Apache Software Foundation (ASF) under one or more > +contributor license agreements. See the NOTICE file distributed with > +this work for additional information regarding copyright ownership. > +The ASF licenses this file to You under the Apache License, Version 2.0 > +(the "License"); you may not use this file except in compliance with > +the License. You may obtain a copy of the License at > + > +http://www.apache.org/licenses/LICENSE-2.0 > + > +Unless required by applicable law or agreed to in writing, software > +distributed under the License is distributed on an "AS IS" BASIS, > +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. > +See the License for the specific language governing permissions and > +limitations under the License. > + > +--> > +<mdl:TabBarPanel xmlns:fx="http://ns.adobe.com/mxml/2009"; > + xmlns:js="library://ns.apache.org/flexjs/basic" > + xmlns:mdl="library://ns.apache.org/flexjs/mdl" > + xmlns="http://www.w3.org/1999/xhtml"; > + xmlns:models="models.*"> > + > + <mdl:model> > + <models:TablesModel/> > + </mdl:model> > + > + <mdl:Grid> > + <mdl:Table labelField="materialName" shadow="2"> > + <mdl:beads> > + <js:ConstantBinding > + sourceID="model" > + sourcePropertyName="materials" > + destinationPropertyName="dataProvider" /> > + </mdl:beads> > + </mdl:Table> > + </mdl:Grid> > + > +</mdl:TabBarPanel> > \ No newline at end of file > > > http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b0b41aef/examples/flexjs/MDLExample/src/main/flex/models/MainNavigationModel.as > ---------------------------------------------------------------------- > diff --git > a/examples/flexjs/MDLExample/src/main/flex/models/MainNavigationModel.as > b/examples/flexjs/MDLExample/src/main/flex/models/MainNavigationModel.as > index 5330ae4..12fbbf3 100644 > --- > a/examples/flexjs/MDLExample/src/main/flex/models/MainNavigationModel.as > +++ > b/examples/flexjs/MDLExample/src/main/flex/models/MainNavigationModel.as > @@ -63,6 +63,7 @@ package models > new NavigationLinkVO("Snackbar", "snackbar_panel"), > new NavigationLinkVO("Toggles", "toggles_panel"), > new NavigationLinkVO("Lists", "lists_panel"), > + new NavigationLinkVO("Tables", "tables_panel"), > new NavigationLinkVO("Loading", "loading_panel"), > new NavigationLinkVO("Menu", "menus_panel"), > new NavigationLinkVO("Badges", "badges_panel"), > > > http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b0b41aef/examples/flexjs/MDLExample/src/main/flex/models/TablesModel.as > ---------------------------------------------------------------------- > diff --git > a/examples/flexjs/MDLExample/src/main/flex/models/TablesModel.as > b/examples/flexjs/MDLExample/src/main/flex/models/TablesModel.as > new file mode 100644 > index 0000000..19e355e > --- /dev/null > +++ b/examples/flexjs/MDLExample/src/main/flex/models/TablesModel.as > @@ -0,0 +1,41 @@ > > +//////////////////////////////////////////////////////////////////////////////// > +// > +// Licensed to the Apache Software Foundation (ASF) under one or more > +// contributor license agreements. See the NOTICE file distributed with > +// this work for additional information regarding copyright ownership. > +// The ASF licenses this file to You under the Apache License, Version > 2.0 > +// (the "License"); you may not use this file except in compliance with > +// the License. You may obtain a copy of the License at > +// > +// http://www.apache.org/licenses/LICENSE-2.0 > +// > +// Unless required by applicable law or agreed to in writing, software > +// distributed under the License is distributed on an "AS IS" BASIS, > +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or > implied. > +// See the License for the specific language governing permissions and > +// limitations under the License. > +// > > +//////////////////////////////////////////////////////////////////////////////// > +package models > +{ > + import org.apache.flex.events.EventDispatcher; > + import vos.*; > + > + public class TablesModel extends EventDispatcher > + { > + /** > + * Used in the Tables example. > + */ > + private var _materials:Array = [ > + new MaterialVO("Acrylic (Transparent)", "25", > "$2.90"), > + new MaterialVO("Plywood (Birch)", "50", "$1.25"), > + new MaterialVO("Laminate (Gold on Blue)", "10", > "$2.35") > + ]; > + > + public function get materials():Array > + { > + return _materials; > + } > + > + } > +} > > > http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b0b41aef/examples/flexjs/MDLExample/src/main/flex/vos/MaterialVO.as > ---------------------------------------------------------------------- > diff --git a/examples/flexjs/MDLExample/src/main/flex/vos/MaterialVO.as > b/examples/flexjs/MDLExample/src/main/flex/vos/MaterialVO.as > new file mode 100644 > index 0000000..b7dc69e > --- /dev/null > +++ b/examples/flexjs/MDLExample/src/main/flex/vos/MaterialVO.as > @@ -0,0 +1,35 @@ > > +//////////////////////////////////////////////////////////////////////////////// > +// > +// Licensed to the Apache Software Foundation (ASF) under one or more > +// contributor license agreements. See the NOTICE file distributed with > +// this work for additional information regarding copyright ownership. > +// The ASF licenses this file to You under the Apache License, Version > 2.0 > +// (the "License"); you may not use this file except in compliance with > +// the License. You may obtain a copy of the License at > +// > +// http://www.apache.org/licenses/LICENSE-2.0 > +// > +// Unless required by applicable law or agreed to in writing, software > +// distributed under the License is distributed on an "AS IS" BASIS, > +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or > implied. > +// See the License for the specific language governing permissions and > +// limitations under the License. > +// > > +//////////////////////////////////////////////////////////////////////////////// > +package vos > +{ > + [Bindable] > + public class MaterialVO > + { > + public function MaterialVO(materialName:String = null, > quantity:String = null, unitPrice:String = null) > + { > + this.materialName = materialName; > + this.quantity = quantity; > + this.unitPrice = unitPrice; > + } > + > + public var materialName:String = ""; > + public var quantity:String = ""; > + public var unitPrice:String = ""; > + } > +} > \ No newline at end of file > > > http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b0b41aef/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Navigation.as > ---------------------------------------------------------------------- > diff --git > a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Navigation.as > b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Navigation.as > index a638d1e..708983d 100644 > --- > a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Navigation.as > +++ > b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Navigation.as > @@ -64,7 +64,7 @@ package org.apache.flex.mdl > positioner = element; > element.flexjs_wrapper = this; > > - return positioner; > + return element; > } > } > } > > > http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b0b41aef/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Table.as > ---------------------------------------------------------------------- > diff --git > a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Table.as > b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Table.as > index 0ac0377..b23b834 100644 > --- > a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Table.as > +++ > b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Table.as > @@ -18,7 +18,7 @@ > > > //////////////////////////////////////////////////////////////////////////////// > package org.apache.flex.mdl > { > - import org.apache.flex.core.ContainerBase; > + import org.apache.flex.mdl.List; > > COMPILE::JS > { > @@ -41,7 +41,7 @@ package org.apache.flex.mdl > * @playerversion AIR 2.6 > * @productversion FlexJS 0.0 > */ > - public class Table extends ContainerBase > + public class Table extends List > { > /** > * constructor. > @@ -67,14 +67,8 @@ package org.apache.flex.mdl > typeNames = "mdl-data-table mdl-js-data-table"; > > element = document.createElement('table') as > WrappedHTMLElement; > - element.className = typeNames; > > positioner = element; > - > - // absolute positioned children need a non-null > - // position value in the parent. It might > - // get set to 'absolute' if the container is > - // also absolutely positioned > element.flexjs_wrapper = this; > > return element; > @@ -96,15 +90,20 @@ package org.apache.flex.mdl > } > public function set shadow(value:Number):void > { > - if(value == 0 || value == 2 || value == 3 || value > == 4 || value == 6 || value == 8 || value == 16) > + COMPILE::JS > { > - _shadow = value; > + element.classList.remove("mdl-shadow--" + > _shadow + "dp"); > + > + if(value == 2 || value == 3 || value == 4 > || value == 6 || value == 8 || value == 16) > + { > + _shadow = value; > > - className += (_shadow != 0 ? " > mdl-shadow--" + _shadow + "dp" : ""); > - } > + > element.classList.add("mdl-shadow--" + _shadow + "dp"); > + } > + } > } > > - protected var _selectable:Boolean; > + protected var _selectable:Boolean = false; > /** > * A boolean flag to activate > "mdl-data-table--selectable" effect selector. > * Applies all/individual selectable behavior (checkboxes) > @@ -123,7 +122,10 @@ package org.apache.flex.mdl > { > _selectable = value; > > - > element.classList.toggle("mdl-data-table--selectable", _selectable); > + COMPILE::JS > + { > + > element.classList.toggle("mdl-data-table--selectable", _selectable); > + } > } > } > } > > > http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b0b41aef/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/itemRenderers/TableItemRenderer.as > ---------------------------------------------------------------------- > diff --git > a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/itemRenderers/TableItemRenderer.as > b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/itemRenderers/TableItemRenderer.as > new file mode 100644 > index 0000000..c5ae510 > --- /dev/null > +++ > b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/itemRenderers/TableItemRenderer.as > @@ -0,0 +1,145 @@ > > +//////////////////////////////////////////////////////////////////////////////// > +// > +// Licensed to the Apache Software Foundation (ASF) under one or more > +// contributor license agreements. See the NOTICE file distributed with > +// this work for additional information regarding copyright ownership. > +// The ASF licenses this file to You under the Apache License, Version > 2.0 > +// (the "License"); you may not use this file except in compliance with > +// the License. You may obtain a copy of the License at > +// > +// http://www.apache.org/licenses/LICENSE-2.0 > +// > +// Unless required by applicable law or agreed to in writing, software > +// distributed under the License is distributed on an "AS IS" BASIS, > +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or > implied. > +// See the License for the specific language governing permissions and > +// limitations under the License. > +// > > +//////////////////////////////////////////////////////////////////////////////// > +package org.apache.flex.mdl.itemRenderers > +{ > + COMPILE::JS > + { > + import org.apache.flex.core.WrappedHTMLElement; > + } > + > + import org.apache.flex.html.supportClasses.MXMLItemRenderer; > + > + /** > + * The TableItemRenderer defines the basic Item Renderer for a > MDL Table Component. > + * > + * @langversion 3.0 > + * @playerversion Flash 10.2 > + * @playerversion AIR 2.6 > + * @productversion FlexJS 0.0 > + */ > + public class TableItemRenderer extends MXMLItemRenderer > + { > + /** > + * constructor. > + * > + * @langversion 3.0 > + * @playerversion Flash 10.2 > + * @playerversion AIR 2.6 > + * @productversion FlexJS 0.0 > + */ > + public function TableItemRenderer() > + { > + super(); > + > + className = ""; //set to empty string avoid 'undefined' > output when no class selector is assigned by user; > + } > + > + private var _text:String = ""; > + > + /** > + * The text of the heading > + * > + * @langversion 3.0 > + * @playerversion Flash 10.2 > + * @playerversion AIR 2.6 > + * @productversion FlexJS 0.0 > + */ > + public function get text():String > + { > + return _text; > + } > + > + public function set text(value:String):void > + { > + _text = value; > + } > + > + COMPILE::JS > + private var textNode:Text; > + > + /** > + * Sets the data value and uses the String version of the > data for display. > + * > + * @param Object data The object being displayed by the > itemRenderer instance. > + * > + * @langversion 3.0 > + * @playerversion Flash 10.2 > + * @playerversion AIR 2.6 > + * @productversion FlexJS 0.0 > + */ > + override public function set data(value:Object):void > + { > + super.data = value; > + > + var text:String; > + if (labelField || dataField) { > + text = String(value[labelField]); > + } else { > + text = String(value); > + } > + > + COMPILE::JS > + { > + if(textNode != null) > + { > + textNode.nodeValue = text; > + } > + } > + } > + > + /** > + * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement > + */ > + COMPILE::JS > + override protected function createElement():WrappedHTMLElement > + { > + element = document.createElement('td') as WrappedHTMLElement; > + > + if(MXMLDescriptor == null) > + { > + textNode = document.createTextNode('') as > Text; > + element.appendChild(textNode); > + } > + > + positioner = element; > + element.flexjs_wrapper = this; > + > + return element; > + } > + > + private var _nonNumeric:Boolean; > + /** > + * Activate "mdl-data-table__cell--non-numeric" class selector, > for use in table td item. > + * Optional > + */ > + public function get nonNumeric():Boolean > + { > + return _nonNumeric; > + } > + public function set nonNumeric(value:Boolean):void > + { > + _nonNumeric = value; > + > + COMPILE::JS > + { > + > element.classList.toggle("mdl-data-table__cell--non-numeric", _nonNumeric); > + } > + } > + } > +} > > > http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b0b41aef/frameworks/projects/MaterialDesignLite/src/main/resources/defaults.css > ---------------------------------------------------------------------- > diff --git > a/frameworks/projects/MaterialDesignLite/src/main/resources/defaults.css > b/frameworks/projects/MaterialDesignLite/src/main/resources/defaults.css > index 9f2dbd6..566875e 100644 > --- > a/frameworks/projects/MaterialDesignLite/src/main/resources/defaults.css > +++ > b/frameworks/projects/MaterialDesignLite/src/main/resources/defaults.css > @@ -56,6 +56,16 @@ List > IItemRenderer: > ClassReference("org.apache.flex.mdl.itemRenderers.ListItemRenderer"); > } > > +Table > +{ > + IBeadView: ClassReference("org.apache.flex.mdl.beads.views.ListView"); > + IBeadModel: > ClassReference("org.apache.flex.html.beads.models.ArraySelectionModel"); > + IBeadLayout: ClassReference(null); > /*"org.apache.flex.html.beads.layouts.VerticalLayout"*/ > + IDataProviderItemRendererMapper: > ClassReference("org.apache.flex.html.beads.DataItemRendererFactoryForArrayData"); > + IItemRendererClassFactory: > ClassReference("org.apache.flex.core.ItemRendererClassFactory"); > + IItemRenderer: > ClassReference("org.apache.flex.mdl.itemRenderers.TableItemRenderer"); > +} > + > Navigation > { > IBeadView: ClassReference("org.apache.flex.mdl.beads.views.ListView"); > > > http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/b0b41aef/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml > ---------------------------------------------------------------------- > diff --git > a/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml > b/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml > index 1b8b2a0..b4d2c9a 100644 > --- > a/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml > +++ > b/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml > @@ -56,6 +56,8 @@ > <component id="ListItemSubTitle" > class="org.apache.flex.mdl.beads.ListItemSubTitle"/> > <component id="ListItemSecondaryInfo" > class="org.apache.flex.mdl.beads.ListItemSecondaryInfo"/> > <component id="ListItemTextBody" > class="org.apache.flex.mdl.beads.ListItemTextBody"/> > + <component id="Table" class="org.apache.flex.mdl.Table"/> > + <component id="TableItemRenderer" > class="org.apache.flex.mdl.itemRenderers.TableItemRenderer"/> > <component id="NavigationLayout" > class="org.apache.flex.mdl.NavigationLayout"/> > <component id="LayoutTitle" class="org.apache.flex.mdl.LayoutTitle"/> > <component id="Navigation" class="org.apache.flex.mdl.Navigation"/> > >
