Difference between revisions of "Team:NCHU Taichung/notebook"

(Created page with "{{NCHU_Taichung/navbar}} {{NCHU_Taichung/footer}}")
 
Line 1: Line 1:
 
{{NCHU_Taichung/navbar}}
 
{{NCHU_Taichung/navbar}}
−
 
+
<html>
 +
<div class="ui page dimmer">
 +
    <div class="content">
 +
      <div class="center ui big header">Click on the date cell to see daily event :)</div>
 +
    </div>
 +
  </div>
 +
  <h1 class="ui hidden header"></h1>
 +
  <script>// fill the month table with column headings
 +
    function day_title(day_name) {
 +
      document.write("<div class='c-cal__col'>" + day_name + "</div>");
 +
    }
 +
    // fills the month table with numbers
 +
    function fill_table(month, month_length, indexMonth) {
 +
      day = 1;
 +
      // begin the new month table
 +
      document.write("<div class='c-main c-main-" + indexMonth + "'>");
 +
      // document.write("<b>"+month+" "+year+"</b>")
 +
      // column headings
 +
      document.write("<div class='c-cal__row'>");
 +
      day_title("Sun");
 +
      day_title("Mon");
 +
      day_title("Tue");
 +
      day_title("Wed");
 +
      day_title("Thu");
 +
      day_title("Fri");
 +
      day_title("Sat");
 +
      document.write("</div>");
 +
      // pad cells before first day of month
 +
      document.write("<div class='c-cal__row'>");
 +
      for (var i = 1; i < start_day; i++) {
 +
        if (start_day > 7) {
 +
        } else {
 +
          document.write("<div class='c-cal__cel'></div>");
 +
        }
 +
      }
 +
      // fill the first week of days
 +
      for (var i = start_day; i < 8; i++) {
 +
        document.write(
 +
          "<div data-day='2018-" + indexMonth + "-0" + day + "'class='c-cal__cel'><p>" + day + "</p></div>"
 +
        );
 +
        day++;
 +
      }
 +
      document.write("</div>");
 +
      // fill the remaining weeks
 +
      while (day <= month_length) {
 +
        document.write("<div class='c-cal__row'>");
 +
        for (var i = 1; i <= 7 && day <= month_length; i++) {
 +
          if (day >= 1 && day <= 9) {
 +
            document.write("<div data-day='2018-" + indexMonth + "-0" + day + "'class='c-cal__cel'><p>" + day + "</p></div>");
 +
            day++;
 +
          } else {
 +
            document.write("<div data-day='2018-" + indexMonth + "-" + day + "' class='c-cal__cel'><p>" + day + "</p></div>");
 +
            day++;
 +
          }
 +
        }
 +
        document.write("</div>");
 +
        // the first day of the next month
 +
        start_day = i;
 +
      }
 +
      document.write("</div>");
 +
    }</script>
 +
  <header>
 +
    <div class="wrapper">
 +
      <div class="c-monthyear">
 +
        <div class="c-month">
 +
          <i class="chevron left icon prev" id="prev"></i>
 +
          <div id="c-paginator">
 +
            <span class="c-paginator__month">JANUARY</span>
 +
            <span class="c-paginator__month">FEBRUARY</span>
 +
            <span class="c-paginator__month">MARCH</span>
 +
            <span class="c-paginator__month">APRIL</span>
 +
            <span class="c-paginator__month">MAY</span>
 +
            <span class="c-paginator__month">JUNE</span>
 +
            <span class="c-paginator__month">JULY</span>
 +
            <span class="c-paginator__month">AUGUST</span>
 +
            <span class="c-paginator__month">SEPTEMBER</span>
 +
            <span class="c-paginator__month">OCTOBER</span>
 +
            <span class="c-paginator__month">NOVEMBER</span>
 +
            <span class="c-paginator__month">DECEMBER</span>
 +
          </div>
 +
          <i class="chevron right icon next" id="next"></i>
 +
        </div>
 +
        <span class="c-paginator__year">2018</span>
 +
      </div>
 +
      <div class="c-sort">
 +
        <a class="o-btn c-today__btn" href="javascript:;">TODAY</a>
 +
      </div>
 +
    </div>
 +
  </header>
 +
  <div class="wrapper">
 +
    <div class="c-calendar">
 +
      <div class="c-calendar__style c-aside">
 +
        <div class="c-aside__day">
 +
          <span class="c-aside__num"> </span>
 +
          <span class="c-aside__month"></span>
 +
        </div>
 +
        <div class="c-aside__eventList"></div>
 +
      </div>
 +
      <div class="c-cal__container c-calendar__style">
 +
        <script>// CAHNGE the below variable to the CURRENT YEAR
 +
          year = 2018;
 +
          // first day of the week of the new year
 +
          today = new Date("January 1, " + year);
 +
          start_day = today.getDay() + 1;
 +
          fill_table("January", 31, "01");
 +
          fill_table("February", 28, "02");
 +
          fill_table("March", 31, "03");
 +
          fill_table("April", 30, "04");
 +
          fill_table("May", 31, "05");
 +
          fill_table("June", 30, "06");
 +
          fill_table("July", 31, "07");
 +
          fill_table("August", 31, "08");
 +
          fill_table("September", 30, "09");
 +
          fill_table("October", 31, "10");
 +
          fill_table("November", 30, "11");
 +
          fill_table("December", 31, "12");
 +
        </script>
 +
      </div>
 +
    </div>
 +
  </div>
 +
</html>
 +
<script src="https://2018.igem.org/wiki/index.php?title=Team:NCHU_Taichung/js/notebook.js&amp;action=raw&amp;ctype=text/javascript"></script>
 
{{NCHU_Taichung/footer}}
 
{{NCHU_Taichung/footer}}

Revision as of 12:54, 17 October 2018

NCHU_Taichung

Home
Project
Description Background Design Model Result Demonstrate
Parts
Overview Improve
Human Practice
Integrated Introduction Conference Engagement Entrepreneurship
Lab
Interlab Notebook Protocol Safety
Team
Members Attributions Collaborations
Medals Prizes
Click on the date cell to see daily event :)

JANUARY FEBRUARY MARCH APRIL MAY JUNE JULY AUGUST SEPTEMBER OCTOBER NOVEMBER DECEMBER
2018
TODAY
<script src="https://2018.igem.org/wiki/index.php?title=Team:NCHU_Taichung/js/notebook.js&action=raw&ctype=text/javascript"></script>