hoodcms 6.0.6 → 6.0.9

package/src/ts/app/PropertyService.ts

@@ -4,199 +4,205 @@ import { Alerts } from "../core/Alerts";
 import { DataList } from "../core/DataList";
 
 declare global {
-    namespace google.maps {
-        interface Marker {
-            info: string;
-        }
-    }
+	namespace google.maps {
+		interface Marker {
+			info: string;
+		}
+	}
 }
 
 export interface PropertyServiceOptions {
-
-    listElementId?: string;
-    mapListElementId?: string;
-    mapElementId?: string;
-    
-    /**
-     * Called before the data is fetched.
-     */
-    onListLoad?: (sender?: HTMLElement) => void;
-
-    /**
-     * Called before the fetched HTML is rendered to the list. Must return the data back to datalist to render.
-     */
-    onListRender?: (html: string, sender?: HTMLElement) => string;
-    /**
-     * Called before the data is fetched.
-     */
-    onMapLoad?: (data: string, sender?: HTMLElement) => void;
-
-    /**
-     * Called before the fetched HTML is rendered to the list. Must return the data back to datalist to render.
-     */
-    onMapRender?: (sender?: HTMLElement) => string;
-
+	listElementId?: string;
+	mapListElementId?: string;
+	mapElementId?: string;
+	mapLocationListId?: string;
+
+	/**
+	 * Called before the data is fetched.
+	 */
+	onListLoad?: (sender?: HTMLElement) => void;
+
+	/**
+	 * Called before the fetched HTML is rendered to the list. Must return the data back to datalist to render.
+	 */
+	onListRender?: (html: string, sender?: HTMLElement) => string;
+	/**
+	 * Called before the data is fetched.
+	 */
+	onMapLoad?: (data: string, sender?: HTMLElement) => void;
+
+	/**
+	 * Called before the fetched HTML is rendered to the list. Must return the data back to datalist to render.
+	 */
+	onMapRender?: (sender?: HTMLElement) => string;
+
+	/**
+	 * Renders the popup on the property map, location is the property map marker object sent from the server for that property.
+	 */
+	renderPropertyPopup?: (location?: any) => string;
 }
 
 export class PropertyService {
-    options: PropertyServiceOptions = {
-        listElementId: 'property-list',
-        mapListElementId: 'property-map-list',
-        mapElementId: 'property-map'
-    };
-
-    constructor(options?: PropertyServiceOptions) {
-
-        this.options = { ...this.options, ...options };
-
-        this.initList();
-    }
-
-    element: HTMLElement;
-    list: DataList;
-    mapListElement: HTMLElement;
-    mapList: DataList;
-    map: google.maps.Map = null;
-    center: google.maps.LatLngLiteral = { lat: 30, lng: -110 };
-    mapElement: HTMLElement;
-    markers: any[];
-
-    initList() {
-
-        this.element = document.getElementById(this.options.listElementId);
-        if (!this.element) {
-            return;
+	options: PropertyServiceOptions = {
+		listElementId: "property-list",
+		mapListElementId: "property-map-list",
+		mapElementId: "property-map",
+		mapLocationListId: "property-map-locations",
+
+		renderPropertyPopup: function (location: any): string {
+			return `<div class="card border-0" style="max-width:300px">
+                        <div style="background-image:url(${location.ImageUrl})" class="rounded img-full img img-wide"></div>
+                        <div class="card-body border-0">
+                            <p style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
+                                <strong>${location.Address1}, ${location.Postcode}</strong>
+                            </p>
+                            <p>${location.Description}</p>
+                            <a href="${location.MarkerUrl}" class="btn btn-block btn-primary">Find out more...</a>
+                        </div>
+                    </div>`;
+		},
+	};
+
+	constructor(options?: PropertyServiceOptions) {
+		this.options = { ...this.options, ...options };
+
+		this.initList();
+	}
+
+	element: HTMLElement;
+	list: DataList;
+	mapListElement: HTMLElement;
+	mapList: DataList;
+	map: google.maps.Map = null;
+	center: google.maps.LatLngLiteral = { lat: 30, lng: -110 };
+	mapElement: HTMLElement;
+	markers: any[];
+
+	initList() {
+		this.element = document.getElementById(this.options.listElementId);
+		if (!this.element) {
+			return;
+		}
+
+		this.list = new DataList(this.element, {
+			onLoad: function (this: PropertyService, sender: HTMLElement = null) {
+				if (this.options.onListLoad) {
+					this.options.onListLoad(sender);
+				}
+			}.bind(this),
+			onComplete: function (this: PropertyService, data: string, sender: HTMLElement = null) {
+				if (this.options.onListRender) {
+					this.options.onListRender(data, sender);
+				}
+				Alerts.log("Finished loading property list.", "info");
+			}.bind(this),
+		});
+	}
+
+	initMapList() {
+		this.mapListElement = document.getElementById(this.options.mapListElementId);
+		if (!this.mapElement) {
+			return;
+		}
+
+		this.mapList = new DataList(this.mapListElement, {
+			onComplete: function (this: PropertyService, data: string, sender: HTMLElement = null) {
+				if (this.options.onMapLoad) {
+					this.options.onMapLoad(data, sender);
+				}
+				Alerts.log("Finished loading map list.", "info");
+				this.reloadMarkers();
+			}.bind(this),
+		});
+	}
+
+	initMap() {
+		this.mapElement = document.getElementById(this.options.mapElementId);
+		if (!this.mapElement) {
+			return;
+		}
+
+		this.center = { lat: +this.mapElement.dataset.lat, lng: +this.mapElement.dataset.long };
+
+        let scrollwheel = false;
+        if (this.mapElement.dataset.scrollwheel === "true") {
+            scrollwheel = true;
         }
+		this.map = new google.maps.Map(this.mapElement, {
+			zoom: +this.mapElement.dataset.zoom || 15,
+			center: this.center,
+			scrollwheel: scrollwheel,
+		});
 
-        this.list = new DataList(this.element, {
-            onLoad: function (this: PropertyService, sender: HTMLElement = null) {
-
-                if (this.options.onListLoad) {
-                    this.options.onListLoad(sender);
-                }
-
-            }.bind(this),
-            onComplete: function (this: PropertyService, data: string, sender: HTMLElement = null) {
+		$(window).resize(
+			function (this: PropertyService) {
+				google.maps.event.trigger(this.map, "resize");
+			}.bind(this)
+		);
 
-                if (this.options.onListRender) {
-                    this.options.onListRender(data, sender);
-                }
-                Alerts.log('Finished loading property list.', 'info');
+		google.maps.event.trigger(this.map, "resize");
 
-            }.bind(this)
-        });
+		this.initMapList();
+	}
 
-    }
-
-    initMapList() {
-
-        this.mapListElement = document.getElementById(this.options.mapListElementId);
-        if (!this.mapElement) {
-            return;
-        }
+	reloadMarkers() {
+		var infowindow: google.maps.InfoWindow = null;
 
-        this.mapList = new DataList(this.mapListElement, {
-            onComplete: function (this: PropertyService, data: string, sender: HTMLElement = null) {
+		if (!this.mapElement) {
+			return;
+		}
 
-                if (this.options.onMapLoad) {
-                    this.options.onMapLoad(data, sender);
-                }
-                Alerts.log('Finished loading map list.', 'info');
-                this.reloadMarkers();
+		var map = this.map;
 
-            }.bind(this)
-        });
-    }
+		if (this.markers) {
+			for (var i = 0; i < this.markers.length; i++) {
+				this.markers[i].setMap(null);
+			}
+		}
 
-    initMap() {
+		this.markers = [];
 
-        this.mapElement = document.getElementById(this.options.mapElementId);
-        if (!this.mapElement) {
+        var locationsElement = document.getElementById(this.options.mapLocationListId);
+        if (!locationsElement) {
             return;
         }
 
-        this.center = { lat: +this.mapElement.dataset.lat, lng: +this.mapElement.dataset.long };
-
-        this.map = new google.maps.Map(this.mapElement, {
-            zoom: +this.mapElement.dataset.zoom || 15,
-            center: this.center,
-            scrollwheel: false
-        });
-
-        $(window).resize(function (this: PropertyService) {
-            google.maps.event.trigger(this.map, 'resize');
-        }.bind(this));
-
-        google.maps.event.trigger(this.map, 'resize');
-
-        this.initMapList();
-
-    }
-
-    reloadMarkers() {
-
-        var infowindow: google.maps.InfoWindow = null;
-
-        if (!this.mapElement) {
-            return;
-        }
-
-        var map = this.map;
-
-        if (this.markers) {
-            for (var i = 0; i < this.markers.length; i++) {
-                this.markers[i].setMap(null);
-            }
-        }
-
-        this.markers = [];
-
-        var locations = $("#property-map-locations").data('locations');
-
-        locations.map(function (this: PropertyService, location: any, i: number) {
-
-            let marker = new google.maps.Marker({
-                position: new google.maps.LatLng(+location.Latitude, +location.Longitude),
-                map: this.map,
-                optimized: true // makes SVG icons work in IE
-            });
-
-            if (this.mapElement.dataset.marker) {
-                marker.setIcon(this.mapElement.dataset.marker);
-            }
-
-            marker.info = `<div class="card border-0" style="max-width:300px">
-    <div style="background-image:url(${location.ImageUrl})" class="rounded img-full img img-wide"></div>
-    <div class="card-body border-0">
-        <p style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
-            <strong>${location.Address1}, ${location.Postcode}</strong>
-        </p>
-        <p>${location.Description}</p>
-        <a href="${location.MarkerUrl}" class="btn btn-block btn-primary">Find out more...</a>
-    </div>
-</div>`;
-
-            marker.addListener("click", () => {
-                if (infowindow) {
-                    infowindow.close();
-                }
-                infowindow = new google.maps.InfoWindow({
-                    content: marker.info
-                });
-                infowindow.open({
-                    anchor: marker,
-                    map,
-                    shouldFocus: false,
-                });
-            });
-
-            this.markers.push(marker);
-
-        }.bind(this));
-
-
-        if (this.options.onMapRender) {
-            this.options.onMapRender();
-        }
-    }
+		var locations = JSON.parse(locationsElement.dataset.locations);
+
+		locations.map(
+			function (this: PropertyService, location: any, i: number) {
+				let marker = new google.maps.Marker({
+					position: new google.maps.LatLng(+location.Latitude, +location.Longitude),
+					map: this.map,
+					optimized: true, // makes SVG icons work in IE
+				});
+
+				if (this.mapElement.dataset.marker) {
+					marker.setIcon(this.mapElement.dataset.marker);
+				}
+
+				marker.info = this.options.renderPropertyPopup(location);
+
+				marker.addListener("click", () => {
+					if (infowindow) {
+						infowindow.close();
+					}
+					infowindow = new google.maps.InfoWindow({
+						content: marker.info,
+					});
+					infowindow.open({
+						anchor: marker,
+						map,
+						shouldFocus: false,
+					});
+				});
+
+				this.markers.push(marker);
+			}.bind(this)
+		);
+
+		if (this.options.onMapRender) {
+			this.options.onMapRender();
+		}
+	}
 }

package/src/ts/core/Media.ts

@@ -174,7 +174,7 @@ export class MediaService {
             thumbnailHeight: 80,
             parallelUploads: 5,
             paramName: 'files',
-            acceptedFiles: $("#media-upload").data('types') || ".png,.jpg,.jpeg,.gif",
+            acceptedFiles: $("#media-upload").data('types') || ".png,.jpg,.jpeg,.gif,.pdf",
             autoProcessQueue: true, // Make sure the files aren't queued until manually added
             previewsContainer: false, // Define the container to display the previews
             clickable: "#media-add", // Define the element that should be used as click trigger to select files.

package/src/ts/core/Validator.ts

@@ -3,120 +3,119 @@ import { Inline } from "./Inline";
 import { Response } from "./Response";
 
 export interface ValidatorOptions {
-    errorAlert?: string;
+	errorAlert?: string;
 
-    /**
-     * Called before the submit of the form data, you can return the data to be serialised.
-     */
-    onSubmit?: (sender: Validator) => void;
+	/**
+	 * Called before the submit of the form data, you can return the data to be serialised.
+	 */
+	onSubmit?: (sender: Validator) => void;
 
-    /**
-     * Called when submit is complete.
-     */
-    onComplete?: (data: Response, sender?: Validator) => void;
+	/**
+	 * Called when submit is complete.
+	 */
+	onComplete?: (data: Response, sender?: Validator) => void;
 
-    /**
-     * Called when an error occurs.
-     */
-    onError?: (jqXHR: any, textStatus: any, errorThrown: any) => void;
+	/**
+	 * Called when an error occurs.
+	 */
+	onError?: (jqXHR: any, textStatus: any, errorThrown: any) => void;
 
-    serializationFunction?: () => string;
-
-    useAjax?: boolean;
+	serializationFunction?: () => string;
 
+	useAjax?: boolean;
 }
 
 export class Validator {
-    element: HTMLFormElement;
-    options: ValidatorOptions = {
-        errorAlert: 'There are errors on the form, please check your answers and try again.',
-        useAjax: true
-    };
-
-    /**
-      * @param element The datalist element. The element must have a data-url attribute to connect to a feed.
-      */
-    constructor(element: HTMLFormElement, options: ValidatorOptions) {
-
-        this.element = element;
-        if (!this.element) {
-            return;
-        }
-
-        this.options.serializationFunction = function (this: Validator) {
-            let rtn = $(this.element).serialize();
-            return rtn;
-        }.bind(this);
-
-        this.options = { ...this.options, ...options };
-
-        this.element.addEventListener('submit', function (this: Validator, e: Event) {
-            e.preventDefault();
-            e.stopImmediatePropagation();
-            this.submitForm();
-        }.bind(this));
-        var tag = '[data-submit="#' + this.element.id + '"]';
-        let submitButtons = $(tag);
-        if (submitButtons) {
-            submitButtons.on('click', function (this: Validator, e: Event) {
-                e.preventDefault();
-                e.stopImmediatePropagation();
-                let exit = $(e.currentTarget).data('exit');                
-                if (exit) {
-                    $(this.element).find("input#exit").remove();
-                    $("<input id='exit' />").attr("type", "hidden")
-                        .attr("name", "exit")
-                        .attr("value", "true")
-                        .appendTo(this.element);
-                }
-                this.submitForm();
-            }.bind(this));
-        }
-    }
-
-    submitForm() {
-        this.element.classList.add('was-validated');
-        if (this.element.checkValidity()) {
-
-            this.element.classList.add('loading');
-
-            let checkboxes = this.element.querySelector('input[type=checkbox]');
-            if (checkboxes) {
-                Array.prototype.slice.call(checkboxes)
-                    .forEach(function (checkbox: HTMLInputElement) {
-                        if ($(this).is(':checked')) {
-                            $(this).val('true');
-                        }
-                    });
-            }
-
-            if (this.options.onSubmit) {
-                this.options.onSubmit(this);
-            }
-
-            if (this.options.useAjax) {
-
-                let formData = this.options.serializationFunction();
-
-                $.post(this.element.action, formData, function (this: Validator, data: any) {
-                    if (this.options.onComplete) {
-                        this.options.onComplete(data, this);
-                    }
-                }.bind(this))
-                    .fail(this.options.onError ?? Inline.handleError);
-
-            } else {
-
-                this.element.submit();
-
-            }
-
-        } else {
-
-            if (this.options.errorAlert) {
-                Alerts.error(this.options.errorAlert, null, 5000);
-            }
-        }
-
-    }
-}
+	element: HTMLFormElement;
+	options: ValidatorOptions = {
+		errorAlert: "There are errors on the form, please check your answers and try again.",
+		useAjax: true,
+	};
+
+	/**
+	 * @param element The datalist element. The element must have a data-url attribute to connect to a feed.
+	 */
+	constructor(element: HTMLFormElement, options: ValidatorOptions) {
+		this.element = element;
+		if (!this.element) {
+			return;
+		}
+
+		this.options.serializationFunction = function (this: Validator) {
+			let rtn = $(this.element).serialize();
+			return rtn;
+		}.bind(this);
+
+		this.options = { ...this.options, ...options };
+
+		this.element.addEventListener(
+			"submit",
+			function (this: Validator, e: Event) {
+				e.preventDefault();
+				e.stopImmediatePropagation();
+				this.submitForm();
+			}.bind(this)
+		);
+		var tag = '[data-submit="#' + this.element.id + '"]';
+		let submitButtons = $(tag);
+		if (submitButtons) {
+			submitButtons.on(
+				"click",
+				function (this: Validator, e: Event) {
+					e.preventDefault();
+					e.stopImmediatePropagation();
+					let exit = $(e.currentTarget).data("exit");
+					if (exit) {
+						$(this.element).find("input#exit").remove();
+						$("<input id='exit' />").attr("type", "hidden").attr("name", "exit").attr("value", "true").appendTo(this.element);
+					}
+					this.submitForm();
+				}.bind(this)
+			);
+		}
+	}
+
+	submitForm() {
+		this.element.classList.add("was-validated");
+		if (this.element.checkValidity()) {
+			this.element.classList.add("loading");
+
+			let checkboxes = this.element.querySelector("input[type=checkbox]");
+			if (checkboxes) {
+				Array.prototype.slice.call(checkboxes).forEach(function (checkbox: HTMLInputElement) {
+					if ($(this).is(":checked")) {
+						$(this).val("true");
+					}
+				});
+			}
+
+			if (this.options.onSubmit) {
+				this.options.onSubmit(this);
+			}
+
+			if (this.options.useAjax) {
+				let formData = this.options.serializationFunction();
+
+				$.post(
+					this.element.action,
+					formData,
+					function (this: Validator, data: any) {
+						if (this.options.onComplete) {
+							this.options.onComplete(data, this);
+						}
+					}.bind(this)
+				)
+					.fail(this.options.onError ?? Inline.handleError)
+					.always(function (this: Validator) {
+						this.element.classList.remove("loading");
+					}.bind(this));
+			} else {
+				this.element.submit();
+			}
+		} else {
+			if (this.options.errorAlert) {
+				Alerts.error(this.options.errorAlert, null, 5000);
+			}
+		}
+	}
+}

package/src/ts/extensions/jqueryExtensions.ts

@@ -4,9 +4,9 @@ import { Alerts } from '../core/Alerts';
 declare global {
     interface JQuery {
         exists(): number;
-        restrictToSlug(): void;
-        restrictToPageSlug(): void;
-        restrictToMetaSlug(): void;
+        restrictToSlug(restrictPattern?: RegExp): void;
+        restrictToPageSlug(restrictPattern?: RegExp): void;
+        restrictToMetaSlug(restrictPattern?: RegExp): void;
         characterCounter(): void;
         warningAlert(): void;
     }