Adventskalender

Fragen zu HTML, CSS, eigenen Erweiterungen etc.
1. FC Keller
Moderator
Beiträge: 853
Registriert: 04.07.2004, 17:10
Wohnort: heimat:// Thüringen.Deutschland.eu/ Zeulenroda
Kontaktdaten:

Adventskalender

Ungelesener Beitrag von 1. FC Keller » 28.10.2010, 12:59

Da kirmesfire in einem anderen Thread gerade den Vorschlag für einen Adventskalender gebracht hat dachte ich mir, bastel ich doch mal schnell ein Script.
Script:Zeigen

Code: Alles auswählen

var advKalender=[];
advKalender[1]="Spruch für den 1.12.";
advKalender[2]="Spruch für den 2.12.";
advKalender[3]="Spruch für den 3.12.";
advKalender[4]="Spruch für den 4.12.";
advKalender[5]="Spruch für den 5.12.";
advKalender[6]="Spruch für den 6.12.";
advKalender[7]="Spruch für den 7.12.";
advKalender[8]="Spruch für den 8.12.";
advKalender[9]="Spruch für den 9.12.";
advKalender[10]="Spruch für den 10.12.";
advKalender[11]="Spruch für den 11.12.";
advKalender[12]="Spruch für den 12.12.";
advKalender[13]="Spruch für den 13.12.";
advKalender[14]="Spruch für den 14.12.";
advKalender[15]="Spruch für den 15.12.";
advKalender[16]="Spruch für den 16.12.";
advKalender[17]="Spruch für den 17.12.";
advKalender[18]="Spruch für den 18.12.";
advKalender[19]="Spruch für den 19.12.";
advKalender[20]="Spruch für den 20.12.";
advKalender[21]="Spruch für den 21.12.";
advKalender[22]="Spruch für den 22.12.";
advKalender[23]="Spruch für den 23.12.";
advKalender[24]="Spruch für den 24.12.";

function adventsKalender(user, tag){
  if(user!=myNick){
    tbls=document.getElementsByTagName("table");
    tbls[tbls.length-1].style.display="none";
  }

  tag=parseInt(tag);
  datum=new Date();
  monat=datum.getMonth();
  tag1=datum.getDate();

  if(tag==0||isNaN(tag)){
    var kalender=[];
    for(var i=1;i<=24;i++){
      kalender[i]="<input type='button' onclick='sendeText("/advent "+i+"");' value='"+i+"'>";
    }
    kalender=arrayMix(kalender)
    document.write(kalender.join(" "));
    return;
  }
  if(monat!=11){
    document.write("Der Adventskalender funktioniert nur im Dezember.");
    return;
  }
  if(tag>tag1){
    document.write("Nicht schummeln. Dieses Türchen darf erst am "+tag+" geöffnet werden ;-)");
    return;
  }
  if(tag>24){
    document.write("Es gibt nur 24 Türchen ;-)")
    return;
  }
  document.write(advKalender[tag])
}

function arrayMix(arr){
  var tmp, rand;
  for(var i =0; i < arr.length; i++){
    rand = Math.floor(Math.random() * arr.length);
    tmp = arr[i]; 
    arr[i] = arr[rand]; 
    arr[rand] =tmp;
  }
  return arr;
}
Hier noch eine Version die man per CSS optisch etwas ansprechender gestalten kann:
Script:Zeigen

Code: Alles auswählen

var advKalender=[];
advKalender[1]="Spruch für den 1.12.";
advKalender[2]="Spruch für den 2.12.";
advKalender[3]="Spruch für den 3.12.";
advKalender[4]="Spruch für den 4.12.";
advKalender[5]="Spruch für den 5.12.";
advKalender[6]="Spruch für den 6.12.";
advKalender[7]="Spruch für den 7.12.";
advKalender[8]="Spruch für den 8.12.";
advKalender[9]="Spruch für den 9.12.";
advKalender[10]="Spruch für den 10.12.";
advKalender[11]="Spruch für den 11.12.";
advKalender[12]="Spruch für den 12.12.";
advKalender[13]="Spruch für den 13.12.";
advKalender[14]="Spruch für den 14.12.";
advKalender[15]="Spruch für den 15.12.";
advKalender[16]="Spruch für den 16.12.";
advKalender[17]="Spruch für den 17.12.";
advKalender[18]="Spruch für den 18.12.";
advKalender[19]="Spruch für den 19.12.";
advKalender[20]="Spruch für den 20.12.";
advKalender[21]="Spruch für den 21.12.";
advKalender[22]="Spruch für den 22.12.";
advKalender[23]="Spruch für den 23.12.";
advKalender[24]="Spruch für den 24.12.";

