Skip to content

Commit

Permalink
Break main.js into multiple files
Browse files Browse the repository at this point in the history
  • Loading branch information
StegSchreck committed Feb 15, 2020
1 parent 01707df commit 8a762bf
Show file tree
Hide file tree
Showing 6 changed files with 173 additions and 171 deletions.
26 changes: 26 additions & 0 deletions exposePage.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
'use strict';

function exposePageIsShown() {
return window.location.pathname.startsWith('/expose/');
}

function analyseExposePage() {
const exposeItemAttributes = document.getElementsByClassName('main-criteria-container')[0];
const itemPriceValueElement = exposeItemAttributes.querySelector('.is24qa-kaltmiete') || exposeItemAttributes.querySelector('.is24qa-kaufpreis');
const itemAreaValueElement = exposeItemAttributes.querySelector('.is24qa-flaeche') || exposeItemAttributes.querySelector('.is24qa-wohnflaeche-ca');
const price = extractValue(itemPriceValueElement);
const area = extractValue(itemAreaValueElement);
const pricePerArea = calculatePricePerArea(price, area);
insertPricePerAreaToExposeItem(exposeItemAttributes, pricePerArea);
}

function insertPricePerAreaToExposeItem(exposeItemAttributes, pricePerArea) {
const pricePerAreaText = convertPriceToText(pricePerArea);
const pricePerAreaElement =
`<div class="mainCriteria flex-item">
<div class="is24-value font-semibold">${pricePerAreaText}</div>
<div class="is24-label font-s">Grundpreis</div>
</div>`;

exposeItemAttributes.insertAdjacentHTML('beforeend', pricePerAreaElement);
}
170 changes: 0 additions & 170 deletions main.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,173 +13,3 @@ function main() {
analyseExposePage();
}
}


// SEARCH RESULT PAGE /////////////////////////////////////////////////////////
function searchResultPageIsShown() {
return window.location.pathname.startsWith('/Suche/');
}

function analyseSearchResultPage() {
const resultListItems = document.getElementsByTagName('article');
for (const resultListItem of resultListItems) {
if (isGroupedProject(resultListItem)) {
handleGroup(resultListItem);
continue;
}
if (isHiddenItem(resultListItem)) {
handleHiddenItem(resultListItem);
continue;
}
handleRegularItem(resultListItem);
}
}

function isGroupedProject(resultListItem) {
return resultListItem.classList.contains('result-list-entry--project');
}

function isHiddenItem(resultListItem) {
return resultListItem.classList.contains('hidden-result');
}

function handleRegularItem(resultListItem) {
const resultListItemAttributes = resultListItem.querySelector('[data-is24-qa="attributes"]');
const itemPriceValueElement = resultListItemAttributes.querySelector('dl:first-child dd');
const itemAreaValueElement = resultListItemAttributes.querySelector('dl:nth-child(2) dd');
const price = extractValue(itemPriceValueElement);
const area = extractValue(itemAreaValueElement);
const pricePerArea = calculatePricePerArea(price, area);
insertPricePerAreaToRegularItem(resultListItemAttributes, pricePerArea);
}

function handleHiddenItem(hiddenResultListItem) {
const hiddenResultListItemAttributes = hiddenResultListItem.querySelector('.hidden-result__criteria');
const itemPriceValueElement = hiddenResultListItemAttributes.querySelector('span:first-child');
const itemAreaValueElement = hiddenResultListItemAttributes.querySelector('span:nth-child(2)');
const price = extractValue(itemPriceValueElement);
const area = extractValue(itemAreaValueElement);
const pricePerArea = calculatePricePerArea(price, area);
insertPricePerAreaToHiddenItem(hiddenResultListItemAttributes, pricePerArea);
}

