1
0
mirror of https://github.com/chylex/TweetDuck.git synced 2025-04-13 18:15:48 +02:00

Rewrite and begin redesigning update dialog

This commit is contained in:
chylex 2017-06-22 09:48:50 +02:00
parent 8becef3e45
commit c60a8ddf66

View File

@ -22,7 +22,7 @@
//
// Constant: Fallback url in case the update installer file is missing.
//
const updateDownloadFallback = "https://tweetduck.chylex.com/#download";
const updateDownloadFallback = "https://tweetduck.chylex.com";
//
// Function: Creates the update notification element. Removes the old one if already exists.
@ -30,6 +30,49 @@
var displayNotification = function(version, download){
var outdated = version === "unsupported";
var css = $("#tweetduck-update-css");
if (!css.length){
css = $(`
<style id='tweetduck-update-css'>
#tweetduck-update {
position: absolute;
bottom: 0;
width: 200px;
height: 170px;
z-index: 9999;
color: #fff;
background-color: rgb(32, 94, 138);
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}
p.tdu-title {
font-size: 17px;
font-weight: bold;
text-align: center;
letter-spacing: 0.2px;
margin: 8px auto 2px;
}
p.tdu-info {
font-size: 12px;
text-align: center;
margin: 3px auto 0;
}
div.tdu-buttons button {
display: block;
margin: 7px auto 0;
width: 80%;
height: 30px;
border-radius: 1px;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
box-shadow: 1px 1px 1px rgba(17, 17, 17, 0.5);
}
</style>
`).appendTo(document.head);
}
var ele = $("#tweetduck-update");
var existed = ele.length > 0;
@ -37,80 +80,35 @@
ele.remove();
}
var html = outdated ? [
"<div id='tweetduck-update'>",
"<p class='tdu-title'>Unsupported System</p>",
"<p class='tdu-info'>You will not receive updates.</p>",
"<div class='tdu-buttons'>",
"<button class='btn btn-positive tdu-btn-unsupported'><span class='label'>Read More</span></button>",
"<button class='btn btn-negative tdu-btn-dismiss'><span class='label'>Dismiss</span></button>",
"</div>",
"</div>"
] : [
"<div id='tweetduck-update'>",
"<p class='tdu-title'>TweetDuck Update</p>",
"<p class='tdu-info'>Version "+version+" is now available.</p>",
"<div class='tdu-buttons'>",
"<button class='btn btn-positive tdu-btn-download'><span class='label'>Download</span></button>",
"<button class='btn btn-negative tdu-btn-dismiss'><span class='label'>Dismiss</span></button>",
"</div>",
"</div>"
];
$(document.body).append(html.join(""));
ele = $("#tweetduck-update");
ele = $(outdated ? `
<div id='tweetduck-update'>
<p class='tdu-title'>Unsupported System</p>
<p class='tdu-info'>You will not receive updates.</p>
<div class='tdu-buttons'>
<button class='btn btn-positive tdu-btn-unsupported'>Read more</button>
<button class='btn btn-negative tdu-btn-ignore'>Dismiss</button>
</div>
</div>
` : `
<div id='tweetduck-update'>
<p class='tdu-title'>TweetDuck Update</p>
<p class='tdu-info'>Version ${version} is now available.</p>
<div class='tdu-buttons'>
<button class='btn btn-positive tdu-btn-download'>Update now</button>
<button class='btn btn-negative tdu-btn-ignore'>Ignore this update</button>
</div>
</div>
`).appendTo(document.body).css("display", existed ? "block" : "none");
var hide = function(){
ele.remove();
css.remove();
};
var buttonDiv = ele.children("div.tdu-buttons").first();
ele.css({
color: "#fff",
backgroundColor: "rgb(32,94,138)",
position: "absolute",
left: "4px",
bottom: "4px",
width: "192px",
height: "86px",
display: existed ? "block" : "none",
borderRadius: "2px",
zIndex: 9999
});
ele.children("p.tdu-title").first().css({
fontSize: "17px",
fontWeight: "bold",
textAlign: "center",
letterSpacing: "0.2px",
margin: "5px auto 2px"
});
ele.children("p.tdu-info").first().css({
fontSize: "12px",
textAlign: "center",
margin: "2px auto 6px"
});
buttonDiv.css({
textAlign: "center"
});
buttonDiv.children().css({
margin: "0 4px",
minHeight: "25px",
boxShadow: "1px 1px 1px rgba(17,17,17,0.5)"
});
buttonDiv.find("span").css({
verticalAlign: "baseline"
});
ele.find("span.tdu-data-tag").first().css({
cursor: "pointer",
textDecoration: "underline"
});
buttonDiv.children(".tdu-btn-download").click(function(){
ele.remove();
hide();
if (download){
$TDU.onUpdateAccepted();
@ -124,9 +122,9 @@
$TDU.openBrowser("https://github.com/chylex/TweetDuck/wiki/Supported-Systems");
});
buttonDiv.children(".tdu-btn-dismiss,.tdu-btn-unsupported").click(function(){
buttonDiv.children(".tdu-btn-ignore,.tdu-btn-unsupported").click(function(){
$TDU.onUpdateDismissed();
ele.slideUp(function(){ ele.remove(); });
ele.slideUp(hide);
});
if (!existed){