joomlaSite

Joomla update

The html5 Joomla plugin was updated.

It corrects bugs and adds the correct role mapping:

It handles now the default Joomla roles

  • Administrator
  • Author
  • Editor
  • Guest
  • Manager
  • Public
  • Publisher
  • Registered
  • Super Users

You can download it from: https://extensions.joomla.org/extension/html5-chat/

Installation process

  1. In Joomla top menu: Extensions->Manage->Install
  2.  Choose the tab “install from URL” and set the value to  https://html5-chat.com/joomla/html5chat.zip
  3. Go to menu Extensions->plugin and find html5chat (or search for html5chat)
  4. Enable plugin that  html5chat plugin (status check)
  5. click on html5chat plugin. You should then enter the webmasterid and Password
    enableJoomlaYou can get these data when you register the plugin at : https://html5-chat.com/register
  6. Create an article/page that will contain the chat. Inside that page, insert
    [html5chat width=”100%” height=”800px”]

You will now have the html5 chat inside that page article.

 

Oxwall and html5-chat integration

Official plugin

There is an official html5-chat plugin made by oxwall team (Skalfa LLC)

https://developers.oxwall.com/store/item/1554

which does the job.

How to make it full screen ?

This plugin embeds the chat into the 

<div class="owc_content">

and whose size can be too small for the chat. The idea would be to make it full screen (and just keep the header). For that you need to edit some files

in /ow_includes/config.php change the OW_DEV_MODE to false (this allows to empty cache), after the manipulation, you will set it back to true

define('OW_DEV_MODE', true);

in /ow_plugins/html5-chat-com/views/controllers/chat_index.html add these lines after {style}

{style}

.ow_content {
    position: absolute;
    top: 69px;
    left: 0;
    bottom: 0;
    right: 0;
    height: 100%!important;
}

div.ow_footer {
    display:none;
}

check it: if everything is ok, then set back the OW_DEV_MODE to false

define('OW_DEV_MODE', false);

 

wowonder

html5 chat and wowonder script

How to integrate html5 chat with social wowonder script ?

Edit .htaccess and add that line

RewriteRule ^html5-chat$ index.php?link1=html5-chat [NC,QSA]

 

Edit index.php and add these lines

case 'html5-chat':
    include('sources/html5-chat.php');
    break;

 

create sources/html5-chat.php  :

 

<?php if (empty($wo['user'])) {
    header("Location: " . Wo_SeoLink('index.php?link1=welcome'));
    exit();
}
$webmasterid = YOUR_WEBMASTERID;
$password = 'YOUR_SCRIPT_CHAT_PASSWORD';
$user = array(
    'id'=>$wo['user']['user_id'],
    'username'=>$wo['user']['username'],
    'image'=>base64_encode($wo['user']['avatar']),
    'gender'=>$wo['user']['gender'],
    'role'=>($wo['user']['admin']==1)?'admin':'user',
    'password'=>$password
);
$encrypted = file_get_contents("https://html5-chat.com/protect/".base64_encode(json_encode($user)));
?>
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Chat</title>
</head>
<body>
    <script src="https://html5-chat.com/script/<?=$webmasterid?>/<?=$encrypted?>"></script>
</body>
</html>
<?php exit();?>

Just change these 2 parameters:

YOUR_WEBMASTERID : your script webmasterid

YOUR_SCRIPT_CHAT_PASSWORD : your script password

then navigate to : https://www.yoursite.com/html5-chat.php

Regards

Wix and html5 chat

wixHow to integrate html5-chat into Wix ?

 

Wix a a very popular CMS hosted system used by millions of websites.
It is very easy to manage for people who do not have any computer knowledge.

Problem is, you cannot integrate html5-chat into wix: The reason for that limitation is that Wix does not allow neither to insert html code nor Js into his pages, or more precisely, it creates a sandbox iframe to embed the html or JS.

Problem of that iframe, is that this iframes does not have rights to access webcam : now days moderne browsers needs special permissions on iframe to access features as webcam, micro or geolocation.

