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

Redesign of column setting

Browse Source
This commit is contained in:
cutls 2020-09-08 18:50:05 +09:00
parent 62df4e2fac
commit 40a884b4f5
5 changed files with 81 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
app/css/tl.css
View File

@ -634,6 +634,21 @@ p:not(:last-child) {
box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12),
0 5px 5px -3px rgba(0, 0, 0, 0.3), 0px -10px 10px 0px rgba(0, 0, 0, 0.3) inset; 0 5px 5px -3px rgba(0, 0, 0, 0.3), 0px -10px 10px 0px rgba(0, 0, 0, 0.3) inset;
} }
.notf-indv-box label span {
padding-left: 23px !important;
margin-right: 5px;
}
.notf-indv-box .setting {
font-size: 1rem;
width: calc(25% - 3px);
text-align: left;
padding: 5px;
height: 70px;
}
.notf-exclude-btn:hover {
background-color: inherit !important;
border: 1px solid;
}
.type-b { .type-b {
display: none; display: none;
} }

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

@ -228,65 +228,63 @@ function parseColumn(target, dontclose) {
var animecss = '' var animecss = ''
} }
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" title="${lang.lang_layout_unread}"> class="setting nex waves-effect" title="${lang.lang_layout_unread}">
<i class="material-icons waves-effect nex">more</i> <i class="material-icons waves-effect nex">more</i><br />${lang.lang_layout_unread}
</a>${lang.lang_layout_unread}<br>` </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 exclude =
lang.lang_excluded + `<div style="border: 1px solid; padding: 5px; margin-top: 5px; margin-bottom: 5px;">${lang.lang_layout_excluded}:<br>
`:<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')} />
<span> <span>
<i class="fas fa-share exc-icons"></i> ${lang.lang_layout_mention}
</span> </span>
</label> </label>
<label> <label>
<input type="checkbox" class="filled-in" id="exc-fav-${key}" ${excludeCk(key, 'favourite')} /> <input type="checkbox" class="filled-in" id="exc-fav-${key}" ${excludeCk(key, 'favourite')} />
<span> <span>
<i class="fas fa-star exc-icons"></i> ${lang.lang_layout_fav}
</span> </span>
</label> </label>
<label> <label>
<input type="checkbox" class="filled-in" id="exc-bt-${key}" ${excludeCk(key, 'reblog')} /> <input type="checkbox" class="filled-in" id="exc-bt-${key}" ${excludeCk(key, 'reblog')} />
<span> <span>
<i class="fas fa-retweet exc-icons"></i> ${lang.lang_layout_bt}
</span> </span>
</label> </label>
<label> <label>
<input type="checkbox" class="filled-in" id="exc-follow-${key}" ${excludeCk(key, 'follow')} /> <input type="checkbox" class="filled-in" id="exc-follow-${key}" ${excludeCk(key, 'follow')} />
<span> <span>
<i class="fas fa-users exc-icons"></i> ${lang.lang_status_follow}
</span> </span>
</label> </label>
<label> <label>
<input type="checkbox" class="filled-in" id="exc-poll-${key}" ${excludeCk(key, 'poll')} /> <input type="checkbox" class="filled-in" id="exc-poll-${key}" ${excludeCk(key, 'poll')} />
<span> <span>
<i class="fas fa-tasks exc-icons"></i> ${lang.lang_layout_poll}
</span> </span>
</label> </label> <br />
<button class="btn waves-effect" style="width:60px; 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 = exclude =
exclude + exclude +
`<button class="btn red waves-effect" style="width:60px; 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 + '<br>' exclude = exclude + '</div>'
notfDomain = 'dummy' notfDomain = 'dummy'
notfKey = 'dummy' notfKey = 'dummy'
} else if (acct.type == 'home') { } else if (acct.type == 'home') {
var exclude = `<a onclick="ebtToggle('${key}')" class="setting nex"> var exclude = `<a onclick="ebtToggle('${key}')" class="setting nex waves-effect">
<i class="fas fa-retweet waves-effect 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> <span id="sta-bt-${key}">Off</span><br />
</a>
${lang.lang_layout_excludingbt} ${lang.lang_layout_excludingbt}
<br>` </a>`
} else if (acct.type == 'tag') { } else if (acct.type == 'tag') {
if (acct.data.name) { if (acct.data.name) {
var name = acct.data.name var name = acct.data.name
@ -335,15 +333,13 @@ function parseColumn(target, dontclose) {
var basehtml = `<div style="${css}" class="box ${animecss}" id="timeline_box_${basekey}_parentBox"></div>` var basehtml = `<div style="${css}" class="box ${animecss}" id="timeline_box_${basekey}_parentBox"></div>`
$('#timeline-container').append(basehtml) $('#timeline-container').append(basehtml)
} }
var left_hold = `<a onclick="leftFoldSet('${key}')" class="setting nex"> 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> <i class="material-icons waves-effect nex" title="${lang.lang_layout_leftFold}">view_agenda</i><br />
</a> ${lang.lang_layout_leftFold}</a>`
${lang.lang_layout_leftFold}<br>`
} else { } else {
var left_hold = `<a onclick="leftFoldRemove('${key}')" class="setting nex"> 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> <i class="material-icons waves-effect nex" title="${lang.lang_layout_leftUnfold}">view_column</i><br />
</a> ${lang.lang_layout_leftUnfold}</a>`
${lang.lang_layout_leftUnfold}<br>`
} }
if (key === 0) { if (key === 0) {
left_hold = '' left_hold = ''
@ -362,15 +358,15 @@ function parseColumn(target, dontclose) {
var addHeight = '' var addHeight = ''
} }
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"> var mediaFil = `<a onclick="mediaToggle('${key}')" class="setting nex waves-effect">
<i class="material-icons waves-effect 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> <span id="sta-media-${key}">On</span><br />
</a>${lang.lang_layout_mediafil}` ${lang.lang_layout_mediafil}</a>`
} else { } else {
var mediaFil = `<a onclick="remoteOnly('${key}','${acct.type}')" class="setting nex"> var mediaFil = `<a onclick="remoteOnly('${key}','${acct.type}')" class="setting nex waves-effect">
<i class="material-icons waves-effect nex" title="${lang.lang_layout_remoteOnly}">perm_media</i> <i class="material-icons nex" title="${lang.lang_layout_remoteOnly}">perm_media</i><br />
<span id="sta-remote-${key}">Off</span> <span id="sta-remote-${key}">Off</span>
</a>${lang.lang_layout_remoteOnly}` ${lang.lang_layout_remoteOnly}</a>`
} }
var html = ` var html = `
<div class="boxIn" id="timeline_box_${key}_box" tlid="${key}" data-acct="${acct.domain}" style="${addHeight}"> <div class="boxIn" id="timeline_box_${key}_box" tlid="${key}" data-acct="${acct.domain}" style="${addHeight}">
@ -424,28 +420,25 @@ 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}
${unread} ${unread}
${exclude}${left_hold} ${left_hold}
${mediaFil}<br> ${mediaFil}
<a onclick="cardToggle('${key}')" class="setting nex"> <a onclick="cardToggle('${key}')" class="setting nex waves-effect">
<i class="material-icons waves-effect 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> <span id="sta-card-${key}">On</span><br />
</a>
${lang.lang_layout_linkana} ${lang.lang_layout_linkana}
<br>
<a onclick="voiceToggle('${key}')" class="setting nex">
<i class="material-icons waves-effect nex" title="${lang.lang_layout_tts}">hearing</i>
<span id="sta-voice-${key}">On</span>
</a> </a>
<a onclick="voiceToggle('${key}')" class="setting nex waves-effect">
<i class="material-icons nex" title="${lang.lang_layout_tts}">hearing</i>
<span id="sta-voice-${key}">On</span><br />
${lang.lang_layout_tts} ${lang.lang_layout_tts}
TL<br> TL</a>
<a onclick="columnReload('${key}','${acct.type}')" class="setting nex ${if_misskey_hide}"> <a onclick="columnReload('${key}','${acct.type}')" class="setting nex ${if_misskey_hide} waves-effect">
<i class="material-icons waves-effect nex" title="${lang.lang_layout_reconnect}">refresh</i> <i class="material-icons nex" title="${lang.lang_layout_reconnect}">refresh</i>
</a> <br />
<span>
${lang.lang_layout_reconnect} ${lang.lang_layout_reconnect}
</span> </a><br />
<br>
${lang.lang_layout_headercolor} ${lang.lang_layout_headercolor}
<br> <br>
<div id="picker_${key}" class="color-picker"></div> <div id="picker_${key}" class="color-picker"></div>

