npm - @drttix/drt-sdk - Versions diffs - 0.6.4 → 0.6.15 - Mend

@drttix/drt-sdk 0.6.4 → 0.6.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (590) hide show

package/demo/test.html CHANGED Viewed

@@ -1,240 +1,667 @@
-<!doctype html>
-<html>
-    <head>
-        <meta charset="utf-8" />
-        <title>DRT SDK Test Page</title>
-        <style>
-            body {
-                font-family: system-ui, sans-serif;
-                max-width: 900px;
-                margin: 2rem auto;
-                padding: 0 1rem;
-            }
-            h1 {
-                color: #333;
-            }
-            h2 {
-                color: #555;
-                margin-top: 2rem;
-            }
-            button {
-                padding: 0.5rem 1rem;
-                font-size: 1rem;
-                cursor: pointer;
-                margin: 0.25rem;
-            }
-            pre {
-                background: #f4f4f4;
-                padding: 1rem;
-                overflow: auto;
-                border-radius: 4px;
-                max-height: 400px;
-            }
-            .success {
-                color: green;
-            }
-            .error {
-                color: red;
-            }
-            #status {
-                margin: 1rem 0;
-                font-weight: bold;
-            }
-            .config-form {
-                background: #f9f9f9;
-                padding: 1rem;
-                border-radius: 4px;
-                margin-bottom: 1rem;
-            }
-            .config-form label {
-                display: block;
-                margin: 0.5rem 0 0.25rem;
-            }
-            .config-form input {
-                width: 100%;
-                padding: 0.5rem;
-                font-size: 1rem;
-                box-sizing: border-box;
-            }
-        </style>
-    </head>
-    <body>
-        <h1>DRT SDK Test Page</h1>
-        <h2>1. Initialize SDK</h2>
-        <div class="config-form">
-            <label for="shopperGuid">Shopper GUID:</label>
-            <input
-                type="text"
-                id="shopperGuid"
-                placeholder="e.g., F1199DCD-BB45-4BD0-8DED600A3A234C75"
-            />
-            <label for="accountId">Account ID:</label>
-            <input type="text" id="accountId" placeholder="e.g., 508" />
-            <label for="apiKey">API Key:</label>
-            <input type="text" id="apiKey" placeholder="e.g., your-api-key" />
-            <button id="btn-init" style="margin-top: 1rem">
-                Initialize SDK
-            </button>
-        </div>
-        <h2>2. Test API Calls</h2>
-        <p>
-            After initializing, these calls will automatically use your
-            credentials.
-        </p>
-        <div>
-            <button id="btn-check-sdk">Check SDK Status</button>
-            <button id="btn-strings">Get Scanner Strings (no auth)</button>
-            <button id="btn-theme">Get Theme (requires auth)</button>
-        </div>
-        <div id="status"></div>
-        <pre id="output">
-Initialize the SDK above, then click a button to test...</pre
-        >
-        <script type="module">
-            import { DRT } from '../dist/esm/index.js';
-            const out = document.getElementById('output');
-            const status = document.getElementById('status');
-            function setStatus(msg, isError = false) {
-                status.textContent = msg;
-                status.className = isError ? 'error' : 'success';
-            }
-            function setOutput(data) {
-                out.textContent =
-                    typeof data === 'string'
-                        ? data
-                        : JSON.stringify(data, null, 2);
-            }
-            // Expose DRT globally for console testing
-            window.DRT = DRT;
-            // Initialize SDK
-            document
-                .getElementById('btn-init')
-                .addEventListener('click', () => {
-                    const shopperGuid = document
-                        .getElementById('shopperGuid')
-                        .value.trim();
-                    const accountId = document
-                        .getElementById('accountId')
-                        .value.trim();
-                    const apiKey = document
-                        .getElementById('apiKey')
-                        .value.trim();
-                    if (!shopperGuid || !accountId || !apiKey) {
-                        setStatus('Please fill in all fields', true);
-                        return;
-                    }
-                    try {
-                        DRT.init({
-                            shopperGuid,
-                            accountId,
-                            apiKey,
-                        });
-                        setStatus('SDK Initialized!', false);
-                        setOutput({
-                            message: 'SDK initialized successfully!',
-                            config: {
-                                shopperGuid,
-                                accountId,
-                                apiKey: '***', // Don't show full key
-                            },
-                        });
-                    } catch (err) {
-                        setStatus('Init failed: ' + err.message, true);
-                        setOutput({ error: err.message });
-                    }
-                });
-            // Check SDK status
-            document
-                .getElementById('btn-check-sdk')
-                .addEventListener('click', () => {
-                    setStatus('SDK Status', false);
-                    const config = DRT.getConfig();
-                    setOutput({
-                        isReady: DRT.isReady(),
-                        config: config
-                            ? {
-                                  shopperGuid: config.shopperGuid,
-                                  accountId: config.accountId,
-                                  apiKey: '***',
-                              }
-                            : null,
-                        availableServices: {
-                            shopper: Object.keys(DRT.shopper),
-                            scanner: Object.keys(DRT.scanner),
-                            portal: Object.keys(DRT.portal),
-                        },
-                    });
-                });
-            // Get scanner strings (no auth required)
-            document
-                .getElementById('btn-strings')
-                .addEventListener('click', async () => {
-                    setStatus('Fetching...', false);
-                    try {
-                        const strings =
-                            await DRT.scanner.scanning.appControllerGetStrings();
-                        setStatus('Success!', false);
-                        setOutput(strings);
-                    } catch (err) {
-                        setStatus('Error: ' + err.message, true);
-                        setOutput({
-                            error: err.message,
-                            details: err.toString(),
-                        });
-                        console.error(err);
-                    }
-                });
-            // Get theme (requires auth - credentials auto-injected after init!)
-            document
-                .getElementById('btn-theme')
-                .addEventListener('click', async () => {
-                    if (!DRT.isReady()) {
-                        setStatus(
-                            'SDK not initialized! Please initialize first.',
-                            true,
-                        );
-                        return;
-                    }
-                    setStatus('Fetching theme...', false);
-                    try {
-                        // After DRT.init(), credentials are automatically injected - no params needed!
-                        const theme = await DRT.shopper.account.getTheme();
-                        setStatus('Success!', false);
-                        setOutput(theme);
-                    } catch (err) {
-                        setStatus('Error: ' + err.message, true);
-                        setOutput({
-                            error: err.message,
-                            details: err.toString(),
-                        });
-                        console.error(err);
-                    }
-                });
-            // Auto-check on load
-            setStatus(
-                'SDK loaded! Initialize with your credentials above.',
-                false,
-            );
-            console.log('DRT SDK available at window.DRT for console testing');
-        </script>
-    </body>
-</html>
+<!doctype html>
+<html>
+    <head>
+        <meta charset="utf-8" />
+        <title>DRT SDK Test Page</title>
+        <link rel="icon" href="data:," />
+        <style>
+            * {
+                box-sizing: border-box;
+            }
+            body {
+                font-family: system-ui, sans-serif;
+                margin: 0;
+                padding: 0;
+                display: flex;
+                height: 100vh;
+                overflow: hidden;
+            }
+            .main-container {
+                display: flex;
+                width: 100%;
+                height: 100vh;
+                background: #fff;
+            }
+            .left-panel {
+                flex: 1;
+                overflow-y: auto;
+                padding: 1rem 2rem;
+            }
+            .right-panel {
+                flex: 1;
+                background: #1e1e1e;
+                color: #d4d4d4;
+                display: flex;
+                flex-direction: column;
+                border-left: 1px solid #333;
+                position: sticky;
+                top: 0;
+                height: 100vh;
+            }
+            .right-panel h2 {
+                color: #fff;
+                margin: 0;
+                padding: 1rem;
+                background: #2d2d2d;
+                border-bottom: 1px solid #444;
+                font-size: 1rem;
+            }
+            h1 {
+                color: #333;
+                margin-top: 0;
+            }
+            h2 {
+                color: #555;
+                margin-top: 2rem;
+                border-bottom: 1px solid #ddd;
+                padding-bottom: 0.5rem;
+            }
+            h3 {
+                color: #666;
+                margin-top: 1.5rem;
+            }
+            button {
+                padding: 0.5rem 1rem;
+                font-size: 0.9rem;
+                cursor: pointer;
+                margin: 0.25rem;
+                border: 1px solid #ccc;
+                border-radius: 4px;
+                background: #fff;
+            }
+            button:hover {
+                background: #f0f0f0;
+            }
+            button:disabled {
+                opacity: 0.5;
+                cursor: not-allowed;
+            }
+            #output-container {
+                flex: 1;
+                overflow: auto;
+                padding: 1rem;
+            }
+            pre {
+                background: transparent;
+                margin: 0;
+                white-space: pre-wrap;
+                word-wrap: break-word;
+                font-size: 0.85rem;
+                font-family: 'Monaco', 'Menlo', 'Consolas', monospace;
+            }
+            .success {
+                color: #4ec9b0;
+            }
+            .error {
+                color: #f48771;
+            }
+            #status {
+                padding: 0.5rem 1rem;
+                font-weight: bold;
+                background: #252526;
+                border-bottom: 1px solid #444;
+            }
+            .config-form {
+                background: #f9f9f9;
+                padding: 1rem;
+                border-radius: 4px;
+                margin-bottom: 1rem;
+            }
+            .config-form label {
+                display: block;
+                margin: 0.5rem 0 0.25rem;
+                font-weight: 500;
+            }
+            .config-form input {
+                width: 100%;
+                padding: 0.5rem;
+                font-size: 1rem;
+                box-sizing: border-box;
+                border: 1px solid #ccc;
+                border-radius: 4px;
+            }
+            .btn-group {
+                display: flex;
+                flex-wrap: wrap;
+                gap: 0.5rem;
+                margin: 0.5rem 0;
+            }
+            .input-row {
+                display: flex;
+                gap: 0.5rem;
+                align-items: center;
+                margin: 0.5rem 0;
+            }
+            .input-row input {
+                flex: 1;
+                padding: 0.4rem;
+                font-size: 0.9rem;
+            }
+            .input-row label {
+                min-width: 80px;
+                font-size: 0.85rem;
+            }
+            .tab-container {
+                border-bottom: 2px solid #ddd;
+                margin-bottom: 1rem;
+            }
+            .tab {
+                padding: 0.5rem 1rem;
+                border: none;
+                background: none;
+                cursor: pointer;
+                font-size: 1rem;
+            }
+            .tab.active {
+                border-bottom: 2px solid #007bff;
+                color: #007bff;
+                margin-bottom: -2px;
+            }
+            .tab-content {
+                display: none;
+            }
+            .tab-content.active {
+                display: block;
+            }
+            code {
+                background: #e9e9e9;
+                padding: 0.2rem 0.4rem;
+                border-radius: 3px;
+                font-size: 0.85rem;
+            }
+        </style>
+    </head>
+    <body>
+        <div class="main-container">
+            <div class="left-panel">
+                <h1>DRT SDK Test Page</h1>
+                <h2>1. Initialize SDK</h2>
+                <div class="config-form">
+                    <label for="shopperGuid">Shopper GUID:</label>
+                    <input
+                        type="text"
+                        id="shopperGuid"
+                        placeholder="e.g., F1199DCD-BB45-4BD0-8DED600A3A234C75"
+                    />
+                    <label for="accountId">Account ID:</label>
+                    <input type="text" id="accountId" placeholder="e.g., 508" />
+                    <label for="apiKey">API Key:</label>
+                    <input
+                        type="text"
+                        id="apiKey"
+                        placeholder="e.g., your-api-key"
+                    />
+                    <div style="margin-top: 1rem">
+                        <button id="btn-init">Initialize SDK</button>
+                        <button id="btn-check-sdk">Check SDK Status</button>
+                        <button id="btn-reset">Reset SDK</button>
+                    </div>
+                </div>
+                <h2>2. Test API Calls</h2>
+                <div class="tab-container">
+                    <button class="tab active" data-tab="shopper">
+                        Shopper API
+                    </button>
+                    <button class="tab" data-tab="scanner">Scanner API</button>
+                </div>
+                <!-- SHOPPER API -->
+                <div id="tab-shopper" class="tab-content active">
+                    <h3>Account</h3>
+                    <p>
+                        Basic account/site configuration.
+                        <code>DRT.shopper.account</code>
+                    </p>
+                    <div class="btn-group">
+                        <button id="btn-theme">Get Theme</button>
+                        <button id="btn-disposition">Get Disposition</button>
+                        <button id="btn-root">Get Root Config</button>
+                        <button id="btn-landing">Get Landing Page</button>
+                    </div>
+                    <h3>Events</h3>
+                    <p>
+                        Event listings and details.
+                        <code>DRT.shopper.event</code>
+                    </p>
+                    <div class="btn-group">
+                        <button id="btn-events">Get All Events</button>
+                    </div>
+                    <div class="input-row">
+                        <label>Event ID:</label>
+                        <input
+                            type="number"
+                            id="eventId"
+                            placeholder="e.g., 123"
+                        />
+                        <button id="btn-event-details">
+                            Get Event Details
+                        </button>
+                    </div>
+                    <h3>Cart</h3>
+                    <p>
+                        Shopping cart operations. <code>DRT.shopper.cart</code>
+                    </p>
+                    <div class="btn-group">
+                        <button id="btn-cart">Get Cart</button>
+                        <button id="btn-delete-cart">Delete Cart</button>
+                    </div>
+                    <h3>Orders</h3>
+                    <p>
+                        Order receipts and management.
+                        <code>DRT.shopper.order</code>
+                    </p>
+                    <div class="input-row">
+                        <label>Order GUID:</label>
+                        <input
+                            type="text"
+                            id="orderGuid"
+                            placeholder="e.g., ABC123-..."
+                        />
+                        <button id="btn-receipt">Get Receipt</button>
+                    </div>
+                    <h3>Codes/Discounts</h3>
+                    <p>
+                        Promo codes and discounts. <code>DRT.shopper.code</code>
+                    </p>
+                    <div class="input-row">
+                        <label>Code:</label>
+                        <input
+                            type="text"
+                            id="promoCode"
+                            placeholder="e.g., SAVE10"
+                        />
+                        <button id="btn-validate-code">Validate Code</button>
+                    </div>
+                    <h3>Gift Cards</h3>
+                    <p>
+                        Gift card operations. <code>DRT.shopper.giftCard</code>
+                    </p>
+                    <div class="input-row">
+                        <label>Card #:</label>
+                        <input
+                            type="text"
+                            id="giftCardNumber"
+                            placeholder="Gift card number"
+                        />
+                        <button id="btn-gift-balance">Check Balance</button>
+                    </div>
+                </div>
+                <!-- SCANNER API -->
+                <div id="tab-scanner" class="tab-content">
+                    <h3>Scanning</h3>
+                    <p>
+                        Scanner app strings and utilities.
+                        <code>DRT.scanner.scanning</code>
+                    </p>
+                    <div class="btn-group">
+                        <button id="btn-strings">
+                            Get App Strings (no auth)
+                        </button>
+                    </div>
+                    <h3>Database</h3>
+                    <p>
+                        Scanner database operations.
+                        <code>DRT.scanner.database</code>
+                    </p>
+                    <div class="input-row">
+                        <label>Event ID:</label>
+                        <input
+                            type="number"
+                            id="scannerEventId"
+                            placeholder="e.g., 123"
+                        />
+                        <button id="btn-scanner-db">Get Database</button>
+                    </div>
+                    <h3>Orders</h3>
+                    <p>
+                        Order lookup for scanning.
+                        <code>DRT.scanner.orders</code>
+                    </p>
+                    <div class="input-row">
+                        <label>Order ID:</label>
+                        <input
+                            type="text"
+                            id="scannerOrderId"
+                            placeholder="Order ID"
+                        />
+                        <button id="btn-scanner-order">Get Order</button>
+                    </div>
+                </div>
+            </div>
+            <div class="right-panel">
+                <h2>Output</h2>
+                <div id="status">
+                    SDK loaded! Initialize with your credentials.
+                </div>
+                <div id="output-container">
+                    <pre id="output">
+Initialize the SDK, then click a button to test...</pre
+                    >
+                </div>
+            </div>
+        </div>
+        <script type="module">
+            import { DRT } from '/public/sdk/latest/drt-sdk.js';
+            const out = document.getElementById('output');
+            const status = document.getElementById('status');
+            // Expose DRT globally for console testing
+            window.DRT = DRT;
+            function setStatus(msg, isError = false) {
+                status.textContent = msg;
+                status.className = isError ? 'error' : 'success';
+            }
+            function setOutput(data) {
+                out.textContent =
+                    typeof data === 'string'
+                        ? data
+                        : JSON.stringify(data, null, 4);
+            }
+            function requireInit() {
+                if (!DRT.isReady()) {
+                    setStatus(
+                        'SDK not initialized! Please initialize first.',
+                        true,
+                    );
+                    return false;
+                }
+                return true;
+            }
+            async function callApi(fn, description) {
+                setStatus(`Fetching ${description}...`, false);
+                try {
+                    const result = await fn();
+                    setStatus('Success!', false);
+                    setOutput(result);
+                } catch (err) {
+                    setStatus(`Error: ${err.message}`, true);
+                    setOutput({
+                        error: err.message,
+                        details: err.body || err.toString(),
+                    });
+                    console.error(err);
+                }
+            }
+            // Tab switching
+            document.querySelectorAll('.tab').forEach((tab) => {
+                tab.addEventListener('click', () => {
+                    document
+                        .querySelectorAll('.tab')
+                        .forEach((t) => t.classList.remove('active'));
+                    document
+                        .querySelectorAll('.tab-content')
+                        .forEach((c) => c.classList.remove('active'));
+                    tab.classList.add('active');
+                    document
+                        .getElementById(`tab-${tab.dataset.tab}`)
+                        .classList.add('active');
+                });
+            });
+            // Initialize SDK
+            document
+                .getElementById('btn-init')
+                .addEventListener('click', () => {
+                    const shopperGuid = document
+                        .getElementById('shopperGuid')
+                        .value.trim();
+                    const accountId = document
+                        .getElementById('accountId')
+                        .value.trim();
+                    const apiKey = document
+                        .getElementById('apiKey')
+                        .value.trim();
+                    if (!shopperGuid || !accountId || !apiKey) {
+                        setStatus('Please fill in all fields', true);
+                        return;
+                    }
+                    try {
+                        DRT.init({ shopperGuid, accountId, apiKey });
+                        setStatus('SDK Initialized!', false);
+                        setOutput({
+                            message: 'SDK initialized successfully!',
+                            config: { shopperGuid, accountId, apiKey: '***' },
+                        });
+                    } catch (err) {
+                        setStatus('Init failed: ' + err.message, true);
+                        setOutput({ error: err.message });
+                    }
+                });
+            // Check SDK status
+            document
+                .getElementById('btn-check-sdk')
+                .addEventListener('click', () => {
+                    setStatus('SDK Status', false);
+                    const config = DRT.getConfig();
+                    setOutput({
+                        isReady: DRT.isReady(),
+                        config: config
+                            ? {
+                                  shopperGuid: config.shopperGuid,
+                                  accountId: config.accountId,
+                                  apiKey: '***',
+                              }
+                            : null,
+                        availableServices: {
+                            shopper: Object.keys(DRT.shopper),
+                            scanner: Object.keys(DRT.scanner),
+                            portal: Object.keys(DRT.portal),
+                        },
+                    });
+                });
+            // Reset SDK
+            document
+                .getElementById('btn-reset')
+                .addEventListener('click', () => {
+                    DRT.reset();
+                    setStatus('SDK Reset!', false);
+                    setOutput({
+                        message: 'SDK has been reset. Initialize again to use.',
+                    });
+                });
+            // ==================== SHOPPER API ====================
+            // Account
+            document
+                .getElementById('btn-theme')
+                .addEventListener('click', () => {
+                    if (!requireInit()) return;
+                    callApi(() => DRT.shopper.account.getTheme(), 'theme');
+                });
+            document
+                .getElementById('btn-disposition')
+                .addEventListener('click', () => {
+                    if (!requireInit()) return;
+                    callApi(
+                        () => DRT.shopper.account.getDisposition(),
+                        'disposition',
+                    );
+                });
+            document
+                .getElementById('btn-root')
+                .addEventListener('click', () => {
+                    if (!requireInit()) return;
+                    callApi(() => DRT.shopper.account.getRoot(), 'root config');
+                });
+            document
+                .getElementById('btn-landing')
+                .addEventListener('click', () => {
+                    if (!requireInit()) return;
+                    callApi(
+                        () => DRT.shopper.account.getLanding(),
+                        'landing page',
+                    );
+                });
+            // Events
+            document
+                .getElementById('btn-events')
+                .addEventListener('click', () => {
+                    if (!requireInit()) return;
+                    callApi(() => DRT.shopper.event.getEvents(), 'events');
+                });
+            document
+                .getElementById('btn-event-details')
+                .addEventListener('click', () => {
+                    if (!requireInit()) return;
+                    const id = parseInt(
+                        document.getElementById('eventId').value,
+                    );
+                    if (!id) {
+                        setStatus('Please enter an Event ID', true);
+                        return;
+                    }
+                    callApi(
+                        () => DRT.shopper.event.getEventById(id),
+                        `event ${id}`,
+                    );
+                });
+            // Cart
+            document
+                .getElementById('btn-cart')
+                .addEventListener('click', () => {
+                    if (!requireInit()) return;
+                    callApi(() => DRT.shopper.cart.getCart(), 'cart');
+                });
+            document
+                .getElementById('btn-delete-cart')
+                .addEventListener('click', () => {
+                    if (!requireInit()) return;
+                    callApi(() => DRT.shopper.cart.deleteCart(), 'delete cart');
+                });
+            // Orders
+            document
+                .getElementById('btn-receipt')
+                .addEventListener('click', () => {
+                    if (!requireInit()) return;
+                    const guid = document
+                        .getElementById('orderGuid')
+                        .value.trim();
+                    if (!guid) {
+                        setStatus('Please enter an Order GUID', true);
+                        return;
+                    }
+                    callApi(
+                        () => DRT.shopper.order.getReceipt(guid),
+                        'receipt',
+                    );
+                });
+            // Codes
+            document
+                .getElementById('btn-validate-code')
+                .addEventListener('click', () => {
+                    if (!requireInit()) return;
+                    const code = document
+                        .getElementById('promoCode')
+                        .value.trim();
+                    if (!code) {
+                        setStatus('Please enter a code', true);
+                        return;
+                    }
+                    callApi(
+                        () => DRT.shopper.code.validateCode(code),
+                        `code validation`,
+                    );
+                });
+            // Gift Cards
+            document
+                .getElementById('btn-gift-balance')
+                .addEventListener('click', () => {
+                    if (!requireInit()) return;
+                    const num = document
+                        .getElementById('giftCardNumber')
+                        .value.trim();
+                    if (!num) {
+                        setStatus('Please enter a gift card number', true);
+                        return;
+                    }
+                    callApi(
+                        () => DRT.shopper.giftCard.getBalance(num),
+                        'gift card balance',
+                    );
+                });
+            // ==================== SCANNER API ====================
+            document
+                .getElementById('btn-strings')
+                .addEventListener('click', () => {
+                    callApi(
+                        () => DRT.scanner.scanning.appControllerGetStrings(),
+                        'scanner strings',
+                    );
+                });
+            document
+                .getElementById('btn-scanner-db')
+                .addEventListener('click', () => {
+                    const eventId = parseInt(
+                        document.getElementById('scannerEventId').value,
+                    );
+                    if (!eventId) {
+                        setStatus('Please enter an Event ID', true);
+                        return;
+                    }
+                    callApi(
+                        () => DRT.scanner.database.getDatabase(eventId),
+                        `scanner database`,
+                    );
+                });
+            document
+                .getElementById('btn-scanner-order')
+                .addEventListener('click', () => {
+                    const orderId = document
+                        .getElementById('scannerOrderId')
+                        .value.trim();
+                    if (!orderId) {
+                        setStatus('Please enter an Order ID', true);
+                        return;
+                    }
+                    callApi(
+                        () => DRT.scanner.orders.getOrder(orderId),
+                        `scanner order`,
+                    );
+                });
+            // Auto-check on load
+            console.log('DRT SDK available at window.DRT for console testing');
+        </script>
+    </body>
+</html>