Skip to content

Add Google Drive URL support to URL loader #411

@takaokouji

Description

@takaokouji

Summary

Extend the existing URL loader functionality to support Google Drive URLs in addition to Scratch project URLs. This will allow users to load Smalruby projects directly from Google Drive shared links.

Current State

The URL loader currently supports:

  • Scratch project URLs (e.g., https://scratch.mit.edu/projects/1209008277/)
  • Downloads JSON format project files
  • Uses scratch-api-proxy for fetching project data

Requested Enhancement

Add support for Google Drive URLs with the following patterns:

  1. https://drive.google.com/file/d/FILE_ID/view
  2. https://drive.google.com/open?id=FILE_ID
  3. https://drive.google.com/uc?export=download&id=FILE_ID

Technical Requirements

URL Validation

  • Extend URL parsing in src/lib/url-parser.js to detect Google Drive URLs
  • Use the same regex patterns as defined in aws-lambda/smalruby-cors-proxy/lambda_function.rb#75-92
  • Maintain backward compatibility with existing Scratch project URLs

File Format Handling

  • Scratch project URLs → JSON format (current implementation)
  • Google Drive URLs → SB3 format (same as sb-file-uploader-hoc.jsx)

CORS Proxy Usage

Google Drive has CORS restrictions, so use the existing CORS proxy:

https://api.smalruby.app/cors-proxy?url=${encodeURIComponent(googleDriveUrl)}

Implementation Areas

  1. URL Parser (src/lib/url-parser.js)

    • Add Google Drive URL detection functions
    • Extract file ID from various Google Drive URL formats
  2. URL Loader HOC (src/lib/url-loader-hoc.jsx)

    • Update loadProjectFromUrl method to handle both Scratch and Google Drive URLs
    • Use appropriate loading mechanism based on URL type:
      • Scratch URLs: Current JSON loading via scratch-api-proxy
      • Google Drive URLs: SB3 loading via CORS proxy (similar to sb-file-uploader-hoc.jsx)
  3. UI Updates

    • Update placeholder text to show Google Drive URL example
    • Update validation messages to mention both URL types
    • Update internationalization files (en.js, ja.js, ja-Hira.js)

Example Google Drive URLs

https://drive.google.com/file/d/1ABC123def456GHI/view
https://drive.google.com/open?id=1ABC123def456GHI
https://drive.google.com/uc?export=download&id=1ABC123def456GHI

Reference Implementation

  • Google Drive URL patterns: aws-lambda/smalruby-cors-proxy/lambda_function.rb#75-92
  • SB3 file handling: src/lib/sb-file-uploader-hoc.jsx
  • Current URL loader: src/lib/url-loader-hoc.jsx

Acceptance Criteria

  • Google Drive URLs are properly validated
  • Google Drive projects load correctly as SB3 files
  • Scratch project URLs continue to work as before
  • Appropriate error messages for invalid Google Drive URLs
  • UI reflects support for both URL types
  • All locales updated with appropriate messages

Implementation Priority

This enhances the existing URL loader feature by expanding URL source compatibility, making it easier for users to share and load projects from Google Drive.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions