volume2

Display Volume on cams

You can now have a visual volume indicator inside any webcam.

To enable that feature, go to chatadmin/config/webcam and set
Display user volume

The volume will be displayed inside the webcam and inside the userlist

Volume indicator…

You can also display an effect on video (red border) when volume is detected (when user speaks or streams sound): you have to check this propetry:

Add red border on webcam when volume detected (addEffectOnVolumeDetection) in chatadmin/config/webcam

Red border effect on volume detection.
chamaelon

Integrate HTML5 chat with chameleon software online

Here is the step to integrate html5 chat with https://www.chameleonsoftwareonline.com/

Create html5chat.php on root and paste there this code:

<?php
if (empty($_GET['cmd']) || $_GET['cmd'] != 'lang')
    $area = "login";
include("./_include/core/main_start.php");
include("./_include/current/menu_section.class.php");
$_GET['display'] = get_param('display', User::displayProfile());
$where = ' u.user_id = ' . to_sql(guid(), 'Number');
$webmasterid = xxxxx;
$password = "yyyyyy";
$id = $GLOBALS['g_user']['user_id'];
$avatars = glob("_files/photo/" . $id . "_*_m.jpg");
$avatar = (count($avatars)) ? "//{$_SERVER['SERVER_NAME']}/" . $avatars[0] : '';
switch($GLOBALS['g_user']['gender']) {
case 'C':
$gender = 'male';
break;
case 'F':
$gender = 'female';
break;
default:
$gender = 'male';
break;
}
$myuser = array(
    'username'  => $GLOBALS['g_user']['name'],
    'password'  => $password,
    'gender'    => $gender,
    'role'      => $GLOBALS['g_user']['role'],
    'image'     => $avatar,
    'profile'   => base64_encode("//{$_SERVER['SERVER_NAME']}/users_online.php?display=profile&uid=$id&offset=1")
);
$json = json_encode($myuser);
$encoded = file_get_contents("https://jwt.html5-chat.com/protect/" . base64_encode($json));
?>
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Webcam Chat</title>
    <style>
        html, body {
            width: 100%;
            height: 100%;
        }
    </style>
</head>
<body>
    <script src="https://html5-chat.com/script/<?=$webmasterid?>/<?= $encoded ?>"></script>
</body>
</html>

Replace xxxx and yyyy by your webmasterid and your html5-chat password account.

signup

How to incite a guest user to register ?

There is a new interesting feature in html5 chat to improve your registration rate. You can now disconnect a role from the chat after N seconds and redirect him to an Url

We think of course about the guets role, than will be disconnected from the chat after N m minutes and will be redirected to the registration page.

You can do that now in roles: there are 2 new properties in your chatadmin / roles panel -> Ads and messages tab

disconnectAfterNSeconds : ex: for 3 minutes, set 180 (180 seconds = 3 minutes)

