I had been searching for a custom preloader that did not require a SWF for a while and finally found my answer from i am josh: http://iamjosh.wordpress.com/2007/12/18/flex-custom-preloader/.

His source code got me on the right path. A simple preloader with a logo and a progress bar. I modified the code that handles the manual drawing to draw a border around the loader component and pad it a bit for visual purposes. Here’s my modified code: Download preloader.zip.

The original can be found at i am josh’s blog.

I run into an issue a lot with fly-out and dropdown menus not always layering on TOP of the subsequent content. I see this most often with Farcry because that is what I use for a lot of sites but I see it elsewhere as well. It can be the most irritating thing in the world to deal with but it CAN be fixed.

In farcry sites, there is a navigation.js or hover.js file that is loaded which provides a nice *hack* for IE6. The purpose of this is that for multi-level navigations, the dropdown/flyout appears when you hover over an LI tag. IE6 only recognizes the seudo element (:hover) on A tags so this javascript file manually adds a class to every LI tag that is a child of a particular element. I.E. if your outer UL has an ID of “menu” this class will be added to all sub-elements.

Here’s what the basic javascript looks like:

hover = function() {
var nav = document.getElementById("menu");
if(nav){
var nodes = nav.getElementsByTagName("li")
for (var i=0; i<nodes.length; i++) {
nodes[i].onmouseover=function() {
this.className+=" hover";
}
nodes[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" hover\\b"), "");
}
}
}
}
if (window.attachEvent) window.attachEvent("onload", hover);

I know, not necessarily that “basic” but all it’s doing is attaching an “onMouseOver” and “onMouseOut” event handler to all LI tags under the element with ID “menu”.

Now, back to the original problem… The dropdown/flyout menus don’t always layer OVER the content in the page. This is thanks to IE rendering all elements with a z-index of 0. Regardless of what you set this to in your CSS (generally z-index of the flyout is higher than the z-index of the page) IE will make it all 0 at the time of loading.

I dealt with this problem for months always hacking my way through a fix depending on the site until it finally dawned on me. I can use this javascript to my advantage because this code runs “onload” (once the page has loaded). Conveniently, this is also after z-indexes have been butchered by IE. So, here is a quick alteration to that javascript that has fixed every problem I’ve run into thusfar:

hover = function() {
var nav = document.getElementById("menu");
nav.style.zIndex = 100;
if(nav){
var nodes = nav.getElementsByTagName("li")
for (var i=0; i<nodes.length; i++) {
nodes[i].onmouseover=function() {
this.className+=" hover";
}
nodes[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" hover\\b"), "");
}
}
}
}
if (window.attachEvent) window.attachEvent("onload", hover);

Notice the line “nav.style.zIndex = 100;”. That’s all it took. Of course, your situation may be much more complex than this and may require more layering of elements. Using this same example you can simply reset z-indexes even if you don’t have a complex menu. Here would be an example of that:

resetZIndexes= function() {
var nav = document.getElementById("menu").style.zIndex = 100;
// other elements would go here
}
if (window.attachEvent) window.attachEvent("onload", resetZIndexes);

I really hope this helps someone avoid the agonizing pain that I had to endure prior to figuring this out.

From time to time I have to re-install eclipse for whatever reason and I really got tired of having to re-download all my plugins (CFEclipse, Subclipse, etc), so I did a clean install and then zipped up the eclipse directory. It is here for all to download if you want.

This contains Eclipse 3.3, CFEclipse, Subclipse and Remote Directory Browsing packages (FTP)

Download Now

I had an issue recently during remoting which when debugged resulted in the following message:

Channel.Connect.Failed error NetConnection.Call.Failed: HTTP: Status 200

It took me forever to figure this one out but it results from IE caching things differently than other browsers and my debug settings use IE as the default browser. To fix it do the following:

1) add the following line to your services-config.xml file in the “channel-definition” tags. I did this for the first 2 listed which are http and https based AMF endpoints.


