Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix download button on macOS & add M1 and Intel options #223

Merged
merged 2 commits into from
Feb 9, 2024
Merged

Fix download button on macOS & add M1 and Intel options #223

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8300511
Use modern ES6 (const/let, for...of) in custom scripts
CAM-Gerlach Feb 8, 2024
1248fd7
Support >=1 download buttons per-OS & use to fix macOS M1/Intel
CAM-Gerlach Feb 8, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions assets/static/css/custom_styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -129,9 +129,9 @@
/*** Download button formatting ***/

#section-download-buttons .content-button {
margin-bottom: 0;
margin-bottom: 1em;
margin-top: 0;
min-width: 380px;
min-width: 460px;
}

@media screen and (max-width: 480px) {
Expand Down
101 changes: 66 additions & 35 deletions assets/static/js/custom_scripts.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,34 +4,52 @@
"use strict";

/* Top-level variables */
var buttonData = {
win: {
text: "Download for Windows",
icon: ["fab", "fa-windows"],
url: "https://github.com/spyder-ide/spyder/releases/latest/download/Spyder_64bit_full.exe",
},
mac: {
text: "Download for macOS",
icon: ["fab", "fa-apple"],
url: "https://github.com/spyder-ide/spyder/releases/latest/download/Spyder.dmg",
},
linux: {
text: "Download for Linux (Anaconda)",
icon: ["fab", "fa-linux"],
url: "https://www.anaconda.com/download/",
},
other: {
text: "Download Spyder",
icon: ["fas", "fa-download"],
url: "https://github.com/spyder-ide/spyder/releases/latest",
},
const buttonsData = {
win: [
{
id: "download-windows",
text: "Download for Windows",
icon: ["fab", "fa-windows"],
url: "https://github.com/spyder-ide/spyder/releases/latest/download/Spyder_64bit_full.exe",
},
],
mac: [
{
id: "download-mac-m1",
text: "Download for macOS (M1)",
ccordoba12 marked this conversation as resolved.
Show resolved Hide resolved
icon: ["fab", "fa-apple"],
url: "https://github.com/spyder-ide/spyder/releases/latest/download/Spyder_arm64.dmg",
},
{
id: "download-mac-intel",
text: "Download for macOS (Intel)",
icon: ["fab", "fa-apple"],
url: "https://github.com/spyder-ide/spyder/releases/latest/download/Spyder_x86_64.dmg",
},
],
linux: [
{
id: "download-linux",
text: "Download for Linux (Anaconda)",
icon: ["fab", "fa-linux"],
url: "https://www.anaconda.com/download/",
},
],
other: [
{
id: "download-other",
text: "Download Spyder",
icon: ["fas", "fa-download"],
url: "https://github.com/spyder-ide/spyder/releases/latest",
},
],
};

/* Helper functions */

// Get the key corresponding to the current desktop operating system
function getOSName() {
var platform = navigator.platform;
const platform = navigator.platform;
if (!platform) {
return "other";
}
Expand All @@ -52,31 +70,44 @@
}

// Get the button data corresponding to the current OS
function getButtonData() {
var osName = getOSName();
return buttonData[osName];
function getButtonsData() {
const osName = getOSName();
return buttonsData[osName];
}

// Create the download button nodes from a prototype
function createDownloadButton(templateButton, buttonData) {
const newButton = templateButton.cloneNode(true);
newButton.id = buttonData.id;
newButton.href = buttonData.url;
newButton.getElementsByClassName("download-text")[0].textContent =
buttonData.text;
for (const icon of buttonData.icon) {
newButton
.getElementsByClassName("download-os-icon")[0]
.classList.add(icon);
}
return newButton;
}

/* Main functions */

// Setup download button based on current OS
// Set up download button based on current OS
function setupDownloadButton(downloadButton) {
var buttonData = getButtonData();
downloadButton.href = buttonData.url;
downloadButton.getElementsByClassName("download-text")[0].textContent =
buttonData.text;
for (var i = 0; i < buttonData.icon.length; i++) {
downloadButton
.getElementsByClassName("download-os-icon")[0]
.classList.add(buttonData.icon[i]);
const downloadButtonContainer = document.createElement("div");
downloadButtonContainer.id = "download-buttons-container";
for (const buttonData of getButtonsData()) {
const newButton = createDownloadButton(downloadButton, buttonData);
downloadButtonContainer.appendChild(newButton);
}
downloadButton.replaceWith(downloadButtonContainer);
}

/* Fire events */

// On initial DOM ready, set up the tour and the version dropdown
document.addEventListener("DOMContentLoaded", function () {
var downloadButton = document.getElementById("download-buttons-button");
const downloadButton = document.getElementById("download-buttons-button");
if (downloadButton) {
setupDownloadButton(downloadButton);
}
Expand Down
Loading