You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@royale.apache.org by ca...@apache.org on 2019/11/13 23:11:01 UTC

[royale-asjs] branch develop updated: jewel-sliders: rename Slider to HSlider, to conform to latest VSlider addition

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 ab87c27  jewel-sliders: rename Slider to HSlider, to conform to latest VSlider addition
ab87c27 is described below

commit ab87c27b0c21aa5c3566d42e4875056df6c3057d
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Thu Nov 14 00:10:52 2019 +0100

    jewel-sliders: rename Slider to HSlider, to conform to latest VSlider addition
---
 .../src/main/royale/ButtonPlayGround.mxml          |  4 ++--
 .../src/main/royale/ComboBoxPlayGround.mxml        |  2 +-
 .../src/main/royale/LayoutsPlayGround.mxml         | 16 +++++++--------
 .../src/main/royale/SliderPlayGround.mxml          | 14 ++++++-------
 .../src/main/royale/TextInputPlayGround.mxml       |  4 ++--
 .../projects/Jewel/src/main/resources/defaults.css |  4 ++--
 .../Jewel/src/main/resources/jewel-manifest.xml    |  2 +-
 .../apache/royale/jewel/{Slider.as => HSlider.as}  |  4 ++--
 .../main/royale/org/apache/royale/jewel/VSlider.as | 16 ++++-----------
 .../beads/controllers/SliderMouseController.as     | 23 +++++++++++-----------
 .../jewel/beads/controls/slider/ISliderView.as     |  6 +++---
 .../royale/jewel/beads/models/SliderRangeModel.as  |  2 +-
 .../royale/jewel/beads/views/SliderThumbView.as    |  9 ++++++---
 .../royale/jewel/beads/views/SliderTrackView.as    | 14 +++++++------
 .../apache/royale/jewel/beads/views/SliderView.as  | 12 +++--------
 .../Jewel/src/main/sass/components/_slider.sass    |  8 ++++----
 .../src/main/sass/components-primary/_slider.sass  |  4 ++--
 17 files changed, 68 insertions(+), 76 deletions(-)

diff --git a/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml b/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml
index 3a50dce..456ea88 100644
--- a/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml
@@ -131,8 +131,8 @@ limitations under the License.
 					<j:Button id="reizableButton" text="Resize {slider_w.value}x{slider_h.value}" emphasis="{Button.PRIMARY}"/>
 					<j:Button text="check layout"/>
 				</j:HGroup>
-				<j:Slider id="slider_w" width="350" value="96" minimum="10" maximum="350" valueChange="onValueChange(event)"/>
-				<j:Slider id="slider_h" width="350" value="38" minimum="10" maximum="350" valueChange="onValueChange(event)"/>
+				<j:HSlider id="slider_w" width="350" value="96" minimum="10" maximum="350" valueChange="onValueChange(event)"/>
+				<j:HSlider id="slider_h" width="350" value="38" minimum="10" maximum="350" valueChange="onValueChange(event)"/>
 				<j:Label text="Resize button to: '{reizableButton.width}x{reizableButton.height}'"/>
 			</j:Card>
 		</j:GridCell>
diff --git a/examples/royale/TourDeJewel/src/main/royale/ComboBoxPlayGround.mxml b/examples/royale/TourDeJewel/src/main/royale/ComboBoxPlayGround.mxml
index 214cf59..cf3d558 100644
--- a/examples/royale/TourDeJewel/src/main/royale/ComboBoxPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/ComboBoxPlayGround.mxml
@@ -145,7 +145,7 @@ limitations under the License.
 					<j:Label text="Width: {cmb.width}px"/>
 				</j:HGroup>
 
-				<j:Slider id="slider_w" width="250" value="200" minimum="100" maximum="400" valueChange="onValueChange(event)"/>
+				<j:HSlider id="slider_w" width="250" value="200" minimum="100" maximum="400" valueChange="onValueChange(event)"/>
 
 			</j:Card>
 		</j:GridCell>
diff --git a/examples/royale/TourDeJewel/src/main/royale/LayoutsPlayGround.mxml b/examples/royale/TourDeJewel/src/main/royale/LayoutsPlayGround.mxml
index f5da621..1a57d31 100644
--- a/examples/royale/TourDeJewel/src/main/royale/LayoutsPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/LayoutsPlayGround.mxml
@@ -61,7 +61,7 @@ limitations under the License.
 					<j:Button text="0" />
 				</j:HGroup>
 
-				<j:Slider width="200" value="3" minimum="0" maximum="10" valueChange="hg.gap = event.target.value"/>
+				<j:HSlider width="200" value="3" minimum="0" maximum="10" valueChange="hg.gap = event.target.value"/>
 			</j:Card>
 		</j:GridCell>
 		<j:GridCell desktopNumerator="1" desktopDenominator="3" tabletNumerator="1" tabletDenominator="3" phoneNumerator="1" phoneDenominator="1">
@@ -75,7 +75,7 @@ limitations under the License.
 					<j:Button text="0"/>
 				</j:VGroup>
 
-				<j:Slider width="200" value="3" minimum="0" maximum="10" valueChange="vg.gap = event.target.value"/>
+				<j:HSlider width="200" value="3" minimum="0" maximum="10" valueChange="vg.gap = event.target.value"/>
 			</j:Card>
 		</j:GridCell>
 	</j:Grid>
@@ -94,7 +94,7 @@ limitations under the License.
 					<j:Button text="0" />
 				</j:Group>
 
-				<j:Slider width="200" value="3" minimum="0" maximum="10" valueChange="hcl.gap = event.target.value"/>
+				<j:HSlider width="200" value="3" minimum="0" maximum="10" valueChange="hcl.gap = event.target.value"/>
 
 			</j:Card>
 		</j:GridCell>
@@ -113,7 +113,7 @@ limitations under the License.
 					<j:Button text="0" />
 				</j:Group>
 
-				<j:Slider width="200" value="3" minimum="0" maximum="10" valueChange="vcl.gap = event.target.value"/>
+				<j:HSlider width="200" value="3" minimum="0" maximum="10" valueChange="vcl.gap = event.target.value"/>
 
 			</j:Card>
 		</j:GridCell>
@@ -134,7 +134,7 @@ limitations under the License.
 					<j:Button text="0" width="60"/>
 				</j:Group>
 
-				<j:Slider width="200" value="3" minimum="0" maximum="10" valueChange="hfl.gap = event.target.value"/>
+				<j:HSlider width="200" value="3" minimum="0" maximum="10" valueChange="hfl.gap = event.target.value"/>
 
 			</j:Card>
 		</j:GridCell>
@@ -153,7 +153,7 @@ limitations under the License.
 					<j:Button text="0" width="60"/>
 				</j:Group>
 
-				<j:Slider width="200" value="3" minimum="0" maximum="10" valueChange="vfl.gap = event.target.value"/>
+				<j:HSlider width="200" value="3" minimum="0" maximum="10" valueChange="vfl.gap = event.target.value"/>
 
 			</j:Card>
 		</j:GridCell>
@@ -169,7 +169,7 @@ limitations under the License.
 					<j:Button text="0" />
 				</j:HGroup>
 				
-				<j:Slider width="200" value="3" minimum="0" maximum="10" valueChange="hg.gap = event.target.value"/>
+				<j:HSlider width="200" value="3" minimum="0" maximum="10" valueChange="hg.gap = event.target.value"/>
 			</j:Card>
 		</j:GridCell> -->
 
@@ -184,7 +184,7 @@ limitations under the License.
 					<j:Button text="0"/>
 				</j:VGroup>
 
-				<j:Slider width="200" value="3" minimum="0" maximum="10" valueChange="vg.gap = event.target.value"/>
+				<j:HSlider width="200" value="3" minimum="0" maximum="10" valueChange="vg.gap = event.target.value"/>
 			</j:Card>
 		</j:GridCell> -->
 	</j:Grid>
diff --git a/examples/royale/TourDeJewel/src/main/royale/SliderPlayGround.mxml b/examples/royale/TourDeJewel/src/main/royale/SliderPlayGround.mxml
index e57308e..34fc934 100644
--- a/examples/royale/TourDeJewel/src/main/royale/SliderPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/SliderPlayGround.mxml
@@ -82,18 +82,18 @@ limitations under the License.
 		<j:HorizontalCenteredLayout gap="3"/>
 	</j:beads>
 	<j:Card width="450">
-		<html:H3 text="Jewel Slider"/>
+		<html:H3 text="Jewel HSlider"/>
 
-		<j:Slider localId="slider_w" width="250" value="250" minimum="100" maximum="420" change="onChange(event)" input="onInput(event)" valueChange="onValueChange(event)"/>
-		<j:Slider localId="slider_h" width="250" value="80" minimum="40" maximum="300" change="onChange(event)" input="onInput(event)" valueChange="onValueChange(event)"/>
+		<j:HSlider localId="slider_w" width="250" value="250" minimum="100" maximum="420" change="onChange(event)" input="onInput(event)" valueChange="onValueChange(event)"/>
+		<j:HSlider localId="slider_h" width="250" value="80" minimum="40" maximum="300" change="onChange(event)" input="onInput(event)" valueChange="onValueChange(event)"/>
 
-		<j:Slider localId="slider_dis" width="250" value="70" minimum="0" maximum="100">
+		<j:HSlider localId="slider_dis" width="250" value="70" minimum="0" maximum="100">
 			<j:beads>
 				<j:Disabled/>
 			</j:beads>
-		</j:Slider>
+		</j:HSlider>
 
-		<j:Button localId="button1" text="Slider to 400x200" width="250" height="80" emphasis="{Button.PRIMARY}" click="clickHandler(event)"/>
+		<j:Button localId="button1" text="HSlider to 400x200" width="250" height="80" emphasis="{Button.PRIMARY}" click="clickHandler(event)"/>
 
 	</j:Card>
 	<j:Card width="350" height="400">
@@ -106,7 +106,7 @@ limitations under the License.
 					<j:Disabled/>
 				</j:beads>
 			</j:VSlider>
-			<j:Button localId="button2" text="Slider to 190x160" width="150" height="80" emphasis="{Button.PRIMARY}" click="clickHandler(event)"/>
+			<j:Button localId="button2" text="VSlider to 190x160" width="150" height="80" emphasis="{Button.PRIMARY}" click="clickHandler(event)"/>
 		</j:HGroup>
 	</j:Card>
 </j:Group>
diff --git a/examples/royale/TourDeJewel/src/main/royale/TextInputPlayGround.mxml b/examples/royale/TourDeJewel/src/main/royale/TextInputPlayGround.mxml
index b115f6c..2004e8f 100644
--- a/examples/royale/TourDeJewel/src/main/royale/TextInputPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/TextInputPlayGround.mxml
@@ -85,13 +85,13 @@ limitations under the License.
 				<j:HGroup gap="3" itemsVerticalAlign="itemsSameHeight">
 					<j:TextInput id="textinput">
 						<j:beads>
-							<j:TextPrompt prompt="Slider resize..."/>
+							<j:TextPrompt prompt="HSlider resize..."/>
 						</j:beads>
 					</j:TextInput>
 					<j:Label text="A label to check layout"/>
 				</j:HGroup>
 
-				<j:Slider id="slider_w" width="350" value="211" minimum="10" maximum="350" valueChange="onValueChange(event)"/>
+				<j:HSlider id="slider_w" width="350" value="211" minimum="10" maximum="350" valueChange="onValueChange(event)"/>
 				<j:Label text="textinput.width='{textinput.width}'"/>
 
 				<j:VGroup gap="3">
diff --git a/frameworks/projects/Jewel/src/main/resources/defaults.css b/frameworks/projects/Jewel/src/main/resources/defaults.css
index cf86acc..1f73c2c 100644
--- a/frameworks/projects/Jewel/src/main/resources/defaults.css
+++ b/frameworks/projects/Jewel/src/main/resources/defaults.css
@@ -3434,14 +3434,14 @@ j|ScrollableSectionContent {
   padding: 0;
 }
 
