Ajax Flash-Chat (blueimp) - Integrierung und Tricks

[4seven]

Integrierung

Als erstes, das AddIn vom Autor :
(habs mal hierher übertragen)


In der Datei includes/functions.php

Füge das...

Code: Select all

    function getChatInterface() {
       static $ajaxChat;
 
       if(!$ajaxChat) {
          // URL to the chat directory:
          if(!defined('AJAX_CHAT_URL')) {
             define('AJAX_CHAT_URL', './chat/');
          }
 
          // Path to the chat directory:
          if(!defined('AJAX_CHAT_PATH')) {
             define('AJAX_CHAT_PATH', realpath(dirname($_SERVER['SCRIPT_FILENAME']).'/chat').'/');
          }
 
          // Validate the path to the chat:
          if(@is_file(AJAX_CHAT_PATH.'lib/classes.php')) {
 
             // Include Class libraries:
             require_once(AJAX_CHAT_PATH.'lib/classes.php');
 
             // Initialize the chat interface:
             $ajaxChat = new CustomAJAXChatInterface();
          }
       }
 
       return $ajaxChat;
    }
 
    function getChatOnlineUsers() {
       return ($chatInterface = getChatInterface()) ? $chatInterface->getOnlineUsers() : array();
    }
 
    function getChatOnlineUserIDs() {
       return ($chatInterface = getChatInterface()) ? $chatInterface->getOnlineUserIDs() : array();
    }

vor dem ein

Code: Select all

?>

Füge das...

Code: Select all

                      if(in_array($row['user_id'], getChatOnlineUserIDs()))
                      {
                         $user_online_link = '<span title="* = '.strip_tags($row['username']).' is logged into the Chat">'.$user_online_link.'*</span>';
                      }

vor dem ein

Code: Select all

                      $online_userlist .= ($online_userlist != '') ? ', ' . $user_online_link : $user_online_link;

Füge das...

'CHAT_LINK' => 'chat/',
'CHAT_LABEL' => 'Chat ['.count(getChatOnlineUserIDs()).']',
'CHAT_TITLE' => 'Online: '.htmlentities(implode(', ', getChatOnlineUsers()), ENT_QUOTES, 'UTF-8'),

Anm: Bei Problemen, an fettmarkierter Stelle anpassen.

Siehe dazu auch hier:
http://www.phpbb.de/viewtopic.php?p=958092#958092

nach dem ein

Code: Select all

    // The following assigns all _common_ variables that may be used at any point in a template.
    $template->assign_vars(array(

------------------

Dann (My Version)

Öffne

styles/xxxxx/template/index_body.html

für prosilver

<br />{LOGGED_IN_USER_LIST}<br />User im {CHAT_LABEL} - {CHAT_TITLE}
<!-- IF LEGEND --><br /><em>{L_LEGEND}: {LEGEND}</em><!-- ENDIF --></p>

für subsilver2

<br />{LOGGED_IN_USER_LIST}<br />User im {CHAT_LABEL} - {CHAT_TITLE}</span></td>
</tr>
<!-- IF LEGEND -->
<tr>
<td class="row1"><b class="gensmall">{L_LEGEND} : {LEGEND}</b>

Jeweils Fettmarkiertes einbauen. Dann erscheint es so, wie im Demo-Board unten: Gäste in (Klammern), Board-Member normal.

-----------------------------

Als Mouseover in der styles/xxxxx/template/overall_header.html (Standard) folgendermaßen.

für prosilver

<ul class="linklist rightside">
<li class="icon-chat"><a href="{CHAT_LINK}" title="{CHAT_TITLE}">{CHAT_LABEL}</a></li>
<li class="icon-faq"><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}">{L_FAQ}</a></li>

für subsilver2

<td class="genmed" align="{S_CONTENT_FLOW_END}">
<a href="{CHAT_LINK}" title="{CHAT_TITLE}">{CHAT_LABEL}</a>
<a href="{U_FAQ}"><img src="{T_THEME_PATH}/images/icon_mini_faq.gif" width="12" height="13" alt="*" /> {L_FAQ}</a>

Wieder jeweils Fettmarkiertes einbauen. Dann erscheint es so, wie hier im Demo-Board oben.

[4seven]

Eigenes Icon


öffne

styles/prosilver/theme/buttons.css

finde

Code: Select all

, .icon-search

dahinter füge ein

Code: Select all

, .icon-chat

öffne

styles/prosilver/theme/colours.css

finde

Code: Select all

.icon-search               { background-image: url("{T_THEME_PATH}/images/icon_search.gif"); }

dahinter füge ein

Code: Select all

.icon-chat                   { background-image: url("{T_THEME_PATH}/images/icon_chat.png/*.gif"); }

öffne

styles/prosilver/theme/bidi.css

finde

Code: Select all

, .rtl .icon-search

dahinter füge ein

Code: Select all

, .rtl .icon-chat

öffne

styles/prosilver/template/overall_header.html

finde

Code: Select all

<li class="icon-faq"><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}">{L_FAQ}</a></li>

