the code below is an app that I used Judah's HTMLcontrol.swc for - in
three places. While it mostly works, the fact that it uses IFrames and
javascript is still a compromise. No disrespect to Judah but I'm
trying to totally remove the influence of the browser - that's why I'm
using Flash in the first place.
I realise people have a problem with a browser control within Flash
within the browser but this app has the dynamically loaded HTML very
much subservient to the Flex code. It just doesn't make sense to tear
the app to pieces and have a DHTML app with Flash "bits". The standard
Flex text control that takes HTML just doesn't cut what I have to do.
I need to control the app's environment. Webkit can give me that for
external HTML content that has to be loaded into the SWF (I'm using
dynamic "bookmarks" - named anchors in the HTML) - but this is only
for AIR, or using Judah's HTMLControl.swc (which is a ticking
time-bomb). Judah has already updated his control to address some
issues I've had but the app is now out of my hands - I can't afford to
repeat that). Who knows what future browser versions might do?
the other reason is that I'm wanting to build both on-line (Flex) and
desktop (AIR using Flex components) versions of apps. Ideally, this
should be achievable with the minimum of fuss and maximin code re-use.
Surely these reasons are good enough to see WebKit turned into a
standard Flex control... yes?
<mx:TabNavigator width="100%" height="100%">
<mx:Canvas label="Diagnostic Tool" width="100%" height="100%">
<mx:VBox width="100%" height="100%">
<mx:HBox width="100%" height="45%">
<mx:Canvas label="Protocol" width="50%"
height="100%">
<!--## use one ##-->
<ns1:HTML elementType="iframe"
source="{bookmark}"
id="myframe2" width="100%" height="100%" />
</mx:Canvas>
<mx:Accordion width="50%" height="100%">
...
</mx:Accordion>
</mx:HBox>
<mx:Panel width="100%" height="55%"
layout="vertical"
title="Indicate your response by moving the slider">
... </mx:Panel>
</mx:VBox>
</mx:Canvas>
<mx:Canvas label="Protocol" width="100%" height="100%">
<!--## use two ##-->
<ns1:HTML width="100%" height="100%"
elementType="iframe"
source="{protocolDoc}" id="protocol_html"/>
</mx:Canvas>
<mx:Canvas label="Help" width="100%" height="100%">
<!--## use three ##-->
<ns1:HTML width="100%" height="100%"
elementType="iframe"
source="{helpDoc}" id="help_html"/>
</mx:Canvas>
</mx:TabNavigator>