catapush_widget v1.0.5

Catapush Javascript jQuery Widget

Introduction

Embed a reliable chat in less than ten minutes, based on Catapush. This jQuery widget allows you to transform an html element in a container where your users can receive your messages.

Download

The jQuery Widget can be downloaded here: full version js, minified version js, full version css, minified version css. If you are using npm (package.json) you can install it with:

npm install catapush_widget

Usage

Load the library and its dependencies:

<link type="text/css" href="https://npmcdn.com/catapush_widget/dist/catapush-widget-style.min.css" rel="stylesheet">

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/strophe.js/1.2.6/strophe.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/ydn.db/0.9.2/ydn.db-isw-core-qry.js"></script>
<script type="text/javascript" src="https://npmcdn.com/catapush/dist/catapush.min.js"></script>
<script type="text/javascript" src="https://npmcdn.com/catapush_widget/dist/catapush-widget.min.js"></script>

create a div container

<div id="catapush-widget"></div>

Load the widget and connect using an existing Catapush user:

    $('#catapush-widget').catapushWidget({
        'appKey': 'yourAppKey',
        'platform' : Catapush.PLATFORM.WEB, // Platform as defined in Catapush Library
        'user' : 'userIdentifier',
        'password' : 'userPassword'
    });

Options

The plugin offers many options, that can be passed during loading:

    var options = {'connect'...};
    $('#catapush-widget').catapushWidget(options);

List

• instance - use an existing Catapush connection, default null
• connect - automatically connect after initialization, default true
• display - object containing visualization settings:
  • overflow - scrollable widget in a scrollable container
  • showDayMark - add a day mark between different days
• interaction - object containing ui settings:
  • scrollOnMessage - scroll to last message received automatically
  • scrollOnLoad - scroll to last message on load
  • enable2Way - enables 2way input fields
• event - object containing event callbacks
  • beforeSendRead (message) - called before sending a read confirm, will not be sent if returns false
• attachments - object containing the handlers for local storage
  • storeHandler - manage storage of files received
  • openHandler - open files stored locally
  • enableOpenHandler - check if a file is stored locally

API

Plugins has some functions that can be called like this:

$('#catapush-widget').catapushWidget('scrollToLastMessage', true);

• scrollToLastMessage (immediate) - scroll to last message, immediate can be true or false (slow scroll)
• checkRead - force check read messages based on current visibility
• clear - reset all messages and data

Constants

• PLATFORMS - possible environments

Dependencies

The app depends on four libraries:

• jQuery - v. 1.7.0 and higher - a fast, small, and feature-rich JavaScript library;
• Strophe.js - v. 1.2.6 and higher - an XMPP library for JavaScript. Its primary purpose is to enable web-based, real-time XMPP applications that run in any browser;
• ydn-db - v. 0.9.2 and higher - Javascript database library for IndexedDB, WebSQL and WebStorage;
• catapush - v. 0.1 and higher - Main Catapush Library.

Can also been installed using npm (package.json):

..
  "dependencies": {
    "jquery": "*",
    "strophe.js": "*",
    "ydn.db": "*",
    "catapush": "*"
  },
..