coolaj86
/
go-again
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

show old stuff correctly

wip
AJ ONeal 5 years ago
parent
b619b70d22
commit
9db30c7e80
2 changed files with 79 additions and 81 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 62
      public/app.js
  2. 98
      public/index.html

62
public/app.js
View File

@ -33,14 +33,15 @@
// after blanking all inner templates
$devTpl = $('.js-schedule').outerHTML;
var $form = $('.js-new-schedule');
// Pick a date and time on an even number
// between 10 and 15 minutes in the future
var d = new Date(Date.now() + 10 * 60 * 1000);
var minutes = d.getMinutes() + (5 - (d.getMinutes() % 5)) - d.getMinutes();
d = new Date(d.valueOf() + minutes * 60 * 1000);
$('.js-date').value = d.getFullYear() + '-' + pad(d.getMonth() + 1) + '-' + pad(d.getDate());
$('.js-time').value = pad(d.getHours()) + ':' + pad(d.getMinutes());
$('.js-url').value = 'https://enfqtbjh5ghw.x.pipedream.net';
$('.js-date', $form).value = d.getFullYear() + '-' + pad(d.getMonth() + 1) + '-' + pad(d.getDate());
$('.js-time', $form).value = pad(d.getHours()) + ':' + pad(d.getMinutes());
$('.js-url', $form).value = 'https://enfqtbjh5ghw.x.pipedream.net';
console.log('hello');
@ -49,8 +50,6 @@
newWebhookHeader(ev.target);
} else if (ev.target.matches('.js-rm-header')) {
rmWebhookHeader(ev.target);
} else if (ev.target.matches('.js-delete') && ev.target.closest('.js-grant')) {
deleteGrant(ev.target.closest('.js-grant'));
} else if (ev.target.matches('.js-delete') && ev.target.closest('.js-webhook')) {
deleteWebhook(ev.target.closest('.js-webhook'));
} else {
@ -86,8 +85,8 @@
}
function newSchedule() {
var $hook = $('.js-schedule');
//var deviceId = $hook.closest('.js-schedule').querySelector('.js-id').value;
var $hook = $('.js-new-schedule');
//var deviceId = $hook.closest('.js-new-schedule').querySelector('.js-id').value;
var schedule = {
date: $('.js-date', $hook).value,
time: $('.js-time', $hook).value,
@ -211,47 +210,30 @@
console.log(data);
var $devs = $('.js-schedules');
$devs.innerHTML = '';
data.devices.forEach(function(d) {
data.schedules.forEach(function(d) {
var $dev = $.create($devTpl);
$('.js-ieme', $dev).innerText = d.id;
$('.js-id', $dev).value = d.accessToken;
$('.js-update-url', $dev).innerText = d.updateUrl;
$('.js-id', $dev).value = d.id;
$('.js-date', $dev).value = d.date;
$('.js-time', $dev).value = d.time;
$('.js-tz', $dev).value = d.tz;
d.webhooks.forEach(function(h) {
console.log('webhook', h);
var $hook = $.create($webhookTpl);
$('.js-id', $hook).innerText = h.id;
$('.js-comment', $hook).innerText = h.comment;
$('.js-method', $hook).innerText = h.method;
$('.js-url', $hook).innerText = h.url;
Object.keys(h.headers).forEach(function(k) {
Object.keys(h.headers || {}).forEach(function(k) {
var $header = $.create($webhookHeaderTpl);
var v = h.headers[k];
$('.js-key', $header).innerText = k;
$('.js-value', $header).innerText = v;
$('.js-headers', $hook).innerHTML += $header.innerHTML;
});
$('.js-body-template', $hook).innerText = h.body;
$('.js-body-template', $hook).innerText = h.body || '';
$('.js-webhooks', $dev).innerHTML += $hook.innerHTML;
});
d.grants.forEach(function(g) {
var $grant = $.create($grantTpl);
$('.js-id', $grant).innerText = g.id;
$('.js-comment', $grant).innerText = g.comment;
$('.js-token', $grant).innerText = g.token;
//TODO Math.floor(Date.now() / 1000);
var url = 'https://test.therootcompany.com/api/v1/devices/' + d.accessToken + '/updates?since=' + 0;
$('.js-example-curl .js-example-url', $grant).innerText = url;
$('.js-example-curl .js-example-token', $grant).innerText = g.token;
$('.js-example-js .js-example-url', $grant).innerText = url;
$('.js-example-js .js-example-id', $grant).innerText = d.accessToken;
$('.js-example-js .js-example-token', $grant).innerText = g.token;
$('.js-grants', $dev).innerHTML += $grant.innerHTML;
});
d.updates.slice(0, 10).forEach(function(u) {
var $update = $.create($updateTpl);
$('.js-update-details', $update).innerText = JSON.stringify(u);
$('.js-updates', $dev).innerHTML += $update.innerHTML;
});
$devs.innerHTML += $dev.innerHTML;
$devs.appendChild($dev);
});
}
@ -262,8 +244,8 @@
var tz = Intl.DateTimeFormat().resolvedOptions().timeZone;
var options = $$('.js-tz option');
var valOpt = options[0].outerHTML; // UTC
var spaceOpt = options[1].outerHTML; // ----
var innerHTML = $('.js-tz').innerHTML;
//var spaceOpt = options[1].outerHTML; // ----
var innerHTML = $('.js-new-schedule .js-tz').innerHTML;
/*
innerHTML =
'<option selected value="' +
@ -297,7 +279,7 @@
});
innerHTML += '</optgroup>';
});
$('.js-tz').innerHTML = innerHTML;
$('.js-new-schedule .js-tz').innerHTML = innerHTML;
console.info('[tzdb] loaded');
run();
@ -327,9 +309,13 @@
.clone()
.json()
.then(function(schedules) {
console.log('schedules');
console.log(schedules);
allSchedules = schedules;
renderSchedules(schedules);
$('.js-schedules').hidden = false;
state.account.schedules = schedules;
displayAccount(state.account);
$('.js-account').hidden = false;
})
.catch(function(e) {
console.error("Didn't parse JSON:");
@ -372,5 +358,7 @@
});
}
console.log('whatever');
$('.js-auth-token').value = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx';
//window.addEventListener('load', run);
})();

98
public/index.html
View File

@ -17,27 +17,19 @@
<pre><code class="js-schedules-output"> </code></pre>
<div class="js-schedules" hidden>
<div class="js-account" hidden>
<h2>Schedules</h2>
<div class="js-schedule">
<form class="js-new-schedule">
<label>Date: <input type="date" class="js-date" required/></label>
<label>Time: <input type="time" class="js-time" step="300" required/></label>
<!-- TODO combo box -->
<label
>Location:
<select class="js-tz">
<option value="UTC">UTC</option>
<option disabled>──────────</option>
</select>
</label>
<br />
<div class="js-schedules">
<div class="js-schedule">
<input type="hidden" class="js-id" />
<input type="date" class="js-date" readonly />
<input type="time" class="js-time" readonly />
<input type="text" class="js-tz" readonly />
<div class="doc-webhooks-container">
<h3>Webhook</h3>
<div class="js-webhooks">
<div class="js-webhook">
<h4><span class="js-comment"></span><button class="js-delete" type="button">Delete</button></h4>
<h4><span class="js-comment"></span></h4>
<span class="js-id" hidden></span>
<span class="js-method"></span>
<span class="js-url"></span>
@ -51,8 +43,28 @@
<pre><code class="js-body-template"></code></pre>
</div>
</div>
<div class="js-new-webhook">
<!--
</div>
<button class="js-delete" type="button">Delete Schedule</button>
</div>
</div>
<h2>Add Schedule</h2>
<form class="js-new-schedule">
<label>Date: <input type="date" class="js-date" required/></label>
<label>Time: <input type="time" class="js-time" step="300" required/></label>
<!-- TODO combo box -->
<label
>Location:
<select class="js-tz">
<option value="UTC">UTC</option>
<option disabled>──────────</option>
</select>
</label>
<br />
<h3>Webhook</h3>
<div class="js-new-webhook">
<!--
<select class="js-template">
<option value="webhook" selected>Custom Webhook</option>
<option value="requestbin">RequestBin</option>
@ -62,35 +74,33 @@
</select>
<br />
-->
<input class="js-comment" type="text" placeholder="Webhook Name" required />
<br />
<select class="js-method">
<option value="POST" selected>POST</option>
<option value="PUT">PUT</option>
</select>
<input placeholder="https://example.com/api/v1/updates" class="js-url" type="url" required />
<div class="js-headers">
<div class="js-header">
<input placeholder="Header" class="js-key" type="text" />
<input placeholder="Value" class="js-value" type="text" />
<button type="button" class="js-rm-header" hidden>[x]</button>
<button type="button" class="js-new-header">[+]</button>
</div>
</div>
<div class="js-body">
<textarea
placeholder="Body template, use '{{ keyname }}' for template values."
class="js-body-template"
></textarea>
<!-- TODO preview template -->
</div>
<input class="js-comment" type="text" placeholder="Webhook Name" required />
<br />
<select class="js-method">
<option value="POST" selected>POST</option>
<option value="PUT">PUT</option>
</select>
<input placeholder="https://example.com/api/v1/updates" class="js-url" type="url" required />
<div class="js-headers">
<div class="js-header">
<input placeholder="Header" class="js-key" type="text" />
<input placeholder="Value" class="js-value" type="text" />
<button type="button" class="js-rm-header" hidden>[x]</button>
<button type="button" class="js-new-header">[+]</button>
</div>
</div>
<div class="js-body">
<textarea
placeholder="Body template, use '{{ keyname }}' for template values."
class="js-body-template"
></textarea>
<!-- TODO preview template -->
</div>
</div>
<br />
<button class="js-create">Save Schedule</button>
</form>
</div>
<br />
<button class="js-create">Save Schedule</button>
</form>
</div>
<script src="./ajquery.js"></script>

Write Preview
Loading…
Cancel
Save