Anyone Good With Javascript?

[cstdenis]

I'm planning a new feature for FAC that makes heavy use of JavaScript.

I'm sick of fighting with it. Anyone here good with Javascript and want to help out?
_________________
You will obey or molten silver will be poured into your ears.

[Stratadrake]

Unfortunately no, I know a smidgen of C and that Javascript is C-like, but I've never had need to program anything with it, so . . . .
_________________
Strata here: [url=http://www.nanowrimo.org/eng/user/242293]Nanowrimo[/url] - [url=www.fanart-central.net/user-Stratadrake.php]FAC[/url] - [url=http://stratadrake.deviantart.com]dA[/url] - [url=www.furaffinity.net/user/Stratadrake/]FA[/url]
[size=9]Disclaimer: Posts may contain URLs. Click [url=http://tvtropes.org/pmwiki/pmwiki.php/Main/TVTropesWillRuinYourLife]at your own risk.[/url][/size]

[SilentSoul92]

me...but I doubt it will be compatible with the website..plus I'll probably mess something up. But if no one else wnats to try, I'll give it a shot.

[cstdenis]

http://www.fanart-central.net/hier.php

The filter is linked to the second listbox. Make it link such that when you change the list, the text in the filter still applies and when you change the filter after changing the list the second list box doesn't revert to its previous state.

That should be more clear after you see it.

Also, do so without changing any of the existing javascript functions if possable, just add to the onChange events. You can create your own blocks of javascript code if you need to.
_________________
You will obey or molten silver will be poured into your ears.

[Stratadrake]

Ah, the lovely snags of event-driven scripting/programming . . .
_________________
Strata here: [url=http://www.nanowrimo.org/eng/user/242293]Nanowrimo[/url] - [url=www.fanart-central.net/user-Stratadrake.php]FAC[/url] - [url=http://stratadrake.deviantart.com]dA[/url] - [url=www.furaffinity.net/user/Stratadrake/]FA[/url]
[size=9]Disclaimer: Posts may contain URLs. Click [url=http://tvtropes.org/pmwiki/pmwiki.php/Main/TVTropesWillRuinYourLife]at your own risk.[/url][/size]

[SilentSoul92]

Ok, I'll give it a shot, I'm not promising anything though...

[SilentSoul92]

oh crud...I messed up big time. Yikes, the programs been mutated into a virus or something. Good thing I didn't test it out with the site. Ok...T-T you're gonna need to find someone else. Everytime I try to preserve the original javascript code while keeping the link intact, it unravels and falls ontop of me. Yeah, anyone else wnat to try? I'll give it another shot...but I'm not so sure that I can get it right...

[Stratadrake]

I can see what Denis is trying to do here, and while I could easily express how it would works in, say, VB language, trying to express it in Javascript is another matter entirely . . . .

I have an idea that could possibly work simpler, though I'm not entirely sure how to code it... basically to make the dropdown list mimic the behavior of the regular sidebar category listings.
_________________
Strata here: [url=http://www.nanowrimo.org/eng/user/242293]Nanowrimo[/url] - [url=www.fanart-central.net/user-Stratadrake.php]FAC[/url] - [url=http://stratadrake.deviantart.com]dA[/url] - [url=www.furaffinity.net/user/Stratadrake/]FA[/url]
[size=9]Disclaimer: Posts may contain URLs. Click [url=http://tvtropes.org/pmwiki/pmwiki.php/Main/TVTropesWillRuinYourLife]at your own risk.[/url][/size]

[SilentSoul92]

hm, I can try that, as for the coding, 4-6 letter code should do.

[Stratadrake]

Denis, I did a bunch of experimenting with the Javascript -- specifically, the swapOptions() routine (and a bit of nailbiting trying to diagnose basic syntax errors in Wordpad), what do you think of this?

Basically, I made the dropdown list act kinda like the regular sidebar category listings. Click, click, click . . . .

I didn't do any toying around with the sort/filtering routines though . . . I was more interested in making a neat category selection interface that worked . . . .

And because it's just the way I work, I commented it rather thoroughly.
_________________
Strata here: [url=http://www.nanowrimo.org/eng/user/242293]Nanowrimo[/url] - [url=www.fanart-central.net/user-Stratadrake.php]FAC[/url] - [url=http://stratadrake.deviantart.com]dA[/url] - [url=www.furaffinity.net/user/Stratadrake/]FA[/url]
[size=9]Disclaimer: Posts may contain URLs. Click [url=http://tvtropes.org/pmwiki/pmwiki.php/Main/TVTropesWillRuinYourLife]at your own risk.[/url][/size]

[cstdenis]

Just gives a bunch of errors, but I'll take a good look at it later and see what i can make of it.
_________________
You will obey or molten silver will be poured into your ears.

[SilentSoul92]

ah crud, hey denis, is it ok if I alter the original javascript functions just a BIT. The results should still be the same as if I had'nt changed them, it's just, this thing keeps bouncing back and whacking me on the head. It'll just be a tiny change to the original coding, you won't even notice it...I hope...

[cstdenis]

It was prefered to not have the origional script modified because of the way it is generated by another script (pear HTML_Quick_form and pear HTML_Quick_form_SelectFilter), but if necessary I can work with it modified.
_________________
You will obey or molten silver will be poured into your ears.

[Stratadrake]

At least IE has Javascript debugging info available . . . caught a rogue comma in the array declarations throwing IE off (but, strangely, not NS). I'll update that attachment (edit: done).

Basically, the changes I made were that the subcategory arrays have to include path/parent info for the particular section as well as the category itself and its available subcats, and I modified SwapOptions() (same calling syntax, different results) to work with just one dropdown list box (instead of the set of five, like it was). Appears to work just fine as a standalone HTML file, but relative to FAC's existing database/scripting architecture, best to assume that all bets are off :lol:

Here's a quick screenie for example. Say "subcat 13" is the currently selected category. The listing shows the category chosen, its available subcategories (below), and also its parent categories (above). Toss in some array generation to hold the actual category data, and you have a Javascript version of the sidebar category listings.

Although, I will say that your current version of the script (with the five listboxes and full category lists) STILL loads much faster than the single master category dropdown list. Must be because about 1/3 to 1/2 the bandwidth for the current dropdown list is just a bunch of empty   . . . .
_________________
Strata here: [url=http://www.nanowrimo.org/eng/user/242293]Nanowrimo[/url] - [url=www.fanart-central.net/user-Stratadrake.php]FAC[/url] - [url=http://stratadrake.deviantart.com]dA[/url] - [url=www.furaffinity.net/user/Stratadrake/]FA[/url]
[size=9]Disclaimer: Posts may contain URLs. Click [url=http://tvtropes.org/pmwiki/pmwiki.php/Main/TVTropesWillRuinYourLife]at your own risk.[/url][/size]

[cstdenis]

Hmm, interesting system.

Still gives errors, but more or less seems to work.

doesn't work with filtering tho. Dont know if thats a bug or you just didn't program it. Seems to me it would be hard to program, at least well.
_________________
You will obey or molten silver will be poured into your ears.

[Stratadrake]

Absolutely, positively, didn't even [i]think[/i] about the filtering when I was experimenting with it.

However, I think I know a way to do it, would require a minor modification to SwapOptions() as well as changes to SelectFilter():

1 - Declare var [i]the_array[][/i] globally, not locally.
2 - Declare a global category ID var (I'll call it "selCat"), initialized to zero.
3 - SwapOptions() works like normally, with the addition that when it loads a new subcategory listing it sets var selCat = the category ID.
4 - SelectFilter() remains mostly the same, except for a few tweaks:
4a - If selCat = 0, that's the main category listing, don't do any filtering. Wait until the user selects a subcategory before trying again.
4b - Otherwise, load the list contents from [i]the_array[/i] just like swapOptions does.
4c - The "category path" array element are never subjected to filtering. Declare a local var (I'll call it "subcat") initialized to False before the loop.
4d - SelectFilter() begins loading the list options from [i]the_array[/i]. No filtering is performed when subcat==false.
4e - When SelectFilter() loads the list option for the current category (array index = selCat), it sets subcat=true and all subsequent items in [i]the_array[/i] (i.e. subcategories) will be subjected to filtering.
5 - Since SelectFilter() reloads the listing from scratch like SwapOptions does, there's no need to have the textbox fire the category[0].onClick event when changed.

Hmm . . . any ideas about a good Javascript debugger? I tried experimenting with this idea myself, but there's an error somewhere that I haven't located yet....

Additionally, how do you link it so that when the user selects a new subcategory, the current search filter (if any) will automatically be applied? IMO, where SwapOptions() would load the new list contents, make it call SelectFilter() instead.
_________________
Strata here: [url=http://www.nanowrimo.org/eng/user/242293]Nanowrimo[/url] - [url=www.fanart-central.net/user-Stratadrake.php]FAC[/url] - [url=http://stratadrake.deviantart.com]dA[/url] - [url=www.furaffinity.net/user/Stratadrake/]FA[/url]
[size=9]Disclaimer: Posts may contain URLs. Click [url=http://tvtropes.org/pmwiki/pmwiki.php/Main/TVTropesWillRuinYourLife]at your own risk.[/url][/size]

[SilentSoul92]

The only problem with that would be, when you go to filter it, wouldn't the others revert to the old form. That's what happened to me. What I don't get is, since the filter should have no influence on changing the second box...should it? Oh boy, this is the first time Ive done a design with so much use of Javascript.

[Stratadrake]

Well, I was able to revise the filter function for my version (single listbox) of the idea. Had a few critical errors (the kind that cause the code to simply not work when viewed in the browser), but I figured out a way to hunt them down easily, i.e. rem the entire procedure and switch it back on line-by-line.

For me, the key thing about the filter function is that I used global vars to match [i]the_array[/i] instead of a the actual listbox contents, and thus no need to check if it's the first time a user enters a search spec or not. SwapOptions() sets the globals, SelectFilter() uses them, in that order.

So, for my version it is as follows:

When you click the listbox:
- SwapOptions() does what it normally does: checks if there is any subcategory info available for the option clicked.
- IF you have entered a search spec for subcategories, SwapOptions() calls SelectFilter to handle it. Otherwise (no search spec, or main category list), swapOptions() proceeds to load the category listing itself.
- The current category/subcat info is stored in two globals: [i]the_array[/i] and [i]the_cat[/i]. [i]the_cat[/i] is initialized to zero (i.e. main category listing) to match how the listbox is initialized to the main category listing.

When you edit the textbox:
- SelectFilter() checks the current category shown ([i]the_cat[/i]) to make sure that it's not the main category listing. The main category list is never filtered.
- Then, it begins loading the path/subcat info from [i]the_array[/i] (as previously set by SwapOptions)
- SelectFilter() doesn't actually [i]start[/i] filtering the subcat list until it has finished with the category path/parent info (i.e. has loaded the option for current category). Then it filters all subsequent entries, and keeps a separate tally of how many matching subcats it found.
- If it didn't find any matching subcats, SelectFilter() adds a "(No matches found)" entry to the listbox to say so. The user can change the search spec or return to a parent category, whichever they wish. The "(No matches found)" entry is given the same value as the current category as a failsafe measure.

Works fine as a standalone HTML file (tested on IE6, NS7, and Firefox).
_________________
Strata here: [url=http://www.nanowrimo.org/eng/user/242293]Nanowrimo[/url] - [url=www.fanart-central.net/user-Stratadrake.php]FAC[/url] - [url=http://stratadrake.deviantart.com]dA[/url] - [url=www.furaffinity.net/user/Stratadrake/]FA[/url]
[size=9]Disclaimer: Posts may contain URLs. Click [url=http://tvtropes.org/pmwiki/pmwiki.php/Main/TVTropesWillRuinYourLife]at your own risk.[/url][/size]

[Stratadrake]

I'm curious, denis, what's the latest word on this subject?

I did some tweaking using the five-box setup, trying to use some of the same code I used in the single-box version. (I sorta like the single-box setup better, but that's a different matter) The original bugs are still there though -- I haven't found a quick way to deal with them (keeping the listbox and filter specs synched was much easier with just one box instead of five), though.
_________________
Strata here: [url=http://www.nanowrimo.org/eng/user/242293]Nanowrimo[/url] - [url=www.fanart-central.net/user-Stratadrake.php]FAC[/url] - [url=http://stratadrake.deviantart.com]dA[/url] - [url=www.furaffinity.net/user/Stratadrake/]FA[/url]
[size=9]Disclaimer: Posts may contain URLs. Click [url=http://tvtropes.org/pmwiki/pmwiki.php/Main/TVTropesWillRuinYourLife]at your own risk.[/url][/size]

[cstdenis]

I think both systems have potential.

If your single box is fully working, I may impliment it sometime soon.

Basically, I got frusterated with it and lost interest for a while, moving on to other site work like page titles and friendly URLs which you may or may not have noticed.
_________________
You will obey or molten silver will be poured into your ears.