Skip to content

Instantly share code, notes, and snippets.

@jonathanwilsonucla
Forked from z3cka/open-now.html
Last active February 13, 2020 19:24
Show Gist options
  • Save jonathanwilsonucla/8c75fb0a5fb27847a99f4646113ab94b to your computer and use it in GitHub Desktop.
Save jonathanwilsonucla/8c75fb0a5fb27847a99f4646113ab94b to your computer and use it in GitHub Desktop.
current_laptop_availability.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8">
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<style>
div {
color: white;
font-family: "Verdana", sans-serif;
font-size: 44px;
padding: 0;
margin: 0;
border: 0;
/*line-height: 140px;*/
}
span {
color: #C0C0C0;
font-family: "Verdana", sans-serif;
font-size: 44px;
font-style: italic;
}
</style>
</head>
<body>
<!-- If script does not run, a 'page loading' .gif will be displayed -->
<div id="laptopdisplay"><br><br> <img src="https://storage.googleapis.com/risemedialibrary-14d37739-5ebf-48da-9a52-4d8b63272675/Backgrounds/loader.gif" height="50" width="50"></img></div>
<script type='text/javascript'>
var output = "";
var loclen;
// create an array with
// 1) the lid of the laptop lending location for the calendar web service
// 2) the order (alphabetical) of that location for the available laptops web service
// 3) false, which will be changed to true if the location is open
// 4) short name of the location, mainly for sanity testing
var liblids = [
[4691, 0, false, "arts"],
[3291, 1, false, "biomed"],
[4698, 2, false, "music"],
[4705, 5, false, "selboelter"],
[4706, 6, false, "selgeo"],
[2614, 4, false, "yrl"],
];
$.getJSON( "https://webservices.library.ucla.edu/calendar/hours/today/0", function( hours ) {
// determine number of locations returned
loclen = hours.locations.length - 1;
// loop through all specified lid's to find the matches in today's hours
// when a match is found, check if the location is open
for (i=0; i<liblids.length; i++){
for (j=0; j<loclen; j++){
if (hours.locations[j].lid == liblids[i][0]) {
if (hours.locations[j].times.currently_open){
liblids[i][2] = true;
}
}
}
}
}).done(function() {
$.getJSON( "https://webservices.library.ucla.edu/laptops/available", function( lapavail ) {
// loop through the specified lid's again
// if the location is open, display the available laptops
for ( k=0; k<liblids.length; k++ ) {
if (liblids[k][2]) {
output += lapavail.laptops[liblids[k][1]].availableCount+"<br />";
} else {
output += "<span>closed</span><br />";
}
}
document.getElementById("laptopdisplay").innerHTML = output;
})
});
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8">
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<style>
div {
color: white;
font-family: "Verdana", sans-serif;
font-size: 36px;
padding: 0;
margin: 0;
border: 0;
}
span {
color: #C0C0C0;
font-family: "Verdana", sans-serif;
font-size: 36px;
font-style: italic;
}
</style>
</head>
<body>
<!-- If script does not run, a 'page loading' .gif will be displayed -->
<div id="laptopdisplay"><br><br> <img src="https://storage.googleapis.com/risemedialibrary-14d37739-5ebf-48da-9a52-4d8b63272675/Backgrounds/loader.gif" height="36" width="36"></img></div>
<script type='text/javascript'>
var output = "";
var loclen;
// create an array with
// 1) the lid of the laptop lending location for the calendar web service
// 2) the order (alphabetical) of that location for the available laptops web service
// 3) false, which will be changed to true if the location is open
// 4) short name of the location, mainly for sanity testing
var liblids = [
[4691, 0, false, "arts"],
[3291, 1, false, "biomed"],
[4698, 2, false, "music"],
];
$.getJSON( "https://webservices.library.ucla.edu/calendar/hours/today/0", function( hours ) {
// determine number of locations returned
loclen = hours.locations.length - 1;
// loop through all specified lid's to find the matches in today's hours
// when a match is found, check if the location is open
for (i=0; i<liblids.length; i++){
for (j=0; j<loclen; j++){
if (hours.locations[j].lid == liblids[i][0]) {
if (hours.locations[j].times.currently_open){
liblids[i][2] = true;
}
}
}
}
}).done(function() {
$.getJSON( "https://webservices.library.ucla.edu/laptops/available", function( lapavail ) {
// loop through the specified lid's again
// if the location is open, display the available laptops
for ( k=0; k<liblids.length; k++ ) {
if (liblids[k][2]) {
output += lapavail.laptops[liblids[k][1]].availableCount+"<br />";
} else {
output += "<span>closed</span><br />";
}
}
document.getElementById("laptopdisplay").innerHTML = output;
})
});
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8">
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<style>
div {
color: white;
font-family: "Verdana", sans-serif;
font-size: 36px;
padding: 0;
margin: 0;
border: 0;
}
span {
color: #C0C0C0;
font-family: "Verdana", sans-serif;
font-size: 36px;
font-style: italic;
}
</style>
</head>
<body>
<!-- If script does not run, a 'page loading' .gif will be displayed -->
<div id="laptopdisplay"><br><br> <img src="https://storage.googleapis.com/risemedialibrary-14d37739-5ebf-48da-9a52-4d8b63272675/Backgrounds/loader.gif" height="36" width="36"></img></div>
<script type='text/javascript'>
var output = "";
var loclen;
// create an array with
// 1) the lid of the laptop lending location for the calendar web service
// 2) the order (alphabetical) of that location for the available laptops web service
// 3) false, which will be changed to true if the location is open
// 4) short name of the location, mainly for sanity testing
var liblids = [
[2608, 3, false, "powell"],
[4705, 5, false, "selboelter"],
[4706, 6, false, "selgeo"],
];
$.getJSON( "https://webservices.library.ucla.edu/calendar/hours/today/0", function( hours ) {
// determine number of locations returned
loclen = hours.locations.length - 1;
// loop through all specified lid's to find the matches in today's hours
// when a match is found, check if the location is open
for (i=0; i<liblids.length; i++){
for (j=0; j<loclen; j++){
if (hours.locations[j].lid == liblids[i][0]) {
if (hours.locations[j].times.currently_open){
liblids[i][2] = true;
}
}
}
}
}).done(function() {
$.getJSON( "https://webservices.library.ucla.edu/laptops/available", function( lapavail ) {
// loop through the specified lid's again
// if the location is open, display the available laptops
for ( k=0; k<liblids.length; k++ ) {
if (liblids[k][2]) {
output += lapavail.laptops[liblids[k][1]].availableCount+"<br />";
} else {
output += "<span>closed</span><br />";
}
}
document.getElementById("laptopdisplay").innerHTML = output;
})
});
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8">
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<style>
div {
color: white;
font-family: "Verdana", sans-serif;
font-size: 80px;
padding: 0;
margin: 0;
border: 0;
line-height: 90px;
}
span {
color: #C0C0C0;
font-style: italic;
font-size: 44px;
line-height: 12px;
}
</style>
</head>
<body>
<!-- If script does not run, a 'page loading' .gif will be displayed -->
<table>
<tr>
<td>
<div id="displaychromebooks"></div>
</td>
<td>
<div id="displaymacs"></div>
</td>
<td>
<div id="displaywindows"></div>
</td>
</tr>
</table>
<script type='text/javascript'>
var output = "";
var loclen;
// create an array with
// 1) the lid of the laptop lending location for the calendar web service
// 2) the order (alphabetical) of that location for the available laptops web service
// 3) false, which will be changed to true if the location is open
// 4) short name of the location, mainly for sanity testing
var liblids = [
[2608, 4, true, "powell"],
];
$.getJSON( "https://webservices.library.ucla.edu/calendar/hours/today/0", function( hours ) {
// determine number of locations returned
loclen = hours.locations.length - 1;
// loop through all specified lid's to find the matches in today's hours
// when a match is found, check if the location is open
for (i=0; i<liblids.length; i++){
for (j=0; j<loclen; j++){
if (hours.locations[j].lid == liblids[i][0]) {
if (hours.locations[j].times.currently_open){
liblids[i][2] = true;
}
}
}
}
}).done(function() {
$.getJSON( "https://webservices.library.ucla.edu/laptops/available", function( lapavail ) {
// loop through the specified lid's again
// if the location is open, display the available laptops
//for ( k=0; k<liblids.length; k++ ) {
// if (liblids[k][2]) {
// output += lapavail.laptops[liblids[k][1]].availableCount+"<br />";
// } else {
// output += "<span>closed</span><br />";
// }
$("#displaychromebooks").text(lapavail.items[0].chromeBooks);
$("#displaymacs").text(lapavail.items[0].macs);
$("#displaywindows").text(lapavail.items[0].windows);
}
//document.getElementById("laptopdisplay").innerHTML = output;
})
});
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8">
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<style>
div {
color: white;
font-family: "Verdana", sans-serif;
font-size: 112px;
padding: 0;
margin: 0;
border: 0;
line-height: 100px;
}
span {
color: #C0C0C0;
font-style: italic;
font-size: 36px;
line-height: 12px;
}
</style>
</head>
<body>
<!-- If script does not run, a 'page loading' .gif will be displayed -->
<div id="laptopdisplay"> <img src="https://storage.googleapis.com/risemedialibrary-14d37739-5ebf-48da-9a52-4d8b63272675/Backgrounds/loader.gif" height="40" width="40"></img></div>
<script type='text/javascript'>
var output = "";
var loclen;
// create an array with
// 1) the lid of the laptop lending location for the calendar web service
// 2) the order (alphabetical) of that location for the available laptops web service
// 3) false, which will be changed to true if the location is open
// 4) short name of the location, mainly for sanity testing
var liblids = [
[2614, 4, false, "yrl"],
];
$.getJSON( "https://webservices.library.ucla.edu/calendar/hours/today/0", function( hours ) {
// determine number of locations returned
loclen = hours.locations.length - 1;
// loop through all specified lid's to find the matches in today's hours
// when a match is found, check if the location is open
for (i=0; i<liblids.length; i++){
for (j=0; j<loclen; j++){
if (hours.locations[j].lid == liblids[i][0]) {
if (hours.locations[j].times.currently_open){
liblids[i][2] = true;
}
}
}
}
}).done(function() {
$.getJSON( "https://webservices.library.ucla.edu/laptops/available", function( lapavail ) {
// loop through the specified lid's again
// if the location is open, display the available laptops
for ( k=0; k<liblids.length; k++ ) {
if (liblids[k][2]) {
output += lapavail.laptops[liblids[k][1]].availableCount+"<br />";
} else {
output += "<span>closed</span><br />";
}
}
document.getElementById("laptopdisplay").innerHTML = output;
})
});
</script>
</body>
</html>
@jonathanwilsonucla
Copy link
Author

Added 3 files for the RC Classroom sign. Due to the layout of the sign, the "others" file was broken into 2.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment