Zergling_man/thedesk
Zergling_man/thedesk
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

some design improve

Browse Source
This commit is contained in:
cutls 2021-04-18 04:28:10 +09:00
parent d224e597fd
commit b047c80768
4 changed files with 73 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/css/tl.css
View File

@ -568,7 +568,9 @@ p:not(:last-child) {
font-weight: bold; font-weight: bold;
text-decoration: underline; text-decoration: underline;
} }
.rotate-90 {
transform: rotate(90deg);
}
.area-notice { .area-notice {
grid-area: notice; grid-area: notice;
} }

14
app/js/tl/parse.js
View File

@ -278,7 +278,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type, onlyContent) {
</span> </span>
<span class="voice">${date(toot.created_at, 'absolute')}(${lang.lang_parse_notftime})</span> <span class="voice">${date(toot.created_at, 'absolute')}(${lang.lang_parse_notftime})</span>
<i class="big-text fas ${icon}"></i> <i class="big-text fas ${icon}"></i>
<a onclick="udg('${toot.account.id}','${acct_id}')" class="pointer grey-text"> <a onclick="udg('${toot.account.id}','${acct_id}')" class="pointer grey-text notf-udg-text">
${dis_name}(@${toot.account.acct}) ${dis_name}(@${toot.account.acct})
</a>` </a>`
var notice = noticetext var notice = noticetext
@ -904,7 +904,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type, onlyContent) {
//日本語じゃない //日本語じゃない
if (toot.language != lang.language && toot.language) { if (toot.language != lang.language && toot.language) {
var trans = `<li onclick="trans('${toot.language}','${lang.language}', $(this))" var trans = `<li onclick="trans('${toot.language}','${lang.language}', $(this))"
style="padding:0"> style="padding:0; padding-top: 5px;">
<i class="material-icons" aria-hidden="true">g_translate</i>${lang.lang_parse_trans} <i class="material-icons" aria-hidden="true">g_translate</i>${lang.lang_parse_trans}
</li>` </li>`
} else { } else {
@ -1157,23 +1157,23 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type, onlyContent) {
</li> </li>
<div> <div>
<li onclick="bkm('${uniqueid}','${acct_id}','${tlid}')" <li onclick="bkm('${uniqueid}','${acct_id}','${tlid}')"
class="bkm-btn bkmStr_${uniqueid}" style="padding:0"> class="bkm-btn bkmStr_${uniqueid}" style="padding:0; padding-top: 5px;">
<i class="fas text-darken-3 fa-bookmark bkm_${toot.id} ${if_bkm}"></i>${bkmStr} <i class="fas text-darken-3 fa-bookmark bkm_${toot.id} ${if_bkm}"></i>${bkmStr}
</li> </li>
<li class="${if_mine}" onclick="del('${uniqueid}','${acct_id}')" <li class="${if_mine}" onclick="del('${uniqueid}','${acct_id}')"
style="padding:0"> style="padding:0; padding-top: 5px;">
<i class="fas fa-trash"></i>${lang.lang_parse_del} <i class="fas fa-trash"></i>${lang.lang_parse_del}
</li> </li>
<li class="${if_mine}" onclick="pin('${uniqueid}','${acct_id}')" style="padding:0" class="pinStr_${uniqueid}"> <li class="${if_mine}" onclick="pin('${uniqueid}','${acct_id}')" style="padding:0; padding-top: 5px;" class="pinStr_${uniqueid}">
<i class="fas fa-map-pin pin_${uniqueid} ${if_pin}"></i>${pinStr} <i class="fas fa-map-pin pin_${uniqueid} ${if_pin}"></i>${pinStr}
</li> </li>
<li class="${if_mine}" onclick="redraft('${uniqueid}','${acct_id}')" <li class="${if_mine}" onclick="redraft('${uniqueid}','${acct_id}')"
style="padding:0"> style="padding:0; padding-top: 5px;">
<i class="material-icons" aria-hidden="true">redo</i>${lang.lang_parse_redraft} <i class="material-icons" aria-hidden="true">redo</i>${lang.lang_parse_redraft}
</li> </li>
${trans} ${trans}
<li onclick="postMessage(['openUrl', '${toot.url}'], '*')" <li onclick="postMessage(['openUrl', '${toot.url}'], '*')"
style="padding:0"> style="padding:0; padding-top: 5px;">
<i class="fas text-darken-3 fa-globe"></i>${lang.lang_parse_link} <i class="fas text-darken-3 fa-globe"></i>${lang.lang_parse_link}
</li> </li>
${pluginHtml} ${pluginHtml}

65
app/js/ui/layout.js
View File

@ -52,7 +52,7 @@ function parseColumn(target, dontclose) {
localStorage.setItem('domain_' + key, acct.domain) localStorage.setItem('domain_' + key, acct.domain)
localStorage.setItem('acct_' + key + '_at', acct.at) localStorage.setItem('acct_' + key + '_at', acct.at)
localStorage.setItem('acct_' + key + '_rt', acct.rt ? acct.rt : null) localStorage.setItem('acct_' + key + '_rt', acct.rt ? acct.rt : null)
if(!target) mastodonBaseStreaming(key) if (!target) mastodonBaseStreaming(key)
ckdb(key) ckdb(key)
//フィルターデータ読もう //フィルターデータ読もう
getFilter(key) getFilter(key)
@ -167,11 +167,11 @@ function parseColumn(target, dontclose) {
} }
var maxWidth = localStorage.getItem('max-width') var maxWidth = localStorage.getItem('max-width')
if (maxWidth) { if (maxWidth) {
css = css +'max-width:' + maxWidth + 'px;' css = css + 'max-width:' + maxWidth + 'px;'
} }
var margin = localStorage.getItem('margin') var margin = localStorage.getItem('margin')
if (margin) { if (margin) {
css = css +'margin-right:' + margin + 'px;' css = css + 'margin-right:' + margin + 'px;'
} }
if (acct.width) { if (acct.width) {
css = css + ' min-width:' + acct.width + 'px !important;max-width:' + acct.width + 'px !important;' css = css + ' min-width:' + acct.width + 'px !important;max-width:' + acct.width + 'px !important;'
@ -231,14 +231,14 @@ function parseColumn(target, dontclose) {
} }
var unread = `<a id="unread_${key}" onclick="showUnread('${key}','${acct.type}','${acct.domain}')" var unread = `<a id="unread_${key}" onclick="showUnread('${key}','${acct.type}','${acct.domain}')"
class="setting nex waves-effect" title="${lang.lang_layout_unread}"> class="setting nex waves-effect" title="${lang.lang_layout_unread}">
<i class="material-icons waves-effect nex">more</i><br />${lang.lang_layout_unread} <i class="material-icons waves-effect nex">more</i><span>${lang.lang_layout_unread}</span>
</a>` </a>`
var notfDomain = acct.domain var notfDomain = acct.domain
var notfKey = key var notfKey = key
var if_tag = '' var if_tag = ''
var if_tag_btn = '' var if_tag_btn = ''
if (acct.type == 'notf') { if (acct.type == 'notf') {
var exclude = var excludeNotf =
`<div style="border: 1px solid; padding: 5px; margin-top: 5px; margin-bottom: 5px;">${lang.lang_layout_excluded}:<br> `<div style="border: 1px solid; padding: 5px; margin-top: 5px; margin-bottom: 5px;">${lang.lang_layout_excluded}:<br>
<label> <label>
<input type="checkbox" class="filled-in" id="exc-reply-${key}" ${excludeCk(key, 'mention')} /> <input type="checkbox" class="filled-in" id="exc-reply-${key}" ${excludeCk(key, 'mention')} />
@ -272,20 +272,21 @@ function parseColumn(target, dontclose) {
</label> <br /> </label> <br />
<button class="btn btn-flat waves-effect notf-exclude-btn waves-light" style="width:calc(50% - 11px); padding:0;" onclick="exclude('${key}')">Filter</button>` <button class="btn btn-flat waves-effect notf-exclude-btn waves-light" style="width:calc(50% - 11px); padding:0;" onclick="exclude('${key}')">Filter</button>`
if (checkNotfFilter(key)) { if (checkNotfFilter(key)) {
exclude = excludeNotf =
exclude + excludeNotf +
`<button class="btn btn-flat red-text waves-effect notf-exclude-btn waves-light" style="width:calc(50% - 11px); padding:0;" onclick="resetNotfFilter('${key}')"> `<button class="btn btn-flat red-text waves-effect notf-exclude-btn waves-light" style="width:calc(50% - 11px); padding:0;" onclick="resetNotfFilter('${key}')">
Clear all Clear all
</button>` </button>`
} }
exclude = exclude + '</div>' excludeNotf = excludeNotf + '</div>'
notfDomain = 'dummy' notfDomain = 'dummy'
notfKey = 'dummy' notfKey = 'dummy'
var excludeHome =''
} else if (acct.type == 'home') { } else if (acct.type == 'home') {
var exclude = `<a onclick="ebtToggle('${key}')" class="setting nex waves-effect"> var excludeNotf = ''
var excludeHome = `<a onclick="ebtToggle('${key}')" class="setting nex waves-effect">
<i class="fas fa-retweet nex" title="${lang.lang_layout_excludingbt}" style="font-size: 24px"></i> <i class="fas fa-retweet nex" title="${lang.lang_layout_excludingbt}" style="font-size: 24px"></i>
<span id="sta-bt-${key}">Off</span><br /> <span>${lang.lang_layout_excludingbt}</span><span id="sta-bt-${key}">Off</span>
${lang.lang_layout_excludingbt}
</a>` </a>`
} else if (acct.type == 'tag') { } else if (acct.type == 'tag') {
if (acct.data.name) { if (acct.data.name) {
@ -313,10 +314,12 @@ function parseColumn(target, dontclose) {
<i class="material-icons waves-effect nex">note_add</i> <i class="material-icons waves-effect nex">note_add</i>
</a>` </a>`
unread = '' unread = ''
var exclude = '' var excludeNotf = ''
var excludeHome = ''
var if_notf = 'hide' var if_notf = 'hide'
} else { } else {
var exclude = '' var excludeNotf = ''
var excludeHome = ''
unread = '' unread = ''
} }
@ -337,12 +340,12 @@ function parseColumn(target, dontclose) {
$('#timeline-container').append(basehtml) $('#timeline-container').append(basehtml)
} }
var left_hold = `<a onclick="leftFoldSet('${key}')" class="setting nex waves-effect"> var left_hold = `<a onclick="leftFoldSet('${key}')" class="setting nex waves-effect">
<i class="material-icons waves-effect nex" title="${lang.lang_layout_leftFold}">view_agenda</i><br /> <i class="material-icons waves-effect nex" title="${lang.lang_layout_leftFold}">view_agenda</i>
${lang.lang_layout_leftFold}</a>` <span>${lang.lang_layout_leftFold}</span></a>`
} else { } else {
var left_hold = `<a onclick="leftFoldRemove('${key}')" class="setting nex waves-effect"> var left_hold = `<a onclick="leftFoldRemove('${key}')" class="setting nex waves-effect">
<i class="material-icons waves-effect nex" title="${lang.lang_layout_leftUnfold}">view_column</i><br /> <i class="material-icons waves-effect nex" title="${lang.lang_layout_leftUnfold}">view_column</i>
${lang.lang_layout_leftUnfold}</a>` <span>${lang.lang_layout_leftUnfold}</span></a>`
} }
if (key === 0) { if (key === 0) {
left_hold = '' left_hold = ''
@ -363,8 +366,7 @@ function parseColumn(target, dontclose) {
if (acct.type != 'pub' && acct.type != 'pub-media') { if (acct.type != 'pub' && acct.type != 'pub-media') {
var mediaFil = `<a onclick="mediaToggle('${key}')" class="setting nex waves-effect"> var mediaFil = `<a onclick="mediaToggle('${key}')" class="setting nex waves-effect">
<i class="material-icons nex" title="${lang.lang_layout_mediafil}">perm_media</i> <i class="material-icons nex" title="${lang.lang_layout_mediafil}">perm_media</i>
<span id="sta-media-${key}">On</span><br /> <span>${lang.lang_layout_mediafil}</span/><span id="sta-media-${key}">On</span></a>`
${lang.lang_layout_mediafil}</a>`
} else { } else {
var mediaFil = `<a onclick="remoteOnly('${key}','${acct.type}')" class="setting nex waves-effect"> var mediaFil = `<a onclick="remoteOnly('${key}','${acct.type}')" class="setting nex waves-effect">
<i class="material-icons nex" title="${lang.lang_layout_remoteOnly}">perm_media</i><br /> <i class="material-icons nex" title="${lang.lang_layout_remoteOnly}">perm_media</i><br />
@ -422,32 +424,29 @@ function parseColumn(target, dontclose) {
</div> </div>
</div> </div>
<div class="column-hide notf-indv-box" id="util-box_${key}" style="padding:5px;"> <div class="column-hide notf-indv-box" id="util-box_${key}" style="padding:5px;">
${exclude} ${excludeNotf}
<div class="columnSettings">
${excludeHome}
${unread} ${unread}
${left_hold} ${left_hold}
${mediaFil} ${mediaFil}
<a onclick="cardToggle('${key}')" class="setting nex waves-effect"> <a onclick="cardToggle('${key}')" class="setting nex waves-effect">
<i class="material-icons nex" title="${lang.lang_layout_linkanades}">link</i> <i class="material-icons nex" title="${lang.lang_layout_linkanades}">link</i>
<span id="sta-card-${key}">On</span><br /> <span>${lang.lang_layout_linkana}</span><span id="sta-card-${key}">On</span>
${lang.lang_layout_linkana}
</a> </a>
<a onclick="voiceToggle('${key}')" class="setting nex waves-effect"> <a onclick="voiceToggle('${key}')" class="setting nex waves-effect">
<i class="material-icons nex" title="${lang.lang_layout_tts}">hearing</i> <i class="material-icons nex" title="${lang.lang_layout_tts}">hearing</i>
<span id="sta-voice-${key}">On</span><br /> <span>${lang.lang_layout_tts}TL</span/><span id="sta-voice-${key}">On</span>
${lang.lang_layout_tts} </a>
TL</a>
<a onclick="columnReload('${key}','${acct.type}')" class="setting nex ${if_misskey_hide} waves-effect"> <a onclick="columnReload('${key}','${acct.type}')" class="setting nex ${if_misskey_hide} waves-effect">
<i class="material-icons nex" title="${lang.lang_layout_reconnect}">refresh</i> <i class="material-icons nex" title="${lang.lang_layout_reconnect}">refresh</i>
<br /> <span>${lang.lang_layout_reconnect}</span>
${lang.lang_layout_reconnect}
</a> </a>
<a onclick="resetWidth('${key}')" class="setting nex waves-effect"> <a onclick="resetWidth('${key}')" class="setting nex waves-effect">
<i class="material-icons nex" title="${lang.lang_layout_resetWidth}">refresh</i> <i class="material-icons nex rotate-90" title="${lang.lang_layout_resetWidth}">height</i>
<br /> <span>${lang.lang_layout_resetWidth}</span>
${lang.lang_layout_resetWidth} </a></div>
</a><br /> <p>${lang.lang_layout_headercolor}</p>
${lang.lang_layout_headercolor}
<br>
<div id="picker_${key}" class="color-picker"></div> <div id="picker_${key}" class="color-picker"></div>
</div>${if_tag} </div>${if_tag}
<div class="tl-box" tlid="${key}"> <div class="tl-box" tlid="${key}">

51
app/js/userdata/showOnTL.js
View File

@ -33,20 +33,20 @@ function udgEx(user, acct_id) {
Authorization: "Bearer " + at Authorization: "Bearer " + at
} }
}) })
.then(function(response) { .then(function (response) {
if (!response.ok) { if (!response.ok) {
response.text().then(function(text) { response.text().then(function (text) {
setLog(response.url, response.status, text) setLog(response.url, response.status, text)
}) })
} }
return response.json() return response.json()
}) })
.catch(function(error) { .catch(function (error) {
todo(error) todo(error)
setLog(start, "JSON", error) setLog(start, "JSON", error)
console.error(error) console.error(error)
}) })
.then(function(json) { .then(function (json) {
if (json.accounts[0]) { if (json.accounts[0]) {
var id = json.accounts[0].id var id = json.accounts[0].id
udg(id, acct_id) udg(id, acct_id)
@ -76,20 +76,20 @@ function udg(user, acct_id) {
Authorization: "Bearer " + at Authorization: "Bearer " + at
} }
}) })
.then(function(response) { .then(function (response) {
if (!response.ok) { if (!response.ok) {
response.text().then(function(text) { response.text().then(function (text) {
setLog(response.url, response.status, text) setLog(response.url, response.status, text)
}) })
} }
return response.json() return response.json()
}) })
.catch(function(error) { .catch(function (error) {
todo(error) todo(error)
setLog(start, "JSON", error) setLog(start, "JSON", error)
console.error(error) console.error(error)
}) })
.then(function(json) { .then(function (json) {
//一つ前のユーザーデータ //一つ前のユーザーデータ
if (!localStorage.getItem("history")) { if (!localStorage.getItem("history")) {
$("#his-history-btn").prop("disabled", true) $("#his-history-btn").prop("disabled", true)
@ -129,7 +129,7 @@ function udg(user, acct_id) {
} }
//絵文字があれば //絵文字があれば
if (actemojick) { if (actemojick) {
Object.keys(json.emojis).forEach(function(key5) { Object.keys(json.emojis).forEach(function (key5) {
var emoji = json.emojis[key5] var emoji = json.emojis[key5]
var shortcode = emoji.shortcode var shortcode = emoji.shortcode
var emoji_url = '<img src="' + emoji.url + '" class="emoji-img" data-emoji="' + shortcode + '" draggable="false">' var emoji_url = '<img src="' + emoji.url + '" class="emoji-img" data-emoji="' + shortcode + '" draggable="false">'
@ -147,6 +147,11 @@ function udg(user, acct_id) {
$("#his-acct").text(json.acct) $("#his-acct").text(json.acct)
$("#his-acct").attr("fullname", fullname) $("#his-acct").attr("fullname", fullname)
$("#his-prof").attr("src", json.avatar) $("#his-prof").attr("src", json.avatar)
$("#util-add").removeClass("hide")
const title = $('.column-first').html()
$("#my-data-nav .anc-link").removeClass("active-back")
$('.column-first').addClass("active-back")
$('#his-data-title').html(title)
$("#his-data").css("background-image", "url(" + json.header + ")") $("#his-data").css("background-image", "url(" + json.header + ")")
$("#his-sta").text(json.statuses_count) $("#his-sta").text(json.statuses_count)
$("#his-follow").text(json.following_count) $("#his-follow").text(json.following_count)
@ -186,6 +191,7 @@ function udg(user, acct_id) {
$("#his-des").html(twemoji.parse(note)) $("#his-des").html(twemoji.parse(note))
if (json.bot) { if (json.bot) {
$("#his-bot").html(lang.lang_showontl_botacct) $("#his-bot").html(lang.lang_showontl_botacct)
$("#his-bot").removeClass("hide")
} }
$("#his-des").attr("data-acct", acct_id) $("#his-des").attr("data-acct", acct_id)
$("#his-data").css("background-size", "cover") $("#his-data").css("background-size", "cover")
@ -239,7 +245,7 @@ function udg(user, acct_id) {
$(".only-his-data").show() $(".only-his-data").show()
} }
todc() todc()
if(json.locked) { if (json.locked) {
$('#his-data').addClass('locked') $('#his-data').addClass('locked')
} else { } else {
$('#his-data').removeClass('locked') $('#his-data').removeClass('locked')
@ -271,20 +277,20 @@ function misskeyUdg(user, acct_id) {
userId: user userId: user
}) })
}) })
.then(function(response) { .then(function (response) {
if (!response.ok) { if (!response.ok) {
response.text().then(function(text) { response.text().then(function (text) {
setLog(response.url, response.status, text) setLog(response.url, response.status, text)
}) })
} }
return response.json() return response.json()
}) })
.catch(function(error) { .catch(function (error) {
todo(error) todo(error)
setLog(start, "JSON", error) setLog(start, "JSON", error)
console.error(error) console.error(error)
}) })
.then(function(json) { .then(function (json) {
//一つ前のユーザーデータ //一つ前のユーザーデータ
if (!localStorage.getItem("history")) { if (!localStorage.getItem("history")) {
$("#his-history-btn").prop("disabled", true) $("#his-history-btn").prop("disabled", true)
@ -402,22 +408,22 @@ function relations(user, acct_id) {
Authorization: "Bearer " + at Authorization: "Bearer " + at
} }
}) })
.then(function(response) { .then(function (response) {
if (!response.ok) { if (!response.ok) {
response.text().then(function(text) { response.text().then(function (text) {
setLog(response.url, response.status, text) setLog(response.url, response.status, text)
}) })
} }
return response.json() return response.json()
}) })
.catch(function(error) { .catch(function (error) {
todo(error) todo(error)
setLog(start, "JSON", error) setLog(start, "JSON", error)
console.error(error) console.error(error)
}) })
.then(function(json) { .then(function (json) {
var json = json[0] var json = json[0]
if(json.requested) { if (json.requested) {
//フォロリク中 //フォロリク中
$('#his-data').addClass('following') $('#his-data').addClass('following')
$("#his-follow-btn-text").text(lang.lang_status_requesting) $("#his-follow-btn-text").text(lang.lang_status_requesting)
@ -516,6 +522,7 @@ function reset() {
$("#his-end-btn").removeClass("endorsed") $("#his-end-btn").removeClass("endorsed")
$("#his-des").css("max-height", "250px") $("#his-des").css("max-height", "250px")
$("#his-bot").html("") $("#his-bot").html("")
$("#his-bot").addClass("hide")
$("#his-follow-btn").show() $("#his-follow-btn").show()
$("#his-block-btn").show() $("#his-block-btn").show()
$("#his-mute-btn").show() $("#his-mute-btn").show()
@ -551,10 +558,12 @@ function reset() {
$('#his-data').removeClass('locked') $('#his-data').removeClass('locked')
$('#his-data').removeClass('requesting') $('#his-data').removeClass('requesting')
} }
$("#my-data-nav .anc-link").on("click", function() { $("#my-data-nav .anc-link").on("click", function () {
var target = $(this).attr("go") var target = $(this).attr("go")
if (target) { if (target) {
const title = $(this).html() let title = $(this).html()
if (target === '#his-tl') $("#util-add").removeClass("hide")
if (target != '#his-tl') $("#util-add").addClass("hide")
$('#his-data-title').html(title) $('#his-data-title').html(title)
$("#my-data-nav .anc-link").removeClass("active-back") $("#my-data-nav .anc-link").removeClass("active-back")
$(this).addClass("active-back") $(this).addClass("active-back")