So here's the story, I need to archive the homepage of a popular news website. I've got this nice sassy little .net app thrown together (I stole this ("http://joshclose.net/?p=247") code mostly - http://joshclose.net/?p=247) and it's almost set, the only problem is, I want a special accordion button toggled. (there was another problem but I hacked it good enough for my needs so I'm not commenting).

The website I'm taking screenshots of I shall refer to as BMM.com (increment each letter to solve what news grp i'm talking about, but still consider that short for 'bowel movement Media' it's more suiting =P). The accordion module loaded by default seems erratic and subject to chance... See to the right where it says "pop on FaceBook", "Newspuls", "local weather", "..."

The method used to load the webpage off screen is webBrowser.Navigate( "www.BMM.com" );

My first naive attempt to crack this was to do something like
webBrowser.Document.FindAndReplace("<div id="pmNewspulseToggle" class="accordion-toggle">, "<div id="pmNewspulseToggle" class="accordion-toggle-active">" ) That's not the right code for it, but you get my plan I think.
(and thus, the CSS somewhere would presumably take over and expand the accordion properly??) But when I try updating the html code in opera, it get's gibberishy and broken... This makes me think I need to send some kind of java function to the page or something? But I can't find the "onClick" event for the accordion.

I did some scanning of the CSS last night, but I didn't get anywhere.. I found where the class "accordion-toggle-active" is defined in the CSS code, and it didn't seem to have anything that would expand the accordion.

What should I be looking for? And does anyone have tools to recommend for sorting out javascript/css/php and all that, too? It seems like someone must have written an app for downloading all linked-to content of an html page, and sorting it all out in an IDE type of interface.

Hi,

Have you used the Opera or Firefox DOM inspector plugins?

Looking at it with Opera Dragonfly, the accordian html seems to expand a bit further to include html elements such as..

<div id="pmTargetContainer">
<div id="pmNewsPulseTab" class="pmOn">
<div id="pmActivityTab" class="pmOff">

Perhaps you need to access those deeper elements?

Kayaker

Web reversing is fun, and the tools are becoming quite mature by now.

So take a deep breath and dive in, this is the first tool you'll want:

http://www.woodmann.com/collaborative/tools/Firebug

The second is a brief understanding of CSS and Javascript, in particular dynamic DOM manipulation. Not very hard at the end of the day, really.

If they use the annoyingly obfuscating jQuery lib, you might want the FireQuery plugin for Firebug too.

Some other useful stuff after that might be:

http://www.woodmann.com/collaborative/tools/Category:Javascript_Tools

I'm endlessly appreciative for the hints and links. Firebug, is imHo way friendlier than opera's firefly. I don't even think I was using opera right in the first place, lol.

It turned out that the height of one of the classes was getting set to zero when you clicked on another button (and to 194 when you click again, and it was getting set to visible or something).. I didn't see this with opera firefly, and I think I was manipulating the page wrong with opera which lead to the weird page breaking, not 100% sure, but I'll be sticking to firefox when I do this stuff from now on.

thx again