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 2018/03/27 10:16:44 UTC

[royale-asjs] branch feature/jewel-ui-set updated: some changes to slider and more refactors to example

This is an automated email from the ASF dual-hosted git repository.

carlosrovira pushed a commit to branch feature/jewel-ui-set
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git


The following commit(s) were added to refs/heads/feature/jewel-ui-set by this push:
     new 6eef867  some changes to slider and more refactors to example
6eef867 is described below

commit 6eef867719d4e65e6e4434ec1a71cce83c482b6f
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Tue Mar 27 12:13:46 2018 +0200

    some changes to slider and more refactors to example
---
 .../src/main/resources/jewel-example-styles.css    |  7 ++-
 .../royale/JewelExample/src/main/royale/App.mxml   | 31 ++-----------
 .../JewelExample/src/main/royale/MainContent.mxml  | 54 ++++++++++++++++++++++
 .../royale/org/apache/royale/jewel/CheckBox.as     |  2 -
 .../royale/org/apache/royale/jewel/RadioButton.as  |  2 -
 .../main/royale/org/apache/royale/jewel/Slider.as  | 28 ++++++++++-
 .../royale/org/apache/royale/jewel/TextField.as    |  1 -
 .../JewelTheme/src/main/resources/defaults.css     |  8 ++--
 .../themes/JewelTheme/src/main/sass/_global.sass   |  6 +--
 9 files changed, 93 insertions(+), 46 deletions(-)

diff --git a/examples/royale/JewelExample/src/main/resources/jewel-example-styles.css b/examples/royale/JewelExample/src/main/resources/jewel-example-styles.css
index c2ea379..397f472 100644
--- a/examples/royale/JewelExample/src/main/resources/jewel-example-styles.css
+++ b/examples/royale/JewelExample/src/main/resources/jewel-example-styles.css
@@ -21,8 +21,11 @@
 
 @namespace "http://www.w3.org/1999/xhtml";
 