-j|Slider {
+j|HSlider {
   IBeadModel: ClassReference("org.apache.royale.jewel.beads.models.SliderRangeModel");
   IBeadView: ClassReference("org.apache.royale.jewel.beads.views.SliderView");
   IBeadController: ClassReference("org.apache.royale.jewel.beads.controllers.SliderMouseController");
 }
 
 @media -royale-swf {
-  j|Slider {
+  j|HSlider {
     iThumbView: ClassReference("org.apache.royale.jewel.beads.views.SliderThumbView");
     iTrackView: ClassReference("org.apache.royale.jewel.beads.views.SliderTrackView");
   }
diff --git a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
index 15dfe4a..ecb6a12 100644
--- a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
+++ b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
@@ -54,7 +54,7 @@
     <component id="TextArea" class="org.apache.royale.jewel.TextArea"/>
     <component id="Spinner" class="org.apache.royale.jewel.Spinner" />
     <component id="NumericStepper" class="org.apache.royale.jewel.NumericStepper" />
-    <component id="Slider" class="org.apache.royale.jewel.Slider"/>
+    <component id="HSlider" class="org.apache.royale.jewel.HSlider"/>
     <component id="VSlider" class="org.apache.royale.jewel.VSlider"/>
     <component id="RadioButton" class="org.apache.royale.jewel.RadioButton"/>
     <component id="CheckBox" class="org.apache.royale.jewel.CheckBox"/>
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/Slider.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/HSlider.as
similarity index 98%
rename from frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/Slider.as
rename to frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/HSlider.as
index b32e955..02f0185 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/Slider.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/HSlider.as
@@ -77,7 +77,7 @@ package org.apache.royale.jewel
 	 *  @playerversion AIR 2.6
 	 *  @productversion Royale 0.9.4
 	 */
-	public class Slider extends StyledUIBase
+	public class HSlider extends StyledUIBase
 	{
 		/**
 		 *  constructor.
@@ -87,7 +87,7 @@ package org.apache.royale.jewel
 		 *  @playerversion AIR 2.6
 		 *  @productversion Royale 0.9.4
 		 */
-		public function Slider()
+		public function HSlider()
 		{
 			super();
 
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/VSlider.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/VSlider.as
index 6f22fe6..344ef3f 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/VSlider.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/VSlider.as
@@ -18,27 +18,19 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel
 {
-
-
     COMPILE::JS
     {
 	import org.apache.royale.core.WrappedHTMLElement;
 	import org.apache.royale.html.util.addElementToWrapper;
 	import org.apache.royale.utils.transparentPixelElement;
     }
-
-	//--------------------------------------
-    //  Events
-    //--------------------------------------
-
 	
-
 	/**
 	 *  The VSlider class is a component that displays a range of values using a
-	 *  track and a thumb control vertically. The Slider uses the following bead types:
+	 *  track and a thumb control vertically. The VSlider uses the following bead types:
 	 *
-	 *  org.apache.royale.core.IBeadModel: the data model, typically an IRangeModel, that holds the Slider values.
-	 *  org.apache.royale.core.IBeadView:  the bead that constructs the visual parts of the Slider.
+	 *  org.apache.royale.core.IBeadModel: the data model, typically an IRangeModel, that holds the VSlider values.
+	 *  org.apache.royale.core.IBeadView:  the bead that constructs the visual parts of the VSlider.
 	 *  org.apache.royale.core.IBeadController: the bead that handles input.
 	 *  org.apache.royale.core.IThumbValue: the bead responsible for the display of the thumb control.
 	 *  org.apache.royale.core.ITrackView: the bead responsible for the display of the track.
@@ -49,7 +41,7 @@ package org.apache.royale.jewel
 	 *  @playerversion AIR 2.6
 	 *  @productversion Royale 0.9.4
 	 */
-	public class VSlider extends Slider
+	public class VSlider extends HSlider
 	{
 		/**
 		 *  constructor.
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controllers/SliderMouseController.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controllers/SliderMouseController.as
index 3d2952c..43b51f1 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controllers/SliderMouseController.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controllers/SliderMouseController.as
@@ -29,20 +29,21 @@ package org.apache.royale.jewel.beads.controllers
 	import org.apache.royale.events.ValueChangeEvent;
 	import org.apache.royale.geom.Point;
 	import org.apache.royale.jewel.beads.controls.slider.ISliderView;
-    import org.apache.royale.jewel.beads.views.SliderView;
-    import org.apache.royale.jewel.Slider;
 
     COMPILE::JS
     {
         import goog.events;
         import goog.events.EventType;
+
         import org.apache.royale.events.BrowserEvent;
+        import org.apache.royale.jewel.HSlider;
+        import org.apache.royale.jewel.beads.views.SliderView;
     }
 	
 	/**
 	 *  The SliderMouseController class bead handles mouse events on the 
-	 *  org.apache.royale.jewel.Slider's component parts (thumb and track) and 
-	 *  dispatches change events on behalf of the Slider (as well as co-ordinating visual 
+	 *  org.apache.royale.jewel.HSlider's component parts (thumb and track) and 
+	 *  dispatches change events on behalf of the HSlider (as well as co-ordinating visual 
 	 *  changes (such as moving the thumb when the track has been tapped or clicked). Use
 	 *  this controller for horizontally oriented Sliders.
 	 *  
@@ -169,7 +170,7 @@ package org.apache.royale.jewel.beads.controllers
         COMPILE::JS
         private function handleChange(event:BrowserEvent):void
         {
-            var host:Slider = _strand as Slider;
+            var host:HSlider = _strand as HSlider;
 
             rangeModel.value = Number((UIBase(_strand).element as HTMLInputElement).value);
 
@@ -189,7 +190,7 @@ package org.apache.royale.jewel.beads.controllers
         COMPILE::JS
         private function handleInput(event:BrowserEvent):void
         {
-            var host:Slider = _strand as Slider;
+            var host:HSlider = _strand as HSlider;
 
             rangeModel.value = Number((UIBase(_strand).element as HTMLInputElement).value);
 
@@ -280,7 +281,7 @@ package org.apache.royale.jewel.beads.controllers
         private function handleTrackClick(event:MouseEvent):void
         {
 			var bevent:BrowserEvent = event["wrappedEvent"] as BrowserEvent;
-            var host:Slider = _strand as Slider;
+            var host:HSlider = _strand as HSlider;
             var xloc:Number = bevent.offsetX;
 			var useWidth:Number = parseInt(track.element.style.width, 10) * 1.0;
             var p:Number = xloc / useWidth;
@@ -300,7 +301,7 @@ package org.apache.royale.jewel.beads.controllers
         // private function handleThumbDown(event:MouseEvent):void
         // {
 		// 	var bevent:BrowserEvent = event["wrappedEvent"] as BrowserEvent;
-        //     var host:Slider = _strand as Slider;
+        //     var host:HSlider = _strand as HSlider;
         //     goog.events.listen(host.element, goog.events.EventType.MOUSEUP,
         //         handleThumbUp, false, this);
         //     goog.events.listen(host.element, goog.events.EventType.MOUSEMOVE,
@@ -325,7 +326,7 @@ package org.apache.royale.jewel.beads.controllers
         // private function handleThumbUp(event:MouseEvent):void
         // {
 		// 	var bevent:BrowserEvent = event["wrappedEvent"] as BrowserEvent;
-        //     var host:Slider = _strand as Slider;
+        //     var host:HSlider = _strand as HSlider;
         //     goog.events.unlisten(host.element, goog.events.EventType.MOUSEUP,
         //         handleThumbUp, false, this);
         //     goog.events.unlisten(host.element, goog.events.EventType.MOUSEMOVE,
@@ -347,7 +348,7 @@ package org.apache.royale.jewel.beads.controllers
         // private function handleThumbMove(event:MouseEvent):void
         // {
 		// 	var bevent:BrowserEvent = event["wrappedEvent"] as BrowserEvent;
-        //     var host:Slider = _strand as Slider;
+        //     var host:HSlider = _strand as HSlider;
         //     var lastValue:Number = rangeModel.value;
         //     calcValFromMousePosition(bevent, false);
             
@@ -359,7 +360,7 @@ package org.apache.royale.jewel.beads.controllers
 		// COMPILE::JS
 		// private function handleThumbLeave(event:MouseEvent):void
 		// {
-		// 	var host:Slider = _strand as Slider;
+		// 	var host:HSlider = _strand as HSlider;
 		// 	goog.events.unlisten(host.element, goog.events.EventType.MOUSEUP,
 		// 		handleThumbUp, false, this);
 		// 	goog.events.unlisten(host.element, goog.events.EventType.MOUSEMOVE,
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/slider/ISliderView.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/slider/ISliderView.as
index 07ae397..e2bbab8 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/slider/ISliderView.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/slider/ISliderView.as
@@ -23,7 +23,7 @@ package org.apache.royale.jewel.beads.controls.slider
 	
 	/**
 	 *  The ISliderView interface provides the protocol for any bead that
-	 *  creates the visual parts for a org.apache.royale.html.Slider control.
+	 *  creates the visual parts for a org.apache.royale.jewel.HSlider control.
 	 *  
 	 *  @langversion 3.0
 	 *  @playerversion Flash 10.2
@@ -33,7 +33,7 @@ package org.apache.royale.jewel.beads.controls.slider
 	public interface ISliderView extends IBead
 	{
 		/**
-		 *  The component used for the track area of the org.apache.royale.html.Slider.
+		 *  The component used for the track area of the org.apache.royale.jewel.HSlider.
 		 *
 		 *  @langversion 3.0
 		 *  @playerversion Flash 10.2
@@ -43,7 +43,7 @@ package org.apache.royale.jewel.beads.controls.slider
 		function get track():IUIBase;
 		
 		/**
-		 *  The component used for the thumb button of the org.apache.royale.html.Slider.
+		 *  The component used for the thumb button of the org.apache.royale.jewel.HSlider.
 		 *
 		 *  @langversion 3.0
 		 *  @playerversion Flash 10.2
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/models/SliderRangeModel.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/models/SliderRangeModel.as
index af2dc82..d89e9c3 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/models/SliderRangeModel.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/models/SliderRangeModel.as
@@ -21,8 +21,8 @@ package org.apache.royale.jewel.beads.models
     import org.apache.royale.core.IBead;
     import org.apache.royale.core.IRangeModel;
     import org.apache.royale.core.IStrand;
-    import org.apache.royale.events.EventDispatcher;
     import org.apache.royale.events.Event;
+    import org.apache.royale.events.EventDispatcher;
     import org.apache.royale.events.ValueChangeEvent;
 
     /**
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/SliderThumbView.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/SliderThumbView.as
index 5b38bea..83d6172 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/SliderThumbView.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/SliderThumbView.as
@@ -18,21 +18,24 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.views
 {
+	COMPILE::SWF
+	{
 	import flash.display.Graphics;
 	import flash.display.Shape;
 	import flash.display.SimpleButton;
+	}
 
     import org.apache.royale.core.BeadViewBase;
     import org.apache.royale.core.IBeadView;
+    import org.apache.royale.core.IChild;
     import org.apache.royale.core.IStrand;
-	import org.apache.royale.jewel.Button;
     import org.apache.royale.events.Event;
     import org.apache.royale.events.IEventDispatcher;
-    import org.apache.royale.core.IChild;
+    import org.apache.royale.jewel.Button;
 	
 	/**
 	 *  The SliderThumbView class creates the draggable input element for the 
-	 *  org.apache.royale.jewel.Slider component.
+	 *  org.apache.royale.jewel.HSlider component.
 	 *  
 	 *  @viewbead
 	 *  @langversion 3.0
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/SliderTrackView.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/SliderTrackView.as
index d1e34bd..e76ba4f 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/SliderTrackView.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/SliderTrackView.as
@@ -18,21 +18,23 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.views
 {
+	COMPILE::SWF
+	{
 	import flash.display.Graphics;
 	import flash.display.Shape;
-	import flash.display.SimpleButton;			
-	
+	import flash.display.SimpleButton;
+	}
+
 	import org.apache.royale.core.BeadViewBase;
 	import org.apache.royale.core.IBeadView;
+	import org.apache.royale.core.IChild;
 	import org.apache.royale.core.IStrand;
-	import org.apache.royale.core.UIBase;
-	import org.apache.royale.jewel.Button;
 	import org.apache.royale.events.Event;
 	import org.apache.royale.events.IEventDispatcher;
-	import org.apache.royale.core.IChild;
+	import org.apache.royale.jewel.Button;
 	
 	/**
-	 *  The SliderTrackView class creates the track area for the org.apache.royale.jewel.Slider
+	 *  The SliderTrackView class creates the track area for the org.apache.royale.jewel.HSlider
 	 *  component.
 	 *  
 	 *  @viewbead
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/SliderView.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/SliderView.as
index 0569d29..61bc23a 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/SliderView.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/SliderView.as
@@ -18,12 +18,6 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.views
 {
-	COMPILE::SWF {
-		import flash.display.DisplayObject;
-		import flash.display.Sprite;
-	}
-	
-    import org.apache.royale.jewel.beads.controls.slider.ISliderView;
     import org.apache.royale.core.BeadViewBase;
     import org.apache.royale.core.IBead;
     import org.apache.royale.core.IBeadModel;
@@ -35,12 +29,12 @@ package org.apache.royale.jewel.beads.views
     import org.apache.royale.core.ValuesManager;
     import org.apache.royale.events.Event;
     import org.apache.royale.events.IEventDispatcher;
-	import org.apache.royale.events.ValueChangeEvent;
     import org.apache.royale.jewel.Button;
+    import org.apache.royale.jewel.beads.controls.slider.ISliderView;
 	
 	/**
-	 *  The SliderView class creates the visual elements of the org.apache.royale.jewel.Slider 
-	 *  component. The Slider has a track and a thumb control which are also created with view beads.
+	 *  The SliderView class creates the visual elements of the org.apache.royale.jewel.HSlider 
+	 *  component. The HSlider has a track and a thumb control which are also created with view beads.
 	 *  
 	 *  @viewbead
 	 *  @langversion 3.0
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_slider.sass b/frameworks/projects/Jewel/src/main/sass/components/_slider.sass
index bb4c187..6f319b0 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_slider.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_slider.sass
@@ -17,9 +17,9 @@
 //
 ////////////////////////////////////////////////////////////////////////////////
 
-// Jewel Slider
+// Jewel HSlider
 
-// Slider variables
+// HSlider variables
 $slider-margin: 20px
 $slider-padding: 0
 $slider-min-width: calc(100% - #{2 * $slider-margin})
@@ -117,7 +117,7 @@ $slider-container-height: #{$slider-thumb-size + round($slider-thumb-size/2)}
 	padding: 0
 
 
-j|Slider
+j|HSlider
 	IBeadModel: ClassReference("org.apache.royale.jewel.beads.models.SliderRangeModel")
 	IBeadView:  ClassReference("org.apache.royale.jewel.beads.views.SliderView")
 	//IBeadLayout: ClassReference("org.apache.royale.html.beads.layouts.HorizontalSliderLayout")
@@ -131,7 +131,7 @@ j|Slider
 //	border-radius: 15px
 
 @media -royale-swf
-	j|Slider
+	j|HSlider
 		iThumbView: ClassReference("org.apache.royale.jewel.beads.views.SliderThumbView")
 		iTrackView: ClassReference("org.apache.royale.jewel.beads.views.SliderTrackView")
 
diff --git a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_slider.sass b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_slider.sass
index f59a358..3ca9c45 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_slider.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_slider.sass
@@ -17,9 +17,9 @@
 //
 ////////////////////////////////////////////////////////////////////////////////
 
-// Jewel Slider
+// Jewel HSlider
 
-// Slider variables
+// HSlider variables
 $slider-thumb-size: 18px // TODO (carlos_rovira) this is as well part of structure, need revision
 $slider-track-border-radius: 3px
 $slider-border-radius: 50%