The only way to have its own html5 chat on wix platform is to create an external link (target=”_blank”) that points to our chat:

<a href ="https://html5-chat.com/chat/yourWebmasterid" target="_blank">My own chat</a>

We hope Wix will chnage that soon.

 

phpsocial

html5 chat and phpsocial integration

PHP social is a cool social “facebook” like script.  It is not free but has a moderated price of 49$.

We suppose we want to get a chat page in full screen, auto loggedon and called “chat”.

(You need to be registered and loggedon on netswing.fr to test it)

ex: https://www.netswing.fr/chat

How can we integrate HTML5-chat into php social ?

Step1 : edit .htaccess and add this line

RewriteRule ^chat/?$        index.php?a=chat          [NC]

Step2 : edit config.php and add

'chat'        => 'chat',

Step3: download this script: chat , unzip it and edit it and change the 2 lines: webmasterid and password

$webmasterid = xxx;
$password = 'xxxx';

Step4: FTP upload chat.php to /sources folder

Step5: Test that your chat works fine on https://www.netswing.fr/chat

 

Here is the source of chat.php 

<?php
function PageMain() {
/*
* Change these 2 parameters and put your webmasterid and your chat password here
*/
$webmasterid = 'xxxxx'; // your webmasterid number
$password = 'yyyyy'; // your chat password
//

global $TMPL, $LNG, $CONF, $db, $user, $settings, $plugins;
if(!isset($user) || !isset($user['idu']) ) {
header("Location: ".$CONF['url']."/index.php?a=welcome");
}

$json = json_encode(array('id'=>$user['idu'], 'username'=>$user['username'], 'image'=>$CONF['url'].permalink('/thumb.php?t=a&w=112&h=112&src='.$user['image']),
'gender'=>($user['gender'] == 1) ? 'male' : 'female', 'role'=>'user', 'profile'=>$CONF['url']. '/profile/'.$user['username'], 'password'=>$password));
$encoded = file_get_contents("https://jwt.html5-chat.com/protect/".base64_encode($json));
ob_start();?>
<script src="https://jwt.html5-chat.com/script/<?=$webmasterid?>/<?=$encoded?>"></script>
<?php
$script = ob_get_clean();
echo $script;
exit;
}

HTML5 chat and JOOMLA: new html5chat joomla plugin


! WARNING ! A new update of Joomla plugin can be found here !


You can now easily integrate html5 chat into your joomla

The joomla plugin can be downloaded from this link

Here is how to make it run in 2 minutes:

HTML5 allows you to easily add a webcam video chat into your JOOMLA page.

###How to use it:
1) register free on https://html5-chat.com/register

2) install the plugin and setup the password and webmasterid parameters you got when registered.

3) add a new article and insert a shortcode like

          [html5chat width="100%" height="800px"]

You will get your chat with 100%, 800px dimensions with authenticated user (username, role)

 

datingscript

html5 and datingsite integration

How to integrate html5-chat and datingscript ?

 

Here is a snippet to help you to integrate html5 chat and dating script.

 

Just edit $password and $webmasterid variables

 

<?php
ini_set('display_errors', 1);
error_reporting(E_ALL);
require '../vendor/autoload.php';
include('../application/config.php');
use \Firebase\JWT\JWT;
session_start();

if (!isset($_SESSION['session']['username'])) {
    header('Location:' . $config['base_url'] . 'users/login');
    exit;
}
$password = 'YOUPASSWORD HERE';
$webmasterid = 'YOUR SCRIPT ID HERE';
$gender = isset($_SESSION['session']['data_genre']) && is_array($_SESSION['session']['data_genre']) && $_SESSION['session']['data_genre'] ? (key($_SESSION['session']['data_genre']) == 1 ? 'Homme' : 'Femme') : '';
$avatar = isset($_SESSION['session']['picture_file_path'], $_SESSION['session']['picture_file_name'], $_SESSION['session']['picture_file_ext']) && $_SESSION['session']['picture_file_path'] ? $_SESSION['session']['picture_file_path'] . '/' . $_SESSION['session']['picture_file_name'] . '.' . $_SESSION['session']['picture_file_ext'] : '';
if(!$avatar) {
    $avatar = '0.svg';
}

