Page 3 of 14 FirstFirst 1234513 ... LastLast
Results 21 to 30 of 133

Thread: Jasoop Toolbox

  1. #21
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,876
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Code:
    var Concatenate = function (/*string arguments*/) {
    var argv = arguments;
    var argc = arguments.length;
    var string;
    string="";
    for(x=0;x<argc;x++) {
    string=string+argv[x];
    }
    return string;
    };
    
    var Shift = function (txt) {
    var argv = txt;
    var argc = txt.length;
    var string;
    string=argv.toUpperCase();
    return string;
    };
    
    var Unshift = function (txt) {
    var argv = txt;
    var argc = txt.length;
    var string;
    string=argv.toLowerCase();
    return string;
    };
    Where is the indentation here? Additionally, why do you keep renaming arguments to argv? It seems quite pointless, especially when it doesn't even behave like a C argv. Also, these functions are very redundant, and have capital names, something which, as I stated before, is reserved for constructors and namespaces.
    Code:
    function concatenate() {
        return Array.prototype.join.call(arguments, "");
    }
    
    function shift(s) {
        return s.toUpperCase();
    }
    
    function unshift(s) {
        return s.toLowerCase();
    }
    They are not worth making into new functions (since they're all only one expression each anyway, none of them particularly complex) and by doing so, you lose the organisation provided by the original functions on the appropriate prototypes (concatenate() excepted) and also provide new, confusing names: shift() and unshift() in most people's minds refer to adding an element to or removing an element from the beginning of a data-structure. See, for example, Array.prototype.shift() and Array.prototype.unshift(), Perl's shift function, or the term 'bit-shifting' (operators such as >>, <<, and >>>).
    Code:
    var setCookie = function () {
    var argv = arguments;
    var argc = arguments.length;
    var name = (argc > 0) ? argv[0] : null;
    var value = (argc > 1) ? argv[1] : null;
    var expires = (argc > 2) ? argv[2] : null;
    var path = (argc > 3) ? argv[3] : null;
    var domain = (argc > 4) ? argv[4] : null;
    var secure = (argc > 5) ? argv[5] : false;
    document.cookie = ((name == null) ? "" : (name)) + "=" + ((value == null) ? "" : (escape(value))) + ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + ((path == null) ? "" : ("; path=" + path)) + ((domain == null) ? "" : ("; domain=" + domain)) + ((secure == true) ? "; secure" : "");
    };
    This isn't C. There are easier ways. There is also sane code formatting, a boon for which I thank the gods every time I look upon a piece of code that doesn't have it...
    Code:
    function setCookie(name, value, expires, path, domain, secure) {
        name = escapeURIComponent(name || "");
        value = escapeURIComponent(value || "");
        expires = expires ? "; expires=" + expires.toGMTString() : "";
        path = path ? "; path=" + path : "";
        domain = domain ? "; domain=" + domain : "";
        secure = secure ? "; secure" : "";
    
        document.cookie = name + "=" + value + expires + path + domain + secure;
    };
    Look, readability!
    Code:
    var getCookie = function (name) {
    var argv = name + "=";
    var argc = argv.length;
    var clen = document.cookie.length;
    var x = 0;
    while (x < clen) {
      var y = x + argc;
      if(document.cookie.substring(x,y)==argv)
        var e = document.cookie.indexOf(";",y);
        if(e==-1)
        e=document.cookie.length;
        return unescape(document.cookie.substring(y,e));
      x = document.cookie.indexOf(" ",x)+1;
      if(x==0) break;
    }
    return null;
    };
    Er... or, alternatively:
    Code:
    function getCookie(name) {
        name = decodeURIComponent(name) + "=";
    
        var c   = document.cookie,
            idx = c.indexOf(name) + name.length,
            si  = c.indexOf(";", idx);
    
        c = c.substr(idx);
    
        return decodeURIComponent(si > -1 ? c.substr(0, si) : c);
    }
    The original setCookie() is a perfect example of irregular indentation. Why is some of it indented properly and some not? Also, why are all these functions global? Put things in namespaces! It helps keep the global namespace clean and drastically and automatically improve compatibility with other scripts, something I would think is rather vital for a 'toolbox'.
    Code:
    animation = this; // dangerous ?? should be var ?? won't work with var...
    Not only dangerous: it effectively limits your object to one instance per page, and is completely redundant anyway. You can refer to this object with 'this' from any prototype function, presuming it's called correctly. If you'd gone through the code I posted earlier, you'd have realised this.
    Code:
    Animation.prototype.moveTo = function (x,y) {
      _(this.element).style.position="absolute"; // must make reference - tried but won't work...
      _(this.element).style.left=(x+"px");       // must make reference - tried but won't work...
      _(this.element).style.top=(y+"px");        // must make reference - tried but won't work...
    };
    Well, the 'dumb' way would be:
    Code:
    Animation.prototype.moveTo = function(x, y) {
        var s = _(this.element).style;
        s.position = "absolute";
        s.left = x + "px";
        s.top = y + "px"; 
    };
    However, this still does the lookup once every time that function is called, which isn't necessary. There's only one element per Animation, so you might as well attach the element reference to the Animation object directly — again, as I did in my earlier code.

    You've also still got the parallel arrays design going on, which makes your code needlessly complex and inefficient in several places.

    I didn't post an analysis of your code and an example of how to do it better just for fun: I had hoped you would read through it and incorporate the ideas into your code.

    P.S.: A minor point in comparison to all the others, but the convention in C-syntax code is to put spaces before brackets after keywords, but not between function/method calls and their brackets: you seem to have this backwards. Arguments should be separated with spaces as well as commas. In C/C++, the dominant style is to place opening braces on separate lines for several constructs. In Javascript, Java-style is dominant: the opening brace goes on the same line as the keyword and options.
    Last edited by Twey; 10-14-2008 at 11:41 PM.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  2. #22
    Join Date
    Jun 2008
    Posts
    589
    Thanks
    13
    Thanked 54 Times in 54 Posts
    Blog Entries
    1

    Default

    Thank you.

    -magicyte

  3. #23
    Join Date
    Jun 2008
    Posts
    589
    Thanks
    13
    Thanked 54 Times in 54 Posts
    Blog Entries
    1

    Default

    Code:
    /********** - IMPORTANT LABEL - **********/
    /* Title: Jasoop Toolbox                 */
    /* Name: jasoop.js                       */
    /* Author: 2008 Arthur C. Watkins        */
    /* Notice: This label is to stay intact  */
    /* for usage of this document.           */
    /********** - IMPORTANT LABEL - **********/
    
    // Start Jasoop Toolbox
    
    var _ = function(el) {
        if (document.getElementById()) return document.getElementById(el);
        else if (document.all) return document.all[el];
        else if (document.layers) return document.layers[el];
        else return false;
    };
    
    var Concatenate = function() {
        var string = '';
        for (x = 0; x < arguments.length; x++) {
            string = string + arguments[x];
        }
        return string;
    };
    
    var clock = Date.now || // inspired by MooTools
    function() {
        return new Date().getTime();
    };
    
    /* // CAUTION
    var delay = function(statement, delay) {
        var start, end, loop;
        start = clock();
        end = (start + delay);
        do {
            loop = clock();
        } while ( loop < end );
        return setTimeout(statement, 0);
    };
    */
    
    var Animation = function(el) {
        this.element = el;
        this.x = [];
        this.y = [];
        this.delay = [];
        this.ac = 0;
        this.lc = 0;
        this.pause = false;
        this.autodelete = false;
        this.loop = false;
    };
    
    Animation.prototype.moveTo = function(x, y) {
        document.getElementById(this.element).style.position = "absolute";
        document.getElementById(this.element).style.left = (x + "px");
        document.getElementById(this.element).style.top = (y + "px");
    };
    
    Animation.prototype.start = function() {
        if (!this.pause) {
            if (this.ac < this.lc) {
                this.moveTo(this.x[this.ac], this.y[this.ac]);
                this.ac++;
                setTimeout((function(animation) {
                    return function() {
                        animation.start();
                    };
                })(this), this.delay[this.ac]);
            }
            else if (this.ac >= this.lc) { (this.autodelete) ? this.reset() : this.ac = 0; (this.loop && !this.autodelete) ? this.start() : ""; // used from Twey - LOVE IT!!
            }
        }
        else if (this.pause) {
            this.pause = !this.pause;
        }
    };
    
    Animation.prototype.stop = function() {
        this.pause = true;
    };
    
    Animation.prototype.compute = function(l, t, d) {
        this.x[this.lc] = l;
        this.y[this.lc] = t;
        this.delay[this.lc] = d;
        this.lc++;
    };
    
    Animation.prototype.reset = function() {
        for (i = 0; i <= this.ac; i++) {
            this.x = [];
            this.y = [];
            this.delay = [];
        }
        this.lc = 0;
        this.ac = 0;
    };
    
    // End Jasoop Toolbox
    
    /********** - IMPORTANT LABEL - **********/
    /* Title: Jasoop Toolbox                 */
    /* Name: jasoop.js                       */
    /* Author: 2008 Arthur C. Watkins        */
    /* Notice: This label is to stay intact  */
    /* for usage of this document.           */
    /********** - IMPORTANT LABEL - **********/
    Best I've come so far.

    -magicyte
    Last edited by magicyte; 11-01-2008 at 03:37 AM.

  4. #24
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,876
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    OK, we seem to have reasonable formatting. How about implementing some of the suggestions I made?
    var delay = function(statement, delay) {
    var start, end, loop;
    start = clock();
    end = (start + delay);
    do {
    loop = clock();
    } while ( loop < end );
    return setTimeout(statement, 0);
    };
    Never, ever do this. It will result in the entire browser hanging, including the UI.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  5. #25
    Join Date
    Jun 2008
    Posts
    589
    Thanks
    13
    Thanked 54 Times in 54 Posts
    Blog Entries
    1

    Default

    Quote Originally Posted by Twey
    OK, we seem to have reasonable formatting.
    Aye, aye, capn'! But I cheated. Used Online JavaScript Beautifier. I am still learning from everything you posted and WILL, repeat WILL implement the suggestions you made.

    Quote Originally Posted by Twey
    Never, ever do this. It will result in the entire browser hanging, including the UI.
    Aw, shoot!! 2 questions/comments:

    1. What is the 'UI'?

    2. I understand why I shouldn't do it. The user may have a slow browser OR the loop the user made may, in fact, be too long for the browser to handle and yet stay 'in', you know, 'alive' and 'well'. In fact, I used it in C++ as a delay function using time.h. In this case, could I use John Scheuer's idea of timeout vagaries as seen in the thread? Of course I'd have to ask for permission first, but I just want the client-side script to loop on time, 'no matter what' (<- I exaggerate this).

    Thank you for your kind contribution and time.

    -magicyte

  6. #26
    Join Date
    Jun 2008
    Posts
    589
    Thanks
    13
    Thanked 54 Times in 54 Posts
    Blog Entries
    1

    Default

    Nevermind. Here. I have formatted and changed the Jasoop Toolbox Code to the BEST of my ability. I really want lots of people to use and manipulate it.

    Here it is:

    jasoop.js

    Code:
    /********** - IMPORTANT LABEL - **********/
    /* Title: Jasoop Toolbox                 */
    /* Name: jasoop.js                       */
    /* Author: 2008 Arthur C. Watkins        */
    /* Notice: This label must stay intact   */
    /* for legal usage of this document.     */
    /********** - IMPORTANT LABEL - **********/
    
    // Start Jasoop Toolbox
    
    var _ = function(el) {
        if (document.getElementById()) return document.getElementById(el);
        else if (document.all) return document.all[el];
        else if (document.layers) return document.layers[el];
        else return false;
    };
    
    var Animation = function() {
        function Animation(el) {
            // private variables - are these possible in JavaScript?
            this.x = [];
            this.y = [];
            this.delay = [];
            this.ac = 0;
            // public variables - are these possible in JavaScript?
            this.pause = false;
            this.autodelete = false;
            this.loop = false;
            this.element = el;
        }
    
        Animation.prototype = {
            moveTo: function(x, y) {
                document.getElementById(this.element).style.position = "absolute";
                document.getElementById(this.element).style.left = (x + "px");
                document.getElementById(this.element).style.top = (y + "px");
            },
    
            compute: function(l, t, d) {
                this.x[this.x.length] = l;
                this.y[this.y.length] = t;
                this.delay[this.delay.length] = d;
            },
    
            start: function() {
                if (!this.pause) {
                    if ((this.ac < this.x.length) && (this.ac < this.y.length) && (this.ac < this.delay.length)) {
                        this.moveTo(this.x[this.ac], this.y[this.ac]);
                        this.ac++;
                        setTimeout((function(animation){return function(){animation.start();};})(this), this.delay[this.ac]);
                    }
                    else if ((this.ac >= this.x.length) && (this.ac >= this.y.length) && (this.ac >= this.delay.length)) { (this.autodelete) ? this.reset() : this.ac = 0; (this.loop && !this.autodelete) ? this.start() : "";
                    }
                }
                else if (this.pause) {
                    this.pause = !this.pause;
                }
            },
    
            stop: function() {
                this.pause = true;
            },
    
            reset: function() {
                this.ac = 0;
                this.x = [];
                this.y = [];
                this.delay = [];
            }
    
        };
    
        return Animation;
    } ();
    
    // End Jasoop Toolbox
    
    /********** - IMPORTANT LABEL - **********/
    /* Title: Jasoop Toolbox                 */
    /* Name: jasoop.js                       */
    /* Author: 2008 Arthur C. Watkins        */
    /* Notice: This label must stay intact   */
    /* for legal usage of this document.     */
    /********** - IMPORTANT LABEL - **********/
    My Big Ol' List O' Things: Questions and Advancements

    --I want some varaibles in my Animation to be private to the users and some to be public to the users. For example, I don't want the user to jack up the x, y, or delay arrays and kill the thing, nor do I want the user to jack up the ac variable. However, he can manipulate the rest. Please help me on this. Is this even possible to make public, private, or protected variables in JavaScript?

    The best I've come so far. Thanks for everything Twey. .

    -magicyte
    Last edited by magicyte; 11-05-2008 at 10:31 PM.

  7. #27
    Join Date
    May 2007
    Location
    USA
    Posts
    373
    Thanks
    2
    Thanked 4 Times in 4 Posts

    Default

    UI = User Interface.

    About the hanging issue... it has nothing to do with the user's computer being slow. It has to do with an infinite loop and the fact that javascript is single-threaded.
    Trinithis

  8. #28
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,876
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    A single thread that includes the whole browser.
    2. I understand why I shouldn't do it. The user may have a slow browser OR the loop the user made may, in fact, be too long for the browser to handle and yet stay 'in', you know, 'alive' and 'well'. In fact, I used it in C++ as a delay function using time.h. In this case, could I use John Scheuer's idea of timeout vagaries as seen in the thread? Of course I'd have to ask for permission first, but I just want the client-side script to loop on time, 'no matter what' (<- I exaggerate this).
    But it's fundamentally useless. The point of setTimeout() is that the browser can do other things in the meantime. In this case, the browser can't do anything in the meantime, including basic things like painting — the browser will hang, and the OS will most likely notice this and try to kill it (or to kill the script, in the case of some browsers).

    --I have added aliases to my Animation variable/prototype functions so that the programmer may use them with ease and understanding.
    Hooray, more redundancy. If the names aren't easy and comprehensible in the first place then change them, don't add redundant functions.
    --I have added the ischeck(el) function to my 'toolbox', per se, so that it is easier to figure out if an element is checked.
    Which takes an element ID instead of a reference, making it slow, calls document.getElementById() twice, making it slower, has a daft name (if a checkbox is selected then it's 'checked', not 'check': 'check' is the American name for the mark placed in the box) and is fundamentally redundant, since if (foo) return true; else return bar; is equivalent to return !!foo;, or, in this case, since foo is already boolean, simply return foo;. If you write it properly, ischecked(foo) is equivalent to foo.checked, and is therefore a pointless reinvention of the wheel, along with much of the rest of this toolkit.
    --I have kept the clock variable.
    ... but why?
    --I don't want to use Array.prototype.join.call(arguments, ""); on my Concatenate(); function.
    Again... why? What you're doing is pointless. 'I don't want to walk down the road to the house next door, I think I'm going to walk all around the block and come at it from the other side.' If you're just doing it to teach yourself then it kind of makes sense, but if you intend this code to be at all practical, it doesn't. Decide.
    --I want some varaibles in my Animation to be private to the users and some to be public to the users. For example, I don't want the user to jack up the x, y, or delay arrays and kill the thing, nor do I want the user to jack up the ac variable. However, he can manipulate the rest. Please help me on this. Is this even possible to make public, private, or protected variables in JavaScript?
    Possible... sort of (that is, private and public members: protected members make no sense in Javascript). Advisable? No. There is a vast performance penalty associated with the method, and it lowers your users' control over your code, making it less useful.

    magicyte, you haven't made even the most basic corrections I've suggested, like fixing the name of Concatenate or taking all these miscellaneous and redundant functions out of the global scope (and, preferably, out of the code entirely). How about doing something with the suggestions I've given you before asking for more? I feel like I'm wasting my time, and I'm almost certain that I'm going to end up forgetting that I've already suggested something and repeating myself.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  9. #29
    Join Date
    Jun 2008
    Posts
    589
    Thanks
    13
    Thanked 54 Times in 54 Posts
    Blog Entries
    1

    Default

    I'm sorry. I was just making the thing to help me better understand OOP. I edited the thing again, and I have a very important thing to tell you. I use Internet Explorer 7 and when I try to make a reference for this.style = document.getElementById(el).style;, it says that there is an object error. The only way I can do it is with multiple document.getElementById(el)'s. Again, this is a simple experiment. Perhaps I should not have distributed this thing online.

    -magicyte

  10. #30
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,876
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Well, I tested that, and IE7 doesn't mind one assigning a style object to a variable or property, so I must conclude that you're doing it incorrectly.

    There's nothing wrong with getting tips on the code, but you really should have made it clearer that this code is not practical and not feasible for serious use.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

Bookmarks

Posting Permissions

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