You are here:
Main › Downloads › phpBB Extensions › cBB Chat v1.2.7 › Documentation

Documentation :: cBB Chat

Quick Guide • Requirements

cBB Chat needs very few requirements to run correctly.

The basic requirements are:

A phpBB forum whose version is equal or greater than 3.2.0.
The explorer must be support Javascript to use and manage the extension.

Quick Guide • Install

Unzip the cBB Chat zip file in a local folder on your computer.
Upload all the files contained in the upload folder of that file (maintaining the directory structure) to the ext directory located in the root directory of your forum.
The final route for the extension files should be: /ext/canidev/chat/
Using your web browser, navigate to the Administration Panel and go to Customize >> Extensions
Find cBB Chat and click in the Enable option.

Quick Guide • Update

Using your web browser, navigate to the Administration Panel and go to Customize >> Extensions, Find cBB Chat and click in the Disable option.
Delete the folder chat which is within the directory /ext/canidev/ in the server.
Download and unzip the cBB Chat zip file in a local folder on your computer.
Upload all files contained in the upload directory in that file (keeping the directory structure) to the ext directory in the root of your forum.
Using your web browser, navigate to the Administration Panel and go to Customize >> Extensions, Find cBB Chat and click in the Enable option.

Quick Guide • Uninstall

cBB Chat can be uninstalled in a few steps:

Using your web browser, visit the Administration Panel and go to Customise >> Manage Extensions
Find cBB Chat and click in the Disable option.
When the extension is disabled, if you want to delete completly, click in Delete data and remove the directory /ext/canidev/chat from your server.

Tricks and Customization • Multiline texts

By default, on press the "Enter" key, the chat sends the chat message.
You can write multiline texts by using the Key Combination Ctrl + Enter. This produces a line break in the message.

Tricks and Customization • Automatic list creation

The chat editor can be convert many lines in a shorted or numeric list automatically.
To use this function you must select the lines to convert and do click in the List or Numeric List BBcode.

For example:

Line 1
	Line 2
	Line 3

Will be converted to:

[list]
	[*]Line 1
	[*]Line 2
	[*]Line 3
	[/list]

Tricks and Customization • Room Customization

Note:To perform this customization you need a basic knowledge of style sheets (CSS)

The chat allows to modify the visual aspect of the rooms independently (text color, backgrounds, sizes, etc ...).
To do this it is necessary to edit the CSS file of the style that is in use (/ext/canidev/chat/styles/{your style}/theme/chat.css), in which must include the code to modify your chat.

The most common codes are listed in the table below, all you have to do is change {ID} to the ID of the room you want to change.
This identifier can be found in the Manage rooms section of the Administration Panel.

Code	Description
#chat-body[data-active="{ID}"]	Global chat box.
#chat-body[data-active="{ID}"] #chat-title	Chat title box.
#chat-body[data-active="{ID}"] #chat-content	Inner box containing all chat elements.
#chat-body[data-active="{ID}"] #chat-conversation-container	Box of conversations.
#chat-body[data-active="{ID}"] #chat-right-panel	List of users on the right side.
#chat-body[data-active="{ID}"] #chat-tabs li	Room tabs.
#chat-body[data-active="{ID}"] #chat-tabs li.active	Active room tab (current).
#chat-body[data-active="{ID}"] #chat-message textarea	Text input box.
#chat-body[data-active="{ID}"] #chat-dialog	Dialog box.
#chat-body[data-active="{ID}"] .chat-row	Message row.
#chat-body[data-active="{ID}"] .chat-row:nth-child(even)	Message row (pairs only).
#chat-body[data-active="{ID}"] .chat-row:hover	Message row (only when mouseover).
#chat-body[data-active="{ID}"] #chat-toolbar	Toolbar.
#chat-body[data-active="{ID}"] #chat-toolbar a	Toolbar links.
#chat-body[data-active="{ID}"] .cbb-btn	Buttons.
#chat-body[data-active="{ID}"] .cbb-btn .fa	Button Icons.
#chat-body[data-active="{ID}"] .state-notice	Notices Box.
#chat-body[data-active="{ID}"] .chat-tip-message	Tips Box.
#chat-body[data-active="{ID}"] .ic-row-actions	Box containing the actions of the rows.
#chat-body[data-active="{ID}"] .ic-row-actions a	Actions of the rows.

