wip
This commit is contained in:
syuilo
parent
6a4ea35e28
commit
204ad535c0
164 changed files with 2979 additions and 2966 deletions
|
|
@ -106,21 +106,21 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
this.mixin('api');
|
||||
|
||||
@session = @opts.session
|
||||
@app = @session.app
|
||||
this.session = this.opts.session
|
||||
this.app = @session.app
|
||||
|
||||
@cancel = ~>
|
||||
@api \auth/deny do
|
||||
cancel() {
|
||||
this.api 'auth/deny' do
|
||||
token: @session.token
|
||||
.then ~>
|
||||
@trigger \denied
|
||||
.then =>
|
||||
this.trigger('denied');
|
||||
|
||||
@accept = ~>
|
||||
@api \auth/accept do
|
||||
accept() {
|
||||
this.api 'auth/accept' do
|
||||
token: @session.token
|
||||
.then ~>
|
||||
@trigger \accepted
|
||||
.then =>
|
||||
this.trigger('accepted');
|
||||
</script>
|
||||
</mk-form>
|
||||
|
|
|
|||
|
|
@ -88,48 +88,48 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
@mixin \api
|
||||
this.mixin('i');
|
||||
this.mixin('api');
|
||||
|
||||
@state = null
|
||||
@fetching = true
|
||||
this.state = null
|
||||
this.fetching = true
|
||||
|
||||
@token = window.location.href.split \/ .pop!
|
||||
this.token = window.location.href.split '/' .pop!
|
||||
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
if not @SIGNIN then return
|
||||
|
||||
# Fetch session
|
||||
@api \auth/session/show do
|
||||
// Fetch session
|
||||
this.api 'auth/session/show' do
|
||||
token: @token
|
||||
.then (session) ~>
|
||||
@session = session
|
||||
@fetching = false
|
||||
.then (session) =>
|
||||
this.session = session
|
||||
this.fetching = false
|
||||
|
||||
# 既に連携していた場合
|
||||
// 既に連携していた場合
|
||||
if @session.app.is_authorized
|
||||
@api \auth/accept do
|
||||
this.api 'auth/accept' do
|
||||
token: @session.token
|
||||
.then ~>
|
||||
.then =>
|
||||
@accepted!
|
||||
else
|
||||
@state = \waiting
|
||||
@update!
|
||||
this.state = 'waiting'
|
||||
this.update();
|
||||
|
||||
@refs.form.on \denied ~>
|
||||
@state = \denied
|
||||
@update!
|
||||
this.refs.form.on('denied', () => {
|
||||
this.state = 'denied'
|
||||
this.update();
|
||||
|
||||
@refs.form.on \accepted @accepted
|
||||
this.refs.form.on 'accepted' @accepted
|
||||
|
||||
.catch (error) ~>
|
||||
@fetching = false
|
||||
@state = \fetch-session-error
|
||||
@update!
|
||||
.catch (error) =>
|
||||
this.fetching = false
|
||||
this.state = 'fetch-session-error'
|
||||
this.update();
|
||||
|
||||
@accepted = ~>
|
||||
@state = \accepted
|
||||
@update!
|
||||
accepted() {
|
||||
this.state = 'accepted'
|
||||
this.update();
|
||||
|
||||
if @session.app.callback_url
|
||||
location.href = @session.app.callback_url + '?token=' + @session.token
|
||||
|
|
|
|||
|
|
@ -21,6 +21,6 @@
|
|||
text-decoration underline
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
this.mixin('i');
|
||||
</script>
|
||||
</mk-api-info>
|
||||
|
|
|
|||
|
|
@ -17,18 +17,18 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
this.mixin('api');
|
||||
|
||||
@apps = []
|
||||
@fetching = true
|
||||
this.apps = []
|
||||
this.fetching = true
|
||||
|
||||
@on \mount ~>
|
||||
@api \i/authorized_apps
|
||||
.then (apps) ~>
|
||||
@apps = apps
|
||||
@fetching = false
|
||||
@update!
|
||||
.catch (err) ~>
|
||||
this.on('mount', () => {
|
||||
this.api 'i/authorized_apps'
|
||||
.then (apps) =>
|
||||
this.apps = apps
|
||||
this.fetching = false
|
||||
this.update();
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
</script>
|
||||
</mk-authorized-apps>
|
||||
|
|
|
|||
|
|
@ -57,8 +57,8 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@retry = ~>
|
||||
@unmount!
|
||||
@opts.retry!
|
||||
retry() {
|
||||
this.unmount();
|
||||
this.opts.retry!
|
||||
</script>
|
||||
</mk-core-error>
|
||||
|
|
|
|||
|
|
@ -5,6 +5,6 @@
|
|||
display inline
|
||||
</style>
|
||||
<script>
|
||||
@kind = @opts.type.split \/ .0
|
||||
this.kind = this.opts.type.split '/' .0
|
||||
</script>
|
||||
</mk-file-type-icon>
|
||||
|
|
|
|||
|
|
@ -2,9 +2,15 @@
|
|||
<textarea ref="text" onkeypress={ onkeypress } onpaste={ onpaste } placeholder="ここにメッセージを入力"></textarea>
|
||||
<div class="files"></div>
|
||||
<mk-uploader ref="uploader"></mk-uploader>
|
||||
<button class="send" onclick={ send } disabled={ sending } title="メッセージを送信"><i class="fa fa-paper-plane" if={ !sending }></i><i class="fa fa-spinner fa-spin" if={ sending }></i></button>
|
||||
<button class="attach-from-local" type="button" title="PCから画像を添付する"><i class="fa fa-upload"></i></button>
|
||||
<button class="attach-from-drive" type="button" title="アルバムから画像を添付する"><i class="fa fa-folder-open"></i></button>
|
||||
<button class="send" onclick={ send } disabled={ sending } title="メッセージを送信">
|
||||
<i class="fa fa-paper-plane" if={ !sending }></i><i class="fa fa-spinner fa-spin" if={ sending }></i>
|
||||
</button>
|
||||
<button class="attach-from-local" type="button" title="PCから画像を添付する">
|
||||
<i class="fa fa-upload"></i>
|
||||
</button>
|
||||
<button class="attach-from-drive" type="button" title="アルバムから画像を添付する">
|
||||
<i class="fa fa-folder-open"></i>
|
||||
</button>
|
||||
<input name="file" type="file" accept="image/*"/>
|
||||
<style>
|
||||
:scope
|
||||
|
|
@ -111,49 +117,56 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
this.mixin('api');
|
||||
|
||||
@onpaste = (e) ~>
|
||||
data = e.clipboard-data
|
||||
items = data.items
|
||||
for i from 0 to items.length - 1
|
||||
item = items[i]
|
||||
switch (item.kind)
|
||||
| \file =>
|
||||
@upload item.get-as-file!
|
||||
onpaste(e) {
|
||||
const data = e.clipboardData;
|
||||
const items = data.items;
|
||||
for (let i = 0; i < items.length; i++) {
|
||||
const item = items[i];
|
||||
if (item.kind == 'file') {
|
||||
this.upload(item.getAsFile());
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@onkeypress = (e) ~>
|
||||
if (e.which == 10 || e.which == 13) && e.ctrl-key
|
||||
@send!
|
||||
onkeypress(e) {
|
||||
if ((e.which == 10 || e.which == 13) && e.ctrlKey) {
|
||||
this.send();
|
||||
}
|
||||
}
|
||||
|
||||
@select-file = ~>
|
||||
@refs.file.click!
|
||||
selectFile() {
|
||||
this.refs.file.click();
|
||||
}
|
||||
|
||||
@select-file-from-drive = ~>
|
||||
browser = document.body.append-child document.create-element \mk-select-file-from-drive-window
|
||||
event = riot.observable!
|
||||
riot.mount browser, do
|
||||
multiple: true
|
||||
selectFileFromDrive() {
|
||||
const browser = document.body.appendChild(document.createElement('mk-select-file-from-drive-window'));
|
||||
const event = riot.observable();
|
||||
riot.mount(browser, {
|
||||
multiple: true,
|
||||
event: event
|
||||
event.one \selected (files) ~>
|
||||
files.for-each @add-file
|
||||
});
|
||||
event.one('selected', files => {
|
||||
files.forEach(this.addFile);
|
||||
});
|
||||
|
||||
@send = ~>
|
||||
@sending = true
|
||||
@api \messaging/messages/create do
|
||||
user_id: @opts.user.id
|
||||
text: @refs.text.value
|
||||
.then (message) ~>
|
||||
send() {
|
||||
this.sending = true
|
||||
this.api 'messaging/messages/create' do
|
||||
user_id: this.opts.user.id
|
||||
text: this.refs.text.value
|
||||
.then (message) =>
|
||||
@clear!
|
||||
.catch (err) ~>
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
.then ~>
|
||||
@sending = false
|
||||
@update!
|
||||
.then =>
|
||||
this.sending = false
|
||||
this.update();
|
||||
|
||||
@clear = ~>
|
||||
@refs.text.value = ''
|
||||
@files = []
|
||||
@update!
|
||||
clear() {
|
||||
this.refs.text.value = ''
|
||||
this.files = []
|
||||
this.update();
|
||||
</script>
|
||||
</mk-messaging-form>
|
||||
|
|
|
|||
|
|
@ -286,72 +286,72 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
@mixin \api
|
||||
this.mixin('i');
|
||||
this.mixin('api');
|
||||
|
||||
@search-result = []
|
||||
this.search-result = []
|
||||
|
||||
@on \mount ~>
|
||||
@api \messaging/history
|
||||
.then (history) ~>
|
||||
@is-loading = false
|
||||
history.for-each (message) ~>
|
||||
this.on('mount', () => {
|
||||
this.api 'messaging/history'
|
||||
.then (history) =>
|
||||
this.is-loading = false
|
||||
history.for-each (message) =>
|
||||
message.is_me = message.user_id == @I.id
|
||||
message._click = ~>
|
||||
message._click = =>
|
||||
if message.is_me
|
||||
@trigger \navigate-user message.recipient
|
||||
this.trigger 'navigate-user' message.recipient
|
||||
else
|
||||
@trigger \navigate-user message.user
|
||||
@history = history
|
||||
@update!
|
||||
.catch (err) ~>
|
||||
this.trigger 'navigate-user' message.user
|
||||
this.history = history
|
||||
this.update();
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
|
||||
@search = ~>
|
||||
q = @refs.search.value
|
||||
search() {
|
||||
q = this.refs.search.value
|
||||
if q == ''
|
||||
@search-result = []
|
||||
this.search-result = []
|
||||
else
|
||||
@api \users/search do
|
||||
this.api 'users/search' do
|
||||
query: q
|
||||
max: 5
|
||||
.then (users) ~>
|
||||
users.for-each (user) ~>
|
||||
user._click = ~>
|
||||
@trigger \navigate-user user
|
||||
@search-result = []
|
||||
@search-result = users
|
||||
@update!
|
||||
.catch (err) ~>
|
||||
.then (users) =>
|
||||
users.for-each (user) =>
|
||||
user._click = =>
|
||||
this.trigger 'navigate-user' user
|
||||
this.search-result = []
|
||||
this.search-result = users
|
||||
this.update();
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
|
||||
@on-search-keydown = (e) ~>
|
||||
on-search-keydown(e) {
|
||||
key = e.which
|
||||
switch (key)
|
||||
| 9, 40 => # Key[TAB] or Key[↓]
|
||||
| 9, 40 => // Key[TAB] or Key[↓]
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
@refs.search-result.child-nodes[0].focus!
|
||||
this.refs.search-result.child-nodes[0].focus();
|
||||
|
||||
@on-search-result-keydown = (i, e) ~>
|
||||
on-search-result-keydown(i, e) {
|
||||
key = e.which
|
||||
switch (key)
|
||||
| 10, 13 => # Key[ENTER]
|
||||
| 10, 13 => // Key[ENTER]
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
@search-result[i]._click!
|
||||
| 27 => # Key[ESC]
|
||||
| 27 => // Key[ESC]
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
@refs.search.focus!
|
||||
| 38 => # Key[↑]
|
||||
this.refs.search.focus();
|
||||
| 38 => // Key[↑]
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
(@refs.search-result.child-nodes[i].previous-element-sibling || @refs.search-result.child-nodes[@search-result.length - 1]).focus!
|
||||
| 9, 40 => # Key[TAB] or Key[↓]
|
||||
(this.refs.search-result.child-nodes[i].previous-element-sibling || this.refs.search-result.child-nodes[@search-result.length - 1]).focus();
|
||||
| 9, 40 => // Key[TAB] or Key[↓]
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
(@refs.search-result.child-nodes[i].next-element-sibling || @refs.search-result.child-nodes[0]).focus!
|
||||
(this.refs.search-result.child-nodes[i].next-element-sibling || this.refs.search-result.child-nodes[0]).focus();
|
||||
|
||||
</script>
|
||||
</mk-messaging>
|
||||
|
|
|
|||
|
|
@ -203,27 +203,27 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
@mixin \text
|
||||
this.mixin('i');
|
||||
this.mixin('text');
|
||||
|
||||
@message = @opts.message
|
||||
this.message = this.opts.message
|
||||
@message.is_me = @message.user.id == @I.id
|
||||
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
if @message.text?
|
||||
tokens = @analyze @message.text
|
||||
|
||||
@refs.text.innerHTML = @compile tokens
|
||||
this.refs.text.innerHTML = @compile tokens
|
||||
|
||||
@refs.text.children.for-each (e) ~>
|
||||
if e.tag-name == \MK-URL
|
||||
this.refs.text.children.for-each (e) =>
|
||||
if e.tag-name == 'MK-URL'
|
||||
riot.mount e
|
||||
|
||||
# URLをプレビュー
|
||||
// URLをプレビュー
|
||||
tokens
|
||||
.filter (t) -> t.type == \link
|
||||
.map (t) ~>
|
||||
@preview = @refs.text.append-child document.create-element \mk-url-preview
|
||||
.filter (t) -> t.type == 'link'
|
||||
.map (t) =>
|
||||
this.preview = this.refs.text.appendChild document.createElement 'mk-url-preview'
|
||||
riot.mount @preview, do
|
||||
url: t.content
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -124,101 +124,101 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
@mixin \api
|
||||
@mixin \messaging-stream
|
||||
this.mixin('i');
|
||||
this.mixin('api');
|
||||
this.mixin('messaging-stream');
|
||||
|
||||
@user = @opts.user
|
||||
@init = true
|
||||
@sending = false
|
||||
@messages = []
|
||||
this.user = this.opts.user
|
||||
this.init = true
|
||||
this.sending = false
|
||||
this.messages = []
|
||||
|
||||
@connection = new @MessagingStreamConnection @I, @user.id
|
||||
this.connection = new @MessagingStreamConnection @I, @user.id
|
||||
|
||||
@on \mount ~>
|
||||
@connection.event.on \message @on-message
|
||||
@connection.event.on \read @on-read
|
||||
this.on('mount', () => {
|
||||
@connection.event.on 'message' this.on-message
|
||||
@connection.event.on 'read' this.on-read
|
||||
|
||||
document.add-event-listener \visibilitychange @on-visibilitychange
|
||||
document.add-event-listener 'visibilitychange' this.on-visibilitychange
|
||||
|
||||
@api \messaging/messages do
|
||||
this.api 'messaging/messages' do
|
||||
user_id: @user.id
|
||||
.then (messages) ~>
|
||||
@init = false
|
||||
@messages = messages.reverse!
|
||||
@update!
|
||||
.then (messages) =>
|
||||
this.init = false
|
||||
this.messages = messages.reverse!
|
||||
this.update();
|
||||
@scroll-to-bottom!
|
||||
.catch (err) ~>
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
|
||||
@on \unmount ~>
|
||||
@connection.event.off \message @on-message
|
||||
@connection.event.off \read @on-read
|
||||
this.on('unmount', () => {
|
||||
@connection.event.off 'message' this.on-message
|
||||
@connection.event.off 'read' this.on-read
|
||||
@connection.close!
|
||||
|
||||
document.remove-event-listener \visibilitychange @on-visibilitychange
|
||||
document.remove-event-listener 'visibilitychange' this.on-visibilitychange
|
||||
|
||||
@on \update ~>
|
||||
@messages.for-each (message) ~>
|
||||
this.on('update', () => {
|
||||
@messages.for-each (message) =>
|
||||
date = (new Date message.created_at).get-date!
|
||||
month = (new Date message.created_at).get-month! + 1
|
||||
message._date = date
|
||||
message._datetext = month + '月 ' + date + '日'
|
||||
|
||||
@on-message = (message) ~>
|
||||
on-message(message) {
|
||||
is-bottom = @is-bottom!
|
||||
|
||||
@messages.push message
|
||||
if message.user_id != @I.id and not document.hidden
|
||||
@connection.socket.send JSON.stringify do
|
||||
type: \read
|
||||
type: 'read'
|
||||
id: message.id
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
if is-bottom
|
||||
# Scroll to bottom
|
||||
// Scroll to bottom
|
||||
@scroll-to-bottom!
|
||||
else if message.user_id != @I.id
|
||||
# Notify
|
||||
// Notify
|
||||
@notify '新しいメッセージがあります'
|
||||
|
||||
@on-read = (ids) ~>
|
||||
on-read(ids) {
|
||||
if not Array.isArray ids then ids = [ids]
|
||||
ids.for-each (id) ~>
|
||||
if (@messages.some (x) ~> x.id == id)
|
||||
ids.for-each (id) =>
|
||||
if (@messages.some (x) => x.id == id)
|
||||
exist = (@messages.map (x) -> x.id).index-of id
|
||||
@messages[exist].is_read = true
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
@is-bottom = ~>
|
||||
current = @root.scroll-top + @root.offset-height
|
||||
max = @root.scroll-height
|
||||
is-bottom() {
|
||||
current = this.root.scroll-top + this.root.offset-height
|
||||
max = this.root.scroll-height
|
||||
current > (max - 32)
|
||||
|
||||
@scroll-to-bottom = ~>
|
||||
@root.scroll-top = @root.scroll-height
|
||||
scroll-to-bottom() {
|
||||
this.root.scroll-top = this.root.scroll-height
|
||||
|
||||
@notify = (message) ~>
|
||||
n = document.create-element \p
|
||||
notify(message) {
|
||||
n = document.createElement 'p'
|
||||
n.inner-HTML = '<i class="fa fa-arrow-circle-down"></i>' + message
|
||||
n.onclick = ~>
|
||||
n.onclick = =>
|
||||
@scroll-to-bottom!
|
||||
n.parent-node.remove-child n
|
||||
@refs.notifications.append-child n
|
||||
this.refs.notifications.appendChild n
|
||||
|
||||
set-timeout ~>
|
||||
setTimeout =>
|
||||
n.style.opacity = 0
|
||||
set-timeout ~>
|
||||
setTimeout =>
|
||||
n.parent-node.remove-child n
|
||||
, 1000ms
|
||||
, 4000ms
|
||||
|
||||
@on-visibilitychange = ~>
|
||||
on-visibilitychange() {
|
||||
if document.hidden then return
|
||||
@messages.for-each (message) ~>
|
||||
@messages.for-each (message) =>
|
||||
if message.user_id != @I.id and not message.is_read
|
||||
@connection.socket.send JSON.stringify do
|
||||
type: \read
|
||||
type: 'read'
|
||||
id: message.id
|
||||
</script>
|
||||
</mk-messaging-room>
|
||||
|
|
|
|||
|
|
@ -5,14 +5,14 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@on \mount ~>
|
||||
# バグ？ https://github.com/riot/riot/issues/2103
|
||||
#value = @opts.value
|
||||
value = @opts.riot-value
|
||||
max = @opts.max
|
||||
this.on('mount', () => {
|
||||
// バグ？ https://github.com/riot/riot/issues/2103
|
||||
#value = this.opts.value
|
||||
value = this.opts.riot-value
|
||||
max = this.opts.max
|
||||
|
||||
if max? then if value > max then value = max
|
||||
|
||||
@root.innerHTML = value.to-locale-string!
|
||||
this.root.innerHTML = value.to-locale-string!
|
||||
</script>
|
||||
</mk-number>
|
||||
|
|
|
|||
|
|
@ -86,24 +86,24 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@choices = ['', '']
|
||||
this.choices = ['', '']
|
||||
|
||||
@oninput = (i, e) ~>
|
||||
oninput(i, e) {
|
||||
@choices[i] = e.target.value
|
||||
|
||||
@add = ~>
|
||||
add() {
|
||||
@choices.push ''
|
||||
@update!
|
||||
@refs.choices.child-nodes[@choices.length - 1].child-nodes[0].focus!
|
||||
this.update();
|
||||
this.refs.choices.child-nodes[@choices.length - 1].child-nodes[0].focus();
|
||||
|
||||
@remove = (i) ~>
|
||||
@choices = @choices.filter((_, _i) -> _i != i)
|
||||
@update!
|
||||
remove(i) {
|
||||
this.choices = @choices.filter((_, _i) -> _i != i)
|
||||
this.update();
|
||||
|
||||
@destroy = ~>
|
||||
@opts.ondestroy!
|
||||
destroy() {
|
||||
this.opts.ondestroy!
|
||||
|
||||
@get = ~>
|
||||
get() {
|
||||
return {
|
||||
choices: @choices.filter (choice) -> choice != ''
|
||||
}
|
||||
|
|
|
|||
|
|
@ -68,23 +68,23 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
this.mixin('api');
|
||||
|
||||
@post = @opts.post
|
||||
@poll = @post.poll
|
||||
@total = @poll.choices.reduce ((a, b) -> a + b.votes), 0
|
||||
@is-voted = @poll.choices.some (c) -> c.is_voted
|
||||
@result = @is-voted
|
||||
this.post = this.opts.post
|
||||
this.poll = @post.poll
|
||||
this.total = @poll.choices.reduce ((a, b) -> a + b.votes), 0
|
||||
this.is-voted = @poll.choices.some (c) -> c.is_voted
|
||||
this.result = @is-voted
|
||||
|
||||
@toggle-result = ~>
|
||||
@result = !@result
|
||||
toggle-result() {
|
||||
this.result = !@result
|
||||
|
||||
@vote = (id) ~>
|
||||
vote(id) {
|
||||
if (@poll.choices.some (c) -> c.is_voted) then return
|
||||
@api \posts/polls/vote do
|
||||
this.api 'posts/polls/vote' do
|
||||
post_id: @post.id
|
||||
choice: id
|
||||
.then ~>
|
||||
.then =>
|
||||
@poll.choices.for-each (c) ->
|
||||
if c.id == id
|
||||
c.votes++
|
||||
|
|
|
|||
|
|
@ -4,5 +4,5 @@
|
|||
display inline
|
||||
|
||||
</style>
|
||||
<script>@root.innerHTML = @opts.content</script>
|
||||
<script>this.root.innerHTML = this.opts.content</script>
|
||||
</mk-raw>
|
||||
|
|
|
|||
|
|
@ -14,13 +14,13 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@on \mount ~>
|
||||
text = @root.innerHTML
|
||||
@root.innerHTML = ''
|
||||
(text.split '').for-each (c, i) ~>
|
||||
ce = document.create-element \span
|
||||
this.on('mount', () => {
|
||||
text = this.root.innerHTML
|
||||
this.root.innerHTML = ''
|
||||
(text.split '').for-each (c, i) =>
|
||||
ce = document.createElement 'span'
|
||||
ce.innerHTML = c
|
||||
ce.style.animation-delay = (i / 10) + 's'
|
||||
@root.append-child ce
|
||||
ce.style.animationDelay = (i / 10) + 's'
|
||||
this.root.appendChild ce
|
||||
</script>
|
||||
</mk-ripple-string>
|
||||
|
|
|
|||
|
|
@ -48,28 +48,28 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \stream
|
||||
this.mixin('api');
|
||||
this.mixin('stream');
|
||||
|
||||
@history = []
|
||||
@fetching = true
|
||||
this.history = []
|
||||
this.fetching = true
|
||||
|
||||
@on \mount ~>
|
||||
@api \i/signin_history
|
||||
.then (history) ~>
|
||||
@history = history
|
||||
@fetching = false
|
||||
@update!
|
||||
.catch (err) ~>
|
||||
this.on('mount', () => {
|
||||
this.api 'i/signin_history'
|
||||
.then (history) =>
|
||||
this.history = history
|
||||
this.fetching = false
|
||||
this.update();
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
|
||||
@stream.on \signin @on-signin
|
||||
@stream.on 'signin' this.on-signin
|
||||
|
||||
@on \unmount ~>
|
||||
@stream.off \signin @on-signin
|
||||
this.on('unmount', () => {
|
||||
@stream.off 'signin' this.on-signin
|
||||
|
||||
@on-signin = (signin) ~>
|
||||
on-signin(signin) {
|
||||
@history.unshift signin
|
||||
@update!
|
||||
this.update();
|
||||
</script>
|
||||
</mk-signin-history>
|
||||
|
|
|
|||
|
|
@ -97,41 +97,41 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
this.mixin('api');
|
||||
|
||||
@user = null
|
||||
@signing = false
|
||||
this.user = null
|
||||
this.signing = false
|
||||
|
||||
@oninput = ~>
|
||||
@api \users/show do
|
||||
username: @refs.username.value
|
||||
.then (user) ~>
|
||||
@user = user
|
||||
@trigger \user user
|
||||
@update!
|
||||
oninput() {
|
||||
this.api 'users/show' do
|
||||
username: this.refs.username.value
|
||||
.then (user) =>
|
||||
this.user = user
|
||||
this.trigger 'user' user
|
||||
this.update();
|
||||
|
||||
@onsubmit = (e) ~>
|
||||
onsubmit(e) {
|
||||
e.prevent-default!
|
||||
|
||||
if @refs.username.value == ''
|
||||
@refs.username.focus!
|
||||
if this.refs.username.value == ''
|
||||
this.refs.username.focus();
|
||||
return false
|
||||
if @refs.password.value == ''
|
||||
@refs.password.focus!
|
||||
if this.refs.password.value == ''
|
||||
this.refs.password.focus();
|
||||
return false
|
||||
|
||||
@signing = true
|
||||
@update!
|
||||
this.signing = true
|
||||
this.update();
|
||||
|
||||
@api \signin do
|
||||
username: @refs.username.value
|
||||
password: @refs.password.value
|
||||
.then ~>
|
||||
this.api 'signin' do
|
||||
username: this.refs.username.value
|
||||
password: this.refs.password.value
|
||||
.then =>
|
||||
location.reload!
|
||||
.catch ~>
|
||||
.catch =>
|
||||
alert 'something happened'
|
||||
@signing = false
|
||||
@update!
|
||||
this.signing = false
|
||||
this.update();
|
||||
|
||||
false
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -174,117 +174,117 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \get-password-strength
|
||||
this.mixin('api');
|
||||
this.mixin('get-password-strength');
|
||||
|
||||
@username-state = null
|
||||
@password-strength = ''
|
||||
@password-retype-state = null
|
||||
@recaptchaed = false
|
||||
this.username-state = null
|
||||
this.password-strength = ''
|
||||
this.password-retype-state = null
|
||||
this.recaptchaed = false
|
||||
|
||||
window.on-recaptchaed = ~>
|
||||
@recaptchaed = true
|
||||
@update!
|
||||
window.on-recaptchaed = =>
|
||||
this.recaptchaed = true
|
||||
this.update();
|
||||
|
||||
window.on-recaptcha-expired = ~>
|
||||
@recaptchaed = false
|
||||
@update!
|
||||
window.on-recaptcha-expired = =>
|
||||
this.recaptchaed = false
|
||||
this.update();
|
||||
|
||||
@on \mount ~>
|
||||
head = (document.get-elements-by-tag-name \head).0
|
||||
script = document.create-element \script
|
||||
..set-attribute \src \https://www.google.com/recaptcha/api.js
|
||||
head.append-child script
|
||||
this.on('mount', () => {
|
||||
head = (document.get-elements-by-tag-name 'head).0'
|
||||
script = document.createElement 'script'
|
||||
..set-attribute 'src' \https://www.google.com/recaptcha/api.js
|
||||
head.appendChild script
|
||||
|
||||
@on-change-username = ~>
|
||||
username = @refs.username.value
|
||||
on-change-username() {
|
||||
username = this.refs.username.value
|
||||
|
||||
if username == ''
|
||||
@username-state = null
|
||||
@update!
|
||||
this.username-state = null
|
||||
this.update();
|
||||
return
|
||||
|
||||
err = switch
|
||||
| not username.match /^[a-zA-Z0-9\-]+$/ => \invalid-format
|
||||
| username.length < 3chars => \min-range
|
||||
| username.length > 20chars => \max-range
|
||||
| not username.match /^[a-zA-Z0-9\-]+$/ => 'invalid-format'
|
||||
| username.length < 3chars => 'min-range'
|
||||
| username.length > 20chars => 'max-range'
|
||||
| _ => null
|
||||
|
||||
if err?
|
||||
@username-state = err
|
||||
@update!
|
||||
this.username-state = err
|
||||
this.update();
|
||||
else
|
||||
@username-state = \wait
|
||||
@update!
|
||||
this.username-state = 'wait'
|
||||
this.update();
|
||||
|
||||
@api \username/available do
|
||||
this.api 'username/available' do
|
||||
username: username
|
||||
.then (result) ~>
|
||||
.then (result) =>
|
||||
if result.available
|
||||
@username-state = \ok
|
||||
this.username-state = 'ok'
|
||||
else
|
||||
@username-state = \unavailable
|
||||
@update!
|
||||
.catch (err) ~>
|
||||
@username-state = \error
|
||||
@update!
|
||||
this.username-state = 'unavailable'
|
||||
this.update();
|
||||
.catch (err) =>
|
||||
this.username-state = 'error'
|
||||
this.update();
|
||||
|
||||
@on-change-password = ~>
|
||||
password = @refs.password.value
|
||||
on-change-password() {
|
||||
password = this.refs.password.value
|
||||
|
||||
if password == ''
|
||||
@password-strength = ''
|
||||
this.password-strength = ''
|
||||
return
|
||||
|
||||
strength = @get-password-strength password
|
||||
|
||||
if strength > 0.3
|
||||
@password-strength = \medium
|
||||
this.password-strength = 'medium'
|
||||
if strength > 0.7
|
||||
@password-strength = \high
|
||||
this.password-strength = 'high'
|
||||
else
|
||||
@password-strength = \low
|
||||
this.password-strength = 'low'
|
||||
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
@refs.password-metar.style.width = (strength * 100) + \%
|
||||
this.refs.password-metar.style.width = (strength * 100) + '%'
|
||||
|
||||
@on-change-password-retype = ~>
|
||||
password = @refs.password.value
|
||||
retyped-password = @refs.password-retype.value
|
||||
on-change-password-retype() {
|
||||
password = this.refs.password.value
|
||||
retyped-password = this.refs.password-retype.value
|
||||
|
||||
if retyped-password == ''
|
||||
@password-retype-state = null
|
||||
this.password-retype-state = null
|
||||
return
|
||||
|
||||
if password == retyped-password
|
||||
@password-retype-state = \match
|
||||
this.password-retype-state = 'match'
|
||||
else
|
||||
@password-retype-state = \not-match
|
||||
this.password-retype-state = 'not-match'
|
||||
|
||||
@onsubmit = (e) ~>
|
||||
onsubmit(e) {
|
||||
e.prevent-default!
|
||||
|
||||
username = @refs.username.value
|
||||
password = @refs.password.value
|
||||
username = this.refs.username.value
|
||||
password = this.refs.password.value
|
||||
|
||||
locker = document.body.append-child document.create-element \mk-locker
|
||||
locker = document.body.appendChild document.createElement 'mk-locker'
|
||||
|
||||
@api \signup do
|
||||
this.api 'signup' do
|
||||
username: username
|
||||
password: password
|
||||
'g-recaptcha-response': grecaptcha.get-response!
|
||||
.then ~>
|
||||
@api \signin do
|
||||
.then =>
|
||||
this.api 'signin' do
|
||||
username: username
|
||||
password: password
|
||||
.then ~>
|
||||
.then =>
|
||||
location.href = CONFIG.url
|
||||
.catch ~>
|
||||
.catch =>
|
||||
alert '何らかの原因によりアカウントの作成に失敗しました。再度お試しください。'
|
||||
|
||||
grecaptcha.reset!
|
||||
@recaptchaed = false
|
||||
this.recaptchaed = false
|
||||
|
||||
locker.parent-node.remove-child locker
|
||||
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
</style>
|
||||
<script>
|
||||
now = new Date!
|
||||
@d = now.get-date!
|
||||
@m = now.get-month! + 1
|
||||
this.d = now.get-date!
|
||||
this.m = now.get-month! + 1
|
||||
</script>
|
||||
</mk-special-message>
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<mk-time>
|
||||
<time datetime={ opts.time }><span if={ mode == 'relative' }>{ relative }</span><span if={ mode == 'absolute' }>{ absolute }</span><span if={ mode == 'detail' }>{ absolute } ({ relative })</span></time>
|
||||
<script>
|
||||
@time = new Date @opts.time
|
||||
@mode = @opts.mode || \relative
|
||||
@tickid = null
|
||||
this.time = new Date this.opts.time
|
||||
this.mode = this.opts.mode || 'relative'
|
||||
this.tickid = null
|
||||
|
||||
@absolute =
|
||||
@time.get-full-year! + \年 +
|
||||
@time.get-month! + 1 + \月 +
|
||||
@time.get-date! + \日 +
|
||||
this.absolute =
|
||||
@time.get-full-year! + '年' +
|
||||
@time.get-month! + 1 + '月' +
|
||||
@time.get-date! + '日' +
|
||||
' ' +
|
||||
@time.get-hours! + \時 +
|
||||
@time.get-minutes! + \分
|
||||
@time.get-hours! + '時' +
|
||||
@time.get-minutes! + '分'
|
||||
|
||||
@on \mount ~>
|
||||
if @mode == \relative or @mode == \detail
|
||||
this.on('mount', () => {
|
||||
if @mode == 'relative' or @mode == 'detail'
|
||||
@tick!
|
||||
@tickid = set-interval @tick, 1000ms
|
||||
this.tickid = set-interval @tick, 1000ms
|
||||
|
||||
@on \unmount ~>
|
||||
if @mode == \relative or @mode == \detail
|
||||
this.on('unmount', () => {
|
||||
if @mode == 'relative' or @mode == 'detail'
|
||||
clear-interval @tickid
|
||||
|
||||
@tick = ~>
|
||||
tick() {
|
||||
now = new Date!
|
||||
ago = (now - @time) / 1000ms
|
||||
@relative = switch
|
||||
this.relative = switch
|
||||
| ago >= 31536000s => ~~(ago / 31536000s) + '年前'
|
||||
| ago >= 2592000s => ~~(ago / 2592000s) + 'ヶ月前'
|
||||
| ago >= 604800s => ~~(ago / 604800s) + '週間前'
|
||||
|
|
@ -36,6 +36,6 @@
|
|||
| ago >= 0s => 'たった今'
|
||||
| ago < 0s => '未来'
|
||||
| _ => 'なぞのじかん'
|
||||
@update!
|
||||
this.update();
|
||||
</script>
|
||||
</mk-time>
|
||||
|
|
|
|||
|
|
@ -24,6 +24,6 @@
|
|||
color #8899a6
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
this.mixin('i');
|
||||
</script>
|
||||
</mk-twitter-setting>
|
||||
|
|
|
|||
|
|
@ -140,55 +140,55 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
this.mixin('i');
|
||||
|
||||
@uploads = []
|
||||
this.uploads = []
|
||||
|
||||
|
||||
@upload = (file, folder) ~>
|
||||
upload(file, folder) {
|
||||
id = Math.random!
|
||||
|
||||
ctx =
|
||||
id: id
|
||||
name: file.name || \untitled
|
||||
name: file.name || 'untitled'
|
||||
progress: undefined
|
||||
|
||||
@uploads.push ctx
|
||||
@trigger \change-uploads @uploads
|
||||
@update!
|
||||
this.trigger 'change-uploads' @uploads
|
||||
this.update();
|
||||
|
||||
reader = new FileReader!
|
||||
reader.onload = (e) ~>
|
||||
reader.onload = (e) =>
|
||||
ctx.img = e.target.result
|
||||
@update!
|
||||
this.update();
|
||||
reader.read-as-data-URL file
|
||||
|
||||
data = new FormData!
|
||||
data.append \i @I.token
|
||||
data.append \file file
|
||||
data.append 'i' @I.token
|
||||
data.append 'file' file
|
||||
|
||||
if folder?
|
||||
data.append \folder_id folder
|
||||
data.append 'folder_id' folder
|
||||
|
||||
xhr = new XMLHttpRequest!
|
||||
xhr.open \POST CONFIG.apiUrl + '/drive/files/create' true
|
||||
xhr.onload = (e) ~>
|
||||
xhr.open 'POST' CONFIG.apiUrl + '/drive/files/create' true
|
||||
xhr.onload = (e) =>
|
||||
drive-file = JSON.parse e.target.response
|
||||
|
||||
@trigger \uploaded drive-file
|
||||
this.trigger 'uploaded' drive-file
|
||||
|
||||
@uploads = @uploads.filter (x) -> x.id != id
|
||||
@trigger \change-uploads @uploads
|
||||
this.uploads = @uploads.filter (x) -> x.id != id
|
||||
this.trigger 'change-uploads' @uploads
|
||||
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
xhr.upload.onprogress = (e) ~>
|
||||
xhr.upload.onprogress = (e) =>
|
||||
if e.length-computable
|
||||
if ctx.progress == undefined
|
||||
ctx.progress = {}
|
||||
ctx.progress.max = e.total
|
||||
ctx.progress.value = e.loaded
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
xhr.send data
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -91,22 +91,22 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
this.mixin('api');
|
||||
|
||||
@url = @opts.url
|
||||
@loading = true
|
||||
this.url = this.opts.url
|
||||
this.loading = true
|
||||
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
fetch CONFIG.url + '/api:url?url=' + @url
|
||||
.then (res) ~>
|
||||
.then (res) =>
|
||||
info <~ res.json!.then
|
||||
@title = info.title
|
||||
@description = info.description
|
||||
@thumbnail = info.thumbnail
|
||||
@icon = info.icon
|
||||
@sitename = info.sitename
|
||||
this.title = info.title
|
||||
this.description = info.description
|
||||
this.thumbnail = info.thumbnail
|
||||
this.icon = info.icon
|
||||
this.sitename = info.sitename
|
||||
|
||||
@loading = false
|
||||
@update!
|
||||
this.loading = false
|
||||
this.update();
|
||||
</script>
|
||||
</mk-url-preview>
|
||||
|
|
|
|||
|
|
@ -30,19 +30,19 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@url = @opts.href
|
||||
this.url = this.opts.href
|
||||
|
||||
@on \before-mount ~>
|
||||
parser = document.create-element \a
|
||||
this.on('before-mount', () => {
|
||||
parser = document.createElement 'a'
|
||||
parser.href = @url
|
||||
|
||||
@schema = parser.protocol
|
||||
@hostname = parser.hostname
|
||||
@port = parser.port
|
||||
@pathname = parser.pathname
|
||||
@query = parser.search
|
||||
@hash = parser.hash
|
||||
this.schema = parser.protocol
|
||||
this.hostname = parser.hostname
|
||||
this.port = parser.port
|
||||
this.pathname = parser.pathname
|
||||
this.query = parser.search
|
||||
this.hash = parser.hash
|
||||
|
||||
@update!
|
||||
this.update();
|
||||
</script>
|
||||
</mk-url>
|
||||
|
|
|
|||
|
|
@ -9,29 +9,29 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
@draw!
|
||||
@clock = set-interval @draw, 1000ms
|
||||
this.clock = set-interval @draw, 1000ms
|
||||
|
||||
@on \unmount ~>
|
||||
this.on('unmount', () => {
|
||||
clear-interval @clock
|
||||
|
||||
@draw = ~>
|
||||
draw() {
|
||||
now = new Date!
|
||||
s = now.get-seconds!
|
||||
m = now.get-minutes!
|
||||
h = now.get-hours!
|
||||
|
||||
vec2 = (x, y) ->
|
||||
@x = x
|
||||
@y = y
|
||||
this.x = x
|
||||
this.y = y
|
||||
|
||||
ctx = @refs.canvas.get-context \2d
|
||||
canv-w = @refs.canvas.width
|
||||
canv-h = @refs.canvas.height
|
||||
ctx = this.refs.canvas.get-context '2d'
|
||||
canv-w = this.refs.canvas.width
|
||||
canv-h = this.refs.canvas.height
|
||||
ctx.clear-rect 0, 0, canv-w, canv-h
|
||||
|
||||
# 背景
|
||||
// 背景
|
||||
center = (Math.min (canv-w / 2), (canv-h / 2))
|
||||
line-start = center * 0.90
|
||||
line-end-short = center * 0.87
|
||||
|
|
@ -56,12 +56,12 @@
|
|||
(canv-h / 2) + uv.y * line-end-short
|
||||
ctx.stroke!
|
||||
|
||||
# 分
|
||||
// 分
|
||||
angle = Math.PI * (m + s / 60) / 30
|
||||
length = (Math.min canv-w, canv-h) / 2.6
|
||||
uv = new vec2 (Math.sin angle), (-Math.cos angle)
|
||||
ctx.begin-path!
|
||||
ctx.stroke-style = \#ffffff
|
||||
ctx.stroke-style = '#ffffff'
|
||||
ctx.line-width = 2
|
||||
ctx.move-to do
|
||||
(canv-w / 2) - uv.x * length / 5
|
||||
|
|
@ -71,12 +71,12 @@
|
|||
(canv-h / 2) + uv.y * length
|
||||
ctx.stroke!
|
||||
|
||||
# 時
|
||||
// 時
|
||||
angle = Math.PI * (h % 12 + m / 60) / 6
|
||||
length = (Math.min canv-w, canv-h) / 4
|
||||
uv = new vec2 (Math.sin angle), (-Math.cos angle)
|
||||
ctx.begin-path!
|
||||
#ctx.stroke-style = \#ffffff
|
||||
#ctx.stroke-style = '#ffffff'
|
||||
ctx.stroke-style = CONFIG.theme-color
|
||||
ctx.line-width = 2
|
||||
ctx.move-to do
|
||||
|
|
@ -87,7 +87,7 @@
|
|||
(canv-h / 2) + uv.y * length
|
||||
ctx.stroke!
|
||||
|
||||
# 秒
|
||||
// 秒
|
||||
angle = Math.PI * s / 30
|
||||
length = (Math.min canv-w, canv-h) / 2.6
|
||||
uv = new vec2 (Math.sin angle), (-Math.cos angle)
|
||||
|
|
|
|||
|
|
@ -80,101 +80,101 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
this.mixin('api');
|
||||
|
||||
@q = @opts.q
|
||||
@textarea = @opts.textarea
|
||||
@loading = true
|
||||
@users = []
|
||||
@select = -1
|
||||
this.q = this.opts.q
|
||||
this.textarea = this.opts.textarea
|
||||
this.loading = true
|
||||
this.users = []
|
||||
this.select = -1
|
||||
|
||||
@on \mount ~>
|
||||
@textarea.add-event-listener \keydown @on-keydown
|
||||
this.on('mount', () => {
|
||||
@textarea.add-event-listener 'keydown' this.on-keydown
|
||||
|
||||
all = document.query-selector-all 'body *'
|
||||
Array.prototype.for-each.call all, (el) ~>
|
||||
el.add-event-listener \mousedown @mousedown
|
||||
Array.prototype.for-each.call all, (el) =>
|
||||
el.add-event-listener 'mousedown' @mousedown
|
||||
|
||||
@api \users/search_by_username do
|
||||
this.api 'users/search_by_username' do
|
||||
query: @q
|
||||
limit: 30users
|
||||
.then (users) ~>
|
||||
@users = users
|
||||
@loading = false
|
||||
@update!
|
||||
.catch (err) ~>
|
||||
.then (users) =>
|
||||
this.users = users
|
||||
this.loading = false
|
||||
this.update();
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
|
||||
@on \unmount ~>
|
||||
@textarea.remove-event-listener \keydown @on-keydown
|
||||
this.on('unmount', () => {
|
||||
@textarea.remove-event-listener 'keydown' this.on-keydown
|
||||
|
||||
all = document.query-selector-all 'body *'
|
||||
Array.prototype.for-each.call all, (el) ~>
|
||||
el.remove-event-listener \mousedown @mousedown
|
||||
Array.prototype.for-each.call all, (el) =>
|
||||
el.remove-event-listener 'mousedown' @mousedown
|
||||
|
||||
@mousedown = (e) ~>
|
||||
if (!contains @root, e.target) and (@root != e.target)
|
||||
mousedown(e) {
|
||||
if (!contains this.root, e.target) and (this.root != e.target)
|
||||
@close!
|
||||
|
||||
@on-click = (e) ~>
|
||||
on-click(e) {
|
||||
@complete e.item
|
||||
|
||||
@on-keydown = (e) ~>
|
||||
on-keydown(e) {
|
||||
key = e.which
|
||||
switch (key)
|
||||
| 10, 13 => # Key[ENTER]
|
||||
| 10, 13 => // Key[ENTER]
|
||||
if @select != -1
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
@complete @users[@select]
|
||||
else
|
||||
@close!
|
||||
| 27 => # Key[ESC]
|
||||
| 27 => // Key[ESC]
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
@close!
|
||||
| 38 => # Key[↑]
|
||||
| 38 => // Key[↑]
|
||||
if @select != -1
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
@select-prev!
|
||||
else
|
||||
@close!
|
||||
| 9, 40 => # Key[TAB] or Key[↓]
|
||||
| 9, 40 => // Key[TAB] or Key[↓]
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
@select-next!
|
||||
| _ =>
|
||||
@close!
|
||||
|
||||
@select-next = ~>
|
||||
select-next() {
|
||||
@select++
|
||||
|
||||
if @select >= @users.length
|
||||
@select = 0
|
||||
this.select = 0
|
||||
|
||||
@apply-select!
|
||||
|
||||
@select-prev = ~>
|
||||
select-prev() {
|
||||
@select--
|
||||
|
||||
if @select < 0
|
||||
@select = @users.length - 1
|
||||
this.select = @users.length - 1
|
||||
|
||||
@apply-select!
|
||||
|
||||
@apply-select = ~>
|
||||
@refs.users.children.for-each (el) ~>
|
||||
el.remove-attribute \data-selected
|
||||
apply-select() {
|
||||
this.refs.users.children.for-each (el) =>
|
||||
el.remove-attribute 'data-selected'
|
||||
|
||||
@refs.users.children[@select].set-attribute \data-selected \true
|
||||
@refs.users.children[@select].focus!
|
||||
this.refs.users.children[@select].set-attribute 'data-selected' \true
|
||||
this.refs.users.children[@select].focus();
|
||||
|
||||
@complete = (user) ~>
|
||||
@opts.complete user
|
||||
complete(user) {
|
||||
this.opts.complete user
|
||||
|
||||
@close = ~>
|
||||
@opts.close!
|
||||
close() {
|
||||
this.opts.close!
|
||||
|
||||
function contains(parent, child)
|
||||
node = child.parent-node
|
||||
|
|
|
|||
|
|
@ -70,58 +70,58 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \is-promise
|
||||
@mixin \stream
|
||||
this.mixin('api');
|
||||
this.mixin('is-promise');
|
||||
this.mixin('stream');
|
||||
|
||||
@user = null
|
||||
@user-promise = if @is-promise @opts.user then @opts.user else Promise.resolve @opts.user
|
||||
@init = true
|
||||
@wait = false
|
||||
this.user = null
|
||||
this.user-promise = if @is-promise this.opts.user then this.opts.user else Promise.resolve this.opts.user
|
||||
this.init = true
|
||||
this.wait = false
|
||||
|
||||
@on \mount ~>
|
||||
@user-promise.then (user) ~>
|
||||
@user = user
|
||||
@init = false
|
||||
@update!
|
||||
@stream.on \follow @on-stream-follow
|
||||
@stream.on \unfollow @on-stream-unfollow
|
||||
this.on('mount', () => {
|
||||
@user-promise.then (user) =>
|
||||
this.user = user
|
||||
this.init = false
|
||||
this.update();
|
||||
@stream.on 'follow' this.on-stream-follow
|
||||
@stream.on 'unfollow' this.on-stream-unfollow
|
||||
|
||||
@on \unmount ~>
|
||||
@stream.off \follow @on-stream-follow
|
||||
@stream.off \unfollow @on-stream-unfollow
|
||||
this.on('unmount', () => {
|
||||
@stream.off 'follow' this.on-stream-follow
|
||||
@stream.off 'unfollow' this.on-stream-unfollow
|
||||
|
||||
@on-stream-follow = (user) ~>
|
||||
on-stream-follow(user) {
|
||||
if user.id == @user.id
|
||||
@user = user
|
||||
@update!
|
||||
this.user = user
|
||||
this.update();
|
||||
|
||||
@on-stream-unfollow = (user) ~>
|
||||
on-stream-unfollow(user) {
|
||||
if user.id == @user.id
|
||||
@user = user
|
||||
@update!
|
||||
this.user = user
|
||||
this.update();
|
||||
|
||||
@onclick = ~>
|
||||
@wait = true
|
||||
onclick() {
|
||||
this.wait = true
|
||||
if @user.is_following
|
||||
@api \following/delete do
|
||||
this.api 'following/delete' do
|
||||
user_id: @user.id
|
||||
.then ~>
|
||||
.then =>
|
||||
@user.is_following = false
|
||||
.catch (err) ->
|
||||
console.error err
|
||||
.then ~>
|
||||
@wait = false
|
||||
@update!
|
||||
.then =>
|
||||
this.wait = false
|
||||
this.update();
|
||||
else
|
||||
@api \following/create do
|
||||
this.api 'following/create' do
|
||||
user_id: @user.id
|
||||
.then ~>
|
||||
.then =>
|
||||
@user.is_following = true
|
||||
.catch (err) ->
|
||||
console.error err
|
||||
.then ~>
|
||||
@wait = false
|
||||
@update!
|
||||
.then =>
|
||||
this.wait = false
|
||||
this.update();
|
||||
</script>
|
||||
</mk-big-follow-button>
|
||||
|
|
|
|||
|
|
@ -94,39 +94,39 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@root.add-event-listener \contextmenu (e) ~>
|
||||
this.root.add-event-listener 'contextmenu' (e) =>
|
||||
e.prevent-default!
|
||||
|
||||
@mousedown = (e) ~>
|
||||
mousedown(e) {
|
||||
e.prevent-default!
|
||||
if (!contains @root, e.target) and (@root != e.target)
|
||||
if (!contains this.root, e.target) and (this.root != e.target)
|
||||
@close!
|
||||
return false
|
||||
|
||||
@open = (pos) ~>
|
||||
open(pos) {
|
||||
all = document.query-selector-all 'body *'
|
||||
Array.prototype.for-each.call all, (el) ~>
|
||||
el.add-event-listener \mousedown @mousedown
|
||||
@root.style.display = \block
|
||||
@root.style.left = pos.x + \px
|
||||
@root.style.top = pos.y + \px
|
||||
Array.prototype.for-each.call all, (el) =>
|
||||
el.add-event-listener 'mousedown' @mousedown
|
||||
this.root.style.display = 'block'
|
||||
this.root.style.left = pos.x + 'px'
|
||||
this.root.style.top = pos.y + 'px'
|
||||
|
||||
Velocity @root, \finish true
|
||||
Velocity @root, { opacity: 0 } 0ms
|
||||
Velocity @root, {
|
||||
Velocity this.root, 'finish' true
|
||||
Velocity this.root, { opacity: 0 } 0ms
|
||||
Velocity this.root, {
|
||||
opacity: 1
|
||||
} {
|
||||
queue: false
|
||||
duration: 100ms
|
||||
easing: \linear
|
||||
easing: 'linear'
|
||||
}
|
||||
|
||||
@close = ~>
|
||||
close() {
|
||||
all = document.query-selector-all 'body *'
|
||||
Array.prototype.for-each.call all, (el) ~>
|
||||
el.remove-event-listener \mousedown @mousedown
|
||||
@trigger \closed
|
||||
@unmount!
|
||||
Array.prototype.for-each.call all, (el) =>
|
||||
el.remove-event-listener 'mousedown' @mousedown
|
||||
this.trigger('closed');
|
||||
this.unmount();
|
||||
|
||||
function contains(parent, child)
|
||||
node = child.parent-node
|
||||
|
|
|
|||
|
|
@ -158,31 +158,31 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \cropper
|
||||
this.mixin('cropper');
|
||||
|
||||
@image = @opts.file
|
||||
@title = @opts.title
|
||||
@aspect-ratio = @opts.aspect-ratio
|
||||
@cropper = null
|
||||
this.image = this.opts.file
|
||||
this.title = this.opts.title
|
||||
this.aspect-ratio = this.opts.aspect-ratio
|
||||
this.cropper = null
|
||||
|
||||
@on \mount ~>
|
||||
@img = @refs.window.refs.img
|
||||
@cropper = new @Cropper @img, do
|
||||
this.on('mount', () => {
|
||||
this.img = this.refs.window.refs.img
|
||||
this.cropper = new @Cropper @img, do
|
||||
aspect-ratio: @aspect-ratio
|
||||
highlight: no
|
||||
view-mode: 1
|
||||
|
||||
@ok = ~>
|
||||
@cropper.get-cropped-canvas!.to-blob (blob) ~>
|
||||
@trigger \cropped blob
|
||||
@refs.window.close!
|
||||
ok() {
|
||||
@cropper.get-cropped-canvas!.to-blob (blob) =>
|
||||
this.trigger 'cropped' blob
|
||||
this.refs.window.close!
|
||||
|
||||
@skip = ~>
|
||||
@trigger \skiped
|
||||
@refs.window.close!
|
||||
skip() {
|
||||
this.trigger('skiped');
|
||||
this.refs.window.close!
|
||||
|
||||
@cancel = ~>
|
||||
@trigger \canceled
|
||||
@refs.window.close!
|
||||
cancel() {
|
||||
this.trigger('canceled');
|
||||
this.refs.window.close!
|
||||
</script>
|
||||
</mk-crop-window>
|
||||
|
|
|
|||
|
|
@ -79,34 +79,34 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@can-through = if opts.can-through? then opts.can-through else true
|
||||
@opts.buttons.for-each (button) ~>
|
||||
button._onclick = ~>
|
||||
this.can-through = if opts.can-through? then opts.can-through else true
|
||||
this.opts.buttons.for-each (button) =>
|
||||
button._onclick = =>
|
||||
if button.onclick?
|
||||
button.onclick!
|
||||
@close!
|
||||
|
||||
@on \mount ~>
|
||||
@refs.header.innerHTML = @opts.title
|
||||
@refs.body.innerHTML = @opts.text
|
||||
this.on('mount', () => {
|
||||
this.refs.header.innerHTML = this.opts.title
|
||||
this.refs.body.innerHTML = this.opts.text
|
||||
|
||||
@refs.bg.style.pointer-events = \auto
|
||||
Velocity @refs.bg, \finish true
|
||||
Velocity @refs.bg, {
|
||||
this.refs.bg.style.pointer-events = 'auto'
|
||||
Velocity this.refs.bg, 'finish' true
|
||||
Velocity this.refs.bg, {
|
||||
opacity: 1
|
||||
} {
|
||||
queue: false
|
||||
duration: 100ms
|
||||
easing: \linear
|
||||
easing: 'linear'
|
||||
}
|
||||
|
||||
Velocity @refs.main, {
|
||||
Velocity this.refs.main, {
|
||||
opacity: 0
|
||||
scale: 1.2
|
||||
} {
|
||||
duration: 0
|
||||
}
|
||||
Velocity @refs.main, {
|
||||
Velocity this.refs.main, {
|
||||
opacity: 1
|
||||
scale: 1
|
||||
} {
|
||||
|
|
@ -114,34 +114,34 @@
|
|||
easing: [ 0, 0.5, 0.5, 1 ]
|
||||
}
|
||||
|
||||
@close = ~>
|
||||
@refs.bg.style.pointer-events = \none
|
||||
Velocity @refs.bg, \finish true
|
||||
Velocity @refs.bg, {
|
||||
close() {
|
||||
this.refs.bg.style.pointer-events = 'none'
|
||||
Velocity this.refs.bg, 'finish' true
|
||||
Velocity this.refs.bg, {
|
||||
opacity: 0
|
||||
} {
|
||||
queue: false
|
||||
duration: 300ms
|
||||
easing: \linear
|
||||
easing: 'linear'
|
||||
}
|
||||
|
||||
@refs.main.style.pointer-events = \none
|
||||
Velocity @refs.main, \finish true
|
||||
Velocity @refs.main, {
|
||||
this.refs.main.style.pointer-events = 'none'
|
||||
Velocity this.refs.main, 'finish' true
|
||||
Velocity this.refs.main, {
|
||||
opacity: 0
|
||||
scale: 0.8
|
||||
} {
|
||||
queue: false
|
||||
duration: 300ms
|
||||
easing: [ 0.5, -0.5, 1, 0.5 ]
|
||||
complete: ~>
|
||||
@unmount!
|
||||
complete: =>
|
||||
this.unmount();
|
||||
}
|
||||
|
||||
@bg-click = ~>
|
||||
bg-click() {
|
||||
if @can-through
|
||||
if @opts.on-through?
|
||||
@opts.on-through!
|
||||
if this.opts.on-through?
|
||||
this.opts.on-through!
|
||||
@close!
|
||||
</script>
|
||||
</mk-dialog>
|
||||
|
|
|
|||
|
|
@ -47,21 +47,21 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \i
|
||||
this.mixin('api');
|
||||
this.mixin('i');
|
||||
|
||||
@close = (e) ~>
|
||||
close(e) {
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
|
||||
@I.data.no_donation = true
|
||||
@I.update!
|
||||
@api \i/appdata/set do
|
||||
this.api 'i/appdata/set' do
|
||||
data: JSON.stringify do
|
||||
no_donation: @I.data.no_donation
|
||||
|
||||
@unmount!
|
||||
this.unmount();
|
||||
|
||||
@parent.parent.set-root-layout!
|
||||
this.parent.parent.set-root-layout!
|
||||
</script>
|
||||
</mk-donation>
|
||||
|
|
|
|||
|
|
@ -13,26 +13,26 @@
|
|||
</ul>
|
||||
</mk-contextmenu>
|
||||
<script>
|
||||
@browser = @opts.browser
|
||||
this.browser = this.opts.browser
|
||||
|
||||
@on \mount ~>
|
||||
@refs.ctx.on \closed ~>
|
||||
@trigger \closed
|
||||
@unmount!
|
||||
this.on('mount', () => {
|
||||
this.refs.ctx.on('closed', () => {
|
||||
this.trigger('closed');
|
||||
this.unmount();
|
||||
|
||||
@open = (pos) ~>
|
||||
@refs.ctx.open pos
|
||||
open(pos) {
|
||||
this.refs.ctx.open pos
|
||||
|
||||
@create-folder = ~>
|
||||
create-folder() {
|
||||
@browser.create-folder!
|
||||
@refs.ctx.close!
|
||||
this.refs.ctx.close!
|
||||
|
||||
@upload = ~>
|
||||
upload() {
|
||||
@browser.select-local-file!
|
||||
@refs.ctx.close!
|
||||
this.refs.ctx.close!
|
||||
|
||||
@url-upload = ~>
|
||||
url-upload() {
|
||||
@browser.url-upload!
|
||||
@refs.ctx.close!
|
||||
this.refs.ctx.close!
|
||||
</script>
|
||||
</mk-drive-browser-base-contextmenu>
|
||||
|
|
|
|||
|
|
@ -28,19 +28,19 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
this.mixin('api');
|
||||
|
||||
@folder = if @opts.folder? then @opts.folder else null
|
||||
this.folder = if this.opts.folder? then this.opts.folder else null
|
||||
|
||||
@on \mount ~>
|
||||
@refs.window.on \closed ~>
|
||||
@unmount!
|
||||
this.on('mount', () => {
|
||||
this.refs.window.on('closed', () => {
|
||||
this.unmount();
|
||||
|
||||
@api \drive .then (info) ~>
|
||||
this.api 'drive' .then (info) =>
|
||||
@update do
|
||||
usage: info.usage / info.capacity * 100
|
||||
|
||||
@close = ~>
|
||||
@refs.window.close!
|
||||
close() {
|
||||
this.refs.window.close!
|
||||
</script>
|
||||
</mk-drive-browser-window>
|
||||
|
|
|
|||
|
|
@ -238,211 +238,211 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \dialog
|
||||
@mixin \input-dialog
|
||||
@mixin \stream
|
||||
this.mixin('api');
|
||||
this.mixin('dialog');
|
||||
this.mixin('input-dialog');
|
||||
this.mixin('stream');
|
||||
|
||||
@files = []
|
||||
@folders = []
|
||||
@hierarchy-folders = []
|
||||
this.files = []
|
||||
this.folders = []
|
||||
this.hierarchy-folders = []
|
||||
|
||||
@uploads = []
|
||||
this.uploads = []
|
||||
|
||||
# 現在の階層(フォルダ)
|
||||
# * null でルートを表す
|
||||
@folder = null
|
||||
// 現在の階層(フォルダ)
|
||||
// * null でルートを表す
|
||||
this.folder = null
|
||||
|
||||
@multiple = if @opts.multiple? then @opts.multiple else false
|
||||
this.multiple = if this.opts.multiple? then this.opts.multiple else false
|
||||
|
||||
# ドロップされようとしているか
|
||||
@draghover = false
|
||||
// ドロップされようとしているか
|
||||
this.draghover = false
|
||||
|
||||
# 自信の所有するアイテムがドラッグをスタートさせたか
|
||||
# (自分自身の階層にドロップできないようにするためのフラグ)
|
||||
@is-drag-source = false
|
||||
// 自信の所有するアイテムがドラッグをスタートさせたか
|
||||
// (自分自身の階層にドロップできないようにするためのフラグ)
|
||||
this.is-drag-source = false
|
||||
|
||||
@on \mount ~>
|
||||
@refs.uploader.on \uploaded (file) ~>
|
||||
this.on('mount', () => {
|
||||
this.refs.uploader.on('uploaded', (file) => {
|
||||
@add-file file, true
|
||||
|
||||
@refs.uploader.on \change-uploads (uploads) ~>
|
||||
@uploads = uploads
|
||||
@update!
|
||||
this.refs.uploader.on('change-uploads', (uploads) => {
|
||||
this.uploads = uploads
|
||||
this.update();
|
||||
|
||||
@stream.on \drive_file_created @on-stream-drive-file-created
|
||||
@stream.on \drive_file_updated @on-stream-drive-file-updated
|
||||
@stream.on \drive_folder_created @on-stream-drive-folder-created
|
||||
@stream.on \drive_folder_updated @on-stream-drive-folder-updated
|
||||
@stream.on 'drive_file_created' this.on-stream-drive-file-created
|
||||
@stream.on 'drive_file_updated' this.on-stream-drive-file-updated
|
||||
@stream.on 'drive_folder_created' this.on-stream-drive-folder-created
|
||||
@stream.on 'drive_folder_updated' this.on-stream-drive-folder-updated
|
||||
|
||||
# Riotのバグでnullを渡しても""になる
|
||||
# https://github.com/riot/riot/issues/2080
|
||||
#if @opts.folder?
|
||||
if @opts.folder? and @opts.folder != ''
|
||||
@move @opts.folder
|
||||
// Riotのバグでnullを渡しても""になる
|
||||
// https://github.com/riot/riot/issues/2080
|
||||
#if this.opts.folder?
|
||||
if this.opts.folder? and this.opts.folder != ''
|
||||
@move this.opts.folder
|
||||
else
|
||||
@load!
|
||||
|
||||
@on \unmount ~>
|
||||
@stream.off \drive_file_created @on-stream-drive-file-created
|
||||
@stream.off \drive_file_updated @on-stream-drive-file-updated
|
||||
@stream.off \drive_folder_created @on-stream-drive-folder-created
|
||||
@stream.off \drive_folder_updated @on-stream-drive-folder-updated
|
||||
this.on('unmount', () => {
|
||||
@stream.off 'drive_file_created' this.on-stream-drive-file-created
|
||||
@stream.off 'drive_file_updated' this.on-stream-drive-file-updated
|
||||
@stream.off 'drive_folder_created' this.on-stream-drive-folder-created
|
||||
@stream.off 'drive_folder_updated' this.on-stream-drive-folder-updated
|
||||
|
||||
@on-stream-drive-file-created = (file) ~>
|
||||
on-stream-drive-file-created(file) {
|
||||
@add-file file, true
|
||||
|
||||
@on-stream-drive-file-updated = (file) ~>
|
||||
on-stream-drive-file-updated(file) {
|
||||
current = if @folder? then @folder.id else null
|
||||
if current != file.folder_id
|
||||
@remove-file file
|
||||
else
|
||||
@add-file file, true
|
||||
|
||||
@on-stream-drive-folder-created = (folder) ~>
|
||||
on-stream-drive-folder-created(folder) {
|
||||
@add-folder folder, true
|
||||
|
||||
@on-stream-drive-folder-updated = (folder) ~>
|
||||
on-stream-drive-folder-updated(folder) {
|
||||
current = if @folder? then @folder.id else null
|
||||
if current != folder.parent_id
|
||||
@remove-folder folder
|
||||
else
|
||||
@add-folder folder, true
|
||||
|
||||
@onmousedown = (e) ~>
|
||||
if (contains @refs.folders-container, e.target) or (contains @refs.files-container, e.target)
|
||||
onmousedown(e) {
|
||||
if (contains this.refs.folders-container, e.target) or (contains this.refs.files-container, e.target)
|
||||
return true
|
||||
|
||||
rect = @refs.main.get-bounding-client-rect!
|
||||
rect = this.refs.main.get-bounding-client-rect!
|
||||
|
||||
left = e.page-x + @refs.main.scroll-left - rect.left - window.page-x-offset
|
||||
top = e.page-y + @refs.main.scroll-top - rect.top - window.page-y-offset
|
||||
left = e.page-x + this.refs.main.scroll-left - rect.left - window.page-x-offset
|
||||
top = e.page-y + this.refs.main.scroll-top - rect.top - window.page-y-offset
|
||||
|
||||
move = (e) ~>
|
||||
@refs.selection.style.display = \block
|
||||
move = (e) =>
|
||||
this.refs.selection.style.display = 'block'
|
||||
|
||||
cursor-x = e.page-x + @refs.main.scroll-left - rect.left - window.page-x-offset
|
||||
cursor-y = e.page-y + @refs.main.scroll-top - rect.top - window.page-y-offset
|
||||
cursor-x = e.page-x + this.refs.main.scroll-left - rect.left - window.page-x-offset
|
||||
cursor-y = e.page-y + this.refs.main.scroll-top - rect.top - window.page-y-offset
|
||||
w = cursor-x - left
|
||||
h = cursor-y - top
|
||||
|
||||
if w > 0
|
||||
@refs.selection.style.width = w + \px
|
||||
@refs.selection.style.left = left + \px
|
||||
this.refs.selection.style.width = w + 'px'
|
||||
this.refs.selection.style.left = left + 'px'
|
||||
else
|
||||
@refs.selection.style.width = -w + \px
|
||||
@refs.selection.style.left = cursor-x + \px
|
||||
this.refs.selection.style.width = -w + 'px'
|
||||
this.refs.selection.style.left = cursor-x + 'px'
|
||||
|
||||
if h > 0
|
||||
@refs.selection.style.height = h + \px
|
||||
@refs.selection.style.top = top + \px
|
||||
this.refs.selection.style.height = h + 'px'
|
||||
this.refs.selection.style.top = top + 'px'
|
||||
else
|
||||
@refs.selection.style.height = -h + \px
|
||||
@refs.selection.style.top = cursor-y + \px
|
||||
this.refs.selection.style.height = -h + 'px'
|
||||
this.refs.selection.style.top = cursor-y + 'px'
|
||||
|
||||
up = (e) ~>
|
||||
document.document-element.remove-event-listener \mousemove move
|
||||
document.document-element.remove-event-listener \mouseup up
|
||||
up = (e) =>
|
||||
document.document-element.remove-event-listener 'mousemove' move
|
||||
document.document-element.remove-event-listener 'mouseup' up
|
||||
|
||||
@refs.selection.style.display = \none
|
||||
this.refs.selection.style.display = 'none'
|
||||
|
||||
document.document-element.add-event-listener \mousemove move
|
||||
document.document-element.add-event-listener \mouseup up
|
||||
document.document-element.add-event-listener 'mousemove' move
|
||||
document.document-element.add-event-listener 'mouseup' up
|
||||
|
||||
@path-oncontextmenu = (e) ~>
|
||||
path-oncontextmenu(e) {
|
||||
e.prevent-default!
|
||||
e.stop-immediate-propagation!
|
||||
return false
|
||||
|
||||
@ondragover = (e) ~>
|
||||
ondragover(e) {
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
|
||||
# ドラッグ元が自分自身の所有するアイテムかどうか
|
||||
// ドラッグ元が自分自身の所有するアイテムかどうか
|
||||
if !@is-drag-source
|
||||
# ドラッグされてきたものがファイルだったら
|
||||
if e.data-transfer.effect-allowed == \all
|
||||
e.data-transfer.drop-effect = \copy
|
||||
// ドラッグされてきたものがファイルだったら
|
||||
if e.data-transfer.effect-allowed == 'all'
|
||||
e.data-transfer.drop-effect = 'copy'
|
||||
else
|
||||
e.data-transfer.drop-effect = \move
|
||||
@draghover = true
|
||||
e.data-transfer.drop-effect = 'move'
|
||||
this.draghover = true
|
||||
else
|
||||
# 自分自身にはドロップさせない
|
||||
e.data-transfer.drop-effect = \none
|
||||
// 自分自身にはドロップさせない
|
||||
e.data-transfer.drop-effect = 'none'
|
||||
return false
|
||||
|
||||
@ondragenter = (e) ~>
|
||||
ondragenter(e) {
|
||||
e.prevent-default!
|
||||
if !@is-drag-source
|
||||
@draghover = true
|
||||
this.draghover = true
|
||||
|
||||
@ondragleave = (e) ~>
|
||||
@draghover = false
|
||||
ondragleave(e) {
|
||||
this.draghover = false
|
||||
|
||||
@ondrop = (e) ~>
|
||||
ondrop(e) {
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
|
||||
@draghover = false
|
||||
this.draghover = false
|
||||
|
||||
# ドロップされてきたものがファイルだったら
|
||||
// ドロップされてきたものがファイルだったら
|
||||
if e.data-transfer.files.length > 0
|
||||
Array.prototype.for-each.call e.data-transfer.files, (file) ~>
|
||||
Array.prototype.for-each.call e.data-transfer.files, (file) =>
|
||||
@upload file, @folder
|
||||
return false
|
||||
|
||||
# データ取得
|
||||
// データ取得
|
||||
data = e.data-transfer.get-data 'text'
|
||||
if !data?
|
||||
return false
|
||||
|
||||
# パース
|
||||
// パース
|
||||
obj = JSON.parse data
|
||||
|
||||
# (ドライブの)ファイルだったら
|
||||
if obj.type == \file
|
||||
// (ドライブの)ファイルだったら
|
||||
if obj.type == 'file'
|
||||
file = obj.id
|
||||
if (@files.some (f) ~> f.id == file)
|
||||
if (@files.some (f) => f.id == file)
|
||||
return false
|
||||
@remove-file file
|
||||
@api \drive/files/update do
|
||||
this.api 'drive/files/update' do
|
||||
file_id: file
|
||||
folder_id: if @folder? then @folder.id else null
|
||||
.then ~>
|
||||
# something
|
||||
.catch (err, text-status) ~>
|
||||
.then =>
|
||||
// something
|
||||
.catch (err, text-status) =>
|
||||
console.error err
|
||||
|
||||
# (ドライブの)フォルダーだったら
|
||||
else if obj.type == \folder
|
||||
// (ドライブの)フォルダーだったら
|
||||
else if obj.type == 'folder'
|
||||
folder = obj.id
|
||||
# 移動先が自分自身ならreject
|
||||
// 移動先が自分自身ならreject
|
||||
if @folder? and folder == @folder.id
|
||||
return false
|
||||
if (@folders.some (f) ~> f.id == folder)
|
||||
if (@folders.some (f) => f.id == folder)
|
||||
return false
|
||||
@remove-folder folder
|
||||
@api \drive/folders/update do
|
||||
this.api 'drive/folders/update' do
|
||||
folder_id: folder
|
||||
parent_id: if @folder? then @folder.id else null
|
||||
.then ~>
|
||||
# something
|
||||
.catch (err) ~>
|
||||
.then =>
|
||||
// something
|
||||
.catch (err) =>
|
||||
if err == 'detected-circular-definition'
|
||||
@dialog do
|
||||
'<i class="fa fa-exclamation-triangle"></i>操作を完了できません'
|
||||
'移動先のフォルダーは、移動するフォルダーのサブフォルダーです。'
|
||||
[
|
||||
text: \OK
|
||||
text: 'OK'
|
||||
]
|
||||
|
||||
return false
|
||||
|
||||
@oncontextmenu = (e) ~>
|
||||
oncontextmenu(e) {
|
||||
e.prevent-default!
|
||||
e.stop-immediate-propagation!
|
||||
|
||||
ctx = document.body.append-child document.create-element \mk-drive-browser-base-contextmenu
|
||||
ctx = document.body.appendChild document.createElement 'mk-drive-browser-base-contextmenu'
|
||||
ctx = riot.mount ctx, do
|
||||
browser: @
|
||||
ctx = ctx.0
|
||||
|
|
@ -452,17 +452,17 @@
|
|||
|
||||
return false
|
||||
|
||||
@select-local-file = ~>
|
||||
@refs.file-input.click!
|
||||
select-local-file() {
|
||||
this.refs.file-input.click!
|
||||
|
||||
@url-upload = ~>
|
||||
url-upload() {
|
||||
url <~ @input-dialog do
|
||||
'URLアップロード'
|
||||
'アップロードしたいファイルのURL'
|
||||
null
|
||||
|
||||
if url? and url != ''
|
||||
@api \drive/files/upload_from_url do
|
||||
this.api 'drive/files/upload_from_url' do
|
||||
url: url
|
||||
folder_id: if @folder? then @folder.id else undefined
|
||||
|
||||
|
|
@ -470,61 +470,61 @@
|
|||
'<i class="fa fa-check"></i>アップロードをリクエストしました'
|
||||
'アップロードが完了するまで時間がかかる場合があります。'
|
||||
[
|
||||
text: \OK
|
||||
text: 'OK'
|
||||
]
|
||||
|
||||
@create-folder = ~>
|
||||
create-folder() {
|
||||
name <~ @input-dialog do
|
||||
'フォルダー作成'
|
||||
'フォルダー名'
|
||||
null
|
||||
|
||||
@api \drive/folders/create do
|
||||
this.api 'drive/folders/create' do
|
||||
name: name
|
||||
folder_id: if @folder? then @folder.id else undefined
|
||||
.then (folder) ~>
|
||||
.then (folder) =>
|
||||
@add-folder folder, true
|
||||
@update!
|
||||
.catch (err) ~>
|
||||
this.update();
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
|
||||
@change-file-input = ~>
|
||||
files = @refs.file-input.files
|
||||
change-file-input() {
|
||||
files = this.refs.file-input.files
|
||||
for i from 0 to files.length - 1
|
||||
file = files.item i
|
||||
@upload file, @folder
|
||||
|
||||
@upload = (file, folder) ~>
|
||||
if folder? and typeof folder == \object
|
||||
upload(file, folder) {
|
||||
if folder? and typeof folder == 'object'
|
||||
folder = folder.id
|
||||
@refs.uploader.upload file, folder
|
||||
this.refs.uploader.upload file, folder
|
||||
|
||||
@get-selection = ~>
|
||||
get-selection() {
|
||||
@files.filter (file) -> file._selected
|
||||
|
||||
@new-window = (folder-id) ~>
|
||||
browser = document.body.append-child document.create-element \mk-drive-browser-window
|
||||
new-window(folder-id) {
|
||||
browser = document.body.appendChild document.createElement 'mk-drive-browser-window'
|
||||
riot.mount browser, do
|
||||
folder: folder-id
|
||||
|
||||
@move = (target-folder) ~>
|
||||
if target-folder? and typeof target-folder == \object
|
||||
move(target-folder) {
|
||||
if target-folder? and typeof target-folder == 'object'
|
||||
target-folder = target-folder.id
|
||||
|
||||
if target-folder == null
|
||||
@go-root!
|
||||
return
|
||||
|
||||
@loading = true
|
||||
@update!
|
||||
this.loading = true
|
||||
this.update();
|
||||
|
||||
@api \drive/folders/show do
|
||||
this.api 'drive/folders/show' do
|
||||
folder_id: target-folder
|
||||
.then (folder) ~>
|
||||
@folder = folder
|
||||
@hierarchy-folders = []
|
||||
.then (folder) =>
|
||||
this.folder = folder
|
||||
this.hierarchy-folders = []
|
||||
|
||||
x = (f) ~>
|
||||
x = (f) =>
|
||||
@hierarchy-folders.unshift f
|
||||
if f.parent?
|
||||
x f.parent
|
||||
|
|
@ -532,20 +532,20 @@
|
|||
if folder.parent?
|
||||
x folder.parent
|
||||
|
||||
@update!
|
||||
this.update();
|
||||
@load!
|
||||
.catch (err, text-status) ->
|
||||
console.error err
|
||||
|
||||
@add-folder = (folder, unshift = false) ~>
|
||||
add-folder(folder, unshift = false) {
|
||||
current = if @folder? then @folder.id else null
|
||||
if current != folder.parent_id
|
||||
return
|
||||
|
||||
if (@folders.some (f) ~> f.id == folder.id)
|
||||
if (@folders.some (f) => f.id == folder.id)
|
||||
exist = (@folders.map (f) -> f.id).index-of folder.id
|
||||
@folders[exist] = folder
|
||||
@update!
|
||||
this.update();
|
||||
return
|
||||
|
||||
if unshift
|
||||
|
|
@ -553,17 +553,17 @@
|
|||
else
|
||||
@folders.push folder
|
||||
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
@add-file = (file, unshift = false) ~>
|
||||
add-file(file, unshift = false) {
|
||||
current = if @folder? then @folder.id else null
|
||||
if current != file.folder_id
|
||||
return
|
||||
|
||||
if (@files.some (f) ~> f.id == file.id)
|
||||
if (@files.some (f) => f.id == file.id)
|
||||
exist = (@files.map (f) -> f.id).index-of file.id
|
||||
@files[exist] = file
|
||||
@update!
|
||||
this.update();
|
||||
return
|
||||
|
||||
if unshift
|
||||
|
|
@ -571,34 +571,34 @@
|
|||
else
|
||||
@files.push file
|
||||
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
@remove-folder = (folder) ~>
|
||||
if typeof folder == \object
|
||||
remove-folder(folder) {
|
||||
if typeof folder == 'object'
|
||||
folder = folder.id
|
||||
@folders = @folders.filter (f) -> f.id != folder
|
||||
@update!
|
||||
this.folders = @folders.filter (f) -> f.id != folder
|
||||
this.update();
|
||||
|
||||
@remove-file = (file) ~>
|
||||
if typeof file == \object
|
||||
remove-file(file) {
|
||||
if typeof file == 'object'
|
||||
file = file.id
|
||||
@files = @files.filter (f) -> f.id != file
|
||||
@update!
|
||||
this.files = @files.filter (f) -> f.id != file
|
||||
this.update();
|
||||
|
||||
@go-root = ~>
|
||||
go-root() {
|
||||
if @folder != null
|
||||
@folder = null
|
||||
@hierarchy-folders = []
|
||||
@update!
|
||||
this.folder = null
|
||||
this.hierarchy-folders = []
|
||||
this.update();
|
||||
@load!
|
||||
|
||||
@load = ~>
|
||||
@folders = []
|
||||
@files = []
|
||||
@more-folders = false
|
||||
@more-files = false
|
||||
@loading = true
|
||||
@update!
|
||||
load() {
|
||||
this.folders = []
|
||||
this.files = []
|
||||
this.more-folders = false
|
||||
this.more-files = false
|
||||
this.loading = true
|
||||
this.update();
|
||||
|
||||
load-folders = null
|
||||
load-files = null
|
||||
|
|
@ -606,41 +606,41 @@
|
|||
folders-max = 30
|
||||
files-max = 30
|
||||
|
||||
# フォルダ一覧取得
|
||||
@api \drive/folders do
|
||||
// フォルダ一覧取得
|
||||
this.api 'drive/folders' do
|
||||
folder_id: if @folder? then @folder.id else null
|
||||
limit: folders-max + 1
|
||||
.then (folders) ~>
|
||||
.then (folders) =>
|
||||
if folders.length == folders-max + 1
|
||||
@more-folders = true
|
||||
this.more-folders = true
|
||||
folders.pop!
|
||||
load-folders := folders
|
||||
complete!
|
||||
.catch (err, text-status) ~>
|
||||
.catch (err, text-status) =>
|
||||
console.error err
|
||||
|
||||
# ファイル一覧取得
|
||||
@api \drive/files do
|
||||
// ファイル一覧取得
|
||||
this.api 'drive/files' do
|
||||
folder_id: if @folder? then @folder.id else null
|
||||
limit: files-max + 1
|
||||
.then (files) ~>
|
||||
.then (files) =>
|
||||
if files.length == files-max + 1
|
||||
@more-files = true
|
||||
this.more-files = true
|
||||
files.pop!
|
||||
load-files := files
|
||||
complete!
|
||||
.catch (err, text-status) ~>
|
||||
.catch (err, text-status) =>
|
||||
console.error err
|
||||
|
||||
flag = false
|
||||
complete = ~>
|
||||
complete = =>
|
||||
if flag
|
||||
load-folders.for-each (folder) ~>
|
||||
load-folders.for-each (folder) =>
|
||||
@add-folder folder
|
||||
load-files.for-each (file) ~>
|
||||
load-files.for-each (file) =>
|
||||
@add-file file
|
||||
@loading = false
|
||||
@update!
|
||||
this.loading = false
|
||||
this.update();
|
||||
else
|
||||
flag := true
|
||||
|
||||
|
|
|
|||
|
|
@ -38,60 +38,60 @@
|
|||
</ul>
|
||||
</mk-contextmenu>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \i
|
||||
@mixin \update-avatar
|
||||
@mixin \update-banner
|
||||
@mixin \update-wallpaper
|
||||
@mixin \input-dialog
|
||||
@mixin \NotImplementedException
|
||||
this.mixin('api');
|
||||
this.mixin('i');
|
||||
this.mixin('update-avatar');
|
||||
this.mixin('update-banner');
|
||||
this.mixin('update-wallpaper');
|
||||
this.mixin('input-dialog');
|
||||
this.mixin('NotImplementedException');
|
||||
|
||||
@browser = @opts.browser
|
||||
@file = @opts.file
|
||||
this.browser = this.opts.browser
|
||||
this.file = this.opts.file
|
||||
|
||||
@on \mount ~>
|
||||
@refs.ctx.on \closed ~>
|
||||
@trigger \closed
|
||||
@unmount!
|
||||
this.on('mount', () => {
|
||||
this.refs.ctx.on('closed', () => {
|
||||
this.trigger('closed');
|
||||
this.unmount();
|
||||
|
||||
@open = (pos) ~>
|
||||
@refs.ctx.open pos
|
||||
open(pos) {
|
||||
this.refs.ctx.open pos
|
||||
|
||||
@rename = ~>
|
||||
@refs.ctx.close!
|
||||
rename() {
|
||||
this.refs.ctx.close!
|
||||
|
||||
name <~ @input-dialog do
|
||||
'ファイル名の変更'
|
||||
'新しいファイル名を入力してください'
|
||||
@file.name
|
||||
|
||||
@api \drive/files/update do
|
||||
this.api 'drive/files/update' do
|
||||
file_id: @file.id
|
||||
name: name
|
||||
.then ~>
|
||||
# something
|
||||
.catch (err) ~>
|
||||
.then =>
|
||||
// something
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
|
||||
@copy-url = ~>
|
||||
copy-url() {
|
||||
@NotImplementedException!
|
||||
|
||||
@download = ~>
|
||||
@refs.ctx.close!
|
||||
download() {
|
||||
this.refs.ctx.close!
|
||||
|
||||
@set-avatar = ~>
|
||||
@refs.ctx.close!
|
||||
set-avatar() {
|
||||
this.refs.ctx.close!
|
||||
@update-avatar @I, null, @file
|
||||
|
||||
@set-banner = ~>
|
||||
@refs.ctx.close!
|
||||
set-banner() {
|
||||
this.refs.ctx.close!
|
||||
@update-banner @I, null, @file
|
||||
|
||||
@set-wallpaper = ~>
|
||||
@refs.ctx.close!
|
||||
set-wallpaper() {
|
||||
this.refs.ctx.close!
|
||||
@update-wallpaper @I, null, @file
|
||||
|
||||
@add-app = ~>
|
||||
add-app() {
|
||||
@NotImplementedException!
|
||||
</script>
|
||||
</mk-drive-browser-file-contextmenu>
|
||||
|
|
|
|||
|
|
@ -144,40 +144,40 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@bytes-to-size = require '../../../common/scripts/bytes-to-size.js'
|
||||
this.bytes-to-size = require('../../../common/scripts/bytes-to-size.js');
|
||||
|
||||
@mixin \i
|
||||
this.mixin('i');
|
||||
|
||||
@file = @opts.file
|
||||
@browser = @parent
|
||||
this.file = this.opts.file
|
||||
this.browser = this.parent
|
||||
|
||||
@title = @file.name + '\n' + @file.type + ' ' + (@bytes-to-size @file.datasize)
|
||||
this.title = @file.name + '\n' + @file.type + ' ' + (@bytes-to-size @file.datasize)
|
||||
|
||||
@is-contextmenu-showing = false
|
||||
this.is-contextmenu-showing = false
|
||||
|
||||
@onclick = ~>
|
||||
onclick() {
|
||||
if @browser.multiple
|
||||
if @file._selected?
|
||||
@file._selected = !@file._selected
|
||||
else
|
||||
@file._selected = true
|
||||
@browser.trigger \change-selection @browser.get-selection!
|
||||
@browser.trigger 'change-selection' @browser.get-selection!
|
||||
else
|
||||
if @file._selected
|
||||
@browser.trigger \selected @file
|
||||
@browser.trigger 'selected' @file
|
||||
else
|
||||
@browser.files.for-each (file) ~>
|
||||
@browser.files.for-each (file) =>
|
||||
file._selected = false
|
||||
@file._selected = true
|
||||
@browser.trigger \change-selection @file
|
||||
@browser.trigger 'change-selection' @file
|
||||
|
||||
@oncontextmenu = (e) ~>
|
||||
oncontextmenu(e) {
|
||||
e.prevent-default!
|
||||
e.stop-immediate-propagation!
|
||||
|
||||
@is-contextmenu-showing = true
|
||||
@update!
|
||||
ctx = document.body.append-child document.create-element \mk-drive-browser-file-contextmenu
|
||||
this.is-contextmenu-showing = true
|
||||
this.update();
|
||||
ctx = document.body.appendChild document.createElement 'mk-drive-browser-file-contextmenu'
|
||||
ctx = riot.mount ctx, do
|
||||
browser: @browser
|
||||
file: @file
|
||||
|
|
@ -185,25 +185,25 @@
|
|||
ctx.open do
|
||||
x: e.page-x - window.page-x-offset
|
||||
y: e.page-y - window.page-y-offset
|
||||
ctx.on \closed ~>
|
||||
@is-contextmenu-showing = false
|
||||
@update!
|
||||
ctx.on('closed', () => {
|
||||
this.is-contextmenu-showing = false
|
||||
this.update();
|
||||
return false
|
||||
|
||||
@ondragstart = (e) ~>
|
||||
e.data-transfer.effect-allowed = \move
|
||||
ondragstart(e) {
|
||||
e.data-transfer.effect-allowed = 'move'
|
||||
e.data-transfer.set-data 'text' JSON.stringify do
|
||||
type: \file
|
||||
type: 'file'
|
||||
id: @file.id
|
||||
file: @file
|
||||
@is-dragging = true
|
||||
this.is-dragging = true
|
||||
|
||||
# 親ブラウザに対して、ドラッグが開始されたフラグを立てる
|
||||
# (=あなたの子供が、ドラッグを開始しましたよ)
|
||||
// 親ブラウザに対して、ドラッグが開始されたフラグを立てる
|
||||
// (=あなたの子供が、ドラッグを開始しましたよ)
|
||||
@browser.is-drag-source = true
|
||||
|
||||
@ondragend = (e) ~>
|
||||
@is-dragging = false
|
||||
ondragend(e) {
|
||||
this.is-dragging = false
|
||||
@browser.is-drag-source = false
|
||||
</script>
|
||||
</mk-drive-browser-file>
|
||||
|
|
|
|||
|
|
@ -18,49 +18,49 @@
|
|||
</ul>
|
||||
</mk-contextmenu>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \input-dialog
|
||||
this.mixin('api');
|
||||
this.mixin('input-dialog');
|
||||
|
||||
@browser = @opts.browser
|
||||
@folder = @opts.folder
|
||||
this.browser = this.opts.browser
|
||||
this.folder = this.opts.folder
|
||||
|
||||
@open = (pos) ~>
|
||||
@refs.ctx.open pos
|
||||
open(pos) {
|
||||
this.refs.ctx.open pos
|
||||
|
||||
@refs.ctx.on \closed ~>
|
||||
@trigger \closed
|
||||
@unmount!
|
||||
this.refs.ctx.on('closed', () => {
|
||||
this.trigger('closed');
|
||||
this.unmount();
|
||||
|
||||
@move = ~>
|
||||
move() {
|
||||
@browser.move @folder.id
|
||||
@refs.ctx.close!
|
||||
this.refs.ctx.close!
|
||||
|
||||
@new-window = ~>
|
||||
new-window() {
|
||||
@browser.new-window @folder.id
|
||||
@refs.ctx.close!
|
||||
this.refs.ctx.close!
|
||||
|
||||
@create-folder = ~>
|
||||
create-folder() {
|
||||
@browser.create-folder!
|
||||
@refs.ctx.close!
|
||||
this.refs.ctx.close!
|
||||
|
||||
@upload = ~>
|
||||
upload() {
|
||||
@browser.select-lcoal-file!
|
||||
@refs.ctx.close!
|
||||
this.refs.ctx.close!
|
||||
|
||||
@rename = ~>
|
||||
@refs.ctx.close!
|
||||
rename() {
|
||||
this.refs.ctx.close!
|
||||
|
||||
name <~ @input-dialog do
|
||||
'フォルダ名の変更'
|
||||
'新しいフォルダ名を入力してください'
|
||||
@folder.name
|
||||
|
||||
@api \drive/folders/update do
|
||||
this.api 'drive/folders/update' do
|
||||
folder_id: @folder.id
|
||||
name: name
|
||||
.then ~>
|
||||
# something
|
||||
.catch (err) ~>
|
||||
.then =>
|
||||
// something
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
</script>
|
||||
</mk-drive-browser-folder-contextmenu>
|
||||
|
|
|
|||
|
|
@ -50,124 +50,124 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \dialog
|
||||
this.mixin('api');
|
||||
this.mixin('dialog');
|
||||
|
||||
@folder = @opts.folder
|
||||
@browser = @parent
|
||||
this.folder = this.opts.folder
|
||||
this.browser = this.parent
|
||||
|
||||
@title = @folder.name
|
||||
@hover = false
|
||||
@draghover = false
|
||||
@is-contextmenu-showing = false
|
||||
this.title = @folder.name
|
||||
this.hover = false
|
||||
this.draghover = false
|
||||
this.is-contextmenu-showing = false
|
||||
|
||||
@onclick = ~>
|
||||
onclick() {
|
||||
@browser.move @folder
|
||||
|
||||
@onmouseover = ~>
|
||||
@hover = true
|
||||
onmouseover() {
|
||||
this.hover = true
|
||||
|
||||
@onmouseout = ~>
|
||||
@hover = false
|
||||
onmouseout() {
|
||||
this.hover = false
|
||||
|
||||
@ondragover = (e) ~>
|
||||
ondragover(e) {
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
|
||||
# 自分自身がドラッグされていない場合
|
||||
// 自分自身がドラッグされていない場合
|
||||
if !@is-dragging
|
||||
# ドラッグされてきたものがファイルだったら
|
||||
if e.data-transfer.effect-allowed == \all
|
||||
e.data-transfer.drop-effect = \copy
|
||||
// ドラッグされてきたものがファイルだったら
|
||||
if e.data-transfer.effect-allowed == 'all'
|
||||
e.data-transfer.drop-effect = 'copy'
|
||||
else
|
||||
e.data-transfer.drop-effect = \move
|
||||
e.data-transfer.drop-effect = 'move'
|
||||
else
|
||||
# 自分自身にはドロップさせない
|
||||
e.data-transfer.drop-effect = \none
|
||||
// 自分自身にはドロップさせない
|
||||
e.data-transfer.drop-effect = 'none'
|
||||
return false
|
||||
|
||||
@ondragenter = ~>
|
||||
ondragenter() {
|
||||
if !@is-dragging
|
||||
@draghover = true
|
||||
this.draghover = true
|
||||
|
||||
@ondragleave = ~>
|
||||
@draghover = false
|
||||
ondragleave() {
|
||||
this.draghover = false
|
||||
|
||||
@ondrop = (e) ~>
|
||||
ondrop(e) {
|
||||
e.stop-propagation!
|
||||
@draghover = false
|
||||
this.draghover = false
|
||||
|
||||
# ファイルだったら
|
||||
// ファイルだったら
|
||||
if e.data-transfer.files.length > 0
|
||||
Array.prototype.for-each.call e.data-transfer.files, (file) ~>
|
||||
Array.prototype.for-each.call e.data-transfer.files, (file) =>
|
||||
@browser.upload file, @folder
|
||||
return false
|
||||
|
||||
# データ取得
|
||||
// データ取得
|
||||
data = e.data-transfer.get-data 'text'
|
||||
if !data?
|
||||
return false
|
||||
|
||||
# パース
|
||||
// パース
|
||||
obj = JSON.parse data
|
||||
|
||||
# (ドライブの)ファイルだったら
|
||||
if obj.type == \file
|
||||
// (ドライブの)ファイルだったら
|
||||
if obj.type == 'file'
|
||||
file = obj.id
|
||||
@browser.remove-file file
|
||||
@api \drive/files/update do
|
||||
this.api 'drive/files/update' do
|
||||
file_id: file
|
||||
folder_id: @folder.id
|
||||
.then ~>
|
||||
# something
|
||||
.catch (err, text-status) ~>
|
||||
.then =>
|
||||
// something
|
||||
.catch (err, text-status) =>
|
||||
console.error err
|
||||
|
||||
# (ドライブの)フォルダーだったら
|
||||
else if obj.type == \folder
|
||||
// (ドライブの)フォルダーだったら
|
||||
else if obj.type == 'folder'
|
||||
folder = obj.id
|
||||
# 移動先が自分自身ならreject
|
||||
// 移動先が自分自身ならreject
|
||||
if folder == @folder.id
|
||||
return false
|
||||
@browser.remove-folder folder
|
||||
@api \drive/folders/update do
|
||||
this.api 'drive/folders/update' do
|
||||
folder_id: folder
|
||||
parent_id: @folder.id
|
||||
.then ~>
|
||||
# something
|
||||
.catch (err) ~>
|
||||
.then =>
|
||||
// something
|
||||
.catch (err) =>
|
||||
if err == 'detected-circular-definition'
|
||||
@dialog do
|
||||
'<i class="fa fa-exclamation-triangle"></i>操作を完了できません'
|
||||
'移動先のフォルダーは、移動するフォルダーのサブフォルダーです。'
|
||||
[
|
||||
text: \OK
|
||||
text: 'OK'
|
||||
]
|
||||
|
||||
return false
|
||||
|
||||
@ondragstart = (e) ~>
|
||||
e.data-transfer.effect-allowed = \move
|
||||
ondragstart(e) {
|
||||
e.data-transfer.effect-allowed = 'move'
|
||||
e.data-transfer.set-data 'text' JSON.stringify do
|
||||
type: \folder
|
||||
type: 'folder'
|
||||
id: @folder.id
|
||||
@is-dragging = true
|
||||
this.is-dragging = true
|
||||
|
||||
# 親ブラウザに対して、ドラッグが開始されたフラグを立てる
|
||||
# (=あなたの子供が、ドラッグを開始しましたよ)
|
||||
// 親ブラウザに対して、ドラッグが開始されたフラグを立てる
|
||||
// (=あなたの子供が、ドラッグを開始しましたよ)
|
||||
@browser.is-drag-source = true
|
||||
|
||||
@ondragend = (e) ~>
|
||||
@is-dragging = false
|
||||
ondragend(e) {
|
||||
this.is-dragging = false
|
||||
@browser.is-drag-source = false
|
||||
|
||||
@oncontextmenu = (e) ~>
|
||||
oncontextmenu(e) {
|
||||
e.prevent-default!
|
||||
e.stop-immediate-propagation!
|
||||
|
||||
@is-contextmenu-showing = true
|
||||
@update!
|
||||
ctx = document.body.append-child document.create-element \mk-drive-browser-folder-contextmenu
|
||||
this.is-contextmenu-showing = true
|
||||
this.update();
|
||||
ctx = document.body.appendChild document.createElement 'mk-drive-browser-folder-contextmenu'
|
||||
ctx = riot.mount ctx, do
|
||||
browser: @browser
|
||||
folder: @folder
|
||||
|
|
@ -175,9 +175,9 @@
|
|||
ctx.open do
|
||||
x: e.page-x - window.page-x-offset
|
||||
y: e.page-y - window.page-y-offset
|
||||
ctx.on \closed ~>
|
||||
@is-contextmenu-showing = false
|
||||
@update!
|
||||
ctx.on('closed', () => {
|
||||
this.is-contextmenu-showing = false
|
||||
this.update();
|
||||
|
||||
return false
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -6,90 +6,90 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
this.mixin('api');
|
||||
|
||||
# Riotのバグでnullを渡しても""になる
|
||||
# https://github.com/riot/riot/issues/2080
|
||||
#@folder = @opts.folder
|
||||
@folder = if @opts.folder? and @opts.folder != '' then @opts.folder else null
|
||||
@browser = @parent
|
||||
// Riotのバグでnullを渡しても""になる
|
||||
// https://github.com/riot/riot/issues/2080
|
||||
#this.folder = this.opts.folder
|
||||
this.folder = if this.opts.folder? and this.opts.folder != '' then this.opts.folder else null
|
||||
this.browser = this.parent
|
||||
|
||||
@hover = false
|
||||
this.hover = false
|
||||
|
||||
@onclick = ~>
|
||||
onclick() {
|
||||
@browser.move @folder
|
||||
|
||||
@onmouseover = ~>
|
||||
@hover = true
|
||||
onmouseover() {
|
||||
this.hover = true
|
||||
|
||||
@onmouseout = ~>
|
||||
@hover = false
|
||||
onmouseout() {
|
||||
this.hover = false
|
||||
|
||||
@ondragover = (e) ~>
|
||||
ondragover(e) {
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
|
||||
# このフォルダがルートかつカレントディレクトリならドロップ禁止
|
||||
// このフォルダがルートかつカレントディレクトリならドロップ禁止
|
||||
if @folder == null and @browser.folder == null
|
||||
e.data-transfer.drop-effect = \none
|
||||
# ドラッグされてきたものがファイルだったら
|
||||
else if e.data-transfer.effect-allowed == \all
|
||||
e.data-transfer.drop-effect = \copy
|
||||
e.data-transfer.drop-effect = 'none'
|
||||
// ドラッグされてきたものがファイルだったら
|
||||
else if e.data-transfer.effect-allowed == 'all'
|
||||
e.data-transfer.drop-effect = 'copy'
|
||||
else
|
||||
e.data-transfer.drop-effect = \move
|
||||
e.data-transfer.drop-effect = 'move'
|
||||
return false
|
||||
|
||||
@ondragenter = ~>
|
||||
ondragenter() {
|
||||
if @folder != null or @browser.folder != null
|
||||
@draghover = true
|
||||
this.draghover = true
|
||||
|
||||
@ondragleave = ~>
|
||||
ondragleave() {
|
||||
if @folder != null or @browser.folder != null
|
||||
@draghover = false
|
||||
this.draghover = false
|
||||
|
||||
@ondrop = (e) ~>
|
||||
ondrop(e) {
|
||||
e.stop-propagation!
|
||||
@draghover = false
|
||||
this.draghover = false
|
||||
|
||||
# ファイルだったら
|
||||
// ファイルだったら
|
||||
if e.data-transfer.files.length > 0
|
||||
Array.prototype.for-each.call e.data-transfer.files, (file) ~>
|
||||
Array.prototype.for-each.call e.data-transfer.files, (file) =>
|
||||
@browser.upload file, @folder
|
||||
return false
|
||||
|
||||
# データ取得
|
||||
// データ取得
|
||||
data = e.data-transfer.get-data 'text'
|
||||
if !data?
|
||||
return false
|
||||
|
||||
# パース
|
||||
// パース
|
||||
obj = JSON.parse data
|
||||
|
||||
# (ドライブの)ファイルだったら
|
||||
if obj.type == \file
|
||||
// (ドライブの)ファイルだったら
|
||||
if obj.type == 'file'
|
||||
file = obj.id
|
||||
@browser.remove-file file
|
||||
@api \drive/files/update do
|
||||
this.api 'drive/files/update' do
|
||||
file_id: file
|
||||
folder_id: if @folder? then @folder.id else null
|
||||
.then ~>
|
||||
# something
|
||||
.catch (err, text-status) ~>
|
||||
.then =>
|
||||
// something
|
||||
.catch (err, text-status) =>
|
||||
console.error err
|
||||
|
||||
# (ドライブの)フォルダーだったら
|
||||
else if obj.type == \folder
|
||||
// (ドライブの)フォルダーだったら
|
||||
else if obj.type == 'folder'
|
||||
folder = obj.id
|
||||
# 移動先が自分自身ならreject
|
||||
// 移動先が自分自身ならreject
|
||||
if @folder? and folder == @folder.id
|
||||
return false
|
||||
@browser.remove-folder folder
|
||||
@api \drive/folders/update do
|
||||
this.api 'drive/folders/update' do
|
||||
folder_id: folder
|
||||
parent_id: if @folder? then @folder.id else null
|
||||
.then ~>
|
||||
# something
|
||||
.catch (err, text-status) ~>
|
||||
.then =>
|
||||
// something
|
||||
.catch (err, text-status) =>
|
||||
console.error err
|
||||
|
||||
return false
|
||||
|
|
|
|||
|
|
@ -67,58 +67,58 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \is-promise
|
||||
@mixin \stream
|
||||
this.mixin('api');
|
||||
this.mixin('is-promise');
|
||||
this.mixin('stream');
|
||||
|
||||
@user = null
|
||||
@user-promise = if @is-promise @opts.user then @opts.user else Promise.resolve @opts.user
|
||||
@init = true
|
||||
@wait = false
|
||||
this.user = null
|
||||
this.user-promise = if @is-promise this.opts.user then this.opts.user else Promise.resolve this.opts.user
|
||||
this.init = true
|
||||
this.wait = false
|
||||
|
||||
@on \mount ~>
|
||||
@user-promise.then (user) ~>
|
||||
@user = user
|
||||
@init = false
|
||||
@update!
|
||||
@stream.on \follow @on-stream-follow
|
||||
@stream.on \unfollow @on-stream-unfollow
|
||||
this.on('mount', () => {
|
||||
@user-promise.then (user) =>
|
||||
this.user = user
|
||||
this.init = false
|
||||
this.update();
|
||||
@stream.on 'follow' this.on-stream-follow
|
||||
@stream.on 'unfollow' this.on-stream-unfollow
|
||||
|
||||
@on \unmount ~>
|
||||
@stream.off \follow @on-stream-follow
|
||||
@stream.off \unfollow @on-stream-unfollow
|
||||
this.on('unmount', () => {
|
||||
@stream.off 'follow' this.on-stream-follow
|
||||
@stream.off 'unfollow' this.on-stream-unfollow
|
||||
|
||||
@on-stream-follow = (user) ~>
|
||||
on-stream-follow(user) {
|
||||
if user.id == @user.id
|
||||
@user = user
|
||||
@update!
|
||||
this.user = user
|
||||
this.update();
|
||||
|
||||
@on-stream-unfollow = (user) ~>
|
||||
on-stream-unfollow(user) {
|
||||
if user.id == @user.id
|
||||
@user = user
|
||||
@update!
|
||||
this.user = user
|
||||
this.update();
|
||||
|
||||
@onclick = ~>
|
||||
@wait = true
|
||||
onclick() {
|
||||
this.wait = true
|
||||
if @user.is_following
|
||||
@api \following/delete do
|
||||
this.api 'following/delete' do
|
||||
user_id: @user.id
|
||||
.then ~>
|
||||
.then =>
|
||||
@user.is_following = false
|
||||
.catch (err) ->
|
||||
console.error err
|
||||
.then ~>
|
||||
@wait = false
|
||||
@update!
|
||||
.then =>
|
||||
this.wait = false
|
||||
this.update();
|
||||
else
|
||||
@api \following/create do
|
||||
this.api 'following/create' do
|
||||
user_id: @user.id
|
||||
.then ~>
|
||||
.then =>
|
||||
@user.is_following = true
|
||||
.catch (err) ->
|
||||
console.error err
|
||||
.then ~>
|
||||
@wait = false
|
||||
@update!
|
||||
.then =>
|
||||
this.wait = false
|
||||
this.update();
|
||||
</script>
|
||||
</mk-follow-button>
|
||||
|
|
|
|||
|
|
@ -123,41 +123,41 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \user-preview
|
||||
this.mixin('api');
|
||||
this.mixin('user-preview');
|
||||
|
||||
@users = null
|
||||
@loading = true
|
||||
this.users = null
|
||||
this.loading = true
|
||||
|
||||
@limit = 6users
|
||||
@page = 0
|
||||
this.limit = 6users
|
||||
this.page = 0
|
||||
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
@load!
|
||||
|
||||
@load = ~>
|
||||
@loading = true
|
||||
@users = null
|
||||
@update!
|
||||
load() {
|
||||
this.loading = true
|
||||
this.users = null
|
||||
this.update();
|
||||
|
||||
@api \users/recommendation do
|
||||
this.api 'users/recommendation' do
|
||||
limit: @limit
|
||||
offset: @limit * @page
|
||||
.then (users) ~>
|
||||
@loading = false
|
||||
@users = users
|
||||
@update!
|
||||
.then (users) =>
|
||||
this.loading = false
|
||||
this.users = users
|
||||
this.update();
|
||||
.catch (err, text-status) ->
|
||||
console.error err
|
||||
|
||||
@refresh = ~>
|
||||
refresh() {
|
||||
if @users.length < @limit
|
||||
@page = 0
|
||||
this.page = 0
|
||||
else
|
||||
@page++
|
||||
@load!
|
||||
|
||||
@close = ~>
|
||||
@unmount!
|
||||
close() {
|
||||
this.unmount();
|
||||
</script>
|
||||
</mk-following-setuper>
|
||||
|
|
|
|||
|
|
@ -1,14 +1,14 @@
|
|||
<mk-go-top>
|
||||
<button class="hidden" title="一番上へ"><i class="fa fa-angle-up"></i></button>
|
||||
<script>
|
||||
window.add-event-listener \load @on-scroll
|
||||
window.add-event-listener \scroll @on-scroll
|
||||
window.add-event-listener \resize @on-scroll
|
||||
window.add-event-listener 'load' this.on-scroll
|
||||
window.add-event-listener 'scroll' this.on-scroll
|
||||
window.add-event-listener 'resize' this.on-scroll
|
||||
|
||||
@on-scroll = ~>
|
||||
on-scroll() {
|
||||
if $ window .scroll-top! > 500px
|
||||
@remove-class \hidden
|
||||
@remove-class 'hidden'
|
||||
else
|
||||
@add-class \hidden
|
||||
@add-class 'hidden'
|
||||
</script>
|
||||
</mk-go-top>
|
||||
|
|
|
|||
|
|
@ -106,43 +106,43 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@draw = ~>
|
||||
draw() {
|
||||
now = new Date!
|
||||
nd = now.get-date!
|
||||
nm = now.get-month!
|
||||
ny = now.get-full-year!
|
||||
|
||||
@year = ny
|
||||
@month = nm + 1
|
||||
@day = nd
|
||||
@week-day = [\日 \月 \火 \水 \木 \金 \土][now.get-day!]
|
||||
this.year = ny
|
||||
this.month = nm + 1
|
||||
this.day = nd
|
||||
this.week-day = [\日 '月' \火 '水' \木 '金' \土][now.get-day!]
|
||||
|
||||
@day-numer = (now - (new Date ny, nm, nd))
|
||||
@day-denom = 1000ms * 60s * 60m * 24h
|
||||
@month-numer = (now - (new Date ny, nm, 1))
|
||||
@month-denom = (new Date ny, nm + 1, 1) - (new Date ny, nm, 1)
|
||||
this.month-numer = (now - (new Date ny, nm, 1))
|
||||
this.month-denom = (new Date ny, nm + 1, 1) - (new Date ny, nm, 1)
|
||||
@year-numer = (now - (new Date ny, 0, 1))
|
||||
@year-denom = (new Date ny + 1, 0, 1) - (new Date ny, 0, 1)
|
||||
|
||||
@day-p = @day-numer / @day-denom * 100
|
||||
@month-p = @month-numer / @month-denom * 100
|
||||
this.month-p = @month-numer / @month-denom * 100
|
||||
@year-p = @year-numer / @year-denom * 100
|
||||
|
||||
@is-holiday =
|
||||
this.is-holiday =
|
||||
(now.get-day! == 0 or now.get-day! == 6)
|
||||
|
||||
@special =
|
||||
| nm == 0 and nd == 1 => \on-new-years-day
|
||||
this.special =
|
||||
| nm == 0 and nd == 1 => 'on-new-years-day'
|
||||
| _ => false
|
||||
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
@draw!
|
||||
|
||||
@on \mount ~>
|
||||
@clock = set-interval @draw, 1000ms
|
||||
this.on('mount', () => {
|
||||
this.clock = set-interval @draw, 1000ms
|
||||
|
||||
@on \unmount ~>
|
||||
this.on('unmount', () => {
|
||||
clear-interval @clock
|
||||
</script>
|
||||
</mk-calendar-home-widget>
|
||||
|
|
|
|||
|
|
@ -32,5 +32,5 @@
|
|||
color #999
|
||||
|
||||
</style>
|
||||
<script>@mixin \user-preview</script>
|
||||
<script>this.mixin('user-preview');</script>
|
||||
</mk-donation-home-widget>
|
||||
|
|
|
|||
|
|
@ -46,65 +46,65 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
@mixin \api
|
||||
this.mixin('i');
|
||||
this.mixin('api');
|
||||
|
||||
@is-loading = true
|
||||
@is-empty = false
|
||||
@more-loading = false
|
||||
@mode = \all
|
||||
this.is-loading = true
|
||||
this.is-empty = false
|
||||
this.more-loading = false
|
||||
this.mode = 'all'
|
||||
|
||||
@on \mount ~>
|
||||
document.add-event-listener \keydown @on-document-keydown
|
||||
window.add-event-listener \scroll @on-scroll
|
||||
this.on('mount', () => {
|
||||
document.add-event-listener 'keydown' this.on-document-keydown
|
||||
window.add-event-listener 'scroll' this.on-scroll
|
||||
|
||||
@fetch ~>
|
||||
@trigger \loaded
|
||||
@fetch =>
|
||||
this.trigger('loaded');
|
||||
|
||||
@on \unmount ~>
|
||||
document.remove-event-listener \keydown @on-document-keydown
|
||||
window.remove-event-listener \scroll @on-scroll
|
||||
this.on('unmount', () => {
|
||||
document.remove-event-listener 'keydown' this.on-document-keydown
|
||||
window.remove-event-listener 'scroll' this.on-scroll
|
||||
|
||||
@on-document-keydown = (e) ~>
|
||||
on-document-keydown(e) {
|
||||
tag = e.target.tag-name.to-lower-case!
|
||||
if tag != \input and tag != \textarea
|
||||
if e.which == 84 # t
|
||||
@refs.timeline.focus!
|
||||
if tag != 'input' and tag != 'textarea'
|
||||
if e.which == 84 // t
|
||||
this.refs.timeline.focus();
|
||||
|
||||
@fetch = (cb) ~>
|
||||
@api \posts/mentions do
|
||||
following: @mode == \following
|
||||
.then (posts) ~>
|
||||
@is-loading = false
|
||||
@is-empty = posts.length == 0
|
||||
@update!
|
||||
@refs.timeline.set-posts posts
|
||||
fetch(cb) {
|
||||
this.api 'posts/mentions' do
|
||||
following: @mode == 'following'
|
||||
.then (posts) =>
|
||||
this.is-loading = false
|
||||
this.is-empty = posts.length == 0
|
||||
this.update();
|
||||
this.refs.timeline.set-posts posts
|
||||
if cb? then cb!
|
||||
.catch (err) ~>
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
if cb? then cb!
|
||||
|
||||
@more = ~>
|
||||
if @more-loading or @is-loading or @refs.timeline.posts.length == 0
|
||||
more() {
|
||||
if @more-loading or @is-loading or this.refs.timeline.posts.length == 0
|
||||
return
|
||||
@more-loading = true
|
||||
@update!
|
||||
@api \posts/mentions do
|
||||
following: @mode == \following
|
||||
max_id: @refs.timeline.tail!.id
|
||||
.then (posts) ~>
|
||||
@more-loading = false
|
||||
@update!
|
||||
@refs.timeline.prepend-posts posts
|
||||
.catch (err) ~>
|
||||
this.more-loading = true
|
||||
this.update();
|
||||
this.api 'posts/mentions' do
|
||||
following: @mode == 'following'
|
||||
max_id: this.refs.timeline.tail!.id
|
||||
.then (posts) =>
|
||||
this.more-loading = false
|
||||
this.update();
|
||||
this.refs.timeline.prepend-posts posts
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
|
||||
@on-scroll = ~>
|
||||
on-scroll() {
|
||||
current = window.scroll-y + window.inner-height
|
||||
if current > document.body.offset-height - 8
|
||||
@more!
|
||||
|
||||
@set-mode = (mode) ~>
|
||||
set-mode(mode) {
|
||||
@update do
|
||||
mode: mode
|
||||
@fetch!
|
||||
|
|
|
|||
|
|
@ -43,8 +43,8 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@settings = ~>
|
||||
w = riot.mount document.body.append-child document.create-element \mk-settings-window .0
|
||||
w.switch \notification
|
||||
settings() {
|
||||
w = riot.mount document.body.appendChild document.createElement 'mk-settings-window' .0
|
||||
w.switch 'notification'
|
||||
</script>
|
||||
</mk-notifications-home-widget>
|
||||
|
|
|
|||
|
|
@ -57,31 +57,31 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \stream
|
||||
this.mixin('api');
|
||||
this.mixin('stream');
|
||||
|
||||
@images = []
|
||||
@initializing = true
|
||||
this.images = []
|
||||
this.initializing = true
|
||||
|
||||
@on \mount ~>
|
||||
@stream.on \drive_file_created @on-stream-drive-file-created
|
||||
this.on('mount', () => {
|
||||
@stream.on 'drive_file_created' this.on-stream-drive-file-created
|
||||
|
||||
@api \drive/stream do
|
||||
this.api 'drive/stream' do
|
||||
type: 'image/*'
|
||||
limit: 9images
|
||||
.then (images) ~>
|
||||
@initializing = false
|
||||
@images = images
|
||||
@update!
|
||||
.then (images) =>
|
||||
this.initializing = false
|
||||
this.images = images
|
||||
this.update();
|
||||
|
||||
@on \unmount ~>
|
||||
@stream.off \drive_file_created @on-stream-drive-file-created
|
||||
this.on('unmount', () => {
|
||||
@stream.off 'drive_file_created' this.on-stream-drive-file-created
|
||||
|
||||
@on-stream-drive-file-created = (file) ~>
|
||||
on-stream-drive-file-created(file) {
|
||||
if /^image\/.+$/.test file.type
|
||||
@images.unshift file
|
||||
if @images.length > 9
|
||||
@images.pop!
|
||||
@update!
|
||||
this.update();
|
||||
</script>
|
||||
</mk-photo-stream-home-widget>
|
||||
|
|
|
|||
|
|
@ -41,15 +41,15 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
@mixin \user-preview
|
||||
@mixin \update-avatar
|
||||
@mixin \update-banner
|
||||
this.mixin('i');
|
||||
this.mixin('user-preview');
|
||||
this.mixin('update-avatar');
|
||||
this.mixin('update-banner');
|
||||
|
||||
@set-avatar = ~>
|
||||
set-avatar() {
|
||||
@update-avatar @I
|
||||
|
||||
@set-banner = ~>
|
||||
set-banner() {
|
||||
@update-banner @I
|
||||
</script>
|
||||
</mk-profile-home-widget>
|
||||
|
|
|
|||
|
|
@ -64,31 +64,31 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \NotImplementedException
|
||||
this.mixin('api');
|
||||
this.mixin('NotImplementedException');
|
||||
|
||||
@url = 'http://news.yahoo.co.jp/pickup/rss.xml'
|
||||
@items = []
|
||||
@initializing = true
|
||||
this.url = 'http://news.yahoo.co.jp/pickup/rss.xml'
|
||||
this.items = []
|
||||
this.initializing = true
|
||||
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
@fetch!
|
||||
@clock = set-interval @fetch, 60000ms
|
||||
this.clock = set-interval @fetch, 60000ms
|
||||
|
||||
@on \unmount ~>
|
||||
this.on('unmount', () => {
|
||||
clear-interval @clock
|
||||
|
||||
@fetch = ~>
|
||||
@api CONFIG.url + '/api:rss' do
|
||||
fetch() {
|
||||
this.api CONFIG.url + '/api:rss' do
|
||||
url: @url
|
||||
.then (feed) ~>
|
||||
@items = feed.rss.channel.item
|
||||
@initializing = false
|
||||
@update!
|
||||
.then (feed) =>
|
||||
this.items = feed.rss.channel.item
|
||||
this.initializing = false
|
||||
this.update();
|
||||
.catch (err) ->
|
||||
console.error err
|
||||
|
||||
@settings = ~>
|
||||
settings() {
|
||||
@NotImplementedException!
|
||||
</script>
|
||||
</mk-rss-reader-home-widget>
|
||||
|
|
|
|||
|
|
@ -32,78 +32,78 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
@mixin \api
|
||||
@mixin \stream
|
||||
this.mixin('i');
|
||||
this.mixin('api');
|
||||
this.mixin('stream');
|
||||
|
||||
@is-loading = true
|
||||
@is-empty = false
|
||||
@more-loading = false
|
||||
@no-following = @I.following_count == 0
|
||||
this.is-loading = true
|
||||
this.is-empty = false
|
||||
this.more-loading = false
|
||||
this.no-following = @I.following_count == 0
|
||||
|
||||
@on \mount ~>
|
||||
@stream.on \post @on-stream-post
|
||||
@stream.on \follow @on-stream-follow
|
||||
@stream.on \unfollow @on-stream-unfollow
|
||||
this.on('mount', () => {
|
||||
@stream.on 'post' this.on-stream-post
|
||||
@stream.on 'follow' this.on-stream-follow
|
||||
@stream.on 'unfollow' this.on-stream-unfollow
|
||||
|
||||
document.add-event-listener \keydown @on-document-keydown
|
||||
window.add-event-listener \scroll @on-scroll
|
||||
document.add-event-listener 'keydown' this.on-document-keydown
|
||||
window.add-event-listener 'scroll' this.on-scroll
|
||||
|
||||
@load ~>
|
||||
@trigger \loaded
|
||||
@load =>
|
||||
this.trigger('loaded');
|
||||
|
||||
@on \unmount ~>
|
||||
@stream.off \post @on-stream-post
|
||||
@stream.off \follow @on-stream-follow
|
||||
@stream.off \unfollow @on-stream-unfollow
|
||||
this.on('unmount', () => {
|
||||
@stream.off 'post' this.on-stream-post
|
||||
@stream.off 'follow' this.on-stream-follow
|
||||
@stream.off 'unfollow' this.on-stream-unfollow
|
||||
|
||||
document.remove-event-listener \keydown @on-document-keydown
|
||||
window.remove-event-listener \scroll @on-scroll
|
||||
document.remove-event-listener 'keydown' this.on-document-keydown
|
||||
window.remove-event-listener 'scroll' this.on-scroll
|
||||
|
||||
@on-document-keydown = (e) ~>
|
||||
on-document-keydown(e) {
|
||||
tag = e.target.tag-name.to-lower-case!
|
||||
if tag != \input and tag != \textarea
|
||||
if e.which == 84 # t
|
||||
@refs.timeline.focus!
|
||||
if tag != 'input' and tag != 'textarea'
|
||||
if e.which == 84 // t
|
||||
this.refs.timeline.focus();
|
||||
|
||||
@load = (cb) ~>
|
||||
@api \posts/timeline
|
||||
.then (posts) ~>
|
||||
@is-loading = false
|
||||
@is-empty = posts.length == 0
|
||||
@update!
|
||||
@refs.timeline.set-posts posts
|
||||
load(cb) {
|
||||
this.api 'posts/timeline'
|
||||
.then (posts) =>
|
||||
this.is-loading = false
|
||||
this.is-empty = posts.length == 0
|
||||
this.update();
|
||||
this.refs.timeline.set-posts posts
|
||||
if cb? then cb!
|
||||
.catch (err) ~>
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
if cb? then cb!
|
||||
|
||||
@more = ~>
|
||||
if @more-loading or @is-loading or @refs.timeline.posts.length == 0
|
||||
more() {
|
||||
if @more-loading or @is-loading or this.refs.timeline.posts.length == 0
|
||||
return
|
||||
@more-loading = true
|
||||
@update!
|
||||
@api \posts/timeline do
|
||||
max_id: @refs.timeline.tail!.id
|
||||
.then (posts) ~>
|
||||
@more-loading = false
|
||||
@update!
|
||||
@refs.timeline.prepend-posts posts
|
||||
.catch (err) ~>
|
||||
this.more-loading = true
|
||||
this.update();
|
||||
this.api 'posts/timeline' do
|
||||
max_id: this.refs.timeline.tail!.id
|
||||
.then (posts) =>
|
||||
this.more-loading = false
|
||||
this.update();
|
||||
this.refs.timeline.prepend-posts posts
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
|
||||
@on-stream-post = (post) ~>
|
||||
@is-empty = false
|
||||
@update!
|
||||
@refs.timeline.add-post post
|
||||
on-stream-post(post) {
|
||||
this.is-empty = false
|
||||
this.update();
|
||||
this.refs.timeline.add-post post
|
||||
|
||||
@on-stream-follow = ~>
|
||||
on-stream-follow() {
|
||||
@load!
|
||||
|
||||
@on-stream-unfollow = ~>
|
||||
on-stream-unfollow() {
|
||||
@load!
|
||||
|
||||
@on-scroll = ~>
|
||||
on-scroll() {
|
||||
current = window.scroll-y + window.inner-height
|
||||
if current > document.body.offset-height - 8
|
||||
@more!
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@tips = [
|
||||
this.tips = [
|
||||
'<kbd>t</kbd>でタイムラインにフォーカスできます'
|
||||
'<kbd>p</kbd>または<kbd>n</kbd>で投稿フォームを開きます'
|
||||
'投稿フォームにはファイルをドラッグ&ドロップできます'
|
||||
|
|
@ -41,31 +41,31 @@
|
|||
'MisskeyはMIT Licenseです'
|
||||
]
|
||||
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
@set!
|
||||
@clock = set-interval @change, 20000ms
|
||||
this.clock = set-interval @change, 20000ms
|
||||
|
||||
@on \unmount ~>
|
||||
this.on('unmount', () => {
|
||||
clear-interval @clock
|
||||
|
||||
@set = ~>
|
||||
@refs.text.innerHTML = @tips[Math.floor Math.random! * @tips.length]
|
||||
@update!
|
||||
set() {
|
||||
this.refs.text.innerHTML = @tips[Math.floor Math.random! * @tips.length]
|
||||
this.update();
|
||||
|
||||
@change = ~>
|
||||
Velocity @refs.tip, {
|
||||
change() {
|
||||
Velocity this.refs.tip, {
|
||||
opacity: 0
|
||||
} {
|
||||
duration: 500ms
|
||||
easing: \linear
|
||||
easing: 'linear'
|
||||
complete: @set
|
||||
}
|
||||
|
||||
Velocity @refs.tip, {
|
||||
Velocity this.refs.tip, {
|
||||
opacity: 1
|
||||
} {
|
||||
duration: 500ms
|
||||
easing: \linear
|
||||
easing: 'linear'
|
||||
}
|
||||
</script>
|
||||
</mk-tips-home-widget>
|
||||
|
|
|
|||
|
|
@ -109,42 +109,42 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \user-preview
|
||||
this.mixin('api');
|
||||
this.mixin('user-preview');
|
||||
|
||||
@users = null
|
||||
@loading = true
|
||||
this.users = null
|
||||
this.loading = true
|
||||
|
||||
@limit = 3users
|
||||
@page = 0
|
||||
this.limit = 3users
|
||||
this.page = 0
|
||||
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
@fetch!
|
||||
@clock = set-interval ~>
|
||||
this.clock = set-interval =>
|
||||
if @users.length < @limit
|
||||
@fetch true
|
||||
, 60000ms
|
||||
|
||||
@on \unmount ~>
|
||||
this.on('unmount', () => {
|
||||
clear-interval @clock
|
||||
|
||||
@fetch = (quiet = false) ~>
|
||||
@loading = true
|
||||
@users = null
|
||||
if not quiet then @update!
|
||||
@api \users/recommendation do
|
||||
fetch(quiet = false) {
|
||||
this.loading = true
|
||||
this.users = null
|
||||
if not quiet then this.update();
|
||||
this.api 'users/recommendation' do
|
||||
limit: @limit
|
||||
offset: @limit * @page
|
||||
.then (users) ~>
|
||||
@loading = false
|
||||
@users = users
|
||||
@update!
|
||||
.then (users) =>
|
||||
this.loading = false
|
||||
this.users = users
|
||||
this.update();
|
||||
.catch (err, text-status) ->
|
||||
console.error err
|
||||
|
||||
@refresh = ~>
|
||||
refresh() {
|
||||
if @users.length < @limit
|
||||
@page = 0
|
||||
this.page = 0
|
||||
else
|
||||
@page++
|
||||
@fetch!
|
||||
|
|
|
|||
|
|
@ -58,33 +58,33 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
@mode = @opts.mode || \timeline
|
||||
this.mixin('i');
|
||||
this.mode = this.opts.mode || 'timeline'
|
||||
|
||||
# https://github.com/riot/riot/issues/2080
|
||||
if @mode == '' then @mode = \timeline
|
||||
// https://github.com/riot/riot/issues/2080
|
||||
if @mode == '' then this.mode = 'timeline'
|
||||
|
||||
@home = []
|
||||
this.home = []
|
||||
|
||||
@on \mount ~>
|
||||
@refs.tl.on \loaded ~>
|
||||
@trigger \loaded
|
||||
this.on('mount', () => {
|
||||
this.refs.tl.on('loaded', () => {
|
||||
this.trigger('loaded');
|
||||
|
||||
@I.data.home.for-each (widget) ~>
|
||||
@I.data.home.for-each (widget) =>
|
||||
try
|
||||
el = document.create-element \mk- + widget.name + \-home-widget
|
||||
el = document.createElement 'mk-' + widget.name + '-home-widget'
|
||||
switch widget.place
|
||||
| \left => @refs.left.append-child el
|
||||
| \right => @refs.right.append-child el
|
||||
| 'left' => this.refs.left.appendChild el
|
||||
| 'right' => this.refs.right.appendChild el
|
||||
@home.push (riot.mount el, do
|
||||
id: widget.id
|
||||
data: widget.data
|
||||
.0)
|
||||
catch e
|
||||
# noop
|
||||
// noop
|
||||
|
||||
@on \unmount ~>
|
||||
@home.for-each (widget) ~>
|
||||
this.on('unmount', () => {
|
||||
@home.for-each (widget) =>
|
||||
widget.unmount!
|
||||
</script>
|
||||
</mk-home>
|
||||
|
|
|
|||
|
|
@ -35,41 +35,41 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@image = @opts.image
|
||||
this.image = this.opts.image
|
||||
|
||||
@on \mount ~>
|
||||
Velocity @root, {
|
||||
this.on('mount', () => {
|
||||
Velocity this.root, {
|
||||
opacity: 1
|
||||
} {
|
||||
duration: 100ms
|
||||
easing: \linear
|
||||
easing: 'linear'
|
||||
}
|
||||
|
||||
#Velocity @img, {
|
||||
# scale: 1
|
||||
# opacity: 1
|
||||
// scale: 1
|
||||
// opacity: 1
|
||||
#} {
|
||||
# duration: 200ms
|
||||
# easing: \ease-out
|
||||
// duration: 200ms
|
||||
// easing: 'ease-out'
|
||||
#}
|
||||
|
||||
@close = ~>
|
||||
Velocity @root, {
|
||||
close() {
|
||||
Velocity this.root, {
|
||||
opacity: 0
|
||||
} {
|
||||
duration: 100ms
|
||||
easing: \linear
|
||||
complete: ~> @unmount!
|
||||
easing: 'linear'
|
||||
complete: => this.unmount();
|
||||
}
|
||||
|
||||
#Velocity @img, {
|
||||
# scale: 0.9
|
||||
# opacity: 0
|
||||
// scale: 0.9
|
||||
// opacity: 0
|
||||
#} {
|
||||
# duration: 200ms
|
||||
# easing: \ease-in
|
||||
# complete: ~>
|
||||
# @unmount!
|
||||
// duration: 200ms
|
||||
// easing: 'ease-in'
|
||||
// complete: =>
|
||||
// this.unmount();
|
||||
#}
|
||||
</script>
|
||||
</mk-image-dialog>
|
||||
|
|
|
|||
|
|
@ -26,19 +26,19 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@images = @opts.images
|
||||
@image = @images.0
|
||||
this.images = this.opts.images
|
||||
this.image = @images.0
|
||||
|
||||
@mousemove = (e) ~>
|
||||
rect = @refs.view.get-bounding-client-rect!
|
||||
mousemove(e) {
|
||||
rect = this.refs.view.get-bounding-client-rect!
|
||||
mouse-x = e.client-x - rect.left
|
||||
mouse-y = e.client-y - rect.top
|
||||
xp = mouse-x / @refs.view.offset-width * 100
|
||||
yp = mouse-y / @refs.view.offset-height * 100
|
||||
@refs.view.style.background-position = xp + '% ' + yp + '%'
|
||||
xp = mouse-x / this.refs.view.offset-width * 100
|
||||
yp = mouse-y / this.refs.view.offset-height * 100
|
||||
this.refs.view.style.background-position = xp + '% ' + yp + '%'
|
||||
|
||||
@click = ~>
|
||||
dialog = document.body.append-child document.create-element \mk-image-dialog
|
||||
click() {
|
||||
dialog = document.body.appendChild document.createElement 'mk-image-dialog'
|
||||
riot.mount dialog, do
|
||||
image: @image
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -116,40 +116,40 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@done = false
|
||||
this.done = false
|
||||
|
||||
@title = @opts.title
|
||||
@placeholder = @opts.placeholder
|
||||
@default = @opts.default
|
||||
@allow-empty = if @opts.allow-empty? then @opts.allow-empty else true
|
||||
this.title = this.opts.title
|
||||
this.placeholder = this.opts.placeholder
|
||||
this.default = this.opts.default
|
||||
this.allow-empty = if this.opts.allow-empty? then this.opts.allow-empty else true
|
||||
|
||||
@on \mount ~>
|
||||
@text = @refs.window.refs.text
|
||||
this.on('mount', () => {
|
||||
this.text = this.refs.window.refs.text
|
||||
if @default?
|
||||
@text.value = @default
|
||||
@text.focus!
|
||||
@text.focus();
|
||||
|
||||
@refs.window.on \closing ~>
|
||||
this.refs.window.on('closing', () => {
|
||||
if @done
|
||||
@opts.on-ok @text.value
|
||||
this.opts.on-ok @text.value
|
||||
else
|
||||
if @opts.on-cancel?
|
||||
@opts.on-cancel!
|
||||
if this.opts.on-cancel?
|
||||
this.opts.on-cancel!
|
||||
|
||||
@refs.window.on \closed ~>
|
||||
@unmount!
|
||||
this.refs.window.on('closed', () => {
|
||||
this.unmount();
|
||||
|
||||
@cancel = ~>
|
||||
@done = false
|
||||
@refs.window.close!
|
||||
cancel() {
|
||||
this.done = false
|
||||
this.refs.window.close!
|
||||
|
||||
@ok = ~>
|
||||
ok() {
|
||||
if not @allow-empty and @text.value == '' then return
|
||||
@done = true
|
||||
@refs.window.close!
|
||||
this.done = true
|
||||
this.refs.window.close!
|
||||
|
||||
@on-keydown = (e) ~>
|
||||
if e.which == 13 # Enter
|
||||
on-keydown(e) {
|
||||
if e.which == 13 // Enter
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
@ok!
|
||||
|
|
|
|||
|
|
@ -93,5 +93,5 @@
|
|||
right 16px
|
||||
|
||||
</style>
|
||||
<script>@user = @opts.user</script>
|
||||
<script>this.user = this.opts.user</script>
|
||||
</mk-list-user>
|
||||
|
|
|
|||
|
|
@ -19,10 +19,10 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@user = @opts.user
|
||||
this.user = this.opts.user
|
||||
|
||||
@on \mount ~>
|
||||
@refs.window.on \closed ~>
|
||||
@unmount!
|
||||
this.on('mount', () => {
|
||||
this.refs.window.on('closed', () => {
|
||||
this.unmount();
|
||||
</script>
|
||||
</mk-messaging-room-window>
|
||||
|
|
|
|||
|
|
@ -19,12 +19,12 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@on \mount ~>
|
||||
@refs.window.on \closed ~>
|
||||
@unmount!
|
||||
this.on('mount', () => {
|
||||
this.refs.window.on('closed', () => {
|
||||
this.unmount();
|
||||
|
||||
@refs.window.refs.index.on \navigate-user (user) ~>
|
||||
w = document.body.append-child document.create-element \mk-messaging-room-window
|
||||
this.refs.window.refs.index.on('navigate-user', user => {
|
||||
w = document.body.appendChild document.createElement 'mk-messaging-room-window'
|
||||
riot.mount w, do
|
||||
user: user
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -177,34 +177,34 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \stream
|
||||
@mixin \user-preview
|
||||
@mixin \get-post-summary
|
||||
this.mixin('api');
|
||||
this.mixin('stream');
|
||||
this.mixin('user-preview');
|
||||
this.mixin('get-post-summary');
|
||||
|
||||
@notifications = []
|
||||
@loading = true
|
||||
this.notifications = []
|
||||
this.loading = true
|
||||
|
||||
@on \mount ~>
|
||||
@api \i/notifications
|
||||
.then (notifications) ~>
|
||||
@notifications = notifications
|
||||
@loading = false
|
||||
@update!
|
||||
this.on('mount', () => {
|
||||
this.api 'i/notifications'
|
||||
.then (notifications) =>
|
||||
this.notifications = notifications
|
||||
this.loading = false
|
||||
this.update();
|
||||
.catch (err, text-status) ->
|
||||
console.error err
|
||||
|
||||
@stream.on \notification @on-notification
|
||||
@stream.on 'notification' this.on-notification
|
||||
|
||||
@on \unmount ~>
|
||||
@stream.off \notification @on-notification
|
||||
this.on('unmount', () => {
|
||||
@stream.off 'notification' this.on-notification
|
||||
|
||||
@on-notification = (notification) ~>
|
||||
on-notification(notification) {
|
||||
@notifications.unshift notification
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
@on \update ~>
|
||||
@notifications.for-each (notification) ~>
|
||||
this.on('update', () => {
|
||||
@notifications.for-each (notification) =>
|
||||
date = (new Date notification.created_at).get-date!
|
||||
month = (new Date notification.created_at).get-month! + 1
|
||||
notification._date = date
|
||||
|
|
|
|||
|
|
@ -63,18 +63,18 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mode = \signin
|
||||
this.mode = 'signin'
|
||||
|
||||
@signup = ~>
|
||||
@mode = \signup
|
||||
@update!
|
||||
signup() {
|
||||
this.mode = 'signup'
|
||||
this.update();
|
||||
|
||||
@signin = ~>
|
||||
@mode = \signin
|
||||
@update!
|
||||
signin() {
|
||||
this.mode = 'signin'
|
||||
this.update();
|
||||
|
||||
@introduction = ~>
|
||||
@mode = \introduction
|
||||
@update!
|
||||
introduction() {
|
||||
this.mode = 'introduction'
|
||||
this.update();
|
||||
</script>
|
||||
</mk-entrance>
|
||||
|
|
|
|||
|
|
@ -119,12 +119,12 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@on \mount ~>
|
||||
@refs.signin.on \user (user) ~>
|
||||
this.on('mount', () => {
|
||||
this.refs.signin.on('user', (user) => {
|
||||
@update do
|
||||
user: user
|
||||
|
||||
@introduction = ~>
|
||||
@parent.introduction!
|
||||
introduction() {
|
||||
this.parent.introduction!
|
||||
</script>
|
||||
</mk-entrance-signin>
|
||||
|
|
|
|||
|
|
@ -8,40 +8,40 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
@mixin \api
|
||||
@mixin \ui-progress
|
||||
@mixin \stream
|
||||
@mixin \get-post-summary
|
||||
this.mixin('i');
|
||||
this.mixin('api');
|
||||
this.mixin('ui-progress');
|
||||
this.mixin('stream');
|
||||
this.mixin('get-post-summary');
|
||||
|
||||
@unread-count = 0
|
||||
this.unread-count = 0
|
||||
|
||||
@page = switch @opts.mode
|
||||
| \timelie => \home
|
||||
| \mentions => \mentions
|
||||
| _ => \home
|
||||
this.page = switch this.opts.mode
|
||||
| 'timelie' => 'home'
|
||||
| 'mentions' => 'mentions'
|
||||
| _ => 'home'
|
||||
|
||||
@on \mount ~>
|
||||
@refs.ui.refs.home.on \loaded ~>
|
||||
@Progress.done!
|
||||
this.on('mount', () => {
|
||||
this.refs.ui.refs.home.on('loaded', () => {
|
||||
this.Progress.done();
|
||||
|
||||
document.title = 'Misskey'
|
||||
@Progress.start!
|
||||
@stream.on \post @on-stream-post
|
||||
document.add-event-listener \visibilitychange @window-on-visibilitychange, false
|
||||
this.Progress.start();
|
||||
@stream.on 'post' this.on-stream-post
|
||||
document.add-event-listener 'visibilitychange' @window-on-visibilitychange, false
|
||||
|
||||
@on \unmount ~>
|
||||
@stream.off \post @on-stream-post
|
||||
document.remove-event-listener \visibilitychange @window-on-visibilitychange
|
||||
this.on('unmount', () => {
|
||||
@stream.off 'post' this.on-stream-post
|
||||
document.remove-event-listener 'visibilitychange' @window-on-visibilitychange
|
||||
|
||||
@on-stream-post = (post) ~>
|
||||
on-stream-post(post) {
|
||||
if document.hidden and post.user_id !== @I.id
|
||||
@unread-count++
|
||||
document.title = '(' + @unread-count + ') ' + @get-post-summary post
|
||||
|
||||
@window-on-visibilitychange = ~>
|
||||
window-on-visibilitychange() {
|
||||
if !document.hidden
|
||||
@unread-count = 0
|
||||
this.unread-count = 0
|
||||
document.title = 'Misskey'
|
||||
</script>
|
||||
</mk-home-page>
|
||||
|
|
|
|||
|
|
@ -16,17 +16,17 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \ui-progress
|
||||
this.mixin('ui-progress');
|
||||
|
||||
@post = @opts.post
|
||||
this.post = this.opts.post
|
||||
|
||||
@on \mount ~>
|
||||
@Progress.start!
|
||||
this.on('mount', () => {
|
||||
this.Progress.start();
|
||||
|
||||
@refs.ui.refs.detail.on \post-fetched ~>
|
||||
@Progress.set 0.5
|
||||
this.refs.ui.refs.detail.on('post-fetched', () => {
|
||||
this.Progress.set(0.5);
|
||||
|
||||
@refs.ui.refs.detail.on \loaded ~>
|
||||
@Progress.done!
|
||||
this.refs.ui.refs.detail.on('loaded', () => {
|
||||
this.Progress.done();
|
||||
</script>
|
||||
</mk-post-page>
|
||||
|
|
|
|||
|
|
@ -8,12 +8,12 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \ui-progress
|
||||
this.mixin('ui-progress');
|
||||
|
||||
@on \mount ~>
|
||||
@Progress.start!
|
||||
this.on('mount', () => {
|
||||
this.Progress.start();
|
||||
|
||||
@refs.ui.refs.search.on \loaded ~>
|
||||
@Progress.done!
|
||||
this.refs.ui.refs.search.on('loaded', () => {
|
||||
this.Progress.done();
|
||||
</script>
|
||||
</mk-search-page>
|
||||
|
|
|
|||
|
|
@ -8,18 +8,18 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \ui-progress
|
||||
this.mixin('ui-progress');
|
||||
|
||||
@user = @opts.user
|
||||
this.user = this.opts.user
|
||||
|
||||
@on \mount ~>
|
||||
@Progress.start!
|
||||
this.on('mount', () => {
|
||||
this.Progress.start();
|
||||
|
||||
@refs.ui.refs.user.on \user-fetched (user) ~>
|
||||
@Progress.set 0.5
|
||||
this.refs.ui.refs.user.on('user-fetched', (user) => {
|
||||
this.Progress.set(0.5);
|
||||
document.title = user.name + ' | Misskey'
|
||||
|
||||
@refs.ui.refs.user.on \loaded ~>
|
||||
@Progress.done!
|
||||
this.refs.ui.refs.user.on('loaded', () => {
|
||||
this.Progress.done();
|
||||
</script>
|
||||
</mk-user-page>
|
||||
|
|
|
|||
|
|
@ -103,38 +103,38 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \text
|
||||
@mixin \date-stringify
|
||||
@mixin \user-preview
|
||||
this.mixin('api');
|
||||
this.mixin('text');
|
||||
this.mixin('date-stringify');
|
||||
this.mixin('user-preview');
|
||||
|
||||
@post = @opts.post
|
||||
this.post = this.opts.post
|
||||
|
||||
@url = CONFIG.url + '/' + @post.user.username + '/' + @post.id
|
||||
this.url = CONFIG.url + '/' + @post.user.username + '/' + @post.id
|
||||
|
||||
@title = @date-stringify @post.created_at
|
||||
this.title = @date-stringify @post.created_at
|
||||
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
if @post.text?
|
||||
tokens = @analyze @post.text
|
||||
@refs.text.innerHTML = @compile tokens
|
||||
this.refs.text.innerHTML = @compile tokens
|
||||
|
||||
@refs.text.children.for-each (e) ~>
|
||||
if e.tag-name == \MK-URL
|
||||
this.refs.text.children.for-each (e) =>
|
||||
if e.tag-name == 'MK-URL'
|
||||
riot.mount e
|
||||
|
||||
@like = ~>
|
||||
like() {
|
||||
if @post.is_liked
|
||||
@api \posts/likes/delete do
|
||||
this.api 'posts/likes/delete' do
|
||||
post_id: @post.id
|
||||
.then ~>
|
||||
.then =>
|
||||
@post.is_liked = false
|
||||
@update!
|
||||
this.update();
|
||||
else
|
||||
@api \posts/likes/create do
|
||||
this.api 'posts/likes/create' do
|
||||
post_id: @post.id
|
||||
.then ~>
|
||||
.then =>
|
||||
@post.is_liked = true
|
||||
@update!
|
||||
this.update();
|
||||
</script>
|
||||
</mk-post-detail-sub>
|
||||
|
|
|
|||
|
|
@ -329,108 +329,108 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \text
|
||||
@mixin \user-preview
|
||||
@mixin \date-stringify
|
||||
@mixin \NotImplementedException
|
||||
this.mixin('api');
|
||||
this.mixin('text');
|
||||
this.mixin('user-preview');
|
||||
this.mixin('date-stringify');
|
||||
this.mixin('NotImplementedException');
|
||||
|
||||
@fetching = true
|
||||
@loading-context = false
|
||||
@content = null
|
||||
@post = null
|
||||
this.fetching = true
|
||||
this.loading-context = false
|
||||
this.content = null
|
||||
this.post = null
|
||||
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
|
||||
@api \posts/show do
|
||||
post_id: @opts.post
|
||||
.then (post) ~>
|
||||
@fetching = false
|
||||
@post = post
|
||||
@trigger \loaded
|
||||
this.api 'posts/show' do
|
||||
post_id: this.opts.post
|
||||
.then (post) =>
|
||||
this.fetching = false
|
||||
this.post = post
|
||||
this.trigger('loaded');
|
||||
|
||||
@is-repost = @post.repost?
|
||||
@p = if @is-repost then @post.repost else @post
|
||||
this.is-repost = @post.repost?
|
||||
this.p = if @is-repost then @post.repost else @post
|
||||
|
||||
@title = @date-stringify @p.created_at
|
||||
this.title = @date-stringify @p.created_at
|
||||
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
if @p.text?
|
||||
tokens = @analyze @p.text
|
||||
@refs.text.innerHTML = @compile tokens
|
||||
this.refs.text.innerHTML = @compile tokens
|
||||
|
||||
@refs.text.children.for-each (e) ~>
|
||||
if e.tag-name == \MK-URL
|
||||
this.refs.text.children.for-each (e) =>
|
||||
if e.tag-name == 'MK-URL'
|
||||
riot.mount e
|
||||
|
||||
# URLをプレビュー
|
||||
// URLをプレビュー
|
||||
tokens
|
||||
.filter (t) -> t.type == \link
|
||||
.map (t) ~>
|
||||
@preview = @refs.text.append-child document.create-element \mk-url-preview
|
||||
.filter (t) -> t.type == 'link'
|
||||
.map (t) =>
|
||||
this.preview = this.refs.text.appendChild document.createElement 'mk-url-preview'
|
||||
riot.mount @preview, do
|
||||
url: t.content
|
||||
|
||||
# Get likes
|
||||
@api \posts/likes do
|
||||
// Get likes
|
||||
this.api 'posts/likes' do
|
||||
post_id: @p.id
|
||||
limit: 8
|
||||
.then (likes) ~>
|
||||
@likes = likes
|
||||
@update!
|
||||
.then (likes) =>
|
||||
this.likes = likes
|
||||
this.update();
|
||||
|
||||
# Get reposts
|
||||
@api \posts/reposts do
|
||||
// Get reposts
|
||||
this.api 'posts/reposts' do
|
||||
post_id: @p.id
|
||||
limit: 8
|
||||
.then (reposts) ~>
|
||||
@reposts = reposts
|
||||
@update!
|
||||
.then (reposts) =>
|
||||
this.reposts = reposts
|
||||
this.update();
|
||||
|
||||
# Get replies
|
||||
@api \posts/replies do
|
||||
// Get replies
|
||||
this.api 'posts/replies' do
|
||||
post_id: @p.id
|
||||
limit: 8
|
||||
.then (replies) ~>
|
||||
@replies = replies
|
||||
@update!
|
||||
.then (replies) =>
|
||||
this.replies = replies
|
||||
this.update();
|
||||
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
@reply = ~>
|
||||
form = document.body.append-child document.create-element \mk-post-form-window
|
||||
reply() {
|
||||
form = document.body.appendChild document.createElement 'mk-post-form-window'
|
||||
riot.mount form, do
|
||||
reply: @p
|
||||
|
||||
@repost = ~>
|
||||
form = document.body.append-child document.create-element \mk-repost-form-window
|
||||
repost() {
|
||||
form = document.body.appendChild document.createElement 'mk-repost-form-window'
|
||||
riot.mount form, do
|
||||
post: @p
|
||||
|
||||
@like = ~>
|
||||
like() {
|
||||
if @p.is_liked
|
||||
@api \posts/likes/delete do
|
||||
this.api 'posts/likes/delete' do
|
||||
post_id: @p.id
|
||||
.then ~>
|
||||
.then =>
|
||||
@p.is_liked = false
|
||||
@update!
|
||||
this.update();
|
||||
else
|
||||
@api \posts/likes/create do
|
||||
this.api 'posts/likes/create' do
|
||||
post_id: @p.id
|
||||
.then ~>
|
||||
.then =>
|
||||
@p.is_liked = true
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
@load-context = ~>
|
||||
@loading-context = true
|
||||
load-context() {
|
||||
this.loading-context = true
|
||||
|
||||
# Get context
|
||||
@api \posts/context do
|
||||
// Get context
|
||||
this.api 'posts/context' do
|
||||
post_id: @p.reply_to_id
|
||||
.then (context) ~>
|
||||
@context = context.reverse!
|
||||
@loading-context = false
|
||||
@update!
|
||||
.then (context) =>
|
||||
this.context = context.reverse!
|
||||
this.loading-context = false
|
||||
this.update();
|
||||
</script>
|
||||
</mk-post-detail>
|
||||
|
|
|
|||
|
|
@ -32,24 +32,24 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@uploading-files = []
|
||||
@files = []
|
||||
this.uploading-files = []
|
||||
this.files = []
|
||||
|
||||
@on \mount ~>
|
||||
@refs.window.refs.form.focus!
|
||||
this.on('mount', () => {
|
||||
this.refs.window.refs.form.focus();
|
||||
|
||||
@refs.window.on \closed ~>
|
||||
@unmount!
|
||||
this.refs.window.on('closed', () => {
|
||||
this.unmount();
|
||||
|
||||
@refs.window.refs.form.on \post ~>
|
||||
@refs.window.close!
|
||||
this.refs.window.refs.form.on('post', () => {
|
||||
this.refs.window.close!
|
||||
|
||||
@refs.window.refs.form.on \change-uploading-files (files) ~>
|
||||
@uploading-files = files
|
||||
@update!
|
||||
this.refs.window.refs.form.on('change-uploading-files', (files) => {
|
||||
this.uploading-files = files
|
||||
this.update();
|
||||
|
||||
@refs.window.refs.form.on \change-files (files) ~>
|
||||
@files = files
|
||||
@update!
|
||||
this.refs.window.refs.form.on('change-files', (files) => {
|
||||
this.files = files
|
||||
this.update();
|
||||
</script>
|
||||
</mk-post-form-window>
|
||||
|
|
|
|||
|
|
@ -305,161 +305,161 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
get-cat = require '../../common/scripts/get-cat'
|
||||
get-cat = require('../../common/scripts/get-cat');
|
||||
|
||||
@mixin \api
|
||||
@mixin \notify
|
||||
@mixin \autocomplete
|
||||
this.mixin('api');
|
||||
this.mixin('notify');
|
||||
this.mixin('autocomplete');
|
||||
|
||||
@wait = false
|
||||
@uploadings = []
|
||||
@files = []
|
||||
@autocomplete = null
|
||||
@poll = false
|
||||
this.wait = false
|
||||
this.uploadings = []
|
||||
this.files = []
|
||||
this.autocomplete = null
|
||||
this.poll = false
|
||||
|
||||
@in-reply-to-post = @opts.reply
|
||||
this.in-reply-to-post = this.opts.reply
|
||||
|
||||
# https://github.com/riot/riot/issues/2080
|
||||
if @in-reply-to-post == '' then @in-reply-to-post = null
|
||||
// https://github.com/riot/riot/issues/2080
|
||||
if @in-reply-to-post == '' then this.in-reply-to-post = null
|
||||
|
||||
@on \mount ~>
|
||||
@refs.uploader.on \uploaded (file) ~>
|
||||
this.on('mount', () => {
|
||||
this.refs.uploader.on('uploaded', (file) => {
|
||||
@add-file file
|
||||
|
||||
@refs.uploader.on \change-uploads (uploads) ~>
|
||||
@trigger \change-uploading-files uploads
|
||||
this.refs.uploader.on('change-uploads', (uploads) => {
|
||||
this.trigger 'change-uploading-files' uploads
|
||||
|
||||
@autocomplete = new @Autocomplete @refs.text
|
||||
this.autocomplete = new @Autocomplete this.refs.text
|
||||
@autocomplete.attach!
|
||||
|
||||
@on \unmount ~>
|
||||
this.on('unmount', () => {
|
||||
@autocomplete.detach!
|
||||
|
||||
@focus = ~>
|
||||
@refs.text.focus!
|
||||
focus() {
|
||||
this.refs.text.focus();
|
||||
|
||||
@clear = ~>
|
||||
@refs.text.value = ''
|
||||
@files = []
|
||||
@trigger \change-files
|
||||
@update!
|
||||
clear() {
|
||||
this.refs.text.value = ''
|
||||
this.files = []
|
||||
this.trigger('change-files');
|
||||
this.update();
|
||||
|
||||
@ondragover = (e) ~>
|
||||
ondragover(e) {
|
||||
e.stop-propagation!
|
||||
@draghover = true
|
||||
# ドラッグされてきたものがファイルだったら
|
||||
if e.data-transfer.effect-allowed == \all
|
||||
e.data-transfer.drop-effect = \copy
|
||||
this.draghover = true
|
||||
// ドラッグされてきたものがファイルだったら
|
||||
if e.data-transfer.effect-allowed == 'all'
|
||||
e.data-transfer.drop-effect = 'copy'
|
||||
else
|
||||
e.data-transfer.drop-effect = \move
|
||||
e.data-transfer.drop-effect = 'move'
|
||||
return false
|
||||
|
||||
@ondragenter = (e) ~>
|
||||
@draghover = true
|
||||
ondragenter(e) {
|
||||
this.draghover = true
|
||||
|
||||
@ondragleave = (e) ~>
|
||||
@draghover = false
|
||||
ondragleave(e) {
|
||||
this.draghover = false
|
||||
|
||||
@ondrop = (e) ~>
|
||||
ondrop(e) {
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
@draghover = false
|
||||
this.draghover = false
|
||||
|
||||
# ファイルだったら
|
||||
// ファイルだったら
|
||||
if e.data-transfer.files.length > 0
|
||||
Array.prototype.for-each.call e.data-transfer.files, (file) ~>
|
||||
Array.prototype.for-each.call e.data-transfer.files, (file) =>
|
||||
@upload file
|
||||
return false
|
||||
|
||||
# データ取得
|
||||
// データ取得
|
||||
data = e.data-transfer.get-data 'text'
|
||||
if !data?
|
||||
return false
|
||||
|
||||
try
|
||||
# パース
|
||||
// パース
|
||||
obj = JSON.parse data
|
||||
|
||||
# (ドライブの)ファイルだったら
|
||||
if obj.type == \file
|
||||
// (ドライブの)ファイルだったら
|
||||
if obj.type == 'file'
|
||||
@add-file obj.file
|
||||
catch
|
||||
# ignore
|
||||
// ignore
|
||||
|
||||
return false
|
||||
|
||||
@onkeydown = (e) ~>
|
||||
if (e.which == 10 || e.which == 13) && (e.ctrl-key || e.meta-key)
|
||||
onkeydown(e) {
|
||||
if (e.which == 10 || e.which == 13) && (e.ctrlKey || e.meta-key)
|
||||
@post!
|
||||
|
||||
@onpaste = (e) ~>
|
||||
data = e.clipboard-data
|
||||
onpaste(e) {
|
||||
data = e.clipboardData
|
||||
items = data.items
|
||||
for i from 0 to items.length - 1
|
||||
item = items[i]
|
||||
switch (item.kind)
|
||||
| \file =>
|
||||
@upload item.get-as-file!
|
||||
| 'file' =>
|
||||
@upload item.getAsFile();
|
||||
|
||||
@select-file = ~>
|
||||
@refs.file.click!
|
||||
select-file() {
|
||||
this.refs.file.click!
|
||||
|
||||
@select-file-from-drive = ~>
|
||||
browser = document.body.append-child document.create-element \mk-select-file-from-drive-window
|
||||
select-file-from-drive() {
|
||||
browser = document.body.appendChild document.createElement 'mk-select-file-from-drive-window'
|
||||
i = riot.mount browser, do
|
||||
multiple: true
|
||||
i[0].one \selected (files) ~>
|
||||
i[0].one 'selected' (files) =>
|
||||
files.for-each @add-file
|
||||
|
||||
@change-file = ~>
|
||||
files = @refs.file.files
|
||||
change-file() {
|
||||
files = this.refs.file.files
|
||||
for i from 0 to files.length - 1
|
||||
file = files.item i
|
||||
@upload file
|
||||
|
||||
@upload = (file) ~>
|
||||
@refs.uploader.upload file
|
||||
upload(file) {
|
||||
this.refs.uploader.upload file
|
||||
|
||||
@add-file = (file) ~>
|
||||
file._remove = ~>
|
||||
@files = @files.filter (x) -> x.id != file.id
|
||||
@trigger \change-files @files
|
||||
@update!
|
||||
add-file(file) {
|
||||
file._remove = =>
|
||||
this.files = @files.filter (x) -> x.id != file.id
|
||||
this.trigger 'change-files' @files
|
||||
this.update();
|
||||
|
||||
@files.push file
|
||||
@trigger \change-files @files
|
||||
@update!
|
||||
this.trigger 'change-files' @files
|
||||
this.update();
|
||||
|
||||
@add-poll = ~>
|
||||
@poll = true
|
||||
add-poll() {
|
||||
this.poll = true
|
||||
|
||||
@on-poll-destroyed = ~>
|
||||
on-poll-destroyed() {
|
||||
@update do
|
||||
poll: false
|
||||
|
||||
@post = (e) ~>
|
||||
@wait = true
|
||||
post(e) {
|
||||
this.wait = true
|
||||
|
||||
files = if @files? and @files.length > 0
|
||||
then @files.map (f) -> f.id
|
||||
else undefined
|
||||
|
||||
@api \posts/create do
|
||||
text: @refs.text.value
|
||||
this.api 'posts/create' do
|
||||
text: this.refs.text.value
|
||||
media_ids: files
|
||||
reply_to_id: if @in-reply-to-post? then @in-reply-to-post.id else undefined
|
||||
poll: if @poll then @refs.poll.get! else undefined
|
||||
.then (data) ~>
|
||||
@trigger \post
|
||||
poll: if @poll then this.refs.poll.get! else undefined
|
||||
.then (data) =>
|
||||
this.trigger('post');
|
||||
@notify if @in-reply-to-post? then '返信しました！' else '投稿しました！'
|
||||
.catch (err) ~>
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
@notify '投稿できませんでした'
|
||||
.then ~>
|
||||
@wait = false
|
||||
@update!
|
||||
.then =>
|
||||
this.wait = false
|
||||
this.update();
|
||||
|
||||
@cat = ~>
|
||||
@refs.text.value = @refs.text.value + get-cat!
|
||||
cat() {
|
||||
this.refs.text.value = this.refs.text.value + get-cat!
|
||||
</script>
|
||||
</mk-post-form>
|
||||
|
|
|
|||
|
|
@ -83,11 +83,11 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \date-stringify
|
||||
@mixin \user-preview
|
||||
this.mixin('date-stringify');
|
||||
this.mixin('user-preview');
|
||||
|
||||
@post = @opts.post
|
||||
this.post = this.opts.post
|
||||
|
||||
@title = @date-stringify @post.created_at
|
||||
this.title = @date-stringify @post.created_at
|
||||
</script>
|
||||
</mk-post-preview>
|
||||
|
|
|
|||
|
|
@ -9,64 +9,64 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \is-promise
|
||||
this.mixin('api');
|
||||
this.mixin('is-promise');
|
||||
|
||||
@post = null
|
||||
@post-promise = if @is-promise @opts.post then @opts.post else Promise.resolve @opts.post
|
||||
this.post = null
|
||||
this.post-promise = if @is-promise this.opts.post then this.opts.post else Promise.resolve this.opts.post
|
||||
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
post <~ @post-promise.then
|
||||
@post = post
|
||||
@update!
|
||||
this.post = post
|
||||
this.update();
|
||||
|
||||
@api \aggregation/posts/like do
|
||||
this.api 'aggregation/posts/like' do
|
||||
post_id: @post.id
|
||||
limit: 30days
|
||||
.then (likes) ~>
|
||||
.then (likes) =>
|
||||
likes = likes.reverse!
|
||||
|
||||
@api \aggregation/posts/repost do
|
||||
this.api 'aggregation/posts/repost' do
|
||||
post_id: @post.id
|
||||
limit: 30days
|
||||
.then (repost) ~>
|
||||
.then (repost) =>
|
||||
repost = repost.reverse!
|
||||
|
||||
@api \aggregation/posts/reply do
|
||||
this.api 'aggregation/posts/reply' do
|
||||
post_id: @post.id
|
||||
limit: 30days
|
||||
.then (replies) ~>
|
||||
.then (replies) =>
|
||||
replies = replies.reverse!
|
||||
|
||||
new Chart @refs.canv, do
|
||||
type: \bar
|
||||
new Chart this.refs.canv, do
|
||||
type: 'bar'
|
||||
data:
|
||||
labels: likes.map (x, i) ~> if i % 3 == 2 then x.date.day + '日' else ''
|
||||
labels: likes.map (x, i) => if i % 3 == 2 then x.date.day + '日' else ''
|
||||
datasets: [
|
||||
{
|
||||
label: \いいね
|
||||
type: \line
|
||||
data: likes.map (x) ~> x.count
|
||||
label: 'いいね'
|
||||
type: 'line'
|
||||
data: likes.map (x) => x.count
|
||||
line-tension: 0
|
||||
border-width: 2
|
||||
fill: true
|
||||
background-color: 'rgba(247, 121, 108, 0.2)'
|
||||
point-background-color: \#fff
|
||||
point-background-color: '#fff'
|
||||
point-radius: 4
|
||||
point-border-width: 2
|
||||
border-color: \#F7796C
|
||||
border-color: '#F7796C'
|
||||
},
|
||||
{
|
||||
label: \返信
|
||||
type: \bar
|
||||
data: replies.map (x) ~> x.count
|
||||
background-color: \#555
|
||||
label: '返信'
|
||||
type: 'bar'
|
||||
data: replies.map (x) => x.count
|
||||
background-color: '#555'
|
||||
},
|
||||
{
|
||||
label: \Repost
|
||||
type: \bar
|
||||
data: repost.map (x) ~> x.count
|
||||
background-color: \#a2d61e
|
||||
label: 'Repost'
|
||||
type: 'bar'
|
||||
data: repost.map (x) => x.count
|
||||
background-color: '#a2d61e'
|
||||
}
|
||||
]
|
||||
options:
|
||||
|
|
|
|||
|
|
@ -75,20 +75,20 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@title = @opts.title
|
||||
@value = parse-int @opts.value, 10
|
||||
@max = parse-int @opts.max, 10
|
||||
this.title = this.opts.title
|
||||
this.value = parse-int this.opts.value, 10
|
||||
this.max = parse-int this.opts.max, 10
|
||||
|
||||
@on \mount ~>
|
||||
@refs.window.on \closed ~>
|
||||
@unmount!
|
||||
this.on('mount', () => {
|
||||
this.refs.window.on('closed', () => {
|
||||
this.unmount();
|
||||
|
||||
@update-progress = (value, max) ~>
|
||||
@value = parse-int value, 10
|
||||
@max = parse-int max, 10
|
||||
@update!
|
||||
update-progress(value, max) {
|
||||
this.value = parse-int value, 10
|
||||
this.max = parse-int max, 10
|
||||
this.update();
|
||||
|
||||
@close = ~>
|
||||
@refs.window.close!
|
||||
close() {
|
||||
this.refs.window.close!
|
||||
</script>
|
||||
</mk-progress-dialog>
|
||||
|
|
|
|||
|
|
@ -12,25 +12,25 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@on-document-keydown = (e) ~>
|
||||
on-document-keydown(e) {
|
||||
tag = e.target.tag-name.to-lower-case!
|
||||
if tag != \input and tag != \textarea
|
||||
if e.which == 27 # Esc
|
||||
@refs.window.close!
|
||||
if tag != 'input' and tag != 'textarea'
|
||||
if e.which == 27 // Esc
|
||||
this.refs.window.close!
|
||||
|
||||
@on \mount ~>
|
||||
@refs.window.refs.form.on \cancel ~>
|
||||
@refs.window.close!
|
||||
this.on('mount', () => {
|
||||
this.refs.window.refs.form.on('cancel', () => {
|
||||
this.refs.window.close!
|
||||
|
||||
@refs.window.refs.form.on \posted ~>
|
||||
@refs.window.close!
|
||||
this.refs.window.refs.form.on('posted', () => {
|
||||
this.refs.window.close!
|
||||
|
||||
document.add-event-listener \keydown @on-document-keydown
|
||||
document.add-event-listener 'keydown' this.on-document-keydown
|
||||
|
||||
@refs.window.on \closed ~>
|
||||
@unmount!
|
||||
this.refs.window.on('closed', () => {
|
||||
this.unmount();
|
||||
|
||||
@on \unmount ~>
|
||||
document.remove-event-listener \keydown @on-document-keydown
|
||||
this.on('unmount', () => {
|
||||
document.remove-event-listener 'keydown' this.on-document-keydown
|
||||
</script>
|
||||
</mk-repost-form-window>
|
||||
|
|
|
|||
|
|
@ -114,31 +114,31 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \notify
|
||||
this.mixin('api');
|
||||
this.mixin('notify');
|
||||
|
||||
@wait = false
|
||||
@quote = false
|
||||
this.wait = false
|
||||
this.quote = false
|
||||
|
||||
@cancel = ~>
|
||||
@trigger \cancel
|
||||
cancel() {
|
||||
this.trigger('cancel');
|
||||
|
||||
@ok = ~>
|
||||
@wait = true
|
||||
@api \posts/create do
|
||||
repost_id: @opts.post.id
|
||||
text: if @quote then @refs.text.value else undefined
|
||||
.then (data) ~>
|
||||
@trigger \posted
|
||||
ok() {
|
||||
this.wait = true
|
||||
this.api 'posts/create' do
|
||||
repost_id: this.opts.post.id
|
||||
text: if @quote then this.refs.text.value else undefined
|
||||
.then (data) =>
|
||||
this.trigger('posted');
|
||||
@notify 'Repostしました！'
|
||||
.catch (err) ~>
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
@notify 'Repostできませんでした'
|
||||
.then ~>
|
||||
@wait = false
|
||||
@update!
|
||||
.then =>
|
||||
this.wait = false
|
||||
this.update();
|
||||
|
||||
@onquote = ~>
|
||||
@quote = true
|
||||
onquote() {
|
||||
this.quote = true
|
||||
</script>
|
||||
</mk-repost-form>
|
||||
|
|
|
|||
|
|
@ -28,59 +28,59 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \get-post-summary
|
||||
this.mixin('api');
|
||||
this.mixin('get-post-summary');
|
||||
|
||||
@query = @opts.query
|
||||
@is-loading = true
|
||||
@is-empty = false
|
||||
@more-loading = false
|
||||
@page = 0
|
||||
this.query = this.opts.query
|
||||
this.is-loading = true
|
||||
this.is-empty = false
|
||||
this.more-loading = false
|
||||
this.page = 0
|
||||
|
||||
@on \mount ~>
|
||||
document.add-event-listener \keydown @on-document-keydown
|
||||
window.add-event-listener \scroll @on-scroll
|
||||
this.on('mount', () => {
|
||||
document.add-event-listener 'keydown' this.on-document-keydown
|
||||
window.add-event-listener 'scroll' this.on-scroll
|
||||
|
||||
@api \posts/search do
|
||||
this.api 'posts/search' do
|
||||
query: @query
|
||||
.then (posts) ~>
|
||||
@is-loading = false
|
||||
@is-empty = posts.length == 0
|
||||
@update!
|
||||
@refs.timeline.set-posts posts
|
||||
@trigger \loaded
|
||||
.catch (err) ~>
|
||||
.then (posts) =>
|
||||
this.is-loading = false
|
||||
this.is-empty = posts.length == 0
|
||||
this.update();
|
||||
this.refs.timeline.set-posts posts
|
||||
this.trigger('loaded');
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
|
||||
@on \unmount ~>
|
||||
document.remove-event-listener \keydown @on-document-keydown
|
||||
window.remove-event-listener \scroll @on-scroll
|
||||
this.on('unmount', () => {
|
||||
document.remove-event-listener 'keydown' this.on-document-keydown
|
||||
window.remove-event-listener 'scroll' this.on-scroll
|
||||
|
||||
@on-document-keydown = (e) ~>
|
||||
on-document-keydown(e) {
|
||||
tag = e.target.tag-name.to-lower-case!
|
||||
if tag != \input and tag != \textarea
|
||||
if e.which == 84 # t
|
||||
@refs.timeline.focus!
|
||||
if tag != 'input' and tag != 'textarea'
|
||||
if e.which == 84 // t
|
||||
this.refs.timeline.focus();
|
||||
|
||||
@more = ~>
|
||||
more() {
|
||||
if @more-loading or @is-loading or @timeline.posts.length == 0
|
||||
return
|
||||
@more-loading = true
|
||||
@update!
|
||||
@api \posts/search do
|
||||
this.more-loading = true
|
||||
this.update();
|
||||
this.api 'posts/search' do
|
||||
query: @query
|
||||
page: @page + 1
|
||||
.then (posts) ~>
|
||||
@more-loading = false
|
||||
.then (posts) =>
|
||||
this.more-loading = false
|
||||
@page++
|
||||
@update!
|
||||
@refs.timeline.prepend-posts posts
|
||||
.catch (err) ~>
|
||||
this.update();
|
||||
this.refs.timeline.prepend-posts posts
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
|
||||
@on-scroll = ~>
|
||||
on-scroll() {
|
||||
current = window.scroll-y + window.inner-height
|
||||
if current > document.body.offset-height - 16 # 遊び
|
||||
if current > document.body.offset-height - 16 // 遊び
|
||||
@more!
|
||||
</script>
|
||||
</mk-search-posts>
|
||||
|
|
|
|||
|
|
@ -23,10 +23,10 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@query = @opts.query
|
||||
this.query = this.opts.query
|
||||
|
||||
@on \mount ~>
|
||||
@refs.posts.on \loaded ~>
|
||||
@trigger \loaded
|
||||
this.on('mount', () => {
|
||||
this.refs.posts.on('loaded', () => {
|
||||
this.trigger('loaded');
|
||||
</script>
|
||||
</mk-search>
|
||||
|
|
|
|||
|
|
@ -131,31 +131,31 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@file = []
|
||||
this.file = []
|
||||
|
||||
@multiple = if @opts.multiple? then @opts.multiple else false
|
||||
@title = @opts.title || '<i class="fa fa-file-o"></i>ファイルを選択'
|
||||
this.multiple = if this.opts.multiple? then this.opts.multiple else false
|
||||
this.title = this.opts.title || '<i class="fa fa-file-o"></i>ファイルを選択'
|
||||
|
||||
@on \mount ~>
|
||||
@refs.window.refs.browser.on \selected (file) ~>
|
||||
@file = file
|
||||
this.on('mount', () => {
|
||||
this.refs.window.refs.browser.on('selected', (file) => {
|
||||
this.file = file
|
||||
@ok!
|
||||
|
||||
@refs.window.refs.browser.on \change-selection (files) ~>
|
||||
@file = files
|
||||
@update!
|
||||
this.refs.window.refs.browser.on('change-selection', (files) => {
|
||||
this.file = files
|
||||
this.update();
|
||||
|
||||
@refs.window.on \closed ~>
|
||||
@unmount!
|
||||
this.refs.window.on('closed', () => {
|
||||
this.unmount();
|
||||
|
||||
@close = ~>
|
||||
@refs.window.close!
|
||||
close() {
|
||||
this.refs.window.close!
|
||||
|
||||
@upload = ~>
|
||||
@refs.window.refs.browser.select-local-file!
|
||||
upload() {
|
||||
this.refs.window.refs.browser.select-local-file!
|
||||
|
||||
@ok = ~>
|
||||
@trigger \selected @file
|
||||
@refs.window.close!
|
||||
ok() {
|
||||
this.trigger 'selected' @file
|
||||
this.refs.window.close!
|
||||
</script>
|
||||
</mk-select-file-from-drive-window>
|
||||
|
|
|
|||
|
|
@ -31,15 +31,15 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
@mixin \update-avatar
|
||||
this.mixin('i');
|
||||
this.mixin('update-avatar');
|
||||
|
||||
@set = ~>
|
||||
set() {
|
||||
@update-avatar @I
|
||||
|
||||
@close = (e) ~>
|
||||
close(e) {
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
@unmount!
|
||||
this.unmount();
|
||||
</script>
|
||||
</mk-set-avatar-suggestion>
|
||||
|
|
|
|||
|
|
@ -31,15 +31,15 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
@mixin \update-banner
|
||||
this.mixin('i');
|
||||
this.mixin('update-banner');
|
||||
|
||||
@set = ~>
|
||||
set() {
|
||||
@update-banner @I
|
||||
|
||||
@close = (e) ~>
|
||||
close(e) {
|
||||
e.prevent-default!
|
||||
e.stop-propagation!
|
||||
@unmount!
|
||||
this.unmount();
|
||||
</script>
|
||||
</mk-set-banner-suggestion>
|
||||
|
|
|
|||
|
|
@ -15,11 +15,11 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@on \mount ~>
|
||||
@refs.window.on \closed ~>
|
||||
@unmount!
|
||||
this.on('mount', () => {
|
||||
this.refs.window.on('closed', () => {
|
||||
this.unmount();
|
||||
|
||||
@close = ~>
|
||||
@refs.window.close!
|
||||
close() {
|
||||
this.refs.window.close!
|
||||
</script>
|
||||
</mk-settings-window>
|
||||
|
|
|
|||
|
|
@ -198,45 +198,45 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
@mixin \api
|
||||
@mixin \dialog
|
||||
@mixin \update-avatar
|
||||
this.mixin('i');
|
||||
this.mixin('api');
|
||||
this.mixin('dialog');
|
||||
this.mixin('update-avatar');
|
||||
|
||||
@page = \account
|
||||
this.page = 'account'
|
||||
|
||||
@set-page = (page) ~>
|
||||
@page = page
|
||||
set-page(page) {
|
||||
this.page = page
|
||||
|
||||
@avatar = ~>
|
||||
avatar() {
|
||||
@update-avatar @I
|
||||
|
||||
@update-account = ~>
|
||||
@api \i/update do
|
||||
name: @refs.account-name.value
|
||||
location: @refs.account-location.value
|
||||
bio: @refs.account-bio.value
|
||||
birthday: @refs.account-birthday.value
|
||||
.then (i) ~>
|
||||
alert \ok
|
||||
.catch (err) ~>
|
||||
update-account() {
|
||||
this.api 'i/update' do
|
||||
name: this.refs.account-name.value
|
||||
location: this.refs.account-location.value
|
||||
bio: this.refs.account-bio.value
|
||||
birthday: this.refs.account-birthday.value
|
||||
.then (i) =>
|
||||
alert 'ok'
|
||||
.catch (err) =>
|
||||
console.error err
|
||||
|
||||
@update-cache = ~>
|
||||
update-cache() {
|
||||
@I.data.cache = !@I.data.cache
|
||||
@api \i/appdata/set do
|
||||
this.api 'i/appdata/set' do
|
||||
data: JSON.stringify do
|
||||
cache: @I.data.cache
|
||||
|
||||
@update-debug = ~>
|
||||
update-debug() {
|
||||
@I.data.debug = !@I.data.debug
|
||||
@api \i/appdata/set do
|
||||
this.api 'i/appdata/set' do
|
||||
data: JSON.stringify do
|
||||
debug: @I.data.debug
|
||||
|
||||
@update-nya = ~>
|
||||
update-nya() {
|
||||
@I.data.nya = !@I.data.nya
|
||||
@api \i/appdata/set do
|
||||
this.api 'i/appdata/set' do
|
||||
data: JSON.stringify do
|
||||
nya: @I.data.nya
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -27,27 +27,27 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \stream
|
||||
this.mixin('stream');
|
||||
|
||||
@on \before-mount ~>
|
||||
@state = @get-stream-state!
|
||||
this.on('before-mount', () => {
|
||||
this.state = @get-stream-state!
|
||||
|
||||
if @state == \connected
|
||||
@root.style.opacity = 0
|
||||
if @state == 'connected'
|
||||
this.root.style.opacity = 0
|
||||
|
||||
@stream-state-ev.on \connected ~>
|
||||
@state = @get-stream-state!
|
||||
@update!
|
||||
set-timeout ~>
|
||||
Velocity @root, {
|
||||
@stream-state-ev.on('connected', () => {
|
||||
this.state = @get-stream-state!
|
||||
this.update();
|
||||
setTimeout =>
|
||||
Velocity this.root, {
|
||||
opacity: 0
|
||||
} 200ms \linear
|
||||
} 200ms 'linear'
|
||||
, 1000ms
|
||||
|
||||
@stream-state-ev.on \closed ~>
|
||||
@state = @get-stream-state!
|
||||
@update!
|
||||
Velocity @root, {
|
||||
@stream-state-ev.on('closed', () => {
|
||||
this.state = @get-stream-state!
|
||||
this.update();
|
||||
Velocity this.root, {
|
||||
opacity: 1
|
||||
} 0ms
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -28,18 +28,18 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \text
|
||||
@mixin \user-preview
|
||||
this.mixin('text');
|
||||
this.mixin('user-preview');
|
||||
|
||||
@post = @opts.post
|
||||
this.post = this.opts.post
|
||||
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
if @post.text?
|
||||
tokens = @analyze @post.text
|
||||
@refs.text.innerHTML = @compile tokens, false
|
||||
this.refs.text.innerHTML = @compile tokens, false
|
||||
|
||||
@refs.text.children.for-each (e) ~>
|
||||
if e.tag-name == \MK-URL
|
||||
this.refs.text.children.for-each (e) =>
|
||||
if e.tag-name == 'MK-URL'
|
||||
riot.mount e
|
||||
</script>
|
||||
</mk-sub-post-content>
|
||||
|
|
|
|||
|
|
@ -9,12 +9,12 @@
|
|||
</div>
|
||||
</article>
|
||||
<script>
|
||||
@mixin \date-stringify
|
||||
@mixin \user-preview
|
||||
this.mixin('date-stringify');
|
||||
this.mixin('user-preview');
|
||||
|
||||
@post = @opts.post
|
||||
this.post = this.opts.post
|
||||
|
||||
@title = @date-stringify @post.created_at
|
||||
this.title = @date-stringify @post.created_at
|
||||
|
||||
</script>
|
||||
<style>
|
||||
|
|
|
|||
|
|
@ -312,83 +312,83 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
@mixin \text
|
||||
@mixin \date-stringify
|
||||
@mixin \user-preview
|
||||
@mixin \NotImplementedException
|
||||
this.mixin('api');
|
||||
this.mixin('text');
|
||||
this.mixin('date-stringify');
|
||||
this.mixin('user-preview');
|
||||
this.mixin('NotImplementedException');
|
||||
|
||||
@post = @opts.post
|
||||
@is-repost = @post.repost? and !@post.text?
|
||||
@p = if @is-repost then @post.repost else @post
|
||||
this.post = this.opts.post
|
||||
this.is-repost = @post.repost? and !@post.text?
|
||||
this.p = if @is-repost then @post.repost else @post
|
||||
|
||||
@title = @date-stringify @p.created_at
|
||||
this.title = @date-stringify @p.created_at
|
||||
|
||||
@url = CONFIG.url + '/' + @p.user.username + '/' + @p.id
|
||||
@is-detail-opened = false
|
||||
this.url = CONFIG.url + '/' + @p.user.username + '/' + @p.id
|
||||
this.is-detail-opened = false
|
||||
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
if @p.text?
|
||||
tokens = if @p._highlight?
|
||||
then @analyze @p._highlight
|
||||
else @analyze @p.text
|
||||
|
||||
@refs.text.innerHTML = @refs.text.innerHTML.replace '<p class="dummy"></p>' if @p._highlight?
|
||||
this.refs.text.innerHTML = this.refs.text.innerHTML.replace '<p class="dummy"></p>' if @p._highlight?
|
||||
then @compile tokens, true, false
|
||||
else @compile tokens
|
||||
|
||||
@refs.text.children.for-each (e) ~>
|
||||
if e.tag-name == \MK-URL
|
||||
this.refs.text.children.for-each (e) =>
|
||||
if e.tag-name == 'MK-URL'
|
||||
riot.mount e
|
||||
|
||||
# URLをプレビュー
|
||||
// URLをプレビュー
|
||||
tokens
|
||||
.filter (t) -> t.type == \link
|
||||
.map (t) ~>
|
||||
@preview = @refs.text.append-child document.create-element \mk-url-preview
|
||||
.filter (t) -> t.type == 'link'
|
||||
.map (t) =>
|
||||
this.preview = this.refs.text.appendChild document.createElement 'mk-url-preview'
|
||||
riot.mount @preview, do
|
||||
url: t.content
|
||||
|
||||
@reply = ~>
|
||||
form = document.body.append-child document.create-element \mk-post-form-window
|
||||
reply() {
|
||||
form = document.body.appendChild document.createElement 'mk-post-form-window'
|
||||
riot.mount form, do
|
||||
reply: @p
|
||||
|
||||
@repost = ~>
|
||||
form = document.body.append-child document.create-element \mk-repost-form-window
|
||||
repost() {
|
||||
form = document.body.appendChild document.createElement 'mk-repost-form-window'
|
||||
riot.mount form, do
|
||||
post: @p
|
||||
|
||||
@like = ~>
|
||||
like() {
|
||||
if @p.is_liked
|
||||
@api \posts/likes/delete do
|
||||
this.api 'posts/likes/delete' do
|
||||
post_id: @p.id
|
||||
.then ~>
|
||||
.then =>
|
||||
@p.is_liked = false
|
||||
@update!
|
||||
this.update();
|
||||
else
|
||||
@api \posts/likes/create do
|
||||
this.api 'posts/likes/create' do
|
||||
post_id: @p.id
|
||||
.then ~>
|
||||
.then =>
|
||||
@p.is_liked = true
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
@toggle-detail = ~>
|
||||
@is-detail-opened = !@is-detail-opened
|
||||
@update!
|
||||
toggle-detail() {
|
||||
this.is-detail-opened = !@is-detail-opened
|
||||
this.update();
|
||||
|
||||
@on-key-down = (e) ~>
|
||||
on-key-down(e) {
|
||||
should-be-cancel = true
|
||||
switch
|
||||
| e.which == 38 or e.which == 74 or (e.which == 9 and e.shift-key) => # ↑, j or Shift+Tab
|
||||
focus @root, (e) -> e.previous-element-sibling
|
||||
| e.which == 40 or e.which == 75 or e.which == 9 => # ↓, k or Tab
|
||||
focus @root, (e) -> e.next-element-sibling
|
||||
| e.which == 81 or e.which == 69 => # q or e
|
||||
| e.which == 38 or e.which == 74 or (e.which == 9 and e.shift-key) => // ↑, j or Shift+Tab
|
||||
focus this.root, (e) -> e.previous-element-sibling
|
||||
| e.which == 40 or e.which == 75 or e.which == 9 => // ↓, k or Tab
|
||||
focus this.root, (e) -> e.next-element-sibling
|
||||
| e.which == 81 or e.which == 69 => // q or e
|
||||
@repost!
|
||||
| e.which == 70 or e.which == 76 => # f or l
|
||||
| e.which == 70 or e.which == 76 => // f or l
|
||||
@like!
|
||||
| e.which == 82 => # r
|
||||
| e.which == 82 => // r
|
||||
@reply!
|
||||
| _ =>
|
||||
should-be-cancel = false
|
||||
|
|
@ -399,8 +399,8 @@
|
|||
function focus(el, fn)
|
||||
target = fn el
|
||||
if target?
|
||||
if target.has-attribute \tabindex
|
||||
target.focus!
|
||||
if target.has-attribute 'tabindex'
|
||||
target.focus();
|
||||
else
|
||||
focus target, fn
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -44,36 +44,36 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@posts = []
|
||||
this.posts = []
|
||||
|
||||
@set-posts = (posts) ~>
|
||||
@posts = posts
|
||||
@update!
|
||||
set-posts(posts) {
|
||||
this.posts = posts
|
||||
this.update();
|
||||
|
||||
@prepend-posts = (posts) ~>
|
||||
posts.for-each (post) ~>
|
||||
prepend-posts(posts) {
|
||||
posts.for-each (post) =>
|
||||
@posts.push post
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
@add-post = (post) ~>
|
||||
add-post(post) {
|
||||
@posts.unshift post
|
||||
@update!
|
||||
this.update();
|
||||
|
||||
@clear = ~>
|
||||
@posts = []
|
||||
@update!
|
||||
clear() {
|
||||
this.posts = []
|
||||
this.update();
|
||||
|
||||
@focus = ~>
|
||||
@root.children.0.focus!
|
||||
focus() {
|
||||
this.root.children.0.focus();
|
||||
|
||||
@on \update ~>
|
||||
@posts.for-each (post) ~>
|
||||
this.on('update', () => {
|
||||
@posts.for-each (post) =>
|
||||
date = (new Date post.created_at).get-date!
|
||||
month = (new Date post.created_at).get-month! + 1
|
||||
post._date = date
|
||||
post._datetext = month + '月 ' + date + '日'
|
||||
|
||||
@tail = ~>
|
||||
tail() {
|
||||
@posts[@posts.length - 1]
|
||||
</script>
|
||||
</mk-timeline>
|
||||
|
|
|
|||
|
|
@ -159,47 +159,47 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
@mixin \signout
|
||||
this.mixin('i');
|
||||
this.mixin('signout');
|
||||
|
||||
@is-open = false
|
||||
this.is-open = false
|
||||
|
||||
@on \before-unmount ~>
|
||||
this.on('before-unmount', () => {
|
||||
@close!
|
||||
|
||||
@toggle = ~>
|
||||
toggle() {
|
||||
if @is-open
|
||||
@close!
|
||||
else
|
||||
@open!
|
||||
|
||||
@open = ~>
|
||||
@is-open = true
|
||||
@update!
|
||||
open() {
|
||||
this.is-open = true
|
||||
this.update();
|
||||
all = document.query-selector-all 'body *'
|
||||
Array.prototype.for-each.call all, (el) ~>
|
||||
el.add-event-listener \mousedown @mousedown
|
||||
Array.prototype.for-each.call all, (el) =>
|
||||
el.add-event-listener 'mousedown' @mousedown
|
||||
|
||||
@close = ~>
|
||||
@is-open = false
|
||||
@update!
|
||||
close() {
|
||||
this.is-open = false
|
||||
this.update();
|
||||
all = document.query-selector-all 'body *'
|
||||
Array.prototype.for-each.call all, (el) ~>
|
||||
el.remove-event-listener \mousedown @mousedown
|
||||
Array.prototype.for-each.call all, (el) =>
|
||||
el.remove-event-listener 'mousedown' @mousedown
|
||||
|
||||
@mousedown = (e) ~>
|
||||
mousedown(e) {
|
||||
e.prevent-default!
|
||||
if (!contains @root, e.target) and (@root != e.target)
|
||||
if (!contains this.root, e.target) and (this.root != e.target)
|
||||
@close!
|
||||
return false
|
||||
|
||||
@drive = ~>
|
||||
drive() {
|
||||
@close!
|
||||
riot.mount document.body.append-child document.create-element \mk-drive-browser-window
|
||||
riot.mount document.body.appendChild document.createElement 'mk-drive-browser-window'
|
||||
|
||||
@settings = ~>
|
||||
settings() {
|
||||
@close!
|
||||
riot.mount document.body.append-child document.create-element \mk-settings-window
|
||||
riot.mount document.body.appendChild document.createElement 'mk-settings-window'
|
||||
|
||||
function contains(parent, child)
|
||||
node = child.parent-node
|
||||
|
|
|
|||
|
|
@ -58,7 +58,7 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@draw = ~>
|
||||
draw() {
|
||||
now = new Date!
|
||||
|
||||
yyyy = now.get-full-year!
|
||||
|
|
@ -71,17 +71,17 @@
|
|||
hhmm = "<span class='hhmm'>#hh:#mm</span>"
|
||||
|
||||
if now.get-seconds! % 2 == 0
|
||||
hhmm .= replace \: '<span style=\'visibility:visible\'>:</span>'
|
||||
hhmm .= replace ':' '<span style=\'visibility:visible\'>:</span>'
|
||||
else
|
||||
hhmm .= replace \: '<span style=\'visibility:hidden\'>:</span>'
|
||||
hhmm .= replace ':' '<span style=\'visibility:hidden\'>:</span>'
|
||||
|
||||
@refs.time.innerHTML = "#yyyymmdd<br>#hhmm"
|
||||
this.refs.time.innerHTML = "#yyyymmdd<br>#hhmm"
|
||||
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
@draw!
|
||||
@clock = set-interval @draw, 1000ms
|
||||
this.clock = set-interval @draw, 1000ms
|
||||
|
||||
@on \unmount ~>
|
||||
this.on('unmount', () => {
|
||||
clear-interval @clock
|
||||
</script>
|
||||
</mk-ui-header-clock>
|
||||
|
|
|
|||
|
|
@ -77,37 +77,37 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
@mixin \api
|
||||
@mixin \stream
|
||||
this.mixin('i');
|
||||
this.mixin('api');
|
||||
this.mixin('stream');
|
||||
|
||||
@page = @opts.page
|
||||
this.page = this.opts.page
|
||||
|
||||
@on \mount ~>
|
||||
@stream.on \read_all_messaging_messages @on-read-all-messaging-messages
|
||||
@stream.on \unread_messaging_message @on-unread-messaging-message
|
||||
this.on('mount', () => {
|
||||
@stream.on 'read_all_messaging_messages' this.on-read-all-messaging-messages
|
||||
@stream.on 'unread_messaging_message' this.on-unread-messaging-message
|
||||
|
||||
# Fetch count of unread messaging messages
|
||||
@api \messaging/unread
|
||||
.then (count) ~>
|
||||
// Fetch count of unread messaging messages
|
||||
this.api 'messaging/unread'
|
||||
.then (count) =>
|
||||
if count.count > 0
|
||||
@has-unread-messaging-messages = true
|
||||
@update!
|
||||
this.has-unread-messaging-messages = true
|
||||
this.update();
|
||||
|
||||
@on \unmount ~>
|
||||
@stream.off \read_all_messaging_messages @on-read-all-messaging-messages
|
||||
@stream.off \unread_messaging_message @on-unread-messaging-message
|
||||
this.on('unmount', () => {
|
||||
@stream.off 'read_all_messaging_messages' this.on-read-all-messaging-messages
|
||||
@stream.off 'unread_messaging_message' this.on-unread-messaging-message
|
||||
|
||||
@on-read-all-messaging-messages = ~>
|
||||
@has-unread-messaging-messages = false
|
||||
@update!
|
||||
on-read-all-messaging-messages() {
|
||||
this.has-unread-messaging-messages = false
|
||||
this.update();
|
||||
|
||||
@on-unread-messaging-message = ~>
|
||||
@has-unread-messaging-messages = true
|
||||
@update!
|
||||
on-unread-messaging-message() {
|
||||
this.has-unread-messaging-messages = true
|
||||
this.update();
|
||||
|
||||
@messaging = ~>
|
||||
riot.mount document.body.append-child document.create-element \mk-messaging-window
|
||||
messaging() {
|
||||
riot.mount document.body.appendChild document.createElement 'mk-messaging-window'
|
||||
</script>
|
||||
</ul>
|
||||
</mk-ui-header-nav>
|
||||
|
|
|
|||
|
|
@ -75,31 +75,31 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@is-open = false
|
||||
this.is-open = false
|
||||
|
||||
@toggle = ~>
|
||||
toggle() {
|
||||
if @is-open
|
||||
@close!
|
||||
else
|
||||
@open!
|
||||
|
||||
@open = ~>
|
||||
@is-open = true
|
||||
@update!
|
||||
open() {
|
||||
this.is-open = true
|
||||
this.update();
|
||||
all = document.query-selector-all 'body *'
|
||||
Array.prototype.for-each.call all, (el) ~>
|
||||
el.add-event-listener \mousedown @mousedown
|
||||
Array.prototype.for-each.call all, (el) =>
|
||||
el.add-event-listener 'mousedown' @mousedown
|
||||
|
||||
@close = ~>
|
||||
@is-open = false
|
||||
@update!
|
||||
close() {
|
||||
this.is-open = false
|
||||
this.update();
|
||||
all = document.query-selector-all 'body *'
|
||||
Array.prototype.for-each.call all, (el) ~>
|
||||
el.remove-event-listener \mousedown @mousedown
|
||||
Array.prototype.for-each.call all, (el) =>
|
||||
el.remove-event-listener 'mousedown' @mousedown
|
||||
|
||||
@mousedown = (e) ~>
|
||||
mousedown(e) {
|
||||
e.prevent-default!
|
||||
if (!contains @root, e.target) and (@root != e.target)
|
||||
if (!contains this.root, e.target) and (this.root != e.target)
|
||||
@close!
|
||||
return false
|
||||
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@post = (e) ~>
|
||||
@parent.parent.open-post-form!
|
||||
post(e) {
|
||||
this.parent.parent.open-post-form!
|
||||
</script>
|
||||
</mk-ui-header-post-button>
|
||||
|
|
|
|||
|
|
@ -32,10 +32,10 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \page
|
||||
this.mixin('page');
|
||||
|
||||
@onsubmit = (e) ~>
|
||||
onsubmit(e) {
|
||||
e.prevent-default!
|
||||
@page '/search:' + @refs.q.value
|
||||
@page '/search:' + this.refs.q.value
|
||||
</script>
|
||||
</mk-ui-header-search>
|
||||
|
|
|
|||
|
|
@ -81,5 +81,5 @@
|
|||
|
||||
</style>
|
||||
|
||||
<script>@mixin \i</script>
|
||||
<script>this.mixin('i');</script>
|
||||
</mk-ui-header>
|
||||
|
|
|
|||
|
|
@ -22,22 +22,22 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@on \mount ~>
|
||||
Velocity @root, {
|
||||
top: \0px
|
||||
this.on('mount', () => {
|
||||
Velocity this.root, {
|
||||
top: '0px'
|
||||
} {
|
||||
duration: 500ms
|
||||
easing: \ease-out
|
||||
easing: 'ease-out'
|
||||
}
|
||||
|
||||
set-timeout ~>
|
||||
Velocity @root, {
|
||||
top: \-64px
|
||||
setTimeout =>
|
||||
Velocity this.root, {
|
||||
top: '-64px'
|
||||
} {
|
||||
duration: 500ms
|
||||
easing: \ease-out
|
||||
complete: ~>
|
||||
@unmount!
|
||||
easing: 'ease-out'
|
||||
complete: =>
|
||||
this.unmount();
|
||||
}
|
||||
, 6000ms
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -12,25 +12,25 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \i
|
||||
this.mixin('i');
|
||||
|
||||
@open-post-form = ~>
|
||||
riot.mount document.body.append-child document.create-element \mk-post-form-window
|
||||
open-post-form() {
|
||||
riot.mount document.body.appendChild document.createElement 'mk-post-form-window'
|
||||
|
||||
@set-root-layout = ~>
|
||||
@root.style.padding-top = @refs.header.root.client-height + \px
|
||||
set-root-layout() {
|
||||
this.root.style.padding-top = this.refs.header.root.client-height + 'px'
|
||||
|
||||
@on \mount ~>
|
||||
this.on('mount', () => {
|
||||
@set-root-layout!
|
||||
document.add-event-listener \keydown @onkeydown
|
||||
document.add-event-listener 'keydown' this.onkeydown
|
||||
|
||||
@on \unmount ~>
|
||||
document.remove-event-listener \keydown @onkeydown
|
||||
this.on('unmount', () => {
|
||||
document.remove-event-listener 'keydown' this.onkeydown
|
||||
|
||||
@onkeydown = (e) ~>
|
||||
onkeydown(e) {
|
||||
tag = e.target.tag-name.to-lower-case!
|
||||
if tag != \input and tag != \textarea
|
||||
if e.which == 80 or e.which == 78 # p or n
|
||||
if tag != 'input' and tag != 'textarea'
|
||||
if e.which == 80 or e.which == 78 // p or n
|
||||
e.prevent-default!
|
||||
@open-post-form!
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -15,5 +15,5 @@
|
|||
border-radius 4px
|
||||
|
||||
</style>
|
||||
<script>@user = @opts.user</script>
|
||||
<script>this.user = this.opts.user</script>
|
||||
</mk-user-followers-window>
|
||||
|
|
|
|||
|
|
@ -7,12 +7,12 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
this.mixin('api');
|
||||
|
||||
@user = @opts.user
|
||||
this.user = this.opts.user
|
||||
|
||||
@fetch = (iknow, limit, cursor, cb) ~>
|
||||
@api \users/followers do
|
||||
fetch(iknow, limit, cursor, cb) {
|
||||
this.api 'users/followers' do
|
||||
user_id: @user.id
|
||||
iknow: iknow
|
||||
limit: limit
|
||||
|
|
|
|||
|
|
@ -15,5 +15,5 @@
|
|||
border-radius 4px
|
||||
|
||||
</style>
|
||||
<script>@user = @opts.user</script>
|
||||
<script>this.user = this.opts.user</script>
|
||||
</mk-user-following-window>
|
||||
|
|
|
|||
|
|
@ -7,12 +7,12 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
@mixin \api
|
||||
this.mixin('api');
|
||||
|
||||
@user = @opts.user
|
||||
this.user = this.opts.user
|
||||
|
||||
@fetch = (iknow, limit, cursor, cb) ~>
|
||||
@api \users/following do
|
||||
fetch(iknow, limit, cursor, cb) {
|
||||
this.api 'users/following' do
|
||||
user_id: @user.id
|
||||
iknow: iknow
|
||||
limit: limit
|
||||
|
|
|
|||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Reference in a new issue