Login

Name oder Email:   Passwort:   
 Registrieren | Passwort vergessen?

Thema ansehen

Themen Autor: Leon Schlemmer
Thema ID: 46
Themen Information
Beiträge: 4 » Gelesen: 21163 mal.
 Thema drucken
ET-Chat Button + Popup anlegen
Leon Schlemmer
Hallo ihr Lieben, ich würde mich freuen wenn mir weiter geholfen werden kann und ich hoffe, das ich meine Frage bzw mein Anliegen verständlich genug rüber bringen kann. Fange ich dann mal an!

Im Chat gibt es ja die Button "Smilie", "Color", "Einstellungen" usw. Wenn man auf diese drauf klickt dann gehen ja immer diese Popupfenster auf in denen man zum Beispiel die Schriftfarbe ändern kann ect. Meine Frage dazu ist.... In welcher Datei/en muss ich etwas ändern bzw eintragen, damit sich so ein Popupfenster öffnet wenn ich einen neuen Button (z.B. Chatregeln) anlege und drauf klicke. Ich hoffe sehr, das jemand mir helfen kann und deshalb sage ich schon einmal vorab vielen Dank.


LG Leon.... Wink
 
Top
Tommy
hey leon ...

"chatregeln.php" anlegen und in dein chatordner laden
nen kleines bild "chatregeln.png" anlegen und in den ordner "img" laden

dann in der "chat.tpl.html" unter

Download Code  Code Alles auswählen

<a class="img_prop" style="color: rgba(0, 0, 0, 0);">
<img id="link_prop" class="img_button" src="img/Display.png" width="32" height="32" border="0"
alt="<?php echo $this->lang->prop[0]->tagData; ?>" title="<?php echo $this->lang->prop[0]->tagData; ?>" /></a>


das einfügen

Download Code  Code Alles auswählen

<a hidden class="img_chatregeln" style="color: rgba(0, 0, 0, 0);">
<img id="link_chatregeln" class="img_button" src="img/chatregeln.png" width="32" height="32" border="0"
alt="Chatregeln" title="Chatregeln" /></a>


die werte width="32" height="32" kannste dir an dein chat anpassen

dann machste die "chat.js" auf und fügst unter

Download Code  Code Alles auswählen

Event.observe('privat_anzeige', 'click', function(event){
if(Event.element(event).id=="close_privat"){
$("privat").value = "0";
$("privat_anzeige").innerHTML=lang_start_1;
//$("message").style.backgroundColor="#ffffff";
$("message").focus();
} } );


das ein

Download Code  Code Alles auswählen

new Ajax.Request("./chatregeln.php",{onSuccess:function(result){self.win_chatregeln_content=result.responseText;}});
 $("link_chatregeln").onclick = function(){

 if (typeof self.win_chatregeln!="object"){
 self.win_chatregeln = new Window({className: self.win_style, title:"Chatregeln", width:300, height:150, top:eval(self.mouse_top-260), left:eval(self.mouse_left-160), resizable: false, showEffect:Effect.Appear, hideEffect: Effect.Fade, showEffectOptions: {duration:0.5}, hideEffectOptions: {duration:0.5}, draggable: false, minimizable: false, maximizable: false, destroyOnClose: false, opacity: 1});
 self.win_chatregeln.setHTMLContent('<div id="chatregeln_list">'+self.win_chatregeln_content+'</div>');
 Event.observe('chatregeln_list', 'click', function(event){
 if(Event.element(event).id!="" && Event.element(event).id!='chatregeln_list'){
 $('message').value +=Event.element(event).id;
 $('message').focus();
 self.win_chatregeln.close();
 }
 });
 }
 if($(self.win_chatregeln.getId()).style.display=='none'){
 self.win_chatregeln.setLocation(eval(self.mouse_top-260), eval(self.mouse_left-160))
 self.win_chatregeln.show();
 self.win_chatregeln.toFront();
 }
 else self.win_chatregeln.close();
 }


die werte width:300, height:150, top:eval(self.mouse_top-260), left:eval(self.mouse_left-160)
sowie eval(self.mouse_top-260), eval(self.mouse_left-160)) <- muss gleiche werte haben wie top:eval(self.mouse_top-260), left:eval(self.mouse_left-160)

kannste dir an dein chat anpassen

viel spass grüße tommy
Bearbeitet von Tommy am 25.01.2023 - 20:32
 
Top
Fizzy Lemon
Oh Mann Tommy, was hast denn da für ein Monstrum geschaffen? Nur um Chatregeln, bzw. eine HTML-Datei in einem Fenster darzustellen braucht es keinen hintergründigen AJAX-Aufruf. Den sollte man nur machen, wenn man serverseitig Daten bearbeitet, aber nur etwas im Fenster darzustellen kannst auch einfacher haben.

In der chat.tpl.html sind die Bildbuttons abgelegt:

Download Code  Code Alles auswählen
<img id="Eindeutige ID des Buttons" class="img_button" src="Bilddatei mit Pfad" width="32" height="32" border="0" alt="Alternativanzeige" title="Tooltipanzeige" />


