IBIZA braucht JAVA-Entwicklungshilfe

Liebe/-r Experte/-in,
ich bin ein deutscher Hoteldirektor aus Ibiza, der seit ca. 12 Jahren seine eigenen Webseiten (html) gestaltet, weil die Webmaster-Profis ihn damals zu lange warten liessen.
Augenblicklich bastele ich wieder an einer neuen Seite (www.ibiza-feeling.com/index-test.htm), wobei ich zwei rein technische Java-Probleme habe, für die mir die Zeit zur Lösung fehlt. Mir brennt es regelrecht auf den Fingernägeln!!!

  1. Auf der Webseite habe ich eine sogenannte Profi-Buchungsmaschine, wo man derzeitig z.B. das An- und Abreisedatum z.Z. in sechs Schritten eingeben muss. In anderen Worten: Anreisetag, Anreisemonat, Anreisejahr, Abreisetag, Abreisemonat und Abreisejahr.
    Mein Ziel ist es, dass ein „Datepicker“ oder besser gesagt „Date Range Picker“, wie man ihn heute auf vielen Buchungsseiten (Airlines, Hotels etc.) als Kalender zum Anklicken findet, installiert werden kann. Ich kenne zwar die Webseite http://jqueryui.com/demos/datepicker/#date-range mit vielen technischen Details, doch bisher sind alle Versuche fehlgeschlagen.
    Auf der Seite www.hotelmetdelhi.com, die auch diese Buchungsmaschine nutzt, sieht man, wie es fertig perfekt aussehen kann.
    Wer kann mir erklären, wo was hingehört?
    Die verschiedenen Sprachversionen kann ich gewiss selber nachrüsten, da diese auf http://jquery-ui.googlecode.com/svn/trunk/ui/i18n/ zu finden sind.
    2)Die Fotoshow würde ich gerne so gestalten, dass die Bilder nicht nur von einem zum anderen springen, sondern ineinander übergehen (ohne grosse Spielereien). Ein gutes Beispiel ist auf www.apartamentostramuntana.com zu finden. Ebenso wäre es interessant zu wissen, wie man diese opaken Textzeilen einbauen kann.
    Derjenige, der letztlich meine technischen Probleme so löst, dass alles funktioniert, bekommt einen kostenlosen 7-Tage-Aufenthalt (ohne Flug und ohne Verpflegung) geschenkt. Ausgenommen hiervon ist der Zeitraum vom 15. Juli bis zum 15. September!

Sorry, da bin ich überfragt.

Auf alle Fälle danke ich Dir für die Mühe.
Dirk

Sorry, da bin ich überfragt.

Hallo Dirk,

ich versuche mal technischen Beistand zu leisten :wink:

Zu 1:

***************************************************************************************************************

Einbindung in HTML:

***************************************************************************************************************

Script Deklarierung in HTML:

***************************************************************************************************************

Javascript-Datei datetimepicker.js:

//Scripter: TengYong Ng
//Website: http://www.rainforestnet.com
//Copyright © 2003 TengYong Ng

//Global variables
var winCal;
var dtToday=new Date();
var Cal;
var docCal;
var MonthName=[„Januar“, „Februar“, „März“, „April“, „Mai“, „Juni“,„Juli“,
„August“, „September“, „Oktober“, „November“, „Dezember“];
var WeekDayName=[„Sontag“,„Montag“,„Dienstag“,„Mittwoch“,„Donerstag“,„Freitag“,„Samstag“];
var exDateTime;//Existing Date and Time

