commit b6c37e7b891666c46f59d75585a33aab608c1555
Author: root <root@hub.scroll.pub> Date: 2024-12-30 12:29:08 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..2a14bf1 --- /dev/null +++ b/body.html @@ -0,0 +1,44 @@ +<header> + <h1>Mill Monitor</h1> + <p>Track and analyze interruptions in your mill operations</p> +</header> + +<main> + <section class="filters"> + <h2>Filter Interruptions</h2> + <div class="filter-group"> + <label for="length-filter">Minimum Length (minutes):</label> + <input type="number" id="length-filter" min="0" step="1"> + </div> + <div class="filter-group"> + <label for="machine-filter">Machine:</label> + <select id="machine-filter"> + <option value="">All Machines</option> + <!-- Machine options will be populated by JavaScript --> + </select> + </div> + <button id="apply-filters">Apply Filters</button> + </section> + + <section class="interruptions"> + <h2>Interruptions</h2> + <table> + <thead> + <tr> + <th>Start Time</th> + <th>End Time</th> + <th>Duration</th> + <th>Machine</th> + <th>Reason</th> + </tr> + </thead> + <tbody id="interruptions-table"> + <!-- Table rows will be populated by JavaScript --> + </tbody> + </table> + </section> +</main> + +<footer> + <p>Mill Monitor - Optimizing your mill operations</p> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..26009e8 --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://millmonitor.scroll.pub +metaTags +editButton /edit.html +title Mill Monitor - Track and Analyze Mill Interruptions +style.css +body.html +script.js \ No newline at end of file diff --git a/prompt.json b/prompt.json new file mode 100644 index 0000000..3d47781 --- /dev/null +++ b/prompt.json @@ -0,0 +1,25 @@ +{ + "id": "a517f51c-6c45-4c13-9e5b-a6ea4f1ddd61", + "object": "chat.completion", + "created": 1735561723, + "model": "deepseek-chat", + "choices": [ + { + "index": 0, + "message": { + "role": "assistant", + "content": "---domain---\nmillmonitor.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://millmonitor.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Mill Monitor - Track and Analyze Mill Interruptions\nstyle.css\nbody.html\nscript.js\n---body.html---\n<header>\n <h1>Mill Monitor</h1>\n <p>Track and analyze interruptions in your mill operations</p>\n</header>\n\n<main>\n <section class=\"filters\">\n <h2>Filter Interruptions</h2>\n <div class=\"filter-group\">\n <label for=\"length-filter\">Minimum Length (minutes):</label>\n <input type=\"number\" id=\"length-filter\" min=\"0\" step=\"1\">\n </div>\n <div class=\"filter-group\">\n <label for=\"machine-filter\">Machine:</label>\n <select id=\"machine-filter\">\n <option value=\"\">All Machines</option>\n <!-- Machine options will be populated by JavaScript -->\n </select>\n </div>\n <button id=\"apply-filters\">Apply Filters</button>\n </section>\n\n <section class=\"interruptions\">\n <h2>Interruptions</h2>\n <table>\n <thead>\n <tr>\n <th>Start Time</th>\n <th>End Time</th>\n <th>Duration</th>\n <th>Machine</th>\n <th>Reason</th>\n </tr>\n </thead>\n <tbody id=\"interruptions-table\">\n <!-- Table rows will be populated by JavaScript -->\n </tbody>\n </table>\n </section>\n</main>\n\n<footer>\n <p>Mill Monitor - Optimizing your mill operations</p>\n</footer>\n---style.css---\n:root {\n --primary-color: #2c3e50;\n --secondary-color: #3498db;\n --background-color: #ecf0f1;\n --text-color: #2c3e50;\n --accent-color: #e67e22;\n}\n\nbody {\n font-family: 'Segoe UI', system-ui, sans-serif;\n line-height: 1.6;\n margin: 0;\n padding: 0;\n background-color: var(--background-color);\n color: var(--text-color);\n}\n\nheader {\n background-color: var(--primary-color);\n color: white;\n padding: 2rem;\n text-align: center;\n}\n\nh1 {\n margin: 0;\n font-size: 2.5rem;\n}\n\nmain {\n padding: 2rem;\n max-width: 1200px;\n margin: 0 auto;\n}\n\n.filters {\n background-color: white;\n padding: 1.5rem;\n border-radius: 8px;\n box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n margin-bottom: 2rem;\n}\n\n.filter-group {\n margin-bottom: 1rem;\n}\n\nlabel {\n display: block;\n margin-bottom: 0.5rem;\n font-weight: 600;\n}\n\ninput, select {\n width: 100%;\n padding: 0.5rem;\n border: 1px solid #ddd;\n border-radius: 4px;\n font-size: 1rem;\n}\n\nbutton {\n background-color: var(--secondary-color);\n color: white;\n border: none;\n padding: 0.75rem 1.5rem;\n border-radius: 4px;\n cursor: pointer;\n font-size: 1rem;\n transition: background-color 0.3s ease;\n}\n\nbutton:hover {\n background-color: #2980b9;\n}\n\n.interruptions {\n background-color: white;\n padding: 1.5rem;\n border-radius: 8px;\n box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n}\n\ntable {\n width: 100%;\n border-collapse: collapse;\n margin-top: 1rem;\n}\n\nth, td {\n padding: 0.75rem;\n text-align: left;\n border-bottom: 1px solid #ddd;\n}\n\nth {\n background-color: var(--primary-color);\n color: white;\n}\n\ntr:hover {\n background-color: #f5f5f5;\n}\n\nfooter {\n text-align: center;\n padding: 1rem;\n background-color: var(--primary-color);\n color: white;\n margin-top: 2rem;\n}\n\n@media (max-width: 768px) {\n h1 {\n font-size: 2rem;\n }\n \n .filters {\n padding: 1rem;\n }\n \n table {\n display: block;\n overflow-x: auto;\n }\n}\n---script.js---\n// Sample data (would be replaced by actual API calls)\nconst interruptionsData = [\n {\n startTime: '2023-07-20 08:15',\n endTime: '2023-07-20 08:45',\n duration: 30,\n machine: 'Mill A',\n reason: 'Maintenance'\n },\n {\n startTime: '2023-07-20 10:00',\n endTime: '2023-07-20 10:10',\n duration: 10,\n machine: 'Mill B',\n reason: 'Material Jam'\n },\n // Add more sample data\n];\n\nconst machines = ['Mill A', 'Mill B', 'Mill C']; // Sample machines\n\n// Populate machine filter\nconst machineFilter = document.getElementById('machine-filter');\nmachines.forEach(machine => {\n const option = document.createElement('option');\n option.value = machine;\n option.textContent = machine;\n machineFilter.appendChild(option);\n});\n\n// Function to render table\nfunction renderTable(data) {\n const tableBody = document.getElementById('interruptions-table');\n tableBody.innerHTML = '';\n\n data.forEach(interruption => {\n const row = document.createElement('tr');\n \n const startTimeCell = document.createElement('td');\n startTimeCell.textContent = interruption.startTime;\n \n const endTimeCell = document.createElement('td');\n endTimeCell.textContent = interruption.endTime;\n \n const durationCell = document.createElement('td');\n durationCell.textContent = `${interruption.duration} minutes`;\n \n const machineCell = document.createElement('td');\n machineCell.textContent = interruption.machine;\n \n const reasonCell = document.createElement('td');\n reasonCell.textContent = interruption.reason;\n \n row.append(startTimeCell, endTimeCell, durationCell, machineCell, reasonCell);\n tableBody.appendChild(row);\n });\n}\n\n// Initial render\nrenderTable(interruptionsData);\n\n// Filter functionality\ndocument.getElementById('apply-filters').addEventListener('click', () => {\n const minLength = parseInt(document.getElementById('length-filter').value) || 0;\n const selectedMachine = document.getElementById('machine-filter').value;\n\n const filteredData = interruptionsData.filter(interruption => {\n return interruption.duration >= minLength &&\n (selectedMachine === '' || interruption.machine === selectedMachine);\n });\n\n renderTable(filteredData);\n});\n---end---" + }, + "logprobs": null, + "finish_reason": "stop" + } + ], + "usage": { + "prompt_tokens": 274, + "completion_tokens": 1557, + "total_tokens": 1831, + "prompt_cache_hit_tokens": 256, + "prompt_cache_miss_tokens": 18 + }, + "system_fingerprint": "fp_f1afce2943" +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..3a07d02 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# millmonitor1.scroll.pub +Website generated by DeepSeek from prompt: I need to create a website that hosts al LLM application developed in Python. The application will have a table with all the interruptions of a specific mill and filters to search specific interruptions by length and machine \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..2172b17 --- /dev/null +++ b/script.js @@ -0,0 +1,73 @@ +// Sample data (would be replaced by actual API calls) +const interruptionsData = [ + { + startTime: '2023-07-20 08:15', + endTime: '2023-07-20 08:45', + duration: 30, + machine: 'Mill A', + reason: 'Maintenance' + }, + { + startTime: '2023-07-20 10:00', + endTime: '2023-07-20 10:10', + duration: 10, + machine: 'Mill B', + reason: 'Material Jam' + }, + // Add more sample data +]; + +const machines = ['Mill A', 'Mill B', 'Mill C']; // Sample machines + +// Populate machine filter +const machineFilter = document.getElementById('machine-filter'); +machines.forEach(machine => { + const option = document.createElement('option'); + option.value = machine; + option.textContent = machine; + machineFilter.appendChild(option); +}); + +// Function to render table +function renderTable(data) { + const tableBody = document.getElementById('interruptions-table'); + tableBody.innerHTML = ''; + + data.forEach(interruption => { + const row = document.createElement('tr'); + + const startTimeCell = document.createElement('td'); + startTimeCell.textContent = interruption.startTime; + + const endTimeCell = document.createElement('td'); + endTimeCell.textContent = interruption.endTime; + + const durationCell = document.createElement('td'); + durationCell.textContent = `${interruption.duration} minutes`; + + const machineCell = document.createElement('td'); + machineCell.textContent = interruption.machine; + + const reasonCell = document.createElement('td'); + reasonCell.textContent = interruption.reason; + + row.append(startTimeCell, endTimeCell, durationCell, machineCell, reasonCell); + tableBody.appendChild(row); + }); +} + +// Initial render +renderTable(interruptionsData); + +// Filter functionality +document.getElementById('apply-filters').addEventListener('click', () => { + const minLength = parseInt(document.getElementById('length-filter').value) || 0; + const selectedMachine = document.getElementById('machine-filter').value; + + const filteredData = interruptionsData.filter(interruption => { + return interruption.duration >= minLength && + (selectedMachine === '' || interruption.machine === selectedMachine); + }); + + renderTable(filteredData); +}); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..cfa873a --- /dev/null +++ b/style.css @@ -0,0 +1,126 @@ +:root { + --primary-color: #2c3e50; + --secondary-color: #3498db; + --background-color: #ecf0f1; + --text-color: #2c3e50; + --accent-color: #e67e22; +} + +body { + font-family: 'Segoe UI', system-ui, sans-serif; + line-height: 1.6; + margin: 0; + padding: 0; + background-color: var(--background-color); + color: var(--text-color); +} + +header { + background-color: var(--primary-color); + color: white; + padding: 2rem; + text-align: center; +} + +h1 { + margin: 0; + font-size: 2.5rem; +} + +main { + padding: 2rem; + max-width: 1200px; + margin: 0 auto; +} + +.filters { + background-color: white; + padding: 1.5rem; + border-radius: 8px; + box-shadow: 0 2px 4px rgba(0,0,0,0.1); + margin-bottom: 2rem; +} + +.filter-group { + margin-bottom: 1rem; +} + +label { + display: block; + margin-bottom: 0.5rem; + font-weight: 600; +} + +input, select { + width: 100%; + padding: 0.5rem; + border: 1px solid #ddd; + border-radius: 4px; + font-size: 1rem; +} + +button { + background-color: var(--secondary-color); + color: white; + border: none; + padding: 0.75rem 1.5rem; + border-radius: 4px; + cursor: pointer; + font-size: 1rem; + transition: background-color 0.3s ease; +} + +button:hover { + background-color: #2980b9; +} + +.interruptions { + background-color: white; + padding: 1.5rem; + border-radius: 8px; + box-shadow: 0 2px 4px rgba(0,0,0,0.1); +} + +table { + width: 100%; + border-collapse: collapse; + margin-top: 1rem; +} + +th, td { + padding: 0.75rem; + text-align: left; + border-bottom: 1px solid #ddd; +} + +th { + background-color: var(--primary-color); + color: white; +} + +tr:hover { + background-color: #f5f5f5; +} + +footer { + text-align: center; + padding: 1rem; + background-color: var(--primary-color); + color: white; + margin-top: 2rem; +} + +@media (max-width: 768px) { + h1 { + font-size: 2rem; + } + + .filters { + padding: 1rem; + } + + table { + display: block; + overflow-x: auto; + } +} \ No newline at end of file