From b24e8a91048d46a8feee230c3dce10d4f568f8ff Mon Sep 17 00:00:00 2001
From: Rolux <rolux@Rolux.local>
Date: Wed, 27 Jan 2010 18:00:00 +0530
Subject: [PATCH] request controller

---
 build/js/ox.js      |  37 +++++
 build/js/ox.ui.js   | 395 ++++++++++++++++++++++++++++++++++----------
 demos/test/app.html |  24 +++
 3 files changed, 369 insertions(+), 87 deletions(-)
 create mode 100644 demos/test/app.html

diff --git a/build/js/ox.js b/build/js/ox.js
index cf62dc8..0d65d03 100644
--- a/build/js/ox.js
+++ b/build/js/ox.js
@@ -11,6 +11,39 @@ Core functions
 ================================================================================
 */
 
+Ox.getset = function(obj, args, callback, context) {
+    /*
+    generic getter and setter function
+    Ox.getset(obj)                                      returns obj
+    Ox.getset(obj, str)                                 returns obj.str
+    Ox.getset(obj, {key: val, ...}, callback, context)  sets obj.key to val,
+                                                        calls callback(key, val),
+                                                        returns context
+    */
+    var args = args || {},
+        callback = callback || function() {},
+        context = context || {},
+        length = args.length,
+        ret;
+    if (length == 0) {
+        // getset()
+        ret = obj;
+    } else if (length == 1 && typeof arguments[0] == "string") {
+        // getset(str)
+        ret = obj[args[0]]
+    } else {
+        // getset(str, val) or getset({str: val, ...})
+        // translate (str, val) to ({str: val})
+        args = Ox.makeObject(args);
+        obj = $.extend(obj, args);
+        $.each(args, function(k, v) {
+            callback(k, v);
+        });
+        ret = context;                            
+    }
+    return ret;
+}
+
 Ox.print = function() {
     /*
     */
@@ -523,6 +556,10 @@ Ox.getISOYear = function(date) {
     return date_.getFullYear();
 };
 
+Ox.getTime = function() {
+    return +new Date();
+}
+
 Ox.getTimezoneOffsetString = function(date) {
     /*
     Time zone offset string (-1200 - +1200)
diff --git a/build/js/ox.ui.js b/build/js/ox.ui.js
index b84692d..904c340 100644
--- a/build/js/ox.ui.js
+++ b/build/js/ox.ui.js
@@ -70,12 +70,55 @@ requires
     ----------------------------------------------------------------------------
     */
 
+    Ox.App = function() {
+        /*
+        options:
+        requestTimeout
+        requestType
+        requestURL
+        */
+        return function(options) {
+
+            options = options || {};
+            var self = {},
+                that = this;
+
+            self.options = $.extend({
+                requestTimeout: oxui.requestTimeout,
+                requestType: oxui.requestType,
+                requestURL: oxui.requestURL
+            }, options);
+
+            self.change = function() {
+                
+            };
+
+            that.launch = function() {
+                $.ajaxSetup({
+                    timeout: self.options.requestTimeout,
+                    type: self.options.requestType,
+                    url: self.options.requestURL
+                });
+            };
+
+            that.options = function() {
+                return Ox.getset(self.options, Array.slice.call(arguments), self.change, that); 
+            };
+
+            return that;
+
+        };
+
+    }();
+
     /*
     ----------------------------------------------------------------------------
     Ox.Cache
     ----------------------------------------------------------------------------
     */
 
+    // currently part of Ox.Request
+
     /*
     ----------------------------------------------------------------------------
     Ox.Event
@@ -331,6 +374,163 @@ requires
     ----------------------------------------------------------------------------
     */
 
+    /*
+    ----------------------------------------------------------------------------
+    Ox.Request
+    ----------------------------------------------------------------------------
+    */
+
+    Ox.Request = function() {
+
+        var cache = {},
+            pending = {},
+            requests = {},
+            self = {
+                options: {
+                    timeout: 15000,
+                    type: "POST",
+                    url: "api"
+                }
+            };
+
+        return {
+
+            cancel: function() {
+                var index;
+                if (arguments.length == 0) {
+                    requests = {};
+                } else if (Ox.isFunction(arguments[0])) {
+                    // cancel with function
+                    $.each(requests, function(id, req) {
+                        if (arguments[0](req)) {
+                            delete requests[id];
+                        }
+                    })
+                } else {
+                    // cancel by id
+                    delete requests[arguments[0]]
+                }
+            },
+
+            options: function(options) {
+                return Ox.getset(self.options, options, $.noop(), this)
+            },
+
+            send: function(options) {
+
+                options = $.extend({
+                    age: -1,
+                    callback: function() {},
+                    id: Ox.uid(),
+                    timeout: self.options.timeout,
+                    type: self.options.type,
+                    url: self.options.url
+                }, options);
+
+                var req = JSON.stringify({
+                        url: options.url,
+                        data: options.data
+                    });
+
+                function callback(data, callback) {
+                    delete requests[options.id];
+                    callback(data);
+                }
+
+                function error(request, status, error) {
+                    var $dialog = new Ox.Dialog({
+                                title: "Error: Remote request failed.",
+                                buttons: [
+                                    new Ox.Button({
+                                        value: "Details",
+                                        click: function() {
+                                            var $iframe = $("<iframe>"),
+                                            iframe = $iframe[0].contentWindow;
+                                            iframe.document.open();
+                                            iframe.document.write(xhr.responseText);
+                                            iframe.document.close();
+                                            $dialog.close();
+                                            $dialog = new Ox.Dialog({
+                                                    title: "Error: Remote request failed.",
+                                                    buttons: [
+                                                        new Ox.Button({
+                                                            value: "Close",
+                                                            click: function() {
+                                                                $dialog.close();
+                                                            }
+                                                        })
+                                                    ],
+                                                    width: 800,
+                                                    height: 400
+                                                })
+                                                .append($iframe)
+                                                .open();
+                                        }
+                                    }),
+                                    new Ox.Button({
+                                        value: "Close",
+                                        click: function() {
+                                            $dialog.close();
+                                        }
+                                    })
+                                ]
+                            })
+                            .append(request.status + " " + request.statusText)
+                            .open();
+                    Ox.print({
+                        request: request,
+                        status: status,
+                        error: error
+                    });
+                    pending[options.id] = false;
+                }
+
+                function success(data) {
+                    pending[options.id] = false;
+                    try {
+                        data = JSON.parse(data);                                    
+                    } catch(error) {
+
+                    }
+                    cache[req] = {
+                        data: data,
+                        time: Ox.getTime()
+                    };
+                    callback(data, options.callback);
+                }
+
+                if (pending[options.id]) {
+                    setTimeout(function() {
+                        Ox.Request.send(options);
+                    }, 0);
+                } else {
+                    requests[options.id] = {
+                        url: options.url,
+                        data: options.data
+                    };
+                    if (cache[req] && (options.age == -1 || options.age > Ox.getTime() - cache[req].time)) {
+                        setTimeout(function() {
+                            callback(options.id, cache[req].data, callback);
+                        }, 0);
+                    } else {
+                        pending[options.id] = true;
+                        $.ajax({
+                            data: options.data,
+                            error: error,
+                            success: success,
+                            timeout: options.timeout,
+                            type: options.type,
+                            url: options.url
+                        });
+                    }
+                }
+                return options.id;
+            }
+
+        };
+    }();
+
+
     /*
     ----------------------------------------------------------------------------
     Ox.URL
@@ -769,6 +969,95 @@ requires
         return that;
     };
 
+    /*
+    ============================================================================
+    Dialog
+    ============================================================================
+    */
+
+    Ox.Dialog = function(options, self) {
+        var self = self || {},
+            options = $.extend({
+                title: "",
+                buttons: [],
+                width: 256,
+                height: 128
+            }, options),
+            that = new Ox.Element()
+                .addClass("OxDialog")
+                .css({
+                    left: (($(document).width() - options.width) / 2) + "px",
+                    top: (($(document).height() - options.height - 48) / 2) + "px",
+                    width: options.width + "px",
+                    height: (options.height + 48) + "px"
+                });
+        that.$titlebar = new Ox.Element()
+            .addClass("OxTitleBar")
+            .html(options.title)
+            .mousedown(function(e) {
+                var offset = that.offset(),
+                    //maxLeft = $(document).width() - that.width(),
+                    //maxTop = $(document).height() - that.height(),
+                    x = e.clientX,
+                    y = e.clientY,
+                    documentWidth = $(document).width();
+                    documentHeight = $(document).height();
+                $(window).mousemove(function(e) {
+                    var left = Ox.constrain(offset.left - x + e.clientX, 24 - options.width, documentWidth - 24),
+                        top = Ox.constrain(offset.top - y + e.clientY, -24 - options.height, documentHeight - 24);
+                    that.css({
+                        left: left + "px",
+                        top: top + "px"
+                    });
+                });
+                $(window).one("mouseup", function() {
+                    $(window).unbind("mousemove");
+                });
+            })
+            .appendTo(that);
+        that.$content = new Ox.Container()
+            .addClass("OxContent")
+            .css({
+                height: options.height + "px"
+            })
+            .appendTo(that);
+        that.$buttonsbar = new Ox.Element()
+            .addClass("OxButtonsBar")
+            .appendTo(that);
+        //that.$buttons = [];
+        $.each(options.buttons, function(i, v) {
+            v.appendTo(that.$buttonsbar);
+        });
+        options.buttons[0].focus();
+        that.$layer = $(".OxLayer"); // fixme: lazy loading of layer is fine, but save in var, dont look up
+        that.append = function($element) {
+            that.$content.append($element);
+            return that;
+        }
+        that.close = function() {
+            that.animate({
+                opacity: 0
+            }, 200, function() {
+                that.remove();
+                that.$layer.remove();
+            })
+        }
+        that.open = function() {
+            if (!that.$layer.length) {
+                that.$layer = new Ox.Element()
+                    .addClass("OxLayer")
+                    .appendTo($("body"));
+            }
+            that.css({
+                opacity: 0
+            }).appendTo(that.$layer).animate({
+                opacity: 1
+            }, 200);
+            return that;
+        }
+        return that;
+    }
+
     /*
     ============================================================================
     Forms
@@ -1193,93 +1482,6 @@ requires
 
     };
 
-    /*
-    ----------------------------------------------------------------------------
-    Ox.Dialog
-    ----------------------------------------------------------------------------
-    */
-    Ox.Dialog = function(options) {
-		var options = $.extend({
-				title: "",
-				buttons: [],
-				width: 256,
-				height: 128
-			}, options),
-			that = new Ox.Element()
-				.addClass("OxDialog")
-				.css({
-					left: (($(document).width() - options.width) / 2) + "px",
-					top: (($(document).height() - options.height - 48) / 2) + "px",
-					width: options.width + "px",
-					height: (options.height + 48) + "px"
-				});
-		that.$titlebar = new Ox.Element()
-			.addClass("OxTitleBar")
-			.html(options.title)
-			.mousedown(function(e) {
-				var offset = that.offset(),
-					//maxLeft = $(document).width() - that.width(),
-					//maxTop = $(document).height() - that.height(),
-					x = e.clientX,
-					y = e.clientY,
-					documentWidth = $(document).width();
-					documentHeight = $(document).height();
-				$(window).mousemove(function(e) {
-					var left = Ox.constrain(offset.left - x + e.clientX, 24 - options.width, documentWidth - 24),
-						top = Ox.constrain(offset.top - y + e.clientY, -24 - options.height, documentHeight - 24);
-					that.css({
-						left: left + "px",
-						top: top + "px"
-					});
-				});
-				$(window).one("mouseup", function() {
-					$(window).unbind("mousemove");
-				});
-			})
-			.appendTo(that);
-		that.$content = new Ox.Container()
-			.addClass("OxContent")
-			.css({
-				height: options.height + "px"
-			})
-			.appendTo(that);
-		that.$buttonsbar = new Ox.Element()
-			.addClass("OxButtonsBar")
-			.appendTo(that);
-		//that.$buttons = [];
-		$.each(options.buttons, function(i, v) {
-			v.appendTo(that.$buttonsbar);
-		});
-		options.buttons[0].focus();
-		that.$layer = $(".OxLayer"); // fixme: lazy loading of layer is fine, but save in var, dont look up
-		that.append = function($element) {
-			that.$content.append($element);
-			return that;
-		}
-		that.close = function() {
-			that.animate({
-				opacity: 0
-			}, 200, function() {
-				that.remove();
-				that.$layer.remove();
-			})
-		}
-		that.open = function() {
-			if (!that.$layer.length) {
-				that.$layer = new Ox.Element()
-					.addClass("OxLayer")
-					.appendTo($("body"));
-			}
-			that.css({
-				opacity: 0
-			}).appendTo(that.$layer).animate({
-				opacity: 1
-			}, 200);
-			return that;
-		}
-		return that;
-	}
-
     /*
     ============================================================================
     Panels
@@ -1442,3 +1644,22 @@ requires
     };
 
 })();
+
+/*
+============================================================================
+Requests
+============================================================================
+*/
+
+/*
+----------------------------------------------------------------------------
+Ox.Progressbar
+----------------------------------------------------------------------------
+*/
+
+/*
+----------------------------------------------------------------------------
+Ox.Spinner
+----------------------------------------------------------------------------
+*/
+
diff --git a/demos/test/app.html b/demos/test/app.html
new file mode 100644
index 0000000..2b1105b
--- /dev/null
+++ b/demos/test/app.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <script type="text/javascript" src="../../build/js/jquery-1.4.js"></script>
+        <script type="text/javascript" src="../../build/js/ox.js"></script>
+        <script type="text/javascript" src="../../build/js/ox.ui.js"></script>
+        <script type="text/javascript">
+            $(function() {
+                var app = new Ox.App().launch();
+                Ox.Request.send({
+                    url: "http://blackbook.local:8000/api/",
+                    data: {
+                        "function": "hello",
+                        data: JSON.stringify({key: "value"})
+                    },
+                    callback: function(data) {
+                        console.log(data);
+                    }
+                });
+            });
+        </script>
+    </head>
+    <body></body>
+</html>
\ No newline at end of file