Forum: Rails Spinoffs (closed, excessive spam) Prototype-based widgets

99d442441900d0b530ebca624d79de12?d=identicon&s=25 Jeremy Jongsma (Guest)
on 2008-04-23 08:46
(Received via mailing list)
Two reasons for this post:

1) I've built a number of prototype-based input widgets over the years
that I use quite regularly on my web projects, but I just realized
I've never shared them with the community (they're GPL licensed).  So
here you go: http://home.jongsma.org/software/js/

2) The demos on my site are using prototype 1.4.0.  I just tested and
all of them work fine on the latest (1.6.0.2) except the colorpicker.
If you download and use the colorpicker widget with prototype 1.6.0.2,
the color swatches in the dropdown box do not appear (the whole panel
is gray).  But mousing over the panel still shows the colors that
should be there, and clicking selects a color as it should.  Before I
waste a lot of time debugging this, does anyone know of a difference
between 1.4.x and 1.6.x that could cause this?  I tried loading
prototype_update_helper.js to see if it gives me any insight but it
fails (console not defined in FF?)

I hope you find these useful, and I'll try to fix up the colorpicker
for 1.6.0.2 as soon as possible.

-j
Af85e01e19b6caa679621b7b783a598f?d=identicon&s=25 T.J. Crowder (Guest)
on 2008-04-23 10:33
(Received via mailing list)
Hi Jeremy,

Very cool, thanks for sharing those.  I really like your take on the
RTE (feature bloat and ugliness are defnitely issues many of the RTEs
out there have).

If you haven't already done so, have you considered submitting these
to scripteka.com?

FWIW: Your RTE shares two common problems I have with others out
there, so I thought I should mention them:

1. It's easy to get into a situation where Ctrl+End puts you at the
end of the last line of visible text, but as soon as you type a
letter, the letter is put at the beginning of the next line instead.
This is *incredibly* frustrating, and it's a common problem with
several RTEs I've found.  If you could fix that one, you'd be golden.
One of the myriad ways to create it:

* Press Ctrl+A to select all text
* Press Del
* Type a sentence and press Enter
* Press backspace
* Press Ctrl+Home
* Press Ctrl+End

At this point, the cursor is at the end of the line of text.  But if
you type a letter, it appears at the beginning of a new line.
(Firefox 2.0.0.14, Windows XP)

That series of steps looks complicated, but you understand it's just a
reliable example; in practice, this situation is incredibly easy to
set up.  I don't know why so many RTEs have this problem, perhaps
they're all deriving Kevin Roth's code.

2. Clicking in the blank area underneath all text you've typed should
put the cursor at the end of the text like Ctrl+End does, rather than
ignoring the click (IMHO).

Again, thanks for sharing, and these are nits being picked.
--
T.J. Crowder
tj / crowder software / com
F3cf74d456662cf50cafa74433a83e5b?d=identicon&s=25 Brian Williams (Guest)
on 2008-04-23 15:39
(Received via mailing list)
Thanks for sharing.

I wish this had been posted ages ago I wouldn't be using YahooUI stuff
right
now if it had been.

I have a question about the RTE:  does it load properly if loaded via
AJAX?

A few weeks ago I was looking for a way to easily load a RTE via AJAX
without having to install ruby and rails and this and that and the other
to
get special functionality out of Prototype to allow AJAX loaded js
access to
the global scope -- i finally figured out how to do it with TinyMCE, my
only
dislike of TinyMCE is how massive it is.