$mysuer = array('webmasterid' => $webmasterid, 'password' => $password, 'username' => $_SESSION['session']['username'], 'gender' => $gender, 'role' => 'user', 'image' => $config['base_url'] . 'uploads/' . $avatar);
$encoded = JWT::encode($mysuer, $password);
?>
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>Html5 chat</title>
	 <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="main">
    <div style="width:100%; height:100%;">
        <script src="https://html5-chat.com/script/<?= $webmasterid ?>/<?= $encoded ?>"></script>
    </div>
</div>	
</body>
</html>
phpfox

How to integrate html5 chat into phpfox

How to integrate html5 chat into phpfox ?

step 1: download the phpfox module here

step 2 : open file

\PF.Base\module\html5chat\template\default\controller\index.html.php

and edit these lines 16-17

$webmasterid = xxxx; // ENTER your script id (webmasterid) here
$password = 'my secret password'; // ENTER your HTML5 password here

and fill with your own data

step3: open your website https://yourwebsite.com/ws/index.php/html5chat

You will be loggedon with your username, gender, avatar and role

VLD

html5 + vldpersonals: how to add html5 chat into vldpersonals

Integration of html5-chat into vldpersonals

 

edit the .htaccess file and that line:

RewriteRule ^chatHtml5/?$ chatHtml5.php [L]

which means: your chat will be available on https://www.yoursite.com/chatHtml5

Create a blank chatHtml5.php file on root of your website / and paste the script

<?php
ini_set('display_errors', 1);error_reporting(E_ALL);

session_start();
if (!isset($_SESSION['username'])) {
    header('Location:/');exit;
}
include('includes/config.php');
mysql_connect($conf['db_hostname'], $conf['db_username'], $conf['db_password']) or die();
mysql_select_db($conf['db_name']) or die("ERROR: Cannot SELECT the Database.");

function getAvatar($username) {
    $get_pic = mysql_query("SELECT picture,joindate,member_id FROM vld_members WHERE username = '$username' LIMIT 1") or die(mysql_error());
    while($got_pic = mysql_fetch_array($get_pic)) {
        $members_image = $got_pic['picture'];
        $member_joindate = $got_pic['joindate']; // this will be the members joindate from the members table
        $member_id = $got_pic['member_id']; // this is the ID of the member you want to show the avatar
    }
    if ($members_image == '') {
        $avatar = "/media/user_picture_none.gif"; // set here the path to the image that shows if user has no avatar uploaded
    }else
    {
        $media = substr($member_joindate, -1, 1).'/'.
            substr($member_joindate, -2, 1).'/'.
            substr($member_joindate, -3, 1).'/'.
            substr($member_joindate, -4, 1).'/'.
            $member_id.'/';
        $path = '/media/uploads/'.$media.'photo_'.$members_image;
        $avatar = $path;
    }
    return $avatar;
}


$password = 'seccret Password';
$webmasterid = 'xxxxxxxx';

$json = json_encode(array(
        'webmasterid'=>$webmasterid ,
        'password'=>$password,
        'username'=>$_SESSION['username'],
        'gender'=>$_SESSION['profile_fields']['profile_gender1'],
        'role'=>'user',
        'image'=>$conf['virtual_path'].getAvatar($_SESSION['username'])
    )
);
$encoded = file_get_contents("https://html5-chat.com/protect/".base64_encode($json));

?>
<!doctype html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title>Chat HTML5</title>
</head>
<body>
<script src="https://html5-chat.com/script/<?=$webmasterid?>/<?=$encoded?>"></script>
</body>
</html>

 

 

 

 

 

OLD version of VLD

