error box
diff --git a/planetstack/core/xoslib/dashboards/test.html b/planetstack/core/xoslib/dashboards/test.html
index 9eb005a..98cc0c1 100644
--- a/planetstack/core/xoslib/dashboards/test.html
+++ b/planetstack/core/xoslib/dashboards/test.html
@@ -48,12 +48,26 @@
<div id="sliverList">
</div>
+<div id="rightSide">
+<div id="errorBox">
+</div>
+
<div id="detailBox">
<button id="close-detail-view">Close Detail View</button>
<div id="detail"></div>
<div id="linkedObjs1"></div>
<div id="linkedObjs2"></div>
</div>
+</div>
+
+<script type="text/template" id="test-error-template">
+ <button id="close-error-box">Close Error Message</button>
+ <h3>An error has occurred.</h3>
+ <table class="test-error-table">
+ <tr><td>Code:</td><td><%= status %></td></tr>
+ <tr><td>Message:</td><td><%= statusText %></td></tr>
+ </table>
+</script>
<!-- Deployment -->
diff --git a/planetstack/core/xoslib/static/css/test.css b/planetstack/core/xoslib/static/css/test.css
index 157f2a8..51b7407 100644
--- a/planetstack/core/xoslib/static/css/test.css
+++ b/planetstack/core/xoslib/static/css/test.css
@@ -2,11 +2,25 @@
border: 1px solid black;
}
-#detailBox {
+#rightSide {
position: fixed;
top: 1em;
right: 1em;
- border: 1px;
+}
+
+#detailBox {
+ padding: 10px;
+ border: 2px solid;
background-color: #f0f0f0;
+ margin-bottom:50px;
+ display:none;
+}
+
+#errorBox {
+ padding: 10px;
+ border: 2px solid;
+ background-color: #f00000;
+ margin-bottom:50px;
+ display:none;
}
diff --git a/planetstack/core/xoslib/static/js/test.js b/planetstack/core/xoslib/static/js/test.js
index 7a1106c..10626d7 100644
--- a/planetstack/core/xoslib/static/js/test.js
+++ b/planetstack/core/xoslib/static/js/test.js
@@ -32,6 +32,18 @@
},
});
+TestApp.hideError = function(result) {
+ $("#errorBox").hide();
+};
+
+TestApp.showError = function(result) {
+ $("#errorBox").show();
+ $("#errorBox").html(_.template($("#test-error-template").html())(result));
+ $('#close-error-box').unbind().bind('click', function() {
+ $('#errorBox').hide();
+ });
+};
+
TestApp.on("start", function() {
var objs = ['deployment', 'image', 'networkTemplate', 'network', 'node', 'service', 'site', 'slice', 'sliver'];
@@ -59,10 +71,16 @@
this.dirty = true;
},
+ saveError: function(model, result, xhr) {
+ TestApp.showError(result);
+ },
+
submitClicked: function(e) {
+ TestApp.hideError();
e.preventDefault();
var data = Backbone.Syphon.serialize(this);
- this.model.save(data);
+ var thisView = this;
+ this.model.save(data, {error: function(model, result, xhr) { thisView.saveError(model, result, xhr); }});
this.dirty = false;
},
});
@@ -76,6 +94,7 @@
events: {"click": "changeItem"},
changeItem: function(e) {
+ TestApp.hideError();
e.preventDefault();
e.stopPropagation();
@@ -104,11 +123,12 @@
xos[collection_name].startPolling();
}
- $('#close-detail-view').bind('click', function() {
+ $('#close-detail-view').unbind().bind('click', function() {
$('#detailBox').hide();
});
- $('#detailBox').hide();
+// $('#detailBox').hide();
+// $('#errorBox').hide();
});
$(document).ready(function(){