redirectAfterDisconnection (put full http path like: https://www.rezocoquin.com)

wall layout

The “Wall” layout

We have added a new layout called “wall“.

This layout allows to add camera in the top of the chat with a wrapping feature: when there is no more space for a cam, the new cam goes to the bottom, creating a “wall”.

This layout allows to watch many cams simultaneously without having to scroll or split views.

The WALL layout.

To change the layout of the chat, simply go to your chatadmin panel and choose the layout panel.

The wall layer can be useful for conferences when you need to watch at all participants at the same time.

ad

How to insert ad into chat ?

There are many ways to insert ads into chat. This is especially easy when you know some JS.

Remember: you can your OWN javascript into the chat.

If you want to insert ads inside the text chat, then you should use the news managements.

If you want some visual ad, there is a <div id=”ad”></div> present on the chat (on top right) when you can insert your ads. The best way to do that is also to insert your OWN javascript into the chat and with some code display the ads.

Here is a sample of how to randomly display 3 ads every 30 seconds:

$(document).ready(function () {
// list of ads !
let ads = [
"<a href='https://www.yoursite.com' target='_blank'><img src='https://www.yoursite.com/img/ad1.png'></a>",
"<a href='https://www.yoursite.com' target='_blank'><img src='https://www.yoursite.com/img/ad2.png'></a>",
"<a href='https://www.yoursite.com' target='_blank'><img src='https://www.yoursite.com/img/ad3.png'></a>",
];
setTimeout(function() {
let ad = randomAd = ads[Math.floor(Math.random() * ads.length)]; // pick a random ad
$('#ad').empty().append(ad);

} , 30 *1000); // loop every 30 seconds
});
Sorting

Initially sorting users

You can now decide how your users will appear in your user list.
They can initially be sorted by:

  • None : this is the default state: users will appear by history: the latest ones will be appended to the end of the list
  • username : users will be A-Z sorted by their username
  • webcams: those who have webcams will appear at the top of the lits
  • usernames and webcam : webcams first and then by username

You can set the initial sorting in your Chatadmin panel -> config -> Users Management

delete messages

Delete individual message from chat

You can now delete messages in real time directly from the chat

  • delete all messages from an user
  • delete an individual message from an user

Go to roles and check (admin or moderator role for instance)

  • canDeleteMessage: this allow to delete all user’s messages
  • canDeleteIndividualMessage: this allow to delete any message

Also make sure that the role can delete other user’s messages
ex: a moderator should not be able to delete admin’s messages
This can be done with canUserMessagesDeleted

hosting

How to host your chat on YOUR server ?

We have 2 formulas to allow you to host your chat on YOUR servers

Purchase the code source and we install it to your server.


This formula is expensive but you are totally independent. You can re-install it if needed, modify the source code. This is adequate for high trafic chat websites.

We now have a new intermediate formula

The chat remains on our server but you host media streams and sockets.
We can install the media server part (streaming) and the sockets (chat text) on your server.

What are the advantages of hosting that on your server ?

  • You have 100% bandwidth of your server
  • You have 100% CPU power of your server
  • you have 100% CPU control of your server
  • You are independent

Ready to go ?

  • You still got updates automatically since the chat is hosted on our servers except the webcam and the sockets !
  • You still have to pay subscription since the chat script part is still hosted on our servers
  • Generally it takes 24-48 hours so we set it up on your server
  • You need a dedicated server with ROOT access
  • We recommend 4 Giga RAM, 4 cores and root access. It must be LINUX. We recommend DEBIAN 9 distribution (but centos/ubuntu… are ok)
  • We need a ROOT access to your server
  • Of course you can still use your server for other tasks like hosting your sites
  • Price is 199€. It is JUST ONE time price. No recurrent payment

Html5 chat, SVG drawing feature

We added a new tool, called SVG drawing.
You can now easily drawn and append some Vector – SVG – pictures inside the chat. The Drawing tool has most of tools you need such as:

  • Hand writing
  • Curves drawing
  • Lines drawing
  • Shapes (rectangle, circle…)
  • Predefined shapes
  • Text
  • Transformations: scale, rotations
  • Alignements
  • Z-ordering

You need to enable the property called “can Draw” that in roles to add a new button in the chat bar.

HTML5 chat SVG editor.
HTML5 chat SVG editor.
socialENgine

SocialEngine chat integration

Social engine is a php commercial dating script.

UPDATE

Download html5-chat plugin from this link

Edit application\modules\Html5Chat\controllers\indexController.php
And insert that script

<?php

class Html5Chat_IndexController extends Core_Controller_Action_Standard
{
  public function indexAction()
  {
      $webmasterid = 'xxxxxx'; // change that
      $password = 'yyyyyy'; // change that

      
      $viewer = Engine_Api::_()->user()->getViewer();
      $userid = $viewer->getIdentity();
      $username = $viewer->getTitle();
      $fields = Engine_Api::_()->fields()->getFieldsValuesByAlias($viewer);
      $user = Engine_Api::_()->getItem('user', $userid);
      $avatar = $user->getPhotoUrl('thumb.profile');
      $profileLink = $viewer->getHref();
      $gender = 'male';
      $role = $user_level = Engine_Api::_()->user()->getViewer()->level_id;
      $roleLabel = Engine_Api::_()->getItem('authorization_level', $role)->getTitle();
      switch($fields['gender']) {
          case 1:
              $gender = 'male';
              break;
          case 2:
              $gender = 'female';
              break;
          case 3:
              $gender = 'couple';
              break;
      }
      switch($roleLabel) {
          case 'Superadmins':
              $role = 'admin';
              break;
          case 'Admins':
              $role = 'admin';
              break;
          case 'Moderators':
              $role = 'moderator';
              break;
          case 'Default Level':
              $role = 'guest';
              break;
          case 'Public':
              $role = 'guest';
              break;
          case 'Monthly Member':
              $role = 'user';
              break;
          case '6 Month Member':
              $role = 'user';
              break;
          case 'Yearly Member':
              $role = 'user';
              break;
          case '15 Day Free Membership Trial':
              $role = 'guest';
              break;
          default:
              $role = 'user';
              break;
      }

      $json = json_encode(array(
              'id'=>$userid,
              'username'=>$username,
              'password'=>$password,
              'gender'=>$gender,
              'role'=>$role,
              'image'=>'//'.$_SERVER['HTTP_HOST'].$avatar,
              'profile'=>'//'.$_SERVER['HTTP_HOST'].$profileLink
          )
      );
      $encoded = file_get_contents("https://jwt.html5-chat.com/protect/".base64_encode($json));
      $this->view->script = "https://html5-chat.com/script/$webmasterid/$encoded";
      $this->_helper->layout->disableLayout();
  }
}

Upload the files to your site with FTP Both folders: (modules and packages)
Go to your social Engine admin panel and go to menu
manage->Packages & plugins and enable html5-chat plugin

Congratulations:
Your chat is not available at url : https://yoursite.com/html5-chat


OLD (BAD) WAY

We will add the link chat into /groups/chat so your chat link will be
https://yoursite.com/groups/chat

edit /application/modules/Group/controllers/IndexController.php
And add this function

public function chatAction() {
    $webmasterid = xxxx;
    $password = 'yyyy';
    $viewer = Engine_Api::_()->user()->getViewer();
    $userid = $viewer->getIdentity();
    $fields = Engine_Api::_()->fields()->getFieldsValuesByAlias($viewer);
    $user = Engine_Api::_()->getItem('user', $userid);
    $avatar = $user->getPhotoUrl('thumb.profile');
    $profileLink = $viewer->getHref();
    $gender = 'male';
    $role = $user_level = Engine_Api::_()->user()->getViewer()->level_id;
    $roleLabel = Engine_Api::_()->getItem('authorization_level', $role)->getTitle();
    switch($fields['gender']) {
        case 1:
            $gender = 'male';
            break;
        case 2:
            $gender = 'female';
            break;
        case 3:
            $gender = 'couple';
            break;
    }
    switch($roleLabel) {
        case 'Superadmins':
            $role = 'admin';
            break;
        case 'Admins':
            $role = 'admin';
            break;
        case 'Moderators':
            $role = 'moderator';
            break;
        case 'Default Level':
            $role = 'guest';
            break;
        case 'Public':
            $role = 'guest';
            break;
        case 'Monthly Member':
            $role = 'user';
            break;
        case '6 Month Member':
            $role = 'user';
            break;
        case 'Yearly Member':
            $role = 'user';
            break;
        case '15 Day Free Membership Trial':
            $role = 'guest';
            break;
        default:
            $role = 'user';
            break;
    }

    $json = json_encode(array(
            'id'=>$userid,
            'username'=>$fields['first_name'],
            'password'=>$password,
            'gender'=>$gender,
            'role'=>$role,
            'image'=>'//'.$_SERVER['HTTP_HOST'].$avatar,
            'profile'=>'//'.$_SERVER['HTTP_HOST'].$profileLink
        )
    );
    $encoded = file_get_contents("https://jwt.html5-chat.com/protect/".base64_encode($json));
    $this->view->script = "https://html5-chat.com/script/$webmasterid/$encoded";
    $this->_helper->layout->disableLayout();
}

replace xxxx by your webmasterid and yyyy with your html5-chat password

You can get values profil type from table engine4_authorization_levels

create chat.tpl in application/modules/Group/views/scripts/index/

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Chat</title>
</head>
<body>
<script src="<?=$this->script?>"></script>
</body>
</html>

and you will get your own chat on /groups/chat