<?php
require 'vendor/autoload.php';
use \Firebase\JWT\JWT;
session_start();
if (!isset($_SESSION['username'])) {
    header('Location:/');exit;
}
include('includes/config.php');
mysql_connect($conf['db_hostname'], $conf['db_username'], $conf['db_password']) or die();
mysql_select_db($conf['db_name']) or die("ERROR: Cannot SELECT the Database.");

function getAvatar($username) {
    $get_pic = mysql_query("SELECT picture,joindate,member_id FROM vld_members WHERE username = '$username' LIMIT 1") or die(mysql_error());
    while($got_pic = mysql_fetch_array($get_pic)) {
        $members_image = $got_pic['picture'];
        $member_joindate = $got_pic['joindate']; // this will be the members joindate from the members table
        $member_id = $got_pic['member_id']; // this is the ID of the member you want to show the avatar
    }
    if ($members_image == '') {
        $avatar = "/media/user_picture_none.gif"; // set here the path to the image that shows if user has no avatar uploaded
    }else
    {
        $media = substr($member_joindate, -1, 1).'/'.
            substr($member_joindate, -2, 1).'/'.
            substr($member_joindate, -3, 1).'/'.
            substr($member_joindate, -4, 1).'/'.
            $member_id.'/';
        $path = '/media/uploads/'.$media.'photo_'.$members_image;
        $avatar = $path;
    }
    return $avatar;
}
$password = 'yourHTML5-chatPassword';
$webmasterid = 'yourHTML5WebmasterId',
$mysuer = array('webmasterid'=>$webmasterid , 'password'=>$password, 'username'=>$_SESSION['username'], 'gender'=>$_SESSION['profile_fields']['profile_gender1'], 'role'=>'user', 'image'=>$conf['virtual_path'].getAvatar($_SESSION['username']));
$encoded = JWT::encode($mysuer, $password);
?>
<!doctype html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title>Chat HTML5</title>
</head>
<body>
<script src="https://html5-chat.com/chat/<?=$webmasterid?>/<?=$encoded?>"></script>
</body>
</html>

You need of course to integrate the JWT libraries for that.

For PHP, we use for instance: https://github.com/firebase/php-jwt (if you use another langage, pick your library from jwt.io

 

 

 

html5 + boonex: how to integrate webcam chat with boonex ?

Here is a sample code on how to add html5-chat into boonex in full screen

 

<?php
require_once( 'inc/header.inc.php' );
require_once( BX_DIRECTORY_PATH_INC . 'design.inc.php' );
require_once( BX_DIRECTORY_PATH_INC . 'profiles.inc.php' );
bx_import('BxDolModuleDb');

function getUser() {
    $iUserId = getLoggedId();
    if (!$iUserId) {
        header('Location:/');
        exit;
    }
    $data = getProfileInfo($iUserId);
    bx_import('BxDolMemberInfo');
    $sThumbSetting = getParam('sys_member_info_thumb_icon');
    $o = BxDolMemberInfo::getObjectInstance($sThumbSetting);
    $sThumbUrl = $o ? $o->get($data) : '';
    $bThumb = !empty($sThumbUrl);

    $role = ($data['Role'] == 3) ? 'Administrator' : 'Member';
    $gender = ($data['Sex'] == '') ? '--' : $data['Sex'];
    if(empty($sThumbUrl)) {
        $avatar = "Avatar is not available";
    } else {
        $avatar = $sThumbUrl;
    }
    if ($data['NickName']=='admin') {
        $data['NickName'] = 'admin ';
    }
    return array('id'=>$iUserId, 'username'=>$data['NickName'], 'gender'=>$gender, 'avatar'=>$avatar, 'role'=>$role);
}
?>
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Webcam chat</title>
    <style>
        html,boby {
            width: 100%;
        }
        #html5ChatContainer {
            width: 100%;
            position: fixed;
            height:100%;
        }
    </style>
</head>
<body>
<?php
$user = getUser();
?>
<script src='<?=sprintf('https://html5-chat.com/script/1819/5a3a6189ec749/%s/%s/%s', $user['username'], $user['gender'], base64_encode($user['avatar']));?>'></script>
</body>
</html>