${this._createPercentagePriceHTML(item)}
${this._createPriceHTML(item)}
${this._createPriceMeterHTML(item)}
@@ -15,7 +19,7 @@ export default class ItemHTML {
}
static _createPercentagePriceHTML(item) {
- if (!Configuration.get('percentages')) return ``;
+ if (!Preferences.get('percentages')) return ``;
const twentyPercent = Math.round(item.price * 20 / 100);
const thirtyPercent = Math.round(item.price * 30 / 100);
@@ -28,20 +32,20 @@ export default class ItemHTML {
static _createPriceHTML(item) {
- const desiredPrice = Configuration.get('max-price');
+ const desiredPrice = Preferences.get('max-price');
const desiredTwentyFivePercentMore = Math.round(desiredPrice * 1.25);
if (item.price <= desiredPrice) {
- return `
✓ Precio`;
+ return this._createSuccess('Precio');
} else if (item.price <= desiredTwentyFivePercentMore) {
- return `
✓ Precio`;
+ return this._createWarning('Precio');
}
- return `
X Precio`;
+ return this._createError('Precio');
}
static _createPriceMeterHTML(item) {
- const desiredPricePerMeter = Configuration.get('max-price-per-meter');
+ const desiredPricePerMeter = Preferences.get('max-price-per-meter');
const desiredTwentyFivePercentMore = Math.round(desiredPricePerMeter * 1.25);
if (item.priceMeter <= desiredPricePerMeter) {
@@ -53,31 +57,48 @@ export default class ItemHTML {
}
static _createLiftHTML(item) {
- if (!Configuration.get('lift')) return ``;
+ if (!Preferences.get('lift')) return ``;
if (!item.additionalInfo) {
if (item.isFlat()) return ``;
- return this.__createIndividual('?', 'Ascensor', 'warning');
+ return this._createMissing('Ascensor');
}
if (item.hasLift) {
- return this.__createIndividual('✓', 'Ascensor', 'warning');
+ return this._createSuccess('Ascensor',);
}
- return this.__createIndividual('X', 'Ascensor', 'error');
+ return this._createError('Ascensor');
}
static _createInteriorHTML(item) {
- if (!Configuration.get('exterior')) return ``;
+ if (!Preferences.get('exterior')) return ``;
if (!item.additionalInfo) {
if (!item.isFlat()) return ``;
- return `
? Exterior`
+ return this._createMissing('Exterior');
}
if (item.isExterior) {
- return `
✓ Exterior`
+ return this._createSuccess('Exterior');
}
- return `
X Exterior`;
+ return this._createError('Exterior');
+ }
+
+ static _createSuccess(infoText) {
+ return this.__createIndividual('✓', infoText, 'success');
+ }
+
+
+ static _createWarning(infoText) {
+ return this.__createIndividual('✓', infoText, 'warning');
+ }
+
+ static _createMissing(infoText) {
+ return this.__createIndividual('?', infoText, 'warning');
+ }
+
+ static _createError(infoText) {
+ return this.__createIndividual('✓', infoText, 'error');
}
static __createIndividual(strongText, infoText, className = '') {
diff --git a/src/Log.js b/src/Log.js
new file mode 100644
index 0000000..0b82f64
--- /dev/null
+++ b/src/Log.js
@@ -0,0 +1,7 @@
+export default class Log {
+
+ static debug(message) {
+ console.log(`%c [DEBUG] ${message} `, 'background: blue; color: white; font-size: 13px;');
+ }
+
+}
\ No newline at end of file
diff --git a/src/Menu.js b/src/Menu.js
new file mode 100644
index 0000000..5d69cc2
--- /dev/null
+++ b/src/Menu.js
@@ -0,0 +1,32 @@
+import Configuration from "./Configuration.js";
+import ConfigurationHTML from "./ConfigurationHTML.js";
+import Event from "./Event.js";
+import Information from "./Information.js";
+import MenuHTML from "./MenuHTML.js";
+
+export default class Menu {
+
+ constructor() {
+ if (this._shouldNotLoad()) return;
+
+ const mainContent = document.querySelector('#main-content');
+ mainContent.innerHTML = MenuHTML.create() + mainContent.innerHTML;
+
+ this._initEvents();
+ }
+
+ _initEvents() {
+ Event.click(MenuHTML.RELOAD_INFORMATION_SELECTOR, () => {
+ Information.create();
+ })
+
+ Event.click(ConfigurationHTML.OPEN_CONFIG_SELECTOR, () => {
+ Configuration.toggle();
+ });
+ }
+
+ _shouldNotLoad() {
+ return window.location.href.includes('mapa-google');
+ }
+
+}
\ No newline at end of file
diff --git a/src/MenuHTML.js b/src/MenuHTML.js
new file mode 100644
index 0000000..820411b
--- /dev/null
+++ b/src/MenuHTML.js
@@ -0,0 +1,23 @@
+import ConfigurationHTML from "./ConfigurationHTML.js";
+
+export default class MenuHTML {
+
+ static CONTAINER_CLASS_NAME = 'midefos-idealista-menu';
+ static get CONTAINER_SELECTOR() {
+ return `.${this.CONTAINER_CLASS_NAME}`;
+ }
+
+ static RELOAD_INFORMATION_CLASS_NAME = 'reload-information';
+ static get RELOAD_INFORMATION_SELECTOR() {
+ return `.${this.RELOAD_INFORMATION_CLASS_NAME}`;
+ }
+
+ static create() {
+ return `
+
+
+
+
`;
+ }
+
+}
\ No newline at end of file
diff --git a/src/Preferences.js b/src/Preferences.js
new file mode 100644
index 0000000..efab382
--- /dev/null
+++ b/src/Preferences.js
@@ -0,0 +1,48 @@
+import Log from "./Log.js";
+
+export default class Preferences {
+
+ static NAME = 'midefos-idealista';
+
+ static _current;
+
+ static init() {
+ this._current = this._getConfig();
+ }
+
+ static get(key) {
+ const config = this._getConfig();
+ return config[key];
+ }
+
+ static save(config) {
+ window.localStorage.setItem(this.NAME, JSON.stringify(config));
+ this._current = config;
+ Log.debug('Saved preferences')
+ }
+
+ static _getConfig() {
+ const storageConfig = this._getFromLocalStorage();
+ if (!storageConfig) return this._default();
+ return storageConfig;
+ }
+
+ static _getFromLocalStorage() {
+ const storageConfig = window.localStorage.getItem(this.NAME);
+ if (!storageConfig) return null;
+ return JSON.parse(storageConfig);
+ }
+
+ static _default() {
+ return {
+ enabled: true,
+ percentages: true,
+ garage: false,
+ exterior: true,
+ lift: true,
+ 'max-price': 120_000,
+ 'max-price-per-meter': 1_500
+ }
+ }
+
+}
\ No newline at end of file
diff --git a/src/Styles.js b/src/Styles.js
new file mode 100644
index 0000000..9c704e4
--- /dev/null
+++ b/src/Styles.js
@@ -0,0 +1,64 @@
+import ConfigurationHTML from "./ConfigurationHTML.js";
+import ItemHTML from "./ItemHTML.js";
+import MenuHTML from "./MenuHTML.js";
+
+export default class Styles {
+
+ static APP_STYLES = `
+ .${ItemHTML.CONTAINER_CLASS_NAME} {
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+
+ width: 100%;
+ height: 55px;
+ margin-top: 5px;
+
+ background-color: white;
+ box-shadow: 0 3px 6px rgba(225, 245, 110, 0.16), 0 3px 6px rgba(225, 245, 110, 0.23);
+
+ }
+ .${MenuHTML.CONTAINER_CLASS_NAME} {
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+
+ width: 100%;
+ height: 40px;
+
+ background-color: white;
+ box-shadow: 0 3px 6px rgba(225, 245, 110, 0.16), 0 3px 6px rgba(225, 245, 110, 0.23);
+ }
+ .${ConfigurationHTML.CONTAINER_CLASS_NAME} {
+ display: none;
+ position: fixed;
+ z-index: 3;
+
+ background-color: rgba(225, 245, 110, 0.90);
+ width: 95%;
+ height: 95%;
+ top: 2.5%;
+ left: 2.5%;
+
+ padding: 2rem;
+ }
+
+ .success {
+ color: darkgreen;
+ }
+ .warning {
+ color: darkorange;
+ }
+ .error {
+ color: darkred;
+ }
+ `;
+
+ static add(style = null) {
+ if (!style) style = this.APP_STYLES;
+ const styleNode = document.createElement('style');
+ styleNode.textContent = style;
+ document.head.appendChild(styleNode);
+ }
+
+}
\ No newline at end of file