Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 29
  1. #1
    New Coder
    Join Date
    May 2004
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts

    setTimeout and objects again :(

    hi,

    I am pretty sure i got this code from here, most probably from liorean, but i can't find the thread. Anyway, the code is great and does exactly what I want, but blow chunks in safari.....

    function C(){
    this.a=function(i){
    var me=this;
    alert(i)
    //confirm([i,me.a]) && setTimeout (function(){me.a(i+1)},1000);
    setTimeout (function(){me.a(i+1)},1000);
    };
    }

    var t=new C;
    t.a(0);

    I have a constructor ( like C here) that I create multiple instances of (like t here)
    So what I need is a way to call my anim function over and over when they are new instances of my constructor ( i hope that is right terminology ).

    does anyone else really hate safari of is it just me

    cheers,

    dave

  • #2
    New Coder
    Join Date
    May 2004
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts
    A better (but simplified) example of what i am up to:

    the code below works for me in gecko but I need somthing like this that works in safari ( i am assuming it works in explorer )
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
            "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
    	<title>obj_sto</title>
    <style type="text/css">
    div
    {
    	position: relative;
    	width:440px;
    	height: 48px;
    	border: 1px solid red;
    	white-space: nowrap;
    }
    
    </style>
    <script type="text/javascript">
    // object constructor
    function dcTweenObject(readid,elmid,prop,start,end,duration) { 
    // define object's properties
    this.elm=document.getElementById(elmid)
    this.property=prop
    this.startpropval=start;
    this.endpropval=end;
    this.duration=duration;
    this.timeout=100;
    this.frames=duration/this.timeout;
    this.easing=(this.endpropval-this.startpropval)/this.frames;
    // define object's methods  
        this.a=this.a=function(i){
            var me=this;
     		me.num=i;
            var d=i*this.easing;
            this.elm.style[this.property]=d+'px'       
            if(me.num>this.frames) return;
            this.timer=setTimeout(function(){me.a(me.num+1)},this.timeout);
        }
    }
    window.onload=function() {
    	t0=new dcTweenObject('r0','adiv0','left' , 0 , 100 , 500 );
    } 
    </script>
    </head>
    <body>
    <div onmouseover="t0.a(0);" id="adiv0">
    run t0.a(0)
    </div>
    </body>
    </html>
    Last edited by liorean; 06-02-2004 at 04:01 PM. Reason: [code]ified

  • #3
    Regular Coder
    Join Date
    Jul 2002
    Posts
    698
    Thanks
    0
    Thanked 0 Times in 0 Posts
    setTimeout(function(){me.a(me.num+1)},this.timeout); <-- that as far as I understand would send the function a.

    setTimeout(me+".a("+(me.num+1)+");",this.timeout); <-- this is how I write it usualy works.

  • #4
    New Coder
    Join Date
    May 2004
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Garadon, I tried what you suggested, and it makes sense and should work ( sending a string to setTimeout ) but no, in this case it does not .......

    If I understand what I have read about my difficulties, it is that all the variables dont exist anymore at the time the setTimeout is run, but I thought I had that covered by the function being 'inside' the constructor.

    I am thinking that the thread I started should have been " I want to make a tweening function available to instances of objects - how do I make the looping and iteration parts?"

    thanks though,

    dave

  • #5
    Regular Coder
    Join Date
    May 2004
    Location
    Alabama, USA
    Posts
    237
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    function C(limit)
    {
      var me = this;
    
      this.a = function(i)
      {
        window.status = i;
        setTimeout( function(){if (i < limit) me.a(i + 1);}, 1000 );
      }
    }
    
    var t = new C(10);
    t.a(0);

  • #6
    New Coder
    Join Date
    May 2004
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I think I have worked out somthing else to do with my nightmare:

    Mike's code above at first did not work - but then I tried it in the "latest" safari (the one that only runs on os X 10.3) and it did work. For compatabilities sake I still run the old version (os X 10.2).

    So my question is :

    a) How can I set a delay between my animation's frames in older safari browsers?

    b) Should I just ditch the constructor instance stuff and use a "regular" function?

    c) Why do I have to spend so much time on somthing simple , just because Apple want to sell mp3s(or aacs or whatevers)?

    uggh!

    d) Should I just give up?

    thanks though, I like the conditional in the setTimeout

  • #7
    Regular Coder
    Join Date
    May 2004
    Location
    Alabama, USA
    Posts
    237
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Just curious... in this demo, does the menu 'slide' vertically in OS X 10.2 ?

  • #8
    New Coder
    Join Date
    May 2004
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by MikeFoster
    Just curious... in this demo, does the menu 'slide' vertically in OS X 10.2 ?
    hi,

    yes that works fine [safari on 10.2]

  • #9
    Regular Coder
    Join Date
    May 2004
    Location
    Alabama, USA
    Posts
    237
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks!

    With all the recent interest in 'closures', it would be interesting to know why it didn't work in OSX 10.2. Perhaps the following would help to debug it:
    Code:
    function C(limit)
    {
      var me = this;
      this.name = 'myClosureTest';
      this.a = function(i)
      {
        alert('method a()\n\n' +
              'me: ' + me + '\n' +
              'me.name: ' + me.name + '\n' +
              'limit: ' + limit + '\n' +
              'i: ' + i);
      }
      this.b = function(i)
      {
        setTimeout( function() {
          alert('delayed method b()\n\n' +
                'me: ' + me + '\n' +
                'me.name: ' + me.name + '\n' +
                'limit: ' + limit + '\n' +
                'i: ' + i);}, 1000);
              
      }
    }
    
    var t = new C(10);
    t.a(0);
    t.b(1);

  • #10
    New Coder
    Join Date
    May 2004
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by MikeFoster
    Thanks!

    With all the recent interest in 'closures', it would be interesting to know why it didn't work in OSX 10.2. Perhaps the following would help to debug it:

    hi, thanks for that code, I bunged it into "that" browser and recieved the alert below:

    me: [object Object]
    me.name: myClosureTest
    limit: 10
    i: 0

    just the one.....is that what I was supposed to do?

  • #11
    Master Coder
    Join Date
    Feb 2003
    Location
    Umeå, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    I believe the problem lies in a deficiency of the Safari JavaScript engine (KJS) to support closures.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #12
    Regular Coder
    Join Date
    May 2004
    Location
    Alabama, USA
    Posts
    237
    Thanks
    0
    Thanked 0 Times in 0 Posts
    It seems that setTimeout(function(){...}, timeout) did not work. This feature is only supported by later Javascript versions (i'm not sure what version, i'll have to look it up). I wonder what version of js is supported by that browser?

  • #13
    New Coder
    Join Date
    May 2004
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts
    And I wonder what on earth I can do to make a website. I really don't care what the code looks like, should I just drop all this contructor, instance, squarebracket stuff and go back to using millions of separate regular functions

    I can just about argue my way round not supporting extra js in IE5 mac (which doesn't work either) but not safari.
    Last edited by david_currey; 06-02-2004 at 07:48 PM. Reason: forgot about ie5 mac

  • #14
    Regular Coder
    Join Date
    May 2004
    Location
    Alabama, USA
    Posts
    237
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Oh there will always be incompatibilities between browsers

    You're application probably doesn't 'require' using closures. But it sounds like the closure in my test code above did work. If you will, try it again and comment-out this line: t.a(0);

    Javascript v1.2 added support for function arguments to setInterval(). What version of Safari do you use on OSX 10.2 ?

  • #15
    New Coder
    Join Date
    May 2004
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts
    sorry for my ranting -

    the last version of safari that people can use if they don't upgrade the OS to osx10.3 is 1.0.2 (v85.7).

    I bet you're right about not needing closures, it is just that this was the first "major" exploration into objects and whatnot and not just writing the mess of functions I usually create ( ie trying to do things properly ), to be honest I have read as much as I could about closures and I just don't get it....all I want to do is write clean,efficient code that will do something over and over again to lots of different things

    anyway, if I remove the line: t.a(0); how should I call the function?

    thanks for the help, it is greatly appreciated,

    dave


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •