Anzeige

 Chat Hintergrundbild ändern je Raum


Status
Dieses Thema wurde gelöst! Zur Lösung gehen…

Fonex47

Grünschnabel
#1
Hallo liebe User, ich bin auf dem Forum hier gestoßen, da ich nach Hilfe zu einer Funktion mit Javascript brauche.
Ich hoffe, es kann mir weiter geholfen werden.
Kenntnisse habe ich 0 in Javascript nur in ( html,css und php)
Folgendes Problem:

Aus dem Internet habe ich eine Javascript Funktion gefunden und so direkt übernommen, sie war auch für diesen Chat gedacht.
So jetzt hab ich ein neuen Chat aufgestellt und nun reagiert der Code bzw die funktion nicht mehr.


Das ist der Code:

Javascript:
//##############################################################################################################
    if (ereignis.slice(0, 5)=="room_"){

        if ($("room").value==ereignis.slice(5, ereignis.length)) return false;
        $('chatinhalt').innerHTML='';
        $("room").value=ereignis.slice(5, ereignis.length);

           // Hier ird anhand der Room_ID der entsprechende Roomname aus dem JSON Resultarray herausgefischt
        for (var i=0; i < self.jsonObjUserGlobal.userOnline.length; i++)
            if (self.jsonObjUserGlobal.userOnline[i].room_id==ereignis.slice(5, ereignis.length)){
                   var roomName = self.jsonObjUserGlobal.userOnline[i].room;
             }

            if($("room").value==1) {
$('chatinhalt').style.backgroundColor="#111111";
$('chatinhalt').style.backgroundImage="url(/raumhintergrund/lobby.png)";
$('chatinhalt').style.backgroundRepeat="no-repeat";
$('chatinhalt').style.backgroundPosition="left";
}
Ich gehe mal davon aus das "chatinhalt" die css div class ist, und "room" die room_id irgendwie abgerufen wird.

Beispiel:
Ich möchte folgendes das wenn ich in einem anderen raum wechsel der Hintergrund gewechselt wird, von lobby.png nach wohnzimmer.png

Javascript ist mega schwer :(
Ich hoffe ich nerve nicht mit meinem Roman.

Mfg
 

basti1012

Erfahrenes Mitglied
#2
Hast du mal einen Link von wo du das Script hast ? Ich glaube das wäre einfacher wenn man das ganze Script sieht. Mit den ausschnitt kann ich nur raten.
Hier steht ja
Code:
            if($("room").value==1) {
$('chatinhalt').style.backgroundColor="#111111";
$('chatinhalt').style.backgroundImage="url(/raumhintergrund/lobby.png)";
$('chatinhalt').style.backgroundRepeat="no-repeat";
$('chatinhalt').style.backgroundPosition="left";
}
value==1 wird wohl raum eins sein . Wenn du jetzt zu raum 2 gehts erstellst du dr dann eigenen Hintergrund zb
Code:
            if($("#room").val()==2) {
$('#chatinhalt').css('background','#333333');
$('#chatinhalt').css('background-image","url(hier ein link zum anderen Bild)");

}
Nur wie gesagt es wäre einfacher wenn man das ganze Script kennt ,oder zumindest ein Link zu den Chat in Live. So kann das sein das im rest Script noch andere Code für die gestalltung vorhanden ist die man jetzt nicht sieht.

Hast du an den Code schon was gemacht ?
Weil
Code:
    $('chatinhalt').innerHTML='';
ist Mist, das muss wenn schon so sein
Code:
$('#chatinhalt').html('');
und hier

Code:
   if($("room").value==2) {
muss so sein
if($("#room").val()==2) {

Dann hast du bei allen
Code:
$('chatinhalt')
$("room")

Das muss so sein für id

$('#chatinhalt')
$("#room")

oder  so für ClassName

$('.chatinhalt')
$(".room")
So wie du das hast ist das für Tags. Zb a,div,span und so weiter.
Dein Code sieht danach aus als ob du Jquery eingebunden hast , oder hast du das nicht ? Weil wenn nicht müßte man den Code in nativem Javascript umschreiben.

Ein Link zum Originalen Script wäre gut
 
Zuletzt bearbeitet:

Quaese

Moderator
Moderator
#3
Hi,

Code:
$('chatinhalt').innerHTML='';
Ob das "Mist" ist, kommt auf das JS-Framework an, mit dem gearbeitet wird. In Dojo z.B. wird so auf ein Element mit der ID chatinhalt referenziert.

Aber ich gebe dir recht, dass der Kontext des Scriptes interessant ist, um weitere Hilfe geben zu können.

Ciao
Quaese
 

basti1012

Erfahrenes Mitglied
#4
Nagut, an ein Framework habe ich jetzt nicht gedacht ,das würde die anderen merkwürdigen Zeilen dann auch erklären. Nur läßt sich das mit den paar Zeilen Code jetzt nicht genau sagen. Dann warten wir mal ab bis wir was genaueres wissen was das für ein Script ist mit den da genau gearbeitet wird.
Aber ohne Framework oder co bleibt es Mist;)
 

Fonex47

Grünschnabel
#5
Hallo danke erstmal für die zahlreichen antworten und dafür das Ihr versucht mir zu helfen das macht mich gerade echt glücklich :)

Mir ist aufgefallen das der eigentliche wichtige Teil vom code fehlt und das er standart in der version enthalten ist, vielleicht ist er auch mit anderen funktionen verbunden.


Javascript:
//##############################################################################################################
    if (ereignis.slice(0, 5)=="room_"){

        if ($("room").value==ereignis.slice(5, ereignis.length)) return false;
        $('chatinhalt').innerHTML='';
        $("room").value=ereignis.slice(5, ereignis.length);

           // Hier ird anhand der Room_ID der entsprechende Roomname aus dem JSON Resultarray herausgefischt
        for (var i=0; i < self.jsonObjUserGlobal.userOnline.length; i++)
            if (self.jsonObjUserGlobal.userOnline[i].room_id==ereignis.slice(5, ereignis.length)){
                   var roomName = self.jsonObjUserGlobal.userOnline[i].room;
             }

            if($("room").value==1) {
$('chatinhalt').style.backgroundColor="#111111";
$('chatinhalt').style.backgroundImage="url(http://eulogistics.lima-city.de/raumhintergrund/lobby.png)";
$('chatinhalt').style.backgroundRepeat="no-repeat";
$('chatinhalt').style.backgroundPosition="left";
}





Dieser Script wurde für den ETChat v 3.0.7 geschrieben.
Ich benutze jedoch jetzt den BoomChat.

Ich werde euch
zu beiden Chats aktuell links posten.

alter Chat: http://eulogistics.lima-city.de/etchat
neuer Chat: http://eulogistics.lima-city.de

Danke nochmal
Mfg
 

basti1012

Erfahrenes Mitglied
#6
Im anderen Forum ist gerade auch einer der ein Problem mit den etchat hat. Versuche gerade den zum laufen zu bekommen weil der irgendwie nicht richtig läuft bei mir. Schade das du den nicht mehr hast weil dann hätte man gleich 2 probleme auf einmal lösen können.
Bei deinen neuen Chat muß ich mal rum googeln wo man die Datein findet , weil mich da jetzt registrieren bringt vieleicht auch nicht viel weil ich dann ja nicht alle Datein sehen die vieleicht wichtig wären.

Hast du vieleicht ein Link wo du den runter geladen hast ?
 

Fonex47

Grünschnabel
#7
Im anderen Forum ist gerade auch einer der ein Problem mit den etchat hat. Versuche gerade den zum laufen zu bekommen weil der irgendwie nicht richtig läuft bei mir. Schade das du den nicht mehr hast weil dann hätte man gleich 2 probleme auf einmal lösen können.
Bei deinen neuen Chat muß ich mal rum googeln wo man die Datein findet , weil mich da jetzt registrieren bringt vieleicht auch nicht viel weil ich dann ja nicht alle Datein sehen die vieleicht wichtig wären.

Hast du vieleicht ein Link wo du den runter geladen hast ?
Hast eine PN
Mfg
 

basti1012

Erfahrenes Mitglied
#8
Jo muß ja sagen der Chat gefällt mir auch.
Muß sagen das es eine Menge Datein sind und reichlich verzwickt ist . Sage ich jetzt mal so. Wie willst du den die Farben und Bilder einstellen? Einfach im Script eingeben das zb
room1='red;
room2='blue';
usw.. Oder wie solen die Bilder und Hintergründe da rein kommen?
Um da eine schnelle Lösung zu finden wollte ich versuchen den Raum Name mit an der Url hängen und die wird dann mit Javascript ausgelesen und gibt den Chat dann den Hintergrund.
Ich kucke auch noch nach andere Lösungen aber der Chat ist it seinen 8mb ganz schön groß wenn man alle Datein durchsuchen muß.

Wo soll den das Bild den genau rein.Weil das sind ja mehrer Container . Einfach ein Bild in Background setzen geht da nicht so einfach.
 
Zuletzt bearbeitet:

Fonex47

Grünschnabel
#9
Jo muß ja sagen der Chat gefällt mir auch.
Muß sagen das es eine Menge Datein sind und reichlich verzwickt ist . Sage ich jetzt mal so. Wie willst du den die Farben und Bilder einstellen? Einfach im Script eingeben das zb
room1='red;
room2='blue';
usw.. Oder wie solen die Bilder und Hintergründe da rein kommen?
Um da eine schnelle Lösung zu finden wollte ich versuchen den Raum Name mit an der Url hängen und die wird dann mit Javascript ausgelesen und gibt den Chat dann den Hintergrund.
Ich kucke auch noch nach andere Lösungen aber der Chat ist it seinen 8mb ganz schön groß wenn man alle Datein durchsuchen muß.

Wo soll den das Bild den genau rein.Weil das sind ja mehrer Container . Einfach ein Bild in Background setzen geht da nicht so einfach.
Ja beim Raum wechseln soll die Javascript funktion halt erkennen das zu "room2" geswitcht wird und dadurch wird die div class übernommen mit dem link zum Hintergrundbild.

beispiel2.png


via mysql halt die room_id abfangen und via Javascript umsetzen.

Ich weiß es auch nicht genau, um ehrlich zu sein, da ich mich mit Javascript nicht auskenne, aber viele Funktionen gesehen habe in Codes und den Sinn meist dahinter verstanden :)

Mfg
 

basti1012

Erfahrenes Mitglied
#12
Das ist gar nicht so einfach. Der Chat läd vieles überAjax ,dann einiges ineinande includiert und co. Habe jetzt nee Lösung gefunden. Nurda gibt es ein problem was du dann noch selberändern müßtest weil ich nicht weiß welches themes du gerade nutzt. Du müstest dann die einzelne <li> auf Background none setzen damit das Bild vom <ul> da durch schimmern kann, damit es wie erwünscht ein Hintergrundbild ist.
Aber kuck erstmal ob das so richtig ist . Ich habe jetzt irgendwelchen Bilder kram genommen der auf Server lag und habe die jetzt nicht angepasst auf den Hintergrund. Also nicht Wundern wenn die nicht mittig sind oder zu groß. Oder mal eins doppelt ist .Das müßtest du dann sowieso in der Css anpassen wie du es haben möchtest.
http://sebastian1012.bplaced.net/chat/Boomchat/index.php
 
Zuletzt bearbeitet:
#13
Wahnsinn der hammer ich danke dir vielmals das du dir die mühe gemacht hast.
Das ist für mich eine lösung und wird mir aufjedenfall weiterhelfen.
Ich habs mir angeschaut das ist genau so wie ich es mir vorgestellt habe.

DANKE!
 
#15
Ich hab zwar paar codes gefunden, aber irgendwie hat es nicht so richtig funktioniert wie bei dir im chat jetzt.
Könntest du mir den code vielleicht schicken wäre mega lieb.
Mfg
 

basti1012

Erfahrenes Mitglied
#16
Also einmal must du die "system/room_list.php"
Ändern in
PHP:
<?php
$load_data = 'setting.allow_theme, setting.default_theme, setting.language, setting.timezone, users.user_theme, users.user_access, users.user_roomid';
require_once("config1.php");
     
// show rooms list
if($data["user_access"] >= 1){
    $rooms = $mysqli->query("SELECT * FROM `rooms` WHERE `room_id` >=  1 ORDER BY room_name ASC");
    if ($rooms->num_rows > 0)
    {
        echo "<div id=\"container_user_room\">";
            while ($room = $rooms->fetch_assoc())
            {
                $countuser = $mysqli->query("SELECT `user_id` FROM `users` WHERE `user_roomid` = {$room['room_id']} AND `user_status` != '3' AND `user_status` != '4' AND `user_access` != '0' AND `user_access` != '2'");
                $datain = $countuser->num_rows;
             
                $access = $room['access'];
                if($access == 1){
                    $type = "   <span class=\"room_type user\">$opublic</span>";
                }
                if($access == 2){
                    $type = "   <span class=\"room_type vip\">$ovip</span>";
                }
                if($access == 3){
                    $type = "   <span class=\"room_type modo\">$ostaff</span>";
                }
                if($access == 4){
                    $type = "  <span class=\"room_type admin\">$oadmin</span>";
                }
                if ($room['room_id'] == $data['user_roomid']){
                    echo "<div class=\"roombutton hoverroom  hover_element sub_element selected_element\" id=\"room{$room["room_id"]}\" value=\"{$room["room_id"]}\">
                                <div class=\"room_name\"><p>{$room["room_name"]}</p></div><div class=\"room_count\"><p class=\"sub_color\">$type <span class=\"room_userin\">$datain</span></p></div>
                        </div>";
             
                }
                else {
                    echo "<div class=\"roombutton hover_element sub_element\" id=\"room{$room["room_id"]}\" value=\"{$room["room_id"]}\">
                                <div class=\"room_name\"><p>{$room["room_name"]}</p></div><div class=\"room_count\"><p class=\"sub_color\" >$type <span class=\"room_userin\">$datain</span></p></div>
                        </div>";
                }
            }
        echo "<div class=\"clear\"></div></div>
             <script>
       //Wird gebraucht um hintergrundsbilder für jeden Einzelnen Rau zu bekommen
   $('.roombutton').click(function(){
      start();
   })
        </script> ";
    }
}
else {
    echo "<div>$lang_error</div>                    ";
}
?>
Hier ist nur das script hinzugekommen
Dann auf der index.php
Kopierst su das script ganz unten vor den </body>

PHP:
       <script>
//Dieses Script wird gebraucht um  Hintergrund  Bilder zu bekommen
        setTimeout(function(){
  start();
        },1000);
  function  start(){
        $.ajax({
            url: "system/room_list.php",
            cache: false,
            success: function(html){
                //$("#versteckt").val(html);// wahr fürs hiddenfeld gedacht fals nötig gewesen
                weiter(html);
            },
        });

  }  
     
function weiter(html){  
      bilder=['Meine_Scripte/bilderzumtesten/111.jpg','Meine_Scripte/bilderzumtesten/222.jpg','Meine_Scripte/bilderzumtesten/333.jpg','Meine_Scripte/bilderzumtesten/444.jpg','Meine_Scripte/bilderzumtesten/555.jpg','Meine_Scripte/bilderzumtesten/666.jpg','Meine_Scripte/bilderzumtesten/777.jpg','Meine_Scripte/bilderzumtesten/888.jpg','Meine_Scripte/bilderzumtesten/999.jpg'];
      //menge=html.split('roombutton')// wird jetzt nicht mehr gebrucht
      try{
           var eins=html.split('hoverroom')[1].split('</div>')[0];
           var zwei=eins.split('value="')[1].split('"')[0];
           $('#show_chat').css('background-image','url(http://sebastian1012.bplaced.net/'+bilder[zwei]+')')
           $('.ch_logs').css('background','none');//Kann auch in Css geändert werden
           //$('.log2').css('background','none');// Kann man über Css auch austellen oder hier wieder entkommentieren
           //$('.log1').css('background','none'); //   Hier das gleiche
      }catch(e){
           //alert(e);
      }
}
</script>
</body>
</html>
Dann mußt du halt wie oben schon gesagt die Einträge aus den Css Datein suchen damit das <li> keinen Hintergrund mehr hat sonst bekommst du Gitterstäbe Optik wo Bild nur in Streifen sichtbar ist.

Das wahrs erstmal glaube ich. Ich werde mal nach nee andere Lösung suchen , so das man über den Admin Bereich da Hintergrunds Bilder eingeben kann und das es dann auch über Datenbank gespeichert ist . Also genau so als wäre es Original.
Nur das dauert etwas länger weil man da doch einiges mehr ändern muß.
Diese Lösung jetzt ist halt mit arbeit verbunden weil man die Bilder direkt in den Datein eingeben muß und halt nee Notlöung ist.

Aber probier es mal aus. Fals es nicht klappt mußt du mir mal deinen Link geben zum Chat.

Ich habe bei mir im Chat die Bilder wieder deaktiviert , also nicht wundern das bei mir jetzt nix mehr angezeigt wird. Aber der Code steht noch im Quelltextnur auskommentiert
 

basti1012

Erfahrenes Mitglied
#17
So wollte dir bescheid sagen das ich in den Admin Bereich ein Menü eingebaut habe wo man jetzt Hintergrundbilder reinladen kann. Wird alles in der Db gespeichert und sieht so aus als gehöhre es zum Chat. Also kein Fusch. Du bist ja noch Admin also geh mal in den Chat rein und kucke dir das an bzw teste es aus .
Fals es dir gefällt sag bescheid dann lade ich dir geänderten Datein irgendwo hoch . Das sind 12 Datein die geändert werden mußten das ist etwas viel hier zu posten. Vorallem haben die anderen da ja auch nix von.
 
#18
So wollte dir bescheid sagen das ich in den Admin Bereich ein Menü eingebaut habe wo man jetzt Hintergrundbilder reinladen kann. Wird alles in der Db gespeichert und sieht so aus als gehöhre es zum Chat. Also kein Fusch. Du bist ja noch Admin also geh mal in den Chat rein und kucke dir das an bzw teste es aus .
Fals es dir gefällt sag bescheid dann lade ich dir geänderten Datein irgendwo hoch . Das sind 12 Datein die geändert werden mußten das ist etwas viel hier zu posten. Vorallem haben die anderen da ja auch nix von.
Hi, danke dir nochmal für deine Hilfe.
Werde ich mir sofort anschauen.

Mit freundlichen Grüßen
 
Status
Dieses Thema wurde gelöst! Zur Lösung gehen…
Anzeige

Neue Beiträge

Anzeige