function adventsKalender(user, tag){
  if(user!=myNick){
    tbls=document.getElementsByTagName("table");
    tbls[tbls.length-1].style.display="none";
  }

  tag=parseInt(tag);
  datum=new Date();
  monat=datum.getMonth();
  tag1=datum.getDate();

  if(tag==0||isNaN(tag)){
    var kalender=[];
    for(var i=1;i<=24;i++){
      kalender[i]="<input type='button' onclick='sendeText("/advent "+i+"");' value='"+i+"' class='button'>";
    }
    kalender=arrayMix(kalender)
    document.write("<div id='adventsKalender'>"+kalender.join(" ")+"</div><style type='text/css'>#adventsKalender .button{color:#FFB90F; font-weight:bold; background-color:transparent; border:2px #FFB90F outset; margin:5px;} #adventsKalender{background-image:url(http://URL-DES HINTERGRUNDBILDS); width:250px; height:250px;}</style>");
    return;
  }
  if(monat!=11){
    document.write("Der Adventskalender funktioniert nur im Dezember.");
    return;
  }
  if(tag>tag1){
    document.write("Nicht schummeln. Dieses Türchen darf erst am "+tag+" geöffnet werden ;-)");
    return;
  }
  if(tag>24){
    document.write("Es gibt nur 24 Türchen ;-)")
    return;
  }
  document.write(advKalender[tag])
}

function arrayMix(arr){
  var tmp, rand;
  for(var i =0; i < arr.length; i++){
    rand = Math.floor(Math.random() * arr.length);
    tmp = arr[i]; 
    arr[i] = arr[rand]; 
    arr[rand] =tmp;
  }
  return arr;
}
Als Befehl dazu (z.B. /advent) muss dann folgendes Script angelegt werden:

Code: Alles auswählen

<script type="text/javascript">if(parent.info){adventsKalender('%myname%', '%text%');}else{document.write("öffnet ein Türchen im Adventskalender");}</script>
Wenn ihr einen anderen Befehl als /advent benutzen wollt müsst ihr diese Zeile im Script entsprechend anpassen:
kalender="<input type='button' onclick='sendeText("/advent "+i+"");' value='"+i+"'>";


Für die Sprüche fehlt es mir jetzt spontan etwas an Kreativität aber da fällt euch sicher etwas ein ;-)
Es können auch per HTML Bilder, Töne, Videos, etc. eingefügt werden.

Benutzeravatar
kirmesfire
Beiträge: 99
Registriert: 26.10.2010, 11:51
Wohnort: nähe Bremen
Kontaktdaten:

Re: Adventskalender

Ungelesener Beitrag von kirmesfire » 28.10.2010, 13:04

Hey das ja super , danke dafür , das des so schnell geht echt super :D Spitze

1. FC Keller
Moderator
Beiträge: 853
Registriert: 04.07.2004, 17:10
Wohnort: heimat:// Thüringen.Deutschland.eu/ Zeulenroda
Kontaktdaten:

Re: Adventskalender

Ungelesener Beitrag von 1. FC Keller » 28.10.2010, 13:10

mir ist gerade noch ein Fehler aufgefallen.. hab ihn behoben. falls du es also schon kopiert haben solltest kopiere es besser nochmal.

Benutzeravatar
kirmesfire
Beiträge: 99
Registriert: 26.10.2010, 11:51
Wohnort: nähe Bremen
Kontaktdaten:

Re: Adventskalender

Ungelesener Beitrag von kirmesfire » 28.10.2010, 13:11

Ist oki ;) wäre grade dabei gewesen ...xD Super lieben Dank nochmal...Echt Klasse =)

anni88
Beiträge: 40
Registriert: 26.10.2010, 11:02
Kontaktdaten:

Re: Adventskalender

Ungelesener Beitrag von anni88 » 28.10.2010, 13:56

Wow das ist echt super Danke schön :)
Werde ich mir auch gleich mal speichern, kann man ja für jedes Jahr wieder gebrauchen.

1. FC Keller
Moderator
Beiträge: 853
Registriert: 04.07.2004, 17:10
Wohnort: heimat:// Thüringen.Deutschland.eu/ Zeulenroda
Kontaktdaten:

Re: Adventskalender

Ungelesener Beitrag von 1. FC Keller » 28.10.2010, 19:21

noch ein kleiner tipp hinterher:
Wenn ihr das Script vorher testen wollt könnt ihr tricksen indem ihr folgende Zeile anpasst:

Code: Alles auswählen

