Mithril now can walks by itself

assets/js/components/activePost.js

@@ -0,0 +1,18 @@
+let m = require('mithril')
+let Post = require('../models/post')
+let listAdmin = require('./listAdmin')
+
+var activePost = {
+    oninit: function() {
+        Post.curStatus = 1
+        Post.loadList()
+        setInterval(function() {
+            Post.loadList()
+        }, Post.interval)
+    },
+    view: function() {
+        return m(listAdmin)
+    }
+}
+
+module.exports = activePost

assets/js/components/allPost.js

@@ -0,0 +1,18 @@
+let m = require('mithril')
+let Post = require('../models/post')
+let listAdmin = require('./listAdmin')
+
+var allPost = {
+    oninit: function() {
+        Post.curStatus = 3
+        Post.loadList()
+        setInterval(function() {
+            Post.loadList()
+        }, Post.interval)
+    },
+    view: function() {
+        return m(listAdmin)
+    }
+}
+
+module.exports = allPost

assets/js/components/inactivePost.js

@@ -0,0 +1,18 @@
+let m = require('mithril')
+let Post = require('../models/post')
+let listAdmin = require('./listAdmin')
+
+var inactivePost = {
+    oninit: function() {
+        Post.curStatus = 0
+        Post.loadList()
+        setInterval(function() {
+            Post.loadList()
+        }, Post.interval)
+    },
+    view: function() {
+        return m(listAdmin)
+    }
+}
+
+module.exports = inactivePost

assets/js/components/listAdmin.js

@@ -0,0 +1,45 @@
+let m = require('mithril')
+let Post = require('../models/post')
+let marked = require('../vendor/marked')
+
+var listAdmin = {
+    view: function() {
+        return m('.bungkus.flex.four-900.full.card-wrapper', [
+            m('a.fourth-900.half-600.card.box.new', {href:'/posts/entry'}, m('i.fa.fa-plus.fa-3x', '')),
+            Post.list.map(function(post) {
+                return m('.fourth-900.half-600.card.box', {style:'background-color:' + post.background}, [
+                    m('span.stack', {style:'font-size:smaller;color:rgba(17,17,17,.4);margin-bottom:.6em;'}, post.valid_at + ' - ' + post.expired_at),
+                    m('span.stack', {style:'color:' + post.foreground}, m.trust(marked(post.content))),
+                    m('form', {method:'post',action:'/'}, m('footer.flex.full.grow', (post.status != 0) ? [
+                        m('.half-900', m('a.button.full', {href: '/posts/edit/' + post.id}, [
+                            m('i.fa.fa-edit.fa-fw', ''),
+                            m('span', {style: 'font-size:smaller'}, 'Ubah')
+                        ])),
+                        m('.half-900', (post.status == 1) ? [
+                            m('input', {type: 'hidden', name: 'id'}, post.id),
+                            m('input', {type: 'hidden', name: 'status'}, '0'),
+                            m('input', {type: 'hidden', name: '_method'}, 'delete'),
+                            m('input', {type: 'hidden', name: '_token'}, 'abc123'),
+                            m('button.error.full', {type: 'submit'}, [
+                                m('i.fa.fa-times-circle-o.fa-fw', ''),
+                                m('span', {style: 'font-size:smaller'}, 'Matikan')
+                            ])
+                        ] : [
+                            m('input', {type: 'hidden', name: 'id'}, post.id),
+                            m('input', {type: 'hidden', name: 'valid_at'}, '##date##'),
+                            m('input', {type: 'hidden', name: 'status'}, '1'),
+                            m('input', {type: 'hidden', name: '_method'}, 'put'),
+                            m('input', {type: 'hidden', name: '_token'}, 'abc123'),
+                            m('button.success.full', {type: 'submit'}, [
+                                m('i.fa.fa-check.fa-fw', ''),
+                                m('span', {style: 'font-size:smaller;'}, 'Aktifkan')
+                            ])
+                        ])
+                    ] : m('.half-900', m('span.button.pseudo.full', {style: 'color:rgba(17,17,17,.3);'}, 'Nonaktif'))))
+                ])
+            })
+        ])
+    }
+}
+
+module.exports = listAdmin

