Repository: flex-asjs Updated Branches: refs/heads/develop f9adc6c12 -> 405fe49c8
FLEX-35288 - MDL Slider should not use RangeModel from pure FlexJS to calculet it's value. Add SliderRangeModel for MDL only which holds values. - Remove from slider property snapInterval cause MDL component do not provide such property - Remove setting default values for SliderRangeModel cause it's already specified inside model Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/405fe49c Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/405fe49c Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/405fe49c Branch: refs/heads/develop Commit: 405fe49c89180d3e256ed9b4775db3caf20b1f97 Parents: f9adc6c Author: piotrz <[email protected]> Authored: Wed Mar 22 06:22:52 2017 +0100 Committer: piotrz <[email protected]> Committed: Wed Mar 22 06:22:52 2017 +0100 ---------------------------------------------------------------------- .../src/main/flex/MDLClasses.as | 1 + .../src/main/flex/org/apache/flex/mdl/Slider.as | 55 +----- .../flex/mdl/beads/models/SliderRangeModel.as | 198 +++++++++++++++++++ .../apache/flex/mdl/beads/views/SliderView.as | 69 +++---- .../src/main/resources/defaults.css | 2 +- 5 files changed, 235 insertions(+), 90 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/405fe49c/frameworks/projects/MaterialDesignLite/src/main/flex/MDLClasses.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/MDLClasses.as b/frameworks/projects/MaterialDesignLite/src/main/flex/MDLClasses.as index 0fc9bff..c571fa5 100644 --- a/frameworks/projects/MaterialDesignLite/src/main/flex/MDLClasses.as +++ b/frameworks/projects/MaterialDesignLite/src/main/flex/MDLClasses.as @@ -33,6 +33,7 @@ package import org.apache.flex.mdl.beads.models.TabArrayListModel; TabArrayListModel; import org.apache.flex.mdl.beads.models.ToastModel; ToastModel; import org.apache.flex.mdl.beads.models.SnackbarModel; SnackbarModel; + import org.apache.flex.mdl.beads.models.SliderRangeModel; SliderRangeModel; import org.apache.flex.mdl.materialIcons.MaterialIconType; MaterialIconType; import org.apache.flex.mdl.beads.UpgradeElement; UpgradeElement; import org.apache.flex.mdl.beads.UpgradeChildren; UpgradeChildren; http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/405fe49c/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Slider.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Slider.as b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Slider.as index 68f1cb1..b488871 100644 --- a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Slider.as +++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Slider.as @@ -84,13 +84,6 @@ package org.apache.flex.mdl super(); className = ""; //set to empty string avoid 'undefined' output when no class selector is assigned by user; - - //default model values - IRangeModel(model).value = 0; - IRangeModel(model).minimum = 0; - IRangeModel(model).maximum = 100; - IRangeModel(model).stepSize = 1; - IRangeModel(model).snapInterval = 1; } /** @@ -143,25 +136,7 @@ package org.apache.flex.mdl { IRangeModel(model).maximum = value; } - - /** - * The modulus of the Slider value. The thumb will be positioned - * at the nearest multiple of this value. - * - * @langversion 3.0 - * @playerversion Flash 10.2 - * @playerversion AIR 2.6 - * @productversion FlexJS 0.8 - */ - public function get snapInterval():Number - { - return IRangeModel(model).snapInterval; - } - public function set snapInterval(value:Number):void - { - IRangeModel(model).snapInterval = value; - } - + /** * The amount to move the thumb when the track is selected. This value is * adjusted to fit the nearest snapInterval. @@ -175,13 +150,11 @@ package org.apache.flex.mdl { return IRangeModel(model).stepSize; } + public function set stepSize(value:Number):void { IRangeModel(model).stepSize = value; } - - COMPILE::JS - private var input:HTMLInputElement; /** * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement @@ -193,13 +166,13 @@ package org.apache.flex.mdl { var div:HTMLElement = document.createElement('div') as HTMLElement; - input = document.createElement('input') as HTMLInputElement; + var input:HTMLInputElement = document.createElement('input') as HTMLInputElement; input.type = "range"; input.className = "mdl-slider mdl-js-slider"; div.appendChild(input); - element = input as WrappedHTMLElement; + element = input as WrappedHTMLElement; positioner = div as WrappedHTMLElement; (input as WrappedHTMLElement).flexjs_wrapper = this; @@ -226,25 +199,5 @@ package org.apache.flex.mdl dispatchEvent(new Event("classNameChanged")); } } - - /** - * @private - */ - COMPILE::JS - public function snap(value:Number):Number - { - var si:Number = snapInterval; - var n:Number = Math.round((value - minimum) / si) * - si + minimum; - if (value > 0) - { - if (value - n < n + si - value) - return n; - return n + si; - } - if (value - n > n + si - value) - return n + si; - return n; - } } } http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/405fe49c/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/models/SliderRangeModel.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/models/SliderRangeModel.as b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/models/SliderRangeModel.as new file mode 100644 index 0000000..82809f2 --- /dev/null +++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/models/SliderRangeModel.as @@ -0,0 +1,198 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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.beads.models +{ + import org.apache.flex.core.IBead; + import org.apache.flex.core.IRangeModel; + import org.apache.flex.core.IStrand; + import org.apache.flex.events.EventDispatcher; + import org.apache.flex.events.Event; + + /** + * The SliderRangeModel class bead defines a set of for a numeric range of values + * which includes a minimum, maximum, and current value. + * + * It do not calculate any values for slider - just holds it. + * + * @langversion 3.0 + * @productversion FlexJS 0.8 + */ + public class SliderRangeModel extends EventDispatcher implements IBead, IRangeModel + { + /** + * constructor. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function SliderRangeModel() + { + super(); + } + + private var _strand:IStrand; + + /** + * @copy org.apache.flex.core.IBead#strand + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function set strand(value:IStrand):void + { + _strand = value; + } + + private var _maximum:Number = 100; + + /** + * The maximum value for the range (defaults to 100). + * + * @copy org.apache.flex.core.IRangeModel#maximum + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get maximum():Number + { + return _maximum; + } + + public function set maximum(value:Number):void + { + if (value != _maximum) + { + _maximum = value; + dispatchEvent(new Event("maximumChange")); + } + } + + private var _minimum:Number = 0; + + /** + * The minimum value for the range (defaults to 0). + * + * @copy org.apache.flex.core.IRangeModel#minimum + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get minimum():Number + { + return _minimum; + } + + public function set minimum(value:Number):void + { + if (value != _minimum) + { + _minimum = value; + dispatchEvent(new Event("minimumChange")); + } + } + + private var _snapInterval:Number = 1; + + /** + * The modulus value for the range. + * + * @copy org.apache.flex.core.IRangeModel#snapInterval + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get snapInterval():Number + { + return _snapInterval; + } + + public function set snapInterval(value:Number):void + { + if (value != _snapInterval) + { + _snapInterval = value; + dispatchEvent(new Event("snapIntervalChange")); + } + } + + private var _stepSize:Number = 1; + + /** + * The amount to adjust the value either up or down toward the edge of the range. + * + * @copy org.apache.flex.core.IRangeModel#stepSize + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get stepSize():Number + { + return _stepSize; + } + + public function set stepSize(value:Number):void + { + if (value != _stepSize) + { + _stepSize = value; + dispatchEvent(new Event("stepSizeChange")); + } + } + + private var _value:Number = 0; + + /** + * The current value of the range, between the minimum and maximum values. Attempting + * to set the value outside of the minimum-maximum range changes the value to still be + * within the range. Note that the value is adjusted by the stepSize. + * + * @copy org.apache.flex.core.IRangeModel#value + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get value():Number + { + return _value; + } + + public function set value(value:Number):void + { + if (value != _value) + { + _value = value; + dispatchEvent(new Event("valueChange")); + } + } + } +} http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/405fe49c/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/views/SliderView.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/views/SliderView.as b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/views/SliderView.as index e4543f9..a537bc4 100644 --- a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/views/SliderView.as +++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/views/SliderView.as @@ -29,7 +29,6 @@ package org.apache.flex.mdl.beads.views import org.apache.flex.core.ValuesManager; import org.apache.flex.events.Event; import org.apache.flex.events.IEventDispatcher; - import org.apache.flex.graphics.IEllipse; import org.apache.flex.html.beads.ISliderView; import org.apache.flex.mdl.Button; @@ -55,11 +54,13 @@ package org.apache.flex.mdl.beads.views public function SliderView() { } - + private var _track:Button; private var _thumb:Button; - - /** + + private var rangeModel:IRangeModel; + + /** * The track component. * * @langversion 3.0 @@ -84,9 +85,7 @@ package org.apache.flex.mdl.beads.views { return _thumb; } - - private var rangeModel:IRangeModel; - + /** * @copy org.apache.flex.core.IBead#strand * @@ -98,32 +97,35 @@ package org.apache.flex.mdl.beads.views override public function set strand(value:IStrand):void { super.strand = value; - - COMPILE::SWF { - var s:UIBase = UIBase(_strand); - + + var host:UIBase = UIBase(_strand); + rangeModel = _strand.getBeadByType(IBeadModel) as IRangeModel; + + COMPILE::SWF { _track = new Button(); _track.addBead(new (ValuesManager.valuesImpl.getValue(_strand, "iTrackView")) as IBead); _track.className = "SliderTrack"; - s.addElement(_track); + host.addElement(_track); _thumb = new Button(); _thumb.addBead(new (ValuesManager.valuesImpl.getValue(_strand, "iThumbView")) as IBead); _thumb.className = "SliderThumb"; - s.addElement(_thumb); + host.addElement(_thumb); } - - rangeModel = _strand.getBeadByType(IBeadModel) as IRangeModel; - + + COMPILE::JS + { + var htmlSliderElement:HTMLInputElement = host.element as HTMLInputElement; + htmlSliderElement.value = String(rangeModel.value); + } + // listen for changes to the model and adjust the UI accordingly. - IEventDispatcher(rangeModel).addEventListener("stepSizeChange",modelChangeHandler); - IEventDispatcher(rangeModel).addEventListener("minimumChange",modelChangeHandler); - IEventDispatcher(rangeModel).addEventListener("maximumChange",modelChangeHandler); - IEventDispatcher(rangeModel).addEventListener("valueChange",modelChangeHandler); - //IEventDispatcher(rangeModel).addEventListener("snapIntervalChange",modelChangeHandler); - - //init view values + IEventDispatcher(rangeModel).addEventListener("stepSizeChange", modelChangeHandler); + IEventDispatcher(rangeModel).addEventListener("minimumChange", modelChangeHandler); + IEventDispatcher(rangeModel).addEventListener("maximumChange", modelChangeHandler); + IEventDispatcher(rangeModel).addEventListener("valueChange", modelChangeHandler); + modelChangeHandler(null); } @@ -138,21 +140,12 @@ package org.apache.flex.mdl.beads.views private function modelChangeHandler( event:Event ) : void { COMPILE::JS - { - var inputElement:HTMLInputElement = (UIBase(_strand).element as HTMLInputElement); - inputElement.step = rangeModel.stepSize.toString(); - inputElement.min = rangeModel.minimum.toString(); - inputElement.max = rangeModel.maximum.toString(); - // (UIBase(_strand).element as HTMLInputElement).value = rangeModel.value.toString(); - var materialSlider:Object = (inputElement as Object)["MaterialSlider"]; - if (materialSlider) - { - materialSlider["change"](rangeModel.value); - } else - { - inputElement.value = rangeModel.value.toString(); - } - } + { + var inputElement:HTMLInputElement = (UIBase(_strand).element as HTMLInputElement); + inputElement.step = String(rangeModel.stepSize); + inputElement.min = String(rangeModel.minimum); + inputElement.max = String(rangeModel.maximum); + } } } } http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/405fe49c/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 5271537..eff039f 100644 --- a/frameworks/projects/MaterialDesignLite/src/main/resources/defaults.css +++ b/frameworks/projects/MaterialDesignLite/src/main/resources/defaults.css @@ -65,7 +65,7 @@ Switch Slider { - IBeadModel: ClassReference("org.apache.flex.html.beads.models.RangeModel"); + IBeadModel: ClassReference("org.apache.flex.mdl.beads.models.SliderRangeModel"); iBeadView: ClassReference("org.apache.flex.mdl.beads.views.SliderView"); iBeadController: ClassReference("org.apache.flex.mdl.beads.controllers.SliderMouseController"); }
