Prototype v.1.6.1 and Hobo

5 views
Skip to first unread message

blueHandTalking

unread,
Nov 19, 2009, 3:35:04 PM11/19/09
to Hobo Users
I am having trouble with displaying a dropdown menu
that has a scrolling div in it. Evidently the control

var scrollbar = new Control.ScrollBar
('scrollbar_content','scrollbar_track');

in the latest form is only in Prototype v.1.6.1.

This dropdown ( ddmenu.js --pastie http://pastie.org/705995 )

and the scrolling div work perfectly! ---but only after I open
Firebug.

There is a

scrollbar.recalculateLayout();

method I entered in Firebug console. After this everything is perfect.
I can even close Firebug and it still works.

This is driving me nutsy. I have no idea if it is something related
to mixing Prototype with Hobo, a newer version of Prototype, or
that both ddmenu.js and Control.Srollbar are using onmouseover.

The scrollbar is created when the DOM is loaded:

document.observe('dom:loaded',function(){
var scrollbar = new Control.ScrollBar
('scrollbar_content','scrollbar_track');
});

I have tried calling

scrollbar.recalculateLayout();

a variety of ways to update, but obviously not the right one.

Any ideas appreciated, and especially if there is any possibility
of this being related to Hobo. Nice to narrow down wrong areas
of investigation.

Cheers,

Jet

...

Bryan Larsen

unread,
Nov 19, 2009, 4:16:16 PM11/19/09
to hobo...@googlegroups.com
I assume you're only having the trouble in Internet Explorer? If so,
this is a bug in Prototype. Several workarounds are listed on the bug
report.

https://prototype.lighthouseapp.com/projects/8887/tickets/33-problem-with-scrolling-on-div-tags

Please report back how you fixed it -- I haven't actually fixed the
Barquin app that has the problem yet.

Bryan
> --
>
> You received this message because you are subscribed to the Google Groups "Hobo Users" group.
> To post to this group, send email to hobo...@googlegroups.com.
> To unsubscribe from this group, send email to hobousers+...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/hobousers?hl=.
>
>
>

blueHandTalking

unread,
Nov 19, 2009, 6:52:38 PM11/19/09
to Hobo Users
Evidently the last solution on the ticket page works.
However, it did not work in my situation. Thomas Fuchs
has not incorporated the changes into Prototype as yet.

...and yes, trouble is with IE 6. Actually the behavior
is somewhat erratic in Firefox also.

I did find that for what I want to do, the Jquery library
has a solution. I tried it in IE 6 and Firefox and it worked
great. I may change over to Jquery, since I am not too heavy
into Prototype. Does Hobo rely heavily on Prototype?

Could a transition be a lot of trouble?

In the future I am going to look at MooTools, evidently something
of the best of both worlds --- Prototype and Jquery.


jet

On Nov 19, 1:16 pm, Bryan Larsen <bryan.lar...@gmail.com> wrote:
> I assume you're only having the trouble in Internet Explorer?   If so,
> this is a bug in Prototype.   Several workarounds are listed on the bug
> report.
>
> https://prototype.lighthouseapp.com/projects/8887/tickets/33-problem-...

kevinpfromnm

unread,
Nov 19, 2009, 7:25:08 PM11/19/09
to Hobo Users
There is a hobo jquery plugin but I have not personally used it - have
heard good things though. It's up on the cookbook.

Bryan Larsen

unread,
Nov 19, 2009, 8:30:45 PM11/19/09
to hobo...@googlegroups.com
Both Tom & I are jQuery fans. jQuery works well with Hobo. There
really isn't a lot of prototype in Hobo.

blueHandTalking

unread,
Nov 19, 2009, 10:22:47 PM11/19/09
to Hobo Users
Bryan,

I found a solution that may work for you. I tried
to get the one on Script-dilly-icious working but
no go.

I discovered this older script for scrolling a div:

http://pastie.org/707093

The author at

http://www.jools.net/projects/javascript/scrollable-divs/

mentions it plays well with Ajax. I tested it in
IE 6 and Firefox 3.5.5 and it worked fine.

You will have to tweak the CSS controls to get it to
work well in both IE 6 and Firefox, et al. Also, I
commented out a couple lines in the pastie that need
to be flip-flopped depending what browser is seeing it.

Will not work in my situation, but maybe for you.

Cheers,

Jet

blueHandTalking

unread,
Nov 20, 2009, 1:09:35 PM11/20/09
to Hobo Users
Evidently I was just missing a library, as

document.observe('dom:loaded',function(){
var scrollbar = new Control.ScrollBar
('scrollbar_content','scrollbar_track');
});

now works fine in both IE 6 and Firefox. It was slider.js
that was missing. Also, in my situation I have to have overflow:scroll
(or auto) to get it to work in my animated drop down menu. I believe
this means no chance
of applying styles.

Link to necessary set up instructions:

http://livepipe.net/control/scrollbar

Basics:

Control.ScrollBar requires a very particular HTML structure. There
must be a positioned outer container, with the track and scrollable
container as direct children. The track must contain a single div
(with any id or class name). You do not reference the outer container
or handle when calling initialize(), only the scrollable content, and
the track. The scrollable content must have it's overflow **property
set to hidden**.

Cheers,

Jet

This is with Prototype v.1.6.1

Patrick Fitzgerald

unread,
Nov 21, 2009, 11:53:35 AM11/21/09
to hobo...@googlegroups.com
Hi All,
  Scratching my head over this one.  I have created a table using:

<table-plus fields="status, created_date, updated_date, file_path_link, user" />

Which display everything in a lovely table.  The thing is, file_path_link contains text which has the location of a file on the filesystem.  I want to make this a hyper link and cannot get it to work.

For example, if the text returned by file_path_link is: 1/2/filename.jpg

How do I make that a hyper link which points to:


The idea is that clicking on the text will allow the user to download the file.

All help and suggestions welcome!

Thanks,
Patrick

Bryan Larsen

unread,
Nov 21, 2009, 1:12:43 PM11/21/09
to hobo...@googlegroups.com
It should be something like:

<file-path-link-view:>
<a href="http://127.0.0.1:3000/#{this.to_s}" />
<file-path-link-view:>

If 127.0.0.1:3000 is the rails server, you should use #{root_path}
instead of hardcoding in the url.

cheers,
Bryan
Reply all
Reply to author
Forward
0 new messages