10
app/view/make/language/en/main.json
View File

@ -131,13 +131,17 @@
"lang_layout_linkana": "Auto Link Analyzer", "lang_layout_linkana": "Auto Link Analyzer",
"lang_layout_linkanades": "Auto link analyzer", "lang_layout_linkanades": "Auto link analyzer",
"lang_layout_tts": "Text to speech ", "lang_layout_tts": "Text to speech ",
"lang_layout_reconnect": "Reload this column", "lang_layout_reconnect": "Reload",
"lang_layout_headercolor": "Header color of this column", "lang_layout_headercolor": "Header color of this column",
"lang_layout_nodata": "[No data]<br>F5/⌘+R to reload", "lang_layout_nodata": "[No data]<br>F5/⌘+R to reload",
"lang_layout_dm": "Direct Message", "lang_layout_dm": "Direct Message",
"lang_layout_webviewmode": "Prefer WebView", "lang_layout_webviewmode": "Prefer WebView",
"lang_excluded": "Excluded type of notification", "lang_layout_excluded": "Excluded type of notification",
"lang_layout_excludingbt": "Show BT mode(OFF/Exclude BT/Only BT)", "lang_layout_mention": "Mentions",
"lang_layout_fav": "Favourites",
"lang_layout_bt": "Boosts",
"lang_layout_poll": "Polls",
"lang_layout_excludingbt": "Show BT mode",
"lang_layout_leftFold": "Stack to the left", "lang_layout_leftFold": "Stack to the left",
"lang_layout_leftUnfold": "Dock on the right", "lang_layout_leftUnfold": "Dock on the right",
"lang_layout_deleteColumn": "Delete this column", "lang_layout_deleteColumn": "Delete this column",