<channel-definition id="my-cfamf" class="mx.messaging.channels.AMFChannel">
<endpoint uri="http://{server.name}:{server.port}{context.root}/flex2gateway/" class="flex.messaging.endpoints.AMFEndpoint"/>
<properties>
<add-no-cache-headers>false</add-no-cache-headers>
<polling-enabled>false</polling-enabled>
<serialization>
<instantiate-types>false</instantiate-types>
</serialization>
</properties>
</channel-definition>

<channel-definition id="cf-polling-amf" class="mx.messaging.channels.AMFChannel">
<endpoint uri="http://{server.name}:{server.port}{context.root}/flex2gateway/cfamfpolling" class="flex.messaging.endpoints.AMFEndpoint"/>
<properties>
<add-no-cache-headers>false</add-no-cache-headers>
<polling-enabled>true</polling-enabled>
<polling-interval-seconds>8</polling-interval-seconds>
<serialization>
<instantiate-types>false</instantiate-types>
</serialization>
</properties>
</channel-definition>

2) restart the CF server

I hope this helps someone not spend an entire day trying to fix a problem

I have to give serious credit to 2 blogs for this solution:

• http://www.d-p.com/Internet-Development-Blog/article/Generation-Flex.cfm
• http://weblogs.macromedia.com/lin/archives/2006/08/flex_app_works.html

Until now I have never needed to do a lot with meta data except making items bindable or creating custom events. Recently I wanted to create a limitation on a custom property. Here’s the code:

private var _iconPosition:String = "left";
[Bindable]
public function set iconPosition( value:String ):void
{
_iconPosition = value;
}
public function get iconPosition():String
{
return _iconPosition;
}

In order to add default values you have to make the property inspectable. This affects the compiler and provides code hints for the property. See the Live Docs for a full description of “Inspectable”. In my example, I wanted to simply limit my “iconPosition” property to either left or right. Here is the updated code:

private var _iconPosition:String = "left";
[Bindable]
[Inspectable(enumeration="left,right")]
public function set iconPosition( value:String ):void
{
_iconPosition = value;
}
public function get iconPosition():String
{
return _iconPosition;
}

Here is a quick step-by-step tutorial on VPN routing. The purpose is to give you access to the VPN network and the local network at the same time (by default it locks you out of your local network and you can only access the remote network).

Step 1: Create a VPN connection

Frankly, if you can’t get this far, you should probably turn back now or seek additional help.

Step 2: Modify gateway usage

continue reading "VPN Network Routing Step-by-Step"

I quickly found out that my script for creating a route does not work in Windows Vista (well it sort of did). One additional piece of information is that when you are creating the connection click on the “Networking tab”, select “Internet Protocol Version 4 (TCP/IPv4)” and click “Properties.” In the new window, click “Advanced” and be sure to uncheck “Use default gateway on remote network”.

Here is an updated script for use on windows Vista. I will be modifying the original post with this information as well.

Download It

UPDATE: Here’s a step by step on how to handle the networking: http://reynacho.com/2008/11/03/vpn-network-routing-step-by-step/

At my last job I had the option to work from home on occasion but I rarely did it because working over a VPN is a pain. When you connect to a VPN network, by default it disables your local network connection. End result, you can’t check your personal email while connected to the VPN. That was simply not an option for me so a co-worker (Ryan Stille) came up with a genious way to re-route your internet traffic so VPN traffic went through the VPN without disabling your local network. That script looks something like this:

# re-route VPN traffic
route add 10.0.0.0 MASK 255.255.255.0 192.168.1.15 metric 1

The problem with this is that you have to connect to the VPN, then open up a command prompt, find the IP address that was given to you by the VPN and use that instead of “192.168.1.15″.

Here’s some code for a more graceful VBS script that will do the job for you:

Dim ipAddy
ipAddy = GetIPAddress()

If ipAddy <> "" then
FixRouteForRDP(ipAddy)
End If


Function FixRouteForRDP(ipAddy)
set sh = createobject("wscript.shell")
set fso = createobject("scripting.filesystemobject")

Set Env = sh.Environment("PROCESS")
workfile = fso.gettempname
sh.run "%comspec% /c route add 10.0.0.0 MASK 255.255.255.0 " & ipAddy & " metric 1"
End Function


