Documentación :: cBB Chat


Guía Rápida • Requisitos

cBB Chat necesita muy pocos requisitos para funcionar correctamente.

Los requisitos básicos son:
  1. Un foro phpBB previamente instalado, cuya versión sea igual o superior a 3.2.0.
  2. El explorador debe soporar Javascript para poder usar y administrar la extensión.

Guía Rápida • Instalación

  1. Descomprima el archivo de cBB Chat en un directorio local (En su ordenador).
  2. Suba todos los archivos contenidos en la carpeta upload de ese archivo (manteniendo la estructura de los directorios) al directorio ext que se encuentra en el directorio raíz de su foro.
    La ruta final para los archivos de la extensión debe ser: /ext/canidev/chat/
  3. Usando su explorador web, navegue hasta el Panel de Administración y entre en Personalizar >> Extensiones
  4. Busque cBB Chat y haga clic en la opción Habilitar.

Guía Rápida • Actualización

  1. Usando su explorador web, navegue hasta el Panel de Administración y entre en Personalizar >> Extensiones, Busque cBB Chat y haga clic en la opción Deshabilitar.
  2. Elimine la carpeta chat que está dentro del directorio /ext/canidev/ en el servidor.
  3. Descargue y descomprima el archivo de cBB Chat en un directorio local (En su ordenador).
  4. Suba todos los archivos contenidos dentro de la carpeta upload de ese archivo (manteniendo la estructura de los directorios) al directorio ext que se encuentra en el directorio raíz de su foro.
  5. Usando su explorador web, navegue hasta el Panel de Administración y entre en Personalizar >> Extensiones, Busque cBB Chat y haga clic en la opción Habilitar.

Guía Rápida • Desinstalación

cBB Chat se puede desinstalar en pocos pasos:

  1. Usando su explorador web, navegue hasta el Panel de Administración y entre en Personalizar >> Extensiones
  2. Busque cBB Chat y haga clic en la opción Deshabilitar.
  3. Una vez deshabilitado, si quiere eliminarlo completamente, haga clic en Borrar datos y posteriormente elimine el directorio /ext/canidev/chat de su servidor.

Trucos y Personalización • Escritura mulilínea

Por defecto, al presionar la tecla "Enter" se procede a enviar el mensaje escrito en el chat.
Para poder escribir textos multilínea se debe usar la combinación de teclas Ctrl + Enter. Esto producirá un salto de línea en el mensaje.

Trucos y Personalización • Creación automática de listas

El editor de este chat puede convertir automáticamente varias líneas en una lista ordenada o numerada.
Para usar esta función sólo es necesario seleccionar las líneas a convertir y pulsar en el BBcode Lista o Lista Numerada

Por ejemplo:
Línea 1
Línea 2
Línea 3
Se convertirá a: [list]
[*]Línea 1
[*]Línea 2
[*]Línea 3
[/list]

Trucos y Personalización • Personalización de salas

Nota: Para realizar esta personalización se necesita un conocimiento básico de hojas de estilo (CSS)

El chat permite modificar el aspecto visual de las salas de forma independiente (color de texto, fondos, tamaños, etc...).
Para hacerlo es necesario editar el archivo CSS del estilo que esté en uso (/ext/canidev/chat/styles/{su estilo}/theme/chat.css), en el que deberá incluir el código para modificar su chat.

Los códigos más comunes están listados en la tabla de abajo, lo único que hay que hacer es cambiar {ID} por el identificador de la sala que se desee modificar.
Este identificador podrá encontrarlo en la sección Administrar salas del Panel de Administración.
Código Descripción
#chat-body[data-active="{ID}"] Caja global del chat.
#chat-body[data-active="{ID}"] #chat-title Titulo del chat.
#chat-body[data-active="{ID}"] #chat-content Caja interior que contiene todos los elementos del chat.
#chat-body[data-active="{ID}"] #chat-conversation-container Caja de conversaciones.
#chat-body[data-active="{ID}"] #chat-right-panel Lista de usuarios de la parte derecha.
#chat-body[data-active="{ID}"] #chat-tabs li Pestañas de salas.
#chat-body[data-active="{ID}"] #chat-tabs li.active Pestaña de sala activa (actual).
#chat-body[data-active="{ID}"] #chat-message textarea Caja de entrada de texto.
#chat-body[data-active="{ID}"] #chat-dialog Caja de dialogos.
#chat-body[data-active="{ID}"] .chat-row Fila de mensaje.
#chat-body[data-active="{ID}"] .chat-row:nth-child(even) Fila de mensaje (solo las pares).
#chat-body[data-active="{ID}"] .chat-row:hover Fila de mensaje (solo al pasar el ratón por encima).
#chat-body[data-active="{ID}"] #chat-toolbar Barra de tareas.
#chat-body[data-active="{ID}"] #chat-toolbar a Enlaces de la barra de tareas.
#chat-body[data-active="{ID}"] .cbb-btn Botones.
#chat-body[data-active="{ID}"] .cbb-btn .fa Iconos de los botones.
#chat-body[data-active="{ID}"] .state-notice Caja de noticias.
#chat-body[data-active="{ID}"] .chat-tip-message Caja de consejos.
#chat-body[data-active="{ID}"] .ic-row-actions Caja que contine las acciones de las filas.
#chat-body[data-active="{ID}"] .ic-row-actions a Acciones de las filas.

