# Kioscos

Disponemos de recursos para que puedas utilizar Videsk en kioscos bajo diferentes ambientes.

## Arquitectura

Para el caso de los kioscos debes considerar que dependiendo de tu necesidad podrías requerir ajustar la forma de generar llamadas o agendamientos.

## Sin segmentación

```mermaid
graph TD
    %% Kioskos
    K1[🖥️ Kiosco 1<br/>Cliente inicia videollamada]
    K2[🖥️ Kiosco 2<br/>Cliente inicia videollamada]
    K3[🖥️ Kiosco 3<br/>Cliente inicia videollamada]
    K4[🖥️ Kiosco 4<br/>Cliente inicia videollamada]
    
    %% Sistema Videsk
    V[🔄 VIDESK<br/>Sistema de enrutamiento<br/>automático]
    
    %% Pool de ejecutivos
    E1[👤 Ejecutivo 1<br/>Disponible]
    E2[👤 Ejecutivo 2<br/>Ocupado]
    E3[👤 Ejecutivo 3<br/>Disponible]
    E4[👤 Ejecutivo 4<br/>Disponible]
    E5[👤 Ejecutivo 5<br/>Ocupado]
    
    %% Conexiones desde kioskos a Videsk
    K1 --> V
    K2 --> V
    K3 --> V
    K4 --> V
    
    %% Conexiones desde Videsk a ejecutivos
    V --> E1
    V --> E3
    V --> E4
    
    %% Ejecutivos ocupados (líneas punteadas)
    V -.-> E2
    V -.-> E5
    
    %% Estilos
    classDef kiosko fill:#e1f5fe,stroke:#0277bd,stroke-width:2px
    classDef videsk fill:#f3e5f5,stroke:#7b1fa2,stroke-width:3px
    classDef disponible fill:#e8f5e8,stroke:#2e7d32,stroke-width:2px
    classDef ocupado fill:#ffebee,stroke:#c62828,stroke-width:2px
    
    class K1,K2,K3,K4 kiosko
    class V videsk
    class E1,E3,E4 disponible
    class E2,E5 ocupado
    
    %% Notas explicativas
    subgraph Pool["🏢 Pool de Ejecutivos"]
        E1
        E2
        E3
        E4
        E5
    end
    
    subgraph Kioskos["📍 Ubicaciones con Kioskos"]
        K1
        K2
        K3
        K4
    end
```

En el caso de kioscos sin realizar segmentación por ubicación o propósito específico simplemente deberás usar nuestros widgets, SDKs o APIs para generar las llamadas o agendamientos, Videsk se encargará de derivar a quien corresponda.

## Con segmentación

```mermaid
graph TD
    %% Tótems con ID de segmento
    T1[🖥️ Kiosco 1<br/>ID: SEG-A<br/>Cliente inicia videollamada]
    T2[🖥️ Kiosco 2<br/>ID: SEG-B<br/>Cliente inicia videollamada]
    T3[🖥️ Kiosco 3<br/>ID: SEG-C<br/>Cliente inicia videollamada]
    
    %% Sistema Videsk con lógica de enrutamiento
    V[🔄 VIDESK<br/>Sistema de enrutamiento<br/>por segmento<br/>Analiza ID en el tótem]
    
    %% Pools de ejecutivos por segmento
    subgraph PoolA["🏢 Pool Segmento A<br/>Ejecutivos Premium"]
        EA1[👤 Ejecutivo A1<br/>Disponible]
        EA2[👤 Ejecutivo A2<br/>Ocupado]
    end
    
    subgraph PoolB["🏢 Pool Segmento B<br/>Ejecutivos Estándar"]
        EB1[👤 Ejecutivo B1<br/>Disponible]
        EB2[👤 Ejecutivo B2<br/>Ocupado]
    end
    
    subgraph PoolC["🏢 Pool Segmento C<br/>Ejecutivos Básicos"]
        EC1[👤 Ejecutivo C1<br/>Disponible]
        EC2[👤 Ejecutivo C2<br/>Disponible]
    end
    
    %% Conexiones desde tótems a Videsk
    T1 --> V
    T2 --> V
    T3 --> V
    
    %% Enrutamiento por segmento
    V -->|ID: SEG-A| EA1
    V -.->|ID: SEG-A| EA2
    
    V -->|ID: SEG-B| EB1
    V -.->|ID: SEG-B| EB2
    
    V -->|ID: SEG-C| EC1
    V -->|ID: SEG-C| EC2
    
    %% Estilos
    classDef totemA fill:#e3f2fd,stroke:#1976d2,stroke-width:2px
    classDef totemB fill:#f3e5f5,stroke:#7b1fa2,stroke-width:2px
    classDef totemC fill:#fff3e0,stroke:#f57c00,stroke-width:2px
    classDef videsk fill:#e8f5e8,stroke:#388e3c,stroke-width:3px
    classDef disponible fill:#e8f5e8,stroke:#2e7d32,stroke-width:2px
    classDef ocupado fill:#ffebee,stroke:#c62828,stroke-width:2px
    classDef poolA fill:#e3f2fd,stroke:#1976d2,stroke-width:2px
    classDef poolB fill:#f3e5f5,stroke:#7b1fa2,stroke-width:2px
    classDef poolC fill:#fff3e0,stroke:#f57c00,stroke-width:2px
    
    class T1 totemA
    class T2 totemB
    class T3 totemC
    class V videsk
    class EA1,EB1,EC1,EC2 disponible
    class EA2,EB2 ocupado
    class PoolA poolA
    class PoolB poolB
    class PoolC poolC
```