Examples of use:

In these examples, "1" is used as room ID (1 is equivalent to the General Room)

/* Change the text color of the whole chat */
#chat-body[data-active="1"] {
    color: #fff;
}

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

/* Change the conversation box and the box with the list of users */
#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;
}

/* Change the border color of all tabs */
#chat-body[data-active="1"] #chat-tabs li {
    border-color: #000;
}

/* Change the active tab */
#chat-body[data-active="1"] #chat-tabs li.active {
    background: rgba(255,255,255,0.8);
    border-top-color: #000;
    color: #000;
}

/* Background and color of the text box */
#chat-body[data-active="1"] #chat-message textarea {
    background: rgba(0,0,0,0.6);
    color: #fff;
}

/* New color for dialogues and rows with messages */
#chat-body[data-active="1"] #chat-dialog,
#chat-body[data-active="1"] .chat-row {
    color: #000;
}

/* New background when we pass over a row */
#chat-body[data-active="1"] .chat-row:hover {
    background: rgba(0,0,0,0.2);
}

Developers • PHP Events

chat.acp_config_vars

Added in version: 1.1.1
Location: controller/admin_controller_config.php:100
Arguments: display_vars, submit

chat.acp_pages_vars

Added in version: 1.2.0
Location: controller/admin_controller_pages.php:85
Arguments: display_vars, page_data, submit

chat.acp_rooms_submit

Added in version: 1.2.0
Location: controller/admin_controller_rooms.php:239
Arguments: sql_ary

chat.acp_rooms_vars

Added in version: 1.2.0
Location: controller/admin_controller_rooms.php:154
Arguments: display_vars, room_data, submit

chat.acp_texts_vars

Added in version: 1.2.0
Location: controller/admin_controller_texts.php:128
Arguments: display_vars, submit

chat.after_action_run

Added in version: 1.2.0
Location: libraries/action_manager.php:1398
Arguments: action, template_filename, json

chat.modify_message_row

Added in version: 1.2.0
Location: libraries/action_manager.php:2226
Arguments: row, ary

chat.modify_user_row

Added in version: 1.2.0
Location: libraries/action_manager.php:1636
Arguments: row

chat.posts_query

Added in version: 1.2.3
Location: libraries/action_manager.php:1988
Arguments: sql_array

chat.topics_query

Added in version: 1.2.3
Location: libraries/action_manager.php:1954
Arguments: sql_array

Developers • Javascript Events

chat.afterSend

Location: styles/all/template/js/jchat.min.js
Arguments: action, service, sendData, response

chat.beforeEventDispatch

Location: styles/all/template/js/jchat.min.js
Arguments: originalEvent, action, service, msgID

chat.beforeInit

Location: styles/all/template/js/jchat.min.js
Arguments: service

chat.beforeSend

Location: styles/all/template/js/jchat.min.js
Arguments: action, service, sendData

chat.beforeSubmit

Location: styles/all/template/js/jchat.min.js
Arguments: service

chat.onBindInput

Location: styles/all/template/js/jchat.min.js
Arguments: service

chat.onBindRows

Location: styles/all/template/js/jchat.min.js
Arguments: service

chat.onBindTabs

Location: styles/all/template/js/jchat.min.js
Arguments: service

chat.onBindUserlist

Location: styles/all/template/js/jchat.min.js
Arguments: service

chat.onCloseRoom

Location: styles/all/template/js/jchat.min.js
Arguments: service, room

chat.onConnect

Location: styles/all/template/js/jchat.min.js
Arguments: service

chat.onDisconnect

Location: styles/all/template/js/jchat.min.js
Arguments: service

chat.onInit

Location: styles/all/template/js/jchat.min.js
Arguments: service

chat.onOpenRoom

Location: styles/all/template/js/jchat.min.js
Arguments: instance, room, backgroundAction

Developers • Style Events

chat_body_before

Location: styles/*/template/event/overall_footer_content_after.html:5

chat_body_after

Location: styles/*/template/event/overall_footer_content_after.html:117