You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@flex.apache.org by pe...@apache.org on 2016/06/06 20:26:26 UTC

git commit: [flex-asjs] [refs/heads/develop] - Added DatePicker to the set of mobile controls.

Repository: flex-asjs
Updated Branches:
  refs/heads/develop f376283d4 -> 63a3e201c


Added DatePicker to the set of mobile controls.


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

Branch: refs/heads/develop
Commit: 63a3e201c4aa0cea6fca6da69a044a7260d62849
Parents: f376283
Author: Peter Ent <pe...@apache.org>
Authored: Mon Jun 6 16:26:24 2016 -0400
Committer: Peter Ent <pe...@apache.org>
Committed: Mon Jun 6 16:26:24 2016 -0400

----------------------------------------------------------------------
 .../Mobile/src/main/flex/MobileClasses.as       |   2 +
 .../flex/org/apache/flex/mobile/DatePicker.as   |  80 ++++++++
 .../apache/flex/mobile/beads/DatePickerView.as  | 187 +++++++++++++++++++
 .../src/main/resources/basic-manifest.xml       |   1 +
 .../Mobile/src/main/resources/defaults.css      |  23 +++
 5 files changed, 293 insertions(+)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/63a3e201/frameworks/projects/Mobile/src/main/flex/MobileClasses.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/Mobile/src/main/flex/MobileClasses.as b/frameworks/projects/Mobile/src/main/flex/MobileClasses.as
