Write an HTML file showing the actual speed of the paint line.

I'll help you create an HTML file showing the actual speed of the paint line. First, let's check if there's a "paint line" asset in the system.

Finished Calling assetsearch (paint line)

Great! Let's get more details about the Paint Line asset to understand what properties might contain speed information.

Finished Calling assetinfo (Paint Line)

Now, let's get the actual live data for the paint line speed:

Finished Calling livedata (Paint Line)

Now, let's get the instructions for binding live data to HTML:

Finished Calling getinstruct (binding)

Now I'll create an HTML file showing the actual speed of the paint line. I'll include live data binding to keep it updated in real-time.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Paint Line Speed Monitor</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 20px;
            background-color: #f5f5f5;
        }
        .container {
            max-width: 800px;
            margin: 0 auto;
            background-color: white;
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        }
        h1 {
            color: #333;
            text-align: center;
            margin-bottom: 30px;
        }
        .speed-display {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-bottom: 30px;
        }
        .speed-value {
            font-size: 48px;
            font-weight: bold;
            color: #2c3e50;
            margin: 20px 0;
        }
        .speed-bar-container {
            width: 100%;
            background-color: #ecf0f1;
            height: 30px;
            border-radius: 15px;
            overflow: hidden;
            margin-bottom: 10px;
        }
        .speed-bar {
            height: 100%;
            background-color: #3498db;
            transition: width 0.5s ease-in-out;
        }
        .speed-scale {
            display: flex;
            justify-content: space-between;
            width: 100%;
            padding: 0 5px;
        }
        .speed-details {
            display: flex;
            justify-content: space-around;
            margin-top: 30px;
            border-top: 1px solid #eee;
            padding-top: 20px;
        }
        .detail-item {
            text-align: center;
        }
        .detail-label {
            font-size: 14px;
            color: #7f8c8d;
            margin-bottom: 5px;
        }
        .detail-value {
            font-size: 18px;
            font-weight: bold;
            color: #34495e;
        }
        .last-updated {
            text-align: right;
            font-size: 12px;
            color: #95a5a6;
            margin-top: 20px;
        }
    </style>
</head>
<body ardiserver="https://demo.optrix.com.au/s/pl">
    <div class="container">
        <h1>Paint Line Speed Monitor</h1>
        
        <div class="speed-display">
            <h2>Current Speed</h2>
            <div class="speed-value" ardibind="point:Paint Line.Speed - Actual;round:2;suffix: m/min"></div>
            
            <div class="speed-bar-container">
                <div class="speed-bar" ardibindwidth="point:Paint Line.Speed - Actual;mininput:0;maxinput:80;minoutput:0;maxoutput:100;suffix:%"></div>
            </div>
            
            <div class="speed-scale">
                <span>0 m/min</span>
                <span>20 m/min</span>
                <span>40 m/min</span>
                <span>60 m/min</span>
                <span>80 m/min</span>
            </div>
        </div>
        
        <div class="speed-details">
            <div class="detail-item">
                <div class="detail-label">Target Speed</div>
                <div class="detail-value" ardibind="point:Paint Line.Speed - Target;round:2;suffix: m/min"></div>
            </div>
            <div class="detail-item">
                <div class="detail-label">Maximum Speed</div>
                <div class="detail-value" ardibind="point:Paint Line.Speed - Maximum;round:2;suffix: m/min"></div>
            </div>
            <div class="detail-item">
                <div class="detail-label">Product Width</div>
                <div class="detail-value" ardibind="point:Paint Line.Width;round:2;suffix: mm"></div>
            </div>
            <div class="detail-item">
                <div class="detail-label">Product Thickness</div>
                <div class="detail-value" ardibind="point:Paint Line.Thickness;round:3;suffix: mm"></div>
            </div>
        </div>
        
        <div class="last-updated">
            Last updated: <span id="timestamp"></span>
            <script>
                function updateTimestamp() {
                    const now = new Date();
                    document.getElementById('timestamp').textContent = now.toLocaleTimeString();
                }
                // Update timestamp every second
                setInterval(updateTimestamp, 1000);
                // Initial update
                updateTimestamp();
            </script>
        </div>
    </div>

    <!-- Import Script for HTML Pages -->
    <script src="https://demo.optrix.com.au/plugins/optrix/livepage.js"></script>
</body>
</html>

This HTML file displays:

  1. A large, prominent display of the paint line's current speed (rounded to 2 decimal places)
  2. A visual bar that represents the speed relative to the maximum speed (0-80 m/min)
  3. A scale below the bar for reference
  4. Additional details including target speed, maximum speed, product width and thickness
  5. A timestamp showing when the page was last updated

The page will automatically update in real-time thanks to the ARDI data binding. To use this file:

  1. Save it with a .html extension
  2. Open it in a web browser that has access to your ARDI server
  3. The page should automatically connect and display the current paint line speed

The design is responsive and should work well on both desktop and mobile devices.