//Configurable parameters
var cnTop=„200“;//top coordinate of calendar window.
var cnLeft=„500“;//left coordinate of calendar window
var WindowTitle =„Datum“;//Date Time Picker title.
var WeekChar=2;//number of character for week day. if 2 then Mo,Tu,We. if 3 then Mon,Tue,Wed.
var CellWidth=20;//Width of day cell.
var DateSeparator=".";//Date Separator, you can change it to „/“ if you want.
var TimeMode=24;//default TimeMode value. 12 or 24
/*
var ShowLongMonth=true;//Show long month name in Calendar header. example: „January“.
var ShowMonthYear=true;//Show Month and Year in Calendar header.
var MonthYearColor="#cc0033";//Font Color of Month and Year in Calendar header.
var WeekHeadColor="#0099CC";//Background Color in Week header.
var SundayColor="#6699FF";//Background color of Sunday.
var SaturdayColor="#CCCCFF";//Background color of Saturday.
var WeekDayColor=„white“;//Background color of weekdays.
var FontColor=„blue“;//color of font in Calendar day cell.
var TodayColor="#FFFF33";//Background color of today.
var SelDateColor="#FFFF99";//Backgrond color of selected date in textbox.
var YrSelColor="#cc0033";//color of font of Year selector.
var ThemeBg="";//Background image of Calendar window.
*/
var ShowLongMonth=true;//Show long month name in Calendar header. example: „January“.
var ShowMonthYear=true;//Show Month and Year in Calendar header.
var MonthYearColor="#cc0033";//Font Color of Month and Year in Calendar header.
var WeekHeadColor="#0099CC";//Background Color in Week header.
var SundayColor="#6699FF";//Background color of Sunday.
var SaturdayColor="#CCCCFF";//Background color of Saturday.
var WeekDayColor=„white“;//Background color of weekdays.
var FontColor=„blue“;//color of font in Calendar day cell.
var TodayColor="#FFFF33";//Background color of today.
var SelDateColor="#FFFF99";//Backgrond color of selected date in textbox.
var YrSelColor="#cc0033";//color of font of Year selector.
var ThemeBg="";//Background image of Calendar window.
var BodyBGColor="#DFDFDF"; //Color of Body

//end Configurable parameters
//end Global variable

function NewCal(pCtrl,pFormat,pShowTime,pTimeMode)
{
//alert(pCtrl+ " " + pFormat + " " + pShowTime + " " + pTimeMode);

Cal=new Calendar(dtToday);
if ((pShowTime!=null) && (pShowTime))
{
Cal.ShowTime=true;
if ((pTimeMode!=null) &&((pTimeMode==‚12‘)||(pTimeMode==‚24‘)))
{
TimeMode=pTimeMode;
}
}
if (pCtrl!=null)
Cal.Ctrl=pCtrl;
if (pFormat!=null)
Cal.Format=pFormat.toUpperCase();

exDateTime=document.getElementById(pCtrl).value;
//alert(document.getElementById(pCtrl).value);
exDateTime=""; //B.Kuvaki do not parse anything
if (exDateTime!="")//Parse Date String
{
var Sp1;//Index of Date Separator 1
var Sp2;//Index of Date Separator 2
var tSp1;//Index of Time Separator 1
var tSp1;//Index of Time Separator 2
var strMonth;
var strDate;
var strYear;
var intMonth;
var YearPattern;
var strHour;
var strMinute;
var strSecond;
//parse month
Sp1=exDateTime.indexOf(DateSeparator,0)
Sp2=exDateTime.indexOf(DateSeparator,(parseInt(Sp1)+1));

if ((Cal.Format.toUpperCase()==„DDMMYYYY“) || (Cal.Format.toUpperCase()==„DDMMMYYYY“))
{
strMonth=exDateTime.substring(Sp1+1,Sp2);
strDate=exDateTime.substring(0,Sp1);
}
else if ((Cal.Format.toUpperCase()==„MMDDYYYY“) || (Cal.Format.toUpperCase()==„MMMDDYYYY“))
{
strMonth=exDateTime.substring(0,Sp1);
strDate=exDateTime.substring(Sp1+1,Sp2);
}

if (isNaN(strMonth))
intMonth=Cal.GetMonthIndex(strMonth);
else
intMonth=parseInt(strMonth,10)-1;
if ((parseInt(intMonth,10)>=0) && (parseInt(intMonth,10)=1))
Cal.Date=strDate;
//end parse Date
//parse year
strYear=exDateTime.substring(Sp2+1,Sp2+5);
YearPattern=/^\d{4}$/;
if (YearPattern.test(strYear))
Cal.Year=parseInt(strYear,10);
//end parse year
//parse time
if (Cal.ShowTime==true)
{
tSp1=exDateTime.indexOf(":",0)
tSp2=exDateTime.indexOf(":",(parseInt(tSp1)+1));
strHour=exDateTime.substring(tSp1,(tSp1)-2);
Cal.SetHour(strHour);
strMinute=exDateTime.substring(tSp1+1,tSp2);
Cal.SetMinute(strMinute);
strSecond=exDateTime.substring(tSp2+1,tSp2+3);
Cal.SetSecond(strSecond);
}
}
winCal=window.open("",„DateTimePicker“,„toolbar=0,status=0,menubar=0,fullscreen=no,width=195,height=208,resizable=0,top=“+cnTop+",left="+cnLeft);
docCal=winCal.document;
RenderCal();
}