index b1e6dae..411b05c 100644
--- a/frameworks/projects/Mobile/src/main/flex/MobileClasses.as
+++ b/frameworks/projects/Mobile/src/main/flex/MobileClasses.as
@@ -29,6 +29,8 @@ internal class MobileClasses
 {	
 	import org.apache.flex.mobile.ManagerBase; ManagerBase;
 	
+	import org.apache.flex.mobile.DatePicker; DatePicker;
+	import org.apache.flex.mobile.beads.DatePickerView; DatePickerView;
 	import org.apache.flex.mobile.ToggleSwitch; ToggleSwitch;
 	import org.apache.flex.mobile.ViewManagerBase; ViewManagerBase;
 	import org.apache.flex.mobile.beads.StackedViewManagerView; StackedViewManagerView;

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/63a3e201/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/DatePicker.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/DatePicker.as b/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/DatePicker.as
new file mode 100644
index 0000000..8d659cf
--- /dev/null
+++ b/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/DatePicker.as
@@ -0,0 +1,80 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  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.mobile
+{
+	import org.apache.flex.core.IDateChooserModel;
+	import org.apache.flex.core.UIBase;
+	import org.apache.flex.events.Event;
+	import org.apache.flex.events.IEventDispatcher;
+
+	[Event(name="selectedDateChanged", type="org.apache.flex.events.Event")]
+
+	/**
+	 *  The DatePicker presents a control for picking a date. 
+	 *  
+	 *  @langversion 3.0
+	 *  @playerversion Flash 10.2
+	 *  @playerversion AIR 2.6
+	 *  @productversion FlexJS 0.0
+	 */
+	public class DatePicker extends UIBase
+	{
+		/**
+		 *  constructor.
+		 *
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10.2
+		 *  @playerversion AIR 2.6
+		 *  @productversion FlexJS 0.0
+		 */
+		public function DatePicker()
+		{
+			super();
+
+			className = "DatePicker";
+
+			setWidthAndHeight(120, 60, true);
+			selectedDate = new Date();
+
+			IEventDispatcher(model).addEventListener("selectedDateChanged",handleDateChange);
+		}
+
+		/**
+		 *  The date selected or set.
+		 *
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10.2
+		 *  @playerversion AIR 2.6
+		 *  @productversion FlexJS 0.0
+		 */
+		public function get selectedDate():Date
+		{
+			return IDateChooserModel(model).selectedDate;
+		}
+		public function set selectedDate(value:Date):void
+		{
+			IDateChooserModel(model).selectedDate = value;
+		}
+
+		private function handleDateChange(event:Event):void
+		{
+			dispatchEvent(new Event("selectedDateChanged"));
+		}
+	}
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/63a3e201/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/DatePickerView.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/DatePickerView.as b/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/DatePickerView.as
new file mode 100644
index 0000000..6be8544
--- /dev/null
+++ b/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/DatePickerView.as
@@ -0,0 +1,187 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  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.mobile.beads
+{
+	//import flash.events.Event;
+
+	import org.apache.flex.core.BeadViewBase;
+	import org.apache.flex.core.IBeadView;
+	import org.apache.flex.core.IDateChooserModel;
+	import org.apache.flex.core.IStrand;
+	import org.apache.flex.core.UIBase;
+	import org.apache.flex.events.Event;
+	import org.apache.flex.events.IEventDispatcher;
+
+	import org.apache.flex.html.beads.models.RangeModelExtended;
+	import org.apache.flex.html.RangeStepper;
+	import org.apache.flex.html.beads.RangeStepperView;
+
+	/**
+	 *  The DatePickerView bead creates the visual elements of the DatePicker. This
+	 *  is a set of three RangeSteppers (one each for month, day, and year). 
+	 *  
+	 *  @langversion 3.0
+	 *  @playerversion Flash 10.2
+	 *  @playerversion AIR 2.6
+	 *  @productversion FlexJS 0.0
+	 */
+	public class DatePickerView extends BeadViewBase implements IBeadView
+	{
+		/**
+		 *  constructor.
+		 *
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10.2
+		 *  @playerversion AIR 2.6
+		 *  @productversion FlexJS 0.0
+		 */
+		public function DatePickerView()
+		{
+			super();
+		}
+
+		private var _monthStepper:RangeStepper;
+		private var _dayStepper:RangeStepper;
+		private var _yearStepper:RangeStepper;
+
+		private function monthValue(model:RangeModelExtended, index:Number):String
+		{
+			var dayModel:IDateChooserModel = _strand.getBeadByType(IDateChooserModel) as IDateChooserModel;
+			return String(dayModel.monthNames[index]);
+		}
+
+		private function dayValue(model:RangeModelExtended, index:Number):String
+		{
+			return String(index);
+		}
+
+		private function yearValue(model:RangeModelExtended, index:Number):String
+		{
+			return String(index);
+		}
+
+		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
+		 */
+		override public function set strand(value:IStrand):void
+		{
+			super.strand = value;
+			_strand = value;
+
+			var host:UIBase = _strand as UIBase;
+			var model:IDateChooserModel = _strand.getBeadByType(IDateChooserModel) as IDateChooserModel;
+			var today:Date = model.selectedDate;
+
+			var third:int = int(host.width/3.0)
+
+			_monthStepper = new RangeStepper();
+			_monthStepper.className = host.className+"_Month";
+			_monthStepper.addBead(new RangeModelExtended());
+			_monthStepper.addBead(new RangeStepperView());
+			(_monthStepper.model as RangeModelExtended).labelFunction = monthValue;
+			(_monthStepper.model as RangeModelExtended).minimum = 0;
+			(_monthStepper.model as RangeModelExtended).maximum = 11;
+			(_monthStepper.model as RangeModelExtended).value = today.getMonth();
+			_monthStepper.setWidthAndHeight(third,host.height);
+			host.addElement(_monthStepper);
+
+			_dayStepper = new RangeStepper();
+			_dayStepper.className = host.className+"_Day";
+			_dayStepper.addBead(new RangeModelExtended());
+			_dayStepper.addBead(new RangeStepperView());
+			(_dayStepper.model as RangeModelExtended).labelFunction = dayValue;
+			(_dayStepper.model as RangeModelExtended).minimum = 1;
+			(_dayStepper.model as RangeModelExtended).maximum = 31;
+			(_dayStepper.model as RangeModelExtended).value = today.getDate();
+			_dayStepper.setWidthAndHeight(third,host.height);
+			host.addElement(_dayStepper);
+
+			_yearStepper = new RangeStepper();
+			_yearStepper.className = host.className+"_Year";
+			_yearStepper.addBead(new RangeModelExtended());
+			_yearStepper.addBead(new RangeStepperView());
+			(_yearStepper.model as RangeModelExtended).labelFunction = yearValue;
+			(_yearStepper.model as RangeModelExtended).minimum = 1970;
+			(_yearStepper.model as RangeModelExtended).maximum = 2025;
+			(_yearStepper.model as RangeModelExtended).value = today.getFullYear();
+			_yearStepper.setWidthAndHeight(third,host.height);
+			host.addElement(_yearStepper);
+
+			setupListeners(true);
+
+			sizeChangeHandler(null);
+		}
+
+		private function setupListeners(state:Boolean):void
+		{
+			if (state) {
+				(_monthStepper.model as IEventDispatcher).addEventListener("valueChange", handleStepperChange);
+				(_dayStepper.model as IEventDispatcher).addEventListener("valueChange", handleStepperChange);
+				(_yearStepper.model as IEventDispatcher).addEventListener("valueChange", handleStepperChange);
+			}
+			else {
+				(_monthStepper.model as IEventDispatcher).removeEventListener("valueChange", handleStepperChange);
+				(_dayStepper.model as IEventDispatcher).removeEventListener("valueChange", handleStepperChange);
+				(_yearStepper.model as IEventDispatcher).removeEventListener("valueChange", handleStepperChange);
+			}
+		}
+
+		private function sizeChangeHandler(event:Event):void
+		{
+			_monthStepper.x = 0;
+			_monthStepper.y = 0;
+
+			_dayStepper.x = _monthStepper.width - 1;
+			_dayStepper.y = 0;
+
+			_yearStepper.x = _monthStepper.width + _dayStepper.width - 2;
+			_yearStepper.y = 0;
+		}
+
+		private function handleStepperChange(event:Event):void
+		{
+			var model:IDateChooserModel = _strand.getBeadByType(IDateChooserModel) as IDateChooserModel;
+
+			var newMonth:Number = _monthStepper.value;
+			var newDay:Number = _dayStepper.value;
+			var newYear:Number = _yearStepper.value;
+
+			var newDate:Date = new Date(newYear, newMonth, newDay);
+			var oldDate:Date = model.selectedDate;
+
+			if (newDate.getFullYear() != newYear || newDate.getDate() != newDay || newDate.getMonth() != newMonth) {
+				setupListeners(false);
+				_monthStepper.value = oldDate.getMonth();
+				_dayStepper.value = oldDate.getDate();
+				_yearStepper.value = oldDate.getFullYear();
+				setupListeners(true);
+			}
+			else {
+				model.selectedDate = newDate;
+			}
+		}
+	}
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/63a3e201/frameworks/projects/Mobile/src/main/resources/basic-manifest.xml
----------------------------------------------------------------------
diff --git a/frameworks/projects/Mobile/src/main/resources/basic-manifest.xml b/frameworks/projects/Mobile/src/main/resources/basic-manifest.xml
index a70352f..ddec534 100644
--- a/frameworks/projects/Mobile/src/main/resources/basic-manifest.xml
+++ b/frameworks/projects/Mobile/src/main/resources/basic-manifest.xml
@@ -27,4 +27,5 @@
     <component id="ToolBar" class="org.apache.flex.mobile.chrome.ToolBar" />
     <component id="TabBar" class="org.apache.flex.mobile.chrome.TabBar" />
     <component id="ToggleSwitch" class="org.apache.flex.mobile.ToggleSwitch" />
+    <component id="DatePicker" class="org.apache.flex.mobile.DatePicker" />
 </componentPackage>

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/63a3e201/frameworks/projects/Mobile/src/main/resources/defaults.css
----------------------------------------------------------------------
diff --git a/frameworks/projects/Mobile/src/main/resources/defaults.css b/frameworks/projects/Mobile/src/main/resources/defaults.css
index c1e2828..ddf9229 100644
--- a/frameworks/projects/Mobile/src/main/resources/defaults.css
+++ b/frameworks/projects/Mobile/src/main/resources/defaults.css
@@ -40,3 +40,26 @@ ToggleSwitch
 	width: 40px;
 	height: 25px;
 }
+
+DatePicker {
+	IBeadView: ClassReference("org.apache.flex.mobile.beads.DatePickerView");
+	IBeadModel: ClassReference("org.apache.flex.html.beads.models.DateChooserModel");
+}
+		
+.DatePicker_Month {
+	IBeadView: ClassReference("org.apache.flex.html.beads.RangeStepperView");
+	IBeadModel: ClassReference("org.apache.flex.html.beads.models.RangeModelExtended");
+	IBeadController: ClassReference("org.apache.flex.html.beads.controllers.RangeStepperMouseController");
+}
+
+.DatePicker_Day {
+	IBeadView: ClassReference("org.apache.flex.html.beads.RangeStepperView");
+	IBeadModel: ClassReference("org.apache.flex.html.beads.models.RangeModelExtended");
+	IBeadController: ClassReference("org.apache.flex.html.beads.controllers.RangeStepperMouseController");
+}
+
+.DatePicker_Year {
+	IBeadView: ClassReference("org.apache.flex.html.beads.RangeStepperView");
+	IBeadModel: ClassReference("org.apache.flex.html.beads.models.RangeModelExtended");
+	IBeadController: ClassReference("org.apache.flex.html.beads.controllers.RangeStepperMouseController");
+}