You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@flex.apache.org by ah...@apache.org on 2015/07/28 20:40:54 UTC
[28/36] git commit: [flex-asjs] [refs/heads/develop] - fix ability to
swap component sets
fix ability to swap component sets
Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo
Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/892562ec
Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/892562ec
Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/892562ec
Branch: refs/heads/develop
Commit: 892562ec70c4e9466e3d1de7d1ae85e98a81b303
Parents: 2c5501c
Author: Alex Harui <ah...@apache.org>
Authored: Mon Jul 27 15:36:41 2015 -0700
Committer: Alex Harui <ah...@apache.org>
Committed: Mon Jul 27 15:36:41 2015 -0700
----------------------------------------------------------------------
examples/DataBindingTest/build.xml | 1 +
examples/DataBindingTest/src/MyInitialView.mxml | 2 +-
examples/build_example.xml | 14 +
frameworks/projects/Flat/as/defaults.css | 11 +-
.../apache/flex/flat/beads/DropDownListView.as | 1 +
frameworks/projects/Flat/flat-manifest.xml | 2 +
frameworks/projects/HTML/as/defaults.css | 372 +------------------
.../apache/flex/html/beads/DropDownListView.as | 102 ++---
.../html/supportClasses/DropDownListList.as | 1 -
.../js/src/org/apache/flex/html/CheckBox.js | 67 +---
.../js/src/org/apache/flex/html/DropDownList.js | 155 ++------
.../js/src/org/apache/flex/html/RadioButton.js | 50 +--
12 files changed, 142 insertions(+), 636 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/892562ec/examples/DataBindingTest/build.xml
----------------------------------------------------------------------
diff --git a/examples/DataBindingTest/build.xml b/examples/DataBindingTest/build.xml
index 9c551dd..7169be7 100644
--- a/examples/DataBindingTest/build.xml
+++ b/examples/DataBindingTest/build.xml
@@ -22,6 +22,7 @@
<project name="databindingtest" default="main" basedir=".">
<property name="FLEXJS_HOME" location="../.."/>
<property name="example" value="DataBindingTest" />
+ <property name="theme_arg" value="-theme=${FLEXJS_HOME}/frameworks/libs/Flat.swc" />
<property file="${FLEXJS_HOME}/env.properties"/>
<property environment="env"/>
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/892562ec/examples/DataBindingTest/src/MyInitialView.mxml
----------------------------------------------------------------------
diff --git a/examples/DataBindingTest/src/MyInitialView.mxml b/examples/DataBindingTest/src/MyInitialView.mxml
index a7d92f1..b153ba5 100644
--- a/examples/DataBindingTest/src/MyInitialView.mxml
+++ b/examples/DataBindingTest/src/MyInitialView.mxml
@@ -125,7 +125,7 @@ limitations under the License.
<js:beads>
<js:VerticalLayout />
</js:beads>
- <js:DropDownList id="list" width="100" height="43"
+ <js:DropDownList id="list" width="100"
change="_symbol = list.selectedItem as String; dispatchEvent(new CustomEvent('listChanged'))"
dataProvider="{MyModel(applicationModel).strings}" />
<js:RadioButton id="radio1" text="Price" value="Ask" groupName="group1" change="radioChanged(event)"/>
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/892562ec/examples/build_example.xml
----------------------------------------------------------------------
diff --git a/examples/build_example.xml b/examples/build_example.xml
index a8a5973..81a263e 100644
--- a/examples/build_example.xml
+++ b/examples/build_example.xml
@@ -31,12 +31,16 @@
<!-- Load the <compc> task. We can't do this at the <project> level -->
<!-- because targets that run before flexTasks.jar gets built would fail. -->
<taskdef resource="flexTasks.tasks" classpathref="lib.path"/>
+ <!-- this is a dummy var placeholder in case some example needs to define a theme
+ then they would set theme_arg=-theme=<path to theme> -->
+ <property name="theme_arg" value="-define=CONFIG::theme,false" />
<mxmlc fork="true"
file="${basedir}/src/${example}.mxml"
output="${basedir}/bin-debug/${example}.swf">
<jvmarg line="${mxmlc.jvm.args}"/>
<arg value="+flexlib=${basedir}/frameworks" />
<arg value="-debug" />
+ <arg value="${theme_arg}" />
<arg value="-compiler.mxml.children-as-data" />
<arg value="-compiler.binding-value-change-event=org.apache.flex.events.ValueChangeEvent" />
<arg value="-compiler.binding-value-change-event-kind=org.apache.flex.events.ValueChangeEvent" />
@@ -75,6 +79,7 @@
<!-- Load the <compc> task. We can't do this at the <project> level -->
<!-- because targets that run before flexTasks.jar gets built would fail. -->
<taskdef resource="flexTasks.tasks" classpathref="lib.path"/>
+ <property name="theme_arg" value="-define=CONFIG::theme,false" />
<mxmlc fork="true"
file="${basedir}/src/${example}.mxml"
output="${basedir}/bin-debug/${example}.swf">
@@ -82,6 +87,7 @@
<arg value="+flexlib=${basedir}/frameworks" />
<arg value="+configname=air" />
<arg value="-debug" />
+ <arg value="${theme_arg}" />
<arg value="-target-player=${playerglobal.version}" />
<arg value="-swf-version=${swf.version}" />
<arg value="-compiler.mxml.children-as-data" />
@@ -111,12 +117,14 @@
<!-- Load the <compc> task. We can't do this at the <project> level -->
<!-- because targets that run before flexTasks.jar gets built would fail. -->
<taskdef resource="flexTasks.tasks" classpathref="lib.path"/>
+ <property name="theme_arg" value="-define=CONFIG::theme,false" />
<mxmlc fork="true"
file="${basedir}/src/${example}.as"
output="${basedir}/bin-debug/${example}.swf">
<jvmarg line="${mxmlc.jvm.args}"/>
<arg value="+flexlib=${basedir}/frameworks" />
<arg value="-debug" />
+ <arg value="${theme_arg}" />
<arg value="-define=CONFIG::as_only,true" />
<arg value="-define=CONFIG::js_only,false" />
<arg value="-compiler.mxml.children-as-data" />
@@ -144,6 +152,7 @@
<echo message="FLEX_HOME: ${FLEX_HOME}"/>
<echo message="FALCONJX_HOME: ${FALCONJX_HOME}"/>
<echo message="GOOG_HOME: ${GOOG_HOME}"/>
+ <property name="theme_arg" value="-define=CONFIG::theme,false" />
<java jar="${FALCONJX_HOME}/lib/mxmlc.jar" resultProperty="errorCode"
fork="true">
@@ -151,6 +160,7 @@
<jvmarg line="-Dflexlib=${FLEXJS_HOME}/frameworks}"/>
<arg value="+flexlib=${FLEXJS_HOME}/frameworks" />
<arg value="-debug" />
+ <arg value="${theme_arg}" />
<arg value="-compiler.mxml.children-as-data" />
<arg value="-compiler.binding-value-change-event=org.apache.flex.events.ValueChangeEvent" />
<arg value="-compiler.binding-value-change-event-kind=org.apache.flex.events.ValueChangeEvent" />
@@ -181,6 +191,7 @@
<echo message="FLEX_HOME: ${FLEX_HOME}"/>
<echo message="FALCONJX_HOME: ${FALCONJX_HOME}"/>
<echo message="GOOG_HOME: ${GOOG_HOME}"/>
+ <property name="theme_arg" value="-define=CONFIG::theme,false" />
<java jar="${FALCONJX_HOME}/lib/mxmlc.jar" resultProperty="errorCode"
fork="true">
@@ -189,6 +200,7 @@
<arg value="+flexlib=${FLEXJS_HOME}/frameworks" />
<arg value="+configname=air" />
<arg value="-debug" />
+ <arg value="${theme_arg}" />
<arg value="-compiler.mxml.children-as-data" />
<arg value="-compiler.binding-value-change-event=org.apache.flex.events.ValueChangeEvent" />
<arg value="-compiler.binding-value-change-event-kind=org.apache.flex.events.ValueChangeEvent" />
@@ -219,6 +231,7 @@
<echo message="FLEX_HOME: ${FLEX_HOME}"/>
<echo message="FALCONJX_HOME: ${FALCONJX_HOME}"/>
<echo message="GOOG_HOME: ${GOOG_HOME}"/>
+ <property name="theme_arg" value="-define=CONFIG::theme,false" />
<java jar="${FALCONJX_HOME}/lib/mxmlc.jar" resultProperty="errorCode"
fork="true">
@@ -226,6 +239,7 @@
<jvmarg line="-Dflexlib=${FLEXJS_HOME}/frameworks}"/>
<arg value="+flexlib=${FLEXJS_HOME}/frameworks" />
<arg value="-debug" />
+ <arg value="${theme_arg}" />
<arg value="-define=CONFIG::as_only,false" />
<arg value="-define=CONFIG::js_only,true" />
<arg value="-compiler.mxml.children-as-data" />
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/892562ec/frameworks/projects/Flat/as/defaults.css
----------------------------------------------------------------------
diff --git a/frameworks/projects/Flat/as/defaults.css b/frameworks/projects/Flat/as/defaults.css
index 790eb0c..5a92621 100644
--- a/frameworks/projects/Flat/as/defaults.css
+++ b/frameworks/projects/Flat/as/defaults.css
@@ -59,13 +59,17 @@ Button
Button:hover
{
+ border: none;
color: #fff;
background-color: #48c9b0;
border-color: #48c9b0;
+ padding: 10px 15px;
}
Button:active
{
+ border: none;
+ padding: 10px 15px;
outline: none;
box-shadow: none;
}
@@ -552,9 +556,10 @@ ControlBar
DropDownList
{
IBeadModel: ClassReference("org.apache.flex.html.beads.models.ArraySelectionModel");
- IBeadView: ClassReference("org.apache.flex.html.beads.DropDownListView");
+ IBeadView: ClassReference("org.apache.flex.flat.beads.DropDownListView");
IBeadController: ClassReference("org.apache.flex.html.beads.controllers.DropDownListController");
- IPopUp: ClassReference("org.apache.flex.html.supportClasses.DropDownListList");
+ IPopUp: ClassReference("org.apache.flex.flat.supportClasses.DropDownListList");
+ height: 43px;
}
DropDownListList
@@ -562,7 +567,7 @@ DropDownListList
IBeadModel: ClassReference("org.apache.flex.html.beads.models.ArraySelectionModel");
IDataProviderItemRendererMapper: ClassReference("org.apache.flex.html.beads.TextItemRendererFactoryForArrayData");
IItemRendererClassFactory: ClassReference("org.apache.flex.core.ItemRendererClassFactory");
- IItemRenderer: ClassReference("org.apache.flex.html.supportClasses.DropDownListStringItemRenderer");
+ IItemRenderer: ClassReference("org.apache.flex.flat.supportClasses.DropDownListStringItemRenderer");
}
Image
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/892562ec/frameworks/projects/Flat/as/src/org/apache/flex/flat/beads/DropDownListView.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/Flat/as/src/org/apache/flex/flat/beads/DropDownListView.as b/frameworks/projects/Flat/as/src/org/apache/flex/flat/beads/DropDownListView.as
index 0aaf964..0d4d032 100644
--- a/frameworks/projects/Flat/as/src/org/apache/flex/flat/beads/DropDownListView.as
+++ b/frameworks/projects/Flat/as/src/org/apache/flex/flat/beads/DropDownListView.as
@@ -39,6 +39,7 @@ package org.apache.flex.flat.beads
import org.apache.flex.core.ValuesManager;
import org.apache.flex.events.Event;
import org.apache.flex.events.IEventDispatcher;
+ import org.apache.flex.html.beads.IDropDownListView;
/**
* The DropDownListView class is the default view for
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/892562ec/frameworks/projects/Flat/flat-manifest.xml
----------------------------------------------------------------------
diff --git a/frameworks/projects/Flat/flat-manifest.xml b/frameworks/projects/Flat/flat-manifest.xml
index 1677425..dcd2aca 100644
--- a/frameworks/projects/Flat/flat-manifest.xml
+++ b/frameworks/projects/Flat/flat-manifest.xml
@@ -65,6 +65,8 @@
<component id="NumericStepper" class="org.apache.flex.html.NumericStepper" lookupOnly="true" />
<component id="TextFieldItemRenderer" class="org.apache.flex.html.supportClasses.TextFieldItemRenderer" lookupOnly="true" />
<component id="StringItemRenderer" class="org.apache.flex.html.supportClasses.StringItemRenderer" lookupOnly="true" />
+ <component id="DropDownListView" class="org.apache.flex.flat.beads.DropDownListView" />
+ <component id="DropDownListStringItemRenderer" class="org.apache.flex.flat.supportClasses.DropDownListStringItemRenderer" />
<component id="DataItemRenderer" class="org.apache.flex.html.supportClasses.DataItemRenderer" lookupOnly="true" />
<component id="ButtonBarButtonItemRenderer" class="org.apache.flex.html.supportClasses.ButtonBarButtonItemRenderer" lookupOnly="true" />
<component id="ScrollBar" class="org.apache.flex.html.supportClasses.ScrollBar" lookupOnly="true" />
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/892562ec/frameworks/projects/HTML/as/defaults.css
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/defaults.css b/frameworks/projects/HTML/as/defaults.css
index 91ed55a..86b2ccb 100644
--- a/frameworks/projects/HTML/as/defaults.css
+++ b/frameworks/projects/HTML/as/defaults.css
@@ -20,20 +20,11 @@
@namespace "library://ns.apache.org/flexjs/basic";
@namespace svg "library://ns.apache.org/flexjs/svg";
-@font-face {
- font-family: 'Flat-UI-Icons';
-
- src: url('fonts/flat-ui-icons-regular.eot');
- src: url('fonts/flat-ui-icons-regular.eot?#iefix') format('embedded-opentype'), url('fonts/flat-ui-icons-regular.woff') format('woff'), url('fonts/flat-ui-icons-regular.ttf') format('truetype'), url('fonts/flat-ui-icons-regular.svg#flat-ui-icons-regular') format('svg');
-}
-
/* Global style declaration */
*
{
font-family: "Arial";
font-size: 12px;
- color: #34495e;
- background-color: #fff;
}
.flexjs *, . flexjs *:before, . flexjs *:after {
@@ -44,31 +35,23 @@
Button
{
- color: #fff;
- background-color: #1abc9c;
- padding: 10px 15px;
- font-size: 15px;
- font-weight: normal;
- line-height: 1.4;
- border: none;
- border-radius: 4px;
- -webkit-transition: border .25s linear, color .25s linear, background-color .25s linear;
- transition: border .25s linear, color .25s linear, background-color .25s linear;
-
- -webkit-font-smoothing: subpixel-antialiased;
+ background-color: #d8d8d8;
+ border: 1px solid #000000;
+ padding: 4px;
}
Button:hover
{
- color: #fff;
- background-color: #48c9b0;
- border-color: #48c9b0;
+ background-color: #9fa0a1;
+ border: 1px solid #000000;
+ padding: 4px;
}
Button:active
{
- outline: none;
- box-shadow: none;
+ background-color: #929496;
+ border: 1px solid #000000;
+ padding: 4px;
}
ButtonBar
@@ -91,83 +74,6 @@ ButtonBarButtonItemRenderer
height: 30;
}
-.checkbox-icon,
-.checkbox-icon-hover,
-.checkbox-icon-checked
-{
- position: absolute;
- top: 0;
- left: 0;
- display: block;
- width: 20px;
- height: 20px;
- font-size: 20px;
- line-height: 20px;
- color: #bdc3c7;
- text-align: center;
- cursor: pointer;
-
- /* .radio .icon-checked:before */
- /* .radio .icon-unchecked:before */
- font-family: 'Flat-UI-Icons';
- font-style: normal;
- font-weight: normal;
- font-variant: normal;
- text-transform: none;
-
- speak: none;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
-
- font-size: 20px;
- line-height: 20px;
-}
-
-.checkbox-icon:before
-{
- content: "\e60d";
-}
-
-.checkbox-icon-hover:before
-{
- content: "\e60e";
-}
-
-.checkbox-icon-checked:before
-{
- content: "\e60e";
-}
-
-.checkbox-icon-checked
-{
- color: #1abc9c;
-}
-
-.checkbox-input
-{
- position: absolute;
- top: 0;
- left: 0;
- width: 20px;
- height: 20px;
- padding: 0;
- margin: 0;
- outline: none !important;
- opacity: 0;
-}
-
-CheckBox
-{
- /* .checkbox */
- position: relative;
- padding-left: 32px;
- margin-bottom: 12px;
- font-size: 14px;
- line-height: 1.5;
- -webkit-transition: color .25s linear;
- transition: color .25s linear;
-}
-
Container
{
IBeadView: ClassReference("org.apache.flex.html.beads.ContainerView");
@@ -216,74 +122,6 @@ DateField {
IFormatBead: ClassReference("org.apache.flex.html.accessories.DateFormatMMDDYYYYBead");
}
-.dropdown-menu {
- position: absolute;
- z-index: 1000;
- min-width: 220px;
- padding: 0;
- margin-top: 9px;
- font-size: 14px;
- background-color: #f3f4f5;
- border: none;
- border-radius: 4px;
- box-shadow: none;
- list-style: none;
- }
-.dropdown-menu-divider {
- height: 2px;
- margin: 3px 0;
- overflow: hidden;
- background-color: rgba(202, 206, 209, .5);
- }
-.dropdown-menu-item-renderer {
- padding: 8px 16px;
- line-height: 1.429;
- font-size: inherit;
- color: #606d7a;
- background-color: transparent;
-}
-.dropdown-menu-item-renderer-selected {
- padding: 8px 16px;
- line-height: 1.875;
- font-size: inherit;
- color: #fff;
- background-color: #1abc9c;
-}
-.dropdown-menu-item-renderer:hover {
- font-size: inherit;
- color: #55606c;
- background-color: rgba(202, 206, 209, .5);
-}
-
-.dropdown-toggle-open-btn {
- border-radius: 4px;
- color: #fff;
- background-color: #1abc9c;
- border-color: #1abc9c;
- }
-
-.dropdown-toggle-open-btn:hover {
- border-radius: 4px;
- color: #fff;
- background-color: #48c9b0;
- border-color: #48c9b0;
- }
-
-.dropdown-caret {
- display: inline-block;
- color: inherit;
- background-color: inherit;
- width: 0;
- height: 0;
- margin-left: 5px;
- vertical-align: middle;
- border-top: 8px solid;
- border-right: 6px solid transparent;
- border-left: 6px solid transparent;
- -webkit-transition: border-color .25s, color .25s;
- transition: border-color .25s, color .25s;
- }
-
HContainer
{
IBeadView: ClassReference("org.apache.flex.html.beads.ContainerView");
@@ -340,83 +178,6 @@ PanelWithControlBar
padding: 2px;
}
-.radio-icon,
-.radio-icon-hover,
-.radio-icon-checked
-{
- position: absolute;
- top: 0;
- left: 0;
- display: block;
- width: 20px;
- height: 20px;
- font-size: 20px;
- line-height: 20px;
- color: #bdc3c7;
- text-align: center;
- cursor: pointer;
-
- /* .radio .icon-checked:before */
- /* .radio .icon-unchecked:before */
- font-family: 'Flat-UI-Icons';
- font-style: normal;
- font-weight: normal;
- font-variant: normal;
- text-transform: none;
-
- speak: none;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
-
- font-size: 20px;
- line-height: 20px;
-}
-
-.radio-icon:before
-{
- content: "\e60b";
-}
-
-.radio-icon-hover:before
-{
- content: "\e60c";
-}
-
-.radio-icon-checked:before
-{
- content: "\e60c";
-}
-
-.radio-icon-checked
-{
- color: #1abc9c;
-}
-
-.radio-input
-{
- position: absolute;
- top: 0;
- left: 0;
- width: 20px;
- height: 20px;
- padding: 0;
- margin: 0;
- outline: none !important;
- opacity: 0;
-}
-
-RadioButton
-{
- /* .radio */
- position: relative;
- padding-left: 32px;
- margin-bottom: 12px;
- font-size: 14px;
- line-height: 1.5;
- -webkit-transition: color .25s linear;
- transition: color .25s linear;
-}
-
SimpleList
{
IBeadModel: ClassReference("org.apache.flex.html.beads.models.ArraySelectionModel");
@@ -436,24 +197,6 @@ StringItemRenderer
height: 16;
}
-TextArea
-{
- padding: 6px 10px;
- font-size: 13px;
- border-radius: 6px;
- border: 2px solid #1abc9c;
-}
-
-TextInput
-{
- height: 35px;
- padding: 6px 10px;
- font-size: 13px;
- line-height: 1.462;
- border-radius: 6px;
- border: 2px solid #1abc9c;
-}
-
TitleBar
{
IBeadModel: ClassReference("org.apache.flex.html.beads.models.TitleBarModel");
@@ -505,7 +248,10 @@ Alert
Border
{
+ border-color: inherit;
+ border-style: inherit;
border-radius: inherit;
+ border-width: inherit;
border: inherit;
}
@@ -634,92 +380,6 @@ RadioButton
IBeadView: ClassReference("org.apache.flex.html.beads.RadioButtonView");
}
-.vscrollbar-uparrow {
- padding: 0px;
- display: inline-block;
- border-color: #16a085;
- border-radius: initial;
- background-color: transparent;
- width: 0;
- height: 0;
- margin-left: 5px;
- vertical-align: middle;
- border-bottom: 8px solid;
- border-right: 6px solid transparent;
- border-left: 6px solid transparent;
- -webkit-transition: border-color .25s, color .25s;
- transition: border-color .25s, color .25s;
- }
-.vscrollbar-downarrow-btn {
- padding: 2px;
- display: inline-block;
- border-style: none;
- border-radius: initial;
- background-color: transparent;
- width: 12;
- height: 12;
- margin-left: 5px;
- vertical-align: middle;
- }
-.vscrollbar-uparrow-btn {
- padding: 2px;
- display: inline-block;
- border-style: none;
- border-radius: initial;
- background-color: transparent;
- width: 12;
- height: 12;
- margin-left: 5px;
- vertical-align: middle;
- }
-.vscrollbar-downarrow {
- padding: 0px;
- display: inline-block;
- border-color: #16a085;
- border-radius: initial;
- background-color: transparent;
- width: 0;
- height: 0;
- margin-left: 5px;
- vertical-align: middle;
- border-top: 8px solid;
- border-right: 6px solid transparent;
- border-left: 6px solid transparent;
- -webkit-transition: border-color .25s, color .25s;
- transition: border-color .25s, color .25s;
- }
-.vscrollbar-track {
- padding: 0px;
- position: relative;
- width: 8px;
- height: 8px;
- /*margin-bottom: 20px;*/
- cursor: pointer;
- background-color: #ebedef;
- border-radius: 4px;
- /*border-radius: 32px;*/
- box-shadow: none;
- }
-.vscrollbar-thumb {
- padding: 0px;
- position: absolute;
- z-index: 2;
- width: 12px;
- height: 12px;
- cursor: pointer;
- background-color: #16a085;
- border-radius: 6px;
- -webkit-transition: background .25s;
- transition: background .25s;
- }
-.vscrollbar-thumb:hover {
- background-color: #48c9b0;
- outline: none;
- }
-.vscrollbar-thumb:active {
- background-color: #16a085;
- }
-
ScrollBar
{
IBeadLayout: ClassReference("org.apache.flex.html.beads.layouts.VScrollBarLayout");
@@ -765,6 +425,10 @@ TextArea
IBeadController: ClassReference("org.apache.flex.html.beads.controllers.EditableTextKeyboardController");
iBorderBead: ClassReference('org.apache.flex.html.beads.SingleLineBorderBead');
iBorderModel: ClassReference('org.apache.flex.html.beads.models.SingleLineBorderModel');
+ border-style: solid;
+ border-color: #000000;
+ border-width: 1px;
+ background-color: #FFFFFF;
width: 135;
height: 20;
}
@@ -789,6 +453,10 @@ TextInput
IBeadController: ClassReference("org.apache.flex.html.beads.controllers.EditableTextKeyboardController");
iBorderBead: ClassReference('org.apache.flex.html.beads.SingleLineBorderBead');
iBorderModel: ClassReference('org.apache.flex.html.beads.models.SingleLineBorderModel');
+ border-style: solid;
+ border-color: #000000;
+ border-width: 1px;
+ background-color: #FFFFFF;
width: 135;
height: 20;
}
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/892562ec/frameworks/projects/HTML/as/src/org/apache/flex/html/beads/DropDownListView.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/beads/DropDownListView.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/beads/DropDownListView.as
index 30df676..ec19fae 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/beads/DropDownListView.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/beads/DropDownListView.as
@@ -28,14 +28,11 @@ package org.apache.flex.html.beads
import org.apache.flex.core.BeadViewBase;
import org.apache.flex.core.CSSTextField;
- import org.apache.flex.core.CSSShape;
- import org.apache.flex.core.CSSSprite;
import org.apache.flex.core.IBeadView;
import org.apache.flex.core.IPopUpHost;
import org.apache.flex.core.ISelectionModel;
import org.apache.flex.core.IStrand;
import org.apache.flex.core.IPopUpHost;
- import org.apache.flex.core.IUIBase;
import org.apache.flex.core.ValuesManager;
import org.apache.flex.events.Event;
import org.apache.flex.events.IEventDispatcher;
@@ -64,42 +61,47 @@ package org.apache.flex.html.beads
*/
public function DropDownListView()
{
- upSprite = new CSSSprite();
- upSprite.className = 'dropdown-toggle-open-btn';
- downSprite = new CSSSprite();
- downSprite.className = 'dropdown-toggle-open-btn';
- overSprite = new CSSSprite();
- overSprite.className = 'dropdown-toggle-open-btn';
- overSprite.state = 'hover';
+ upSprite = new Sprite();
+ downSprite = new Sprite();
+ overSprite = new Sprite();
upTextField = new CSSTextField();
downTextField = new CSSTextField();
overTextField = new CSSTextField();
upSprite.addChild(upTextField);
overSprite.addChild(overTextField);
downSprite.addChild(downTextField);
+ upTextField.border = true;
+ downTextField.border = true;
+ overTextField.border = true;
+ upTextField.background = true;
+ downTextField.background = true;
+ overTextField.background = true;
+ upTextField.borderColor = 0;
+ downTextField.borderColor = 0;
+ overTextField.borderColor = 0;
+ upTextField.backgroundColor = 0xEEEEEE;
+ downTextField.backgroundColor = 0x808080;
+ overTextField.backgroundColor = 0xFFFFFF;
upTextField.selectable = false;
- upTextField.parentDrawsBackground = true;
upTextField.type = TextFieldType.DYNAMIC;
downTextField.selectable = false;
- downTextField.parentDrawsBackground = true;
downTextField.type = TextFieldType.DYNAMIC;
overTextField.selectable = false;
- overTextField.parentDrawsBackground = true;
- overTextField.type = TextFieldType.DYNAMIC;
+ overTextField.type = TextFieldType.DYNAMIC;
// auto-size collapses if no text
//upTextField.autoSize = "left";
//downTextField.autoSize = "left";
//overTextField.autoSize = "left";
- upArrows = new CSSShape();
- upArrows.className = 'dropdown-caret';
- overArrows = new CSSShape();
- overArrows.className = 'dropdown-caret';
- downArrows = new CSSShape();
- downArrows.className = 'dropdown-caret';
+ upArrows = new Shape();
+ overArrows = new Shape();
+ downArrows = new Shape();
upSprite.addChild(upArrows);
overSprite.addChild(overArrows);
downSprite.addChild(downArrows);
+ drawArrows(upArrows, 0xEEEEEE);
+ drawArrows(overArrows, 0xFFFFFF);
+ drawArrows(downArrows, 0x808080);
}
@@ -153,29 +155,17 @@ package org.apache.flex.html.beads
{
var ww:Number = DisplayObject(_strand).width;
var hh:Number = DisplayObject(_strand).height;
- upArrows.draw(0, 0);
- overArrows.draw(0, 0);
- downArrows.draw(0, 0);
- upSprite.draw(ww, hh);
- overSprite.draw(ww, hh);
- downSprite.draw(ww, hh);
upArrows.x = ww - upArrows.width;
overArrows.x = ww - overArrows.width;
downArrows.x = ww - downArrows.width;
- upArrows.y = (hh - upArrows.height) / 2;
- overArrows.y = (hh - overArrows.height) / 2;
- downArrows.y = (hh - downArrows.height) / 2;
upTextField.width = upArrows.x;
downTextField.width = downArrows.x;
overTextField.width = overArrows.x;
- upTextField.height = upTextField.textHeight + 5;
- downTextField.height = downTextField.textHeight + 5;
- overTextField.height = overTextField.textHeight + 5;
- upTextField.y = (hh - upTextField.height) / 2;
- downTextField.y = (hh - downTextField.height) / 2;
- overTextField.y = (hh - overTextField.height) / 2;
+ upTextField.height = hh;
+ downTextField.height = hh;
+ overTextField.height = hh;
shape.graphics.clear();
shape.graphics.beginFill(0xCCCCCC);
shape.graphics.drawRect(0, 0, ww, hh);
@@ -185,14 +175,36 @@ package org.apache.flex.html.beads
private var upTextField:CSSTextField;
private var downTextField:CSSTextField;
private var overTextField:CSSTextField;
- private var upSprite:CSSSprite;
- private var downSprite:CSSSprite;
- private var overSprite:CSSSprite;
- private var upArrows:CSSShape;
- private var downArrows:CSSShape;
- private var overArrows:CSSShape;
+ private var upSprite:Sprite;
+ private var downSprite:Sprite;
+ private var overSprite:Sprite;
+ private var upArrows:Shape;
+ private var downArrows:Shape;
+ private var overArrows:Shape;
- /**
+ private function drawArrows(shape:Shape, color:uint):void
+ {
+ var g:Graphics = shape.graphics;
+ g.beginFill(color);
+ g.drawRect(0, 0, 16, 17);
+ g.endFill();
+ g.beginFill(0);
+ g.moveTo(8, 2);
+ g.lineTo(12, 6);
+ g.lineTo(4, 6);
+ g.lineTo(8, 2);
+ g.endFill();
+ g.beginFill(0);
+ g.moveTo(8, 14);
+ g.lineTo(12, 10);
+ g.lineTo(4, 10);
+ g.lineTo(8, 14);
+ g.endFill();
+ g.lineStyle(1, 0);
+ g.drawRect(0, 0, 16, 17);
+ }
+
+ /**
* The text that is displayed in the view.
*
* @langversion 3.0
@@ -215,12 +227,6 @@ package org.apache.flex.html.beads
upTextField.text = value;
downTextField.text = value;
overTextField.text = value;
- upTextField.height = upTextField.textHeight + 5;
- downTextField.height = downTextField.textHeight + 5;
- overTextField.height = overTextField.textHeight + 5;
- upTextField.y = (hh - upTextField.height) / 2;
- downTextField.y = (hh - downTextField.height) / 2;
- overTextField.y = (hh - overTextField.height) / 2;
}
private var _popUp:IStrand;
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/892562ec/frameworks/projects/HTML/as/src/org/apache/flex/html/supportClasses/DropDownListList.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/supportClasses/DropDownListList.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/supportClasses/DropDownListList.as
index 199744b..b2a8a14 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/supportClasses/DropDownListList.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/supportClasses/DropDownListList.as
@@ -58,7 +58,6 @@ package org.apache.flex.html.supportClasses
public function DropDownListList()
{
super();
- className = "dropdown-menu";
}
/**
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/892562ec/frameworks/projects/HTML/js/src/org/apache/flex/html/CheckBox.js
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/js/src/org/apache/flex/html/CheckBox.js b/frameworks/projects/HTML/js/src/org/apache/flex/html/CheckBox.js
index 89a129c..b87acb4 100644
--- a/frameworks/projects/HTML/js/src/org/apache/flex/html/CheckBox.js
+++ b/frameworks/projects/HTML/js/src/org/apache/flex/html/CheckBox.js
@@ -48,90 +48,43 @@ org.apache.flex.html.CheckBox.prototype.createElement =
this.element = document.createElement('label');
- this.input = document.createElement('input');
- this.input.type = 'checkbox';
- this.input.className = 'checkbox-input';
- this.input.addEventListener('change', goog.bind(this.selectionChangeHandler, this));
- this.element.appendChild(this.input);
-
- this.checkbox = document.createElement('span');
- this.checkbox.className = 'checkbox-icon';
- this.checkbox.addEventListener('mouseover', goog.bind(this.mouseOverHandler, this));
- this.checkbox.addEventListener('mouseout', goog.bind(this.mouseOutHandler, this));
- this.element.appendChild(this.checkbox);
-
- this.textNode = document.createTextNode('');
- this.element.appendChild(this.textNode);
+ cb = document.createElement('input');
+ cb.type = 'checkbox';
+ this.element.appendChild(cb);
+ this.element.appendChild(document.createTextNode(''));
+
this.element.className = 'CheckBox';
this.typeNames = 'CheckBox';
this.positioner = this.element;
- this.input.flexjs_wrapper = this;
- this.checkbox.flexjs_wrapper = this;
+ cb.flexjs_wrapper = this;
this.element.flexjs_wrapper = this;
return this.element;
};
-/**
- * @param {Event} e The event object.
- */
-org.apache.flex.html.CheckBox.prototype.mouseOverHandler =
- function(e) {
- this.checkbox.className = 'checkbox-icon-hover';
-};
-
-
-/**
- * @param {Event} e The event object.
- */
-org.apache.flex.html.CheckBox.prototype.mouseOutHandler =
- function(e) {
- if (this.input.checked)
- this.checkbox.className = 'checkbox-icon-checked';
- else
- this.checkbox.className = 'checkbox-icon';
-};
-
-
-/**
- * @param {Event} e The event object.
- */
-org.apache.flex.html.CheckBox.prototype.selectionChangeHandler =
- function(e) {
- if (this.input.checked)
- this.checkbox.className = 'checkbox-icon-checked';
- else
- this.checkbox.className = 'checkbox-icon';
-};
-
-
Object.defineProperties(org.apache.flex.html.CheckBox.prototype, {
/** @export */
text: {
/** @this {org.apache.flex.html.CheckBox} */
get: function() {
- return this.textNode.nodeValue;
+ return this.element.childNodes.item(1).nodeValue;
},
/** @this {org.apache.flex.html.CheckBox} */
set: function(value) {
- this.textNode.nodeValue = value;
+ this.element.childNodes.item(1).nodeValue = value;
}
},
/** @export */
selected: {
/** @this {org.apache.flex.html.CheckBox} */
get: function() {
- return this.input.checked;
+ return this.element.childNodes.item(0).checked;
},
/** @this {org.apache.flex.html.CheckBox} */
set: function(value) {
- this.input.checked = value;
- if (value)
- this.checkbox.className = 'checkbox-icon-checked';
- else
- this.checkbox.className = 'checkbox-icon';
+ this.element.childNodes.item(0).checked = value;
}
}
});
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/892562ec/frameworks/projects/HTML/js/src/org/apache/flex/html/DropDownList.js
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/js/src/org/apache/flex/html/DropDownList.js b/frameworks/projects/HTML/js/src/org/apache/flex/html/DropDownList.js
index ed89c9a..8de4c1f 100644
--- a/frameworks/projects/HTML/js/src/org/apache/flex/html/DropDownList.js
+++ b/frameworks/projects/HTML/js/src/org/apache/flex/html/DropDownList.js
@@ -46,144 +46,39 @@ org.apache.flex.html.DropDownList.prototype.FLEXJS_CLASS_INFO =
*/
org.apache.flex.html.DropDownList.prototype.createElement =
function() {
- var button, input;
-
- this.element = document.createElement('div');
-
- this.button = button = document.createElement('button');
- button.className = 'dropdown-toggle-open-btn';
- goog.events.listen(button, 'click', goog.bind(this.buttonClicked, this));
- this.element.appendChild(button);
-
- var caret = document.createElement('span');
- caret.className = 'dropdown-caret';
-
- this.element.style.position = 'relative';
+ this.element = document.createElement('select');
+ this.element.size = 1;
+ goog.events.listen(this.element, 'change',
+ goog.bind(this.changeHandler, this));
this.positioner = this.element;
- // add a click handler so that a click outside of the combo box can
- // dismiss the pop-up should it be visible.
- goog.events.listen(document, 'click',
- goog.bind(this.dismissPopup, this));
-
- button.flexjs_wrapper = this;
this.element.flexjs_wrapper = this;
- caret.flexjs_wrapper = this;
return this.element;
};
-/**
- * @export
- * @param {Object} event The event.
- */
-org.apache.flex.html.DropDownList.prototype.selectChanged =
- function(event) {
- var select;
-
- select = event.target;
-
- this.selectedIndex = parseInt(select.id, 10);
-
- this.menu.parentNode.removeChild(this.menu);
- this.menu = null;
-
- this.dispatchEvent('change');
-};
-
-
-/**
- * @export
- * @param {Object=} opt_event The event.
- */
-org.apache.flex.html.DropDownList.prototype.dismissPopup =
- function(opt_event) {
- // remove the popup if it already exists
- if (this.menu) {
- this.menu.parentNode.removeChild(this.menu);
- this.menu = null;
- }
-};
-
-
-/**
- * @export
- * @param {Object} event The event.
- */
-org.apache.flex.html.DropDownList.prototype.buttonClicked =
- function(event) {
- /**
- * @type {Array.<string>}
- */
- var dp;
- var i, button, left, n, opt, opts, pn, popup, select, si, top, width;
-
- event.stopPropagation();
-
- if (this.popup) {
- this.dismissPopup();
-
- return;
- }
-
- button = this.element.childNodes.item(0);
-
- pn = this.element;
- top = pn.offsetTop + button.offsetHeight;
- left = pn.offsetLeft;
- width = pn.offsetWidth;
-
- /*
- popup = document.createElement('div');
- popup.className = 'dropdown-menu';
- popup.id = 'test';
- popup.style.position = 'absolute';
- popup.style.top = top.toString() + 'px';
- popup.style.left = left.toString() + 'px';
- popup.style.width = width.toString() + 'px';
- popup.style.margin = '0px auto';
- popup.style.padding = '0px';
- popup.style.zIndex = '10000';
- */
-
- this.menu = select = document.createElement('ul');
- select.style.width = width.toString() + 'px';
- goog.events.listen(select, 'click', goog.bind(this.selectChanged, this));
- select.className = 'dropdown-menu';
-
- dp = /** @type {Array.<string>} */ (this.dataProvider);
- n = dp.length;
- for (i = 0; i < n; i++) {
- opt = document.createElement('li');
- opt.style.backgroundColor = 'transparent';
- var ir = document.createElement('a');
- ir.innerHTML = dp[i];
- ir.id = i.toString();
- if (i == this.selectedIndex)
- ir.className = 'dropdown-menu-item-renderer-selected';
- else
- ir.className = 'dropdown-menu-item-renderer';
- opt.appendChild(ir);
- select.appendChild(opt);
- }
-
- this.element.appendChild(select);
-};
-
-
Object.defineProperties(org.apache.flex.html.DropDownList.prototype, {
+ /** @export */
dataProvider: {
/** @this {org.apache.flex.html.DropDownList} */
- get: function() {
- return this.model.dataProvider;
- },
- /** @this {org.apache.flex.html.DropDownList} */
set: function(value) {
var dp, i, n, opt;
this.model.dataProvider = value;
+ dp = this.element.options;
+ n = dp.length;
+ for (i = 0; i < n; i++) {
+ dp.remove(0);
+ }
+
+ n = value.length;
+ for (i = 0; i < n; i++) {
+ opt = document.createElement('option');
+ opt.text = value[i];
+ dp.add(opt);
+ }
}
},
/** @export */
@@ -198,7 +93,7 @@ Object.defineProperties(org.apache.flex.html.DropDownList.prototype, {
/** @this {org.apache.flex.html.DropDownList} */
set: function(value) {
this.model.selectedIndex = value;
- this.button.innerHTML = this.selectedItem + '<span class="dropdown-caret"/>';
+ this.element.selectedIndex = value;
}
},
/** @export */
@@ -213,7 +108,17 @@ Object.defineProperties(org.apache.flex.html.DropDownList.prototype, {
/** @this {org.apache.flex.html.DropDownList} */
set: function(value) {
this.model.selectedItem = value;
- this.button.innerHTML = this.selectedItem + '<span class="dropdown-caret"/>';
- }
+ this.element.selectedIndex = this.selectedIndex;
+ }
}
});
+
+
+/**
+ * @protected
+ */
+org.apache.flex.html.DropDownList.prototype.changeHandler =
+ function() {
+ this.model.selectedIndex = this.element.selectedIndex;
+ this.dispatchEvent('change');
+};
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/892562ec/frameworks/projects/HTML/js/src/org/apache/flex/html/RadioButton.js
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/js/src/org/apache/flex/html/RadioButton.js b/frameworks/projects/HTML/js/src/org/apache/flex/html/RadioButton.js
index 7cbfe75..4c8d18d 100644
--- a/frameworks/projects/HTML/js/src/org/apache/flex/html/RadioButton.js
+++ b/frameworks/projects/HTML/js/src/org/apache/flex/html/RadioButton.js
@@ -51,25 +51,15 @@ org.apache.flex.html.RadioButton.radioCounter = 0;
org.apache.flex.html.RadioButton.prototype.createElement =
function() {
- // hide this eleement
this.input = document.createElement('input');
this.input.type = 'radio';
- this.input.className = 'radio-input';
this.input.id = '_radio_' + org.apache.flex.html.RadioButton.radioCounter++;
- this.input.addEventListener('change', goog.bind(this.selectionChangeHandler, this));
-
- this.radio = document.createElement('span');
- this.radio.className = 'radio-icon';
- this.radio.addEventListener('mouseover', goog.bind(this.mouseOverHandler, this));
- this.radio.addEventListener('mouseout', goog.bind(this.mouseOutHandler, this));
this.textNode = document.createTextNode('radio button');
this.labelFor = document.createElement('label');
this.labelFor.appendChild(this.input);
- this.labelFor.appendChild(this.radio);
this.labelFor.appendChild(this.textNode);
- this.labelFor.style.position = 'relative';
this.element = this.labelFor;
this.element.className = 'RadioButton';
@@ -77,7 +67,6 @@ org.apache.flex.html.RadioButton.prototype.createElement =
this.positioner = this.element;
this.input.flexjs_wrapper = this;
- this.radio.flexjs_wrapper = this;
this.element.flexjs_wrapper = this;
this.textNode.flexjs_wrapper = this;
@@ -86,37 +75,6 @@ org.apache.flex.html.RadioButton.prototype.createElement =
/**
- * @param {Event} e The event object.
- */
-org.apache.flex.html.RadioButton.prototype.mouseOverHandler =
- function(e) {
- this.radio.className = 'radio-icon-hover';
-};
-
-
-/**
- * @param {Event} e The event object.
- */
-org.apache.flex.html.RadioButton.prototype.mouseOutHandler =
- function(e) {
- if (this.input.checked)
- this.radio.className = 'radio-icon-checked';
- else
- this.radio.className = 'radio-icon';
-};
-
-
-/**
- * @param {Event} e The event object.
- */
-org.apache.flex.html.RadioButton.prototype.selectionChangeHandler =
- function(e) {
- // this should reset the icons in the non-selected radio
- this.selectedValue = this.value;
-};
-
-
-/**
* @export
*/
org.apache.flex.html.RadioButton.prototype.initModel =
@@ -173,10 +131,6 @@ Object.defineProperties(org.apache.flex.html.RadioButton.prototype, {
/** @this {org.apache.flex.html.RadioButton} */
set: function(value) {
this.input.checked = value;
- if (this.input.checked)
- this.radio.className = 'radio-icon-checked';
- else
- this.radio.className = 'radio-icon';
}
},
/** @export */
@@ -217,10 +171,8 @@ Object.defineProperties(org.apache.flex.html.RadioButton.prototype, {
for (i = 0; i < n; i++) {
if (buttons[i].value === value) {
buttons[i].checked = true;
- buttons[i].flexjs_wrapper.selected = true;
+ break;
}
- else
- buttons[i].flexjs_wrapper.selected = false;
}
}
}