show old stuff correctly
This commit is contained in:
		
							parent
							
								
									b619b70d22
								
							
						
					
					
						commit
						9db30c7e80
					
				| @ -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);
 | ||||
| })(); | ||||
|  | ||||
| @ -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> | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user