Updated mithril index to do (almost) the same with normal index
This commit is contained in:
parent
49310f645a
commit
ae762758fc
@ -2,19 +2,38 @@
|
||||
namespace App\Controllers;
|
||||
|
||||
use App\Models\Post;
|
||||
use Core\Session;
|
||||
|
||||
class Api
|
||||
{
|
||||
private $model;
|
||||
|
||||
public function __construct() {
|
||||
public function __construct()
|
||||
{
|
||||
$this->model = new Post();
|
||||
}
|
||||
|
||||
public function posts() {
|
||||
public function posts($args = ['id' => '1'])
|
||||
{
|
||||
$get = [];
|
||||
$get['count'] = 0;
|
||||
|
||||
if ($args['id'] == 3) {
|
||||
$get['data'] = $this->model->showJoin();
|
||||
} else {
|
||||
$get['data'] = $this->model->showJoin([
|
||||
['pengumuman.status', '=', $args['id']]
|
||||
]);
|
||||
}
|
||||
|
||||
if ($get['data'] == false) {
|
||||
$get['data']['content'] = 'Tidak ada pengumuman';
|
||||
$get['data']['valid_at'] = '';
|
||||
$get['data']['expired_at'] = '';
|
||||
$get['data']['status'] = 0;
|
||||
$get['data']['background'] = '#333';
|
||||
$get['data']['foreground'] = '#888';
|
||||
}
|
||||
|
||||
if (array_key_exists(0, $get['data']) == false) {
|
||||
$temp_data = $get['data'];
|
||||
|
||||
@ -178,6 +178,17 @@ class Home
|
||||
|
||||
// Branch mithril test
|
||||
public function mithril() {
|
||||
View::render('Data/mithril.html');
|
||||
if (Session::exists('userid')) {
|
||||
$user['id'] = Session::get('userid');
|
||||
$user['username'] = Session::get('username');
|
||||
$user['full_name'] = Session::get('full_name');
|
||||
$user['privilege'] = Session::get('privilege');
|
||||
} else {
|
||||
$user = false;
|
||||
}
|
||||
|
||||
View::render('Data/mithril.html', [
|
||||
'user' => $user
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
||||
@ -122,7 +122,7 @@ class Post extends \Core\Model
|
||||
try {
|
||||
$db = static::connectDB();
|
||||
|
||||
$sql = "SELECT pengumuman.id, kategori.category, kategori.background, kategori.foreground, pengumuman.valid_at, pengumuman.expired_at, pengumuman.creator, pengumuman.editor, pengumuman.content, pengumuman.status FROM pengumuman INNER JOIN kategori ON pengumuman.category=kategori.id";
|
||||
$sql = "SELECT pengumuman.id, kategori.category, kategori.background, kategori.foreground, date(pengumuman.valid_at) as valid_at, date(pengumuman.expired_at) as expired_at, pengumuman.creator, pengumuman.editor, pengumuman.content, pengumuman.status FROM pengumuman INNER JOIN kategori ON pengumuman.category=kategori.id";
|
||||
|
||||
if ($conditions) {
|
||||
$sql .= " WHERE";
|
||||
|
||||
@ -2,77 +2,227 @@
|
||||
|
||||
{% block title %}Mithril{% endblock %}
|
||||
|
||||
{% block nav %}
|
||||
<input type="checkbox" id="bmenug" class="show">
|
||||
<label for="bmenug" class="burger pseudo button"><i class="fa fa-bars" aria-hidden="true"></i></label>
|
||||
<div class="menu">
|
||||
{% if user.privilege != "" %}
|
||||
{% if user.privilege == 1 %}
|
||||
<a href="/posts/category" class="navy button" data-tooltip="Kategori"><i class="fa fa-list-ul" aria-hidden="true"></i> Kategori</a>
|
||||
<a href="/register" class="navy button" data-tooltip="User Baru"><i class="fa fa-user-plus" aria-hidden="true"></i> User</a>
|
||||
{% endif %}
|
||||
<a href="/logout" class="navy button" data-tooltip="Keluar"><i class="fa fa-sign-out" aria-hidden="true"></i> Keluar</a>
|
||||
{% else %}
|
||||
<a href="/login" class="navy hidden-hover button" data-tooltip="Masuk">
|
||||
<i class="fa fa-sign-in" aria-hidden="true"></i> Masuk
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block body %}
|
||||
<main class="documentation">
|
||||
<div style="text-align:left;width:100%;">
|
||||
<div id="nouser" style="text-align:left;width:100%;">
|
||||
<div style="background:#fff;text-align:left;width:100vw;padding:10vh 0 0;">
|
||||
<div class="filter flex six-600 four grow">
|
||||
<div class="sixth-600 none"></div>
|
||||
<div>
|
||||
<a href="/" class="navy" style="font-size:smaller;">Semua</a>
|
||||
</div>
|
||||
<div>
|
||||
<a href="/?status=1" class="navy" style="font-size:smaller;">Aktif</a>
|
||||
</div>
|
||||
<div>
|
||||
<a href="/?status=2" class="navy" style="font-size:smaller;">Belum Aktif</a>
|
||||
</div>
|
||||
<div>
|
||||
<a href="/?status=0" class="navy" style="font-size:smaller;">Nonaktif</a>
|
||||
</div>
|
||||
<div class="sixth-600 none"></div>
|
||||
<div id='navigasi'>
|
||||
</div>
|
||||
<div id="mit">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<script>
|
||||
var root = document.getElementById('mit')
|
||||
|
||||
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', '')
|
||||
])
|
||||
}
|
||||
}
|
||||
|
||||
var Slider = {
|
||||
view: function() {
|
||||
return m('#slidr-div', Post.list.map(function(post) {
|
||||
return m('div[data-slidr=' + post.id + ']', {
|
||||
style: 'color:' + post.foreground + ';background-color:' + post.background + ';width:100vw;height:100vh;'
|
||||
}, m('div', {style: 'padding:15vh 0;'}, m.trust(marked(post.content))))
|
||||
}))
|
||||
}
|
||||
}
|
||||
|
||||
var Post = {
|
||||
list: [],
|
||||
curStatus: 3,
|
||||
interval: 10000,
|
||||
loadList: function() {
|
||||
return m.request({
|
||||
method: 'GET',
|
||||
url: '/api/posts',
|
||||
url: '/api/posts/' + Post.curStatus,
|
||||
withCredentials: true
|
||||
})
|
||||
.then(function(result) {
|
||||
Post.list = result.data
|
||||
console.log('cek')
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
var PostList = {
|
||||
oninit: Post.loadList,
|
||||
var Component = {
|
||||
view: function() {
|
||||
// return m('.user-list', Post.list.map(function(post) {
|
||||
// return m('.user-list-item', post.content + ' ' + post.category)
|
||||
// }))
|
||||
return m('.bungkus.flex.four-900.full.card-wrapper', {style:'padding:0 .6em;'}, [
|
||||
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),
|
||||
m('span.stack', {style:'color:' + post.foreground}, post.content),
|
||||
m('form', {method:'post',action:'/'}, m('footer.flex.full.grow', [
|
||||
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('span', {style: 'font-size:smaller'}, 'Ubah')
|
||||
])),
|
||||
m('.half-900', m('button.error.full', {type:'submit'}, [
|
||||
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('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'))))
|
||||
])
|
||||
})
|
||||
])
|
||||
}
|
||||
}
|
||||
|
||||
m.mount(root, PostList)
|
||||
var PostNoUser = {
|
||||
oninit: function() {
|
||||
Post.curStatus = 1
|
||||
Post.loadList()
|
||||
setInterval(function() {
|
||||
Post.loadList()
|
||||
}, Post.interval)
|
||||
},
|
||||
view: function() {
|
||||
return m(Slider)
|
||||
}
|
||||
}
|
||||
|
||||
var PostList = {
|
||||
oninit: function() {
|
||||
Post.curStatus = 3
|
||||
Post.loadList()
|
||||
setInterval(function() {
|
||||
Post.loadList()
|
||||
}, Post.interval)
|
||||
},
|
||||
view: function() {
|
||||
return m(Component)
|
||||
}
|
||||
}
|
||||
|
||||
var PostActive = {
|
||||
oninit: function() {
|
||||
Post.curStatus = 1
|
||||
Post.loadList()
|
||||
setInterval(function() {
|
||||
Post.loadList()
|
||||
}, Post.interval)
|
||||
},
|
||||
view: function() {
|
||||
return m(Component)
|
||||
}
|
||||
}
|
||||
|
||||
var PostSoon = {
|
||||
oninit: function() {
|
||||
Post.curStatus = 2
|
||||
Post.loadList()
|
||||
setInterval(function() {
|
||||
Post.loadList()
|
||||
}, Post.interval)
|
||||
},
|
||||
view: function() {
|
||||
return m(Component)
|
||||
}
|
||||
}
|
||||
|
||||
var PostInactive = {
|
||||
oninit: function() {
|
||||
Post.curStatus = 0
|
||||
Post.loadList()
|
||||
setInterval(function() {
|
||||
Post.loadList()
|
||||
}, Post.interval)
|
||||
},
|
||||
view: function() {
|
||||
return m(Component)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
{% if user != false %}
|
||||
<script>
|
||||
m.mount(document.getElementById('navigasi'), Nav)
|
||||
|
||||
m.route(root, '', {
|
||||
'': PostList,
|
||||
'/': PostList,
|
||||
'/active': PostActive,
|
||||
'/soon': PostSoon,
|
||||
'/inactive': PostInactive,
|
||||
})
|
||||
</script>
|
||||
{% else %}
|
||||
<script>
|
||||
m.mount(document.getElementById('nouser'), PostNoUser)
|
||||
|
||||
setTimeout(function() {
|
||||
if (document.getElementById('slidr-div')) {
|
||||
var postids = function() {
|
||||
return Post.list.map(function(post) {
|
||||
return post.id
|
||||
}) + ',' + Post.list[0].id
|
||||
}
|
||||
slidr.create('slidr-div', {
|
||||
controls: false,
|
||||
timing: {'linear': '0.5s ease-in'},
|
||||
theme: '#666',
|
||||
touch: true
|
||||
}).add("h", (postids()).split(',')).start().auto();
|
||||
}
|
||||
}, 100)
|
||||
</script>
|
||||
{% endif %}
|
||||
|
||||
{% endblock %}
|
||||
|
||||
@ -208,6 +208,7 @@
|
||||
<script src="/js/slidr.min.js"></script>
|
||||
<script src="/js/simplemde.min.js"></script>
|
||||
<script src="/js/mithril.js"></script>
|
||||
<script src="/js/marked.js"></script>
|
||||
{% block body %}
|
||||
{% endblock %}
|
||||
|
||||
|
||||
1286
public/js/marked.js
Normal file
1286
public/js/marked.js
Normal file
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user