assets/js/components/nav.js

@@ -0,0 +1,28 @@
+let m = require('mithril')
+
+var nav = {
+    view: function() {
+        return m('.filter.flex.six-600.four.grow', [
+            m('.sixth-600.none', ''),
+            m('div', m('a[href=/].navy', {
+                oncreate: m.route.link,
+                style: 'font-size:smaller;'
+            }, 'Semua')),
+            m('div', m('a[href=/active].navy', {
+                oncreate: m.route.link,
+                style: 'font-size:smaller;'
+            }, 'Aktif')),
+            m('div', m('a[href=/soon].navy', {
+                oncreate: m.route.link,
+                style: 'font-size:smaller;'
+            }, 'Belum Aktif')),
+            m('div', m('a[href=/inactive].navy', {
+                oncreate: m.route.link,
+                style: 'font-size:smaller;'
+            }, 'Nonaktif')),
+            m('.sixth-600.none', '')
+        ])
+    }
+}
+
+module.exports = nav

assets/js/components/soonPost.js

@@ -0,0 +1,18 @@
+let m = require('mithril')
+let Post = require('../models/post')
+let listAdmin = require('./listAdmin')
+
+var soonPost = {
+    oninit: function() {
+        Post.curStatus = 2
+        Post.loadList()
+        setInterval(function() {
+            Post.loadList()
+        }, Post.interval)
+    },
+    view: function() {
+        return m(listAdmin)
+    }
+}
+
+module.exports = soonPost

assets/js/index.js

@@ -0,0 +1,20 @@
+let m = require('mithril')
+
+let mslider = require('./components/slider')
+let allPost = require('./components/allPost')
+let activePost = require('./components/activePost')
+let soonPost = require('./components/soonPost')
+let inactivePost = require('./components/inactivePost')
+let nav = require('./components/nav')
+
+var root = document.getElementById('mit')
+
+m.mount(document.getElementById('navigasi'), nav)
+
+m.route(root, '', {
+    '': allPost,
+    '/': allPost,
+    '/active': activePost,
+    '/soon': soonPost,
+    '/inactive': inactivePost,
+})

assets/js/landing.js

@@ -0,0 +1,56 @@
+let m = require('mithril')
+let swiper = require('swiper')
+let _ = require('lodash')
+require('../../node_modules/swiper/dist/css/swiper.css')
+
+let marked = require('./vendor/marked.js')
+
+var root = document.getElementById('nouser')
+
+const getPageData = function() {
+    m.request({
+        method: 'GET',
+        url: '/api/posts',
+        background: false
+    })
+    .then(function(res) {
+        if (!_.isEqual(res['data'], images.list)) {
+            images.list = res['data']
+            m.mount(root, null)
+            m.mount(root, images)
+        }
+    })
+}
+
+var images = {
+    oninit: getPageData,
+    oncreate: function() {
+        setTimeout(function() {
+            var imgSwiper = new swiper('.swiper-container', {
+                speed: 500,
+                autoplay: 500,
+                autoplayDisableOnInteraction: false,
+                loop: true,
+                onTransitionEnd: function(imgSwiper) {
+                    getPageData()
+                }
+            })
+        }, 500)
+    },
+    list: [],
+    view: function() {
+        return m('.swiper-container', {
+        }, [
+            m('.swiper-wrapper', [
+                images.list.map(function(item) {
+                    return m('.swiper-slide.fitty', {
+                        "data-swiper-autoplay": item.delay,
+                        style: "background-color:" + item.background + "; color:" + item.foreground + "; padding: 15vh 0;"
+                    }, m.trust(marked(item.content)))
+                })
+            ])
+        ])
+    }
+}
+
+m.mount(root, images)

assets/js/models/post.js

@@ -0,0 +1,20 @@
+let m = require('mithril')
+
+var post = {
+    list: [],
+    curStatus: 3,
+    interval: 10000,
+    loadList: function() {
+        return m.request({
+            method: 'GET',
+            url: '/api/posts/' + post.curStatus,
+            withCredentials: true
+        })
+        .then(function(result) {
+            post.list = result.data
+            console.log('cek')
+        })
+    }
+}
+
+module.exports = post