Function GetIPAddress()
set sh = createobject("wscript.shell")
set fso = createobject("scripting.filesystemobject")

Set Env = sh.Environment("PROCESS")
if Env("OS") = "Windows_NT" then
workfile = fso.gettempname
sh.run "%comspec% /c ipconfig > " & workfile,0,true
else
'winipcfg in batch mode sends output to
'filename winipcfg.out
workfile = "winipcfg.out"
sh.run "winipcfg /batch" ,0,true
end if
set sh = nothing
set ts = fso.opentextfile(workfile)
data = split(ts.readall,vbcr)
ts.close
set ts = nothing
fso.deletefile workfile
set fso = nothing
arIPAddress = ""

for n = 0 to ubound(data)
if instr(data(n), "PPP adapter") then
for m = n to ubound(data)
if instr(data(m),"IP Address") then
parts = split(data(m),":")
if trim(parts(1)) <> "0.0.0.0" then
arIPAddress = trim(cstr(parts(1)))
end if
end if
next
end if
next

If (arIPAddress <> "") then
GetIPAddress = arIPAddress
Else
MsgBox "The VPN does not appear to be connected", vbExclamation, "Error"
GetIPAddress = ""
End IF
End Function

Download It

This basically looks up the IP address and runs the route command for you. Note, that in the for loop toward the bottom (if instr(data(n), “PPP adapter”) then), the text “PPP adapter” might need to be replaced by whatever your VPN connection is called. For a basic VPN connection, this should work.

UPDATE: Here’s a step by step on how to handle the networking: http://reynacho.com/2008/11/03/vpn-network-routing-step-by-step/

I’ve been doing a lot of work with SQLite and AIR lately and I recently came across a post from Eric Feminella which has helped me tremendously.

The SQLiteadmin program can be downloaded at the end of this page: SQLite Administrator – International Milestone Beta

Instructions for installing on Windows: Unzip and run

This is currently only available for Windows so sorry to all you Mac users (including myself)

I ran across this problem recently…

I needed to create a slider that didn’t change in a uniform way. It was different for each third of the slider. The first third changed evenly from 0 – 25,000. The second third from 25,000 – 100,000. The last third from 100,000 – 10,000,000.

Here are the basic steps that I took:

1. Create a slider with minimum 0 and maximum 10,000,000
2. Create a handler for the change event
3. Write a whole lot of math in the change event

I’ll let you read over the application code at the link below. Here’s a really quick view of the function that handles the slider changing:

private function handleSliderChange():void
{
var thumbPercentage:Number = slider.value / slider.maximum;
var newTextInputText:String = '';
var multiplier:Number;
if( thumbPercentage <= GraduatedSlider.ONE_THIRD )
{
newTextInputText = numberFormatter.format((thumbPercentage / GraduatedSlider.ONE_THIRD) * GraduatedSlider.SLIDER_ONE_THIRD_VALUE);
}
else if( thumbPercentage > GraduatedSlider.ONE_THIRD && thumbPercentage <= GraduatedSlider.TWO_THIRDS )
{
multiplier = ((GraduatedSlider.TWO_THIRDS - thumbPercentage) / GraduatedSlider.ONE_THIRD);
newTextInputText = numberFormatter.format((((thumbPercentage / GraduatedSlider.TWO_THIRDS) * GraduatedSlider.SLIDER_TWO_THIRDS_VALUE) - (multiplier * GraduatedSlider.SLIDER_ONE_THIRD_VALUE)));
}
else
{
multiplier = ((thumbPercentage - GraduatedSlider.TWO_THIRDS) / GraduatedSlider.ONE_THIRD);
//trace(multiplier);
newTextInputText = numberFormatter.format(((multiplier * GraduatedSlider.SLIDER_FULL_VALUE) + ((1 - multiplier) * GraduatedSlider.SLIDER_TWO_THIRDS_VALUE)));
}
this.sliderValue = newTextInputText;
slider.dataTipFormatFunction = sliderDataTip;
setTextInputValue();
}

View Application     View Source