davor füge ein

Code: Select all

<li class="icon-chat"><a href="{CHAT_LINK}" title="{CHAT_TITLE}">{CHAT_LABEL}</a></li>

button mit namen > icon_chat.png/*.gif (transparent > width 16 / height 14 ) unter styles/prosilver/theme/images/ einfügen

[4seven]

Eigene Channels erstellen

Öffne

CustomAJAXChat.php

Finde und füge alle Teile zwischen Begin und End ein

Code: Select all

[code]function &getChannels() {

      if($this->_channels === null) {
         global $auth;

//############################--BEGIN--##########################################
$channels = array('Technics'=>1111, 'Coding'=>2222, 'Fun'=>3333);
//############################--END--###########################################

         $this->_channels = array();

         $allChannels = $this->getAllChannels();

         foreach($allChannels as $key=>$value) {
            // Check if we have to limit the available channels:
            if($this->getConfig('limitChannelList') && !in_array($value, $this->getConfig('limitChannelList'))) {
               continue;
            }

            // Add the valid channels to the channel list (the defaultChannelID is always valid):
            if($value == $this->getConfig('defaultChannelID') || $auth->acl_get('f_read', $value)) {
               $this->_channels[$key] = $value;
            }
         }
//############################--BEGIN--##########################################
$this->_channels = array_merge($this->_channels, array('Technics'=>1111, 'Coding'=>2222, 'Fun'=>3333));
//############################--END--###########################################
      }
      return $this->_channels;
   }

   // Store all existing channels
   // Make sure channel names don't contain any whitespace
   function &getAllChannels() {
      if($this->_allChannels === null) {
         global $db;
           $this->_allChannels = array();

         // Get valid phpBB forums:
         $sql = 'SELECT
                     forum_id,
                     forum_name
                  FROM
                     '.FORUMS_TABLE.'
                  WHERE
                     forum_type=1
                  AND
                     forum_password=\'\';';
         $result = $db->sql_query($sql);

         $defaultChannelFound = false;

         while ($row = $db->sql_fetchrow($result)) {
            $forumName = $this->trimChannelName($row['forum_name']);

            $this->_allChannels[$forumName] = $row['forum_id'];

            if(!$defaultChannelFound && $row['forum_id'] == $this->getConfig('defaultChannelID')) {
               $defaultChannelFound = true;
            }
         }
         $db->sql_freeresult($result);

         if(!$defaultChannelFound) {
            // Add the default channel as first array element to the channel list:
            $this->_allChannels = array_merge(
               array(
                  $this->trimChannelName($this->getConfig('defaultChannelName'))=>$this->getConfig('defaultChannelID')
               ),
               $this->_allChannels
            );
         }
//############################--BEGIN--##########################################
$this->_allChannels = array_merge($this->_allChannels, array('Technics'=>1111, 'Coding'=>2222, 'Fun'=>3333));
//############################--END--###########################################
      }
      return $this->_allChannels;
   }[/code]

Wenn du nur einen Channel haben willst, dann logischerweise nur so.

Code: Select all

('Technics'=>1111);

Channel-Namen ändern *auch logo


Öffne

config.php

und passe die Anteile die zwischen Begin und End stehen ein, bzw, füge noch nicht vorhandene Anteile ein.

Code: Select all

//############################--BEGIN--#########################################
// Default channelName used together with the defaultChannelID if no channel with this ID exists:
// $config['defaultChannelName'] = 'Public';
$config['defaultChannelName'] = 'Technics';
// ChannelID used when no channel is given:
// $config['defaultChannelID'] = 0;
$config['defaultChannelID'] = 1111;
// Defines an array of channelIDs (e.g. array(0, 1)) to limit the number of available channels, will be ignored if set to null:
// $config['limitChannelList'] = null;
$config['limitChannelList'] = array(1111, 2222, 3333);
//############################--END--###########################################

[4seven]

Es bleiben in der Online-Anzeige "Userleichen", wenn man den Logout-Button benutzt.
Beim Klick auf das Logout rechts im Menü-Fenster des Chats aber nicht.

Lösung

Das "Menü-Logout" kann man leicht auf den Button umlegen. So hat er die gleiche Funktion :wink:

Öffne

chat/lib/template/loggedIn.html

Finde

Code: Select all

      <div id="logoutChannelContainer">
            <input type="button" id="logoutButton" value="[LANG]logout[/LANG]" onclick="ajaxChat.logout();"/>

Ersetze mit

Code: Select all

      <div id="logoutChannelContainer">
            <!-- <input type="button" id="logoutButton" value="[LANG]logout[/LANG]" onclick="ajaxChat.logout();"/> -->
          <input type="button" id="logoutButton" value="[LANG]logout[/LANG]" onclick="javascript:ajaxChat.sendMessageWrapper('/quit');"/>

[4seven]

Es bleiben in der Online-Anzeige "Userleichen", da die User den Tab oder das zweite Fenster des Browsers einfach schließen, statt sich auszuloggen.

Lösung

Öffne

chat/lib/template/loggedIn.html

Finde

Code: Select all

<body>

Ersetze mit

Code: Select all

<body onunload="javascript:ajaxChat.sendMessageWrapper('/quit')">

Da ja doch einige auf den Logout-Button gehen, zusätzlich den letzten Tip beachten

Es gibt allerdings keine Lösung dafür, wenn der User den Browser komplett schließt ;)

[4seven]

chat im forum

die anleitung gilt für alle styles :wink:

und los gehts..

damit der chat wie hier direkt mit footer und header im forum angezeigt wird
und ein auto-logout beim verlassen der seite erfolgt:

lade hier das paket

chat_in_forum.zip

(1.28 KiB) Downloaded 409 times

herunter

kopiere root/chat_body.php in den forenroot

kopiere root/styles/euer_style/template/chat_body.html nach styles/euer_style/template/chat_body.html


öffne styles/euer_style/template/overall_header.html

und ändere den chatlink folgendermaßen:

Code: Select all

<li class="icon-chat"><a href="chat_body.php" title="{CHAT_TITLE}">{CHAT_LABEL}</a></li>

anleitung zum erstellen des links und der grafik in diesem thread. hier das beispiel für prosilver

öffne chat/lib/template/loggedIn.html

finde

Code: Select all

<body>

ersetze mit

Code: Select all

<body onunload="javascript:ajaxChat.sendMessageWrapper('/quit');">

finde

Code: Select all

            <input type="button" id="logoutButton" value="[LANG]logout[/LANG]" onclick="javascript:ajaxChat.sendMessageWrapper('/quit');" />

ersetze mit

Code: Select all

<!-- <input type="button" id="logoutButton" value="[LANG]logout[/LANG]" onclick="javascript:ajaxChat.sendMessageWrapper('/quit');" /> -->

öffne chat/js/chat.js

finde

Code: Select all

         menu    = '<li><a href="javascript:ajaxChat.sendMessageWrapper(\'/quit\');">'
               + this.lang['userMenuLogout']
               + '</a></li>'
               + '<li><a href="javascript:ajaxChat.sendMessageWrapper(\'/who\');">'

ersetze mit

Code: Select all

         // menu    = '<li><a href="javascript:ajaxChat.sendMessageWrapper(\'/quit\');">'
               // + this.lang['userMenuLogout']
               // + '</a></li>'
               // + '<li><a href="javascript:ajaxChat.sendMessageWrapper(\'/who\');">'

      menu    = '<li><a href="javascript:ajaxChat.sendMessageWrapper(\'/who\');">'
               + this.lang['userMenuWho']
               + '</a></li>'

das wars

foren- und browser-cache leeren usw.

---------------------------

nebenbei

falls es ein "hängenbleiben" beim betreten des chats gibt (ist auf manchen boards so)

öffne

chat/lib/template/loggedIn.html

finde

Code: Select all

<script src="js/chat.js" type="text/javascript" charset="UTF-8"></script>

davor füge ein

Code: Select all

<script> 
// <![CDATA[
function checkit(){
myvar = location.search.substr(1);
if (myvar=="bbcodebox3"){
}else{
setTimeout("location.href=location.href+'?bbcodebox3'",1000);
}}
window.onload=checkit;
// ]]>
</script>

'bbcodebox3' mit zb foren-tag oder spruch ersetzen