Post Reply 
flash to image
Jul. 31, 2006, 06:42 AM
Post: #1
flash to image
This filter replaces a flash object/embed tag with an image. To load & run the flash, click the image. Tested with ie6, firefox 1.5.0.4 & opera 9.

The main advantage of this filter is that the flash doesn't load till the image is clicked.

The main drawback to the filter is that it needs to match on html object/embed tags. There are several js methods for generating flash that get around this. Also, js variables inside the html match cause grief, so I have attempted to exclude matching when this is detected. My ultimate goal is to come up with a filter that doesn't have these limitations.

Here's the web filter:
Code:
[Patterns]
Name = "Flash To Image 2"
Active = TRUE
URL = "($TYPE(htm)|$TYPE(js)|$TYPE(vbs))"
Bounds = "<object*/object>|<embed[^>]+>(*/embed >|)"
Limit = 4096
Match = "(^*\+ \=+ ")*shockwave*&$SET(fa=)("
        "*<embed(\s[^>]+>&&(*\s(^type|pluginspage)([a-z]+)\1=$AV((?*)\2)$SET(fa=$GET(fa)\&prx=\1=\2))+*>)|"
        "<object(\s[^>]+>&&(*\s(^classid|codebase)([a-z]+)\1=$AV((?*)\2)$SET(fa=$GET(fa)\&prx=\1=\2))+*>)"
        "(*<param(\s[^>]+>&&*\sname=$AV((?*)\1)*>&&*\svalue=$AV((?*)\2)*>$SET(fa=$GET(fa)\&prx=\1=\2)))+"
        ")"
        "&*\s(src|data|movie)=(^(^(\"$SET(3=")$SET(4=')|$SET(3=')$SET(4="))))$AV(\6)"
        "&(($TST(bScript=*)|(^$TYPE(htm)))$SET(5=\\\4)|$SET(5=\4))"
        "&((^$TST(pfo=*))$SET(pfo=pfo)|)$SET(pfo=$GET(pfo)1)"
Replace = "<img id=\3$GET(pfo)\3 style=\3cursor:pointer\3 title=\3Run Flash: \6\3"
          " src=\3http://local.ptron/z12_htm/flash_rune.gif\3"
          " onclick=\3proxo.$GET(pfo)= new proxo.flashyObj(\5$GET(pfo)\5,\5$GET(fa)\5)\3"
          " />"

Couple of notes about the filter:

1. In the match section, theres a variable called bScript. In my config, bScript=1 when proxo is parsing text in a html script tag. Adjust this accordingly.

2. In the replace section, make sure you set the img src to point to the flash image you want to use. I'm using the flash_rune.gif that I got here:
http://www.adobe.com/shockwave/download/...kwaveFlash


The js for this filter in the next post.

Mike

Add Thank You Quote this message in a reply
Jul. 31, 2006, 06:48 AM
Post: #2
RE: flash to image
This filter depends on js that needs to be injected by proxo. I added this code into the js that I normally inject at the top of the web page.

heres the code:

Code:
if(typeof(proxo)=='undefined'){
  proxo = {};
  
  // proxo flashy object constructor
  proxo.flashyObj = function(pfoId,flashSettings){
    
    this.embed = (document.all&&!window.opera) ? true : false; // true for ie, moz & opera false
    this.attribs = new Object();
    this.params = new Object();
    
    this.parseSettings = function(){
      var i, options, nv_pairs, cur_nv, name, value;
      options = (this.embed) ? this.attribs : this.params;
      nv_pairs = flashSettings.split("&prx=");
      while(nv_pairs.length>1){
        cur_nv = nv_pairs.pop();
        i = cur_nv.indexOf("=");
        name = cur_nv.substr(0,i).toLowerCase();
        value = cur_nv.substr(++i);
        if(name.search(/^(type|quality|menu|play|loop|pluginspage|codebase|classid)/)==-1){
          if(name.search(/^(src|movie|data)/)!=-1){
            if(this.embed){
              this.attribs.src = value;
            }else{
              this.attribs.data = value;
              this.params.movie = value;
            }
          }else if(name.search(/^(name|id)/)!=-1){
            if(this.embed){
              this.attribs.name = value;
            }else{
              this.attribs.id = value;
            }
          }else if(name.search(/^(height|width)/)!=-1){
            this.attribs[name] = value;
          }else if(name.search(/^[a-z]+$/)!=-1){
            options[name] = value;
          }
        }
      }
      // set default values
      this.attribs.type = "application/x-shockwave-flash";
      options.quality = "autolow";
      options.menu = "true";
      options.play = "true";
      options.loop = "false";
    }
    
    this.insertFlash = function(pn){
      var i, n, p;
      if (typeof pn == 'string')pn = document.getElementById(pn);
      pn = pn.parentNode;
      while(pn.hasChildNodes()) {
        pn.removeChild(pn.firstChild);
      }
      n = document.createElement((this.embed) ? "embed" : "object");
      for(i in this.attribs){
        n.setAttribute(i,this.attribs[i]);
      }
      if(!this.embed){
        for (i in this.params){
          p = document.createElement("param");
          p.setAttribute("value",this.params[i]);
          p.setAttribute("name",i);
          n.appendChild(p);
        }
      }
      pn.appendChild(n);
      // alert(pn.innerHTML);
    }
    
    this.parseSettings();
    this.insertFlash(pfoId);
  }

}

hmm... so much for formating
Mike

Add Thank You Quote this message in a reply
Jul. 31, 2006, 11:44 AM
Post: #3
RE: flash to image
Very impressive!
Add Thank You Quote this message in a reply
Jul. 31, 2006, 02:15 PM
Post: #4
RE: flash to image
ProxRocks Wrote:Very impressive!

Thanks, any ideas on improving on it?

One idea I've been kicking around is intercepting document.write(). This might be able to catch some of the flash thats proving difficult to "text match" on. So far I haven't progressed passed the "thinking about" stage with that idea.

Mike
Add Thank You Quote this message in a reply
Jul. 31, 2006, 02:39 PM
Post: #5
RE: flash to image
z12 Wrote:
ProxRocks Wrote:Very impressive!

Thanks, any ideas on improving on it?
I'll think about it for a spell and see if any thoughts surface...
I've been working on a Flash Toggler at home (with limited sucess), so I may have some notes there that may jog a thought or two...
Add Thank You Quote this message in a reply
Jul. 31, 2006, 03:59 PM
Post: #6
RE: flash to image
ProxRocks Wrote:I'll think about it for a spell and see if any thoughts surface...

ok, thanks.

I thought about making it a "toggler", but I haven't figured out a good way of doing it. My first thought was to display a link inside the object/embed container, but from my testing, I see that would mess up the height/width of the flash so I decided against it. Maybe a mouseover event could do the job.

Mike
Add Thank You Quote this message in a reply
Jul. 31, 2006, 05:56 PM
Post: #7
RE: flash to image
z12 Wrote:I thought about making it a "toggler", but I haven't figured out a good way of doing it.

Mike

guess it depends on how one defines "toggler"...
imo, "delaying" the load until the user 'requests' the Flash (by clicking the image) is as good as gold - i wouldn't worry too much about 'toggling' it back "off" once the user opted to load it...

my main problem in my current config set is that it "toggles" Flash fine, but they load in the background BEFORE being "toggled" - a no-no in my eyes (I'm on dial-up at home)... so "delaying" their 'load' doesn't decrease the page load time at all...
Add Thank You Quote this message in a reply
Jul. 31, 2006, 06:29 PM
Post: #8
RE: flash to image
ProxRocks Wrote:imo, "delaying" the load until the user 'requests' the Flash (by clicking the image) is as good as gold - i wouldn't worry too much about 'toggling' it back "off" once the user opted to load it...

Yeah, it wasn't a priority for this filter. Maybe later.

Think I'll look around for more sites that are getting past this filter by using variables with document.write() to load the flash. It seems to be a fairly common method.

Mike
Add Thank You Quote this message in a reply
Jul. 31, 2006, 07:48 PM
Post: #9
RE: flash to image
z12 Wrote:hmm... so much for formating
Mike
My import of this filter (into a different config) has mysteriously stopped functioning...
Do you mind attaching a "formatted" version of the above script - I'm not sure if an extra space or something has caused some errors on my end (to eliminate one variable, at least)...
Add Thank You Quote this message in a reply
Jul. 31, 2006, 09:26 PM
Post: #10
RE: flash to image
Yep here you go.

Included is the new filter & js I'm trying out. The js for this new filter is much smaller. So far, it's catching the same flash as before plus some that the other filter was missing due to variables in document.write(). Haven't had a chance to try it in ie yet.

Mike


Attached File(s)
.txt  flash_filter.txt (Size: 5.05 KB / Downloads: 813)
Add Thank You Quote this message in a reply
Aug. 01, 2006, 11:51 AM
Post: #11
RE: flash to image
z12 Wrote:Yep here you go.

Included is the new filter & js I'm trying out. The js for this new filter is much smaller. So far, it's catching the same flash as before plus some that the other filter was missing due to variables in document.write(). Haven't had a chance to try it in ie yet.

Mike
Cool! Much appreciated...
I'll give 'er a run in IE (actually, I swap back and forth between GreenBrowser {my current default}, Maxthon {patiently awaiting v2.0}, and Sleipnir primarily [with ocassional drive-by's with Acoo, Avant, SlimBrowser, and Tablane], all IE shells)...

I should be up-and-running later this morning...
Add Thank You Quote this message in a reply
Aug. 01, 2006, 03:47 PM
Post: #12
RE: flash to image
Attached is the latest version of the filter, made a few minor tweaks.

I got it working on youtube for ff & opera, but not with ie . The js code they are using is causing the problem. I see what the issue is, but I'm not sure how to get around it yet.

Mike


Attached File(s)
.txt  flash_filter_2.txt (Size: 733 bytes / Downloads: 771)
Add Thank You Quote this message in a reply
Aug. 01, 2006, 04:28 PM
Post: #13
RE: flash to image
Here is something I've had to start using recently...

A few sites have started using a MM_FlashCanPlay variable that isn't behaving as it should...

An example (copied directly from ING Direct's login page; http://home.ingdirect.com/index.html):
Code:
<script language=JavaScript1.1><!--
            if ( MM_FlashCanPlay ) {
            document.write('<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"');
            document.write(' codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" ');
            document.write(' ID="ingflash" WIDTH="763" HEIGHT="299" ALIGN="">');
            document.write('<PARAM NAME="movie" VALUE="images/osa_oma_dynrate.swf"><PARAM NAME="quality" VALUE="high"><PARAM NAME="bgcolor" VALUE="#FFFFFF">');
            document.write('<EMBED src="images/osa_oma_dynrate.swf');
            document.write('" quality="best" bgcolor="#FFFFFF" ');
            document.write(' swLiveConnect="FALSE" WIDTH="763" HEIGHT="299" NAME="ingflash" ALIGN=""');
            document.write(' TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">');
            document.write('</EMBED>');
            document.write('</OBJECT>');
        } else{
            document.write('<img src="images/osa_noflash.gif" width="550" height="299" alt="" border="0">');
        }
        //--></script>
No matter what browser (or Proxo config) I use, I keep getting the "osa_noflash.gif" image displayed - meaning MM_FlashCanPlay is *NOT* doing its job and reporting that my browser CAN play Flash...

I've started using a filter to block out the if/else MM_FlashCanPlay:
Code:
Name = "Workaround: 'MM_FlashCanPlay' if/else {Prox(Fox|Rocks)}"
Active = TRUE
Multi = TRUE
URL = "($TYPE(htm)|$TYPE(js)|$TYPE(vbs))"
Bounds = "<script*/script>"
Limit = 4096
Match = "\1<!--(\s|)if(\s|)\((\s|)MM_FlashCanPlay(\s|)\)(\s|)\{\2\}(\s|)else(\s|)\{\3\}\4"
Replace = "\1\2\4"
and that seems to have cleared up those "issues"...
Add Thank You Quote this message in a reply
Aug. 01, 2006, 05:34 PM
Post: #14
RE: flash to image
Ok, attached is another filter & js update. Rearranged the replacement text and shrunk the js (again).

IE, ff & opera now work on youtube. They also all worked at the link you posted: http://home.ingdirect.com/index.html (without the workaround filter)

Let me know how it works for you.

Mike


Attached File(s)
.txt  flash_filter_3.txt (Size: 1.14 KB / Downloads: 774)
Add Thank You Quote this message in a reply
Aug. 01, 2006, 06:45 PM
Post: #15
RE: flash to image
I've been trying to import these into a sidki-3.5.06-based config to no avail...

Am I overlooking something?


edit: I suspect it's $TST(bScript=*), but I can't seem to find the suitable sidki-specific replacement...
Add Thank You Quote this message in a reply
Post Reply 


Forum Jump: