Mini Mods - Ajax Fisheye Menu

This modification was just something random that I adapted to vBulletin.. I will release it with the status of beta, and when it has been proven to be stable, I will update it...

Demo of fisheye effect:
Demo
Demo - Vbulletin Live example (slightly modified from original release)

Installation:
Step 1:
- Extract and Upload contents of the "upload" folder to your server

Step 2:
Admin CP> Plugins and Products> Manage Products> Add/Import Product> Import> product-ajax_fisheye_menu.xml

Step 3:
Admin CP> vBulletin Options> Ajax Fisheye Menu >
Change.... Path to 'fisheye' directory
Attachment 72006

Step 4:
- Add

$afm_menu

in whatever template you decide to show menu (most likely navbar or header template)

Step 5(skip if vBa CMPS is not installed):
If you have vBadvance CMPS installed, you will need to do the following in order for this to work on your homepage as well:
- Admin CP> vBa CMPS > Default Settings> Main Options>
- Under the 'Portal Output Global Variables' setting you will need to add "afm_menu"

Step 6:
- Now you will need to configure the menu entries.. open the 'afm_fisheye_menu' template under the 'Ajax Fisheye Menu' template group.
- To add new menu items just use the following format:

<a class="dock-item" href="#"><img src="fisheye/images/home.png" alt="home" /><span>Home</span></a>

To Update:
- Reupload contents of upload folder to forum root...
- Import new product XML file with the overwrite setting on

V. 0.95-beta
+ Added a couple necessary AdminCP options
--- Enable/Disable option
--- Path to fisheye directory option

V. 0.94-beta
+ Fixed IE Quick Edit bug
+ Fixed IE font size drop down bug
(I have a feeling that this version will fix most of the Ajax related bugs, but members will have to let me know...)

V. 0.93-beta
+ Fixed fisheye directory error... now you only have to upload to your root..
+ Mood Manager now able to change moods in IE..
+ Added a folder in zip called 'extras' that include a set of blue themed icons made from the original set...

V. 0.92-beta
[s] + Added $vboptions[bburl] reference to images and scripts for smoother integration (thanks yoyoyoyo)[/s]
+ Added install.txt within zip file

V. 0.91-beta
+ Fixed IE blocks bug
+ Moved Stylesheet to Templates for easier editing
-- You can now edit the stylesheet by going to the 'afm_fisheye_stylesheet' template
+ Cached Templates

V. 0.9 - beta release
+ Fisheye effect

Step 6:
Come back to this thread and give me some feedback...

Known Bugs:
[s] - One user reports hover effect doesn't work in opera browser[/s]
- User Reports conflicts with shoutbox and casino mod
[s] - Unable to change mood in Mood Manager while using IE6.. works in IE7 and firefox[/s]
[s] - Unable to use Quick Edit in IE[/s]
- User Reports bug with VBPicGallery: "This mod looks fine everywhere except the gallery, where the icons show as a huge size, with text next to them."
[s] - Advanced Editor has weird code inside text size selector and font selector drop down boxes[/s]

Future Features
AdminCP Options
[s] - Enable/Disable[/s]
- Maybe options to set images and links in menu
- Any other suggestions welcome...


Script adapted from:
http://www.ndesign-studio.com/blog/mac/css-dock-menu

Here are some free icons you could possibly use with the dock:
http://www.dezinerfolio.com/2007/02/...a-gloss-icons/

This site has hundreds of icons.. but the site is in chinese...
http://www.tucoo.com/icon/index.htm
[S] I will provided limited support for this hack, and will continue to work on and update it when I can.. [/S]

I am no longer developing or supporting this MOD...

There are other things in life more important than VB you know

[TheMilkCarton]

This plugin should be inserting javascript somewhere that has a value called "proximity" lowering this could help, but then the actual icons won't zoom as "fluidly" (As you move past them they'll kind of "pop" in and out of place instead of zoom gradually)

Alternately, you could follow the steps I posted above to download the original Fisheye source, but instead you would change the posy value in the JavaScript to make the vertical range that affects the dock smaller.

I converted mine to vertical though, so I can't tell you what you'd have to change for sure... since I'm not the greatest with math, and the way I modified the JS was more of a "guess and check". =p You could TRY changing the "posy =" line to

var posy = Math.pow(pointer.y - el.fisheyeCfg.pos.y - el.offsetHeight/2,3);

(notice the higher power)... and if that doesn't work enough you can increase it to 4, or just square the "posy" in the distance formula (it should do the same thing).

[toddos]

well the first way was very nice, thank you !!!

and is there a way to set the space between the icons higher ?

[TheMilkCarton]

Just change the CSS. Either try changing the width of the link or the padding between them. I can't tell you for sure though as I made my layout vertical from day one and the CSS is completely different.

[whitetigergrowl]

Originally Posted by toddos

hi, where can i define the option when the icon is getting bigger if the mouse is coming ?

I put the menue in my navbar, but now i can't click on the logout link, because before i go to the link the fisheye menu icons are coming out

In the afm_fisheye_menu template, towards the bottom, you'll see 2 options for docking. dock and dock2. Adjust the 'proximity' for both to your liking. Do some testing till you get your desired results.

[TheMilkCarton]

Originally Posted by whitetigergrowl

In the afm_fisheye_menu template, towards the bottom, you'll see 2 options for docking. dock and dock2. Adjust the 'proximity' for both to your liking. Do some testing till you get your desired results.

His question was already answered?

And as I said in my post this isn't really the best solution as that also affects how well the icons magnify as you move your mouse across them. The real solution would be to make the vertical range that the mouse must be in to magnify the icons *smaller*, and that takes a just-as-simple JS edit that I also provided.

[toddos]

hi again,
my pictures are very fuzzy, suziq, is this normal ?

[isurua]

Becomeunbroken: thanks, nice mod .

I'm also wondering how you setup those really nice drop down top menus on the http://www.becomeunbroken.com site - they look fantastic.

Any info would be greatly appreciated.

Thank you,
Isuru

[Magnumutz]

The only problem i got is fitting it into my template...
If anyone is willing to help me, here's my forum's link: www.smeker.ro
I'm want to fit it to the right from the logo.

[inciarco]

I've Noticed that This Hack Slows Down the Movement of the Smilies after Browsing some Pages, when the Mouse Cursor is Moving and Movement of the Smilies is Normal only when Mouse Cursor isn'r Moving!!

Perhaps something in the Memory isn't Clearing Right and Accumulates and Saturates something in Memory or in the Internet Explorer Browser!!

I'm 100% Sure of this because I've Tested that Behavior by Disabling the Fisheye Menu Hack and Speed of the Smilies Restores to Normal!!

As I Told this Happens a few minutes and after Browing into some Pages on the Forum!!

The Hack Works Great, this is a Little Bug I've Noticed since some time Ago!!

My Best Regards!!

[nectons]

It works like a charm.. one of the best mods for me dudes.. EXCELENT job.. the only think is with internet explorer.. in vba it works without zoom at all.. inside the forums plays with 2-3 seconds delay (for the zooming) ... with firefox plays lightspeed without any delay.. Maybe can be a fix for this ? .. THANKS A MILION i installed offcource..