Add Theme Preview
This commit is contained in:
parent
54031da417
commit
3e0a048e28
|
@ -509,6 +509,13 @@ h2.swal2-title {
|
|||
margin: 0;
|
||||
line-height: 100%;
|
||||
}
|
||||
.swal2-close:focus {
|
||||
background-color: inherit !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.swal2-actions {
|
||||
background-color: var(--modalfooter);
|
||||
}
|
||||
#src-contents svg {
|
||||
margin-right: 0.4rem;
|
||||
}
|
||||
|
|
2
app/css/sweetalert2-material.min.css
vendored
2
app/css/sweetalert2-material.min.css
vendored
File diff suppressed because one or more lines are too long
|
@ -66,7 +66,9 @@ onmessage = function(e) {
|
|||
console.log('NowPlaying')
|
||||
ipc.send('itunes', e.data[1])
|
||||
} else if (e.data[0] == 'themeCSSRequest') {
|
||||
ipc.send('theme-css-request', e.data[1])
|
||||
ipc.send('theme-css-request', e.data)
|
||||
} else if (e.data[0] == 'themeCSSPreview') {
|
||||
ipc.send('theme-css-request', e.data)
|
||||
} else if (e.data[0] == 'customCSSRequest') {
|
||||
ipc.send('custom-css-request', e.data[1])
|
||||
} else if (e.data[0] == 'downloadButton') {
|
||||
|
|
|
@ -392,10 +392,6 @@ function exportSettingsCore() {
|
|||
return exp
|
||||
}
|
||||
function importSettings() {
|
||||
if ($('#imp-exp').val()) {
|
||||
importSettingsCore(JSON5.parse($('#imp-exp').val()))
|
||||
return false
|
||||
}
|
||||
Swal.fire({
|
||||
title: 'Warning',
|
||||
text: lang.lang_setting_importwarn,
|
||||
|
@ -405,6 +401,10 @@ function importSettings() {
|
|||
cancelButtonText: lang.lang_no,
|
||||
}).then((result) => {
|
||||
if (result.value) {
|
||||
if ($('#imp-exp').val()) {
|
||||
importSettingsCore(JSON5.parse($('#imp-exp').val()))
|
||||
return false
|
||||
}
|
||||
postMessage(['importSettings', ''], '*')
|
||||
}
|
||||
})
|
||||
|
@ -553,9 +553,9 @@ function copyColor(from, to) {
|
|||
i++
|
||||
}
|
||||
}
|
||||
function customComp() {
|
||||
function customComp(preview) {
|
||||
var nameC = $('#custom_name').val()
|
||||
if (!nameC) {
|
||||
if (!nameC && !preview) {
|
||||
return false
|
||||
}
|
||||
var descC = $('#custom_desc').val()
|
||||
|
@ -587,7 +587,7 @@ function customComp() {
|
|||
if (id == 'add_new' || defaults.includes(id)) {
|
||||
id = makeCID()
|
||||
}
|
||||
localStorage.setItem('customtheme-id', id)
|
||||
if (!preview) localStorage.setItem('customtheme-id', id)
|
||||
var json = {
|
||||
name: nameC,
|
||||
author: my,
|
||||
|
@ -604,38 +604,18 @@ function customComp() {
|
|||
version: '2'
|
||||
}
|
||||
$('#custom_json').val(JSON.stringify(json))
|
||||
let timerInterval
|
||||
Swal.fire({
|
||||
title: 'Saving...',
|
||||
html: '',
|
||||
timer: 1000,
|
||||
timerProgressBar: true,
|
||||
onBeforeOpen: () => {
|
||||
Swal.showLoading()
|
||||
},
|
||||
onClose: () => {
|
||||
clearInterval(timerInterval)
|
||||
}
|
||||
}).then((result) => {
|
||||
themes()
|
||||
ctLoad()
|
||||
if (preview) {
|
||||
postMessage(['themeCSSPreview', json], '*')
|
||||
} else {
|
||||
$('#custom-edit-sel').val(id)
|
||||
$('select').formSelect()
|
||||
Swal.fire({
|
||||
title: 'Refreshing...',
|
||||
html: '',
|
||||
timer: 1000,
|
||||
timerProgressBar: true,
|
||||
onBeforeOpen: () => {
|
||||
Swal.showLoading()
|
||||
},
|
||||
onClose: () => {
|
||||
clearInterval(timerInterval)
|
||||
}
|
||||
}).then((result) => {
|
||||
$('#custom-edit-sel').val(id)
|
||||
$('select').formSelect()
|
||||
type: 'success',
|
||||
title: 'Saved',
|
||||
})
|
||||
})
|
||||
postMessage(['themeJsonCreate', JSON.stringify(json)], '*')
|
||||
postMessage(['themeJsonCreate', JSON.stringify(json)], '*')
|
||||
}
|
||||
|
||||
}
|
||||
function deleteIt() {
|
||||
var id = $('#custom-sel-sel').val()
|
||||
|
|
|
@ -31,7 +31,7 @@ function css(mainWindow) {
|
|||
}
|
||||
})
|
||||
ipc.on('theme-json-delete', function (e, arg) {
|
||||
try{
|
||||
try {
|
||||
var themecss = join(app.getPath("userData"), arg);
|
||||
console.log(themecss);
|
||||
fs.unlink(themecss, function (err) {
|
||||
|
@ -54,13 +54,17 @@ function css(mainWindow) {
|
|||
}
|
||||
e.sender.send('theme-json-response', [json, raw]);
|
||||
})
|
||||
ipc.on('theme-css-request', function (e, arg) {
|
||||
try {
|
||||
var themecss = join(app.getAppPath(), '/source/themes', arg)
|
||||
var json = JSON5.parse(fs.readFileSync(themecss, 'utf8'))
|
||||
} catch {
|
||||
var themecss = join(app.getPath("userData"), arg)
|
||||
var json = JSON5.parse(fs.readFileSync(themecss, 'utf8'))
|
||||
ipc.on('theme-css-request', function (e, args) {
|
||||
if (args[0] === 'themeCSSPreview') {
|
||||
var json = args[1]
|
||||
} else {
|
||||
try {
|
||||
var themecss = join(app.getAppPath(), '/source/themes', args[1])
|
||||
var json = JSON5.parse(fs.readFileSync(themecss, 'utf8'))
|
||||
} catch {
|
||||
var themecss = join(app.getPath("userData"), args[1])
|
||||
var json = JSON5.parse(fs.readFileSync(themecss, 'utf8'))
|
||||
}
|
||||
}
|
||||
|
||||
try {
|
||||
|
|
|
@ -72,6 +72,7 @@
|
|||
"desc": "About this theme",
|
||||
"customImport": "Import of custom themes",
|
||||
"delete": "Delete",
|
||||
"preview": "Preview",
|
||||
"timeline": "Timeline Preferences",
|
||||
"timemode": "Time format",
|
||||
"relativetime": "Relative format:\"1 minutes ago\",\"3 days ago\"",
|
||||
|
|
|
@ -70,6 +70,7 @@
|
|||
"name": "名前",
|
||||
"desc": "説明",
|
||||
"customImport": "カスタムテーマのインポート",
|
||||
"preview": "プレビュー",
|
||||
"delete": "削除",
|
||||
"timeline": "タイムラインの設定",
|
||||
"timemode": "時間表記設定",
|
||||
|
|
|
@ -72,6 +72,7 @@
|
|||
"desc": "説明",
|
||||
"customImport": "カスタムテーマのインポート",
|
||||
"delete": "削除",
|
||||
"preview": "プレビュー",
|
||||
"timeline": "タイムラインの設定",
|
||||
"timemode": "時間表記設定",
|
||||
"relativetime": "相対時間の例:\"1分前\",\"3日前\"",
|
||||
|
|
|
@ -15,6 +15,7 @@
|
|||
<link href="../../css/themes.css" type="text/css" rel="stylesheet">
|
||||
<link href="../../css/pickr.css" type="text/css" rel="stylesheet">
|
||||
<link href="../../css/master.css" type="text/css" rel="stylesheet">
|
||||
<link href="../../css/tl.css" type="text/css" rel="stylesheet">
|
||||
<link href="../../css/sweetalert2-material.min.css" type="text/css" rel="stylesheet">
|
||||
<link href="../../@@node_base@@/@fortawesome/fontawesome-free/css/all.min.css" type="text/css" rel="stylesheet">
|
||||
<meta charset="utf-8">
|
||||
|
@ -288,6 +289,7 @@
|
|||
<input type="color" id="color-picker13_value">
|
||||
</div>
|
||||
</div><br /><br />
|
||||
<button class="btn waves-effect blue" onclick="customComp(true)">@@preview@@</button><br /><br />
|
||||
<button class="btn-large waves-effect" onclick="customComp()">@@change@@</button> <button
|
||||
class="btn waves-effect red disabled" id="delTheme" onclick="deleteIt()">@@delete@@</button><br><br>
|
||||
<input type="text" style="width:22rem;height:40px;" id="custom_json" class="materialize-textarea"
|
||||
|
@ -296,6 +298,84 @@
|
|||
<input type="text" style="width:22rem;height:40px;" id="custom_import" class="materialize-textarea"
|
||||
placeholder="JSON/JSON5 style">
|
||||
<button class="btn waves-effect" onclick="customImp()">@@import@@</button><br>
|
||||
<h4>@@preview@@</h4>
|
||||
<div style="max-width: 500px" class="cvo">
|
||||
<div class="area-notice grid"><span class="gray sharesta"><span class=" pointer big-text "><i class="fas fa-filter">
|
||||
</i></span>
|
||||
<span class="cbadge cbadge-hover"><i class="far fa-clock"></i>
|
||||
0:00:00
|
||||
</span>
|
||||
<i class="big-text fas fa-star yellow-text"></i>
|
||||
<a class="pointer grey-text">
|
||||
TheDesk(@thedesk@b.thedesk.tld)
|
||||
</a></span></div>
|
||||
<div class="area-icon grid">
|
||||
<a user="thedesk" class="udg">
|
||||
<img draggable="false" src="../../img/desk.svg" width="40" class="prof-img" user="TheDesk"
|
||||
onerror="this.src='../../img/loading.svg'" alt="" loading="lazy">
|
||||
</a>
|
||||
<a user="Cutls@misskey.io" class="udg">
|
||||
<img draggable="false" src="../../img/desk.svg" width="20" class="notf-icon prof-img" user="TheDesk" alt=""
|
||||
loading="lazy">
|
||||
</a>
|
||||
</div>
|
||||
<div class="area-display_name grid">
|
||||
<div class="flex-name">
|
||||
<span class="user">TheDesk<img class="emoji" draggable="false" alt="👀" src="https://twemoji.maxcdn.com/v/13.0.2/72x72/1f440.png"></span>
|
||||
<span class="sml gray" style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis; cursor:text;">
|
||||
@thedesk@a.thedesk.tld <i class="fas fa-lock red-text"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex-time">
|
||||
<span class="cbadge cbadge-hover pointer waves-effect">
|
||||
<i class="far fa-clock"></i>0:00:00
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="area-toot grid">
|
||||
<div class="toot ">
|
||||
<p>Toot</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="area-vis grid"><span><i class="text-darken-3 material-icons gray sml vis-data pointer">
|
||||
public
|
||||
</i></span></div>
|
||||
<div class="area-actions grid">
|
||||
<div class="action type-a ">
|
||||
<a class="waves-effect waves-dark btn-flat actct rep-btn" style="padding:0">
|
||||
<i class="fas fa-share"></i>
|
||||
<span class="rep_ct">1</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="action type-a ">
|
||||
<a class="waves-effect waves-dark btn-flat actct bt-btn" style="padding:0">
|
||||
<i class="fas fa-retweet"></i>
|
||||
<span class="rt_ct">0</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="action type-a ">
|
||||
<a class="waves-effect waves-dark btn-flat actct fav-btn" style="padding:0">
|
||||
<i class="fas text-darken-3 fa-star"></i>
|
||||
<span class="fav_ct">1</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="area-side">
|
||||
<div class="action ">
|
||||
<a onclick="toggleAction(this)" data-target="dropdown_0ugtorxe"
|
||||
class="ctxMenu waves-effect waves-dark btn-flat" style="padding:0" id="trigger_0ugtorxe">
|
||||
<i class="text-darken-3 material-icons act-icon" aria-hidden="true">expand_more</i>
|
||||
<span class="voice">Other actions</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="action ">
|
||||
<a class="waves-effect waves-dark btn-flat details " style="padding:0">
|
||||
<i class="text-darken-3 material-icons" aria-hidden="true">menu_open</i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</li>
|
||||
<li>
|
||||
<div class="collapsible-header">
|
||||
|
|
|
@ -27,7 +27,7 @@
|
|||
<body class="">
|
||||
<script>
|
||||
var ver = '22.1.2 (Koume)'
|
||||
var gitHash = 'c35a27eda6cf3b664206cd99f2ceebdac2c086be'
|
||||
var gitHash = '54031da417401bf8181e0a3ee482927712eed1db'
|
||||
//betaを入れるとバージョンチェックしない
|
||||
//var ver="beta";
|
||||
var acct_id = 0
|
||||
|
|
|
@ -15,6 +15,7 @@
|
|||
<link href="../../css/themes.css" type="text/css" rel="stylesheet">
|
||||
<link href="../../css/pickr.css" type="text/css" rel="stylesheet">
|
||||
<link href="../../css/master.css" type="text/css" rel="stylesheet">
|
||||
<link href="../../css/tl.css" type="text/css" rel="stylesheet">
|
||||
<link href="../../css/sweetalert2-material.min.css" type="text/css" rel="stylesheet">
|
||||
<link href="../../node_modules/@fortawesome/fontawesome-free/css/all.min.css" type="text/css" rel="stylesheet">
|
||||
<meta charset="utf-8">
|
||||
|
@ -288,6 +289,7 @@
|
|||
<input type="color" id="color-picker13_value">
|
||||
</div>
|
||||
</div><br /><br />
|
||||
<button class="btn waves-effect blue" onclick="customComp(true)">Preview</button><br /><br />
|
||||
<button class="btn-large waves-effect" onclick="customComp()">Zmień</button> <button
|
||||
class="btn waves-effect red disabled" id="delTheme" onclick="deleteIt()">Delete</button><br><br>
|
||||
<input type="text" style="width:22rem;height:40px;" id="custom_json" class="materialize-textarea"
|
||||
|
@ -296,6 +298,84 @@
|
|||
<input type="text" style="width:22rem;height:40px;" id="custom_import" class="materialize-textarea"
|
||||
placeholder="JSON/JSON5 style">
|
||||
<button class="btn waves-effect" onclick="customImp()">Import</button><br>
|
||||
<h4>Preview</h4>
|
||||
<div style="max-width: 500px" class="cvo">
|
||||
<div class="area-notice grid"><span class="gray sharesta"><span class=" pointer big-text "><i class="fas fa-filter">
|
||||
</i></span>
|
||||
<span class="cbadge cbadge-hover"><i class="far fa-clock"></i>
|
||||
0:00:00
|
||||
</span>
|
||||
<i class="big-text fas fa-star yellow-text"></i>
|
||||
<a class="pointer grey-text">
|
||||
TheDesk(@thedesk@b.thedesk.tld)
|
||||
</a></span></div>
|
||||
<div class="area-icon grid">
|
||||
<a user="thedesk" class="udg">
|
||||
<img draggable="false" src="../../img/desk.svg" width="40" class="prof-img" user="TheDesk"
|
||||
onerror="this.src='../../img/loading.svg'" alt="" loading="lazy">
|
||||
</a>
|
||||
<a user="Cutls@misskey.io" class="udg">
|
||||
<img draggable="false" src="../../img/desk.svg" width="20" class="notf-icon prof-img" user="TheDesk" alt=""
|
||||
loading="lazy">
|
||||
</a>
|
||||
</div>
|
||||
<div class="area-display_name grid">
|
||||
<div class="flex-name">
|
||||
<span class="user">TheDesk<img class="emoji" draggable="false" alt="👀" src="https://twemoji.maxcdn.com/v/13.0.2/72x72/1f440.png"></span>
|
||||
<span class="sml gray" style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis; cursor:text;">
|
||||
@thedesk@a.thedesk.tld <i class="fas fa-lock red-text"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex-time">
|
||||
<span class="cbadge cbadge-hover pointer waves-effect">
|
||||
<i class="far fa-clock"></i>0:00:00
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="area-toot grid">
|
||||
<div class="toot ">
|
||||
<p>Toot</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="area-vis grid"><span><i class="text-darken-3 material-icons gray sml vis-data pointer">
|
||||
public
|
||||
</i></span></div>
|
||||
<div class="area-actions grid">
|
||||
<div class="action type-a ">
|
||||
<a class="waves-effect waves-dark btn-flat actct rep-btn" style="padding:0">
|
||||
<i class="fas fa-share"></i>
|
||||
<span class="rep_ct">1</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="action type-a ">
|
||||
<a class="waves-effect waves-dark btn-flat actct bt-btn" style="padding:0">
|
||||
<i class="fas fa-retweet"></i>
|
||||
<span class="rt_ct">0</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="action type-a ">
|
||||
<a class="waves-effect waves-dark btn-flat actct fav-btn" style="padding:0">
|
||||
<i class="fas text-darken-3 fa-star"></i>
|
||||
<span class="fav_ct">1</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="area-side">
|
||||
<div class="action ">
|
||||
<a onclick="toggleAction(this)" data-target="dropdown_0ugtorxe"
|
||||
class="ctxMenu waves-effect waves-dark btn-flat" style="padding:0" id="trigger_0ugtorxe">
|
||||
<i class="text-darken-3 material-icons act-icon" aria-hidden="true">expand_more</i>
|
||||
<span class="voice">Other actions</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="action ">
|
||||
<a class="waves-effect waves-dark btn-flat details " style="padding:0">
|
||||
<i class="text-darken-3 material-icons" aria-hidden="true">menu_open</i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</li>
|
||||
<li>
|
||||
<div class="collapsible-header">
|
||||
|
@ -610,7 +690,7 @@
|
|||
style="width:100%; max-width:40rem;"><img src="../../img/desk_full.svg" class="left" width="25"
|
||||
style="padding-top:5px;">Main author: Cutls@cutls.com</a>
|
||||
<br>
|
||||
TheDesk @ <a href="https://github.com/cutls/TheDesk/commits/c35a27eda6cf3b664206cd99f2ceebdac2c086be">c35a27eda6cf3b664206cd99f2ceebdac2c086be</a> - <a
|
||||
TheDesk @ <a href="https://github.com/cutls/TheDesk/commits/54031da417401bf8181e0a3ee482927712eed1db">54031da417401bf8181e0a3ee482927712eed1db</a> - <a
|
||||
onclick="checkupd(); return localStorage.removeItem('new-ver-skip'); location.href='index.html';"
|
||||
class="pointer pwa">Sprawdź aktualizacje</a><br>
|
||||
<br>
|
||||
|
@ -620,7 +700,7 @@
|
|||
<img src="https://status.cutls.com/badge-service?site=thedesk.top">
|
||||
</a><br>
|
||||
<h5>OSS License</h5>
|
||||
<a href="https://app.fossa.com/projects/git%2Bgithub.com%2Fcutls%2FTheDesk/refs/branch/master/c35a27eda6cf3b664206cd99f2ceebdac2c086be"
|
||||
<a href="https://app.fossa.com/projects/git%2Bgithub.com%2Fcutls%2FTheDesk/refs/branch/master/54031da417401bf8181e0a3ee482927712eed1db"
|
||||
alt="FOSSA Status"><img
|
||||
src="https://app.fossa.com/api/projects/git%2Bgithub.com%2Fcutls%2FTheDesk.svg?type=small" /></a>
|
||||
<br>
|
||||
|
|
Loading…
Reference in New Issue
Block a user