Added indexDb support
This commit is contained in:
+62
-44
@@ -21,7 +21,7 @@
|
||||
<link rel="icon" type="image/x-icon" href="assets/img/Icon.ico">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<body id="main">
|
||||
<div class="d-grid gap-2 text-center">
|
||||
<div class="">
|
||||
<h1>Tinder for weird furries</h1>
|
||||
@@ -31,50 +31,8 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>Someone will have to put the liked profile here or something</p>
|
||||
<p>Definitely not me</p>
|
||||
<div id="cards">
|
||||
|
||||
|
||||
<div class="container" style="margin-bottom:2vh;">
|
||||
<div class="card">
|
||||
<div class="row">
|
||||
<img src="https://www.pokewiki.de/images/thumb/d/dd/Sugimori_132.png/250px-Sugimori_132.png"
|
||||
class="card-img-left col-8" alt="...">
|
||||
<div class="container col-4">
|
||||
<h3 class="card-text">Frederick 20</h3>
|
||||
<h4>I like ice cream</h4>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn btn-danger" style="width:100%">X</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" style="margin-bottom:2vh;">
|
||||
<div class="card">
|
||||
<div class="row">
|
||||
<img src="https://www.pokewiki.de/images/thumb/d/dd/Sugimori_132.png/250px-Sugimori_132.png"
|
||||
class="card-img-left col-8" alt="...">
|
||||
<div class="container col-4">
|
||||
<h3 class="card-text">Frederick 20</h3>
|
||||
<h4>I like ice cream</h4>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn btn-danger" style="width:100%">X</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" style="margin-bottom:2vh;">
|
||||
<div class="card">
|
||||
<div class="row">
|
||||
<img src="https://www.pokewiki.de/images/thumb/d/dd/Sugimori_132.png/250px-Sugimori_132.png"
|
||||
class="card-img-left col-8" alt="...">
|
||||
<div class="container col-4">
|
||||
<h3 class="card-text">Frederick 20</h3>
|
||||
<h4>I like ice cream</h4>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn btn-danger" style="width:100%">X</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -90,5 +48,65 @@
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script>
|
||||
document.getElementById("main").onload = function () {
|
||||
loadFromIndexedDB("likes", 0).then((response) => {
|
||||
response.forEach(function (item) {
|
||||
var html = "";
|
||||
html += "<div class='container' style='margin-bottom:2vh;'>";
|
||||
html += "<div class='card'>";
|
||||
html += "<div class='row'>";
|
||||
html += "<img src='"+item.pp+"' class='card-img-left col-8' alt='...'>";
|
||||
html += "<div class='container col-4'>";
|
||||
html += "<h3 class='card-text'>"+item.name+" "+item.age+"</h3>";
|
||||
html += "<p>"+((item.description).slice(0,40)+"...")+"</p>";
|
||||
html += "<button class='btn btn-danger' style='width:100%'>X</button>";
|
||||
html += "</div>";
|
||||
html += "</div>";
|
||||
var container = document.getElementById("cards");
|
||||
container.innerHTML += html;
|
||||
});
|
||||
});
|
||||
}
|
||||
function loadFromIndexedDB(storeName) {
|
||||
return new Promise(
|
||||
function (resolve, reject) {
|
||||
var dbRequest = indexedDB.open(storeName);
|
||||
|
||||
dbRequest.onerror = function (event) {
|
||||
reject(Error("Error text"));
|
||||
};
|
||||
|
||||
dbRequest.onupgradeneeded = function (event) {
|
||||
// Objectstore does not exist. Nothing to load
|
||||
event.target.transaction.abort();
|
||||
reject(Error('Not found'));
|
||||
};
|
||||
|
||||
dbRequest.onsuccess = function (event) {
|
||||
var database = event.target.result;
|
||||
var transaction = database.transaction([storeName]);
|
||||
var objectStore = transaction.objectStore(storeName);
|
||||
var objectRequest = objectStore.getAll();
|
||||
|
||||
objectRequest.onerror = function (event) {
|
||||
reject(Error('Error text'));
|
||||
console.log("Error with the indexdb");
|
||||
};
|
||||
|
||||
objectRequest.onsuccess = function (event) {
|
||||
if (objectRequest.result) {
|
||||
resolve(objectRequest.result);
|
||||
}
|
||||
else {
|
||||
reject(Error('object not found'));
|
||||
console.log("object not found");
|
||||
}
|
||||
};
|
||||
};
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
</script>
|
||||
</html>
|
||||
Reference in New Issue
Block a user