if(monat!=11){
Das ist der Monat in dem das Script aktiv wird (Javascript beginnt am Januar mit 0 zu zählen - daher immer die eigentliche Monatszahl minus 1).
Wenn ihr dort also eine 10 einsetzt könnt ihr das Script im November schon testen.

BumBumBass

Re: Adventskalender

Ungelesener Beitrag von BumBumBass » 28.10.2010, 22:01

wieder mal klasse geschichte vom 1. FC Keller
@ 1. FC Keller >>> kann man das evtl noch so machen dass die einzelnen türchen von einem weihnachtlichen bild umschlossen sind

@ allz: bin grad am überlegen was ich hinter den "türchen" verstecke.
wenn das forum team nix dagegen hat könnten die user doch ihre ideen auch hier im thread posten so dass die vorschläge zusammen mit dem script ein ganzes ergeben

Benutzeravatar
ZischDings
Moderator
Beiträge: 672
Registriert: 22.12.2004, 16:01
Kontaktdaten:

Re: Adventskalender

Ungelesener Beitrag von ZischDings » 29.10.2010, 01:08

BumBumBass hat geschrieben:...wenn das forum team nix dagegen hat könnten die user doch ihre ideen auch hier im thread posten so dass die vorschläge zusammen mit dem script ein ganzes ergeben
da spricht nichts dagegen, gute idee - je brain desto content :mrgreen:

Benutzeravatar
Linus
Moderator
Beiträge: 1081
Registriert: 14.02.2005, 20:31
Wohnort: NRW
Kontaktdaten:

Re: Adventskalender

Ungelesener Beitrag von Linus » 29.10.2010, 11:39

Und je Pinky desto Narf :lol:

Nettes Script :)
Kein Support per PN!

BumBumBass

Re: Adventskalender

Ungelesener Beitrag von BumBumBass » 29.10.2010, 12:09

bevor wir hier off topic zu sehr in comic serien abdriften
meine frage war so gemeint dass ggf auch zum scipt passende bilder etc hier veröffentlicht werden. normal gibts ja für bilder die grafik galerie. da diese bilder etc aber speziell zu dem script gehören wollte ich halt wissen wenn user was ideenreiches präsentieren wollen ob es dann hier in diesem thread okay ist oder in die grafik galerie muss.

1. FC Keller
Moderator
Beiträge: 853
Registriert: 04.07.2004, 17:10
Wohnort: heimat:// Thüringen.Deutschland.eu/ Zeulenroda
Kontaktdaten:

Re: Adventskalender

Ungelesener Beitrag von 1. FC Keller » 29.10.2010, 12:38

Ich hab gerade noch eine Version dazu editiert, die man per CSS anpassen kann. Enthalten ist folgendes:

Code: Alles auswählen

<style type='text/css'>#adventsKalender .button{color:#FFB90F; font-weight:bold; background-color:transparent; border:2px #FFB90F outset; margin:5px;} #adventsKalender{background-image:url(http://URL-DES-HINTERGRUNDBILDS); width:250px; height:250px;}</style>
bei URL-DES-HINTERGRUNDBILDS könnt ihr eine Hintergrund-URL einsetzen. Die 250px sind jeweils Höhe und Breite der Box (entsprechend sollte auch das Hintergrundbild dieses Format haben)
ffb90f habe ich als Schrift- und Rahmenfarbe für die Buttons eingestellt.
die buttons habe ich transparent eingefärbt damit man das Hintergrundbild durch sieht (dadurch könnte es passieren dass man die schrift auf den buttons nichtmehr so gut lesen kann - ggf. solltet ihr dann die Schriftfartbe anpassen oder den Buttons doch eine undurchsichtige Hintergrundfarbe geben)
Per margin:5px habe ich einen Abstand zwischen den buttons eingestellt.
Konnte das alles mal wieder nur im FF testen... kann sein dass es im IE etwas anders aussieht.

anni88
Beiträge: 40
Registriert: 26.10.2010, 11:02
Kontaktdaten:

Re: Adventskalender

Ungelesener Beitrag von anni88 » 29.10.2010, 13:03

Cool, danke :mrgreen:

Benutzeravatar
hamigra
Beiträge: 567
Registriert: 31.08.2006, 16:02
Wohnort: Werdau
Kontaktdaten:

Re: Adventskalender

Ungelesener Beitrag von hamigra » 29.10.2010, 16:39

Danke DG - ein absolutes Spitzenteil :wink:
Ginge das auch wenn nur ein bestimmter User den Befehl /advent benutzen dürfte und der Kalender dann bei ALLEN im Chat Anwesenden (nicht unbedingt in allen Räumen, aber wenn dann wäre es auch egal) sich öffnen würde? Bei entsprechenden Werbungen, daß zu bestimmter Zeit ein Türchen geöffnet werden kann, könnte man zu dieser Zeit User dazu bewegen in den Chat zu kommen.
PS: Der Unterschied zwischen FF und IE ist nur im geringfügig anderen Aussehen der Button.
Deutsche Sprache ist Freeware, aber nicht OpenSource! Du darfst sie benutzen, aber nicht verändern.

