Andy Daykin wrote:
> The doSlide function was what I was referring to. I tried using TJ's 
> suggestion of using this as the 2nd parameter, but the handler still wasn't 
> getting called. You can find a prototype of what I am doing at 
> http://andydaykin.com/Home. The slideshow (images obviously missing) is on 
> the main page. The javascript file for the class is 
> http://andydaykin.com/Home/public/js/Home.js
Could you please provide the current state once more? Perhaps stripped
down to the vital parts of HTML and scripts? I think we need to have a
look at the details here.

----Daniel



> --------------------------------------------------
> From: "Daniel Rubin" <dru...@dimedis.de>
> Sent: Friday, August 21, 2009 3:38 AM
> To: <prototype-scriptaculous@googlegroups.com>
> Subject: [Proto-Scripty] Re: this keyword inside of the map function
> 
>> Andy Daykin wrote:
>>> I tried the first suggestion, but the function still isn't getting 
>>> called.
>> Exactly which function do you refer to? The map-iterator-func ("function
>> (e) { ... }") or the click-handler (this.doSlide)?
>>
>> ----Daniel
>>
>>
>>
>>> TJ, can you explain more, or show an example of what the context param 
>>> would
>>> look like? Should I just put the doSlide function as the 2nd parameter?
>>>
>>> -Andy
>>>
>>> --------------------------------------------------
>>> From: "T.J. Crowder" <t...@crowdersoftware.com>
>>> Sent: Thursday, August 20, 2009 3:56 AM
>>> To: "Prototype & script.aculo.us" 
>>> <prototype-scriptaculous@googlegroups.com>
>>> Subject: [Proto-Scripty] Re: this keyword inside of the map function
>>>
>>>> Hi,
>>>>
>>>> Rather than binding it, use the second parameter to map (aka collect
>>>> [1]), that's what the second param ("context") is for.  You'll find
>>>> that most of the Enumerable methods that take callbacks also take a
>>>> context parameter so the callback can be a method.
>>>>
>>>> [1] http://prototypejs.org/api/enumerable/collect
>>>>
>>>> HTH,
>>>> --
>>>> T.J. Crowder
>>>> tj / crowder software / com
>>>> Independent Software Engineer, consulting services available
>>>>
>>>>
>>>> On Aug 20, 8:34 am, Daniel Rubin <dru...@dimedis.de> wrote:
>>>>> Andy Daykin wrote:
>>>>>> Hello, I am having some difficulties writing a class, in my code I 
>>>>>> have
>>>>>> a class where I need to be able to bind event listeners to values. In
>>>>>> my code I want the variable pointerIndex to be accessible outside of
>>>>>> the initialize function, but right now it is not. If I make a global
>>>>>> variable for pointerIndex I can solve the problem, but I would rather
>>>>>> have a class variable using the this keyword.
>>>>>> I am not positive, but I believe the problem is from my event 
>>>>>> listeners
>>>>>> on the line:
>>>>>> Now: $(e).observe('click', this.doSlide.bind(featuresWrapper[i].id));
>>>>>> Before: (working) $(e).observe('click',
>>>>>> mySlide.doSlide.curry(featuresWrapper[i].id));
>>>>>> With the new way of calling the doSlide function I can't even seem to
>>>>>> be able to call the function, nothing happens when the function should
>>>>>> get called. Before I was using the curry function to try and pass the
>>>>>> values of the featuresWrapper array to the doSlide function. I was 
>>>>>> able
>>>>>> to get that to work, but I would rather just use bind and this to make
>>>>>> the code more object oriented. Based on my alert statements I can tell
>>>>>> that the this keyword is different inside and outside of the map
>>>>>> function.
>>>>> Hi Andy,
>>>>>
>>>>> the last observation is crucial.  Because this is not your expected
>>>>> SlideShow instance when you do this.doSlide.bind (...), this.doSlide is
>>>>> undefined and thus the call to this.doSlide.bind fails (there should be
>>>>> an exception in the error console somewhere).
>>>>>
>>>>> You can solve it by bind()-ing the map function, too:
>>>>>   $(parentDiv).childElements().map( (function(e) {
>>>>>     $(e).observe('click',
>>>>>                  this.doSlide.bind(this, featuresWrapper[i].id));
>>>>>   }).bind (this) );
>>>>>
>>>>> (Note: Passing this as first arg to the inner bind call, as Kevin
>>>>> suggested, is needed, too.)
>>>>>
>>>>> Have fun
>>>>> ----Daniel
>>>>>
>>>>>
>>>>>
>>>>>> var SlideShow = Class.create({
>>>>>> initialize: function(parentDiv) {
>>>>>> this.pointerIndex = 0;
>>>>>> //pointerIndex = 0;
>>>>>> // Load the event listener for each section
>>>>>> document.observe("dom:loaded", function() {
>>>>>> var featuresWrapper = $('featuresWrapper').childElements();
>>>>>> var i = 0;
>>>>>> alert(this);
>>>>>> $(parentDiv).childElements().map(function(e) {
>>>>>> alert(this);
>>>>>> $(e).observe('click', this.doSlide.bind(featuresWrapper[i].id));
>>>>>> //$(e).observe('click', mySlide.doSlide.curry(featuresWrapper[i].id));
>>>>>> i++;
>>>>>> });
>>>>>> slides = $$('.featureImage').map(function(e) {
>>>>>> return e.id;
>>>>>> });
>>>>>> });
>>>>>> },
>>>>>> doSlide: function(slideClicked) {
>>>>>> alert('here');
>>>>>> if(active == 0) {
>>>>>> active = 1;
>>>>>> var yValCurrent = $(slides[this.pointerIndex]).viewportOffset().top;
>>>>>> //var yValCurrent = $(slides[pointerIndex]).viewportOffset().top;
>>>>>> var yValClick = $(slideClicked).viewportOffset().top;
>>>>>> var yValDiff = yValClick - yValCurrent;
>>>>>> var pointerShift = 0;
>>>>>> if (Math.abs(yValDiff) == Math.abs(210)) {
>>>>>> pointerShift = 70; // Change this to get the height as well as a few
>>>>>> more
>>>>>> }
>>>>>> else {
>>>>>> pointerShift = 140;
>>>>>> }
>>>>>> if (yValDiff > 0) {
>>>>>> $$('.featureImage').map(function(e) {
>>>>>> new Effect.Move(e, { y: -yValDiff, duration: .8, afterFinish:
>>>>>> function(e) { active = 0; } });
>>>>>> });
>>>>>> new Effect.Move('featurePointer', { y: pointerShift });
>>>>>> }
>>>>>> else if (yValDiff < 0) {
>>>>>> $$('.featureImage').map(function(e) {
>>>>>> new Effect.Move(e, { y: -yValDiff, duration: .8, afterFinish:
>>>>>> function(e) { active = 0; } });
>>>>>> });
>>>>>> new Effect.Move('featurePointer', { y: -pointerShift });
>>>>>> }
>>>>>> this.pointerIndex = slides.indexOf(slideClicked);
>>>>>> }
>>>>>> }
>>>>>> });
>>>>>> var slides;
>>>>>> var active = 0;
>>>>>> //var pointerIndex = 0;
>>>>>> var mySlide = new SlideShow('featureList');


--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to 
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to