Bionic Works » jQuery http://www.bionicworks.com Paid in Bacon Sun, 05 Feb 2012 20:27:59 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 Balls Deep With HTML5 Canvas http://www.bionicworks.com/contest/balls-deep-with-html5-canvas http://www.bionicworks.com/contest/balls-deep-with-html5-canvas#comments Mon, 06 Dec 2010 07:40:32 +0000 Thai http://www.bionicworks.com/?p=2129 Read the rest of this entry »

]]>

The idea of HTML5′s reach across many mobile devices has really got me thinking about mobile games through the browser. While researching I found that Spil Games was offering a monthly HTML5 contest and first place is $5000 bucks. Such a great way to inspire web developers to get their creative juices going. Given that the state of HTML5 is fairly new, there seems to be a lack of resources and libraries. I found canvasdemos.com to be super helpful.

It’s very hard not to compare Actionscript’s mature handling of graphical assets when I was messing with canvas. What HTML5 needs is a robust library to glue everything together. Right now everything seems so scattered and not so refined. But it won’t stop me from investigating the potential of canvas. Check out my demo. It doesn’t have real collision detection yet and this is only a little test on generating objects.

]]> http://www.bionicworks.com/contest/balls-deep-with-html5-canvas/feed 2 Rotate Header Based on Time of Day http://www.bionicworks.com/javascript/rotate-header-based-on-time-of-day http://www.bionicworks.com/javascript/rotate-header-based-on-time-of-day#comments Wed, 17 Mar 2010 05:55:24 +0000 Thai http://www.bionicworks.com/?p=1435 Read the rest of this entry »

]]> I made this because I’ve seen a php tutorial on NETTUTS that’s pretty cool and thought of a client side version just for the hell of it. It basically changes the header based on the time of day it is. You can use it to change your site’s logo too. The script is insanely simple and didn’t really need commenting. There’s a default class so that if the user decides to turn off Javascript, it’ll fall back to your default image.

$(document).ready(function(){
        //create date object and get the time
        var date = new Date();
        var time = date.getHours();
       
        var noon = 12;
        var midnight = 24;
        var dinner = 18;

        //cache the header div
        var header = $("#header");
       
        if(time < noon ){
                header.removeClass("default").addClass("morning");
        }else if(time <= midnight && time >= dinner){
                header.removeClass("default").addClass("night");
        }else{
                header.removeClass("default").addClass("noon");
       
        }
});//closing tag for jQuery contructor

]]> http://www.bionicworks.com/javascript/rotate-header-based-on-time-of-day/feed 0 Parse XML with jQuery http://www.bionicworks.com/javascript/parse-xml-with-jquery http://www.bionicworks.com/javascript/parse-xml-with-jquery#comments Mon, 15 Mar 2010 04:37:38 +0000 Thai http://www.bionicworks.com/?p=1421 Read the rest of this entry »

]]> This little snippet will parse XML and format any way you like. It’s as simple as using jQuery’s .each() method and then appending it to a div. If you’re trying to parse a RSS feed then I suggest using jFeed.

$(document).ready(function(){
        $.ajax({
                type: "GET",
                url: "info.xml",
                dataType: "xml",
                success: parseXML
        });
         
        function parseXML(xml){
        //find "book" nodes and use jQuery’s for each method to get strings
                $(xml).find("book").each(function(){
                        //store nodes in vars
                        var title = $(this).find("title");
                        var author = $(this).find("author");
                        var isbn = $(this).attr("isbn");
                        //add the strings in the output div
                        $("#output").append(title.text() + "<br />");  
                        $("#output").append(author.text() + "<br />");
                        $("#output").append(isbn + "<br />");
                });
        }  
});

These are books that I’ve read over and over so I recommend them.

<?xml version="1.0" encoding="utf-8"?>
<library>
  <book isbn="0765347415">
        <title>Terminator vs Godzilla</title>
        <author>John Connor</author>
        <published>1/13/2009</published>
  </book>
    <book isbn="0983746513">
        <title>Olives and Beer</title>
        <author>Long Dong</author>
        <published>12/28/2010</published>
  </book>
    <book isbn="0037616351">
        <title>Froyo</title>
        <author>Tutti Frutti</author>
        <published>3/13/2010</published>
  </book>
</library>
]]> http://www.bionicworks.com/javascript/parse-xml-with-jquery/feed 0