function handleGroup(groupedResultListItem) {
const groupItems = groupedResultListItem.getElementsByClassName('grouped-listing');
for (const groupedItem of groupItems) {
const groupedResultListItemAttributes = groupedItem.querySelector('div:nth-child(3)>a[data-go-to-expose-referrer="RESULT_LIST_LISTING"]');
const itemPriceValueElement = groupedResultListItemAttributes.querySelector('.grouped-listing__criterion:nth-child(2)');
const itemAreaValueElement = groupedResultListItemAttributes.querySelector('.grouped-listing__criterion:nth-child(3)');
const price = extractValue(itemPriceValueElement);
const area = extractValue(itemAreaValueElement);
const pricePerArea = calculatePricePerArea(price, area);
insertPricePerAreaToGroupedItem(groupedResultListItemAttributes, pricePerArea);
}
}

function insertPricePerAreaToRegularItem(resultListItemAttributes, pricePerArea) {
const pricePerAreaText = convertPriceToText(pricePerArea);
const pricePerAreaElement =
`<dl class="grid-item result-list-entry__primary-criterion" role="presentation">
<dd class="font-nowrap font-line-xs">${pricePerAreaText}</dd>
<dt class="font-s onlyLarge">Grundpreis</dt>
</dl>`;

resultListItemAttributes.insertAdjacentHTML('beforeend', pricePerAreaElement);
}

function insertPricePerAreaToHiddenItem(hiddenResultListItemAttributes, pricePerArea) {
const pricePerAreaText = convertPriceToText(pricePerArea);
const pricePerAreaElement =
`<span class="hidden-result__value inline-block">${pricePerAreaText}</span>`;

hiddenResultListItemAttributes.insertAdjacentHTML('beforeend', pricePerAreaElement);
}

function insertPricePerAreaToGroupedItem(groupedResultListItemAttributes, pricePerArea) {
const pricePerAreaText = convertPriceToText(pricePerArea);
const pricePerAreaElement =
`<span class="grouped-listing__criterion font-nowrap">${pricePerAreaText}</span>`;

groupedResultListItemAttributes.insertAdjacentHTML('beforeend', pricePerAreaElement);
}


// SHORTLIST PAGE /////////////////////////////////////////////////////////////
function shortlistPageIsShown() {
return window.location.pathname.startsWith('/merkzettel/');
}

function analyseShortlistPage() {
const shortlistItems = document.getElementsByClassName('shortlist-item');
for (const shortlistItem of shortlistItems) {
handleShortlistItem(shortlistItem);
}
}

function handleShortlistItem(shortlistItem) {
const shortlistItemAttributes = shortlistItem.querySelector('.criteria .content:not(.estimated-cost-widget)');
const itemPriceValueElement = shortlistItemAttributes.querySelector('[data-qa="attr0-value"]');
const itemAreaValueElement = shortlistItemAttributes.querySelector('[data-qa="attr2-value"]');
const price = extractValue(itemPriceValueElement);
const area = extractValue(itemAreaValueElement);
const pricePerArea = calculatePricePerArea(price, area);
insertPricePerAreaToShortlistItem(shortlistItemAttributes, pricePerArea);
}

function insertPricePerAreaToShortlistItem(shortlistItemAttributes, pricePerArea) {
const pricePerAreaText = convertPriceToText(pricePerArea);
const pricePerAreaElement =
`<div id="attr3-115695498" class="grid padding-vertical-s border-top">
<div data-qa="attr3-label" class="grid-item five-tenths font-ellipsis">Grundpreis</div>
<div data-qa="attr2-value" class="grid-item five-tenths font-ellipsis align-right">${pricePerAreaText}</div>
</div>`;

shortlistItemAttributes.insertAdjacentHTML('beforeend', pricePerAreaElement);
}


// EXPOSE PAGE ////////////////////////////////////////////////////////////////
function exposePageIsShown() {
return window.location.pathname.startsWith('/expose/');
}

function analyseExposePage() {
const exposeItemAttributes = document.getElementsByClassName('main-criteria-container')[0];
const itemPriceValueElement = exposeItemAttributes.querySelector('.is24qa-kaltmiete') || exposeItemAttributes.querySelector('.is24qa-kaufpreis');
const itemAreaValueElement = exposeItemAttributes.querySelector('.is24qa-flaeche') || exposeItemAttributes.querySelector('.is24qa-wohnflaeche-ca');
const price = extractValue(itemPriceValueElement);
const area = extractValue(itemAreaValueElement);
const pricePerArea = calculatePricePerArea(price, area);
insertPricePerAreaToExposeItem(exposeItemAttributes, pricePerArea);
}

function insertPricePerAreaToExposeItem(exposeItemAttributes, pricePerArea) {
const pricePerAreaText = convertPriceToText(pricePerArea);
const pricePerAreaElement =
`<div class="mainCriteria flex-item">
<div class="is24-value font-semibold">${pricePerAreaText}</div>
<div class="is24-label font-s">Grundpreis</div>
</div>`;

exposeItemAttributes.insertAdjacentHTML('beforeend', pricePerAreaElement);
}


// UTIL ///////////////////////////////////////////////////////////////////////
function calculatePricePerArea(price, area) {
return (price / area).toFixed(2);
}

function extractValue(itemValueElement) {
const itemValue = itemValueElement.textContent
.replace('€', '')
.replace('m²', '')
.replace('.', '')
.replace(',', '.')
.trim();
return parseFloat(itemValue);
}

function convertPriceToText(pricePerArea) {
return pricePerArea.toString().replace('.', ',') + " €/m²";
}
8 changes: 7 additions & 1 deletion manifest.json
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,13 @@
{
"matches": ["https://*.immobilienscout24.de/*"],
"run_at": "document_end",
"js": ["main.js"]
"js": [
"main.js",
"searchResultPage.js",
"shortlistPage.js",
"exposePage.js",
"util.js"
]
}
]
}
88 changes: 88 additions & 0 deletions searchResultPage.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,88 @@
'use strict';

function searchResultPageIsShown() {
return window.location.pathname.startsWith('/Suche/');
}

function analyseSearchResultPage() {
const resultListItems = document.getElementsByTagName('article');
for (const resultListItem of resultListItems) {
if (isGroupedProject(resultListItem)) {
handleGroup(resultListItem);
continue;
}
if (isHiddenItem(resultListItem)) {
handleHiddenItem(resultListItem);
continue;
}
handleRegularItem(resultListItem);
}
}

function isGroupedProject(resultListItem) {
return resultListItem.classList.contains('result-list-entry--project');
}

function isHiddenItem(resultListItem) {
return resultListItem.classList.contains('hidden-result');
}

function handleRegularItem(resultListItem) {
const resultListItemAttributes = resultListItem.querySelector('[data-is24-qa="attributes"]');
const itemPriceValueElement = resultListItemAttributes.querySelector('dl:first-child dd');
const itemAreaValueElement = resultListItemAttributes.querySelector('dl:nth-child(2) dd');
const price = extractValue(itemPriceValueElement);
const area = extractValue(itemAreaValueElement);
const pricePerArea = calculatePricePerArea(price, area);
insertPricePerAreaToRegularItem(resultListItemAttributes, pricePerArea);
}

function handleHiddenItem(hiddenResultListItem) {
const hiddenResultListItemAttributes = hiddenResultListItem.querySelector('.hidden-result__criteria');
const itemPriceValueElement = hiddenResultListItemAttributes.querySelector('span:first-child');
const itemAreaValueElement = hiddenResultListItemAttributes.querySelector('span:nth-child(2)');
const price = extractValue(itemPriceValueElement);
const area = extractValue(itemAreaValueElement);
const pricePerArea = calculatePricePerArea(price, area);
insertPricePerAreaToHiddenItem(hiddenResultListItemAttributes, pricePerArea);
}

