Loading ...
Sorry, an error occurred while loading the content.

Re: YUI Layout - smooth transition

Expand Messages
  • Caridy Patino
    Hey Alex, Placing debugger; in your code should work. When I mentioned the problems debugging I was talking about the inline JS code, external js code can be
    Message 1 of 25 , Dec 1, 2008
    • 0 Attachment
      Hey Alex,

      Placing "debugger;" in your code should work.

      When I mentioned the problems debugging I was talking about the inline
      JS code, external js code can be debugged easily with firebug, just
      select the corresponding script file, and places the breakpoints, and
      reloads the page, that's really easy, in the case of inline scripts,
      it's a little hard.

      If you have a test case, I can try to find the error in your code,
      send me the link.

      Best Regards,
      Caridy Patino (caridy at yahoo-inc.com)
      Yahoo! LATAM

      --- In ydn-javascript@yahoogroups.com, Satyam <satyam@...> wrote:
      >
      > I'm not sure it it works, but give it a try, put the instruction:
      >
      > debugger;
      >
      > at the top of the file that is dynamically loaded and run your app. It
      > should stop there whenever and however it gets loaded.
      >
      > Satyam
      >
      >
      >
      > Alex Wibowo wrote:
      > > Hi Satyam,
      > >
      > >
      > > What did u mean by that? The fetched code is not available at all in
      > > the 'script' tab in firebug.... so how can i put the breakpoint ??
      > > Did I miss something obvious here??
      > >
      > >
      > >
      > > On Mon, Dec 1, 2008 at 9:51 PM, Satyam <satyam@...
      > > <mailto:satyam@...>> wrote:
      > >
      > > You can place a 'debugger' statement in the loaded code and
      that will
      > > act as a breakpoint.
      > >
      > >
      > >
      > > Alex Wibowo wrote:
      > > > Hi Caridy,
      > > >
      > > >
      > > > As I mentioned... I'm trying to find the most effective way to
      > > debug
      > > > the Javascript that is executed inside the fetched page.
      > > > As you have pointed, this is not possible using Firebug (i.e. in
      > > > firebug, the javascript debugger will go as far as the call to
      > > fetch()
      > > > or addUnit()).
      > > > My alternative strategy, is to make the fetched page as
      > > > 'self-contained' as possible. i.e. so that it is possible to
      > > visit the
      > > > fetched page by itself - so that I can do my javascript
      > > debugging there.
      > > > However, this has a problem.
      > > >
      > > >
      > > > Say the parent page includes yuiloader-min.js , container.js,
      > > etc, and
      > > > the same javascript files are needed in the fetched page.
      > > > I have to include it twice. Hence , the browser will try to
      > > fetch them
      > > > twice. This is bad, isnt it?
      > > > But i dont know how to solve it otherwise...
      > > >
      > > >
      > > >
      > > >
      > > > On Mon, Dec 1, 2008 at 9:05 AM, Caridy Patino <caridy@...
      > > <mailto:caridy%40gmail.com>
      > > > <mailto:caridy@... <mailto:caridy%40gmail.com>>> wrote:
      > > >
      > > > Hey Alex,
      > > >
      > > > Here are the differences these methods:
      > > >
      > > > YAHOO.util.Dispatcher.fetch: uses the YUI Connection Manager
      to load
      > > > the content and places the result with in the specified element
      > > (ID).
      > > >
      > > > YAHOO.util.Dispatcher.addUnit: leaves the AJAX routine to
      the Layout
      > > > Manager, and handles the response, executing the scripts, and
      > > placing
      > > > the result inside the specified unit (unit reference or
      position).
      > > >
      > > > YAHOO.util.Dispatcher.delegate: leaves the AJAX routine to the
      > > > Tabview, and handles the reponse, executing the scripts, and
      placing
      > > > the result inside the specified tab (tab reference).
      > > >
      > > > So, you should use the addUnit all the time with your layouts,
      > > but if
      > > > you want to use the fetch, it's fine, you just need to get
      the Unit
      > > > DOM Element before that, to call the fetch method using the DOM
      > > > Reference.
      > > >
      > > > About the errors, all these method supports error handling,
      > > using the
      > > > property "error" in the configuration object, referencing to a
      > > > function that handles the error. But there is not way to get the
      > > real
      > > > error because we use an anonymous function. But we can get
      the chunk
      > > > that generates the error, that certainly will help us to
      figure it
      > > > out.
      > > >
      > > >
      > > >
      > > > Best Regards,
      > > > Caridy Patino (caridy at yahoo-inc.com <http://yahoo-inc.com>
      > > <http://yahoo-inc.com>)
      > >
      > > > Yahoo! LATAM
      > > >
      > > > --- In ydn-javascript@yahoogroups.com
      > > <mailto:ydn-javascript%40yahoogroups.com>
      > > > <mailto:ydn-javascript%40yahoogroups.com
      > > <mailto:ydn-javascript%2540yahoogroups.com>>, "Alex Wibowo"
      > >
      > > > <alexwibowo@>
      > > > wrote:
      > > >
      > > > >
      > > > > Totally separate question....
      > > > > With all this Dispatcher.addUnit & Dispatcher.fetch..... what
      > > is the
      > > > best
      > > > > way to do debugging? I'm using Firefox + Firebug for my
      > > development,
      > > > and the
      > > > > fetched page (or added unit) wont get displayed in the Firebug
      > > > javascript
      > > > > debugger. Hence I cant put any breakpoints, etc.
      > > > >
      > > > >
      > > > >
      > > > > Thanks again, and sorry for the spam...
      > > > >
      > > >
      > > >
      > > >
      > > >
      > > > --
      > > > Best regards,
      > > >
      > > >
      > > > WiB
      > > >
      > > >
      > > > ----------------------------------------------------------
      > > >
      > > >
      > > > No virus found in this incoming message.
      > > > Checked by AVG - http://www.avg.com
      > > > Version: 8.0.176 / Virus Database: 270.9.12/1821 - Release Date:
      > > 30/11/2008 17:53
      > > >
      > > >
      > >
      > >
      > >
      > >
      > > --
      > > Best regards,
      > >
      > >
      > > WiB
      > >
      > >
      > >
      ------------------------------------------------------------------------
      > >
      > >
      > > No virus found in this incoming message.
      > > Checked by AVG - http://www.avg.com
      > > Version: 8.0.176 / Virus Database: 270.9.12/1821 - Release Date:
      30/11/2008 17:53
      > >
      > >
      >
    • Alex Wibowo
      Hi Caridy... Thats what I thought too! I tried to get unit by the position, and replace the body attribute. But it doesnt render the fetched content. Maybe I
      Message 2 of 25 , Dec 1, 2008
      • 0 Attachment
        Hi Caridy...

        Thats what I thought too! I tried to get unit by the position, and replace the body attribute. But it doesnt render the fetched content.

        Maybe I was doing something wrong???



        On Tue, Dec 2, 2008 at 4:45 AM, Caridy Patino <caridy@...> wrote:

        Hey Alex,

        What do you mean with "why you cant replace the content of center unit
        in the YUI layout"???? You can do that... If you have a reference to
        the unit, or a reference to the layout object, you can do that...

        unit = layout.getUnitByPosition ('center');
        unit.body -> DOM reference

        Best Regards,
        Caridy Patino (caridy at yahoo-inc.com)
        Yahoo! LATAM

        --- In ydn-javascript@yahoogroups.com, "Alex Wibowo" <alexwibowo@...>
        wrote:


        >
        > Hi Satyam..
        >
        > Another question for you (as you are the YUI developer team).... is
        there
        > any reason why you cant replace the content of center unit in the YUI
        > layout?
        >
        >
        >
        > On Tue, Dec 2, 2008 at 12:17 AM, Alex Wibowo <alexwibowo@...> wrote:
        >
        > > Hi Satyam,
        > >
        > >
        > > What did u mean by that? The fetched code is not available at all
        in the
        > > 'script' tab in firebug.... so how can i put the breakpoint ??
        > > Did I miss something obvious here??
        > >
        > >
        > >
        > >
        > > On Mon, Dec 1, 2008 at 9:51 PM, Satyam <satyam@...> wrote:
        > >
        > >> You can place a 'debugger' statement in the loaded code and
        that will
        > >> act as a breakpoint.
        > >>
        > >>
        > >> Alex Wibowo wrote:
        > >> > Hi Caridy,
        > >> >
        > >> >
        > >> > As I mentioned... I'm trying to find the most effective way to
        debug
        > >> > the Javascript that is executed inside the fetched page.
        > >> > As you have pointed, this is not possible using Firebug (i.e. in
        > >> > firebug, the javascript debugger will go as far as the call to
        fetch()
        > >> > or addUnit()).
        > >> > My alternative strategy, is to make the fetched page as
        > >> > 'self-contained' as possible. i.e. so that it is possible to
        visit the
        > >> > fetched page by itself - so that I can do my javascript
        debugging there.
        > >> > However, this has a problem.
        > >> >
        > >> >
        > >> > Say the parent page includes yuiloader-min.js , container.js,
        etc, and
        > >> > the same javascript files are needed in the fetched page.
        > >> > I have to include it twice. Hence , the browser will try to
        fetch them
        > >> > twice. This is bad, isnt it?
        > >> > But i dont know how to solve it otherwise...
        > >> >
        > >> >
        > >> >
        > >> >
        > >> > On Mon, Dec 1, 2008 at 9:05 AM, Caridy Patino
        <caridy@...<caridy%40gmail.com>

        > >> > <mailto:caridy@... <caridy%40gmail.com>>> wrote:
        > >> >
        > >> > Hey Alex,
        > >> >
        > >> > Here are the differences these methods:
        > >> >
        > >> > YAHOO.util.Dispatcher.fetch: uses the YUI Connection Manager to
        load
        > >> > the content and places the result with in the specified element
        (ID).
        > >> >
        > >> > YAHOO.util.Dispatcher.addUnit: leaves the AJAX routine to the
        Layout
        > >> > Manager, and handles the response, executing the scripts, and
        placing
        > >> > the result inside the specified unit (unit reference or position).
        > >> >
        > >> > YAHOO.util.Dispatcher.delegate: leaves the AJAX routine to the
        > >> > Tabview, and handles the reponse, executing the scripts, and
        placing
        > >> > the result inside the specified tab (tab reference).
        > >> >
        > >> > So, you should use the addUnit all the time with your layouts,
        but if
        > >> > you want to use the fetch, it's fine, you just need to get the Unit
        > >> > DOM Element before that, to call the fetch method using the DOM
        > >> > Reference.
        > >> >
        > >> > About the errors, all these method supports error handling,
        using the
        > >> > property "error" in the configuration object, referencing to a
        > >> > function that handles the error. But there is not way to get
        the real
        > >> > error because we use an anonymous function. But we can get the
        chunk
        > >> > that generates the error, that certainly will help us to figure it
        > >> > out.
        > >> >
        > >> >
        > >> >
        > >> > Best Regards,
        > >> > Caridy Patino (caridy at yahoo-inc.com <http://yahoo-inc.com>)
        > >> > Yahoo! LATAM
        > >> >
        > >> > --- In
        ydn-javascript@yahoogroups.com<ydn-javascript%40yahoogroups.com>
        > >> >
        <mailto:ydn-javascript%40yahoogroups.com<ydn-javascript%2540yahoogroups.com>>,

        > >> "Alex Wibowo"
        > >> > <alexwibowo@>
        > >> > wrote:
        > >> >
        > >> > >
        > >> > > Totally separate question....
        > >> > > With all this Dispatcher.addUnit & Dispatcher.fetch..... what
        is the
        > >> > best
        > >> > > way to do debugging? I'm using Firefox + Firebug for my
        development,
        > >> > and the
        > >> > > fetched page (or added unit) wont get displayed in the Firebug
        > >> > javascript
        > >> > > debugger. Hence I cant put any breakpoints, etc.
        > >> > >
        > >> > >
        > >> > >
        > >> > > Thanks again, and sorry for the spam...
        > >> > >
        > >> >
        > >> >
        > >> >
        > >> >
        > >> > --
        > >> > Best regards,
        > >> >
        > >> >
        > >> > WiB
        > >> >
        > >> >
        > >> > ----------------------------------------------------------
        > >> >
        > >> >
        > >> > No virus found in this incoming message.
        > >> > Checked by AVG - http://www.avg.com
        > >> > Version: 8.0.176 / Virus Database: 270.9.12/1821 - Release Date:
        > >> 30/11/2008 17:53
        > >> >
        > >> >
        > >>
        > >>
        > >
        > >
        > >
        > > --

        > > Best regards,
        > >
        > >
        > > WiB
        > >
        > >
        >
        >
        > --
        > Best regards,
        >
        >
        > WiB
        >




        --
        Best regards,


        WiB

      • Alex Wibowo
        ANyway... thx for that guys... I ll try the debugger; statement (i dont know of this before!! so thanks for it!)... and i ll try to figure out whats wrong with
        Message 3 of 25 , Dec 1, 2008
        • 0 Attachment
          ANyway... thx for that guys... I'll try the debugger; statement (i dont know of this before!! so thanks for it!)...

          and i'll try to figure out whats wrong with my code that makes the         unit.body = XX doesnt work...

          I tried by simply doing:


          unit.body = 'blallballa'    (which should replace the content of the center unit by text 'blalblalba, shouldnt it?)
          or maybe i _have_ to use DOM reference (i..e not simple text)? i.e. should it work if I do:

          unit = layout.getUnitByPosition ('center');
          unit.body = YAHOO.plugin.Dispatcher.fetch('some url');

          I remember I've tried this before, and it didnt work. The content didnt get replaced by the fetched URL content....
          But again.... maybe I did something wrong...





          On Tue, Dec 2, 2008 at 7:37 AM, Alex Wibowo <alexwibowo@...> wrote:
          Hi Caridy...

          Thats what I thought too! I tried to get unit by the position, and replace the body attribute. But it doesnt render the fetched content.

          Maybe I was doing something wrong???




          On Tue, Dec 2, 2008 at 4:45 AM, Caridy Patino <caridy@...> wrote:

          Hey Alex,

          What do you mean with "why you cant replace the content of center unit
          in the YUI layout"???? You can do that... If you have a reference to
          the unit, or a reference to the layout object, you can do that...

          unit = layout.getUnitByPosition ('center');
          unit.body -> DOM reference

          Best Regards,
          Caridy Patino (caridy at yahoo-inc.com)
          Yahoo! LATAM

          --- In ydn-javascript@yahoogroups.com, "Alex Wibowo" <alexwibowo@...>
          wrote:


          >
          > Hi Satyam..
          >
          > Another question for you (as you are the YUI developer team).... is
          there
          > any reason why you cant replace the content of center unit in the YUI
          > layout?
          >
          >
          >
          > On Tue, Dec 2, 2008 at 12:17 AM, Alex Wibowo <alexwibowo@...> wrote:
          >
          > > Hi Satyam,
          > >
          > >
          > > What did u mean by that? The fetched code is not available at all
          in the
          > > 'script' tab in firebug.... so how can i put the breakpoint ??
          > > Did I miss something obvious here??
          > >
          > >
          > >
          > >
          > > On Mon, Dec 1, 2008 at 9:51 PM, Satyam <satyam@...> wrote:
          > >
          > >> You can place a 'debugger' statement in the loaded code and
          that will
          > >> act as a breakpoint.
          > >>
          > >>
          > >> Alex Wibowo wrote:
          > >> > Hi Caridy,
          > >> >
          > >> >
          > >> > As I mentioned... I'm trying to find the most effective way to
          debug
          > >> > the Javascript that is executed inside the fetched page.
          > >> > As you have pointed, this is not possible using Firebug (i.e. in
          > >> > firebug, the javascript debugger will go as far as the call to
          fetch()
          > >> > or addUnit()).
          > >> > My alternative strategy, is to make the fetched page as
          > >> > 'self-contained' as possible. i.e. so that it is possible to
          visit the
          > >> > fetched page by itself - so that I can do my javascript
          debugging there.
          > >> > However, this has a problem.
          > >> >
          > >> >
          > >> > Say the parent page includes yuiloader-min.js , container.js,
          etc, and
          > >> > the same javascript files are needed in the fetched page.
          > >> > I have to include it twice. Hence , the browser will try to
          fetch them
          > >> > twice. This is bad, isnt it?
          > >> > But i dont know how to solve it otherwise...
          > >> >
          > >> >
          > >> >
          > >> >
          > >> > On Mon, Dec 1, 2008 at 9:05 AM, Caridy Patino
          <caridy@...<caridy%40gmail.com>

          > >> > <mailto:caridy@... <caridy%40gmail.com>>> wrote:
          > >> >
          > >> > Hey Alex,
          > >> >
          > >> > Here are the differences these methods:
          > >> >
          > >> > YAHOO.util.Dispatcher.fetch: uses the YUI Connection Manager to
          load
          > >> > the content and places the result with in the specified element
          (ID).
          > >> >
          > >> > YAHOO.util.Dispatcher.addUnit: leaves the AJAX routine to the
          Layout
          > >> > Manager, and handles the response, executing the scripts, and
          placing
          > >> > the result inside the specified unit (unit reference or position).
          > >> >
          > >> > YAHOO.util.Dispatcher.delegate: leaves the AJAX routine to the
          > >> > Tabview, and handles the reponse, executing the scripts, and
          placing
          > >> > the result inside the specified tab (tab reference).
          > >> >
          > >> > So, you should use the addUnit all the time with your layouts,
          but if
          > >> > you want to use the fetch, it's fine, you just need to get the Unit
          > >> > DOM Element before that, to call the fetch method using the DOM
          > >> > Reference.
          > >> >
          > >> > About the errors, all these method supports error handling,
          using the
          > >> > property "error" in the configuration object, referencing to a
          > >> > function that handles the error. But there is not way to get
          the real
          > >> > error because we use an anonymous function. But we can get the
          chunk
          > >> > that generates the error, that certainly will help us to figure it
          > >> > out.
          > >> >
          > >> >
          > >> >
          > >> > Best Regards,
          > >> > Caridy Patino (caridy at yahoo-inc.com <http://yahoo-inc.com>)
          > >> > Yahoo! LATAM
          > >> >
          > >> > --- In
          ydn-javascript@yahoogroups.com<ydn-javascript%40yahoogroups.com>
          > >> >
          <mailto:ydn-javascript%40yahoogroups.com<ydn-javascript%2540yahoogroups.com>>,

          > >> "Alex Wibowo"
          > >> > <alexwibowo@>
          > >> > wrote:
          > >> >
          > >> > >
          > >> > > Totally separate question....
          > >> > > With all this Dispatcher.addUnit & Dispatcher.fetch..... what
          is the
          > >> > best
          > >> > > way to do debugging? I'm using Firefox + Firebug for my
          development,
          > >> > and the
          > >> > > fetched page (or added unit) wont get displayed in the Firebug
          > >> > javascript
          > >> > > debugger. Hence I cant put any breakpoints, etc.
          > >> > >
          > >> > >
          > >> > >
          > >> > > Thanks again, and sorry for the spam...
          > >> > >
          > >> >
          > >> >
          > >> >
          > >> >
          > >> > --
          > >> > Best regards,
          > >> >
          > >> >
          > >> > WiB
          > >> >
          > >> >
          > >> > ----------------------------------------------------------
          > >> >
          > >> >
          > >> > No virus found in this incoming message.
          > >> > Checked by AVG - http://www.avg.com
          > >> > Version: 8.0.176 / Virus Database: 270.9.12/1821 - Release Date:
          > >> 30/11/2008 17:53
          > >> >
          > >> >
          > >>
          > >>
          > >
          > >
          > >
          > > --

          > > Best regards,
          > >
          > >
          > > WiB
          > >
          > >
          >
          >
          > --
          > Best regards,
          >
          >
          > WiB
          >




          --
          Best regards,


          WiB




          --
          Best regards,


          WiB

        • Caridy Patino
          Hey Alex, as I mentioned in my previous post, unit.body is a DOM reference, you can not do this: unit.body = XX; but you can do this: unit.body.innerHTML = xx;
          Message 4 of 25 , Dec 1, 2008
          • 0 Attachment
            Hey Alex, as I mentioned in my previous post, unit.body is a DOM
            reference, you can not do this:

            unit.body = XX;

            but you can do this:

            unit.body.innerHTML = xx;

            If you want to use the fetch method, you can do this:
            YAHOO.plugin.Dispatcher.fetch(unit.body, '/some-url.html');

            If you want to use the Bubbling 2.0 beta, you can do this:
            YAHOO.plugin.Dispatcher.addUnit(unit, layout, {uri: '/some-url.html'});

            :-)

            Best Regards,
            Caridy Patino (caridy at yahoo-inc.com)
            Yahoo! LATAM

            --- In ydn-javascript@yahoogroups.com, "Alex Wibowo" <alexwibowo@...>
            wrote:
            >
            > ANyway... thx for that guys... I'll try the debugger; statement (i
            dont know
            > of this before!! so thanks for it!)...
            >
            > and i'll try to figure out whats wrong with my code that makes the
            > unit.body = XX doesnt work...
            >
            > I tried by simply doing:
            >
            >
            > unit.body = 'blallballa' (which should replace the content of the
            center
            > unit by text 'blalblalba, shouldnt it?)
            > or maybe i _have_ to use DOM reference (i..e not simple text)? i.e.
            should
            > it work if I do:
            >
            > unit = layout.getUnitByPosition ('center');
            > unit.body = YAHOO.plugin.Dispatcher.fetch('some url');
            >
            > I remember I've tried this before, and it didnt work. The content
            didnt get
            > replaced by the fetched URL content....
            > But again.... maybe I did something wrong...
            >
            >
            >
            >
            >
            > On Tue, Dec 2, 2008 at 7:37 AM, Alex Wibowo <alexwibowo@...> wrote:
            >
            > > Hi Caridy...
            > >
            > > Thats what I thought too! I tried to get unit by the position, and
            replace
            > > the body attribute. But it doesnt render the fetched content.
            > >
            > > Maybe I was doing something wrong???
            > >
            > >
            > >
            > >
            > > On Tue, Dec 2, 2008 at 4:45 AM, Caridy Patino <caridy@...> wrote:
            > >
            > >> Hey Alex,
            > >>
            > >> What do you mean with "why you cant replace the content of center
            unit
            > >> in the YUI layout"???? You can do that... If you have a reference to
            > >> the unit, or a reference to the layout object, you can do that...
            > >>
            > >> unit = layout.getUnitByPosition ('center');
            > >> unit.body -> DOM reference
            > >>
            > >> Best Regards,
            > >> Caridy Patino (caridy at yahoo-inc.com)
            > >> Yahoo! LATAM
            > >>
            > >> --- In ydn-javascript@yahoogroups.com
            <ydn-javascript%40yahoogroups.com>,
            > >> "Alex Wibowo" <alexwibowo@>
            > >> wrote:
            > >>
            > >> >
            > >> > Hi Satyam..
            > >> >
            > >> > Another question for you (as you are the YUI developer team).... is
            > >> there
            > >> > any reason why you cant replace the content of center unit in
            the YUI
            > >> > layout?
            > >> >
            > >> >
            > >> >
            > >> > On Tue, Dec 2, 2008 at 12:17 AM, Alex Wibowo <alexwibowo@> wrote:
            > >> >
            > >> > > Hi Satyam,
            > >> > >
            > >> > >
            > >> > > What did u mean by that? The fetched code is not available at all
            > >> in the
            > >> > > 'script' tab in firebug.... so how can i put the breakpoint ??
            > >> > > Did I miss something obvious here??
            > >> > >
            > >> > >
            > >> > >
            > >> > >
            > >> > > On Mon, Dec 1, 2008 at 9:51 PM, Satyam <satyam@> wrote:
            > >> > >
            > >> > >> You can place a 'debugger' statement in the loaded code and
            > >> that will
            > >> > >> act as a breakpoint.
            > >> > >>
            > >> > >>
            > >> > >> Alex Wibowo wrote:
            > >> > >> > Hi Caridy,
            > >> > >> >
            > >> > >> >
            > >> > >> > As I mentioned... I'm trying to find the most effective way to
            > >> debug
            > >> > >> > the Javascript that is executed inside the fetched page.
            > >> > >> > As you have pointed, this is not possible using Firebug
            (i.e. in
            > >> > >> > firebug, the javascript debugger will go as far as the call to
            > >> fetch()
            > >> > >> > or addUnit()).
            > >> > >> > My alternative strategy, is to make the fetched page as
            > >> > >> > 'self-contained' as possible. i.e. so that it is possible to
            > >> visit the
            > >> > >> > fetched page by itself - so that I can do my javascript
            > >> debugging there.
            > >> > >> > However, this has a problem.
            > >> > >> >
            > >> > >> >
            > >> > >> > Say the parent page includes yuiloader-min.js , container.js,
            > >> etc, and
            > >> > >> > the same javascript files are needed in the fetched page.
            > >> > >> > I have to include it twice. Hence , the browser will try to
            > >> fetch them
            > >> > >> > twice. This is bad, isnt it?
            > >> > >> > But i dont know how to solve it otherwise...
            > >> > >> >
            > >> > >> >
            > >> > >> >
            > >> > >> >
            > >> > >> > On Mon, Dec 1, 2008 at 9:05 AM, Caridy Patino
            > >> <caridy@<caridy%40gmail.com>
            > >>
            > >> > >> > <mailto:caridy@ <caridy%40gmail.com>>> wrote:
            > >> > >> >
            > >> > >> > Hey Alex,
            > >> > >> >
            > >> > >> > Here are the differences these methods:
            > >> > >> >
            > >> > >> > YAHOO.util.Dispatcher.fetch: uses the YUI Connection
            Manager to
            > >> load
            > >> > >> > the content and places the result with in the specified
            element
            > >> (ID).
            > >> > >> >
            > >> > >> > YAHOO.util.Dispatcher.addUnit: leaves the AJAX routine to the
            > >> Layout
            > >> > >> > Manager, and handles the response, executing the scripts, and
            > >> placing
            > >> > >> > the result inside the specified unit (unit reference or
            position).
            > >> > >> >
            > >> > >> > YAHOO.util.Dispatcher.delegate: leaves the AJAX routine to the
            > >> > >> > Tabview, and handles the reponse, executing the scripts, and
            > >> placing
            > >> > >> > the result inside the specified tab (tab reference).
            > >> > >> >
            > >> > >> > So, you should use the addUnit all the time with your layouts,
            > >> but if
            > >> > >> > you want to use the fetch, it's fine, you just need to get
            the Unit
            > >> > >> > DOM Element before that, to call the fetch method using
            the DOM
            > >> > >> > Reference.
            > >> > >> >
            > >> > >> > About the errors, all these method supports error handling,
            > >> using the
            > >> > >> > property "error" in the configuration object, referencing to a
            > >> > >> > function that handles the error. But there is not way to get
            > >> the real
            > >> > >> > error because we use an anonymous function. But we can get the
            > >> chunk
            > >> > >> > that generates the error, that certainly will help us to
            figure it
            > >> > >> > out.
            > >> > >> >
            > >> > >> >
            > >> > >> >
            > >> > >> > Best Regards,
            > >> > >> > Caridy Patino (caridy at yahoo-inc.com <http://yahoo-inc.com>)
            > >> > >> > Yahoo! LATAM
            > >> > >> >
            > >> > >> > --- In
            > >> ydn-javascript@yahoogroups.com <ydn-javascript%40yahoogroups.com>
            > >> <ydn-javascript%40yahoogroups.com>
            > >> > >> >
            > >>
            <mailto:ydn-javascript%40yahoogroups.com<ydn-javascript%2540yahoogroups.com>
            > >> <ydn-javascript%2540yahoogroups.com>>,
            > >> > >> "Alex Wibowo"
            > >> > >> > <alexwibowo@>
            > >> > >> > wrote:
            > >> > >> >
            > >> > >> > >
            > >> > >> > > Totally separate question....
            > >> > >> > > With all this Dispatcher.addUnit & Dispatcher.fetch.....
            what
            > >> is the
            > >> > >> > best
            > >> > >> > > way to do debugging? I'm using Firefox + Firebug for my
            > >> development,
            > >> > >> > and the
            > >> > >> > > fetched page (or added unit) wont get displayed in the
            Firebug
            > >> > >> > javascript
            > >> > >> > > debugger. Hence I cant put any breakpoints, etc.
            > >> > >> > >
            > >> > >> > >
            > >> > >> > >
            > >> > >> > > Thanks again, and sorry for the spam...
            > >> > >> > >
            > >> > >> >
            > >> > >> >
            > >> > >> >
            > >> > >> >
            > >> > >> > --
            > >> > >> > Best regards,
            > >> > >> >
            > >> > >> >
            > >> > >> > WiB
            > >> > >> >
            > >> > >> >
            > >> > >> > ----------------------------------------------------------
            > >> > >> >
            > >> > >> >
            > >> > >> > No virus found in this incoming message.
            > >> > >> > Checked by AVG - http://www.avg.com
            > >> > >> > Version: 8.0.176 / Virus Database: 270.9.12/1821 - Release
            Date:
            > >> > >> 30/11/2008 17:53
            > >> > >> >
            > >> > >> >
            > >> > >>
            > >> > >>
            > >> > >
            > >> > >
            > >> > >
            > >> > > --
            > >> > > Best regards,
            > >> > >
            > >> > >
            > >> > > WiB
            > >> > >
            > >> > >
            > >> >
            > >> >
            > >> > --
            > >> > Best regards,
            > >> >
            > >> >
            > >> > WiB
            > >> >
            > >>
            > >>
            > >>
            > >
            > >
            > >
            > > --
            > > Best regards,
            > >
            > >
            > > WiB
            > >
            > >
            >
            >
            > --
            > Best regards,
            >
            >
            > WiB
            >
          • Alex Wibowo
            Hi Caridy, Thanks heaps. That explains the whole thing! :) Sorry for this fundamental Javascript question... but I m hoping that you will be able to assist me
            Message 5 of 25 , Dec 1, 2008
            • 0 Attachment
              Hi Caridy,


              Thanks heaps. That explains the whole thing! :)




              Sorry for this fundamental Javascript question... but I'm hoping that you will be able to assist me (or to point to where I can learn more about it):

              What is the difference between:

              -------------------------------------------------------------------
              YAHOO.au.com.company.SomeWidget = new function(){
                   this.rootLayout=null;
                   this.renderLayout=function(){
                           YAHOO.au.com.company.SomeWidget.rootLayout= new YAHOO.widget.Layout({  });
                           .....
                   }
              }
              -------------------------------------------------------------------

              and
              -------------------------------------------------------------------
              YAHOO.au.com.company.SomeWidget = {
                      renderLayout: function(){

                      }
              }
              -------------------------------------------------------------------

              I tried to find some reference... but cant find any clear explanation. My understanding at the moment is that the second one is creating an array of function.... while the first one is creating a class (not really a class.. but a variable that holds both variable & function?).. While we are looking at the first one... why cant I call:

              this.rootLayout= new YAHOO.widget.Layout({  });

              and instead I have to use:

              YAHOO.au.com.company.SomeWidget.rootLayout= new YAHOO.widget.Layout({  });

              (I'm a Java programmer, and the notation above confuses me a bit)


              I'm really sorry for this fundamental question... but I cant really find useful reference on the web.





              On Tue, Dec 2, 2008 at 8:08 AM, Caridy Patino <caridy@...> wrote:

              Hey Alex, as I mentioned in my previous post, unit.body is a DOM
              reference, you can not do this:

              unit.body = XX;

              but you can do this:

              unit.body.innerHTML = xx;

              If you want to use the fetch method, you can do this:
              YAHOO.plugin.Dispatcher.fetch(unit.body, '/some-url.html');

              If you want to use the Bubbling 2.0 beta, you can do this:
              YAHOO.plugin.Dispatcher.addUnit(unit, layout, {uri: '/some-url.html'});

              :-)



              Best Regards,
              Caridy Patino (caridy at yahoo-inc.com)
              Yahoo! LATAM

              --- In ydn-javascript@yahoogroups.com, "Alex Wibowo" <alexwibowo@...>
              wrote:
              >
              > ANyway... thx for that guys... I'll try the debugger; statement (i
              dont know
              > of this before!! so thanks for it!)...
              >
              > and i'll try to figure out whats wrong with my code that makes the
              > unit.body = XX doesnt work...
              >
              > I tried by simply doing:
              >
              >
              > unit.body = 'blallballa' (which should replace the content of the
              center
              > unit by text 'blalblalba, shouldnt it?)
              > or maybe i _have_ to use DOM reference (i..e not simple text)? i.e.
              should
              > it work if I do:
              >
              > unit = layout.getUnitByPosition ('center');
              > unit.body = YAHOO.plugin.Dispatcher.fetch('some url');
              >
              > I remember I've tried this before, and it didnt work. The content
              didnt get
              > replaced by the fetched URL content....
              > But again.... maybe I did something wrong...
              >
              >
              >
              >
              >
              > On Tue, Dec 2, 2008 at 7:37 AM, Alex Wibowo <alexwibowo@...> wrote:
              >
              > > Hi Caridy...
              > >
              > > Thats what I thought too! I tried to get unit by the position, and
              replace
              > > the body attribute. But it doesnt render the fetched content.
              > >
              > > Maybe I was doing something wrong???
              > >
              > >
              > >
              > >
              > > On Tue, Dec 2, 2008 at 4:45 AM, Caridy Patino <caridy@...> wrote:
              > >
              > >> Hey Alex,
              > >>
              > >> What do you mean with "why you cant replace the content of center
              unit
              > >> in the YUI layout"???? You can do that... If you have a reference to
              > >> the unit, or a reference to the layout object, you can do that...
              > >>
              > >> unit = layout.getUnitByPosition ('center');
              > >> unit.body -> DOM reference
              > >>
              > >> Best Regards,
              > >> Caridy Patino (caridy at yahoo-inc.com)
              > >> Yahoo! LATAM
              > >>
              > >> --- In ydn-javascript@yahoogroups.com
              <ydn-javascript%40yahoogroups.com>,

              > >> "Alex Wibowo" <alexwibowo@>
              > >> wrote:
              > >>
              > >> >
              > >> > Hi Satyam..
              > >> >
              > >> > Another question for you (as you are the YUI developer team).... is
              > >> there
              > >> > any reason why you cant replace the content of center unit in
              the YUI
              > >> > layout?
              > >> >
              > >> >
              > >> >
              > >> > On Tue, Dec 2, 2008 at 12:17 AM, Alex Wibowo <alexwibowo@> wrote:
              > >> >
              > >> > > Hi Satyam,
              > >> > >
              > >> > >
              > >> > > What did u mean by that? The fetched code is not available at all
              > >> in the
              > >> > > 'script' tab in firebug.... so how can i put the breakpoint ??
              > >> > > Did I miss something obvious here??
              > >> > >
              > >> > >
              > >> > >
              > >> > >
              > >> > > On Mon, Dec 1, 2008 at 9:51 PM, Satyam <satyam@> wrote:
              > >> > >
              > >> > >> You can place a 'debugger' statement in the loaded code and
              > >> that will
              > >> > >> act as a breakpoint.
              > >> > >>
              > >> > >>
              > >> > >> Alex Wibowo wrote:
              > >> > >> > Hi Caridy,
              > >> > >> >
              > >> > >> >
              > >> > >> > As I mentioned... I'm trying to find the most effective way to
              > >> debug
              > >> > >> > the Javascript that is executed inside the fetched page.
              > >> > >> > As you have pointed, this is not possible using Firebug
              (i.e. in
              > >> > >> > firebug, the javascript debugger will go as far as the call to
              > >> fetch()
              > >> > >> > or addUnit()).
              > >> > >> > My alternative strategy, is to make the fetched page as
              > >> > >> > 'self-contained' as possible. i.e. so that it is possible to
              > >> visit the
              > >> > >> > fetched page by itself - so that I can do my javascript
              > >> debugging there.
              > >> > >> > However, this has a problem.
              > >> > >> >
              > >> > >> >
              > >> > >> > Say the parent page includes yuiloader-min.js , container.js,
              > >> etc, and
              > >> > >> > the same javascript files are needed in the fetched page.
              > >> > >> > I have to include it twice. Hence , the browser will try to
              > >> fetch them
              > >> > >> > twice. This is bad, isnt it?
              > >> > >> > But i dont know how to solve it otherwise...
              > >> > >> >
              > >> > >> >
              > >> > >> >
              > >> > >> >
              > >> > >> > On Mon, Dec 1, 2008 at 9:05 AM, Caridy Patino
              > >> <caridy@<caridy%40gmail.com>
              > >>
              > >> > >> > <mailto:caridy@ <caridy%40gmail.com>>> wrote:
              > >> > >> >
              > >> > >> > Hey Alex,
              > >> > >> >
              > >> > >> > Here are the differences these methods:
              > >> > >> >
              > >> > >> > YAHOO.util.Dispatcher.fetch: uses the YUI Connection
              Manager to
              > >> load
              > >> > >> > the content and places the result with in the specified
              element
              > >> (ID).
              > >> > >> >
              > >> > >> > YAHOO.util.Dispatcher.addUnit: leaves the AJAX routine to the
              > >> Layout
              > >> > >> > Manager, and handles the response, executing the scripts, and
              > >> placing
              > >> > >> > the result inside the specified unit (unit reference or
              position).
              > >> > >> >
              > >> > >> > YAHOO.util.Dispatcher.delegate: leaves the AJAX routine to the
              > >> > >> > Tabview, and handles the reponse, executing the scripts, and
              > >> placing
              > >> > >> > the result inside the specified tab (tab reference).
              > >> > >> >
              > >> > >> > So, you should use the addUnit all the time with your layouts,
              > >> but if
              > >> > >> > you want to use the fetch, it's fine, you just need to get
              the Unit
              > >> > >> > DOM Element before that, to call the fetch method using
              the DOM
              > >> > >> > Reference.
              > >> > >> >
              > >> > >> > About the errors, all these method supports error handling,
              > >> using the
              > >> > >> > property "error" in the configuration object, referencing to a
              > >> > >> > function that handles the error. But there is not way to get
              > >> the real
              > >> > >> > error because we use an anonymous function. But we can get the
              > >> chunk
              > >> > >> > that generates the error, that certainly will help us to
              figure it
              > >> > >> > out.
              > >> > >> >
              > >> > >> >
              > >> > >> >
              > >> > >> > Best Regards,
              > >> > >> > Caridy Patino (caridy at yahoo-inc.com <http://yahoo-inc.com>)
              > >> > >> > Yahoo! LATAM
              > >> > >> >
              > >> > >> > --- In
              > >> ydn-javascript@yahoogroups.com <ydn-javascript%40yahoogroups.com>
              > >> <ydn-javascript%40yahoogroups.com>
              > >> > >> >
              > >>
              <mailto:ydn-javascript%40yahoogroups.com<ydn-javascript%2540yahoogroups.com>
              > >> <ydn-javascript%2540yahoogroups.com>>,
              > >> > >> "Alex Wibowo"
              > >> > >> > <alexwibowo@>
              > >> > >> > wrote:
              > >> > >> >
              > >> > >> > >
              > >> > >> > > Totally separate question....
              > >> > >> > > With all this Dispatcher.addUnit & Dispatcher.fetch.....
              what
              > >> is the
              > >> > >> > best
              > >> > >> > > way to do debugging? I'm using Firefox + Firebug for my
              > >> development,
              > >> > >> > and the
              > >> > >> > > fetched page (or added unit) wont get displayed in the
              Firebug
              > >> > >> > javascript
              > >> > >> > > debugger. Hence I cant put any breakpoints, etc.
              > >> > >> > >
              > >> > >> > >
              > >> > >> > >
              > >> > >> > > Thanks again, and sorry for the spam...
              > >> > >> > >
              > >> > >> >
              > >> > >> >
              > >> > >> >
              > >> > >> >
              > >> > >> > --
              > >> > >> > Best regards,
              > >> > >> >
              > >> > >> >
              > >> > >> > WiB
              > >> > >> >
              > >> > >> >
              > >> > >> > ----------------------------------------------------------
              > >> > >> >
              > >> > >> >
              > >> > >> > No virus found in this incoming message.
              > >> > >> > Checked by AVG - http://www.avg.com
              > >> > >> > Version: 8.0.176 / Virus Database: 270.9.12/1821 - Release
              Date:
              > >> > >> 30/11/2008 17:53
              > >> > >> >
              > >> > >> >
              > >> > >>
              > >> > >>
              > >> > >
              > >> > >
              > >> > >
              > >> > > --
              > >> > > Best regards,
              > >> > >
              > >> > >
              > >> > > WiB
              > >> > >
              > >> > >
              > >> >
              > >> >
              > >> > --
              > >> > Best regards,
              > >> >
              > >> >
              > >> > WiB
              > >> >
              > >>
              > >>
              > >>
              > >
              > >
              > >
              > > --
              > > Best regards,
              > >
              > >
              > > WiB
              > >
              > >
              >
              >
              > --
              > Best regards,
              >
              >
              > WiB
              >




              --
              Best regards,


              WiB

            • Caridy Patino
              Hello Alex, Sorry for the delay. I will try to explain you why... but you have two different questions here. I will try to explain YOUR particular problem with
              Message 6 of 25 , Dec 3, 2008
              • 0 Attachment
                Hello Alex,

                Sorry for the delay. I will try to explain you why... but you have two
                different questions here. I will try to explain YOUR particular
                problem with the namespace, and then I will try to explain the
                class/object approach.

                Let's start for the namespace, here is the code:

                > this.rootLayout= new YAHOO.widget.Layout({ });

                > YAHOO.au.com.company.SomeWidget.rootLayout= new
                YAHOO.widget.Layout({ });

                As you can see, the right part of the sentences are exactly the same,
                which is the instantiation process. The left part is the variable that
                will hold the new object reference. Depending of the execution scope
                you can do this:
                this.rootLayout = ABC;
                or this:
                YAHOO.au.com.company.SomeWidget.rootLayout = ABC;

                The execution scope is the one that introduces the confusion here.
                Normally the functions/methods defined for the object
                YAHOO.au.com.company.SomeWidget uses the object itself as the
                execution scope, but not always, depending of the call.

                Let me show you an example:

                YAHOO.au.com.company.SomeWidget.myFunc = function () {
                this.myObj = new YAHOO.widget.Layout({ });
                }

                This example should work fine... but here is another option:

                YAHOO.au.com.company.SomeWidget.myFunc = function () {
                YAHOO.util.onDOMReady(function() {
                this.myObj = new YAHOO.widget.Layout({ });
                }
                }

                Now we want to wait until the DOM get ready, and executing the same
                code, but there is an error in the code... this is not longer
                "YAHOO.au.com.company.SomeWidget", because you use an inline function,
                and because in JS all the elements are object, even the functions, the
                inline function defines a new object scope, and this is a reference to
                the inline function itself, which mean that you have to use the full
                namespace, of use the THAT trick:


                YAHOO.au.com.company.SomeWidget.myFunc = function () {
                YAHOO.util.onDOMReady(function() {
                YAHOO.au.com.company.SomeWidget.myObj = new YAHOO.widget.Layout({
                });
                }
                }

                OR

                YAHOO.au.com.company.SomeWidget.myFunc = function () {
                var that = this;
                YAHOO.util.onDOMReady(function() {
                that.myObj = new YAHOO.widget.Layout({ });
                }
                }

                So, you need to keep an eye in the scope for each function, and you
                will be fine... for sure... hehehe.

                Now, about the object/class/etc. As I said, everything is a object in JS.

                In your case:

                > -------------------------------------------------------------------
                > YAHOO.au.com.company.SomeWidget = new function(){
                > this.rootLayout=null;
                > this.renderLayout=function(){
                > YAHOO.au.com.company.SomeWidget.rootLayout= new
                > YAHOO.widget.Layout({ });
                > .....
                > }
                > }
                > -------------------------------------------------------------------
                > YAHOO.au.com.company.SomeWidget = {
                > renderLayout: function(){
                >
                > }
                > }

                Both definitions are the same... you are creating a new object, and
                setting some properties/methods to that object. The second sintax is
                more likely, and widely used.

                And the other approach is the prototype approach, but you can get more
                ACADEMIC definitions from the Douglas trilogy in the YUI theater:

                http://developer.yahoo.com/yui/theater/

                My 2 cents, hope this helps to understand this better.

                Best Regards,
                Caridy


                --- In ydn-javascript@yahoogroups.com, "Alex Wibowo" <alexwibowo@...>
                wrote:
                >
                > Hi Caridy,
                >
                > Thanks heaps. That explains the whole thing! :)
                >
                >
                >
                >
                > Sorry for this fundamental Javascript question... but I'm hoping
                that you
                > will be able to assist me (or to point to where I can learn more
                about it):
                >
                > What is the difference between:
                >
                > -------------------------------------------------------------------
                > YAHOO.au.com.company.SomeWidget = new function(){
                > this.rootLayout=null;
                > this.renderLayout=function(){
                > YAHOO.au.com.company.SomeWidget.rootLayout= new
                > YAHOO.widget.Layout({ });
                > .....
                > }
                > }
                > -------------------------------------------------------------------
                >
                > and
                > -------------------------------------------------------------------
                > YAHOO.au.com.company.SomeWidget = {
                > renderLayout: function(){
                >
                > }
                > }
                > -------------------------------------------------------------------
                >
                > I tried to find some reference... but cant find any clear
                explanation. My
                > understanding at the moment is that the second one is creating an
                array of
                > function.... while the first one is creating a class (not really a
                class..
                > but a variable that holds both variable & function?).. While we are
                looking
                > at the first one... why cant I call:
                >
                > this.rootLayout= new YAHOO.widget.Layout({ });
                >
                > and instead I have to use:
                >
                > YAHOO.au.com.company.SomeWidget.rootLayout= new
                YAHOO.widget.Layout({ });
                >
                > (I'm a Java programmer, and the notation above confuses me a bit)
                >
                >
                > I'm really sorry for this fundamental question... but I cant really find
                > useful reference on the web.
                >
                >
                >
                >
                >
                > On Tue, Dec 2, 2008 at 8:08 AM, Caridy Patino <caridy@...> wrote:
                >
                > > Hey Alex, as I mentioned in my previous post, unit.body is a DOM
                > > reference, you can not do this:
                > >
                > > unit.body = XX;
                > >
                > > but you can do this:
                > >
                > > unit.body.innerHTML = xx;
                > >
                > > If you want to use the fetch method, you can do this:
                > > YAHOO.plugin.Dispatcher.fetch(unit.body, '/some-url.html');
                > >
                > > If you want to use the Bubbling 2.0 beta, you can do this:
                > > YAHOO.plugin.Dispatcher.addUnit(unit, layout, {uri:
                '/some-url.html'});
                > >
                > > :-)
                > >
                > >
                > > Best Regards,
                > > Caridy Patino (caridy at yahoo-inc.com)
                > > Yahoo! LATAM
                > >
                > > --- In ydn-javascript@yahoogroups.com
                <ydn-javascript%40yahoogroups.com>,
                > > "Alex Wibowo" <alexwibowo@>
                > > wrote:
                > > >
                > > > ANyway... thx for that guys... I'll try the debugger; statement (i
                > > dont know
                > > > of this before!! so thanks for it!)...
                > > >
                > > > and i'll try to figure out whats wrong with my code that makes the
                > > > unit.body = XX doesnt work...
                > > >
                > > > I tried by simply doing:
                > > >
                > > >
                > > > unit.body = 'blallballa' (which should replace the content of the
                > > center
                > > > unit by text 'blalblalba, shouldnt it?)
                > > > or maybe i _have_ to use DOM reference (i..e not simple text)? i.e.
                > > should
                > > > it work if I do:
                > > >
                > > > unit = layout.getUnitByPosition ('center');
                > > > unit.body = YAHOO.plugin.Dispatcher.fetch('some url');
                > > >
                > > > I remember I've tried this before, and it didnt work. The content
                > > didnt get
                > > > replaced by the fetched URL content....
                > > > But again.... maybe I did something wrong...
                > > >
                > > >
                > > >
                > > >
                > > >
                > > > On Tue, Dec 2, 2008 at 7:37 AM, Alex Wibowo <alexwibowo@> wrote:
                > > >
                > > > > Hi Caridy...
                > > > >
                > > > > Thats what I thought too! I tried to get unit by the position, and
                > > replace
                > > > > the body attribute. But it doesnt render the fetched content.
                > > > >
                > > > > Maybe I was doing something wrong???
                > > > >
                > > > >
                > > > >
                > > > >
                > > > > On Tue, Dec 2, 2008 at 4:45 AM, Caridy Patino <caridy@> wrote:
                > > > >
                > > > >> Hey Alex,
                > > > >>
                > > > >> What do you mean with "why you cant replace the content of center
                > > unit
                > > > >> in the YUI layout"???? You can do that... If you have a
                reference to
                > > > >> the unit, or a reference to the layout object, you can do that...
                > > > >>
                > > > >> unit = layout.getUnitByPosition ('center');
                > > > >> unit.body -> DOM reference
                > > > >>
                > > > >> Best Regards,
                > > > >> Caridy Patino (caridy at yahoo-inc.com)
                > > > >> Yahoo! LATAM
                > > > >>
                > > > >> --- In
                ydn-javascript@yahoogroups.com<ydn-javascript%40yahoogroups.com>
                > > <ydn-javascript%40yahoogroups.com>,
                > >
                > > > >> "Alex Wibowo" <alexwibowo@>
                > > > >> wrote:
                > > > >>
                > > > >> >
                > > > >> > Hi Satyam..
                > > > >> >
                > > > >> > Another question for you (as you are the YUI developer
                team).... is
                > > > >> there
                > > > >> > any reason why you cant replace the content of center unit in
                > > the YUI
                > > > >> > layout?
                > > > >> >
                > > > >> >
                > > > >> >
                > > > >> > On Tue, Dec 2, 2008 at 12:17 AM, Alex Wibowo <alexwibowo@>
                wrote:
                > > > >> >
                > > > >> > > Hi Satyam,
                > > > >> > >
                > > > >> > >
                > > > >> > > What did u mean by that? The fetched code is not
                available at all
                > > > >> in the
                > > > >> > > 'script' tab in firebug.... so how can i put the
                breakpoint ??
                > > > >> > > Did I miss something obvious here??
                > > > >> > >
                > > > >> > >
                > > > >> > >
                > > > >> > >
                > > > >> > > On Mon, Dec 1, 2008 at 9:51 PM, Satyam <satyam@> wrote:
                > > > >> > >
                > > > >> > >> You can place a 'debugger' statement in the loaded code and
                > > > >> that will
                > > > >> > >> act as a breakpoint.
                > > > >> > >>
                > > > >> > >>
                > > > >> > >> Alex Wibowo wrote:
                > > > >> > >> > Hi Caridy,
                > > > >> > >> >
                > > > >> > >> >
                > > > >> > >> > As I mentioned... I'm trying to find the most
                effective way to
                > > > >> debug
                > > > >> > >> > the Javascript that is executed inside the fetched page.
                > > > >> > >> > As you have pointed, this is not possible using Firebug
                > > (i.e. in
                > > > >> > >> > firebug, the javascript debugger will go as far as the
                call to
                > > > >> fetch()
                > > > >> > >> > or addUnit()).
                > > > >> > >> > My alternative strategy, is to make the fetched page as
                > > > >> > >> > 'self-contained' as possible. i.e. so that it is
                possible to
                > > > >> visit the
                > > > >> > >> > fetched page by itself - so that I can do my javascript
                > > > >> debugging there.
                > > > >> > >> > However, this has a problem.
                > > > >> > >> >
                > > > >> > >> >
                > > > >> > >> > Say the parent page includes yuiloader-min.js ,
                container.js,
                > > > >> etc, and
                > > > >> > >> > the same javascript files are needed in the fetched page.
                > > > >> > >> > I have to include it twice. Hence , the browser will
                try to
                > > > >> fetch them
                > > > >> > >> > twice. This is bad, isnt it?
                > > > >> > >> > But i dont know how to solve it otherwise...
                > > > >> > >> >
                > > > >> > >> >
                > > > >> > >> >
                > > > >> > >> >
                > > > >> > >> > On Mon, Dec 1, 2008 at 9:05 AM, Caridy Patino
                > > > >> <caridy@<caridy%40gmail.com>
                > > > >>
                > > > >> > >> > <mailto:caridy@ <caridy%40gmail.com>>> wrote:
                > > > >> > >> >
                > > > >> > >> > Hey Alex,
                > > > >> > >> >
                > > > >> > >> > Here are the differences these methods:
                > > > >> > >> >
                > > > >> > >> > YAHOO.util.Dispatcher.fetch: uses the YUI Connection
                > > Manager to
                > > > >> load
                > > > >> > >> > the content and places the result with in the specified
                > > element
                > > > >> (ID).
                > > > >> > >> >
                > > > >> > >> > YAHOO.util.Dispatcher.addUnit: leaves the AJAX routine
                to the
                > > > >> Layout
                > > > >> > >> > Manager, and handles the response, executing the
                scripts, and
                > > > >> placing
                > > > >> > >> > the result inside the specified unit (unit reference or
                > > position).
                > > > >> > >> >
                > > > >> > >> > YAHOO.util.Dispatcher.delegate: leaves the AJAX
                routine to the
                > > > >> > >> > Tabview, and handles the reponse, executing the
                scripts, and
                > > > >> placing
                > > > >> > >> > the result inside the specified tab (tab reference).
                > > > >> > >> >
                > > > >> > >> > So, you should use the addUnit all the time with your
                layouts,
                > > > >> but if
                > > > >> > >> > you want to use the fetch, it's fine, you just need to get
                > > the Unit
                > > > >> > >> > DOM Element before that, to call the fetch method using
                > > the DOM
                > > > >> > >> > Reference.
                > > > >> > >> >
                > > > >> > >> > About the errors, all these method supports error
                handling,
                > > > >> using the
                > > > >> > >> > property "error" in the configuration object,
                referencing to a
                > > > >> > >> > function that handles the error. But there is not way
                to get
                > > > >> the real
                > > > >> > >> > error because we use an anonymous function. But we can
                get the
                > > > >> chunk
                > > > >> > >> > that generates the error, that certainly will help us to
                > > figure it
                > > > >> > >> > out.
                > > > >> > >> >
                > > > >> > >> >
                > > > >> > >> >
                > > > >> > >> > Best Regards,
                > > > >> > >> > Caridy Patino (caridy at yahoo-inc.com
                <http://yahoo-inc.com>)
                > > > >> > >> > Yahoo! LATAM
                > > > >> > >> >
                > > > >> > >> > --- In
                > > > >> ydn-javascript@yahoogroups.com
                <ydn-javascript%40yahoogroups.com><ydn-javascript%
                > > 40yahoogroups.com>
                > > > >> <ydn-javascript%40yahoogroups.com>
                > > > >> > >> >
                > > > >>
                > >
                <mailto:ydn-javascript%40yahoogroups.com<ydn-javascript%2540yahoogroups.com>
                > > <ydn-javascript%2540yahoogroups.com>
                > > > >> <ydn-javascript%2540yahoogroups.com>>,
                > > > >> > >> "Alex Wibowo"
                > > > >> > >> > <alexwibowo@>
                > > > >> > >> > wrote:
                > > > >> > >> >
                > > > >> > >> > >
                > > > >> > >> > > Totally separate question....
                > > > >> > >> > > With all this Dispatcher.addUnit & Dispatcher.fetch.....
                > > what
                > > > >> is the
                > > > >> > >> > best
                > > > >> > >> > > way to do debugging? I'm using Firefox + Firebug for my
                > > > >> development,
                > > > >> > >> > and the
                > > > >> > >> > > fetched page (or added unit) wont get displayed in the
                > > Firebug
                > > > >> > >> > javascript
                > > > >> > >> > > debugger. Hence I cant put any breakpoints, etc.
                > > > >> > >> > >
                > > > >> > >> > >
                > > > >> > >> > >
                > > > >> > >> > > Thanks again, and sorry for the spam...
                > > > >> > >> > >
                > > > >> > >> >
                > > > >> > >> >
                > > > >> > >> >
                > > > >> > >> >
                > > > >> > >> > --
                > > > >> > >> > Best regards,
                > > > >> > >> >
                > > > >> > >> >
                > > > >> > >> > WiB
                > > > >> > >> >
                > > > >> > >> >
                > > > >> > >> > ----------------------------------------------------------
                > > > >> > >> >
                > > > >> > >> >
                > > > >> > >> > No virus found in this incoming message.
                > > > >> > >> > Checked by AVG - http://www.avg.com
                > > > >> > >> > Version: 8.0.176 / Virus Database: 270.9.12/1821 - Release
                > > Date:
                > > > >> > >> 30/11/2008 17:53
                > > > >> > >> >
                > > > >> > >> >
                > > > >> > >>
                > > > >> > >>
                > > > >> > >
                > > > >> > >
                > > > >> > >
                > > > >> > > --
                > > > >> > > Best regards,
                > > > >> > >
                > > > >> > >
                > > > >> > > WiB
                > > > >> > >
                > > > >> > >
                > > > >> >
                > > > >> >
                > > > >> > --
                > > > >> > Best regards,
                > > > >> >
                > > > >> >
                > > > >> > WiB
                > > > >> >
                > > > >>
                > > > >>
                > > > >>
                > > > >
                > > > >
                > > > >
                > > > > --
                > > > > Best regards,
                > > > >
                > > > >
                > > > > WiB
                > > > >
                > > > >
                > > >
                > > >
                > > > --
                > > > Best regards,
                > > >
                > > >
                > > > WiB
                > > >
                > >
                > >
                > >
                >
                >
                >
                > --
                > Best regards,
                >
                >
                > WiB
                >
              • Michael Hasenstein
                Hi, (A reply for the previous poster, and maybe others, actually. Because I m having a lot of fun exploring the details of Javascript right now myself and
                Message 7 of 25 , Dec 4, 2008
                • 0 Attachment
                  Hi,

                  (A reply for the previous poster, and maybe others, actually. Because I'm having a lot of fun exploring the details of Javascript right now myself and explaining them to others - one learns most oneself by teaching others :-)   If you don't need the explanation, please excuse me. Maybe someone will.)

                  Well, it isn't exactly the same. Okay, for all practical purposes the particular examples (repeated below) indeed ARE equivalent. But let me extend the example a little to show the difference.

                  Instead of using an anonymous function expression (as in
                  YAHOO.au.com.company.SomeWidget = new function(){...) I'm going to assign a function expression to a variable (I could also use a so-called function declaration, which would be  "function name () {...}" used at the top level, i.e. not nested into something else, but I prefer to assign functions to variables. The subtle difference is that a variable is a pointer to the anonymous function expression on the right side and can be reassigned, a function declaration declares a function name that is just that, and not a variable name).

                  //Setup a constructor function. MUST be used with "new f()", otherwise
                  //"this" would be the global object ("window" in browser environments).
                  var F = function () {
                      this.variable = 42
                  };

                  //produce a new object, set this to point to it and call f()
                  var a  = new F();

                  So far there is no difference to just writing

                  //don't actually do this, code just for comparison!
                  //otherwise the next step would not work
                  var a = {
                      variable = 42
                  }

                  But now let's add a function to the prototype object of F().

                  Background: 
                  functions are objects, but objects aren't functions. Function objects in Javascript all have a member called prototype.  When you declare a new function prototype points to an empty object.

                  //This ADDS a member to the existing prototype object.
                  //One could also simply replace the whole prototype object
                  //with ones own object.

                  F.prototype.show = function () {
                      return this.variable;
                  }


                  Now you can do this:

                  a.show()
                  (returns 42)

                  What happened? When you create a new object using a constructor function rather than by assigning an object literal "{}", the newly created object gets a "secret link" - not to the constructor function but to its prototype! In Firefox's Javascript engine that link can be accessed using __proto__ (but don't ever use it in your programs or it won't run in other browsers - that linkage is "secret" and although part of the Javascript language, it is not officially exposed to the Javascript code you write).

                  Let's do a check (only works in Firefox!):

                  a.__proto__ === F.prototype
                  returns "true" (by using === we assure that the objects are indeed identical, i.e. the two variables point to the same memory location)

                  So what is my point? Well, if you create an object without a constructor, you don't get the secret link. Therefore it does not inherit anything from a parent object (the constructor function object). So in the original example below saying the two ways to create the object are the same is correct for all practical purposes of the particular example, I think it's a good idea to point out the hidden implementation difference that DOES exist - and is a core feature of the language and makes the YUI possible in the first place, since it makes heavy use of that inheritance mechanism.


                  Michael


                  PS: One other aspect - again for the previous poster, : For singleton objects it may not matter, but if you create a constructor function methods should not be added to the created object inside that constructor using "this.memberFunction". Instead, add them to the constructor functions prototype. In the below example with the inline anonymous constructor that wouldn't be possible of course, I can't think of a way to add to an anonymous function's prototype member... well, except for maybe something like this: var a =(function(){...}).prototype = {foo:function(){...}}
                  :-)


                  --- "Caridy Patino" <caridy@...> wrote:
                  > > YAHOO.au.com.company.SomeWidget = new function(){
                  > >      this.rootLayout=null;
                  > >      this.renderLayout=function(){
                  > >              YAHOO.au.com.company.SomeWidget.rootLayout= new
                  > > YAHOO.widget.Layout({  });
                  > >              .....
                  > >      }
                  > > }
                  > > -------------------------------------------------------------------
                  > > YAHOO.au.com.company.SomeWidget = {
                  > >         renderLayout: function(){
                  > >
                  > >         }
                  > > }
                  > Both definitions are the same... you are creating a new object, and
                  > setting some properties/methods to that object. The second sintax is
                  > more likely, and widely used.
                  >
                  > And the other approach is the prototype approach, but you can get more
                  > ACADEMIC definitions from the Douglas trilogy in the YUI theater:
                  >
                  > http://developer.yahoo.com/yui/theater/
                • Michael Hasenstein
                  ... object). That sentence I just wrote is wrong - it DOES inherit, ALL objects do, but from the Object object s prototype (the object at the root of the
                  Message 8 of 25 , Dec 4, 2008
                  • 0 Attachment
                    --- I wrote:

                    > So what is my point? Well, if you create an object without a
                    > constructor, you don't get the secret link. Therefore it does not
                    > inherit anything from a parent object (the constructor function object).


                    That sentence I just wrote is wrong - it DOES inherit, ALL objects do, but from the Object object's prototype (the object at the root of the object hierarchy in Javascript). Imagine such objects being created using the "default constructor".

                    Example/proof:

                    //create object using literal notation
                    b = {};

                    //only works in Firefox, other browsers have different "secret links"
                    b.__proto__=== Object.prototype
                    returns "true"
                  • Michael Hasenstein
                    One more thing I forgot... (okay I ll stop now - one can easily write a book... oops, I guess that s already been done :-) ) ... There s also a property called
                    Message 9 of 25 , Dec 4, 2008
                    • 0 Attachment
                      One more thing I forgot... (okay I'll stop now - one can easily write a book... oops, I guess that's already been done :-) )

                      --- I wrote:
                      > Let's do a check (only works in Firefox!):
                      >
                      > a.__proto__ === F.prototype
                      > returns "true" (by using === we assure that the objects are indeed
                      > identical, i.e. the two variables point to the same memory location)

                      There's also a property called constructor.  It points to the actual constructor function itself:

                      a.constructor === F
                      "true"

                      and

                      b = {}
                      b.constructor === Object
                      "true"

                      (unless the user overwrites the property) object.constructor.prototype points to the same object as __proto__ but is official and works in all Javascript implementations.

                      Among other things, YUI uses these to build a property superclass when using YAHOO.lang.extend. You can also use it to implement your own  "instanceof" functionality. However, only the (JS interpreter implementation specific) secret link property is used to look for functions in the inheritance chain by the JS interpreter.
                    • Michael Hasenstein
                      I must add still one more thing - since this is a serious error in Javascript itself. The constructor property is NOT part of the created object, which one
                      Message 10 of 25 , Dec 4, 2008
                      • 0 Attachment
                        I must add still one more thing - since this is a serious error in Javascript itself. The constructor property is NOT part of the created object, which one would logically expect (it would be nice and obvious if every object's constructor property would point to the function that really "constructed" this object).

                        Instead, the constructor property *is inherited*. It really is on the constructor Function object's prototype object. In my (previous) example, where F is the constructor function:

                        F.prototype.constructor === F
                        "true"

                        Since "a" (below) was constructed by F it has a secret link (accessible in Firefox  but not in e.g. IE or Opera) to F's prototype object, and an attempt to access a.constructor - as I did in the example below - therefore finds that property, even though it is NOT in "a" itself, but Javascript keeps looking in the secret-link object and finds it there.

                        That works fine in this simple 1-level inheritance example. Unfortunately it fails if there are more inheritance levels, where the constructor property inherited points to the wrong function instead of the one that actually created that particular object.

                        Oh and as a tip, don't ever confuse the inheritance in Javascript provided by that "secret link" with the "prototype" property. The latter is a property only Function objects possess, and it is meant only for constructor functions - but given to all functions simply because each one just might be(come) a constructor. The secret link, __proto__ in Firefox, is set by the Javascript engine itself, and it is set to point to the prototype property of the Function object used to construct the object. That's Object.prototype for objects created using literal notation. The Javascript engine than uses that secret link to look for properties it cannot find in the object itself. The prototype property it points to is an object itself - and if that object itself was created using a constructor it too has a secret link.


                        > There's also a property called constructor. It points to the actual
                        > constructor function itself:
                        >
                        > a.constructor === F
                        > "true"
                        >
                        > and
                        >
                        > b = {}
                        > b.constructor === Object
                        > "true"
                        >
                        > (unless the user overwrites the property) object.constructor.prototype
                        > points to the same object as __proto__ but is official and works in all
                        > Javascript implementations.
                        >
                        > Among other things, YUI uses these to build a property superclass when
                        > using YAHOO.lang.extend. You can also use it to implement your own
                        > "instanceof" functionality. However, only the (JS interpreter
                        > implementation specific) secret link property is used to look for
                        > functions in the inheritance chain by the JS interpreter.
                      Your message has been successfully submitted and would be delivered to recipients shortly.