Hello i wrote a class "selectable" for select and multipe-select List-Items based on scriptaculous. Look at: http://test.relationpage.ch/qg/js/rp/test/selectable.htm you can select items by click them and ctrl / shift - click others, and navigate with up-/down keys. the script: http://test.relationpage.ch/qg/js/rp/selectable.js on line 38 i have a problem: 2 Variables defined in the class one of them is visible in the handler-function the other is not visible... WHY?? Feel free for tips and critism. Tobias --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs -~----------~----~----~----~------~----~------~--~---
Hello i wrote a class "selectable" for select and multipe-select List-Items based on scriptaculous. Look at: http://test.relationpage.ch/qg/js/rp/test/selectable.htm you can select items by click them and ctrl / shift - click others, and navigate with up-/down keys. the script: http://test.relationpage.ch/qg/js/rp/selectable.js on line 38 i have a problem: 2 Variables defined in the class, one of them is visible in the handler-function the other is not visible... WHY?? Feel free for tips and critism. Tobias --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs -~----------~----~----~----~------~----~------~--~---
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type"> </head> <body bgcolor="#ffffff" text="#000000"> Hey Tobias,<br> Today''s your lucky day. I was bored and just felt like helping out so I rewrote your selectable code. Now not everything works, but I think if you read the code you''ll learn a lot about OOP.<br> <a class="moz-txt-link-freetext" href="http://colin.mollenhour.com/selectable.html">http://colin.mollenhour.com/selectable.html</a><br> <a class="moz-txt-link-freetext" href="http://colin.mollenhour.com/include/selectable.js">http://colin.mollenhour.com/include/selectable.js</a><br> <br> Some notes:<br> Isn''t the Protoype class structure so much more clean? What you had before really wasn''t a class structure, it was a single function with functions being assigned to element attributes.<br> It now requires a tagName specified (default ''li''). This could be done other ways but requiring the tagName ensures that other elements don''t interfere with your DOM search. If there are other elements (nested lists, table cells, etc.) then you can always specify the className to avoid selecting the wrong ones.<br> Use bind() or bindAsEventListener() to set the value of "this" inside a function. Read up more on these as this should answer your original question.<br> I chopped a full 40 lines (>20%) by removing redundancies. This makes maintenance later much easier as well.<br> I also implemented the entire class without a single function or variable in the global namespace. This enhances readability and reduces chances of conflicts with other libraries or code.<br> Not the use of Event.findElement() on line 20. This makes sure you get the correct element when the element you want contains other elements (hence the need for a tagName). Before, clicking the checkbox that was nested inside the list item would result on Event.element() returning the checkbox and not the list item.<br> You had a logic error when trying to deselect an element. First you would clear all selections, and then toggle, but the toggle would reselect the element you wanted to deselect since clear had already deselected it.<br> <br> The CTRL key works but the SHIFT doesn''t. I didn''t even try to fix it so I don''t know why it doesn''t work but I''m sure you can figure it out from here. That part of the code I made changes to but didn''t pay attention to what it was doing but it looks like possibly a simple logic error or a problem with next/previousElement.<br> <br> Have a good day!<br> <br> Colin<br> <br> Tobias Buschor wrote: <blockquote cite="mid718dcfbf0609021614k6fbc3c24pcd7d6ab1707ddb45-JsoAwUIsXosN+BqQ9rBEUg@public.gmane.org" type="cite">Hello <br> <br> i wrote a class "selectable" for select and multipe-select List-Items based on scriptaculous.<br> <br> Look at:<br> <a href="http://test.relationpage.ch/qg/js/rp/test/selectable.htm" target="_blank" onclick="return top.js.OpenExtLink(window,event,this)">http://test.relationpage.ch/qg/js/rp/test/selectable.htm </a><br clear="all"> <br> you can select items by click them and ctrl / shift - click others, and navigate with up-/down keys.<br> <br> the script:<br> <a href="http://test.relationpage.ch/qg/js/rp/selectable.js" target="_blank" onclick="return top.js.OpenExtLink(window,event,this)">http://test.relationpage.ch/qg/js/rp/selectable.js </a><br> <br> on line 38 i have a problem: 2 Variables defined in the class, one of them is visible in the handler-function the other is not visible... WHY??<br> <br> Feel free for tips and critism.<br> <br> Tobias <br> <br> </blockquote> <br> --~--~---------~--~----~------------~-------~--~----~<br> You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. <br> To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org <br> To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org <br> For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs <br> -~----------~----~----~----~------~----~------~--~---<br> </body> </html> <br>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html;charset=ISO-8859-1"
http-equiv="Content-Type">
</head>
<body bgcolor="#ffffff" text="#000000">
Ok, I couldn''t help it. I played around a bit with the key
controls a
bit and it is pretty cool. I tried to get it to behave exactly like the
usual multi-selectable box but it isn''t quite there (shift and up/down
keys in combo don''t always behave right). I think you''d have
to store
two focus elements (begin and end) to get it working right in all
cases.<br>
<br>
Is there a way to prevent the browser from selecting text when you hold
the shift key and use up/down arrows? Or a way to deselect text?<br>
<br>
Colin<br>
<br>
Colin Mollenhour wrote:
<blockquote
cite="mid44FB5116.9050508-NPSFNn/7+NYVo650/ln6uw@public.gmane.org"
type="cite">
<meta content="text/html;charset=ISO-8859-1"
http-equiv="Content-Type">
Hey Tobias,<br>
Today''s your lucky day. I was bored and
just felt like helping out
so I rewrote your selectable code. Now not everything works, but I
think if you read the code you''ll learn a lot about OOP.<br>
<a class="moz-txt-link-freetext"
href="http://colin.mollenhour.com/selectable.html">http://colin.mollenhour.com/selectable.html</a><br>
<a class="moz-txt-link-freetext"
href="http://colin.mollenhour.com/include/selectable.js">http://colin.mollenhour.com/include/selectable.js</a><br>
<br>
Some notes:<br>
Isn''t the Protoype class structure so much more clean? What you had
before really wasn''t a class structure, it was a single function with
functions being assigned to element attributes.<br>
It now requires a tagName specified (default ''li''). This could
be done
other ways but requiring the tagName ensures that other elements don''t
interfere with your DOM search. If there are other elements (nested
lists, table cells, etc.) then you can always specify the className to
avoid selecting the wrong ones.<br>
Use bind() or bindAsEventListener() to set the value of "this" inside
a
function. Read up more on these as this should answer your original
question.<br>
I chopped a full 40 lines (>20%) by removing redundancies. This
makes maintenance later much easier as well.<br>
I also implemented the entire class without a single function or
variable in the global namespace. This enhances readability and reduces
chances of conflicts with other libraries or code.<br>
Not the use of Event.findElement() on line 20. This makes sure you get
the correct element when the element you want contains other elements
(hence the need for a tagName). Before, clicking the checkbox that was
nested inside the list item would result on Event.element() returning
the checkbox and not the list item.<br>
You had a logic error when trying to deselect an element. First you
would clear all selections, and then toggle, but the toggle would
reselect the element you wanted to deselect since clear had already
deselected it.<br>
<br>
The CTRL key works but the SHIFT doesn''t. I didn''t even try to
fix it
so I don''t know why it doesn''t work but I''m sure you
can figure it out
from here. That part of the code I made changes to but didn''t pay
attention to what it was doing but it looks like possibly a simple
logic error or a problem with next/previousElement.<br>
<br>
Have a good day!<br>
<br>
Colin<br>
<br>
Tobias Buschor wrote:
<blockquote
cite="mid718dcfbf0609021614k6fbc3c24pcd7d6ab1707ddb45-JsoAwUIsXosN+BqQ9rBEUg@public.gmane.org"
type="cite">Hello <br>
<br>
i wrote a class "selectable" for select and multipe-select List-Items
based on scriptaculous.<br>
<br>
Look at:<br>
<a
href="http://test.relationpage.ch/qg/js/rp/test/selectable.htm"
target="_blank" onclick="return
top.js.OpenExtLink(window,event,this)">http://test.relationpage.ch/qg/js/rp/test/selectable.htm
</a><br clear="all">
<br>
you can select items by click them and ctrl / shift - click others, and
navigate with up-/down keys.<br>
<br>
the script:<br>
<a href="http://test.relationpage.ch/qg/js/rp/selectable.js"
target="_blank" onclick="return
top.js.OpenExtLink(window,event,this)">http://test.relationpage.ch/qg/js/rp/selectable.js
</a><br>
<br>
on line 38 i have a problem: 2 Variables defined in the
class, one of them is visible in the handler-function the other is not
visible... WHY??<br>
<br>
Feel free for tips and critism.<br>
<br>
Tobias <br>
<br>
</blockquote>
<br>
<br>
</blockquote>
<br>
--~--~---------~--~----~------------~-------~--~----~<br>
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group. <br> To post to this
group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org <br> To
unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
<br> For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs <br>
-~----------~----~----~----~------~----~------~--~---<br>
</body>
</html>
<br>
Hallo Colin
And thanx for your help im a beginner with prototype-like-OOP
I have also played with my Version
Its works not bad but i know, i have to prototypeize it ;)
Yes, ther is a way to prevent from select. Look at Line 18:
this.id.style.KthmlUserSelect = ''none''
this.id.style.MozUserSelect = ''none''
this.id.style.UserSelect = ''none''
this.id.onselectstart = function(){ return false; }
http://test.relationpage.ch/qg/js/rp/test/selectable.htm
http://test.relationpage.ch/qg/js/rp/selectable.js
Tobias
On 9/4/06, Colin Mollenhour
<eliteii92g-NPSFNn/7+NYVo650/ln6uw@public.gmane.org>
wrote:>
> Ok, I couldn''t help it. I played around a bit with the key
controls a
> bit and it is pretty cool. I tried to get it to behave exactly like the
> usual multi-selectable box but it isn''t quite there (shift and
up/down keys
> in combo don''t always behave right). I think you''d have
to store two focus
> elements (begin and end) to get it working right in all cases.
>
> Is there a way to prevent the browser from selecting text when you hold
> the shift key and use up/down arrows? Or a way to deselect text?
>
> Colin
>
>
> Colin Mollenhour wrote:
>
> Hey Tobias,
> Today''s your lucky day. I was bored and just felt like helping
out so
> I rewrote your selectable code. Now not everything works, but I think if
you
> read the code you''ll learn a lot about OOP.
> http://colin.mollenhour.com/selectable.html
> http://colin.mollenhour.com/include/selectable.js
>
> Some notes:
> Isn''t the Protoype class structure so much more clean? What you
had before
> really wasn''t a class structure, it was a single function with
functions
> being assigned to element attributes.
> It now requires a tagName specified (default ''li''). This
could be done
> other ways but requiring the tagName ensures that other elements
don''t
> interfere with your DOM search. If there are other elements (nested lists,
> table cells, etc.) then you can always specify the className to avoid
> selecting the wrong ones.
> Use bind() or bindAsEventListener() to set the value of "this"
inside a
> function. Read up more on these as this should answer your original
> question.
> I chopped a full 40 lines (>20%) by removing redundancies. This makes
> maintenance later much easier as well.
> I also implemented the entire class without a single function or variable
> in the global namespace. This enhances readability and reduces chances of
> conflicts with other libraries or code.
> Not the use of Event.findElement() on line 20. This makes sure you get the
> correct element when the element you want contains other elements (hence
the
> need for a tagName). Before, clicking the checkbox that was nested inside
> the list item would result on Event.element() returning the checkbox and
> not the list item.
> You had a logic error when trying to deselect an element. First you would
> clear all selections, and then toggle, but the toggle would reselect the
> element you wanted to deselect since clear had already deselected it.
>
> The CTRL key works but the SHIFT doesn''t. I didn''t even
try to fix it so I
> don''t know why it doesn''t work but I''m sure you
can figure it out from here.
> That part of the code I made changes to but didn''t pay attention
to what it
> was doing but it looks like possibly a simple logic error or a problem with
> next/previousElement.
>
> Have a good day!
>
> Colin
>
> Tobias Buschor wrote:
>
> Hello
>
> i wrote a class "selectable" for select and multipe-select
List-Items
> based on scriptaculous.
>
> Look at:
> http://test.relationpage.ch/qg/js/rp/test/selectable.htm
>
> you can select items by click them and ctrl / shift - click others, and
> navigate with up-/down keys.
>
> the script:
> http://test.relationpage.ch/qg/js/rp/selectable.js
>
> on line 38 i have a problem: 2 Variables defined in the class, one of them
> is visible in the handler-function the other is not visible... WHY??
>
> Feel free for tips and critism.
>
> Tobias
>
>
>
>
> >
>
--
---------------------------------
Tobias Buschor
+41 071 460 06 85
+41 076 321 23 21
--------------------------------
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs
-~----------~----~----~----~------~----~------~--~---