-body{
-    background: #fff; 
+.Application
+{
+    background: #fff;
+    padding: 10px;
+	margin: 10px;
 }
 
 .container {
diff --git a/examples/royale/JewelExample/src/main/royale/App.mxml b/examples/royale/JewelExample/src/main/royale/App.mxml
index c85a8a3..72aea7c 100644
--- a/examples/royale/JewelExample/src/main/royale/App.mxml
+++ b/examples/royale/JewelExample/src/main/royale/App.mxml
@@ -21,6 +21,7 @@
 <j:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
 			   xmlns:j="library://ns.apache.org/royale/jewel"
 			   xmlns:js="library://ns.apache.org/royale/basic"
+			   xmlns:html="library://ns.apache.org/royale/html"
 			   xmlns:local="*">
 
 	<fx:Style source="../../main/resources/jewel-example-styles.css"/>
@@ -31,34 +32,10 @@
 	<js:initialView>
 		<js:View>
 			<js:beads>
-				<j:HorizontalLayoutWithPaddingAndGap gap="10"/>
+				<j:VerticalLayoutWithPaddingAndGap gap="10"/>
 			</js:beads>
-
-			<js:Group>
-				<js:beads>
-					<j:VerticalLayoutWithPaddingAndGap gap="10"/>
-				</js:beads>
-				<local:ButtonPlayGround/>
-				<local:TextButtonPlayGround/>
-			</js:Group>
-
-			<js:Group>
-				<js:beads>
-					<j:VerticalLayoutWithPaddingAndGap gap="10"/>
-				</js:beads>
-				<local:TextInputPlayGround/>
-				<local:CheckBoxPlayGround/>
-				<local:RadioButtonPlayGround/>
-				
-			</js:Group>
-
-			<js:Group>
-				<js:beads>
-					<j:VerticalLayoutWithPaddingAndGap gap="10"/>
-				</js:beads>
-				<local:SliderPlayGround/>
-				<local:HeadingsAndText/>
-			</js:Group>
+			<html:H1 text="Apache Royale Jewel UI Set Theme Showcase"/>
+			<local:MainContent/>
         </js:View>
 	</js:initialView>
 </j:Application>
diff --git a/examples/royale/JewelExample/src/main/royale/MainContent.mxml b/examples/royale/JewelExample/src/main/royale/MainContent.mxml
new file mode 100644
index 0000000..e10b472
--- /dev/null
+++ b/examples/royale/JewelExample/src/main/royale/MainContent.mxml
@@ -0,0 +1,54 @@
+<?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.
+
+-->
+<js:Group xmlns:fx="http://ns.adobe.com/mxml/2009"
+		  xmlns:js="library://ns.apache.org/royale/basic"
+		  xmlns:j="library://ns.apache.org/royale/jewel"
+          xmlns:local="*">
+    
+    <js:beads>
+        <j:HorizontalLayoutWithPaddingAndGap gap="10"/>
+    </js:beads>
+
+    <js:Group>
+        <js:beads>
+            <j:VerticalLayoutWithPaddingAndGap gap="10"/>
+        </js:beads>
+        <local:ButtonPlayGround/>
+        <local:TextButtonPlayGround/>
+    </js:Group>
+
+    <js:Group>
+        <js:beads>
+            <j:VerticalLayoutWithPaddingAndGap gap="10"/>
+        </js:beads>
+        <local:TextInputPlayGround/>
+        <local:CheckBoxPlayGround/>
+        <local:RadioButtonPlayGround/>
+    </js:Group>
+
+    <js:Group>
+        <js:beads>
+            <j:VerticalLayoutWithPaddingAndGap gap="10"/>
+        </js:beads>
+        <local:SliderPlayGround/>
+        <local:HeadingsAndText/>
+    </js:Group>
+    
+</js:Group>
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/CheckBox.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/CheckBox.as
index 5c78dbc..87d1ae4 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/CheckBox.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/CheckBox.as
@@ -99,11 +99,9 @@ package org.apache.royale.jewel
             
             input = addElementToWrapper(this,'input') as HTMLInputElement;
             input.type = 'checkbox';    
-            //input.className = 'input';
             label.appendChild(input);
             
             checkbox = document.createElement('span') as HTMLSpanElement;
-            //checkbox.className = 'span';
             label.appendChild(checkbox);
             
             positioner = label as WrappedHTMLElement;
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/RadioButton.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/RadioButton.as
index b36b51a..b0ce441 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/RadioButton.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/RadioButton.as
@@ -316,14 +316,12 @@ package org.apache.royale.jewel
             
             icon = addElementToWrapper(this,'input') as HTMLInputElement;
             icon.type = "radio";
-            //icon.className = 'input';
             icon.id = '_radio_' + + Math.random();
             label.appendChild(icon);
 
             textNode = document.createTextNode('') as Text;
 
             radio = document.createElement('span') as HTMLSpanElement;
-            //radio.className = 'span';
             radio.appendChild(textNode);
             label.appendChild(radio);
             //radio.addEventListener('mouseover', mouseOverHandler, false);
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/Slider.as
index a9ddbbe..e43a3bd 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/Slider.as
@@ -86,6 +86,12 @@ package org.apache.royale.jewel
 			super();
 
 			typeNames = "jewel slider"
+
+			IRangeModel(model).value = 0;
+			IRangeModel(model).minimum = 0;
+			IRangeModel(model).maximum = 100;
+			IRangeModel(model).stepSize = 1;
+			IRangeModel(model).snapInterval = 1;
 		}
 		
 		/**
@@ -96,6 +102,7 @@ package org.apache.royale.jewel
 		 *  @playerversion AIR 2.6
 		 *  @productversion Royale 0.8
 		 */
+		[Bindable("valueChange")]
 		public function get value():Number
 		{
 			return IRangeModel(model).value;
@@ -140,6 +147,24 @@ package org.apache.royale.jewel
 		}
 
 		/**
+		 *  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 Royale 0.0
+		 */
+		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.
 		 *
@@ -184,8 +209,7 @@ package org.apache.royale.jewel
             
             var input:HTMLInputElement = addElementToWrapper(this,'input') as HTMLInputElement;
             input.setAttribute('type', 'range');
-			//input.className = "slider";
-
+			
 			//attach input handler to dispatch royale change event when user write in textinput
             //goog.events.listen(element, 'change', killChangeHandler);
             //goog.events.listen(input, 'input', textChangeHandler);
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/TextField.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/TextField.as
index a5d5c1c..523b98d 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/TextField.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/TextField.as
@@ -82,7 +82,6 @@ package org.apache.royale.jewel
             
             input = addElementToWrapper(this,'input') as HTMLInputElement;
             input.setAttribute('type', 'text');
-            //input.className = "input";
             
             //attach input handler to dispatch royale change event when user write in textinput
             //goog.events.listen(element, 'change', killChangeHandler);
diff --git a/frameworks/themes/JewelTheme/src/main/resources/defaults.css b/frameworks/themes/JewelTheme/src/main/resources/defaults.css
index e23ebd2..1fdef9a 100644
--- a/frameworks/themes/JewelTheme/src/main/resources/defaults.css
+++ b/frameworks/themes/JewelTheme/src/main/resources/defaults.css
@@ -20,13 +20,11 @@
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
-  font-family: "Lato", sans-serif;
-  color: #808080;
 }
 
-.royale {
-  padding: 10px;
-  margin: 10px;
+.Application {
+  font-family: "Lato", sans-serif;
+  color: #808080;
 }
 
 h1 {
diff --git a/frameworks/themes/JewelTheme/src/main/sass/_global.sass b/frameworks/themes/JewelTheme/src/main/sass/_global.sass
index 89db9f5..d5c10c1 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/_global.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/_global.sass
@@ -26,15 +26,11 @@
 	-webkit-box-sizing: border-box
 	box-sizing: border-box
 	
+.Application
 	font:
 		family: $font-stack
 	color: $default-font-color
 
-	
-.royale
-	padding: 10px
-	margin: 10px
-
 h1
 	font-size: 22px
 

-- 
To stop receiving notification emails like this one, please contact
carlosrovira@apache.org.