Labels

php (35) javascript (31) phpjavascript (30) jquery (23) html (20) mysql (14) database (9) codeigniter (4) json (4) bar chart (2) calendar (2) column chart (2) framework (2) google maps (2) query (2) tables (2) url (2) dropdown (1)

Thursday, January 25, 2018

Calendar Using JavaScript

<html>
<head>

    <style type="text/css">
        span.label {
            color: black;
            width: 30px;
            height: 16px;
            text-align: center;
            margin-top: 0;
            background: #ffF;
            font: bold 13px Arial
        }
        span.c1 {
            cursor: hand;
            color: black;
            width: 30px;
            height: 16px;
            text-align: center;
            margin-top: 0;
            background: #ffF;
            font: bold 13px Arial
        }
        span.c2 {
            cursor: hand;
            color: red;
            width: 30px;
            height: 16px;
            text-align: center;
            margin-top: 0;
            background: #ffF;
            font: bold 13px Arial
        }
        span.c3 {
            cursor: hand;
            color: #b0b0b0;
            width: 30px;
            height: 16px;
            text-align: center;
            margin-top: 0;
            background: #ffF;
            font: bold 12px Arial
        }
    </style>

    <script type="text/javascript">

        function maxDays(mm, yyyy) {
            var mDay;
            if ((mm == 3) || (mm == 5) || (mm == 8) || (mm == 10)) {
                mDay = 30;
            }
            else {
                mDay = 31
                if (mm == 1) {
                    if (yyyy / 4 - parseInt(yyyy / 4) != 0) {
                        mDay = 28
                    }
                    else {
                        mDay = 29
                    }
                }
            }
            return mDay;
        }

        function changeBg(id) {
            if (eval(id).style.backgroundColor != "yellow") {
                eval(id).style.backgroundColor = "yellow"
            }
            else {
                eval(id).style.backgroundColor = "#ffffff"
            }
        }

        function writeCalendar() {
            var now = new Date
            var dd = now.getDate()
            var mm = now.getMonth()
            var dow = now.getDay()
            var yyyy = now.getFullYear()

            var arrM = new Array("January", "February", "March",
                "April", "May", "June", "July", "August",
                "September", "October", "November", "December")

            var arrY = new Array()
            for (ii = 0; ii <= 4; ii++) {
                arrY[ii] = yyyy - 2 + ii
            }
            var arrD = new Array("Sun", "Mon", "Tue",
                "Wed", "Thu", "Fri", "Sat")

            var text = ""
            text = "<form name=calForm>"
            text += "<table border=1>"
            text += "<tr><td>"
            text += "<table width=100%><tr>"
            text += "<td align=left>"
            text += "<select name=selMonth onChange='changeCal()'>"
            for (ii = 0; ii <= 11; ii++) {
                if (ii == mm) {
                    text += "<option value= " + ii + " Selected>"
                        + arrM[ii] + "</option>"
                }
                else {
                    text += "<option value= " + ii + ">"
                        + arrM[ii] + "</option>"
                }
            }
            text += "</select>"
            text += "</td>"
            text += "<td align=right>"
            text += "<select name=selYear onChange='changeCal()'>"
            
            for (ii = 0; ii <= 4; ii++) {
                if (ii == 2) {
                    text += "<option value= " + arrY[ii] + " Selected>"
                        + arrY[ii] + "</option>"
                }
                else {
                    text += "<option value= " + arrY[ii] + ">"
                        + arrY[ii] + "</option>"
                }
            }
            text += "</select>"
            text += "</td>"
            text += "</tr></table>"
            text += "</td></tr>"
            text += "<tr><td>"
            text += "<table border=1>"
            text += "<tr>"
            for (ii = 0; ii <= 6; ii++) {
                text += "<td align=center><span class=label>" + 
                   arrD[ii] +
                    "</span></td>"
            }
            text += "</tr>"
            aa = 0
            for (kk = 0; kk <= 5; kk++) {
                text += "<tr>"
                for (ii = 0; ii <= 6; ii++) {
                    text += "<td align=center><span id=sp" + aa +
                        " onClick='changeBg(this.id)'>1</span></td>"
                    aa += 1
                }
                text += "</tr>"
            }
            text += "</table>"
            text += "</td></tr>"
            text += "</table>"
            text += "</form>"
            document.write(text)
            changeCal()
        }
        function changeCal() {
            var now = new Date
            var dd = now.getDate()
            var mm = now.getMonth()
            var dow = now.getDay()
            var yyyy = now.getFullYear()
            var currM = parseInt(document.calForm.selMonth.value)
            var prevM
            if (currM != 0) {
                prevM = currM - 1
            }
            else {
                prevM = 11
            }
            var currY = parseInt(document.calForm.selYear.value)
            var mmyyyy = new Date()
            mmyyyy.setFullYear(currY)
            mmyyyy.setMonth(currM)
            mmyyyy.setDate(1)
            var day1 = mmyyyy.getDay()
            if (day1 == 0) {
                day1 = 7
            }
            var arrN = new Array(41)
            var aa
            for (ii = 0; ii < day1; ii++) {
                arrN[ii] = maxDays((prevM), currY) - day1 + ii + 1
            }
            aa = 1
            for (ii = day1; ii <= day1 + maxDays(currM, currY) - 1; ii++) 
           {
                arrN[ii] = aa
                aa += 1
            }
            aa = 1
            for (ii = day1 + maxDays(currM, currY); ii <= 41; ii++) {
                arrN[ii] = aa
                aa += 1
            }
            for (ii = 0; ii <= 41; ii++) {
                eval("sp" + ii).style.backgroundColor = "#FFFFFF"
            }
            var dCount = 0
            for (ii = 0; ii <= 41; ii++) {
                if (((ii < 7) && (arrN[ii] > 20)) || ((ii > 27) &&
                     (arrN[ii] < 20))) {
                    eval("sp" + ii).innerHTML = arrN[ii]
                    eval("sp" + ii).className = "c3"
                }
                else {
                    eval("sp" + ii).innerHTML = arrN[ii]
                    if ((dCount == 0) || (dCount == 6)) {
                        eval("sp" + ii).className = "c2"
                    }
                    else {
                        eval("sp" + ii).className = "c1"
                    }
                    if ((arrN[ii] == dd) && (mm == currM) &&
                        (yyyy == currY)) {
                    eval("sp" + ii).style.backgroundColor = "#90EE90"
                    }
                }
                dCount += 1
                if (dCount > 6) {
                    dCount = 0
                }
            }
        }
    </script>
