Skip to content

Commit 0e16840

Browse files
PalmerALPalmerAL
committed
Refactor downloadButton.js; show option for mac ARM build
1 parent ec507c4 commit 0e16840

1 file changed

Lines changed: 91 additions & 94 deletions

File tree

‎downloadButton.js‎

Lines changed: 91 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -4,34 +4,55 @@ function showDialogBackdrop () {
44
document.body.appendChild(backdrop)
55
backdrop.addEventListener('click', function () {
66
backdrop.parentNode.removeChild(backdrop)
7-
var dialog = document.querySelector('.dialog')
8-
dialog.parentNode.removeChild(dialog)
7+
var dialogs = Array.from(document.querySelectorAll('.dialog'))
8+
dialogs.forEach(dialog => dialog.remove())
99
})
1010
}
1111

12-
var sponsorMessage = '\
13-
<div\
14-
style="box-shadow: 1px 0 10px 0 rgba(0,0,0,0.3);padding: 1em 3em;margin-left: -0.75em;margin-right: -0.75em;margin-top: 2em;border-radius: 6px;">\
15-
<h2 style="margin-bottom: 0.25em;margin-top: 0;"><i class="i carbon:favorite"\
16-
style="color: #ff0759;margin-left: -38px;margin-right: 12px;vertical-align: text-top;"></i>Help support Min\
17-
</h2>By contributing, you\'ll help Min continue receiving new features and updates. You can also be listed as a sponsor and have priority support.<br><a style="margin-top: 1em; display: inline-block;"\
18-
href="https://github.com/sponsors/PalmerAL" target="_blank">Sponsor on GitHub <i class="i carbon:caret-right"\
19-
style="font-size: 1.3em;vertical-align: text-top;margin-top: -2px;display: inline-block;margin-left: -2px;"></i></a>\
20-
</div>\
21-
'
22-
23-
function showMacDialog () {
12+
var sponsorMessage = `
13+
<div
14+
style="box-shadow: 1px 0 10px 0 rgba(0,0,0,0.3);padding: 1em 3em;margin-left: -0.75em;margin-right: -0.75em;margin-top: 2em;border-radius: 6px;">
15+
<h2 style="margin-bottom: 0.25em;margin-top: 0;"><i class="i carbon:favorite"
16+
style="color: #ff0759;margin-left: -38px;margin-right: 12px;vertical-align: text-top;"></i>Help support Min
17+
</h2>By contributing, you'll help Min continue receiving new features and updates. You can also be listed as a sponsor and have priority support.<br><a style="margin-top: 1em; display: inline-block;"
18+
href="https://github.com/sponsors/PalmerAL" target="_blank">Sponsor on GitHub <i class="i carbon:caret-right"
19+
style="font-size: 1.3em;vertical-align: text-top;margin-top: -2px;display: inline-block;margin-left: -2px;"></i></a>
20+
</div>
21+
`
22+
23+
function showMacStageOneDialog (downloadLinks) {
2424
showDialogBackdrop()
2525

2626
var dialog = document.createElement('div')
2727
dialog.className = 'dialog centered'
28-
dialog.innerHTML = '<h2>How to install</h2>\
29-
<ul>\
30-
<li>Drag Min from your Downloads folder to the Applications folder.</li>\
31-
<li>Right click on Min.</li>\
32-
<li>Choose "Open".</li>\
33-
<li>If a warning dialog is shown, choose "Open".</li>\
34-
</ul>' + sponsorMessage
28+
dialog.innerHTML = `
29+
<h3> Pick the version of Min that's right for your Mac: </h3>
30+
<a id="download-mac-intel"><button class="button outlined-button outlined-button-white" style="display: block; margin: auto">Intel Mac</button></a>
31+
<br>
32+
<a id="download-mac-arm"><button class="button outlined-button outlined-button-white" style="display: block; margin: auto">Apple Silicon Mac</button></a>
33+
<br/>
34+
<div style="margin-top:0.25em"><a href="https://support.apple.com/en-us/HT211814" target="_blank">What kind of Mac do I have?</a></div>
35+
`
36+
37+
dialog.querySelector('#download-mac-intel').href = downloadLinks.intel
38+
dialog.querySelector('#download-mac-arm').href = downloadLinks.arm
39+
40+
dialog.querySelector('#download-mac-intel').addEventListener('click', showMacStageTwosDialog)
41+
dialog.querySelector('#download-mac-arm').addEventListener('click', showMacStageTwosDialog)
42+
43+
document.body.appendChild(dialog)
44+
}
45+
46+
function showMacStageTwosDialog () {
47+
var dialog = document.createElement('div')
48+
dialog.className = 'dialog centered'
49+
dialog.innerHTML = `<h2>How to install</h2>
50+
<ul>
51+
<li>Drag Min from your Downloads folder to the Applications folder.</li>
52+
<li>Right click on Min.</li>
53+
<li>Choose "Open".</li>
54+
<li>If a warning dialog is shown, choose "Open".</li>
55+
</ul>` + sponsorMessage
3556

3657
document.body.appendChild(dialog)
3758
}
@@ -41,13 +62,13 @@ function showWindowsDialog () {
4162

4263
var dialog = document.createElement('div')
4364
dialog.className = 'dialog centered'
44-
dialog.innerHTML = '<h2>How to install</h2>\
45-
<ul>\
46-
<li>Start the installer.</li>\
47-
<li>If a warning dialog is shown, choose "More Info".</li>\
48-
<li>Choose "Run Anyway".</li>\
49-
<li>Wait for Min to open.</li>\
50-
</ul>' + sponsorMessage
65+
dialog.innerHTML = `<h2>How to install</h2>
66+
<ul>
67+
<li>Start the installer.</li>
68+
<li>If a warning dialog is shown, choose "More Info".</li>
69+
<li>Choose "Run Anyway".</li>
70+
<li>Wait for Min to open.</li>
71+
</ul>` + sponsorMessage
5172

5273
document.body.appendChild(dialog)
5374
}
@@ -57,14 +78,14 @@ function showLinuxDialog (downloadLinks) {
5778

5879
var dialog = document.createElement('div')
5980
dialog.className = 'dialog centered'
60-
dialog.innerHTML = '\
61-
<h3> For Debian-based distributions:</h3>\
62-
<a id="download-deb-link"><button class="button outlined-button outlined-button-white" style="display: block; margin: auto">Download .deb</button></a>\
63-
<div>Install with <pre style="display: inline-block; margin-left: 0.5em">sudo dpkg -i /path/to/download</pre> </div>\
64-
<h3> For RPM-based distributions:</h3>\
65-
<a id="download-rpm-link"><button id="download-rpm-button" class="button outlined-button outlined-button-white" style="display: block; margin: auto">Download .rpm</button></a>\
66-
<div>Install with <pre style="display: inline-block; margin-left: 0.5em">sudo rpm -i /path/to/download --ignoreos</pre> </div>\
67-
' + sponsorMessage
81+
dialog.innerHTML = `
82+
<h3> For Debian-based distributions:</h3>
83+
<a id="download-deb-link"><button class="button outlined-button outlined-button-white" style="display: block; margin: auto">Download .deb</button></a>
84+
<div>Install with <pre style="display: inline-block; margin-left: 0.5em">sudo dpkg -i /path/to/download</pre> </div>
85+
<h3> For RPM-based distributions:</h3>
86+
<a id="download-rpm-link"><button id="download-rpm-button" class="button outlined-button outlined-button-white" style="display: block; margin: auto">Download .rpm</button></a>
87+
<div>Install with <pre style="display: inline-block; margin-left: 0.5em">sudo rpm -i /path/to/download --ignoreos</pre> </div>
88+
` + sponsorMessage
6889

6990
dialog.querySelector('#download-deb-link').href = downloadLinks.deb
7091
dialog.querySelector('#download-rpm-link').href = downloadLinks.rpm
@@ -76,79 +97,55 @@ function showLinuxDialog (downloadLinks) {
7697

7798
var failMessage = "Min isn't supported on your OS"
7899

79-
// matches against navigator.platform
80-
var platformMatchStrings = {
81-
MacIntel: 'https://github.com/minbrowser/min/releases/download/v1.19.1/Min-v1.19.1-darwin-x64.zip',
82-
// electron no longer supports 32-bit linux (https://electronjs.org/blog/linux-32bit-support), so there's only a 64-bit build available
83-
// 'Linux aarch64': 'https://github.com/minbrowser/min/releases/download/v1.19.1/min_1.19.1_armhf.deb',
84-
// this could be either 32- or 64- bit, but we only have 64-bit downloads, so just display that and hope it works
85-
Linux: {
86-
// there isn't an obvious way to detect deb- or rpm-based systems
100+
var downloadLinks = {
101+
mac: {
102+
intel: 'https://github.com/minbrowser/min/releases/download/v1.19.1/Min-v1.19.1-darwin-x64.zip',
103+
arm: 'https://github.com/minbrowser/min/releases/download/v1.19.1/Min-v1.19.1-darwin-arm64.zip'
104+
},
105+
linux: {
87106
deb: 'https://github.com/minbrowser/min/releases/download/v1.19.1/min_1.19.1_amd64.deb',
88107
rpm: 'https://github.com/minbrowser/min/releases/download/v1.19.1/min-1.19.1-1.x86_64.rpm'
89-
}
90-
}
91-
92-
// matches against navigator.userAgent
93-
var UAMatchStrings = {
94-
Win64: 'https://github.com/minbrowser/min/releases/download/v1.19.1/min-1.19.1-setup.exe',
95-
WOW64: 'https://github.com/minbrowser/min/releases/download/v1.19.1/min-1.19.1-setup.exe',
96-
// neither of the 64-bit strings matched, fall back to 32-bit
97-
// there currently aren't any 32-bit windows builds, so just use the 64-bit installer anyway
98-
'Windows NT': 'https://github.com/minbrowser/min/releases/download/v1.19.1/min-1.19.1-setup.exe'
108+
},
109+
windows: 'https://github.com/minbrowser/min/releases/download/v1.19.1/min-1.19.1-setup.exe'
99110
}
100111

101-
function getDownloadLink () {
102-
var downloadLink = null
103-
104-
for (var platform in platformMatchStrings) {
105-
if (navigator.platform.indexOf(platform) !== -1) {
106-
downloadLink = platformMatchStrings[platform]
107-
break
108-
}
112+
function getUserPlatform () {
113+
if (navigator.platform === 'MacIntel') {
114+
return 'mac'
109115
}
110-
111-
if (!downloadLink) {
112-
for (var ua in UAMatchStrings) {
113-
if (navigator.userAgent.indexOf(ua) !== -1) {
114-
downloadLink = UAMatchStrings[ua]
115-
break
116-
}
117-
}
116+
if (navigator.platform.toLowerCase.includes('linux')) {
117+
return 'linux'
118118
}
119-
120-
// android often reports linux as the platform, but we don't have an android download
121-
122-
if (navigator.userAgent.indexOf('Android') !== -1) {
123-
downloadLink = null
119+
if (navigator.userAgent.toLowerCase().includes('win64') || navigator.userAgent.toLowerCase().includes('wow64') || navigator.userAgent.toLowerCase().includes('windows')) {
120+
return 'windows'
124121
}
125122

126-
return downloadLink
123+
return null
124+
}
125+
126+
function getDownloadLinks (userPlatform) {
127+
return downloadLinks[userPlatform]
127128
}
128129

129130
function setupDownloadButton (button) {
130-
var downloadLink = getDownloadLink()
131+
var userPlatform = getUserPlatform()
132+
var downloadLinkOrLinks = getDownloadLinks(userPlatform)
131133

132-
if (downloadLink instanceof Object) {
133-
// we have a deb and an rpm link
134+
if (userPlatform === 'linux') {
134135
button.parentElement.removeAttribute('href')
135136
button.addEventListener('click', function () {
136-
showLinuxDialog(downloadLink)
137+
showLinuxDialog(downloadLinkOrLinks)
137138
})
138-
} else if (downloadLink) {
139-
// we have a single download link
140-
button.parentElement.href = downloadLink
141-
142-
// show gatekeeper instruction popup
143-
if (navigator.platform === 'MacIntel') {
144-
button.addEventListener('click', function () {
145-
setTimeout(showMacDialog, 500)
146-
}, false)
147-
} else if (navigator.platform === 'Win32') {
148-
button.addEventListener('click', function () {
149-
setTimeout(showWindowsDialog, 500)
150-
}, false)
151-
}
139+
} else if (userPlatform === 'mac') {
140+
button.parentElement.removeAttribute('href')
141+
button.addEventListener('click', function () {
142+
showMacStageOneDialog(downloadLinkOrLinks)
143+
})
144+
} else if (userPlatform === 'windows') {
145+
button.parentElement.href = downloadLinkOrLinks
146+
button.addEventListener('click', function () {
147+
setTimeout(showWindowsDialog, 500)
148+
}, false)
152149
} else {
153150
button.parentElement.href = 'https://github.com/minbrowser/min/releases/latest'
154151
button.classList.add('disabled')

0 commit comments

Comments
 (0)