Create scripts.js

scripts.js

@@ -0,0 +1,83 @@
+const manifest = [
+    {
+        name: "App One",
+        description: "This is the first app.",
+        installUrl: "#"
+    },
+    {
+        name: "App Two",
+        description: "This is the second app.",
+        installUrl: "#"
+    }
+];
+
+function renderAppList() {
+    const list = document.createElement('div');
+    list.id = 'app-list';
+    manifest.forEach((app, index) => {
+        const item = document.createElement('div');
+        item.className = 'list-item';
+        item.textContent = app.name;
+        item.addEventListener('click', () => showAppDetail(index));
+        list.appendChild(item);
+    });
+    return list;
+}
+
+function renderAppDetail(app) {
+    const detail = document.createElement('div');
+    detail.className = 'detail-view';
+    detail.id = 'app-detail';
+    
+    const name = document.createElement('h2');
+    name.textContent = app.name;
+    
+    const description = document.createElement('p');
+    description.textContent = app.description;
+    
+    const installButton = document.createElement('button');
+    installButton.textContent = 'Install';
+    installButton.addEventListener('click', () => {
+        window.location.href = app.installUrl;
+    });
+    
+    detail.appendChild(name);
+    detail.appendChild(description);
+    detail.appendChild(installButton);
+    
+    return detail;
+}
+
+function showAppDetail(index) {
+    const detailView = document.getElementById('app-detail');
+    if (detailView) {
+        detailView.remove();
+    }
+    const appDetail = renderAppDetail(manifest[index]);
+    appDetail.classList.add('active');
+    document.getElementById('app').appendChild(appDetail);
+}
+
+function addApp(name, description, installUrl) {
+    manifest.push({ name, description, installUrl });
+    const appList = document.getElementById('app-list');
+    if (appList) {
+        appList.remove();
+    }
+    document.getElementById('app').appendChild(renderAppList());
+}
+
+document.addEventListener('DOMContentLoaded', () => {
+    const app = document.getElementById('app');
+    
+    const header = document.createElement('header');
+    header.textContent = 'App List';
+    app.appendChild(header);
+    
+    app.appendChild(renderAppList());
+});
+
+// Example of adding a new app dynamically
+setTimeout(() => {
+    addApp("App Three", "This is the third app.", "#");
+}, 5000);