function handleGroup(groupedResultListItem) {
const groupItems = groupedResultListItem.getElementsByClassName('grouped-listing');
for (const groupedItem of groupItems) {
const groupedResultListItemAttributes = groupedItem.querySelector('div:nth-child(3)>a[data-go-to-expose-referrer="RESULT_LIST_LISTING"]');
const itemPriceValueElement = groupedResultListItemAttributes.querySelector('.grouped-listing__criterion:nth-child(2)');
const itemAreaValueElement = groupedResultListItemAttributes.querySelector('.grouped-listing__criterion:nth-child(3)');
const price = extractValue(itemPriceValueElement);
const area = extractValue(itemAreaValueElement);
const pricePerArea = calculatePricePerArea(price, area);
insertPricePerAreaToGroupedItem(groupedResultListItemAttributes, pricePerArea);
}
}

function insertPricePerAreaToRegularItem(resultListItemAttributes, pricePerArea) {
const pricePerAreaText = convertPriceToText(pricePerArea);
const pricePerAreaElement =
`<dl class="grid-item result-list-entry__primary-criterion" role="presentation">
<dd class="font-nowrap font-line-xs">${pricePerAreaText}</dd>
<dt class="font-s onlyLarge">Grundpreis</dt>
</dl>`;

resultListItemAttributes.insertAdjacentHTML('beforeend', pricePerAreaElement);
}

function insertPricePerAreaToHiddenItem(hiddenResultListItemAttributes, pricePerArea) {
const pricePerAreaText = convertPriceToText(pricePerArea);
const pricePerAreaElement =
`<span class="hidden-result__value inline-block">${pricePerAreaText}</span>`;

hiddenResultListItemAttributes.insertAdjacentHTML('beforeend', pricePerAreaElement);
}

function insertPricePerAreaToGroupedItem(groupedResultListItemAttributes, pricePerArea) {
const pricePerAreaText = convertPriceToText(pricePerArea);
const pricePerAreaElement =
`<span class="grouped-listing__criterion font-nowrap">${pricePerAreaText}</span>`;

groupedResultListItemAttributes.insertAdjacentHTML('beforeend', pricePerAreaElement);
}
33 changes: 33 additions & 0 deletions shortlistPage.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
'use strict';

function shortlistPageIsShown() {
return window.location.pathname.startsWith('/merkzettel/');
}

function analyseShortlistPage() {
const shortlistItems = document.getElementsByClassName('shortlist-item');
for (const shortlistItem of shortlistItems) {
handleShortlistItem(shortlistItem);
}
}

function handleShortlistItem(shortlistItem) {
const shortlistItemAttributes = shortlistItem.querySelector('.criteria .content:not(.estimated-cost-widget)');
const itemPriceValueElement = shortlistItemAttributes.querySelector('[data-qa="attr0-value"]');
const itemAreaValueElement = shortlistItemAttributes.querySelector('[data-qa="attr2-value"]');
const price = extractValue(itemPriceValueElement);
const area = extractValue(itemAreaValueElement);
const pricePerArea = calculatePricePerArea(price, area);
insertPricePerAreaToShortlistItem(shortlistItemAttributes, pricePerArea);
}

function insertPricePerAreaToShortlistItem(shortlistItemAttributes, pricePerArea) {
const pricePerAreaText = convertPriceToText(pricePerArea);
const pricePerAreaElement =
`<div id="attr3-115695498" class="grid padding-vertical-s border-top">
<div data-qa="attr3-label" class="grid-item five-tenths font-ellipsis">Grundpreis</div>
<div data-qa="attr2-value" class="grid-item five-tenths font-ellipsis align-right">${pricePerAreaText}</div>
</div>`;

shortlistItemAttributes.insertAdjacentHTML('beforeend', pricePerAreaElement);
}
19 changes: 19 additions & 0 deletions util.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
'use strict';

function calculatePricePerArea(price, area) {
return (price / area).toFixed(2);
}

function extractValue(itemValueElement) {
const itemValue = itemValueElement.textContent
.replace('€', '')
.replace('m²', '')
.replace('.', '')
.replace(',', '.')
.trim();
return parseFloat(itemValue);
}

function convertPriceToText(pricePerArea) {
return pricePerArea.toString().replace('.', ',') + " €/m²";
}

0 comments on commit 8a762bf

Please sign in to comment.