</head>

<body>
<script type="text/javascript">writeCalendar()</script>
</body>

</html>
Result:

8 comments:

  1. Proper documentation: The presentation of a flow chart, sometimes help in proper documentation of your assignment. The different steps or processes, written in an elaborated way often gets messed up due to confusion. However, the flowchart can help you in arranging your documents properly in a synchronized way.
    Java Assignment help
    Law assignment help

    ReplyDelete
  2. Assignmentservicerating is best reviews site.We at Top Quality Assignment believe that there is no shortcut to success and to attain success, hard work, dedication, and commitment must be present.AllAssignmentHelp reviews  best reviews site.
    All Assignment Help reviews 

    ReplyDelete
  3. It is one of the finest websites I have stumbled upon. It is not only well developed, but has good content as well. It could prove to be an inspiration for many other entrepreneurs. Our company is into assignment writing service sector and helps pupils in completing their academic tasks. Students can use our service for the same purpose. make my assignment

    ReplyDelete
  4. Nice post.. Assignment help  is not a big deal now because our experts of Ireland have deep knowledge of every subject and they are available at affordable price. The students of ireland are now free, because the burden of completing the assignment on time has fallen from their head and now they enjoying their higher grades in college.

    ReplyDelete
  5. I truly making the most of your web article. I am framing an introduction, and I would love to utilize a portion of the data in this webpost in it. Is this fine? Provided that this is true, I may likewise utilize a portion of the data on my Internet Marketing blog, however I will make a point to leave a source connect to your site in the event that I utilize any of your material. Anyway, I anticipate a greater amount of your awesome data and give me an email in the event that I can help you by any stretch of the imagination.

    ReplyDelete
  6. Hiring our Online Homework Help assistance will sort out all your assignment related concerns

    ReplyDelete
  7. The essay help mainly aim to help the concerned students with the solutions to the assignments that might help them to secure better grades and in turn improve their academic career. These custom essay writing service tend to claim that the solutions that they provide o the clients would fetch them better grades against the given assignment. The solutions that are provided by the various online law essay help are generally observed to be devoid of the various syntactical and grammatical errors and are structured in a proper manner. If you are also having trouble drafting all your essay papers with confidence, you can come to My Essay Help and avail the necessary essay typer service to fulfil your requirements.

    ReplyDelete

More Posts

FOLLOW