A couple questions; 1. It doesn't look like you have private fields implemented to be emitted in the constructor? private fileds are going to the prototype. For instance;
private var explicitWidth:Number = NaN; to /** * @private * @type {number} */ this.explicitWidth_ = NaN; Is this something that needs to happen, UIBase is what I am testing. 2. Running into problems with interfaces, if we use DOM, HTMLElementWrapper.element needs to be Element not Object correct? If not, you don't key code completion in the IDE. 3. flexjs_wrapper can't exist on Element, it's not dynamic, does it nee to be dynamic or do we just use array access? this.element['flexjs_wrapper'] = this; 4. For DOM elements and the closure compiler, does it expect type Element, for instance is below correct? /** * @expose * @type {Element} */ org_apache_flex_core_UIBase.prototype.positioner; 5. The API now needs to be yanked out of Core/as/src into another directory like Core/api/src, so the as Flash and as HTML ActionScript can share the same interfaces, correct? What would be the plan? Lots more but I thought I would start with this. So from my sketchy tests we have: ---------------------------------------------------- UIBase.as ---------------------------------------------------- package org.apache.flex.core { import org.apache.flex.events.Event; import org.apache.flex.events.IEventDispatcher; import randori.webkit.dom.Element; import randori.webkit.page.Window; public class UIBase extends HTMLElementWrapper implements IUIBase//, ILayoutChild, IParentIUIBase { public var positioner:Element; private var lastDisplay_:String = ''; private var explicitWidth_:Number = NaN; private var explicitHeight_:Number = NaN; private var percentWidth_:Number = NaN; private var percentHeight_:Number = NaN; // Added private var model:Object; //public var element:Element; private var mxmlBeads_:Vector.<Object> = null; public function get alpha():Number { return 0; } public function set alpha(value:Number):void { } public function get x():Number { return 0; } public function set x(value:Number):void { } public function get y():Number { return 0; } public function set y(value:Number):void { } public function get width():Number { return 0; } public function set width(value:Number):void { } public function get height():Number { return 0; } public function set height(value:Number):void { } public function get clientWidth():Number { return 0; } public function get clientHeight():Number { return 0; } public function get visible():Boolean { return false; } public function set visible(value:Boolean):void { } public function get topMostEventDispatcher():IEventDispatcher { return null; } public function UIBase() { lastDisplay_ = ''; explicitWidth_ = NaN; explicitHeight_ = NaN; percentWidth_ = NaN; percentHeight_ = NaN; createElement(); } public function createElement():Element { if (element == null) element = Window.document.createElement('div'); if (this.positioner == null) this.positioner = this.element as Element; this.positioner.style.display = 'block'; // BUG; cast gets compiled // Object(this.element).flexjs_wrapper = this; this.element['flexjs_wrapper'] = this; return this.positioner; } public function addedToParent():void { } override public function addBead(bead:IBead):void { if (!this.beads_) { this.beads_ = []; } this.beads_.push(bead); if (bead is IBeadModel) this.model_ = bead; if (bead is IBeadView) { this.dispatchEvent(new Event('viewChanged')); } bead.strand = this; } public function getBeadByType(classOrInterface:Class):IBead { return null; } public function removeBead(bead:IBead):IBead { return null; } } } ---------------------------------------------------- UIBase.js ---------------------------------------------------- /** * org.apache.flex.core.UIBase * * @fileoverview * * @suppress {checkTypes} */ goog.provide('org_apache_flex_core_UIBase'); goog.require('org_apache_flex_core_HTMLElementWrapper'); goog.require('org_apache_flex_events_Event'); goog.require('org_apache_flex_core_IBeadView'); goog.require('org_apache_flex_core_IUIBase'); goog.require('org_apache_flex_core_IBead'); goog.require('org_apache_flex_core_IBeadModel'); /** * @constructor * @extends {org_apache_flex_core_HTMLElementWrapper} * @implements {org_apache_flex_core_IUIBase} */ org_apache_flex_core_UIBase = function() { org_apache_flex_core_UIBase.base(this, 'constructor'); this.lastDisplay_ = ''; this.explicitWidth_ = NaN; this.explicitHeight_ = NaN; this.percentWidth_ = NaN; this.percentHeight_ = NaN; this.createElement(); }; goog.inherits(org_apache_flex_core_UIBase, org_apache_flex_core_HTMLElementWrapper); /** * @expose * @type {Element} */ org_apache_flex_core_UIBase.prototype.positioner; /** * @private * @type {string} */ org_apache_flex_core_UIBase.prototype.lastDisplay_ = ''; /** * @private * @type {number} */ org_apache_flex_core_UIBase.prototype.explicitWidth_ = NaN; /** * @private * @type {number} */ org_apache_flex_core_UIBase.prototype.explicitHeight_ = NaN; /** * @private * @type {number} */ org_apache_flex_core_UIBase.prototype.percentWidth_ = NaN; /** * @private * @type {number} */ org_apache_flex_core_UIBase.prototype.percentHeight_ = NaN; /** * @private * @type {Object} */ org_apache_flex_core_UIBase.prototype.model; /** * @private * @type {Vector.<Object>} */ org_apache_flex_core_UIBase.prototype.mxmlBeads_ = null; /** * @expose * @return {Element} */ org_apache_flex_core_UIBase.prototype.createElement = function() { if (this.element == null) this.element = document.createElement('div'); if (this.positioner == null) this.positioner = org_apache_flex_utils_Language.as(this.element, Element); this.positioner.style.display = 'block'; this.element['flexjs_wrapper'] = this; return this.positioner; }; /** * @expose */ org_apache_flex_core_UIBase.prototype.addedToParent = function() { }; /** * @expose * @param {org_apache_flex_core_IBead} bead * @override */ org_apache_flex_core_UIBase.prototype.addBead = function(bead) { if (!this.beads_) { this.beads_ = []; } this.beads_.push(bead); if (org_apache_flex_utils_Language.is(bead, org_apache_flex_core_IBeadModel)) this.model_ = bead; if (org_apache_flex_utils_Language.is(bead, org_apache_flex_core_IBeadView)) { this.dispatchEvent(new org_apache_flex_events_Event('viewChanged')); } bead.strand = this; }; /** * @expose * @param {Object} classOrInterface * @return {org_apache_flex_core_IBead} */ org_apache_flex_core_UIBase.prototype.getBeadByType = function(classOrInterface) { return null; }; /** * @expose * @param {org_apache_flex_core_IBead} bead * @return {org_apache_flex_core_IBead} */ org_apache_flex_core_UIBase.prototype.removeBead = function(bead) { return null; }; Object.defineProperties(org_apache_flex_core_UIBase.prototype, /** @lends {org_apache_flex_core_UIBase.prototype} */ { /** @expose */ height: { get: /** @this {org_apache_flex_core_UIBase} */ function() { return 0; }, set: /** @this {org_apache_flex_core_UIBase} */ function(value) { }}, /** @expose */ visible: { get: /** @this {org_apache_flex_core_UIBase} */ function() { return false; }, set: /** @this {org_apache_flex_core_UIBase} */ function(value) { }}, /** @expose */ width: { get: /** @this {org_apache_flex_core_UIBase} */ function() { return 0; }, set: /** @this {org_apache_flex_core_UIBase} */ function(value) { }}, /** @expose */ alpha: { get: /** @this {org_apache_flex_core_UIBase} */ function() { return 0; }, set: /** @this {org_apache_flex_core_UIBase} */ function(value) { }}, /** @expose */ topMostEventDispatcher: { get: /** @this {org_apache_flex_core_UIBase} */ function() { return null; }}, /** @expose */ clientWidth: { get: /** @this {org_apache_flex_core_UIBase} */ function() { return 0; }}, /** @expose */ y: { get: /** @this {org_apache_flex_core_UIBase} */ function() { return 0; }, set: /** @this {org_apache_flex_core_UIBase} */ function(value) { }}, /** @expose */ clientHeight: { get: /** @this {org_apache_flex_core_UIBase} */ function() { return 0; }}, /** @expose */ x: { get: /** @this {org_apache_flex_core_UIBase} */ function() { return 0; }, set: /** @this {org_apache_flex_core_UIBase} */ function(value) { }}} ); /** * Metadata * * @type {Object.<string, Array.<Object>>} */ org_apache_flex_core_UIBase.prototype.FLEXJS_CLASS_INFO = { names: [{ name: 'UIBase', qName: 'org_apache_flex_core_UIBase'}], interfaces: [org_apache_flex_core_IUIBase] };