midefos/idealista-enhancer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Adding EnlargeMode.

Browse Source 
Some refactor and fixes.
This commit is contained in:
Jorge Bolois Guerrero 2022-10-20 00:36:54 +02:00
parent 17f9668e22
commit 54e46e3d84
11 changed files with 149 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/App.js
View File

@ -12,9 +12,6 @@ export default class App {
Preferences.init();
Styles.add(Styles.APP_STYLES, 'midefos-idealista-app-styles');
if (Preferences.get('darkMode')) {
Styles.add(Styles.DARK_MODE, 'midefos-idealista-dark-mode');
}
new Menu();
new Configuration();

42
src/Configuration.js
View File

@ -1,4 +1,6 @@
import ConfigurationHTML from "./ConfigurationHTML.js";
import DarkMode from "./DarkMode.js";
import EnlargeImages from "./EnlargeImages.js";
import Event from "./Event.js";
import Information from "./Information.js";
import Log from "./Log.js";
@ -8,16 +10,34 @@ export default class Configuration {
constructor() {
document.querySelector('#main-header').innerHTML += ConfigurationHTML.create();
this._initEvents();
this._bindEvents();
this._initData();
this._init();
}
_initEvents() {
static toggle() {
const container = document.querySelector(ConfigurationHTML.CONTAINER_SELECTOR);
if (getComputedStyle(container).display === 'none') {
container.style.display = 'block';
Log.debug(`Opened configuration`);
} else {
container.style.display = 'none';
Log.debug(`Closed configuration`);
}
}
static update() {
DarkMode.apply();
EnlargeImages.apply();
}
_bindEvents() {
Event.click(ConfigurationHTML.SAVE_CONFIG_SELECTOR, () => {
Preferences.save(this._extractConfiguration());
Information.create();
Configuration.toggle();
Configuration.update();
});
Event.change('#max-price-per-meter', (element) => {
@ -26,9 +46,11 @@ export default class Configuration {
});
}
_initData() {
_init() {
const maxPricePerMeter = document.querySelector('#max-price-per-meter');
this._updateItemMeterPrices(maxPricePerMeter.value);
Configuration.update();
}
_updateItemMeterPrices(pricePerMeter) {
@ -43,6 +65,7 @@ export default class Configuration {
return {
enabled: container.querySelector('#enabled').checked,
darkMode: container.querySelector('#darkMode').checked,
enlargeImages: container.querySelector('#enlargeImages').checked,
currentMoney: container.querySelector('#currentMoney').value,
'max-price': container.querySelector('#max-price').value,
'max-price-per-meter': container.querySelector('#max-price-per-meter').value,
@ -63,15 +86,6 @@ export default class Configuration {
}
}
static toggle() {
const container = document.querySelector(ConfigurationHTML.CONTAINER_SELECTOR);
if (getComputedStyle(container).display === 'none') {
container.style.display = 'block';
Log.debug(`Opened configuration`);
} else {
container.style.display = 'none';
Log.debug(`Closed configuration`);
}
}
}

6
src/ConfigurationHTML.js
View File

@ -35,6 +35,12 @@ export default class ConfigurationHTML {
${CheckboxHTML.create('darkMode', Preferences.get('darkMode'))}
<span>Modo oscuro</span>
</label>
<label>
${CheckboxHTML.create('enlargeImages', Preferences.get('enlargeImages'))}
<span>Modo imagen grande</span>
</label>
</div>
<div class='midefos-idealista-card'>

20
src/DarkMode.js Normal file
View File

@ -0,0 +1,20 @@
import Preferences from "./Preferences.js";
import Styles from "./Styles.js";
export default class DarkMode {
static STYLES_KEY = 'midefos-idealista-dark-mode';
static apply() {
if (Preferences.get('darkMode')) {
this._addDarkMode();
} else {
Styles.remove(this.STYLES_KEY);
}
}
static _addDarkMode() {
Styles.add(Styles.DARK_MODE, this.STYLES_KEY);
}
}

20
src/EnlargeImages.js Normal file
View File

@ -0,0 +1,20 @@
import Preferences from "./Preferences.js";
import Styles from "./Styles.js";
export default class EnlargeImages {
static STYLES_KEY = 'midefos-idealista-enlarge-images';
static apply() {
if (Preferences.get('enlargeImages')) {
this._addEnlargeImages();
} else {
Styles.remove(this.STYLES_KEY);
}
}
static _addEnlargeImages() {
Styles.add(Styles.ENLARGE_IMAGES, this.STYLES_KEY);
}
}

2
src/IconSvg.js
View File

@ -1,5 +1,5 @@
export default class IconSvg {
static TICK = `<svg style="color: rgb(51, 209, 122);" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18" zoomAndPan="magnify" viewBox="0 0 30 30.000001" preserveAspectRatio="xMidYMid meet" version="1.0"><defs><clipPath id="id1"><path d="M 2.328125 4.222656 L 27.734375 4.222656 L 27.734375 24.542969 L 2.328125 24.542969 Z M 2.328125 4.222656 " clip-rule="nonzero" fill="#33d17a"></path></clipPath></defs><g clip-path="url(#id1)"><path fill="#33d17a" d="M 27.5 7.53125 L 24.464844 4.542969 C 24.15625 4.238281 23.65625 4.238281 23.347656 4.542969 L 11.035156 16.667969 L 6.824219 12.523438 C 6.527344 12.230469 6 12.230469 5.703125 12.523438 L 2.640625 15.539062 C 2.332031 15.84375 2.332031 16.335938 2.640625 16.640625 L 10.445312 24.324219 C 10.59375 24.472656 10.796875 24.554688 11.007812 24.554688 C 11.214844 24.554688 11.417969 24.472656 11.566406 24.324219 L 27.5 8.632812 C 27.648438 8.488281 27.734375 8.289062 27.734375 8.082031 C 27.734375 7.875 27.648438 7.679688 27.5 7.53125 Z M 27.5 7.53125 " fill-opacity="1" fill-rule="nonzero"></path></g></svg>`;
static TICK = `<svg style="color: rgb(51, 209, 122);" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" zoomAndPan="magnify" viewBox="0 0 30 30.000001" preserveAspectRatio="xMidYMid meet" version="1.0"><defs><clipPath id="id1"><path d="M 2.328125 4.222656 L 27.734375 4.222656 L 27.734375 24.542969 L 2.328125 24.542969 Z M 2.328125 4.222656 " clip-rule="nonzero" fill="#33d17a"></path></clipPath></defs><g clip-path="url(#id1)"><path fill="#33d17a" d="M 27.5 7.53125 L 24.464844 4.542969 C 24.15625 4.238281 23.65625 4.238281 23.347656 4.542969 L 11.035156 16.667969 L 6.824219 12.523438 C 6.527344 12.230469 6 12.230469 5.703125 12.523438 L 2.640625 15.539062 C 2.332031 15.84375 2.332031 16.335938 2.640625 16.640625 L 10.445312 24.324219 C 10.59375 24.472656 10.796875 24.554688 11.007812 24.554688 C 11.214844 24.554688 11.417969 24.472656 11.566406 24.324219 L 27.5 8.632812 C 27.648438 8.488281 27.734375 8.289062 27.734375 8.082031 C 27.734375 7.875 27.648438 7.679688 27.5 7.53125 Z M 27.5 7.53125 " fill-opacity="1" fill-rule="nonzero"></path></g></svg>`;
}

31
src/Item.js
View File

@ -4,6 +4,7 @@ import Locations from './Locations.js';
export default class Item {
static NAME_SELECTOR = '.item-link';
static DESCRIPTION_SELECTOR = '.item-description';
static PRICE_SELECTOR = '.item-price';
static GARAGE_SELECTOR = '.item-parking';
@ -15,6 +16,7 @@ export default class Item {
this._node = htmlNode;
this.name = this._extractName();
this.description = this._extractDescription();
this.locationName = this._extractLocationName();
this.price = this._extractPrice();
@ -22,8 +24,12 @@ export default class Item {
this.priceMeter = this._extractPriceMeter();
this.additionalInfo = this._extractAdditionalInfo();
this.hasGarage = this._extractGarage();
this.hasLift = this._extractLift();
this.isNoLift = this._extractIsNoLift();
this.isExterior = this._extractExterior();
this.isInterior = this._extractInterior();
}
@ -84,10 +90,18 @@ export default class Item {
return this.name.toLowerCase().includes(name.toLowerCase());
}
_descriptionIncludes(description) {
return this.description.toLowerCase().includes(description.toLowerCase());
}
_extractName() {
return this._node.querySelector(Item.NAME_SELECTOR).textContent;
}
_extractDescription() {
return this._node.querySelector(Item.DESCRIPTION_SELECTOR).textContent;
}
_extractLocationName() {
if (this.name.lastIndexOf(',') != -1) {
return this.name
@ -145,14 +159,23 @@ export default class Item {
return this.additionalInfo.includes('con ascensor');
}
_extractExterior() {
_extractIsNoLift() {
if (!this.additionalInfo) return false;
return this.additionalInfo.includes('exterior');
return this.additionalInfo.includes('sin ascensor');
}
_extractExterior() {
const text = 'exterior';
if (this.additionalInfo && this.additionalInfo.includes(text)) return true;
if (this._descriptionIncludes(text)) return true;
return false;
}
_extractInterior() {
if (!this.additionalInfo) return false;
return this.additionalInfo.includes('interior');
const text = 'interior';
if (this.additionalInfo && this.additionalInfo.includes(text)) return true;
if (this._descriptionIncludes(text)) return true;
return false;
}
_extractGarage() {

17
src/ItemHTML.js
View File

@ -33,11 +33,11 @@ export default class ItemHTML {
return this.ERROR_CLASS_NAME;
}
if (this._shouldCheckLift(item) && !item.hasLift) {
if (this._shouldCheckLift(item) && item.isNoLift) {
return this.ERROR_CLASS_NAME;
}
if (this._shouldCheckExterior(item) && !item.isExterior) {
if (this._shouldCheckExterior(item) && item.isInterior) {
return this.ERROR_CLASS_NAME;
}
return this.SUCCESS_CLASS_NAME;
@ -49,6 +49,9 @@ export default class ItemHTML {
html += this._createPercentagesPriceHTML(item);
html += this._createPriceHTML(item);
html += this._createPriceMeterHTML(item);
html += `</div>`;
html += `<div class='${this.INFORMATION_CONTAINER_CLASS_NAME}'>`;
html += this._createGarageHTML(item);
html += this._createLiftHTML(item);
html += this._createExteriorHTML(item);
@ -159,14 +162,12 @@ export default class ItemHTML {
return ``;
}
if (!item.additionalInfo) {
return this._createMissing('Ascensor');
}
if (item.hasLift) {
if (item.isNoLift) {
return this._createError('Ascensor');
} else if (item.hasLift) {
return this._createSuccess('Ascensor');
}
return this._createError('Ascensor');
return this._createMissing('Ascensor');
}
static _shouldCheckLift(item) {

2
src/Menu.js
View File

@ -9,7 +9,7 @@ export default class Menu {
constructor() {
if (this._shouldNotLoad()) return;
const mainContent = document.querySelector('#main-content');
const mainContent = document.querySelector('#main-content, #side-content');
mainContent.innerHTML = MenuHTML.create() + mainContent.innerHTML;
this._initEvents();

1
src/Preferences.js
View File

@ -44,6 +44,7 @@ export default class Preferences {
return {
enabled: true,
darkMode: true,
enlargeImages: false,
currentMoney: 0,
'max-price': 120_000,

38
src/Styles.js
View File

@ -40,7 +40,12 @@ export default class Styles {
.${ItemHTML.INFORMATION_CONTAINER_CLASS_NAME}:last-of-type {
border-bottom: none;
}
}
.${ItemHTML.INFORMATION_CONTAINER_CLASS_NAME} svg {
position: relative;
top: 2px;
}
.${ItemHTML.INFORMATION_CLASS_NAME} {
display: flex;
@ -157,7 +162,7 @@ export default class Styles {
color: white;
}
.id-logo {
.id-logo, .id-logo img {
filter: invert();
}
@ -170,6 +175,35 @@ export default class Styles {
}
`;
static ENLARGE_IMAGES = `
.item-multimedia {
width: 60%;
}
.item-info-container {
width: 40%;
}
.item-multimedia,
.item-gallery,
.item-gallery .mask-wrapper {
height: 300px;
}
.rs-gallery .item-gallery {
height: unset;
}
.description {
height: auto;
}
.description p.ellipsis {
display: block;
position: unset;
}
`;
static add(style, id = null) {
if (id && document.querySelector(`#${id}`)) return;