[WIP] Add additional platform page for third-party vendor

.github/workflows/update-quick-start-module.yml

@@ -7,16 +7,22 @@ on:
     paths:
       - .github/workflows/update-quick-start-module.yml
       - scripts/gen_quick_start_module.py
+      - scripts/gen_additional_platform.py
       - _includes/quick-start-module.js
       - _includes/quick_start_local.html
+      - _includes/quick-start-additional-platform.js
+      - _additional_platform/*.json
   push:
     branches:
       site
     paths:
       - .github/workflows/update-quick-start-module.yml
       - scripts/gen_quick_start_module.py
+      - scripts/gen_additional_platform.py
       - _includes/quick-start-module.js
       - _includes/quick_start_local.html
+      - _includes/quick-start-additional-platform.js
+      - _additional_platform/*.json
   workflow_dispatch:
 
 jobs:
@@ -116,3 +122,40 @@ jobs:
           body: >
             This PR is auto-generated. It updates Getting Started page
           labels: automated pr
+
+  update-additional-platform:
+    needs: [linux-nightly-matrix, windows-nightly-matrix, macos-arm64-nightly-matrix,
+    linux-release-matrix, windows-release-matrix, macos-arm64-release-matrix]
+    runs-on: "ubuntu-latest"
+    environment: pytorchbot-env
+    steps:
+      - name: Checkout pytorch.github.io
+        uses: actions/checkout@v2
+      - name: Setup Python
+        uses: actions/setup-python@v2
+        with:
+          python-version: 3.9
+          architecture: x64
+      - name: Generate quick-start-additional-platform.js
+        shell: bash
+        run: |
+          set -ex
+          python3 ./scripts/gen_additional_platform.py
+      - name: Create Issue if failed
+        uses: dacbd/create-issue-action@main
+        if: ${{ failure() }}
+        with:
+          title: Updating additional platform quick start module failed
+          token: ${{secrets.PYTORCHBOT_TOKEN}}
+          assignees: ${{github.actor}}
+          labels: bug
+          body: Updating additional platform quick start module failed, please fix the update script or check JSON files
+      - name: Create Pull Request
+        uses: peter-evans/create-pull-request@v3
+        with:
+          token: ${{ secrets.PYTORCHBOT_TOKEN }}
+          commit-message: Update quick-start-additional-platform.js
+          title: '[Additional Platform] Update quick-start-additional-platform.js'
+          body: >
+            This PR is auto-generated. It updates the Additional Platform Getting Started page
+          labels: automated pr

_get_started/get-started-additional-platform.md

@@ -0,0 +1,27 @@
+---
+layout: get_started
+title: Additional Platform
+permalink: /get-started/additional-platform/
+background-class: get-started-background
+body-class: get-started
+order: 1
+published: true
+get-started-additional: true
+---
+
+<div class="container-fluid quick-start-module quick-starts">
+  <div class="row">
+    <div class="col-md-12">
+      {% include quick_start_additional_platform.html %}
+    </div>
+  </div>
+</div>
+
+---
+<div id="additional-platform-installation">
+  <!-- Platform content divs will be dynamically created by JavaScript -->
+</div>
+
+<script page-id="get-started-additional-platform" src="{{ site.baseurl }}/assets/menu-tab-selection.js"></script>
+<script src="{{ site.baseurl }}/assets/quick-start-additional-platform.js"></script>
+<script src="{{ site.baseurl }}/assets/get-started-sidebar.js"></script>

_get_started/get-started-locally.md

@@ -20,6 +20,8 @@ redirect_from: "/get-started/"
   </div>
 </div>
 
+<p><i>Could not find the right platform for your hardware?</i> See the <a href="{{ site.baseurl }}/get-started/additional-platform/">PyTorch Additional Platform</a> page.</p>
+
 ---
 
 {% capture mac %}

_includes/quick-start-additional-platform.js

@@ -0,0 +1,267 @@
+// =====================================================
+// Additional Platform Quick Start Module
+// =====================================================
+
+// Platform data loaded from JSON files (generated by gen_additional_platform.py)
+var ecosystemPlatformData = {{ platformData }};
+
+// HTML content loaded from _get_started/additional_platform/ directory
+// (pre-converted by Python script with syntax highlighting)
+var ecosystemHtmlContent = {{ markdownContent }};
+
+// Get platform IDs from loaded data
+var ecosystemPlatformIds = Object.keys(ecosystemPlatformData);
+
+// Ecosystem platform selections - simplified (no pm, no version)
+var ecosystemOpts = {
+  build: 'stable',
+  os: 'linux',
+  platform: null
+};
+
+// Parse URL parameters for pre-selection
+function parseUrlParams() {
+  var params = new URLSearchParams(window.location.search);
+  var platform = params.get('platform');
+  var build = params.get('build') || 'stable';
+  var os = params.get('os') || 'linux';
+
+  return {
+    platform: platform,
+    build: build,
+    os: os
+  };
+}
+
+// Apply URL parameter selections
+function applyUrlSelections() {
+  var urlParams = parseUrlParams();
+
+  // Apply build selection
+  if (urlParams.build && ecosystemOpts.build !== urlParams.build) {
+    ecosystemOpts.build = urlParams.build;
+    $('.pytorch-build > .option').removeClass('selected');
+    $('.pytorch-build > .option#' + urlParams.build).addClass('selected');
+  }
+
+  // Apply OS selection
+  if (urlParams.os && ecosystemOpts.os !== urlParams.os) {
+    ecosystemOpts.os = urlParams.os;
+    $('.os-ecosystem > .option').removeClass('selected');
+    $('.os-ecosystem > .option#' + urlParams.os).addClass('selected');
+  }
+
+  // Apply platform selection
+  if (urlParams.platform && ecosystemPlatformData[urlParams.platform]) {
+    ecosystemOpts.platform = urlParams.platform;
+    $('.compute-platform > .option').removeClass('selected');
+    $('.compute-platform > .option#' + urlParams.platform).addClass('selected');
+    updateEcosystemCommand();
+    updatePlatformContentDisplay();
+  }
+}
+
+// Initialize additional platform when document is ready
+$(function() {
+  initPlatformContentContainer();
+  initAdditionalPlatform();
+  initAdditionalPlatformButtons();
+  updatePlatformButtonStates();
+  syncComputePlatformHeight();
+  initPlatformContentDisplay();
+
+  // Apply URL parameter selections after initialization
+  applyUrlSelections();
+});
+
+// Initialize platform content container - dynamically create divs for each platform
+function initPlatformContentContainer() {
+  var container = $('#additional-platform-installation');
+  if (!container.length) return;
+
+  // Clear any existing static content
+  container.empty();
+
+  // Create platform content divs dynamically based on HTML content
+  ecosystemPlatformIds.forEach(function(platformId) {
+    if (ecosystemHtmlContent[platformId]) {
+      var contentDiv = $('<div class="platform-content ' + platformId + '"></div>');
+      // HTML content is already pre-converted with syntax highlighting
+      contentDiv.html(ecosystemHtmlContent[platformId]);
+      container.append(contentDiv);
+    }
+  });
+}
+
+// Note: Markdown is pre-converted to HTML by Python script (gen_additional_platform.py)
+// using markdown library with codehilite extension for syntax highlighting.
+// No need for client-side markdown parsing.
+
+// Initialize platform content display - hide all initially
+function initPlatformContentDisplay() {
+  $('#additional-platform-installation .platform-content').hide();
+}
+
+// Sync left heading height with right compute platform buttons height
+function syncComputePlatformHeight() {
+  var rightHeight = $('.compute-platform').outerHeight();
+  if (rightHeight > 0) {
+    $('.compute-platform-heading').css('min-height', rightHeight + 'px');
+  }
+}
+
+// Populate compute platform buttons
+function initAdditionalPlatformButtons() {
+  var platformRow = $('.compute-platform');
+  if (!platformRow.length) return;
+
+  // Generate platform buttons
+  ecosystemPlatformIds.forEach(function(platformId) {
+    var platform = ecosystemPlatformData[platformId];
+    if (!platform) return;
+    var displayName = platform.name;
+    var btn = $('<div class="col-md-3 option block" id="' + platformId + '"><div class="option-text">' + displayName + '</div></div>');
+    platformRow.append(btn);
+  });
+
+  // Sync height after buttons are generated
+  syncComputePlatformHeight();
+
+  // Bind platform button click
+  $('.compute-platform > .option').on('click', function() {
+    var platformId = this.id;
+    var platform = ecosystemPlatformData[platformId];
+    if (!platform) return;
+
+    // Check if supported on current OS
+    var supportedOS = getSupportedOS(platformId);
+    if (!supportedOS.includes(ecosystemOpts.os)) {
+      $('#command').html('<i>' + platform.name + ' is not supported on ' + ecosystemOpts.os + '</i>');
+      return;
+    }
+
+    // Select this platform
+    $('.compute-platform > .option').removeClass('selected');
+    $(this).addClass('selected');
+    ecosystemOpts.platform = platformId;
+
+    updateEcosystemCommand();
+    updatePlatformContentDisplay();
+  });
+}
+
+// Get supported OS list from platform data structure
+function getSupportedOS(platformId) {
+  var platform = ecosystemPlatformData[platformId];
+  if (!platform) return [];
+
+  var osSet = new Set();
+  ['stable', 'preview'].forEach(function(build) {
+    if (platform[build]) {
+      Object.keys(platform[build]).forEach(function(os) {
+        osSet.add(os);
+      });
+    }
+  });
+  return Array.from(osSet);
+}
+
+// Update platform button states (disabled/enabled) based on OS
+function updatePlatformButtonStates() {
+  $('.compute-platform > .option').each(function() {
+    var platformId = this.id;
+    if (!platformId) return;
+
+    var supportedOS = getSupportedOS(platformId);
+    var isSupported = supportedOS.includes(ecosystemOpts.os);
+
+    if (isSupported) {
+      $(this).css('text-decoration', '');
+    } else {
+      $(this).css('text-decoration', 'line-through');
+    }
+  });
+
+  // If currently selected platform is not supported on new OS, deselect it
+  if (ecosystemOpts.platform) {
+    var supportedOS = getSupportedOS(ecosystemOpts.platform);
+    if (!supportedOS.includes(ecosystemOpts.os)) {
+      ecosystemOpts.platform = null;
+      $('.compute-platform > .option').removeClass('selected');
+      $('#command').html('Select a compute platform to see the installation command.');
+      updatePlatformContentDisplay();
+    }
+  }
+}
+
+// Update platform content display based on selected platform
+function updatePlatformContentDisplay() {
+  // Hide all platform content first
+  $('#additional-platform-installation .platform-content').hide();
+
+  // Show selected platform content
+  if (ecosystemOpts.platform) {
+    $('#additional-platform-installation .platform-content.' + ecosystemOpts.platform).show();
+  }
+}
+
+// Initialize all click events for build/os blocks
+function initAdditionalPlatform() {
+  // PyTorch Build
+  $('.pytorch-build > .option').on('click', function() {
+    $('.pytorch-build > .option').removeClass('selected');
+    $(this).addClass('selected');
+    ecosystemOpts.build = this.id;
+    updateEcosystemCommand();
+  });
+
+  // OS - with platform support check
+  $('.os-ecosystem > .option').on('click', function() {
+    $('.os-ecosystem > .option').removeClass('selected');
+    $(this).addClass('selected');
+    ecosystemOpts.os = this.id;
+
+    updatePlatformButtonStates();
+    updateEcosystemCommand();
+  });
+}
+
+// Update ecosystem command based on selections - simplified
+function updateEcosystemCommand() {
+  if (!ecosystemOpts.platform) {
+    $('#command').html('Select a compute platform to see the installation command.');
+    return;
+  }
+
+  var platform = ecosystemPlatformData[ecosystemOpts.platform];
+  if (!platform) {
+    $('#command').html('Loading platform data...');
+    return;
+  }
+
+  // Check if OS is supported
+  var supportedOS = getSupportedOS(ecosystemOpts.platform);
+  if (!supportedOS.includes(ecosystemOpts.os)) {
+    $('#command').html('<i>' + platform.name + ' is not supported on ' + ecosystemOpts.os + '</i>');
+    return;
+  }
+
+  // Get command directly from platform[build][os]
+  try {
+    var buildData = platform[ecosystemOpts.build];
+    if (!buildData || !buildData[ecosystemOpts.os]) {
+      $('#command').html('<i>Configuration not available for this combination</i>');
+      return;
+    }
+
+    var cmd = buildData[ecosystemOpts.os];
+
+    if (cmd) {
+      $('#command').html('<pre>' + cmd + '</pre>');
+    } else {
+      $('#command').html('<i>Configuration not available for this combination</i>');
+    }
+  } catch (e) {
+    $('#command').html('<i>Configuration not available for this combination</i>');
+  }
+}