1. FC Keller
Moderator
Beiträge: 853
Registriert: 04.07.2004, 17:10
Wohnort: heimat:// Thüringen.Deutschland.eu/ Zeulenroda
Kontaktdaten:

Re: Adventskalender

Ungelesener Beitrag von 1. FC Keller » 29.10.2010, 16:53

Damit Befehl allen angezeigt wird musst du nur diesen Teil entfernen:

Code: Alles auswählen

  if(user!=myNick){
    tbls=document.getElementsByTagName("table");
    tbls[tbls.length-1].style.display="none";
  }
Die Reihenfolge der Buttons ist aber zufällig und daher bei jedem User anders.

Um nur den Kalender allen anzuzeigen und die Ausgaben wenn man auf das Türchen klickt nicht müsst ihr den obigen Teil vor diesen Teil verschieben:

Code: Alles auswählen

  if(tag>tag1){
    document.write("Nicht schummeln. Dieses Türchen darf erst am "+tag+" geöffnet werden ;-)");
    return;
  }
Es sieht dann also so aus:
Script:Zeigen

Code: Alles auswählen

var advKalender=[];
advKalender[1]="Spruch für den 1.12.";
advKalender[2]="Spruch für den 2.12.";
advKalender[3]="Spruch für den 3.12.";
advKalender[4]="Spruch für den 4.12.";
advKalender[5]="Spruch für den 5.12.";
advKalender[6]="Spruch für den 6.12.";
advKalender[7]="Spruch für den 7.12.";
advKalender[8]="Spruch für den 8.12.";
advKalender[9]="Spruch für den 9.12.";
advKalender[10]="Spruch für den 10.12.";
advKalender[11]="Spruch für den 11.12.";
advKalender[12]="Spruch für den 12.12.";
advKalender[13]="Spruch für den 13.12.";
advKalender[14]="Spruch für den 14.12.";
advKalender[15]="Spruch für den 15.12.";
advKalender[16]="Spruch für den 16.12.";
advKalender[17]="Spruch für den 17.12.";
advKalender[18]="Spruch für den 18.12.";
advKalender[19]="Spruch für den 19.12.";
advKalender[20]="Spruch für den 20.12.";
advKalender[21]="Spruch für den 21.12.";
advKalender[22]="Spruch für den 22.12.";
advKalender[23]="Spruch für den 23.12.";
advKalender[24]="Spruch für den 24.12.";

function adventsKalender(user, tag){

  tag=parseInt(tag);
  datum=new Date();
  monat=datum.getMonth();
  tag1=datum.getDate();

  if(tag==0||isNaN(tag)){
    var kalender=[];
    for(var i=1;i<=24;i++){
      kalender[i]="<input type='button' onclick='sendeText("/advent "+i+"");' value='"+i+"' class='button'>";
    }
    kalender=arrayMix(kalender)
    document.write("<div id='adventsKalender'>"+kalender.join(" ")+"</div><style type='text/css'>#adventsKalender .button{color:#FFB90F; font-weight:bold; background-color:transparent; border:2px #FFB90F outset; margin:5px;} #adventsKalender{background-image:url(http://URL-DES HINTERGRUNDBILDS); width:250px; height:250px;}</style>");
    return;
  }
  if(monat!=11){
    document.write("Der Adventskalender funktioniert nur im Dezember.");
    return;
  }
  if(user!=myNick){
    tbls=document.getElementsByTagName("table");
    tbls[tbls.length-1].style.display="none";
  }
  if(tag>tag1){
    document.write("Nicht schummeln. Dieses Türchen darf erst am "+tag+" geöffnet werden ;-)");
    return;
  }
  if(tag>24){
    document.write("Es gibt nur 24 Türchen ;-)")
    return;
  }
  document.write(advKalender[tag])
}

function arrayMix(arr){
  var tmp, rand;
  for(var i =0; i < arr.length; i++){
    rand = Math.floor(Math.random() * arr.length);
    tmp = arr[i];
    arr[i] = arr[rand];
    arr[rand] =tmp;
  }
  return arr;
}

Benutzeravatar
hamigra
Beiträge: 567
Registriert: 31.08.2006, 16:02
Wohnort: Werdau
Kontaktdaten:

Re: Adventskalender

Ungelesener Beitrag von hamigra » 29.10.2010, 18:44

Klappt bestens! Der Befehl kommt beim Admin in die SE.

Geht der Kalender auch in eine Webseite einzubinden?
Deutsche Sprache ist Freeware, aber nicht OpenSource! Du darfst sie benutzen, aber nicht verändern.

Antworten

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 3 Gäste