Para estos casos que requieren una clara segmentación ya sea por tipo de cliente, productos, servicios o ubicación geográfica, deberás asignar los IDs de los segmentos correspondientes en cada kiosco, de manera que al momento de realizar la llamada se identifique el origen. Para realizar esto tienes varias maneras dependiendo de las capacidades y formas de integración de tus kioscos:

{% hint style="info" %}
Recuerda que puedes obtener manualmente los IDs de segmento y calendarios desde el dashboard, también usando nuestra [Rest API](/es-developers/api-publica/autorizacion.md).
{% endhint %}

### Widgets

Si estás usando nuestros widgets en tus kioscos, basta con usar el modelo de diferenciación por URL, descrita a continuación:

{% content-ref url="/pages/h8gMDJgChB4hFMaz3kQ2" %}
[Acciones por URL](/es-developers/widgets/url-triggers.md)
{% endcontent-ref %}

### SDKs y Rest API

Si estás usando nuestros SDKs y/o Rest API en tus kioscos, tendrás que obtener el ID de segmento ya sea manualmente desde nuestro dashboard o bien programáticamente con el SDK ([Phone](/es-developers/sdks/phone.md) o [Calendar](/es-developers/sdks/calendario.md)) o vía [Rest API](/es-developers/api-publica/autorizacion.md). Por lo tanto los pasos son:

1. Obtener ID segmento(s) o calendario(s)
2. Almacenar vía URL, localStorage, etc. **La forma que obtengan y guardes estos IDs dependerá de tu elección técnica**.
3. Usar el ID de segmento o calendario a través de nuestros SDKs o Rest API.

{% hint style="info" %}
Recuerda que la manera de almacenar los IDs dependerá de tu decisión técnica.
{% endhint %}

#### Ejemplo de almacenamiento/obtención:

{% hint style="warning" %}
Si necesitas obtener ID dinámicos, deberás diseñar tu propia solución donde recomendamos utilizar nuestra Rest API.
{% endhint %}

{% code lineNumbers="true" %}

```javascript
class CustomStorage {
  
  static storageKey = 'kiosk-id';
  
  static get fromWindow() {
    return window[this.storageKey];
  }
  
  static get fromUrl() {
    return new URLSearchParams(window.location.search).get(this.storageKey);
  }
  
  static save(id) {
    localStorage.setItem(this.storageKey, id);
  }
  
  static get id() {
    return localStorage.getItem(this.storageKey) || this.fromUrl || this.fromWindow;
  }
  
}

CustomStorage.save(id) // Almancenar en storage local del navegador
CustomStorage.id // Obtener ID de segmento automáticamente por storage, URL y window
```

{% endcode %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.videsk.io/es-developers/integraciones/kioscos.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.