first commit

src/static/css/admin.css

@@ -0,0 +1,37 @@
+div.user-item {
+    display: flex;
+    flex-flow: row;
+    align-items: flex-start;
+
+    padding: 1.25rem;
+    margin-bottom: 1.25rem;
+}
+
+div.user-item-words {
+    display: flex;
+    flex-flow: column;
+    align-items: flex-start;
+    flex-grow: 1;
+    flex-basis: 0;
+
+    word-break: break-all;
+}
+
+div.user-item-icon {
+    margin-left: 0.75rem;
+}
+
+
+
+
+
+div.control-list {
+    display: flex; 
+    flex-flow: row;
+    flex-wrap: wrap;
+}
+
+div.control-list > * {
+    margin-right: 0.75rem;
+    margin-bottom: 0.75rem;
+}

src/static/css/calendar.css

@@ -0,0 +1,124 @@
+#calendar-body div:nth-child(n+2) div {
+    border-top: 0 solid black;
+    border-left: 0 solid black;
+    border-right: 1px solid black;
+    border-bottom: 1px solid black;
+
+    padding: 0.75em;
+
+    display: flex;
+    flex-flow: column;
+    align-items: flex-start;
+
+    overflow: hidden;
+}
+
+#calendar-body div:nth-child(n+2) div:nth-child(1) {
+    border-left: 1px solid black;
+}
+
+#calendar-body div:nth-child(2) div {
+    border-top: 1px solid black;
+}
+
+#calendar-body div div {
+    flex-grow: 1;
+    flex-basis: 0;
+    flex-shrink: 0;
+
+    overflow: hidden;
+}
+
+#calendar-body div {
+    display: flex;
+    flex-flow: row;
+}
+
+
+
+
+
+
+
+div.schedule-day {
+    display: flex;
+    flex-flow: column;
+}
+
+div.schedule-day-words {
+    margin-top: 0.75rem;
+    margin-bottom: 0.75rem;
+}
+
+div.schedule-event-list {
+    display: flex;
+    flex-flow: column;
+}
+
+div.schedule-event {
+    display: flex;
+    flex-flow: row;
+    align-items: flex-start;
+
+    padding: 1.25rem;
+    margin-bottom: 1.25rem;
+}
+
+div.schedule-event-words {
+    display: flex;
+    flex-flow: column;
+    align-items: flex-start;
+    flex-grow: 1;
+    flex-basis: 0;
+
+    word-break: break-all;
+}
+
+div.schedule-event-icon {
+    margin-left: 0.75rem;
+}
+
+#schedule-list div.schedule-day:nth-child(n+2) {
+    border-top: 1px solid rgba(219,219,219,.5);
+}
+
+
+
+
+
+div.collection-item {
+    display: flex;
+    flex-flow: row;
+    align-items: flex-start;
+
+    padding: 1.25rem;
+    margin-bottom: 1.25rem;
+}
+
+div.collection-item-words {
+    flex-grow: 1;
+    flex-basis: 0;
+
+    word-break: break-all;
+}
+
+div.collection-item-icon {
+    margin-left: 0.75rem;
+}
+
+
+
+
+
+
+
+div.control-list {
+    display: flex; 
+    flex-flow: row;
+    flex-wrap: wrap;
+}
+
+div.control-list > * {
+    margin-right: 0.75rem;
+    margin-bottom: 0.75rem;
+}

src/static/css/todo.css

@@ -0,0 +1,32 @@
+div.todo-item {
+    display: flex;
+    flex-flow: row;
+    align-items: flex-start;
+
+    padding: 1.25rem;
+    margin-bottom: 1.25rem;
+}
+
+div.todo-item-words {
+    flex-grow: 1;
+    flex-basis: 0;
+
+    word-break: break-all;
+}
+
+div.todo-item-icon {
+    margin-left: 0.75rem;
+}
+
+
+
+div.control-list {
+    display: flex; 
+    flex-flow: row;
+    flex-wrap: wrap;
+}
+
+div.control-list > * {
+    margin-right: 0.75rem;
+    margin-bottom: 0.75rem;
+}

src/static/js/api.js

@@ -0,0 +1,3 @@
+function cnn_api_tokenValid() {
+    return true;
+}

src/static/js/headerNav.js

@@ -0,0 +1,11 @@
+function cnn_headerNav_Insert() {
+    $.ajax({
+        url: $("#jsrender-tmpl-headerNav").attr('src'),
+        type: "GET",
+        success: function (data) {
+            var tmpl = $.templates(data);
+            $('body').prepend(tmpl.render());
+        }
+    });
+}
+

