Back to Getting Started / Beginners - Yahoo! TV Widgets Forum
0

XMLHTTPREQUEST Login

Hello everyone

I'm just a beginners of Yahoo TV Widget,

Can anyone give me a simple example of Kontx.dialog.Login using XMLHttpRequest to get data from localhost

By the way, does it supports to fetch a file.php on localhost

Thanks!

by
Report Abuse
4 Replies
  • QUOTE (zhuyinan1988 @ Oct 11 2010, 12:47 AM) <{POST_SNAPBACK}>
    Hello everyone

    I'm just a beginners of Yahoo TV Widget,

    Can anyone give me a simple example of Kontx.dialog.Login using XMLHttpRequest to get data from localhost

    By the way, does it supports to fetch a file.php on localhost

    Thanks!

    Hi,
    This is a bare-bones script, so keep this in mind, but it gives you an outline as to how this is accomplished. The language of your web service is up to you.

    CODE
    //best practice says to put all API calls in a separate file;
    var API = (function () {
      return {
        //other methods here;

        fetch: function (o) {
            var xhr = new XMLHttpRequest();
            xhr.open("POST", "http://www.example.com/check.php", true);

            var params = "username=" + encodeURIComponent(o.username) + "&password=" + encodeURIComponent(o.password);
            xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            xhr.setRequestHeader("Content-length", params.length);

            xhr.onreadystatechange = function () {
                    if (xhr.readyState === 4) {
                            if (xhr.status === 200) {
                                    var json = JSON.parse(xhr.responseText);

                                    //note the composition of your object is up to you, mine had a status property;
                                    if (json.status) {
                                            //login successful, do something here;
                                    } else {
                                            new KONtx.dialogs.Alert({
                                                    title: "Login unsuccessful",
                                                    message: "You are not allowed access!",
                                                    buttons: [
                                                            { label: "OK" }
                                                    ]
                                            }).show();
                                    }
                            }
                    }
            };
            xhr.send(params);
        }
      };
    }());

    var Home = new KONtx.Class({
            ClassName: "Home",

            Extends: KONtx.system.SidebarView,

            createView: function() {
            },

            focusView: function() {
            },

            updateView: function() {

                    new KONtx.dialogs.Login({
                            title: "Login",
                            message: "Please enter your credentials",
                            callback: function (event) {
                                    API.fetch(event);
                            },
                            cancelCallback: function () {
                                    log("+++++++++++++++++++++++++++++++++++++++++++");
                                    log("login canceled!");
                                    log("+++++++++++++++++++++++++++++++++++++++++++");
                            }
                    }).show();

            }

    });


    - Ben
    Report Abuse
    0
  • You might want to look at the URL() object. It has built in support for Post values without needing to supply the header values.

    Something like:
    CODE
    var req = new URL();
    req.location = "http://www.url.com";
    req.postData = "&value1="+escape(mydata1)+"&valuename="+escape(mydata2)
    req.fetchAsync(dddone_function);


    Hope this helps.
    Report Abuse
    0
  • OK so in reading one more time through the documentation, the best thing to make it completely event driven is to listen in on when the message center variable I set (i.e - "channels") gets updated, and when it does to update the view.

    Anybody got any good examples on how to make that happen?
    Report Abuse
    0
  • QUOTE (krmacode @ Feb 22 2011, 07:33 PM) <{POST_SNAPBACK}>
    OK so in reading one more time through the documentation, the best thing to make it completely event driven is to listen in on when the message center variable I set (i.e - "channels") gets updated, and when it does to update the view.

    Anybody got any good examples on how to make that happen?

    This really should be its own topic. Please create a new topic next time.

    This contains a small code snippet that shows how a view can register a listener on the view that will listen for a message center broadcast. It's basically just a method bound to the view that takes a callback as its only parameter. This callback (_dispatcher in the example) inspects the payload key, making sure it's the same key that was used to store the information. Then, you can update a grid, as in that example.

    Any time data is stored or removed in the message center an event is broadcast that any subscribers will receive. For example:

    CODE
    KONtx.messages.store("vids", json.videos);


    Any function or method can subscribe to the message center:

    CODE
    myFunction.subscribeTo(KONtx.messages, KONtx.messages.eventType, myFunction);

    or

    (function (event) {
          if (event.payload.key === "vids") { 
                //this is the expected payload, so do something;
          }
    }).subscribeTo(KONtx.messages, KONtx.messages.eventType, this);


    Note that while knowing when something is stored in the message center is cool, you can just use it for storage and then fetch it later when needed:

    CODE
    //pseudo-code;
    onApplicationStartup: function () {
        KONtx.messages.store("vids", json.videos);
    };

    //in a view;
    updateView: function () {
        var myVids = KONtx.messages.fetch("vids");
    };


    Hope that helps.
    Report Abuse
    0
Ask a Question

Recent Posts

in Getting Started / Beginners - Yahoo! TV Widgets