So legst Du weitere Buttons an. Diese kannst Du in der chat.js dann direkt ansprechen:
(Trage das am besten VOR dieser Stelle ein:
Download Code  Code Alles auswählen
};
// (Stop) Konstruktor der Class ET_Chat wird onLoad ausgefuehrt ------------------------------------------------
// ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

)

Download Code  Code Alles auswählen
// Klick auf Regeln
$("Chatregeln").onclick = function(){
      // Wenn das Fenster noch nicht existiert, muss es erzeugt und befuellt werden
      if (typeof self.win_chatregeln!="object"){
          self.win_chatregeln = new Window({className: self.win_style,  url: 'chatregeln.html', title:'Chatregeln', width:640, height:480, top:100, left:100, resizable: false, showEffect:Effect.Appear, hideEffect: Effect.Fade, showEffectOptions: {duration:0.5}, hideEffectOptions: {duration:0.5}, draggable: true, minimizable: false, maximizable: true, destroyOnClose: false, opacity: 1});
           }

            // Ist dass Fenster bereits sichtbar?
            if($(self.win_chatregeln.getId()).style.display=='none'){
               self.win_chatregeln.show();
               self.win_chatregeln.toFront();
            }
            else self.win_chatregeln.close();


   }
      
//Ende Regeln




Im Feld url: 'chatregeln.html' trägst Du die Datei ein, die im Fenster dargestellt werden soll. Hier im Beispiel liegt diese im Wurzelverzeichnis. Unterverzeichnisse musst eben berücksichtigen, wie bspw url: 'infos/chatregeln.html'


Du kannst aber ein Fenster auch direkt befüllen. Das geht dann wie folgt:

Download Code  Code Alles auswählen
// Klick auf Regeln
$("Chatregeln").onclick = function(){
      // Wenn das Fenster noch nicht existiert, muss es erzeugt und befuellt werden
      if (typeof self.win_chatregeln!="object"){
          self.win_chatregeln = new Window({className: self.win_style, title:'Chatregeln', width:640, height:480, top:100, left:100, resizable: false, showEffect:Effect.Appear, hideEffect: Effect.Fade, showEffectOptions: {duration:0.5}, hideEffectOptions: {duration:0.5}, draggable: true, minimizable: false, maximizable: true, destroyOnClose: false, opacity: 1});
            self.win_chatregeln.setHTMLContent('<div id="infotext"><b>Unsere Chatregeln lauten:</b> <br/>Einfach in Ruhe chatten!</div>');

           }

            // Ist dass Fenster bereits sichtbar?
            if($(self.win_chatregeln.getId()).style.display=='none'){
               self.win_chatregeln.show();
               self.win_chatregeln.toFront();
            }
            else self.win_chatregeln.close();


   }
      
//Ende Regeln




In self.win_chatregeln.setHTMLContent(''); setzt man einfach den HTML-Code direkt rein.

LG Fizzy
 
Top
Leon Schlemmer
Hallo, ich möchte mich nochmal bei tommy herzlich bedanken für seine schnelle und hilfreiche Antwort. Das war genau das was ich gesucht habe und nun funktioniert das so wie ich es gerne wollte. Nochmal vielen Dank tommy. Natürlich ist die Variante von Fizzy auch möglich die ich sicherlich auch mal testen werden. Ich sage mal danke an euch beiden für eure Mühen und vielleicht habe ich mit meiner Frage und ihr mit euren Antworten anderen damit geholfen die das gleiche wissen wollen.

LG Leon.... Up
 
Top
Springe ins Forum:

Ähnliche Themen

Thema Forum Antworten / Angesehen Letzter Beitrag
Et-Chat - Eigenständiges Portal ET-Chat allgemein 10 / 1190 04.09.2025 - 08:32
ET-Chat Darstellung Handy ET-Chat allgemein 2 / 778 12.01.2025 - 05:46
smileys im Chat ET-Chat allgemein 2 / 1729 27.11.2024 - 06:42
ET Chat Mod für die Version et_chat_v307r3 ET-Chat allgemein 17 / 8653 27.04.2024 - 12:20
ET-Chat Bridge v4 für PHP Fusion v?.x ET-Chat allgemein 3 / 3529 26.04.2024 - 10:10
Login
Name oder Email

Passwort



Noch kein Mitglied?
Klicke hier um dich zu registrieren

Passwort vergessen?
Um ein neues Passwort anzufordern klicke hier.
Wer ist im Chat?
Gastzugang geschlossen!

0 User im Chat
Teamspeak
Harlekins Welt
Eingangshalle
« ★ » Allgemein « ★ »
Laberecke
Harlekin
Rolly8-HL
Quasselbox
Up & Download
« ❑ » Intern « ❑ »
Besprechung
« ● » Abwesend « ● »
kurz < 30 Min.
lang > 30 Min.

Discord

Joinen
Slider
Security
Geschützt durch:
HP-Detect
Werbung
SGI Fusion

Über HP-4-Fun

HP-4-Fun

ist ein privates, nicht kommerzielles, Projekt, welches 2019 von Rolly8-HL und mir (Harlekin) gestartet wurde.

HP-4-Fun 2.0 ist nur für den Eigenbedarf geschrieben worden. Ein Downloadpaket von HP-4-Fun 2.0 wird es nicht geben!

Letzte Kommentare

Informationen

Zuletzt Online