GPT

File Storage

// js/storage.js class Storage { constructor() { this.storage = window.storage; this.setupUI(); } setupUI() { const uploadForm = document.getElementById('uploadForm'); uploadForm?.addEventListener('submit', async

Prompt text

Original English text. Replace placeholders with your own details.

// js/storage.js
class Storage {
 constructor() {
 this.storage = window.storage;
 this.setupUI();
 }

 setupUI() {
 const uploadForm = document.getElementById('uploadForm');
 uploadForm?.addEventListener('submit', async (e) => {
 e.preventDefault();
 const file = e.target.file.files[0];
 if (!file) return;

 try {
 const url = await this.uploadFile(file);
 this.addFileToList(file.name, url);
 uploadForm.reset();
 } catch (error) {
 console.error('Upload failed:', error);
 this.showError(error.message);
 }
 });

 // Initial load
 this.loadFiles();
 }

 async uploadFile(file) {
 try {
 const path = `uploads/${Date.now()}_${file.name}`;
 const ref = this.storage.ref().child(path);
 await ref.put(file);
 return await ref.getDownloadURL();
 } catch (error) {
 console.error('Error uploading file:', error);
 throw error;
 }
 }

 async deleteFile(path) {
 try {
 const ref = this.storage.ref().child(path);
 await ref.delete();
 console.log('File deleted:', path);
 } catch (error) {
 console.error('Error deleting file:', error);
 throw error;
 }
 }

 async loadFiles() {
 try {
 const ref = this.storage.ref().child('uploads');
 const result = await ref.listAll();
 
 const files = await Promise.all(
 result.items.map(async (item) => ({
 name: item.name,
 url: await item.getDownloadURL()
 }))
 );

 this.renderFiles(files);
 } catch (error) {
 console.error('Error loading files:', error);
 this.showError(error.message);
 }
 }

 addFileToList(name, url) {
 const container = document.getElementById('files');
 if (!container) return;

 const div = document.createElement('div');
 div.className = 'file';
 div.innerHTML = `
 <a href="${url}" target="_blank">${name}</a>
 <button onclick="storage.deleteFile('uploads/${name}')">Delete</button>
 `;
 container.appendChild(div);
 }

 renderFiles(files) {
 const container = document.getElementById('files');
 if (!container) return;

 container.innerHTML = files.map(file => `
 <div class="file">
 <a href="${file.url}" target="_blank">${file.name}</a>
 <button onclick="storage.deleteFile('uploads/${file.name}')">Delete</button>
 </div>
 `).join('');
 }

 showError(message) {
 const errorDiv = document.getElementById('error');
 if (errorDiv) {
 errorDiv.textContent = message;
 errorDiv.classList.remove('hidden');
 setTimeout(() => {
 errorDiv.classList.add('hidden');
 }, 5000);
 }
 }
}

// Initialize storage
const storage = new Storage();

Source & attribution

Instructa AI Prompts · Instructa AI Prompts

Source-listed license: CC-BY-4.0. Prompt text is preserved; titles and previews may be shortened for display. Source examples are not NexGateHub test results.

View original source ↗ · Source credits & licenses

Explore more prompts →