Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Layout almost finalized now.

Saving complete POST and PUT requests with proper "params" and "raw" handling.
  • Loading branch information...
commit 97e6484c821e39f605b5c4afc8553a4e9e2468a1 1 parent 17f5ab7
Abhinav authored
View
2  NOTICE
@@ -1,2 +1,2 @@
-POSTMan
+POSTMan
Copyright 2011 Abhinav Asthana
View
43 simple-rest-client/improved_style.css
@@ -1,11 +1,8 @@
html, body {
- background: #eaeaea;
- height: 100%;
margin-top: 0;
margin-left: 0;
- width: 100%;
- height: 100%;
font-family: Helvetica, Arial, sans-serif;
+ min-height: 800px;
}
header {
@@ -17,7 +14,7 @@ header {
border-bottom-style: solid;
border-bottom-color: #116284;
border-bottom-width: 5px;
- height: 70px;
+ height: 50px;
width: 100%;
}
@@ -171,7 +168,8 @@ fieldset {
}
#logo {
- padding: 20px;
+ padding: 12px;
+ padding-left: 15px;
float: left
}
@@ -361,8 +359,8 @@ fieldset {
#credits {
float: right;
- margin-right: 20px;
- margin-top: 35px;
+ margin-right: 10px;
+ margin-top: 18px;
color: #fff;
font-weight: bold;
font-size: 10px;
@@ -411,8 +409,8 @@ li .right {
#main {
background: #fff;
- margin-left: 350px;
- height: 100%;
+ float: left;
+ padding-bottom: 20px;
}
#main-scroller {
@@ -423,13 +421,12 @@ li .right {
width: 340px;
padding-left: 10px;
background: #eaeaea;
+ overflow-y: scroll;
+ height: 100%;
}
#container {
- padding-right: 0px;
- padding-left: 0px;
- background: #eaeaea;
- height: 100%;
+ height: 100%
}
#request,
@@ -507,14 +504,18 @@ li .right {
-webkit-box-shadow:inset 1px 1px 0 rgba(255,255,255,0.5);
}
-.headersContainer {
- width: 580px;
+.sendRequestButtonContainer {
+ margin-top: 25px;
}
-.editHeaderButton {
- margin-left: -5px;
- margin-bottom: 5px;
+
+#headers-ParamsEditor {
+ margin-top: 15px;
}
-.sendRequestButtonContainer {
- margin-top: 25px;
+#requestUrl {
+ margin-bottom: 10px;
+}
+
+#pheaders {
+ margin-bottom: 10px;
}
View
80 simple-rest-client/index.html
@@ -42,7 +42,7 @@
<body>
<header>
<div id="logo" class="clearfix">
- <img src="images/postman.jpg" alt="POSTMAN"/>
+ <img src="images/postman.jpg" alt="POSTMAN" height="18px"/>
<span class="smallheadertext"> A better HTTP client to test web services</span>
</div>
<div id="credits">
@@ -51,9 +51,9 @@
<a href="http://twitter.com/sobtiankit" target="_blank">@sobtiankit</a>
</div>
</header>
-<div id="container" class="container-fluid">
- <div id="history" class="sidebar clearfix">
- <div id="historyContainer">
+<div id="container" class="clearfix">
+ <div id="history" class="clearfix">
+ <div id="historyContainer" class="clearfix">
<ul class="pills" data-tabs="tabs">
<li class="active"><a href="javascript:void(0);">History</a></li>
<li><a href="javascript:void(0);">Collections</a></li>
@@ -62,21 +62,18 @@
</ul>
</div>
</div>
- <div id="main" class="clearfix content">
- <div id="main-scroller">
+ <div id="main" class="content">
<section id="request">
<h2><img src="images/request.jpg" alt="REQUEST" height="15px"/></h2>
- <div id="requestUrl">
- <div class="row" style="height: 50px;">
- <div class="span10">
- <input type="text" name="url" id="url" tabindex="1" class="inputText" placeholder="URL">
- </div>
- <div class="span2">
- <span class="buttonLayout">
- <a href="javascript:void(0);" class="btn small"
- onclick="showParamsEditor('url')">Edit params</a></span>
- </div>
+ <div id="requestUrl" class="row clearfix">
+ <div class="span10">
+ <input type="text" name="url" id="url" tabindex="1" class="inputText" placeholder="URL">
+ </div>
+ <div class="span2">
+ <span class="buttonLayout">
+ <a href="javascript:void(0);" class="btn small"
+ onclick="showParamsEditor('url')">Edit params</a></span>
</div>
</div>
@@ -93,60 +90,60 @@
</div>
<div id="methods" class="clearfix">
- <ul class="pills small" style="margin-bottom: 10px;">
- <li class="active"><a id="method-get" href="javascript:void(0);" data-method="get"
+ <ul class="method-selectors pills small" style="margin-bottom: 10px;">
+ <li class="method-selector-get active"><a id="method-get" href="javascript:void(0);" data-method="get"
onclick="showRequestMethodUi('GET');">GET</a></li>
- <li><a id="method-post" href="javascript:void(0);" data-method="post"
+ <li class="method-selector-post"><a id="method-post" href="javascript:void(0);" data-method="post"
onclick="showRequestMethodUi('POST');">POST</a></li>
- <li><a id="method-put" href="javascript:void(0);" data-method="put"
+ <li class="method-selector-put"><a id="method-put" href="javascript:void(0);" data-method="put"
onclick="showRequestMethodUi('PUT');">PUT</a></li>
- <li><a id="method-delete" href="javascript:void(0);" data-method="delete"
+ <li class="method-selector-delete"><a id="method-delete" href="javascript:void(0);" data-method="delete"
onclick="showRequestMethodUi('DELETE');">DELETE</a></li>
- <li><a id="method-head" href="javascript:void(0);" data-method="head"
+ <li class="method-selector-head"><a id="method-head" href="javascript:void(0);" data-method="head"
onclick="showRequestMethodUi('HEAD');">HEAD</a></li>
- <li><a id="method-options" href="javascript:void(0);" data-method="options"
+ <li class="method-selector-options"><a id="method-options" href="javascript:void(0);" data-method="options"
onclick="showRequestMethodUi('OPTIONS');">OPTIONS</a></li>
</ul>
</div>
- <div id="pheaders">
- <div class="headersContainer">
+ <div id="pheaders" class="row clearfix">
+ <div class="span10 headersContainer">
<textarea name="headers" id="headers" tabindex="3" class="inputText"
placeholder="Headers"></textarea>
</div>
- <div class="editHeaderButton">
- <a href="javascript:void(0);" class="btn small" onclick="showParamsEditor('headers')"
- style="margin-left:5px">Edit headers</a>
+ <div class="span2 editHeaderButton">
+ <a href="javascript:void(0);" class="btn small" onclick="showParamsEditor('headers')">Edit headers</a>
</div>
-
</div>
- <div id="headers-ParamsEditor" class="paramsEditor">
- <div id="headers-ParamsFields" class="editorFields"></div>
- <div id="headers-ParamsEditorActions" class="actions">
- <input type="button" id="cancelHeaderParamsButton" name="closeBodyParams" value="Save and close"
- class="btn primary medium"
- onclick="closeParamsEditor('headers')"/>
+ <div class="row">
+ <div id="headers-ParamsEditor" class="span10 paramsEditor">
+ <div id="headers-ParamsFields" class="editorFields"></div>
+ <div id="headers-ParamsEditorActions" class="actions">
+ <input type="button" id="cancelHeaderParamsButton" name="closeBodyParams"
+ value="Save and close"
+ class="btn primary medium"
+ onclick="closeParamsEditor('headers')"/>
+ </div>
</div>
</div>
<div id="data">
<ul class="pills small" style="margin-bottom: 0px; height: 38px;">
- <li class="active">
+ <li id="selector-container-params" class="active">
<a href="javascript:void(0);" onclick="showBodyParamsEditor()" id="data-params">Params</a>
</li>
- <li>
+ <li id="selector-container-raw">
<a href="javascript:void(0);" onclick="showRawEditor()" id="data-raw">Raw body</a>
</li>
</ul>
<div id="bodyDataContainer">
<textarea name="data" id="body" tabindex="4" class="inputText"></textarea>
</div>
- </div>
-
- <div id="body-ParamsEditor" class="paramsEditor">
- <div id="body-ParamsFields" class="editorFields"></div>
+ <div id="body-ParamsEditor" class="paramsEditor">
+ <div id="body-ParamsFields" class="editorFields"></div>
+ </div>
</div>
<div class="sendRequestButtonContainer">
@@ -199,7 +196,6 @@
</div>
</fieldset>
</section>
- </div>
</div>
</div>
</body>
View
52 simple-rest-client/requester.js
@@ -88,6 +88,16 @@ var indexedDB = window.indexedDB || // Use the standard DB API
var IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction;
var IDBKeyRange = window.IDBKeyRange || window.webkitIDBKeyRange;
+function Request() {
+ this.id = "";
+ this.url = "";
+ this.method = "";
+ this.headers = "";
+ this.data = "";
+ this.dataMode = "params";
+ this.timestamp = 0;
+}
+
function clearFields() {
$("#response").css("display", "");
$("#loader").css("display", "");
@@ -198,6 +208,8 @@ function sendRequest() {
}
}
});
+
+ data = $('#body').val();
}
//Check if a file is being sent
@@ -208,7 +220,7 @@ function sendRequest() {
requestStartTime = new Date().getTime();
- saveRequest(url, method, $("#headers").val(), data);
+ saveRequest(url, method, $("#headers").val(), data, dataMode);
$('#submitRequest').button("loading");
}
@@ -366,7 +378,7 @@ function setupDB() {
request.onfailure = postman.indexedDB.onerror;
};
- postman.indexedDB.addRequest = function(id, url, method, headers, data) {
+ postman.indexedDB.addRequest = function(id, url, method, headers, data, dataMode) {
console.log("Saving request to indexed DB");
var db = postman.indexedDB.db;
@@ -379,6 +391,7 @@ function setupDB() {
"method": method.toString(),
"headers": headers.toString(),
"data": data.toString(),
+ "dataMode": dataMode.toString(),
"timestamp": new Date().getTime()
});
@@ -467,9 +480,9 @@ function initDB() {
}
//History management functions
-function saveRequest(url, method, headers, data) {
+function saveRequest(url, method, headers, data, dataMode) {
var id = guid();
- postman.indexedDB.addRequest(id, url, method, headers, data);
+ postman.indexedDB.addRequest(id, url, method, headers, data, dataMode);
}
function renderRequestToSidebar(url, method, id, position) {
@@ -518,15 +531,25 @@ function loadRequestInEditor(request) {
$('#urlParamsEditor').css("display", "none");
$('#response').css("display", "none");
- closeParamsEditor("body");
- $('#body').val("")
-
if (method === 'post' || method === 'put') {
- $('#data').val(request.data);
+ var dataMode = request.dataMode.toLowerCase();
+
$('#data').css("display", "block");
- showBodyParamsEditor();
+ $('#body').val(request.data);
+ $('#body').css("display", "block");
+
+ $('#data .pills li').removeClass("active");
+ if(dataMode == 'params') {
+ $('#selector-container-params').addClass("active");
+ showParamsEditor("body");
+ }
+ else if (dataMode == 'raw') {
+ $('#selector-container-raw').addClass("active");
+ closeParamsEditor("body");
+ }
}
else {
+ $('#body').val("")
$('#data').css("display", "none");
closeParamsEditor("body");
}
@@ -740,12 +763,8 @@ function removeBodyListeners() {
}
function setContainerHeights() {
- var mainHeight = $('#main-scroller').height();
- var historyHeight = $('#history').height();
-
- var maxHeight = mainHeight > historyHeight ? mainHeight : historyHeight;
var docHeight = $(document).height();
- $('#history').height(maxHeight + "px");
+ $('#history').height(docHeight + "px");
}
$(document).ready(function() {
@@ -872,9 +891,6 @@ function showBodyParamsEditor() {
dataMode = "params";
showParamsEditor('body');
- var containerHtml = '<textarea name="data" id="body" tabindex="4" class="inputText"></textarea>';
- $('#bodyDataContainer').html(containerHtml);
-
setCurrentDataFormat('params');
removeBodyListeners();
addBodyListeners();
@@ -885,8 +901,6 @@ function showRawEditor() {
closeParamsEditor('body');
setCurrentDataFormat('raw');
- var containerHtml = '<textarea name="data" id="body" tabindex="4" class="inputText"></textarea>';
- $('#bodyDataContainer').html(containerHtml);
removeBodyListeners();
addBodyListeners();

0 comments on commit 97e6484

Please sign in to comment.
Something went wrong with that request. Please try again.