function RenderCal()
{
var vCalHeader;
var vCalData;
var vCalTime;
var i;
var j;
var SelectStr;
var vDayCount=0;
var vFirstDay;

docCal.open();
docCal.writeln(""+WindowTitle+"");
docCal.writeln(„var winMain=window.opener;“);
docCal.writeln("");

vCalHeader="\n";
//Month Selector
vCalHeader+="\n\n";
vCalHeader+="\n";
for (i=0;i"+MonthName[i]+"\n";
}
vCalHeader+="";
//Year selector
vCalHeader+="\n „+Cal.Year+“ >\n";
vCalHeader+="";
//Calendar header shows Month and Year
if (ShowMonthYear)
vCalHeader+=""+Cal.GetMonthName(ShowLongMonth)+" „+Cal.Year+“\n";
//Week day header
vCalHeader+="";
for (i=0;i"+WeekDayName[i].substr(0,WeekChar)+"";
}
vCalHeader+="";
docCal.write(vCalHeader);

//Calendar detail
CalDate=new Date(Cal.Year,Cal.Month);
CalDate.setDate(1);
vFirstDay=CalDate.getDay();
vCalData="";
for (i=0;i\n";
}
}
docCal.writeln(vCalData);
//Time picker
if (Cal.ShowTime)

//style=„font-size: 10px“ Time:
{
var showHour;
showHour=Cal.getShowHour();
vCalTime="\n";
vCalTime+=" Time:";
vCalTime+=" : „;
vCalTime+=“";
vCalTime+=" : „;
vCalTime+=“";
if (TimeMode==12)
{
var SelectAm =(parseInt(Cal.Hours,10)=12)? „Selected“:"";

vCalTime+="";
vCalTime+=„AM“;
vCalTime+=„PM“;
vCalTime+="";
}
vCalTime+="\n\n";
docCal.write(vCalTime);
}
//end time picker
docCal.writeln("\n");
docCal.writeln("");
docCal.close();
}

function GenCell(pValue,pHighLight,pColor)//Generate table cell with value
{
var PValue;
var PCellStr;
var vColor;
var vHLstr1;//HighLight string
var vHlstr2;
var vTimeStr;

if (pValue==null)
PValue="";
else
PValue=pValue;

if (pColor!=null)
vColor=„bgcolor=“"+pColor+""";
else
vColor="";
if ((pHighLight!=null)&&(pHighLight))
{vHLstr1=„color=‚red‘> „;vHLstr2=““;}
else
{vHLstr1=">";vHLstr2="";}

if (Cal.ShowTime)
{
vTimeStr=„winMain.document.getElementById(’“+Cal.Ctrl+"’).value+=’ ‚+"+„winMain.Cal.getShowHour()“+"+‘:’+"+„winMain.Cal.Minutes“+"+’:’+"+„winMain.Cal.Seconds“;
if (TimeMode==12)
vTimeStr+="+’ '+winMain.Cal.AMorPM";
}
else
vTimeStr="";
PCellStr=""+PValue+""+vHLstr2+"";
return PCellStr;
}

function Calendar(pDate,pCtrl)
{
//Properties
this.Date=pDate.getDate();//selected date
this.Month=pDate.getMonth();//selected month number
this.Year=pDate.getFullYear();//selected year in 4 digits
this.Hours=pDate.getHours();

if (pDate.getMinutes()=MinHour))
{
if ((TimeMode==12) && (Cal.AMorPM==„PM“))
{
if (parseInt(intHour,10)==12)
Cal.Hours=12;
else
Cal.Hours=parseInt(intHour,10)+12;
}
else if ((TimeMode==12) && (Cal.AMorPM==„AM“))
{
if (intHour==12)
intHour-=12;
Cal.Hours=parseInt(intHour,10);
}
else if (TimeMode==24)
Cal.Hours=parseInt(intHour,10);
}
}
Calendar.prototype.SetHour=SetHour;

function SetMinute(intMin)
{
var MinExp=new RegExp("^\d\d$");
if (MinExp.test(intMin) && (intMin12)
{
this.AMorPM=„PM“;
if ((this.Hours-12)
body
{
background-image: url(„picture.jpg“);
background-repeat: no-repeat;
color: white;
font-size: 20px;
}

div
{
width: 200px;
height: 500px;
margin-left: 15em;
background-color: black;
opacity: 0.70;
}

So, ich hoffe ich konnte bissle weiterhelfen.
Viel Erfolg!

Gruß,
Markus Süße

Hallo Markus,

ich bin überwältigt, dass Du mir in dieser Form hilfst. Am Wochenende werde ich mich wieder mit der Webseite beschäftigen und das Script einbauen. Ich halte Dich auf dem Laufenden.
Nochmals vielen Dank.
Dirk