JavaScript: Unterschied zwischen den Versionen

Aus WKwiki
Zur Navigation springen Zur Suche springen
 
(14 dazwischenliegende Versionen von 7 Benutzern werden nicht angezeigt)
Zeile 1: Zeile 1:
Hallo!
== JavaScript allgemein ==
Ich habe mal einige Scripts für die Ankündigung zusammengepackt.
Enthalten sind:
-Schriftfarbe ändern
-Schriftart ändern
-Admins und Mods in der Onlineliste hervorheben
-Badwords
-Systemnachrichten (alles was rot ist) umfärben
-Raummoderatoren
-autoAfk


1. Code für die Ankündigung
JavaScript ist eine [[Serverseitig_/_clientseitig#clientseitig|clientseitige]] Script-Sprache, die in HTML-Seiten eingebunden werden kann. Der gesamte Umfang der Sprache ist zu groß um ihn an dieser Stelle zu beschreiben. Im Internet finden sich allerdings reichlich Quellen, in denen das getan wird.
Da es recht viel ist und ohne Zeilenumbrüche zusammengepresst sehr unübersichtlich wäre ist es wohl besser, sie als .js in einen Webspace zu speichern und in der Ankündigung folgendermaßen einzubinden:
Code:
<script type="text/javascript" src="http://URL DER JS-DATEI"></script><script type="text/javascript">var MyNick = strip_tags('%user%'); MyName = MyNick.toLowerCase();</script>


Auf jeden Fall ist JavaScript von [[Java]] zu unterscheiden, mit dem es oftmals verwechselt wird.


2. Code für die .js-Datei
== JavaScript im Webkicks-Chat ==
Dieser Code muss in den Editor kopiert und mit der Endung .js abgespeichert werden. Danach wird er auf einen Webspace hochgeladen.
Code:
/*********************************\
*                              *
* Variablen mit Standardwerten  *
*                              *
\*********************************/


// beliebig viele Administratoren / Moderatoren durch Komma trennen. Auf Groß-/Kleinschreibung achten!
Im Chat selbst sind bereits verschiedene JavaScript-Codes eingebaut, welche zwar nicht zwingend für die Lauffähigkeit des Chats notwendig sind, sich jedoch deutlich auf den Komfort auswirken. Z. B. wird die Anzeige der Chatter in der Online-Liste per JavaScript umgesetzt. Auch die Funktion „Autoscroll“ ist nur durch JavaScript möglich. Hat man also JavaScript deaktiviert oder einen [[Browser]], der JavaScript nicht unterstützt, so müsste man immer händisch nach unten scrollen um dem Chatverlauf zu folgen.
var Admins = new Array("ADMIN1", "ADMIN2", "ADMIN3");
var Mods = new Array("MOD1", "MOD2", "MOD3", "MOD4");


// standardwerte für Schriftart und -farbe angeben
== Eigene Scripts im Chat ==
var fntFace = "Times&#x20;New&#x20;Roman";
var fntColor = "#000000";


// Farben für Admins/Mods in der Onlineliste
Da Webkicks-Chats clientseitig HTML verwenden (und nicht Flash, Java oder andere Technologien) kann man so mit JavaScript einige Erweiterungen einbringen. Einige Beispiele lassen sich hier im Wiki in der [[Liste von Scripts f%C3%BCr den Chat]] finden. Weitere sind im [http://www.webkicks.de/forum Forum] verfügbar. Der Fantasie sind fast keine Grenzen gesetzt.
var AMumfaerben = true; // true wenn umgefaerbt werden sollen, ansonsten false
var OlAdminColor = "#ff0000"; // Nur Farbcodes, keine Namen wie "red" verwenden!
var OlModColor = "#0000ff"; // Nur Farbcodes, keine Namen wie "red" verwenden!
var AdminFett = true; //true wenn Admins fett sein sollen, ansonsten false
var ModFett = false; //true wenn Mods fett sein sollen, ansonsten false


//Away-User umfaerben
Meistens werden im Chat JavaScript-Codes in der [[Ankündigung]] eingesetzt. Zu beachten ist dort, dass in JavaScript-Codes keine Zeilenumbrüche eingefügt werden dürfen, da dort an jeden Zeilenumbruch automatisch der HTML-Code für einen Zeilenumbruch (<nowiki><br></nowiki>) angefügt wird.
var awayUmfaerben = false; //true wenn sie umgefaerbt werden sollen
var OlAwayColor = "#00aa00"; //Farbe, in der die Away-User eingefaerbt werden


//automatisch als Away anzeigen
Je nach dem, was sie bewirken sollen können sie aber im Grunde überall verwendet werden, wo HTML einsetzbar ist.
autoAfk = false; //zum deaktivieren auf false setzen
afkZeit=5; //Zeit nach der man als Away angezeigt wird


//Einstellen, ob Systemmeldungen und Fluesternachrichten (standardmäßig rot) umgefaerbt werden sollen (true oder false)
===Direktes Einbinden===
var faerbeSysmeldungenUm = false;
Die einfachere Möglichkeit JavaScript-Codes einzubinden ist, sie direkt im HTML-Code einzubetten. Das könnte zum Beispiel so aussehen:
var SysMeldungFarbe = "#0000ff"; //neue Farbe fuer die Meldungen


// Einstellungen für das Badwordscript
<code>
var suchworte= new Array(/Badword/i, /Badword2/i); // Beliebig viele Badwords auflisten
  <script type="text/javascript">alert("Hallo Welt!");</script>
var ersetzen = new Array('***', '***'); // Wörter, durch die die Badwords ersetzt werden sollen
</code>
var BadWordsVerwenden = false; // zum aktivieren auf true setzen


//Ende der haendischen Aenderungen
===Externe .js-Dateien===
Etwas umständlicher, dafür aber platzsparend (z.B. bei Anwendung in Raumthemen, da die Zeichenzahl begrenzt ist) und übersichtlicher (in der teilweise recht langen Ankündigung somit auch oftmals vorteilhaft) ist die Verwendung von externen .js-Dateien, die man dann an der jeweiligen Stelle einbindet.


/******************************************\
Um eine .js-Datei zu erstellen muss man zunächst einen Texteditor öffnen, zum Beispiel den normalen Windows-[[Editor]]. Danach fügt man in das nun geöffnete Fenster den JavaScript-Code ein, den man in der .js-Datei haben möchte. (Dieser Code ist in den meisten Threads im Webkicks-Forum klar entsprechend gekennzeichnet.) Nun muss man auf "Datei" klicken, hierauf auf "Speichern unter..." und der Datei einen Namen geben, der mit .js endet, zum Beispiel "test.js". Danach muss man die Datei auf einen [[Webspace]] hochladen und daraufhin an entsprechender Stelle einbinden.
*                                        *
* Funtionen, ab hier nichts mehr ändern  *
*                                        *
\******************************************/


//nur fuer die Kompatibilitaet mit alten Scripts, absofort nicht mehr notwendig
Ein Beispiel:
function stripTags(a){
  a=strip_tags(a);
  a=a.toLowerCase();
  return a;
}
// HTML-Tags aus einem String entfernen und alles in kleinbuchstaben umwandeln
function strip_tags(a){
  while(a.match(/<.*>/)){
    a=a.replace(/<[^>]*>/, "");
  }
  return a;
}


var Stati = new Array("Gast", "User", "Moderator", "Administrator");
In einer Datei, die man als <nowiki>http://wkhost.webkicks.de/tester/test.js</nowiki> hochgeladen hat, steht Folgendes:
var MyStatus;
function getStatus(){
  if(parent.info.document.body.innerHTML.match("ALARM")){
    if(parent.info.document.body.innerHTML.match("Men&uuml;*") || parent.info.document.body.innerHTML.match("Menü*"))
      MyStatus = 0; //Gast
    else
      MyStatus = 1; //User
  }
  else{
    if(parent.info.document.body.innerHTML.match("Admin - Men"))
      MyStatus = 3; //Admin
    else
      MyStatus = 2;  //Mod
  }
}
window.setTimeout("getStatus()", 500);


//Script zum Ändern der Schriftfarbe
<code>
function farbeaendern(farbe, userName){
   var Name = window.prompt("Bitte gib deinen Namen ein", "");
   userName=strip_tags(userName).toLowerCase();
   document.write("Hallo "+Name);
  if(farbe.charAt(0) == "#")
</code>
    farbe = farbe.substr(1,6);
  if(userName == MyNick.toLowerCase){
    fntColor = farbe;
    parent.info.document.eingabe.onsubmit= function(e){
      if(parent.info.document.eingabe.message.value.search('/') != 0){
        parent.info.document.eingabe.message.value='<font color=' + fntColor + ' face=' + fntFace + '>' + parent.info.document.eingabe.message.value + '</font>';
        if(BadWordsVerwenden){
          for(i=0; i<suchworte.length; i++){
            while(parent.info.document.eingabe.message.value.match(suchworte[i])){
              parent.info.document.eingabe.message.value=parent.info.document.eingabe.message.value.replace(suchworte[i], ersetzen[i]);
            }
          }
        }
      }
      parent.info.submitForm(parent.info.document.eingabe);
      return false;
    }
  }
}
//Script zum Ändern der Schriftart
fntFace = fntFace.replace(/\s/, "&#x20;");  
function schriftartaendern(schriftart, userName){
   userName=strip_tags(userName).toLowerCase();
  if(userName == MyName){
    fntFace = schriftart.replace(/\s/, "&#x20;");  
    parent.info.document.eingabe.onsubmit= function(e){
      if(parent.info.document.eingabe.message.value.search('/') != 0){
        parent.info.document.eingabe.message.value='<font color=' + fntColor + ' face=' + fntFace + '>' + parent.info.document.eingabe.message.value + '</font>';
        if(BadWordsVerwenden){
          for(i=0; i<suchworte.length; i++){
            while(parent.info.document.eingabe.message.value.match(suchworte[i])){
              parent.info.document.eingabe.message.value=parent.info.document.eingabe.message.value.replace(suchworte[i], ersetzen[i]);
            }
          }
        }
      }
      parent.info.submitForm(parent.info.document.eingabe);
      return false;
    }
  }
}


//Admins und Mods in der OL umfaerben
In der Ankündigung könnte man dann dieses Script folgendermaßen einbinden:
function fncOlAdminColor(){
<code>
   for(i=0;i<Admins.length;i++){
   <script type="text/javascript" src="<nowiki>http://wkhost.webkicks.de/tester/test.js</nowiki>"></script>
    if(parent.rightFrame.document.getElementById(Admins[i])){
</code>
      parent.rightFrame.document.getElementById(Admins[i]).style.color = OlAdminColor;
      if(AdminFett)
        parent.rightFrame.document.getElementById(Admins[i]).style.fontWeight = "bold";
    }
  }
}
function fncOlModColor(){
  for(i=0;i<Mods.length;i++){
    if(parent.rightFrame.document.getElementById(Mods[i])){
      parent.rightFrame.document.getElementById(Mods[i]).style.color = OlModColor;
      if(ModFett)
        parent.rightFrame.document.getElementById(Mods[i]).style.fontWeight = "bold";
    }
  }
}


if(AMumfaerben){
Hierbei muss natürlich die URL <nowiki>http://wkhost.webkicks.de/tester/test.js</nowiki> durch die URL der .js-Datei ersetzt werden.
  function fncOlAwayColor(){
    a=parent.rightFrame.document.getElementsByTagName("i");
    for(i=0;i<a.length;i++){
      a[i].style.color=OlAwayColor;
    }
  }
}
else{
  function fncOlAwayColor(){
    a=parent.rightFrame.document.getElementsByTagName("i");
    for(i=0;i<a.length;i++){
      umfaerben=true;
      for(j=0;j<Admins.length;j++){
        if(a[i].innerHTML.match(Admins[j])){umfaerben=false;}
      }
      for(j=0;j<Mods.length;j++){
        if(a[i].innerHTML.match(Mods[j])){umfaerben=false;}
      }
      if(umfaerben){
        a[i].style.color=OlAwayColor;
      }
    }
  }
}
if(awayUmfaerben)
  window.setInterval('fncOlAwayColor();', 1000);


if(AMumfaerben){
== Externe Links ==
  window.setInterval("fncOlModColor()", 1000);
  window.setInterval("fncOlAdminColor()", 1000);
}


afkZeit=afkZeit*60000;
[http://de.selfhtml.org/javascript/index.htm SELFHTML (JavaScript)]
var letzteEingabe = Date.parse(new Date);
parent.info.document.eingabe.message.onkeyup = function(e){
  parent.mainframe.letzteEingabe=Date.parse(new Date())
};
function autoAway(){
  if(letzteEingabe < (Date.parse(new Date()))-afkZeit && !parent.rightFrame.document.getElementById(MyNick).innerHTML.match(/<i>/i)){
    sendeText("/away auto afk");
  }
}
if(autoAfk)
  ivAutoAway = window.setInterval("autoAway();", 5000);
 
function swtchSysColor(){
  for(i=0; i<document.getElementsByTagName("font").length; i++){
    if(document.getElementsByTagName("font")[i].color == "#ff0000"){
      document.getElementsByTagName("font")[i].color = SysMeldungFarbe;
    }
  }
}
if(faerbeSysmeldungenUm)
  window.setInterval("swtchSysColor()", 100);
 
 
if(suchworte.length != ersetzen.length){
  alert("Für jedes Badword muss eine\nErsetzung angegeben sein!");
}
function badwords(){
  parent.info.document.eingabe.onsubmit= function(e){
    for(i=0; i<suchworte.length; i++){
      while(parent.info.document.eingabe.message.value.match(suchworte[i])){
        parent.info.document.eingabe.message.value=parent.info.document.eingabe.message.value.replace(suchworte[i], ersetzen[i]);
      }
    }
    parent.info.submitForm(parent.info.document.eingabe);
    return false;
  }
}
function noneBadwords(){
  parent.info.document.eingabe.onsubmit= function(e){
    parent.info.submitForm(parent.info.document.eingabe);
    return false;
  }
}
if(BadWordsVerwenden)
  window.setTimeout("badwords()", 1000);
else
  window.setTimeout("noneBadwords()", 1000);
 
function sendeText(sndText){
  txtTemp = parent.info.document.eingabe.message.value;
  parent.info.document.eingabe.message.value = sndText;
  parent.info.document.eingabe.submit();
  parent.info.document.eingabe.message.value = txtTemp;
}
 
//Funktionen fuer Raummoderatoren
var roomMods = new Array;
function isRoomMod(werWars){
  werWars = strip_tags(werWars).toLowerCase();
  isRM = false;
  for(i=0;i<roomMods.length;i++){
    if(roomMods[i].toLowerCase() == werWars){
      isRM = true;
      return true;
    }
  }
  for(i in Admins){
    if(Admins[i].toLowerCase == werWars){
      isRM = true;
      return true;
    }
  }
  for(i in Mods){
    if(Mods[i].toLowerCase == werWars){
      isRM = true;
      return true;
    }
  }
  return isRM;
}
function RMkick(werWars, user){
  user = strip_tags(user).toLowerCase();
  if(isRoomMod(werWars)){
    if(user==MyName){
      sendeText("/exit");
    }
    document.write("zeigt "+user+" den Ausgang.");
  }
  else
    document.write("versuchte vergeblich einen User zu kicken.");
}
function RMmove(werWars, eingabe){
  eingabe = strip_tags(eingabe).toLowerCase();
  eingabe = eingabe.split(" ");
  if(isRoomMod(werWars) && (eingabe.length == 2)){
    if(eingabe[0]==MyName){
      sendeText("/join "+eingabe[1]);
    }
    document.write("verschiebt "+eingabe[0]+" nach "+eingabe[1])
  }
  else
    document.write("hat vergeblich versucht, jemanden zu moven.");
}
function RMknebel(werWars, eingabe){
  eingabe = strip_tags(eingabe).toLowerCase();
  eingabe = eingabe.split(" ");
  if(eingabe.length == 1)
    eingabe[1] = 2;
  if(isRoomMod(werWars) && eingabe.length == 2){
    if(eingabe[0]==MyName){
      parent.info.document.eingabe.message.disabled = true;
      window.setTimeout("parent.info.document.eingabe.message.disabled = false", (60000 * eingabe[1]));
    }
    document.write("knebelt "+eingabe[0]+" für "+eingabe[1]+" Minuten.");
  }
  else
    document.write("hat vergeblich versucht, jemanden zu knebeln.");
}
function RMrestore(werWars, eingabe){
  eingabe = strip_tags(eingabe).toLowerCase();
  eingabe1 = eingabe.split(" ");
  user = eingabe1[0];
  eingabe = eingabe.substr(user.length);
  if(isRoomMod(werWars)){
    if(user==MyName){
      sendeText("/col"+eingabe);
    }
    document.write("setzt die Farbe von "+user+" zurück.");
  }
}
 
 
3. Anpassungen in der .js
Bis zu dem Kommentar "//Ende der haendischen Aenderungen" könnt ihr einige Einstellungen anpassen (immer jeweils das, was hinter dem = steht kann verändert werden). Alles nach dem Kommentar steht fest und ist nicht zu verändern. Was wofür geändert werden muss wird gleich bei 4. beschrieben.
 
Ich hoffe ihr kommt klar 
Ich habe es erfolgreich in IE 6 und Opera 9 getestet.
 
4. Aktivieren der verschiedenen Funktionen
4.1. Schriftfarbe/Schriftart ändern
Um Schriftfarbe oder Schriftart zu ändern müsst ihr dann noch die entsprechenden Befehle anlegen. Wie ihr die nennt ist euch überlassen. Text für den Schriftfarbe-Befehl:
Code:
<script type="text/javascript">if(parent.info){(farbeaendern('%user%', '%me%');}</script> ändert seine Schriftfarbe in %user%
 
Text für den Schriftart-Befehl:
Code:
<script type="text/javascript">if(parent.info){schriftartaendern('%user%', '%me%');}</script> ändert seine Schriftart in %user%
 
Außerdem kann in der .js in Zeile 12 und 13 die Standardschriftart eingestellt werden.
Wenn ihr die Möglichkeit in eueren Chats nicht geben wollt legt die Chatbefehle einfach nicht an.
 
4.2. Admins und Moderatoren in der Onlineliste hervorheben
Um diese Funktion zu aktivieren müsst ihr diese Zeilen anpassen:
Code:
var AMumfaerben = true; // true wenn umgefaerbt werden sollen, ansonsten false
var OlAdminColor = "#ff0000"; // Nur Farbcodes, keine Namen wie "red" verwenden!
var OlModColor = "#0000ff"; // Nur Farbcodes, keine Namen wie "red" verwenden!
var AdminFett = true; //true wenn Admins fett sein sollen, ansonsten false
var ModFett = false; //true wenn Mods fett sein sollen, ansonsten false
 
Zum Aktivieren der Funktion AMumfaerben auf true setzen. Ansonsten auf false.
In der nächsten Zeile wird die Farbe für die Admins und in der darauffolgenden die für die Moderatoren eingestellt.
Die beiden nächsten Zeilen definieren, ob Admins bzw. Moderatoren in der OL fett dargestellt werden sollen (true wenn ja ansonsten false).
 
4.3. Away-User umfärben
Wenn man diese Funktion aktiviert werden alle User, die sich per "/away" abwesend gemeldet haben in einer anderen Farbe dargestellt.
Die folgenden beiden Zeilen müssen angepasst werden:
Code:
var awayUmfaerben = false; //true wenn sie umgefaerbt werden sollen
var OlAwayColor = "#00aa00"; //Farbe, in der die Away-User eingefaerbt werden
 
Zum aktivieren muss awayUmfaerben auf true gesetzt und die Farbe entsprechend angepasst werden.
 
4.4. Badwords
Zum Aktivieren dieses Scripts bei
Code:
var BadWordsVerwenden = false;
 
statt false true einsetzen. In den beiden Nachfolgenden Zeilen werden die Badwords und die entsprechenden Ersetzungen eingefügt. Logischerweise muss die Anzahl von Badwords und Ersetungen gleich sein.
 
4.5. Systemmeldungen und Flüsternachrichten umfärben
Dazu müssen die folgenden Zeilen angepasst werden:
Code:
var faerbeSysmeldungenUm = false;
var SysMeldungFarbe = "#0000ff";
 
Zum Aktivieren statt "false" wieder "true" einsetzen. Die neue Farbe, in denen die Meldungen dann dargestellt werden sollen muss in der nächsten Zeile eingestellt werden. Hier ist der Wert "#0000ff" für blau eingestellt. Es sind sowohl Farbnamen als auch Farbcodes möglich.
 
4.5. Raummoderatoren
Um die Raum-Moderatoren zu ermöglichen muss in jedes Raumthema ein Script:  
Code:
<script type="text/javascript">roomMods = new Array();</script>
 
Macht man das nicht in jedes Raumthema, so behalten die Raummods ihre Rechte beim Wechseln des Raumes. Wenn in einem Raum diese Mod-Berechtigungen gesetzt werden sollen muss man das Script im jeweiligen Raumthema anpassen:
Code:
<script type="text/javascript">roomMods = new Array("NICK1", "NICK2");</script>
 
Also wieder beliebig viele Nicks (welche dann die Berechtigungen erhalten) in Anführungszeichen und durch Komma getrennt aufzählen.  
Außerdem müssen die entsprechenden Befehle mit beliebiger Bezeichnug angelegt werden:
Für den Kick-Befehl:
Code:
<script type=text/javascript>if(parent.info){RMkick('%me%', '%user%');}else{document.write("kickt User");}</script>
 
Für den Knebel-Befehl:
Code:
<script type=text/javascript>if(parent.info){RMknebel('%me%', '%user%');}else{document.write("knebelt USER");}</script>
 
Für den Move-Befehl:
Code:
<script type=text/javascript>if(parent.info){RMmove('%me%', '%user%');}else{document.write("verschiebt USER");}</script>
 
und für den Restore-Befehl:
Code:
<script type=text/javascript>if(parent.info){RMrestore('%me%', '%user%');}else{document.write("ändert die Nickfarbe von USER");}</script>
 
 
Angepasst muss für das Raum-Mod-Script nichts werden. Weder in der JS-Datei, noch in den Chatbefehlen... Einfach alles so einfügen wie ich es hier beschrieben habe. Wenn ihr bestimmte Befehle nicht für die Raummoderatoren zulassen wollt legt einfach den entsprechenden Chatbefehl nicht an.
 
Updates
Bis 15.11.06 Behebung einiger Fehler und Ergänzung von Funktionen, die von den Forenusern festgestellt/vorgeschlagen wurden
15.11.06 Neue Funktion: Raum-Moderatoren; außerdem: Schriftfarbe und -art ändern jetzt bei verwendung des Chatnamens nicht mehr alle User betroffen
19.11.06 Namen der Raummods (im Raumthema) müssen jetzt nicht mehr zwingend klein geschrieben werden. Für eventuelle weitere Verwendung des Arrays (z.B. Hervorheben der Raummods in der Onlineliste) empfielt es sich die Nicks gleich in der richtigen Groß/Kleinschreibung einzugeben. Außerdem wurden die Befehle zum Ändern der Schriftart und Schriftfarbe angepasst, sodass sie keine Fehler mehr im Adminmenü und der Hilfe erzeugen.
02.01.07 Wegen Änderungen als Reaktion auf eine Sicherheitslücke sind in HTML-Codes keine Anführungszeichen mehr möglich. Daher kann auch kein <font color="FARBE" face="SCHRIFTART"> mehr möglich, sondern eben nur ohne " oder '. Daher sind keine Schriftarten, die über mehrere Worte gehen mehr möglich.
28.01.07 Bei den Chatbefehlen für die Raummods stand überall <script txpe="text/javascript" ... es muss narürlich type heißen.
02.03.07 Das Script "auto-Away" ist jetzt auch in der Scriptsammlung integriert. Außerdem wird in der Variablen MyStatus jetzt "Gast", "User", "Moderator" oder "Admin" (atomatisch) gespeichert und ermöglicht somit Statusabhängige Scripts. Diese Variable wird allerdings erst mit einer Zeitverzögerung ermittelt, sodass es nicht sofort beim Lasden des Streams verfügbar ist.
16.03.07 Absofort sollten auch wieder Schriftarten aus mehreren Worten möglich sein. Ich bitte um Tester 
12.04.07 Fehler im Code für die Ankündigung korrigiert.
02.05.07 Absofort können auch Admins und Mods die Raum-Mod-Befehle nutzen.
13.05.07 Fehler bei Funktionsdefinition fürs Färben der Away-User entdeckt und korrigiert. Statt faerbeAway() muss es fncOlAwayColor() heißen.

Aktuelle Version vom 5. Oktober 2014, 18:04 Uhr

JavaScript allgemein

JavaScript ist eine clientseitige Script-Sprache, die in HTML-Seiten eingebunden werden kann. Der gesamte Umfang der Sprache ist zu groß um ihn an dieser Stelle zu beschreiben. Im Internet finden sich allerdings reichlich Quellen, in denen das getan wird.

Auf jeden Fall ist JavaScript von Java zu unterscheiden, mit dem es oftmals verwechselt wird.

JavaScript im Webkicks-Chat

Im Chat selbst sind bereits verschiedene JavaScript-Codes eingebaut, welche zwar nicht zwingend für die Lauffähigkeit des Chats notwendig sind, sich jedoch deutlich auf den Komfort auswirken. Z. B. wird die Anzeige der Chatter in der Online-Liste per JavaScript umgesetzt. Auch die Funktion „Autoscroll“ ist nur durch JavaScript möglich. Hat man also JavaScript deaktiviert oder einen Browser, der JavaScript nicht unterstützt, so müsste man immer händisch nach unten scrollen um dem Chatverlauf zu folgen.

Eigene Scripts im Chat

Da Webkicks-Chats clientseitig HTML verwenden (und nicht Flash, Java oder andere Technologien) kann man so mit JavaScript einige Erweiterungen einbringen. Einige Beispiele lassen sich hier im Wiki in der Liste von Scripts für den Chat finden. Weitere sind im Forum verfügbar. Der Fantasie sind fast keine Grenzen gesetzt.

Meistens werden im Chat JavaScript-Codes in der Ankündigung eingesetzt. Zu beachten ist dort, dass in JavaScript-Codes keine Zeilenumbrüche eingefügt werden dürfen, da dort an jeden Zeilenumbruch automatisch der HTML-Code für einen Zeilenumbruch (<br>) angefügt wird.

Je nach dem, was sie bewirken sollen können sie aber im Grunde überall verwendet werden, wo HTML einsetzbar ist.

Direktes Einbinden

Die einfachere Möglichkeit JavaScript-Codes einzubinden ist, sie direkt im HTML-Code einzubetten. Das könnte zum Beispiel so aussehen: 

 <script type="text/javascript">alert("Hallo Welt!");</script>

Externe .js-Dateien

Etwas umständlicher, dafür aber platzsparend (z.B. bei Anwendung in Raumthemen, da die Zeichenzahl begrenzt ist) und übersichtlicher (in der teilweise recht langen Ankündigung somit auch oftmals vorteilhaft) ist die Verwendung von externen .js-Dateien, die man dann an der jeweiligen Stelle einbindet.

Um eine .js-Datei zu erstellen muss man zunächst einen Texteditor öffnen, zum Beispiel den normalen Windows-Editor. Danach fügt man in das nun geöffnete Fenster den JavaScript-Code ein, den man in der .js-Datei haben möchte. (Dieser Code ist in den meisten Threads im Webkicks-Forum klar entsprechend gekennzeichnet.) Nun muss man auf "Datei" klicken, hierauf auf "Speichern unter..." und der Datei einen Namen geben, der mit .js endet, zum Beispiel "test.js". Danach muss man die Datei auf einen Webspace hochladen und daraufhin an entsprechender Stelle einbinden.

Ein Beispiel:

In einer Datei, die man als http://wkhost.webkicks.de/tester/test.js hochgeladen hat, steht Folgendes: 

 var Name = window.prompt("Bitte gib deinen Namen ein", "");
 document.write("Hallo "+Name);

In der Ankündigung könnte man dann dieses Script folgendermaßen einbinden: 

 <script type="text/javascript" src="http://wkhost.webkicks.de/tester/test.js"></script>

Hierbei muss natürlich die URL http://wkhost.webkicks.de/tester/test.js durch die URL der .js-Datei ersetzt werden.

Externe Links

SELFHTML (JavaScript)

Abgerufen von „http://wiki.webkicks.de/index.php?title=JavaScript&oldid=3726“