requests, errors, dialogs
This commit is contained in:
Rolux
parent
68a09563cb
commit
06852ed89c
3 changed files with 96 additions and 69 deletions
|
|
@ -95,16 +95,16 @@ Dialog
|
|||
|
||||
.OxDialog > .OxContent {
|
||||
top: 24px;
|
||||
//bottom: 32px;
|
||||
height: 100%;
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.OxDialog > .OxButtonsBar {
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
bottom: 0px;
|
||||
height: 24px;
|
||||
padding: 8px;
|
||||
height: 32px;
|
||||
padding: 0 4px 0 4px;
|
||||
text-align: right;
|
||||
-moz-border-radius-bottomleft: 8px;
|
||||
-moz-border-radius-bottomright: 8px;
|
||||
|
|
@ -112,6 +112,10 @@ Dialog
|
|||
-webkit-border-bottom-right-radius: 8px;
|
||||
}
|
||||
|
||||
.OxDialog > .OxButtonsBar > .OxButton {
|
||||
margin: 8px 4px 0 4px;
|
||||
}
|
||||
|
||||
/*
|
||||
================================================================================
|
||||
Forms
|
||||
|
|
|
|||
|
|
@ -448,8 +448,36 @@ requires
|
|||
callback(data);
|
||||
}
|
||||
|
||||
function debug(request) {
|
||||
var $iframe = $("<iframe>")
|
||||
.css({ // fixme: should go into a class
|
||||
width: 768,
|
||||
height: 384
|
||||
}),
|
||||
$dialog = new Ox.Dialog({
|
||||
title: "Application Error",
|
||||
buttons: [
|
||||
{
|
||||
value: "Close",
|
||||
click: function() {
|
||||
$dialog.close();
|
||||
}
|
||||
}
|
||||
],
|
||||
width: 800,
|
||||
height: 400
|
||||
})
|
||||
.append($iframe)
|
||||
.open(),
|
||||
iframe = $iframe[0].contentDocument || $iframe[0].contentWindow.document;
|
||||
iframe.open();
|
||||
iframe.write(request.responseText);
|
||||
iframe.close();
|
||||
}
|
||||
|
||||
function error(request, status, error) {
|
||||
var result;
|
||||
console.log("error", request, status, error);
|
||||
try {
|
||||
result = JSON.parse(request.responseText);
|
||||
} catch(e) {
|
||||
|
|
@ -463,44 +491,28 @@ requires
|
|||
options.callback(result);
|
||||
if (result.status.code >= 500) {
|
||||
var $dialog = new Ox.Dialog({
|
||||
title: "Error: Remote request failed.",
|
||||
buttons: [
|
||||
new Ox.Button({
|
||||
value: "Details",
|
||||
click: function() {
|
||||
var $iframe = $("<iframe>");
|
||||
var iframe = $iframe[0].contentWindow;
|
||||
iframe.document.open();
|
||||
iframe.document.write(request.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();
|
||||
title: "Application Error",
|
||||
buttons: [
|
||||
{
|
||||
value: "Details",
|
||||
click: function() {
|
||||
$dialog.close(function() {
|
||||
debug(request);
|
||||
});
|
||||
}
|
||||
},
|
||||
{
|
||||
value: "Close",
|
||||
click: function() {
|
||||
$dialog.close();
|
||||
}
|
||||
}
|
||||
],
|
||||
width: 400,
|
||||
height: 100
|
||||
})
|
||||
.append(request.status + " " + request.statusText)
|
||||
.open();
|
||||
Ox.print({
|
||||
request: request,
|
||||
status: status,
|
||||
|
|
@ -516,7 +528,13 @@ requires
|
|||
try {
|
||||
data = JSON.parse(data);
|
||||
} catch(error) {
|
||||
|
||||
data = {
|
||||
status: {
|
||||
code: 500,
|
||||
text: "Internal Server Error"
|
||||
},
|
||||
data: {}
|
||||
};
|
||||
}
|
||||
cache[req] = {
|
||||
data: data,
|
||||
|
|
@ -1013,9 +1031,9 @@ requires
|
|||
.addClass("OxDialog")
|
||||
.css({
|
||||
left: (($(document).width() - options.width) / 2) + "px",
|
||||
top: (($(document).height() - options.height - 48) / 2) + "px",
|
||||
top: (($(document).height() - options.height - 92) / 2) + "px",
|
||||
width: options.width + "px",
|
||||
height: (options.height + 60) + "px"
|
||||
height: (options.height + 92) + "px"
|
||||
});
|
||||
that.$titlebar = new Ox.Bar({
|
||||
size: "medium"
|
||||
|
|
@ -1059,13 +1077,16 @@ requires
|
|||
that.$buttonsbar = new Ox.Element()
|
||||
.addClass("OxButtonsBar")
|
||||
.appendTo(that);
|
||||
//that.$buttons = [];
|
||||
$.each(options.buttons, function(i, v) {
|
||||
v.appendTo(that.$buttonsbar);
|
||||
that.$buttons = [];
|
||||
$.each(options.buttons, function(i, button) {
|
||||
console.log(button)
|
||||
that.$buttons[i] = new Ox.Button({
|
||||
size: "medium",
|
||||
value: button.value
|
||||
}).click(button.click).appendTo(that.$buttonsbar);
|
||||
});
|
||||
options.buttons[0].focus();
|
||||
that.$buttons[0].focus();
|
||||
that.$layer = $(".OxLayer"); // fixme: lazy loading of layer is fine, but save in var, dont look up
|
||||
that.$buttons = options.buttons; // fixme: publicy accessible buttons, or dialog methods for manipulation?
|
||||
self.onChange = function(key, value) {
|
||||
if (key == "title") {
|
||||
that.$title.html(value);
|
||||
|
|
@ -1075,12 +1096,14 @@ requires
|
|||
that.$content.append($element);
|
||||
return that;
|
||||
}
|
||||
that.close = function() {
|
||||
that.close = function(callback) {
|
||||
callback = callback || function() {};
|
||||
that.animate({
|
||||
opacity: 0
|
||||
}, 200, function() {
|
||||
that.remove();
|
||||
that.$layer.remove();
|
||||
callback();
|
||||
})
|
||||
}
|
||||
that.open = function() {
|
||||
|
|
|
|||
|
|
@ -3,24 +3,24 @@ $(function() {
|
|||
requestURL: "http://blackbook.local:8000/api/"
|
||||
}),
|
||||
$dialog = new Ox.Dialog({
|
||||
title: "Login failed",
|
||||
title: "Application Error",
|
||||
buttons: [
|
||||
new Ox.Button({
|
||||
size: "medium",
|
||||
value: "Change Title"
|
||||
}).click(function() {
|
||||
console.log("click to change title")
|
||||
$dialog.options({
|
||||
title: "New Title"
|
||||
});
|
||||
$dialog.$buttons[0].toggleDisabled();
|
||||
}),
|
||||
new Ox.Button({
|
||||
size: "medium",
|
||||
{
|
||||
value: "Change Title",
|
||||
click: function() {
|
||||
console.log("click to change title")
|
||||
$dialog.options({
|
||||
title: "New Title"
|
||||
});
|
||||
$dialog.$buttons[0].toggleDisabled();
|
||||
}
|
||||
},
|
||||
{
|
||||
value: "Close",
|
||||
}).click(function() {
|
||||
$dialog.close();
|
||||
})
|
||||
click: function() {
|
||||
$dialog.close();
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
app.request("error");
|
||||
|
|
@ -34,9 +34,9 @@ $(function() {
|
|||
});
|
||||
}
|
||||
else if (result.status.code == 403) {
|
||||
$dialog.open();
|
||||
} else {
|
||||
Ox.print("broken");
|
||||
alert(403);
|
||||
//$dialog.open();
|
||||
} else if (result.status.code == 500) {
|
||||
}
|
||||
});
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in a new issue