Skip to content

Commit

Permalink
⚗️ Prolly fixed PWA
Browse files Browse the repository at this point in the history
  • Loading branch information
@liyasthomas
liyasthomas committed Aug 22, 2019
1 parent e077546 commit 1619c94
Show file tree
Hide file tree
Showing 4 changed files with 65 additions and 60 deletions.
107 changes: 57 additions & 50 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ <h3>API request builder</h3>
</div>
</header>
<fieldset class="request">
<legend v-on:click="collapse">Request ⇵</legend>
<legend v-on:click="collapse">Request ⭥</legend>
<div class="collapsible">
<ul>
<li>
Expand All @@ -98,14 +98,54 @@ <h3>API request builder</h3>
<input v-model="path">
</li>
<li>
<label for="action">Action</label>
<label for="action">&nbsp;</label>
<button name="action" @click="sendRequest">Send</button>
</li>
</ul>
</div>
</fieldset>
<fieldset class="authentication">
<legend v-on:click="collapse">Authentication ⇵</legend>
<fieldset class="reqbody" v-if="method === 'POST' || method === 'PUT'">
<legend v-on:click="collapse">Request Body ⭥</legend>
<div class="collapsible">
<ul>
<li>
<label>Content Type</label>
<select v-model="contentType">
<option>application/json</option>
<option>www-form/urlencoded</option>
</select>
</li>
</ul>
<ol v-for="(param, index) in bodyParams">
<li>
<label :for="'bparam'+index">Key {{index + 1}}</label>
<input :name="'bparam'+index" v-model="param.key">
</li>
<li>
<label :for="'bvalue'+index">Value {{index + 1}}</label>
<input :name="'bvalue'+index" v-model="param.value">
</li>
<li>
<label for="request">&nbsp;</label>
<button name="request" @click="removeRequestBodyParam(index)">Remove</button>
</li>
</ol>
<ul>
<li>
<label for="addrequest">Action</label>
<button name="addrequest" @click="addRequestBodyParam">Add</button>
</li>
</ul>
<ul>
<li>
<label for="request">Parameter List</label>
<textarea name="request" rows="1" readonly>{{rawRequestBody || '(add atleast one parameter)'}}</textarea>
</li>
</ul>
</div>
</fieldset>
<fieldset class="authentication hidden">
<legend v-on:click="collapse">Authentication ⭥</legend>
<div class="collapsible">
<ul>
<li>
Expand All @@ -128,8 +168,8 @@ <h3>API request builder</h3>
</ul>
</div>
</fieldset>
<fieldset class="parameters">
<legend v-on:click="collapse">Parameters ⇵</legend>
<fieldset class="parameters hidden">
<legend v-on:click="collapse">Parameters ⭥</legend>
<div class="collapsible">
<ol v-for="(param, index) in params">
<li>
Expand All @@ -141,7 +181,7 @@ <h3>API request builder</h3>
<input :name="'value'+index" v-model="param.value">
</li>
<li>
<label for="param">Action</label>
<label for="param">&nbsp;</label>
<button name="param" @click="removeRequestParam(index)">Remove</button>
</li>
</ol>
Expand All @@ -159,51 +199,13 @@ <h3>API request builder</h3>
</ul>
</div>
</fieldset>
<fieldset class="reqbody" v-if="method === 'POST' || method === 'PUT'">
<legend v-on:click="collapse">Request Body ⇵</legend>
<div class="collapsible">
<ol v-for="(param, index) in bodyParams">
<li>
<label :for="'bparam'+index">Key {{index + 1}}</label>
<input :name="'bparam'+index" v-model="param.key">
</li>
<li>
<label :for="'bvalue'+index">Value {{index + 1}}</label>
<input :name="'bvalue'+index" v-model="param.value">
</li>
<li>
<label for="request">Action</label>
<button name="request" @click="removeRequestBodyParam(index)">Remove</button>
</li>
</ol>
<ul>
<li>
<label>Content Type</label>
<select v-model="contentType">
<option>application/json</option>
<option>www-form/urlencoded</option>
</select>
</li>
<li>
<label for="addrequest">Action</label>
<button name="addrequest" @click="addRequestBodyParam">Add</button>
</li>
</ul>
<ul>
<li>
<label for="request">Parameter List</label>
<textarea name="request" rows="1" readonly>{{rawRequestBody || '(add atleast one parameter)'}}</textarea>
</li>
</ul>
</div>
</fieldset>
<fieldset class="response" id="response" ref="response">
<legend v-on:click="collapse">Response ⇵</legend>
<legend v-on:click="collapse">Response ⭥</legend>
<div class="collapsible">
<ul>
<li>
<label for="status">Status</label>
<input name="status" type="text" readonly :value="response.status || 'waiting for request'">
<label for="status">status</label>
<input name="status" type="text" readonly :value="response.status || '(waiting to send request)'">
</li>
</ul>
<ul v-for="(value, key) in response.headers">
Expand All @@ -212,13 +214,18 @@ <h3>API request builder</h3>
<input name="value" :value="value" readonly>
</li>
</ul>
<textarea rows="5" readonly>{{response.body}}</textarea>
<ul>
<li>
<label for="body">response</label>
<textarea name="body" rows="6" readonly>{{response.body || '(waiting to send request)'}}</textarea>
</li>
</ul>
</div>
</fieldset>
<footer>
<a href="https://github.com/liyasthomas/postwoman"><img src="icons/github.svg" alt="" style="margin-right: 16px">GitHub</a>
<button id="installPWA" onclick="installPWA()">
PWA
Install PWA
</button>
</footer>
</main>
Expand Down
3 changes: 2 additions & 1 deletion script.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -75,7 +75,8 @@ const app = new Vue({
this.$refs.response.scrollIntoView({
behavior: 'smooth'
})
this.response.status = 'Loading...'
this.response.status = 'Fetching...'
this.response.body = 'Loading...'
const xhr = new XMLHttpRequest()
const user = this.auth === 'Basic' ? this.httpUser : null
const pswd = this.auth === 'Basic' ? this.httpPassword : null
Expand Down
10 changes: 4 additions & 6 deletions style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,11 +34,9 @@ a {
}

body {
padding: 0;
background-color: var(--bg-color);
color: var(--fg-color);
font-weight: 500;
font-size: 16px;
line-height: 1.5;
animation: fadein .2s;
-webkit-tap-highlight-color: transparent;
Expand Down Expand Up @@ -108,19 +106,19 @@ fieldset.request legend {
}

fieldset.authentication {
border-color: #50E3C2;
border-color: #B8E986;
}

fieldset.authentication legend {
color: #50E3C2;
color: #B8E986;
}

fieldset.parameters {
border-color: #B8E986;
border-color: #50E3C2;
}

fieldset.parameters legend {
color: #B8E986;
color: #50E3C2;
}

fieldset.reqbody {
Expand Down
5 changes: 2 additions & 3 deletions sw.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,9 +35,8 @@ workbox.routing.registerRoute(
})
);
workbox.precaching.precacheAndRoute([
'/index.css',
'/index.js',
'/manage.js',
'/style.css',
'/script.js',
{
url: '/index.html',
revision: '383676'
Expand Down

0 comments on commit 1619c94

Please sign in to comment.