Accessibility

This commit is contained in:
cutls 2020-04-21 23:56:04 +09:00
parent 039799083d
commit cf00fefa6b
16 changed files with 145 additions and 111 deletions

View File

@ -342,21 +342,22 @@ blockquote:before,
#left-menu { #left-menu {
width: 230px; width: 230px;
} }
#left-menu div { #left-menu a {
padding-left: 5px; padding-left: 5px;
width: 100%; width: 100%;
height: 50px; height: 50px;
display: flex; display: flex;
align-items: center; align-items: center;
cursor: pointer; cursor: pointer;
color: var(--color);
} }
#left-menu div:hover { #left-menu a:hover {
background-color: var(--beforehover); background-color: var(--beforehover);
} }
#left-menu span { #left-menu span {
margin-left: 5px; margin-left: 5px;
} }
#left-menu div.active { #left-menu a.active {
background-color: var(--emphasized); background-color: var(--emphasized);
} }
#right-menu { #right-menu {
@ -376,6 +377,7 @@ blockquote:before,
width: 170px; width: 170px;
height: 40px; height: 40px;
cursor: pointer; cursor: pointer;
color: var(--color);
} }
#tltype .type span { #tltype .type span {
width: calc(100% - 30px); width: calc(100% - 30px);
@ -514,6 +516,13 @@ textarea {
#pageSrcInput { #pageSrcInput {
width: 160px; width: 160px;
} }
.voice {
clip: rect(1px, 1px, 1px, 1px);
position: absolute !important;
height: 1px;
width: 1px;
overflow: hidden;
}
@media (max-width: 500px) { @media (max-width: 500px) {
#pageSrc { #pageSrc {

View File

@ -115,6 +115,13 @@ $(function($) {
return false return false
} }
} }
//Ctrl+K:メニュー開閉
if (event.metaKey || event.ctrlKey) {
if (e.keyCode === 75) {
menu()
return false
}
}
//Ctrl+Space:読み込み //Ctrl+Space:読み込み
if (event.metaKey || event.ctrlKey) { if (event.metaKey || event.ctrlKey) {
if (e.keyCode === 32) { if (e.keyCode === 32) {

View File

@ -3,7 +3,7 @@
function dirMenu() { function dirMenu() {
$("#dir-contents").html(""); $("#dir-contents").html("");
directory(); directory();
$("#left-menu div").removeClass("active"); $("#left-menu a").removeClass("active");
$("#dirMenu").addClass("active"); $("#dirMenu").addClass("active");
$(".menu-content").addClass("hide"); $(".menu-content").addClass("hide");
$("#dir-box").removeClass("hide"); $("#dir-box").removeClass("hide");

View File

@ -101,7 +101,7 @@ function delreset(tlid) {
} }
/*ワードフィルター機能*/ /*ワードフィルター機能*/
function filterMenu() { function filterMenu() {
$('#left-menu div').removeClass('active') $('#left-menu a').removeClass('active')
$('#filterMenu').addClass('active') $('#filterMenu').addClass('active')
$('.menu-content').addClass('hide') $('.menu-content').addClass('hide')
$('#filter-box').removeClass('hide') $('#filter-box').removeClass('hide')

View File

@ -1,5 +1,5 @@
function listMenu() { function listMenu() {
$('#left-menu div').removeClass('active') $('#left-menu a').removeClass('active')
$('#listMenu').addClass('active') $('#listMenu').addClass('active')
$('.menu-content').addClass('hide') $('.menu-content').addClass('hide')
$('#list-box').removeClass('hide') $('#list-box').removeClass('hide')

View File

@ -241,7 +241,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
noticeavatar = toot.account.avatar_static noticeavatar = toot.account.avatar_static
} }
noticeavatar = `<a onclick="udg('${toot.account.id}','${acct_id}');" user="${toot.account.acct}" class="udg"> noticeavatar = `<a onclick="udg('${toot.account.id}','${acct_id}');" user="${toot.account.acct}" class="udg">
<img draggable="false" src="${noticeavatar}" width="20" class="notf-icon prof-img" user="${toot.account.acct}"> <img draggable="false" src="${noticeavatar}" width="20" class="notf-icon prof-img" user="${toot.account.acct}" alt="">
</a>` </a>`
if (toot.type == 'mention') { if (toot.type == 'mention') {
var what = lang.lang_parse_mentioned var what = lang.lang_parse_mentioned
@ -268,15 +268,15 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
} else { } else {
var notfFilHide = '' var notfFilHide = ''
} }
var noticetext = `<i class="fas fa-filter pointer big-text ${notfFilHide}" var noticetext = `<span onclick="notfFilter('${toot.account.id}','${tlid}');" class=" pointer big-text ${notfFilHide}"><i class="fas fa-filter"
onclick="notfFilter('${toot.account.id}','${tlid}');" title="${lang.lang_parse_notffilter}"> title="${lang.lang_parse_notffilter}">
</i> </i><span class="voice">${lang.lang_parse_notffilter}</span></span>
<span class="cbadge cbadge-hover" title="${date(toot.created_at, 'absolute')}(${ <span class="cbadge cbadge-hover" title="${date(toot.created_at, 'absolute')}(${
lang.lang_parse_notftime lang.lang_parse_notftime
})"> })" aria-hidden="true"><i class="far fa-clock"></i>
<i class="far fa-clock"></i>
${date(toot.created_at, datetype)} ${date(toot.created_at, datetype)}
</span> </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">
${dis_name}(@${toot.account.acct}) ${dis_name}(@${toot.account.acct})
@ -393,7 +393,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
} else { } else {
noticeavatar = toot.account.avatar_static noticeavatar = toot.account.avatar_static
} }
noticeavatar = `<a onclick="udg('${toot.account.id}','${acct_id}');" user="${toot.account.acct}" class="notf-icon udg"> noticeavatar = `<a onclick="udg('${toot.account.id}','${acct_id}');" user="${toot.account.acct}" class="notf-icon udg" aria-hidden="true">
<img draggable="false" src="${noticeavatar}" width="20" class="prof-img" <img draggable="false" src="${noticeavatar}" width="20" class="prof-img"
user="${toot.account.acct}" onerror="this.src=\'../../img/loading.svg\'"> user="${toot.account.acct}" onerror="this.src=\'../../img/loading.svg\'">
</a>` </a>`
@ -518,7 +518,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
var spoil = escapeHTML(toot.spoiler_text) var spoil = escapeHTML(toot.spoiler_text)
var spoiler = 'cw cw_hide' var spoiler = 'cw cw_hide'
var api_spoil = 'gray' var api_spoil = 'gray'
var spoiler_show = `<a href="#" onclick="cw_show(this)" class="nex parsed cw_btn">${lang.lang_parse_cwshow}</a><br>` var spoiler_show = `<a href="#" onclick="cw_show(this)" class="nex parsed cw_btn">${lang.lang_parse_cwshow}<span class="voice">${lang.lang_parse_cwshow_acc}</span></a><br>`
} else { } else {
if (content) { if (content) {
var ct1 = content.split('</p>').length + content.split('<br />').length - 2 var ct1 = content.split('</p>').length + content.split('<br />').length - 2
@ -576,7 +576,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
} }
if (urls) { if (urls) {
var analyze = `<a onclick="additionalIndv('${tlid}','${acct_id}','${id}')" class="add-show pointer"> var analyze = `<a onclick="additionalIndv('${tlid}','${acct_id}','${id}')" class="add-show pointer" aria-hidden="true">
${lang.lang_parse_url} ${lang.lang_parse_url}
</a><br>` </a><br>`
} else { } else {
@ -621,7 +621,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
viewer + viewer +
`<a onclick="imgv('${id}','${key2}','${acct_id}')" id="${id}'-image-${key2}" `<a onclick="imgv('${id}','${key2}','${acct_id}')" id="${id}'-image-${key2}"
data-url="${url}" data-type="video" class="img-parsed"> data-url="${url}" data-type="video" class="img-parsed">
<video src="${purl}" class="${sense} toot-img pointer" style="max-width:100%;" loop="true"> <video src="${purl}" class="${sense} toot-img pointer" style="max-width:100%;" loop="true" alt="attached media">
</a></span>` </a></span>`
} else { } else {
if (media.type == 'unknown') { if (media.type == 'unknown') {
@ -634,7 +634,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
viewer + viewer +
'<audio src="' + '<audio src="' +
url + url +
'" class="pointer" style="width:100%;" controls></span>' '" class="pointer" style="width:100%;" controls alt="attached media"></span>'
} else { } else {
if (media.description) { if (media.description) {
var desc = media.description var desc = media.description
@ -652,7 +652,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
id="${id}-image-${key2}" data-url="${url}" data-original="${remote_url}" data-type="${media.type}" id="${id}-image-${key2}" data-url="${url}" data-original="${remote_url}" data-type="${media.type}"
class="img-parsed img-link" style="width:calc(${cwdt}% - 1px); height:${imh};"> class="img-parsed img-link" style="width:calc(${cwdt}% - 1px); height:${imh};">
<img draggable="false" src="${purl}" class="${sense} toot-img pointer" <img draggable="false" src="${purl}" class="${sense} toot-img pointer"
onerror="this.src=\'../../img/loading.svg\'" title="${escapeHTML(desc)}"> onerror="this.src=\'../../img/loading.svg\'" title="${escapeHTML(desc)}" alt="${escapeHTML(desc)}">
${nsfwmes} ${nsfwmes}
</a>` </a>`
} }
@ -683,7 +683,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
if (toot.account.acct != mention.acct) { if (toot.account.acct != mention.acct) {
mentions = mentions =
mentions + mentions +
`<a onclick="udg('${mention.id}',' ${acct_id}')" class="pointer">@${mention.acct}</a> ` `<a onclick="udg('${mention.id}',' ${acct_id}')" class="pointer" aria-hidden="true">@${mention.acct}</a> `
to_mention.push(mention.acct) to_mention.push(mention.acct)
} }
} }
@ -724,7 +724,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
)} )}
">Pin</a>${featured}</span> ` ">Pin</a>${featured}</span> `
}) })
tags = '<div style="float:right">' + tags + '</div>' tags = '<div style="float:right" aria-hidden="true">' + tags + '</div>'
} }
//リプ数 //リプ数
if (toot.replies_count || toot.replies_count === 0) { if (toot.replies_count || toot.replies_count === 0) {
@ -739,29 +739,29 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
var vis = '' var vis = ''
var visen = toot.visibility var visen = toot.visibility
if (visen == 'public') { if (visen == 'public') {
var vis = `<i class="text-darken-3 material-icons gray sml vis-data pointer" var vis = `<span onclick="staCopy('${id}')"><i class="text-darken-3 material-icons gray sml vis-data pointer"
title="${lang.lang_parse_public}(${lang.lang_parse_clickcopy})" data-vis="public" onclick="staCopy('${id}')"> title="${lang.lang_parse_public}(${lang.lang_parse_clickcopy})" data-vis="public" aria-hidden="true">
public public
</i>` </i><span class="voice">${lang.lang_parse_public} ${lang.lang_toot}(${lang.lang_parse_clickcopy})</span></span>`
var can_rt = '' var can_rt = ''
} else if (visen == 'unlisted') { } else if (visen == 'unlisted') {
var vis = `<i class="text-darken-3 material-icons blue-text sml vis-data pointer" var vis = `<span onclick="staCopy('${id}')"><i class="text-darken-3 material-icons blue-text sml vis-data pointer"
title="${lang.lang_parse_unlisted}(${lang.lang_parse_clickcopy})" data-vis="public" onclick="staCopy('${id}')"> title="${lang.lang_parse_unlisted}(${lang.lang_parse_clickcopy})" data-vis="public" aria-hidden="true">
lock_open lock_open
</i>` </i><span class="voice">${lang.lang_parse_unlisted} ${lang.lang_toot}(${lang.lang_parse_clickcopy})</span></span>`
var can_rt = '' var can_rt = ''
} else if (visen == 'private') { } else if (visen == 'private') {
var vis = `<i class="text-darken-3 material-icons orange-text sml vis-data pointer" var vis = `<span onclick="staCopy('${id}')"><i class="text-darken-3 material-icons orange-text sml vis-data pointer"
title="${lang.lang_parse_private}(${lang.lang_parse_clickcopy})" data-vis="public" onclick="staCopy('${id}')"> title="${lang.lang_parse_private}(${lang.lang_parse_clickcopy})" data-vis="public" aria-hidden="true">
lock lock
</i>` </i><span class="voice">${lang.lang_parse_private} ${lang.lang_toot}(${lang.lang_parse_clickcopy})</span></span>`
var can_rt = 'unvisible' var can_rt = 'unvisible'
} else if (visen == 'direct') { } else if (visen == 'direct') {
var vis = `<i class="text-darken-3 material-icons red-text sml vis-data pointer" var vis = `<span onclick="staCopy('${id}')"><i class="text-darken-3 material-icons red-text sml vis-data pointer"
title="${lang.lang_parse_direct}(${lang.lang_parse_clickcopy})" data-vis="public" onclick="staCopy('${id}')"> title="${lang.lang_parse_direct}(${lang.lang_parse_clickcopy})" data-vis="public" aria-hidden="true">
mail mail
</i>` </i><span class="voice">${lang.lang_parse_direct} ${lang.lang_toot}(${lang.lang_parse_clickcopy})</span></span>`
var can_rt = 'unvisible' var can_rt = 'unvisible'
} }
if (toot.account.acct == localStorage.getItem('user_' + acct_id)) { if (toot.account.acct == localStorage.getItem('user_' + acct_id)) {
@ -904,7 +904,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
var trans = `<div class=""> var trans = `<div class="">
<a onclick="trans('${toot.language}','${lang.language}', $(this))" <a onclick="trans('${toot.language}','${lang.language}', $(this))"
class="waves-effect waves-dark btn-flat actct" style="padding:0"> class="waves-effect waves-dark btn-flat actct" style="padding:0">
<i class="material-icons">g_translate</i>${lang.lang_parse_trans} <i class="material-icons" aria-hidden="true">g_translate</i>${lang.lang_parse_trans}
</a> </a>
</div>` </div>`
} else { } else {
@ -929,7 +929,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
for (var i = 0; i < tickerdata.length; i++) { for (var i = 0; i < tickerdata.length; i++) {
var value = tickerdata[i] var value = tickerdata[i]
if (value.domain == thisdomain) { if (value.domain == thisdomain) {
var tickerdom = `<div style="user-select:none;cursor:default;background:linear-gradient(90deg, ${ var tickerdom = `<div aria-hidden="true" style="user-select:none;cursor:default;background:linear-gradient(90deg, ${
value.bg value.bg
}, transparent 96%) !important; color:${ }, transparent 96%) !important; color:${
value.text value.text
@ -1007,7 +1007,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
<div class="area-icon grid"> <div class="area-icon grid">
<a onclick="udg('${toot.account.id}','${acct_id}');" user="${toot.account.acct}" class="udg"> <a onclick="udg('${toot.account.id}','${acct_id}');" user="${toot.account.acct}" class="udg">
<img draggable="false" src="${avatar}" width="40" class="prof-img" <img draggable="false" src="${avatar}" width="40" class="prof-img"
user="${toot.account.acct}" onerror="this.src='../../img/loading.svg'"/> user="${toot.account.acct}" onerror="this.src='../../img/loading.svg'" alt="" />
</a> </a>
${noticeavatar} ${noticeavatar}
</div> </div>
@ -1021,7 +1021,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
<div class="flex-time"> <div class="flex-time">
<span class="cbadge cbadge-hover pointer waves-effect" onclick="tootUriCopy('${toot.url}');" <span class="cbadge cbadge-hover pointer waves-effect" onclick="tootUriCopy('${toot.url}');"
title="${date(toot.created_at, 'absolute')}(${lang.lang_parse_clickcopyurl})"> title="${date(toot.created_at, 'absolute')}(${lang.lang_parse_clickcopyurl})">
<i class="far fa-clock"></i>${date(toot.created_at, datetype)} <i class="far fa-clock"></i><span class="voice">posted at </span>${date(toot.created_at, datetype)}
</span> </span>
</div> </div>
</div> </div>
@ -1056,6 +1056,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
class="waves-effect waves-dark btn-flat actct rep-btn" class="waves-effect waves-dark btn-flat actct rep-btn"
data-men="${to_mention}" data-visen="${visen}" style="padding:0" title="${lang.lang_parse_replyto}"> data-men="${to_mention}" data-visen="${visen}" style="padding:0" title="${lang.lang_parse_replyto}">
<i class="fas fa-share"></i> <i class="fas fa-share"></i>
<span class="voice">${lang.lang_parse_replyto} </span>
<span class="rep_ct">${replyct}</span> <span class="rep_ct">${replyct}</span>
</a> </a>
</div> </div>
@ -1065,6 +1066,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
}','${acct_id}','${tlid}')" class="waves-effect waves-dark btn-flat actct bt-btn" }','${acct_id}','${tlid}')" class="waves-effect waves-dark btn-flat actct bt-btn"
style="padding:0" title="${lang.lang_parse_bt}"> style="padding:0" title="${lang.lang_parse_bt}">
<i class="fas fa-retweet ${if_rt} rt_${toot.id}"></i> <i class="fas fa-retweet ${if_rt} rt_${toot.id}"></i>
<span class="voice">${lang.lang_parse_bt} </span>
<span class="rt_ct">${toot.reblogs_count}</span> <span class="rt_ct">${toot.reblogs_count}</span>
</a> </a>
</div> </div>
@ -1072,6 +1074,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
<a onclick="qt('${toot.id}','${acct_id}','${toot.account.acct}','${toot.url}')" <a onclick="qt('${toot.id}','${acct_id}','${toot.account.acct}','${toot.url}')"
class="waves-effect waves-dark btn-flat actct" style="padding:0" title="${lang.lang_parse_quote}"> class="waves-effect waves-dark btn-flat actct" style="padding:0" title="${lang.lang_parse_quote}">
<i class="text-darken-3 fas fa-quote-right"></i> <i class="text-darken-3 fas fa-quote-right"></i>
<span class="voice">${lang.lang_parse_quote} </span>
</a> </a>
</div> </div>
<div class="action ${disp['bkm']} ${noauth} ${bkmClass}"> <div class="action ${disp['bkm']} ${noauth} ${bkmClass}">
@ -1079,6 +1082,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
class="waves-effect waves-dark btn-flat actct bkm-btn" style="padding:0" class="waves-effect waves-dark btn-flat actct bkm-btn" style="padding:0"
title="${lang.lang_parse_bookmark}"> title="${lang.lang_parse_bookmark}">
<i class="fas text-darken-3 fa-bookmark bkm_${toot.id} ${if_bkm}"></i> <i class="fas text-darken-3 fa-bookmark bkm_${toot.id} ${if_bkm}"></i>
<span class="voice">${lang.lang_parse_bookmark} </span>
</a> </a>
</div> </div>
<div class="action ${disp['fav']} ${noauth}"> <div class="action ${disp['fav']} ${noauth}">
@ -1087,6 +1091,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
title="${lang.lang_parse_fav}"> title="${lang.lang_parse_fav}">
<i class="fas text-darken-3 fa-star${if_fav} fav_${uniqueid}"></i> <i class="fas text-darken-3 fa-star${if_fav} fav_${uniqueid}"></i>
<span class="fav_ct">${toot.favourites_count}</span> <span class="fav_ct">${toot.favourites_count}</span>
<span class="voice">${lang.lang_parse_fav} </span>
</a> </a>
</div> </div>
</div> </div>
@ -1094,14 +1099,16 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
<div class="action ${noauth}"> <div class="action ${noauth}">
<a onclick="toggleAction($(this), ${menuct * 39 + 6})" <a onclick="toggleAction($(this), ${menuct * 39 + 6})"
class="ctxMenu waves-effect waves-dark btn-flat" style="padding:0"> class="ctxMenu waves-effect waves-dark btn-flat" style="padding:0">
<i class="text-darken-3 material-icons act-icon">expand_more</i> <i class="text-darken-3 material-icons act-icon" aria-hidden="true">expand_more</i>
<span class="voice">Other actions</span>
</a> </a>
</div> </div>
<div class="action ${noauth}"> <div class="action ${noauth}">
<a onclick="details('${toot.id}','${acct_id}','${tlid}','normal')" <a onclick="details('${toot.id}','${acct_id}','${tlid}','normal')"
class="waves-effect waves-dark btn-flat details ${dmHide}" style="padding:0" class="waves-effect waves-dark btn-flat details ${dmHide}" style="padding:0"
title="${lang.lang_parse_detail}"> title="${lang.lang_parse_detail}">
<i class="text-darken-3 material-icons">menu_open</i></a> <i class="text-darken-3 material-icons" aria-hidden="true">menu_open</i></a>
<span class="voice">${lang.lang_parse_detail}</span>
</div> </div>
</div> </div>
<div class="contextMenu hide z-depth-4"> <div class="contextMenu hide z-depth-4">
@ -1131,7 +1138,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
<div class="${if_mine}"> <div class="${if_mine}">
<button onclick="redraft('${uniqueid}','${acct_id}')" class="waves-effect waves-dark btn-flat actct" <button onclick="redraft('${uniqueid}','${acct_id}')" class="waves-effect waves-dark btn-flat actct"
style="padding:0"> style="padding:0">
<i class="material-icons">redo</i>${lang.lang_parse_redraft} <i class="material-icons" aria-hidden="true">redo</i>${lang.lang_parse_redraft}
</button> </button>
</div> </div>
${trans} ${trans}
@ -1185,10 +1192,10 @@ function userparse(obj, auth, acct_id, tlid, popup) {
var locked = '' var locked = ''
} }
if (auth == 'request') { if (auth == 'request') {
var authhtml = `<i class="material-icons gray pointer" onclick="request('${toot.id}','authorize','${acct_id}')" title="Accept"> var authhtml = `<i class="material-icons gray pointer" onclick="request('${toot.id}','authorize','${acct_id}')" title="Accept" aria-hidden="true">
person_add person_add
</i>  </i>
<i class="material-icons gray pointer" onclick="request('${toot.id}','reject','${acct_id}')" title="Reject"> <i class="material-icons gray pointer" onclick="request('${toot.id}','reject','${acct_id}')" title="Reject" aria-hidden="true">
person_add_disabled person_add_disabled
</i>` </i>`
} else { } else {
@ -1279,7 +1286,7 @@ function userparse(obj, auth, acct_id, tlid, popup) {
} }
var latest = date(toot.last_status_at, 'relative') var latest = date(toot.last_status_at, 'relative')
if (toot.last_status_at) { if (toot.last_status_at) {
var latesthtml = `<div class="cbadge" style="width:100px;">Last:${latest}</div>` var latesthtml = `<div class="cbadge" style="width:100px;">Last <span class="voice">toot</span>: ${latest}</div>`
} else { } else {
var latesthtml = '' var latesthtml = ''
} }
@ -1296,6 +1303,7 @@ function userparse(obj, auth, acct_id, tlid, popup) {
class="prof-img" class="prof-img"
user="${toot.acct}" user="${toot.acct}"
onerror="this.src='../../img/loading.svg'" onerror="this.src='../../img/loading.svg'"
alt=""
/> />
</a></div> </a></div>
<div class="area-display_name"> <div class="area-display_name">

View File

@ -3,7 +3,7 @@
function searchMenu() { function searchMenu() {
$('#src-contents').html('') $('#src-contents').html('')
trend() trend()
$('#left-menu div').removeClass('active') $('#left-menu a').removeClass('active')
$('#searchMenu').addClass('active') $('#searchMenu').addClass('active')
$('.menu-content').addClass('hide') $('.menu-content').addClass('hide')
$('#src-box').removeClass('hide') $('#src-box').removeClass('hide')

View File

@ -8,7 +8,7 @@ var websocketNotf = []
//カラム追加ボックストグル //カラム追加ボックストグル
function addColumnMenu() { function addColumnMenu() {
$('#left-menu div').removeClass('active') $('#left-menu a').removeClass('active')
$('#addColumnMenu').addClass('active') $('#addColumnMenu').addClass('active')
$('.menu-content').addClass('hide') $('.menu-content').addClass('hide')
$('#add-box').removeClass('hide') $('#add-box').removeClass('hide')
@ -357,7 +357,7 @@ function parseColumn(target, dontclose) {
<i class="material-icons waves-effect ${isMisRed}" id="notice_icon_${key}" ${notf_attr} <i class="material-icons waves-effect ${isMisRed}" id="notice_icon_${key}" ${notf_attr}
style="font-size:40px; padding-top:25%;" style="font-size:40px; padding-top:25%;"
onclick="checkStr('${acct.type}','${data}','${acct.domain}', '${key}', '${delc}','${voice}',null)" onclick="checkStr('${acct.type}','${data}','${acct.domain}', '${key}', '${delc}','${voice}',null)"
title="${lang.lang_layout_gotop}"> title="${lang.lang_layout_gotop}" aria-hidden="true">
</i> </i>
</div> </div>
<div class="area-notice_name"> <div class="area-notice_name">
@ -366,29 +366,33 @@ function parseColumn(target, dontclose) {
<div class="area-a1"> <div class="area-a1">
<a onclick="notfToggle('${acct.domain}','${key}')" class="setting nex ${if_notf}" <a onclick="notfToggle('${acct.domain}','${key}')" class="setting nex ${if_notf}"
title="${unique_notf}" ${icnsert}> title="${unique_notf}" ${icnsert}>
<i class="material-icons waves-effect nex notf-icon_${acct.domain}">notifications</i> <i class="material-icons waves-effect nex notf-icon_${acct.domain}" aria-hidden="true">notifications</i>
<span class="voice">${unique_notf}</span>
</a> </a>
<span class="cbadge hide notf-announ_${acct.domain}" style="margin-right:0" <span class="cbadge hide notf-announ_${acct.domain}" style="margin-right:0"
onclick="notfToggle('${acct.domain}','${key}')" title="${lang.lang_layout_announ}"> onclick="notfToggle('${acct.domain}','${key}')" title="${lang.lang_layout_announ}">
<i class="fas fa-bullhorn"></i> <i class="fas fa-bullhorn"></i>
<span class="notf-announ_${acct.domain}_ct"></span> <span class="notf-announ_${acct.domain}_ct"></span>
<span class="voice">${lang.lang_layout_announ}</span>
</span> </span>
${if_tag_btn} ${if_tag_btn}
</div> </div>
<div class="area-sta"> <div class="area-sta">
<span class="new badge teal notf-reply_${acct.domain} hide" data-badge-caption="Reply">0</span> <span class="new badge teal notf-reply_${acct.domain} hide" data-badge-caption="Reply" aria-hidden="true">0</span>
<span class="new badge yellow black-text notf-fav_${acct.domain} hide" data-badge-caption="Fav">0</span> <span class="new badge yellow black-text notf-fav_${acct.domain} hide" data-badge-caption="Fav" aria-hidden="true">0</span>
<span class="new badge blue notf-bt_${acct.domain} hide" data-badge-caption="BT">0</span> <span class="new badge blue notf-bt_${acct.domain} hide" data-badge-caption="BT" aria-hidden="true">0</span>
<span class="new badge orange notf-follow_${acct.domain} hide" data-badge-caption="Follow">0</span> <span class="new badge orange notf-follow_${acct.domain} hide" data-badge-caption="Follow" aria-hidden="true">0</span>
</div> </div>
<div class="area-a2"> <div class="area-a2">
<a onclick="removeColumn('${key}')" class="setting nex"> <a onclick="removeColumn('${key}')" class="setting nex">
<i class="material-icons waves-effect nex" title="${lang.lang_layout_delthis}" ${icnsert}>cancel</i> <i class="material-icons waves-effect nex" title="${lang.lang_layout_delthis}" ${icnsert} aria-hidden="true">cancel</i>
<span class="voice">${lang.lang_layout_delthis}</span>
</a> </a>
</div> </div>
<div class="area-a3"> <div class="area-a3">
<a onclick="setToggle('${key}')" class="setting nex" title="${lang.lang_layout_setthis}" ${icnsert}> <a onclick="setToggle('${key}')" class="setting nex" title="${lang.lang_layout_setthis}" ${icnsert}>
<i class="material-icons waves-effect nex">settings</i> <i class="material-icons waves-effect nex" aria-hidden="true">settings</i>
<span class="voice">${lang.lang_layout_setthis}</span>
</a> </a>
</div> </div>
</div> </div>

View File

@ -33,6 +33,7 @@ function menu() {
$("#add-box").removeClass("hide"); $("#add-box").removeClass("hide");
$("#left-menu div").removeClass("active"); $("#left-menu div").removeClass("active");
$("#addColumnMenu").addClass("active"); $("#addColumnMenu").addClass("active");
$("#addColumnMenu").click();
} else { } else {
$('#menu').fadeOut() $('#menu').fadeOut()
$("#menu").removeClass("appear") $("#menu").removeClass("appear")
@ -69,7 +70,7 @@ $(function () {
}); });
}); });
function help() { function help() {
$("#left-menu div").removeClass("active"); $("#left-menu a").removeClass("active");
$("#helpMenu").addClass("active"); $("#helpMenu").addClass("active");
$(".menu-content").addClass("hide"); $(".menu-content").addClass("hide");
$("#help-box").removeClass("hide"); $("#help-box").removeClass("hide");

View File

@ -111,7 +111,7 @@ function sort() {
} }
//ソートボタントグル //ソートボタントグル
function sortMenu() { function sortMenu() {
$("#left-menu div").removeClass("active"); $("#left-menu a").removeClass("active");
$("#sortMenu").addClass("active"); $("#sortMenu").addClass("active");
$(".menu-content").addClass("hide"); $(".menu-content").addClass("hide");
$("#sort-box").removeClass("hide"); $("#sort-box").removeClass("hide");

View File

@ -59,8 +59,10 @@
<div id="add"> <div id="add">
<div class="row"> <div class="row">
<div class="col s8"> <div class="col s8">
@@addAcct@@<br />
<input type="text" id="url" style="width:70%" placeholder="ex)mstdn.jp" /> <input type="text" id="url" style="width:70%" placeholder="ex)mstdn.jp" />
<div id="ins-suggest"></div> <div id="ins-suggest"></div>
<button class="btn waves-effect" onclick="instance()">Login</button><br />
@@codesetupwarn@@<br /> @@codesetupwarn@@<br />
<label> <label>
<input type="checkbox" class="filled-in" id="linux" /> <input type="checkbox" class="filled-in" id="linux" />
@ -71,9 +73,8 @@
<input type="checkbox" class="filled-in" id="misskey" /> <input type="checkbox" class="filled-in" id="misskey" />
<span>@@thisismisskey@@</span> </label <span>@@thisismisskey@@</span> </label
><br /> ><br />
<button class="btn waves-effect" onclick="instance()">Login</button><br />
</div> </div>
<div class="col s4"> <div class="col s4" aria-hidden="true">
<span style="font-family:Open Sans;">Supports</span> <span style="font-family:Open Sans;">Supports</span>
<div id="support" class="collection transparent"></div> <div id="support" class="collection transparent"></div>
</div> </div>

View File

@ -1264,30 +1264,30 @@
</span> </span>
<div id="menu-wrapper"> <div id="menu-wrapper">
<div id="left-menu"> <div id="left-menu">
<div class="waves-effect active" onclick="addColumnMenu()" id="addColumnMenu"> <a class="waves-effect active" onclick="addColumnMenu()" id="addColumnMenu">
<i class="material-icons">add</i><span>@@addColumn@@</span> <i class="material-icons" aria-hidden="true">add</i><span>@@addColumn@@</span>
</div> </a>
<div class="waves-effect" onclick="sortMenu()" id="sortMenu"> <a class="waves-effect" onclick="sortMenu()" id="sortMenu">
<i class="material-icons">sort</i><span>@@sortColumns@@</span> <i class="material-icons" aria-hidden="true">sort</i><span>@@sortColumns@@</span>
</div> </a>
<div class="waves-effect" onclick="searchMenu()" id="searchMenu"> <a class="waves-effect" onclick="searchMenu()" id="searchMenu">
<i class="material-icons">search</i><span>@@search@@</span> <i class="material-icons" aria-hidden="true">search</i><span>@@search@@</span>
</div> </a>
<div class="waves-effect" onclick="listMenu()" id="listMenu"> <a class="waves-effect" onclick="listMenu()" id="listMenu">
<i class="material-icons">view_headline</i><span>@@list@@</span> <i class="material-icons" aria-hidden="true">view_headline</i><span>@@list@@</span>
</div> </a>
<div class="waves-effect" onclick="dirMenu()" id="dirMenu"> <a class="waves-effect" onclick="dirMenu()" id="dirMenu">
<i class="material-icons">recent_actors</i><span>@@directory@@</span> <i class="material-icons" aria-hidden="true">recent_actors</i><span>@@directory@@</span>
</div> </a>
<div class="waves-effect" onclick="filterMenu()" id="filterMenu"> <a class="waves-effect" onclick="filterMenu()" id="filterMenu">
<i class="material-icons">filter_list</i><span>@@filter@@</span> <i class="material-icons" aria-hidden="true">filter_list</i><span>@@filter@@</span>
</div> </a>
<div class="waves-effect" onclick="help()" id="helpMenu"> <a class="waves-effect" onclick="help()" id="helpMenu">
<i class="material-icons">help_outline</i><span>@@helpAndLogs@@</span> <i class="material-icons" aria-hidden="true">help_outline</i><span>@@helpAndLogs@@</span>
</div> </a>
<div class="waves-effect" onclick="location.href='index.html'"> <a class="waves-effect" onclick="location.href='index.html'">
<i class="material-icons">refresh</i><span>@@f5@@</span> <i class="material-icons" aria-hidden="true">refresh</i><span>@@f5@@</span>
</div> </a>
</div> </div>
<div id="right-menu"> <div id="right-menu">
<!--カラム追加--> <!--カラム追加-->
@ -1308,46 +1308,46 @@
<input type="hidden" value="local" id="type-sel" /> <input type="hidden" value="local" id="type-sel" />
@@showThisTL@@ @@showThisTL@@
<div id="tltype"> <div id="tltype">
<div class="type waves-effect active" data-type="local"> <a class="type waves-effect active" data-type="local">
<div><i class="material-icons">people_outline</i></div> <div><i class="material-icons" aria-hidden="true">people_outline</i></div>
<span>@@local@@</span> <span>@@local@@</span>
</div> </a>
<div class="type waves-effect" data-type="local-media"> <a class="type waves-effect" data-type="local-media">
<div><i class="material-icons">perm_media</i></div> <div><i class="material-icons" aria-hidden="true">perm_media</i></div>
<span>@@localMedia@@</span> <span>@@localMedia@@</span>
</div> </a>
<div class="type waves-effect" data-type="home"> <a class="type waves-effect" data-type="home">
<div><i class="material-icons">home</i></div> <div><i class="material-icons" aria-hidden="true">home</i></div>
<span>@@home@@</span> <span>@@home@@</span>
</div> </a>
<div class="type waves-effect" data-type="pub"> <a class="type waves-effect" data-type="pub">
<div><i class="material-icons">language</i></div> <div><i class="material-icons" aria-hidden="true">language</i></div>
<span>@@fed@@</span> <span>@@fed@@</span>
</div> </a>
<div class="type waves-effect" data-type="pub-media"> <a class="type waves-effect" data-type="pub-media">
<div><i class="material-icons">perm_media</i></div> <div><i class="material-icons" aria-hidden="true">perm_media</i></div>
<span>@@fedMedia@@</span> <span>@@fedMedia@@</span>
</div> </a>
<div class="type waves-effect" data-type="dm"> <a class="type waves-effect" data-type="dm">
<div><i class="material-icons">mail_outline</i></div> <div><i class="material-icons" aria-hidden="true">mail_outline</i></div>
<span>@@dm@@</span> <span>@@dm@@</span>
</div> </a>
<div class="type waves-effect" data-type="mix"> <a class="type waves-effect" data-type="mix">
<div><i class="material-icons">merge_type</i></div> <div><i class="material-icons" aria-hidden="true">merge_type</i></div>
<span>@@integratedTLDes@@</span> <span>@@integratedTLDes@@</span>
</div> </a>
<div class="type waves-effect" data-type="plus"> <a class="type waves-effect" data-type="plus">
<div><i class="material-icons">reply</i></div> <div><i class="material-icons" aria-hidden="true">reply</i></div>
<span>@@localPlusDes@@</span> <span>@@localPlusDes@@</span>
</div> </a>
<div class="type waves-effect" data-type="notf"> <a class="type waves-effect" data-type="notf">
<div><i class="material-icons">notifications</i></div> <div><i class="material-icons" aria-hidden="true">notifications</i></div>
<span>@@notf@@</span> <span>@@notf@@</span>
</div> </a>
<div class="type waves-effect" data-type="bookmark"> <a class="type waves-effect" data-type="bookmark">
<div><i class="material-icons">bookmark</i></div> <div><i class="material-icons" aria-hidden="true">bookmark</i></div>
<span>@@bookmark@@</span> <span>@@bookmark@@</span>
</div> </a>
</div> </div>
</div> </div>
<div id="noauth" class="hide"> <div id="noauth" class="hide">

View File

@ -2,6 +2,7 @@
"list":"List of accounts", "list":"List of accounts",
"back":"Back", "back":"Back",
"add":"Add an account", "add":"Add an account",
"addAcct": "Fill the instance domain (like mastodon.social)",
"codesetupwarn":"Uncheck it to skip pasiting code.(login to Mastodon on Windows or macOS) (Recommended: pcheck)", "codesetupwarn":"Uncheck it to skip pasiting code.(login to Mastodon on Windows or macOS) (Recommended: pcheck)",
"codesetup":"Code setup", "codesetup":"Code setup",
"mainacct":"Main an account", "mainacct":"Main an account",

View File

@ -172,6 +172,7 @@
"lang_parse_polled": "'s poll", "lang_parse_polled": "'s poll",
"lang_parse_notftime": "Actioned at", "lang_parse_notftime": "Actioned at",
"lang_parse_cwshow": "Show", "lang_parse_cwshow": "Show",
"lang_parse_cwshow_acc": "This is a post with content warning. click to show the whole content",
"lang_parse_fulltext": "Full size text:", "lang_parse_fulltext": "Full size text:",
"lang_parse_autofold": "Auto folded", "lang_parse_autofold": "Auto folded",
"lang_parse_more": "More", "lang_parse_more": "More",

View File

@ -2,6 +2,7 @@
"list":"アカウント一覧", "list":"アカウント一覧",
"back":"戻る", "back":"戻る",
"add":"アカウントを追加", "add":"アカウントを追加",
"addAcct": "次のボックスにログインしたいサーバのドメインを入力してください。",
"codesetupwarn":"チェックを外すとコード貼り付けをスキップできます。(<u>Mastodon</u>にWindowsやmacOSからログインする場合)失敗する場合はチェックを入れてください。", "codesetupwarn":"チェックを外すとコード貼り付けをスキップできます。(<u>Mastodon</u>にWindowsやmacOSからログインする場合)失敗する場合はチェックを入れてください。",
"codesetup":"コードセットアップ", "codesetup":"コードセットアップ",
"mainacct":"メインアカウント", "mainacct":"メインアカウント",

View File

@ -173,6 +173,7 @@
"lang_parse_polled": "のアンケート", "lang_parse_polled": "のアンケート",
"lang_parse_notftime": "通知された時間", "lang_parse_notftime": "通知された時間",
"lang_parse_cwshow": "見る", "lang_parse_cwshow": "見る",
"lang_parse_cwshow_acc": "これはコンテントワーニングが付与されたトゥートです。全文を見るにはクリックしてください。",
"lang_parse_fulltext": "以下全文", "lang_parse_fulltext": "以下全文",
"lang_parse_autofold": "自動折り畳み", "lang_parse_autofold": "自動折り畳み",
"lang_parse_more": "続き...", "lang_parse_more": "続き...",