Last updated
// Open centered popup
dphelper.window.center({
url: 'https://example.com',
title: 'Popup Window',
name: 'myPopup',
w: 800, // width
h: 600 // height
});
// Useful for:
// - Video players
// - Image galleries
// - Login/signup modals
// - External content// Warn user before leaving with unsaved changes
dphelper.window.onBeforeUnLoad('#myForm');
// When user tries to leave:
// - Fills out form
// - Clicks external link
// - Closes tab
// -> Shows confirmation dialog
// Clean form detection
// <input id="myForm">
// Warning only shows if form has content// Get current zoom level
const zoom = dphelper.window.getZoom();
console.log(zoom); // 1 (or 1.5, 2, etc.)
// Get specific element zoom
const elZoom = dphelper.window.getZoom('#container');
console.log(elZoom);
// Set zoom level (1 = 100%)
dphelper.window.setZoom('#container', 1.5); // 150%
dphelper.window.setZoom('#container', 2); // 200%
dphelper.window.setZoom('#container', 0.5); // 50%
// Reset to default
dphelper.window.setZoom('#container', 1);// Prevent Ctrl+wheel zoom (accessibility feature)
dphelper.window.stopZoomWheel();
// Useful for:
// - Interactive maps
// - Canvas applications
// - Games
// - Preventing accidental zoom// Purge document from memory after delay
dphelper.window.purge(document, 10000); // 10 seconds
// Or purge specific element
const oldContent = document.getElementById('oldContent');
dphelper.window.purge(oldContent, 5000);
// Cleans up:
// - Event listeners
// - References
// - Child nodes// Enhance window with cross-browser utilities
dphelper.window.enhancement();
// Adds:
// - Cross-browser requestAnimationFrame
// - Additional window propertiesclass FormProtection {
constructor(formSelector) {
this.form = document.querySelector(formSelector);
this.init();
}
init() {
// Enable beforeunload warning
dphelper.window.onBeforeUnLoad(this.form);
}
// Clean up when form is submitted
onSubmit(callback) {
this.form.addEventListener('submit', (e) => {
// Remove protection after successful submit
this.disable();
callback(e);
});
}
disable() {
// Programmatically disable warning
window.onbeforeunload = null;
}
}
// Usage
const protectedForm = new FormProtection('#contactForm');
protectedForm.onSubmit(() => {
console.log('Form submitted!');
});class ZoomManager {
constructor(container) {
this.container = container;
this.setupHandlers();
}
setupHandlers() {
// Disable default zoom
dphelper.window.stopZoomWheel();
// Track zoom changes
window.addEventListener('resize', () => this.handleResize());
}
handleResize() {
const width = window.innerWidth;
let zoom = 1;
if (width < 768) {
zoom = 0.75;
} else if (width < 1024) {
zoom = 0.9;
}
dphelper.window.setZoom(this.container, zoom);
}
getCurrentZoom() {
return dphelper.window.getZoom(this.container);
}
}
// Usage
const zoomManager = new ZoomManager('#app-container');