src/static/js/i18n.js

@@ -0,0 +1,55 @@
+var ccn_i18n_i18nSupported = ['en-US', 'zh-CN'];
+var ccn_i18n_currentLanguage = 'en-US';
+
+// judge current language
+ccn_i18n_currentLanguage = ccn_localstorageAssist_Get('ccn-i18n', 'en-US');
+if (ccn_i18n_i18nSupported.indexOf(ccn_i18n_currentLanguage) == -1){
+    ccn_localstorageAssist_Set('ccn-i18n', 'en-US');
+    ccn_i18n_currentLanguage = 'en-US';
+}
+
+function ccn_i18n_ChangeLanguage(newLang) {
+    if (ccn_i18n_i18nSupported.indexOf(newLang) == -1) return false;
+    ccn_i18n_currentLanguage = newLang;
+    ccn_localstorageAssist_Set('ccn-i18n', newLang);
+    return true;
+}
+
+function ccn_i18n_ApplyLanguage() {
+    $.i18n.properties({
+        name: 'strings_' + ccn_i18n_currentLanguage,
+        path: 'i18n/',
+        mode: 'map',
+        language: ccn_i18n_currentLanguage,
+        callback: function() {
+            //set usual block
+            var cache = $(".ccn-i18n");
+            cache.each(function() {
+                $(this).html($.i18n.prop($(this).attr('name')));
+            });
+
+            //set unusual block
+            //set title
+            switch(ccn_pages_currentPage) {
+                case ccn_pages_enumPages.home:
+                    $('#ccn-pageName').html($.i18n.prop('ccn-pageName-home'))
+                    break;
+                case ccn_pages_enumPages.user:
+                    $('#ccn-pageName').html($.i18n.prop('ccn-pageName-user'))
+                    break;
+                case ccn_pages_enumPages.userinfo:
+                    $('#ccn-pageName').html($.i18n.prop('ccn-pageName-userinfo'))
+                    break;
+                case ccn_pages_enumPages.map:
+                    $('#ccn-pageName').html($.i18n.prop('ccn-pageName-map'))
+                    break;
+                case ccn_pages_enumPages.mapinfo:
+                    $('#ccn-pageName').html($.i18n.prop('ccn-pageName-mapinfo'))
+                    break;
+                case ccn_pages_enumPages.about:
+                    $('#ccn-pageName').html($.i18n.prop('ccn-pageName-about'))
+                    break;
+            }
+        }
+    })
+}

src/static/js/localStorageAssist.js

@@ -0,0 +1,11 @@
+function ccn_localstorageAssist_Get(index, defaultValue) {
+    var cache = localStorage.getItem(index);
+    if (cache == null) {
+        ccn_localstorageAssist_Set(index, defaultValue);
+        return defaultValue;
+    } else return cache;
+}
+
+function ccn_localstorageAssist_Set(index, value) {
+    localStorage.setItem(index, value);
+}

src/static/js/page/home.js

@@ -0,0 +1,4 @@
+$(document).ready(function() {
+    // insert nav first
+    cnn_headerNav_Insert();
+});

src/static/tmpl/headerNav.tmpl

@@ -0,0 +1,41 @@
+<nav class="navbar has-shadow is-spaced bd-navbar" role="navigation" aria-label="main navigation">
+    <div class="navbar-brand">
+        <a class="navbar-item" href="home">
+            <img src="icon.png"><b style="margin:0 0 0 14px;">coconut-leaf</b>
+        </a>
+
+        <a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false"
+            data-target="navbarBasicExample">
+            <span aria-hidden="true"></span>
+            <span aria-hidden="true"></span>
+            <span aria-hidden="true"></span>
+        </a>
+    </div>
+
+    <div id="navbarBasicExample" class="navbar-menu">
+        <div class="navbar-start">
+            <a class="navbar-item" href="home">Home</a>
+            <a class="navbar-item" href="calendar">Calendar</a>
+            <a class="navbar-item" href="todo">Todo</a>
+            <a class="navbar-item" href="admin">Admin</a>
+        </div>
+
+        <div class="navbar-end">
+            <p class="control">
+                <a class="button is-primary">Login</a>
+            </p>
+            <p class="control">
+                <a class="button is-primary">Logout</a>
+            </p>
+
+            <div class="navbar-item has-dropdown is-hoverable">
+                <a class="navbar-link">Language</a>
+
+                <div class="navbar-dropdown">
+                    <a class="navbar-item">English</a>
+                    <a class="navbar-item">简体中文</a>
+                </div>
+            </div>
+        </div>
+    </div>
+</nav>