From 2f096d1432261e315e9fef5e956127f0e6eac215 Mon Sep 17 00:00:00 2001 From: Jonas Leder Date: Wed, 10 Nov 2021 08:02:56 +0100 Subject: [PATCH] show banner when selling on ebay kleinanzeigen --- js/customElements/ebkBanner.js | 21 +++++++ js/customElements/sellingTable.js | 94 +++++++++++++++++++++++++++++++ js/script.js | 2 + public/API/ebayimg.php | 12 ++++ public/API/ebk.php | 55 ++++++++++++++++++ public/API/lib/config.example.php | 4 +- public/index.html | 1 + public/selling.html | 17 ++++++ scss/_sellingTable.scss | 15 +++++ scss/style.scss | 1 + 10 files changed, 221 insertions(+), 1 deletion(-) create mode 100644 js/customElements/ebkBanner.js create mode 100644 js/customElements/sellingTable.js create mode 100644 public/API/ebayimg.php create mode 100644 public/API/ebk.php create mode 100644 public/selling.html create mode 100644 scss/_sellingTable.scss diff --git a/js/customElements/ebkBanner.js b/js/customElements/ebkBanner.js new file mode 100644 index 0000000..8f5cba7 --- /dev/null +++ b/js/customElements/ebkBanner.js @@ -0,0 +1,21 @@ +class ebkBanner extends HTMLElement { + constructor(){ + super(); + let xhr = new XMLHttpRequest(); + xhr.onreadystatechange = () => { + if(xhr.readyState === 4 && xhr.status === 200){ + if(xhr.responseText > 0) { + const h2 = document.createElement("h2"); + h2.classList.add("red"); + h2.innerHTML = "Ich biete aktuell wieder verschiedene Artikel zum verkauf an, eine genaue Übersucht ist hier zu sehen." + this.appendChild(h2); + } + } + } + + xhr.open("GET", "/API/ebk.php?count"); + xhr.send(); + } +} + +customElements.define("jl-ebk-banner", ebkBanner); \ No newline at end of file diff --git a/js/customElements/sellingTable.js b/js/customElements/sellingTable.js new file mode 100644 index 0000000..645687b --- /dev/null +++ b/js/customElements/sellingTable.js @@ -0,0 +1,94 @@ +import * as basicLightbox from 'basiclightbox' + +class sellingTable extends HTMLElement { + constructor(){ + const config = [ + { + "title": "Bild", + "fieldName": "previewImage", + "displayType": "image", + "fullImage": "image" + }, + { + "title": "Titel", + "fieldName": "title", + "displayType": "text" + }, + { + "title": "Preis", + "fieldName": "price", + "displayType": "text" + }, + { + "title": "Link", + "fieldName": "link", + "displayType": "link", + "linkText": "Anzeige ansehen", + "target": "_blank" + }, + ] + + super(); + const table = document.createElement("table"); + this.appendChild(table); + + const tr = document.createElement("tr"); + table.appendChild(tr); + + config.forEach(element => { + const th = document.createElement("th"); + th.innerText = element["title"]; + tr.appendChild(th); + }); + + let xhr = new XMLHttpRequest(); + xhr.onreadystatechange = () => { + if(xhr.readyState === 4 && xhr.status === 200){ + const response = JSON.parse(xhr.responseText); + response.forEach( ad => { + const tr = document.createElement("tr"); + table.appendChild(tr); + config.forEach(element => { + const th = document.createElement("th"); + + switch(element["displayType"]) { + case "text": + th.innerText = ad[element["fieldName"]]; + break; + case "link": + const link = document.createElement("a"); + th.appendChild(link); + link.href = ad[element["fieldName"]]; + link.innerText = element["linkText"]; + + if("target" in element) { + link.target = element["target"]; + } + break; + case "image": + const img = document.createElement("img"); + th.appendChild(img); + img.src = ad[element["fieldName"]]; + img.onclick = () => { + const instance = basicLightbox.create(` + + `); + instance.show(); + } + break; + + } + + tr.appendChild(th); + }); + + }) + } + } + + xhr.open("GET", "/API/ebk.php"); + xhr.send(); + } +} + +customElements.define("jl-selling-table", sellingTable); \ No newline at end of file diff --git a/js/script.js b/js/script.js index e186020..0514b87 100644 --- a/js/script.js +++ b/js/script.js @@ -16,3 +16,5 @@ require("./customElements/contactMailButton"); require("./customElements/header"); require("./customElements/mainMenu"); require("./customElements/footer"); +require("./customElements/ebkBanner"); +require("./customElements/sellingTable"); diff --git a/public/API/ebayimg.php b/public/API/ebayimg.php new file mode 100644 index 0000000..7623edc --- /dev/null +++ b/public/API/ebayimg.php @@ -0,0 +1,12 @@ + 'Basic YW5kcm9pZDpUYVI2MHBFdHRZ', + 'user-agent' => 'okhttp/4.9.1', + 'x-ebayk-app' => '4e10d7fd-6fef-4f87-afb0-b8ede2f494071636475109828', + 'Host' => 'api.ebay-kleinanzeigen.de', + 'Accept' => '*/*', + 'Accept-Encoding' => 'gzip, deflate, br' +]; +$response = $client->request('GET', "https://api.ebay-kleinanzeigen.de/api/ads.json?_in=title,price,pictures,link,features-active,search-distance,negotiation-enabled,attributes,medias,medias.media,medias.media.title,medias.media.media-link,store-id,store-title&page=0&size=31&userIds=$ebayKleinanzeigenUserId&pictureRequired=false&includeTopAds=false&limitTotalResultCount=true", [ + 'headers' => $headers ]); + +$response = json_decode($response->getBody(), true); +$ads = $response["{http://www.ebayclassifiedsgroup.com/schema/ad/v1}ads"]["value"]["ad"]; + +foreach($ads as $ad) { + $element = [ + "title" => $ad["title"]["value"], + "price" => $ad["price"]["amount"]["value"] . " €" + ]; + + foreach($ad["link"] as $link) { + if($link["rel"] == "self-public-website") { + $element["link"] = $link["href"]; + } + } + + if(sizeof($ad["pictures"]["picture"]) > 0) { + foreach($ad["pictures"]["picture"][0]["link"] as $picture) { + if($picture["rel"] == "teaser") { + $element["previewImage"] = str_replace("https://i.ebayimg.com", "/API/ebayimg.php?url=", $picture["href"]); + } + if($picture["rel"] == "XXL") { + + $element["image"] = str_replace("https://i.ebayimg.com", "/API/ebayimg.php?url=", $picture["href"]); + } + } + } + + array_push($responseJSON, $element); +} + +if(isset($_GET["count"])) { + echo sizeof($responseJSON); + die(); +} +echo json_encode($responseJSON); \ No newline at end of file diff --git a/public/API/lib/config.example.php b/public/API/lib/config.example.php index 95c3123..f0c3b8e 100644 --- a/public/API/lib/config.example.php +++ b/public/API/lib/config.example.php @@ -16,4 +16,6 @@ $homeMaxPost = 3; $S3Server = ""; $S3AccessKey = ""; $S3SecretKey = ""; -$S3BucketName = ""; \ No newline at end of file +$S3BucketName = ""; + +$ebayKleinanzeigenUserId = ""; \ No newline at end of file diff --git a/public/index.html b/public/index.html index f66f61a..af38efd 100644 --- a/public/index.html +++ b/public/index.html @@ -22,6 +22,7 @@

Blog

+