Ejemplos de uso:

En estos ejemplos se usa "1" como ID de sala (1 equivale a la sala General)

/* Cambiamos el color del texto de todo el chat */
#chat-body[data-active="1"] {
color: #fff;
}

/* Cambiamos el fondo interior */
#chat-body[data-active="1"] #chat-content {
background: black;
}

/* Cambiamos la caja de conversación y la caja con la lista de usuarios */
#chat-body[data-active="1"] #chat-conversation-container,
#chat-body[data-active="1"] #chat-right-panel {
background: rgba(255,255,255,0.4);
border-color: #000;
}

/* Cambiamos el color del borde de todas las pestañas */
#chat-body[data-active="1"] #chat-tabs li {
border-color: #000;
}

/* Cambiamos la pestaña activa */
#chat-body[data-active="1"] #chat-tabs li.active {
background: rgba(255,255,255,0.8);
border-top-color: #000;
color: #000;
}

/* Fondo y color de la caja de texto */
#chat-body[data-active="1"] #chat-message textarea {
background: rgba(0,0,0,0.6);
color: #fff;
}

/* Nuevo color para los diálogos y las filas con mensajes */
#chat-body[data-active="1"] #chat-dialog,
#chat-body[data-active="1"] .chat-row {
color: #000;
}

/* Nuevo fondo cuando pasamos por encima de una fila */
#chat-body[data-active="1"] .chat-row:hover {
background: rgba(0,0,0,0.2);
}

Eventos • Core


chat.acp_config_vars

  • Añadido en versión: 1.1.1
  • Ubicación: controller/acp_controller_config.php
  • Argumentos: display_vars, submit

chat.acp_pages_vars

  • Añadido en versión: 1.2.0
  • Ubicación: controller/acp_controller_pages.php
  • Argumentos: display_vars, page_data, submit

chat.acp_rooms_vars

  • Añadido en versión: 1.2.0
  • Ubicación: controller/acp_controller_rooms.php
  • Argumentos: display_vars, room_data, submit

chat.acp_rooms_submit

  • Añadido en versión: 1.2.0
  • Ubicación: controller/acp_controller_rooms.php
  • Argumentos: sql_ary

chat.acp_texts_vars

  • Añadido en versión: 1.2.0
  • Ubicación: controller/acp_controller_texts.php
  • Argumentos: display_vars, submit

chat.after_action_run

  • Añadido en versión: 1.2.0
  • Ubicación: libraries/action_manager.php
  • Argumentos: action, template_filename, json

chat.modify_user_row

  • Añadido en versión: 1.2.0
  • Ubicación: libraries/action_manager.php
  • Argumentos: row, user_row

chat.modify_message_row

  • Añadido en versión: 1.2.0
  • Ubicación: libraries/action_manager.php
  • Argumentos: row, ary

Eventos • Javascript


chat.afterSend

  • Añadido en versión: 1.2.0
  • Argumentos: event

chat.beforeEventDispatch

  • Añadido en versión: 1.2.0
  • Argumentos: object

chat.beforeInit

  • Añadido en versión: 1.1.1
  • Argumentos: instance

chat.beforeSend

  • Añadido en versión: 1.2.0
  • Argumentos: event

chat.beforeSubmit

  • Añadido en versión: 1.1.1
  • Argumentos: event

chat.onBindInput

  • Añadido en versión: 1.2.0
  • Argumentos: object

chat.onBindRows

  • Añadido en versión: 1.1.1
  • Argumentos: instance

chat.onBindTabs

  • Añadido en versión: 1.1.1
  • Argumentos: instance

chat.onBindUserlist

  • Añadido en versión: 1.1.1
  • Argumentos: instance

chat.onCloseRoom

  • Añadido en versión: 1.2.0
  • Argumentos: object

chat.onConnect

  • Añadido en versión: 1.1.1
  • Argumentos: Ninguno

chat.onDisconnect

  • Añadido en versión: 1.1.1
  • Argumentos: Ninguno

chat.onInit

  • Añadido en versión: 1.1.1
  • Argumentos: instance

chat.onOpenRoom

  • Añadido en versión: 1.2.0
  • Argumentos: object

Eventos • Plantillas


chat_body_after

  • Añadido en versión: 1.1.1
  • Ubicación: event/overall_footer_content_after.html

chat_body_before

  • Añadido en versión: 1.1.1
  • Ubicación: event/overall_footer_content_after.html