10
app/view/make/language/ja-KS/main.json
View File

@ -130,13 +130,17 @@
"lang_layout_linkanades": "リンクの解析を切り替え", "lang_layout_linkanades": "リンクの解析を切り替え",
"lang_layout_remoteOnly": "リモートのみ", "lang_layout_remoteOnly": "リモートのみ",
"lang_layout_tts": "読み上げ", "lang_layout_tts": "読み上げ",
"lang_layout_reconnect": "カラム再読込", "lang_layout_reconnect": "再読込",
"lang_layout_headercolor": "TLヘッダーカラー", "lang_layout_headercolor": "TLヘッダーカラー",
"lang_layout_nodata": "[トゥートあらへん]<br>F5/⌘+Rで再読込してみて。", "lang_layout_nodata": "[トゥートあらへん]<br>F5/⌘+Rで再読込してみて。",
"lang_layout_dm": "ダイレクトメッセージ", "lang_layout_dm": "ダイレクトメッセージ",
"lang_layout_webviewmode": "WebView優先", "lang_layout_webviewmode": "WebView優先",
"lang_excluded": "見せへん通知", "lang_layout_excluded": "見せへん通知",
"lang_layout_excludingbt": "BT表示(OFF/BT除外/BTだけ)", "lang_layout_mention": "メンション",
"lang_layout_fav": "お気に入り",
"lang_layout_bt": "ブースト",
"lang_layout_poll": "投票",
"lang_layout_excludingbt": "BT表示",
"lang_layout_leftFold": "左へ重ねる", "lang_layout_leftFold": "左へ重ねる",
"lang_layout_leftUnfold": "右へ出す", "lang_layout_leftUnfold": "右へ出す",
"lang_layout_deleteColumn": "カラム削除", "lang_layout_deleteColumn": "カラム削除",

10
app/view/make/language/ja/main.json
View File

@ -132,13 +132,17 @@
"lang_layout_linkana": "リンク解析", "lang_layout_linkana": "リンク解析",
"lang_layout_linkanades": "リンクの解析を切り替え", "lang_layout_linkanades": "リンクの解析を切り替え",
"lang_layout_tts": "読み上げ", "lang_layout_tts": "読み上げ",
"lang_layout_reconnect": "カラム再読込", "lang_layout_reconnect": "再読込",
"lang_layout_headercolor": "TLヘッダーカラー", "lang_layout_headercolor": "TLヘッダーカラー",
"lang_layout_nodata": "[ここにトゥートはありません。]<br>F5/⌘+Rで再読込できます。", "lang_layout_nodata": "[ここにトゥートはありません。]<br>F5/⌘+Rで再読込できます。",
"lang_layout_dm": "ダイレクトメッセージ", "lang_layout_dm": "ダイレクトメッセージ",
"lang_layout_webviewmode": "WebView優先", "lang_layout_webviewmode": "WebView優先",
"lang_excluded": "除外する通知", "lang_layout_excluded": "除外する通知",
"lang_layout_excludingbt": "BT表示(OFF/BT除外/BTのみ)", "lang_layout_mention": "メンション",
"lang_layout_fav": "お気に入り",
"lang_layout_bt": "ブースト",
"lang_layout_poll": "投票",
"lang_layout_excludingbt": "BT表示",
"lang_layout_leftFold": "左へ重ねる", "lang_layout_leftFold": "左へ重ねる",
"lang_layout_leftUnfold": "右へ出す", "lang_layout_leftUnfold": "右へ出す",
"lang_layout_deleteColumn": "カラム削除", "lang_layout_deleteColumn": "カラム削除",