PS did you fix the color chooser because its working fine for me
(Windows
Vista Business (gag me - I'm at work) FF 2.0.0.14)
F1fcf834ddad415f60d29c87cc10d4d4?d=identicon&s=25 kangax (Guest)
on 2008-04-23 16:39
(Received via mailing list)
Good stuff, Jeremy.

RTE is something that prototype ecosystem always lacked : )

Feel free to submit it to http://scripteka.com.

Best,
kangax
99d442441900d0b530ebca624d79de12?d=identicon&s=25 Jeremy Jongsma (Guest)
on 2008-04-23 17:57
(Received via mailing list)
TJ -

Thanks for the feedback.  I will look into those issues.  This is also
the first of I've heard of scripteka, I'll definitely post these
there.

Brian -

That's actually the main reason I built RTE.  I had a site that loaded
content and forms via AJAX, and couldn't find a good editor that I
could setup and tear down at will.  To add it to a textarea with a CSS
id of "my_editor", just use:

var rte = new Control.RTE('my_editor', '/images/rte');

If you replace the form (via AJAX or something), or just want to
restore the original textarea, use:

rte.destroyEditor();

...and the original textarea will reappear.  I find this particularly
useful when you give the user a choice of entering content in
plaintext or HTML; as they select their choice, you can instantly
convert the textarea to the desired format.

Did you download and test ColorPicker locally with 1.6?  On my site
I'm still using Prototype 1.4, which it works fine with.

-j
6190ccd07d6f6984639bcece3543b5a9?d=identicon&s=25 darrin (Guest)
on 2008-04-23 17:58
(Received via mailing list)
Very nice! Already thinking of a use for the RTE.

Darrin
F3cf74d456662cf50cafa74433a83e5b?d=identicon&s=25 Brian Williams (Guest)
on 2008-04-23 18:02
(Received via mailing list)
ah, my bad, it was on the site that i was testing it
99d442441900d0b530ebca624d79de12?d=identicon&s=25 Jeremy Jongsma (Guest)
on 2008-04-23 19:28
(Received via mailing list)
I submitted RTE, ColorPicker, and DatePicker to scripteka.  Thanks for
the suggestion.

-j
99d442441900d0b530ebca624d79de12?d=identicon&s=25 Jeremy Jongsma (Guest)
on 2008-04-24 08:38
(Received via mailing list)
The colorpicker was updated to work with 1.6.0.2.

Apparently somewhere between 1.4 and 1.6 Element.setStyle() stopped
accepting css attributes (i.e. margin-left) and insisted on camelized
JS styles (i.e. marginLeft).

-j
147bb0ea50239211f589d59c74660628?d=identicon&s=25 Greg Hemphill (Guest)
on 2008-04-24 16:28
(Received via mailing list)
FYI... the RTE doesn't appear to work in Safari (v 3.1.1 on a Mac).
99d442441900d0b530ebca624d79de12?d=identicon&s=25 Jeremy Jongsma (Guest)
on 2008-04-24 18:44
(Received via mailing list)
I'll check into it.  It's been awhile since I've tested RTE since I've
been forced to use TinyMCE on some projects lately due to the
difficulty of cleaning up the unholy mess that is Microsoft Word cut-
and-paste HTML.

-j
Cc9ea3ae6329d9e88adfba76a542735a?d=identicon&s=25 Ken Snyder (Guest)
on 2008-04-24 19:13
(Received via mailing list)
Jeremy Jongsma wrote:
> I'll check into it.  It's been awhile since I've tested RTE since I've
> been forced to use TinyMCE on some projects lately due to the
> difficulty of cleaning up the unholy mess that is Microsoft Word cut-
> and-paste HTML.
>
> -j
>
If you're using PHP, you ought to check out HTMLPurifyer
(http://htmlpurifier.org/demo.php) to wrangle Microsoft Word's demonic
HTML.  I just started using HTMLPurifier with a jQuery WYSIWYG editor
and it is fantastic.

- Ken Snyder
299a3d891ff1920b69c364d061007043?d=identicon&s=25 jdalton (Guest)
on 2008-04-24 19:26
(Received via mailing list)
Jeremy,

You should be able to use element.setStyle('margin-left:10px');

-JDD
6e780ee0dc0dd59c93cdcaf45cdef2e4?d=identicon&s=25 Gareth Evans (Guest)
on 2008-06-10 01:31
(Received via mailing list)
Jeremy

I was trying to use your RTE but was having a few problems.
I'm using IE8 in 7 emulation mode, but I haven't encountered many
oddities.
My problem was that the Iframe didn't appear to have a width or a
height.
The developer toolbar wasn't much help, but eventually I found that if I
applied the width and height settings to frameDiv as well as to the
frame,
then it worked.
What confuses me, is that it works on your website, in the same browser
- so
there must be something screwing my style up.
Just thought i'd give you a heads up anyway.

Gareth

On Fri, Apr 25, 2008 at 5:25 AM, jdalton <John.David.Dalton@gmail.com>
This topic is locked and can not be replied to.