[Seaside] Use of onMouseOver: and onMouseOut: in Seaside 2.8x

Rick Flower rickf at ca-flower.com
Sat Nov 8 02:57:19 UTC 2008


Lukas et-al,

Is the generated Javascript for the observe function supposed to quote the
first argument?  I wonder if certain key names are OK to be unquoted such
as 'window' or 'document' but others need quoting?... I see generated code
like the following which is not what I see on the various websites showing
how Event.observe is used :

<script type="text/javascript">
1/*<![CDATA[*/Event.observe(foobarbaz,'mouseover',function(event){new
Effect.Highlight(this)})/*]]>*/
</script>

The various websites I've seen (including the one below) show the first
arguments in single quotes.. Not sure if that is what is causing my problem
currently with firebug saying 'foobarbaz' not found

http://joseph.randomnetworks.com/archives/2006/08/01/javascript-events-with-prototype/

Below is the sample generated Seaside table :

<table>
<tbody>
<tr>
 <th id="foobarbaz"></th>
 <th id="foobarbaz"></th>
 <th id="foobarbaz">Description</th>
</tr>
...



On Fri, November 7, 2008 6:35 pm, Rick Flower wrote:
> One more followup.. I'm getting somewhere -- just not sure where..
>
> Anyway, I've now modified the following code (yes, I realize I'm whacking
> up my image, but I can live with that!) :
>
> WATableReport>>renderRowNumber: index item: row on: html
> 	html tableRow
>     	script: (Scriptaculous.SUEvent new
>       		observe: (Scriptaculous.SUStream on: 'document')
>       		on: 'mouseover'
>       		do: (html effect highlight));
> 		style: 'background-color: ' , (self colorForRowNumber: index);
> 		with: [
> 			columns do: [ :each |
> 				self renderColumn: each row: row on: html ] ]
>
> It actually loads but I get identical javascript entries that are
> identical
> for each row, which makes me think that my '#observe' method above is
> wrong and is currently telling it to look at the entire document instead
> of the row in question..  Now, I tried changing 'document' to be 'foobar'
> and ensured that the above tableRow had #id: #foobar but no difference and
> Firebug was complaining about foobar not being defined..
>
> Anyway, I think I'm close.. Does anyone have better examples on the
> use of #observe: on: do:?  There are only a few examples and none doing
> anything other than using the entire document..
>
> HELP?!?
>
>
>
>
>
>
> On Fri, November 7, 2008 4:58 pm, Rick Flower wrote:
>> Ok -- just to reply to myself.. I was missing the need to add SULibrary
>> to the list of libraries that the Dispatch editor indicates.. Once I did
>> that the prototype (and related) libraries were loaded so no more
>> error..
>> Now, I did end up copying the code below to my test from one of the
>> Scriptaculous examples and it runs great and highlights EVERYTHING but I
>> only want it to highlight a single <TR> in a table when the mouse hovers
>> over it.. Any ideas how to tailor it to down-scope what it highlights?
>>
>> MTIA!
>>
>>    html script: (Scriptaculous.SUEvent new
>>       observe: (Scriptaculous.SUStream on: 'document')
>>       on: 'mouseover'
>>       do: (html effect highlight; id: Scriptaculous.SUEvent new
>> element)).
>>
>>
>>
>> On Fri, November 7, 2008 3:43 pm, Rick Flower wrote:
>>> By the way, I modified the existing Seaside Unit Test
>>> (WATableReportTest)
>>> to have a #renderContentOn: method as follows (the rest of the test
>>> code
>>> is the same) :
>>>
>>> WATableReportTest>>renderContentOn: html
>>>
>>>         self session addLoadScript: (html selector
>>>               add: 'tr.effect';
>>>               do: [ :each |
>>>                         each element on: 'mouseover' do:
>>> '$(event.target).up(''tr'').addClassName(''highlight'')'.
>>>                        each element on: 'mouseout' do:
>>> '$(event.target).up(''tr'').removeClassName(''highlight'')']).
>>> 	html render: report.
>>>
>>> Unfortunately, I must be doing something wrong as Firebug complains
>>> about
>>> the use of '$$' below in the generated script...  Any ideas what I've
>>> missed?
>>>
>>> <script type="text/javascript">
>>> 1/*<![CDATA[*/function
>>> onLoad(){$$('tr.effect').each(function(){$(arguments[0]).observe('mouseover',function(event){'$(event.target).up(\'tr\').addClassName(\'highlight\')'});$(arguments[0]).observe('mouseout',function(event){'$(event.target).up(\'tr\').removeClassName(\'highlight\')'})})}/*]]>*/
>>> </script>
>>>
>>>
>>> _______________________________________________
>>> seaside mailing list
>>> seaside at lists.squeakfoundation.org
>>> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>>>
>>>
>>
>>
>> _______________________________________________
>> seaside mailing list
>> seaside at lists.squeakfoundation.org
>> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>>
>>
>
>
> _______________________________________________
> seaside mailing list
> seaside at lists.squeakfoundation.org
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>
>




More information about the seaside mailing list