Tråd: ASP kalender

Mitt første innlegg, forhåpentligvis ikke mitt siste.
Skal gå igjennom ett kalender skript jeg laget for mange år siden, og håper dette kan komme til nytte for mange andre.:-)

Start med å lag en ny fil, kall denne for "kalender.asp" eller noe du vil ha den til.

Starter med å deklarere alle variablene vi skal bruke

Code:

<%
Dim tDay, tMonth, tYear, tDate
Dim oDay, oMonth, oYear, oDate
Dim tClass
tDay = Day(Date)
tMonth = Month(Date)
tYear = Year(Date)
oDay = Day(Date)
oMonth = Month(Date)
oYear = Year(Date)
Dim sDate
Dim calCounter
calCounter = 0

Er ikke noe særlig å kommentere på dette. Disse blir brukt senere.

Code:

If Request.QueryString("d") <> "" Then
    sDate = Split(Request.QueryString("d"), "/")
    If IsNumeric(sDate(0)) Then
        tMonth = sDate(0)
    End If
    If UBound(sDate) >= 1 Then
        If IsNumeric(sDate(1)) Then
	        tYear = sDate(1)
	    End If
    End If
End If

Vi ønsker muligheten for att brukeren skal kunne bla i kalenderen vår. Da kan vi spesifisere en gitt måned og år som skal vises.
I urlen så velger vi ved å bruke "?d=måned/år"

Code:

tDate = DateSerial(tYear, tMonth, tDay)
Dim daysInMonth
Select Case tMonth
	Case 1, 3, 5, 7, 8, 10, 12
            daysInMonth = 31
        Case 2
    		If tYear = 2004 Or tYear = 2008 Or tYear = 2012 Or tYear = 2016 Then
            		daysInMonth = 29
	    	Else
			    daysInMonth = 28
		    End If
        Case Else
            daysInMonth = 30
End Select

Nå vil vi egentlig bare finne ut hvor mange dager det er i valgt måned.

Code:

Dim prevMonth, nextMonth
Dim prevYear, nextYear
prevMonth = tMonth - 1
nextMonth = tMonth + 1
prevYear = tYear
nextYear = tYear
If prevMonth = 0 Then
    prevMonth = 12
    prevYear = tYear - 1
End If
If nextMonth = 13 Then
    nextMonth = 1
    nextYear = tYear + 1
End If
%>

Variabel navnene burde fortelle deg hva disse brukes til.
Hvis du ikke skjønte det, så er det for neste måned, år. og forrige måned, år.

Nå begynner kalender layouten. Som er en tabell, med header for hver dag.
Hver dag vises bare med første bokstav.

Code:

<table summary="Kalender">
    <caption><% = UCase( Left( MonthName( tMonth ), 1 )) & LCase( Right( MonthName(tMonth), Len(MonthName(tMonth)) - 1)) %> &nbsp; <% = tYear %></caption>
    <thead>
        <tr>
	        <th abbr="Mandag" scope="col" title="Mandag" width="<%=Round(100/7,0)%>%">M</th><th abbr="Tirsdag" scope="col" title="Tirsdag" width="<%=Round(100/7,0)%>%">T</th>
		    <th abbr="Onsdag" scope="col" title="Onsdag" width="<%=Round(100/7,0)%>%">O</th><th abbr="Torsdag" scope="col" title="Torsdag" width="<%=Round(100/7,0)%>%">T</th>
		    <th abbr="Fredag" scope="col" title="Fredag" width="<%=Round(100/7,0)%>%">F</th><th abbr="L&oslash;rdag" scope="col" title="L&oslash;rdag" width="<%=Round(100/7,0)%>%">L</th>
		    <th abbr="S&oslash;ndag" scope="col" title="S&oslash;ndag" width="<%=Round(100/7,0)%>%">S</th>
    	</tr>
    </thead><tfoot>
        <tr>
            <td abbr="<% = MonthName(prevMonth) %>" colspan="3" id="prev"><a href="?d=<% = prevMonth & "/" & prevYear %>">&laquo; <% = MonthName(prevMonth) %></a></td>
		    <td class="pad">&nbsp;</td>
		    <td abbr="<% = MonthName(nextMonth) %>" colspan="3" id="next"><a href="?d=<% = nextMonth & "/" & nextYear %>">&laquo; <% = MonthName(nextMonth) %></a></td>
	    </tr>
    </tfoot><tbody>
<tr>

Nå har vi kolonne navnene og navigering mellom månedene klare.
Nå skal vi begynne med det mer dynamiske og som vil vise tallene som representerer datoene.

Code:

<%
If (WeekDay(DateSerial(tYear, tMonth, 1), 2) - 1) > 0 Then
    Response.Write(" <td colspan=""" & (WeekDay(DateSerial(tYear, tMonth, 1), 2) - 1) & """ class=""pad"">&nbsp;</td>" & vbNewLine)
    calCounter = (WeekDay(DateSerial(tYear, tMonth, 1), 2) - 1)
End If

Løkken som generer tallene og resterende som mangler.

Code:

For x = 1 To daysInMonth
    If Not calCounter = 6 Then
        If x = Day(Date) And tMonth = Month(Date) And tYear = Year(Date) Then
	        Response.Write(" <td id=""today"">" & x & "</td>")
        Else
            Response.Write(" <td>" & x & "</td>")
        End If
    Else
        If x = Day(Date) And tMonth = Month(Date) And tYear = Year(Date) Then
	        Response.Write(" <td id=""today"" class=""sunday"">" & x & "</td>")
	    Else
	        Response.Write(" <td class=""sunday"">" & x & "</td>")
	    End If
    End If
    If calCounter = 6 Then
        Response.Write("</tr><tr>" & vbNewLine)
        calCounter = 0
    Else
        calCounter = calCounter + 1
    End If
Next

Vi kjører nå denne løkken fra 1. dag til siste dag i måneden.
If Not calCounter = 6 Then ' denne sjekker om gjeldene dag er søndagen. Hvis den er søndag, så vil vi legge til att celle klassen skal være sunday, slik att vi kan få denne til å se annerledes ut enn andre dager (rød).
If calCounter = 6 Then ' hvis dagen er søndag, som er den siste dagen i uken, så vil vi lage en ny rad.

Code:

If calCounter > 0 Then
    Response.Write(" <td colspan=""" & (7 - calCounter) & """ class=""pad"">&nbsp;</td>" & vbNewLine)
End If
%>

Vi sjekker nå om vi fikk fullført løkken slik att vi endte på søndag. Hvis ikke. så lager vi dem med en celle som legger seg over de resterende feltene.

Code:

</tr>
</tbody>
</table>

For å avslutte siste rest av HTML Tabellen.

Kalenderen kan inkluderes ved hjelp av <!-- #include file="kalender.asp" --> eller ved å ha hele koden på siden. Anbefaler første alternativet.

Se vedlagt bilde for hvordan resultatet skal være om du har gjort ting riktig.
Legger også ved en ferdige kilde.:-)