.caseParent { width: 100%; padding: 10px; border-style: solid; border-color: white; border-radius: 5px; border-width: 1px; overflow: hidden; } .author { text-align: left; font-size: 26px; } .timePosted { display: inline-block; font-size: 30px; padding-right: 5px; padding-left: 5px; margin: 2px; opacity: 0.8; border-radius: 5px; } .attachments { display: inline-block; font-size: 12px; background: #0070F0; padding-right: 5px; padding-left: 5px; margin: 2px; border-radius: 5px; color: white !important; } .images { display: inline-block; font-size: 10px; background: #29a329; padding-right: 5px; padding-left: 5px; margin: 2px; color: white; opacity: 0.8; border-radius: 5px; } .imgPreview{ margin: 5px; display: inline-block; } .bottle { color: white; word-wrap: break-word; border-radius: 10px; font-size: 24px; max-height: auto; } .linkAttachment { font-size: 15px; background: #0070F0; color: white !important; padding-right: 5px; padding-left: 5px; margin: 2px; border-radius: 5px; opacity: 0.8; } blockquote { border-left: 10px solid #ccc; margin: 1.5em 10px; font-size: 27px !important; background: black; quotes: "\201C""\201D""\2018""\2019"; background: linear-gradient(yellow, orange); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; } blockquote:before { color: #ccc; content: open-quote; font-size: 4em; line-height: 0.1em; margin-right: 0.25em; vertical-align: -0.4em; display: inline; } Welcome to Battle Cats Community. This platform is in Beta version, bugs may exist. Also reactions and comments are not yet added. For the mean time you can post here and upload things you wanted! Do not spam! Only feeds for today can show. (adsbygoogle = window.adsbygoogle || []).push({}); Create a post. let req = new XMLHttpRequest(); let data; req.onload = () => { console.log('onload'); if (req.readyState == XMLHttpRequest.DONE) { if(req.status == '200') { data =JSON.parse(req.response); //console.log(Object.keys(data.posts).length); let totalPosts = Object.keys(data.posts).length; for(i = totalPosts-1; i > -1; i--) { //console.log(data.posts[Object.keys(data.posts)[i]].description); let timeCheck = Math.floor((new Date() - convertTZ(Object.keys(data.posts)[i].split('user at ')[1])) / 1000); //if(timeCheck < 172800) prepareCase(data.posts[Object.keys(data.posts)[i]].images, data.posts[Object.keys(data.posts)[i]].attUrls, Object.keys(data.posts)[i], data.posts[Object.keys(data.posts)[i]].description); } } } }; // pattern /* <div class='caseParent'> <span class='author'>Anonymous</span><span> ~ </span> <span class='timePosted'>Sunday 10 Pm</span> <span class='attachments'>1 attachment</span> <span class='images'>2 images</span> <br/> <span class='bottle'> */ // variables function createElement(name) { return document.createElement(name); } function prepareCase(imgArray, attArray, keyAuthor, description) { let divCase = createElement('div'); divCase.setAttribute('class', 'caseParent'); divCase.appendChild(getAuthor(keyAuthor)); divCase.appendChild(getTime(keyAuthor)); if(attArray.length > 0) { //divCase.appendChild(getAttachments(attArray.length)); } if(imgArray.length > 0) { //divCase.appendChild(getImages(imgArray.length)); divCase.appendChild(createElement('br')); let snapImages = snapImage(imgArray); for(a = 0; a < parseInt(snapImages.length); a ++) { divCase.appendChild(snapImages[a]); } } divCase.appendChild(getBottle(description)); document.querySelector('.postBody').appendChild(divCase); if(attArray.length > 0) { let snapUrls = snapAttachments(attArray); for(a = 0; a < parseInt(snapUrls.length); a ++) { divCase.appendChild(snapUrls[a]); } } } function getBottle(description) { let desc = createElement('blockquote'); //desc.setAttribute('class', 'bottle'); desc.innerText = description; return desc; } function getTime(keyAuthor) { let time = createElement('span'); time.setAttribute('class', 'timePosted'); time.innerText = timeSince(convertTZ(keyAuthor.split('user at ')[1])) + ' ago..'; return time } function getAuthor(city) { let author = createElement('span'); author.setAttribute('class', 'author'); author.innerHTML = 'Anonymous from <span style="font-size: 16px; border-radius: 3px;">' + city.split(' user')[0] + '</span> —'; return author; } function getAttachments(count) { let att = createElement('span'); att.setAttribute('class', 'attachments'); att.innerText = count + (count > 1 ? ' attachments' : ' attachment'); return att; } function getImages(count) { let img = createElement('span'); img.setAttribute('class', 'images'); img.innerText = count + (count > 1 ? ' images' : ' image'); return img; } function snapImage(imgArray) { let size = parseInt(imgArray.length); let imgs = []; for(a = 0; a < size; a++ ){ let temp = createElement('img'); temp.setAttribute('class', 'imgPreview'); temp.src = imgArray[a]; //temp.setAttribute('onclick', 'visitImage("' + temp.src + '")'); imgs.push(temp); } //console.log(imgs); return imgs; } function visitImage(src) { window.location.href = src; } function snapAttachments(attArray) { let size = parseInt(attArray.length); let urls = []; //console.log(attArray); for(a = 0; a < size; a++ ){ let temp = createElement('a'); temp.setAttribute('class', 'attachments'); temp.innerHTML = '#' + (a+1) + ' Attachment File'; //+ '<br/>' + new URL(attArray[a]).hostname + '...'; temp.setAttribute('target', '_blank'); temp.href = 'https://storehaccounts.blogspot.com/p/link-terminal.html#' + btoa(attArray[a]); urls.push(temp); } return urls; } // Core GETrequest(); // MISC Functions function timeSince(date) { var seconds = Math.floor((new Date() - date) / 1000); var interval = seconds / 31536000; if (interval > 1) { return Math.floor(interval) + " year/s"; } interval = seconds / 2592000; if (interval > 1) { return Math.floor(interval) + " month/s"; } interval = seconds / 86400; if (interval > 1) { return Math.floor(interval) + " day/s"; } interval = seconds / 3600; if (interval > 1) { return Math.floor(interval) + " hour/s"; } interval = seconds / 60; if (interval > 1) { return Math.floor(interval) + " minute/s"; } return Math.floor(seconds) + " second/s"; } function convertTZ(date) { let tzString = Intl.DateTimeFormat().resolvedOptions().timeZone; return new Date((typeof date === "string" ? new Date(date) : date).toLocaleString("en-US", {timeZone: tzString})); } function GETrequest() { try { req.open("GET", "https://getpantry.cloud/apiv1/pantry/91c9a2f3-be20-4b3b-8c9e-94a81264de7a/basket/members", true); req.setRequestHeader("Content-Type", "application/json"); req.send(); } catch(err) { document.querySelector('#create').style.display = 'none'; console.log('oops server overloads, resending...'); setTimeout(function() { GETrequest(); }, 5000); } }