Skip to content

一个支持音视频播放的思源笔记媒体播放器插件

License

Notifications You must be signed in to change notification settings

mm-o/siyuan-media-player

Folders and files

NameName
Last commit message
Last commit date

Latest commit

eed8fe9 · May 18, 2025

History

80 Commits
Jan 19, 2025
May 18, 2025
May 18, 2025
Mar 26, 2025
May 18, 2025
Apr 2, 2025
May 18, 2025
May 18, 2025
Mar 26, 2025
May 18, 2025
May 18, 2025
Jan 18, 2025
May 18, 2025
May 18, 2025
May 18, 2025
May 18, 2025
Jan 23, 2025
Mar 26, 2025
Mar 26, 2025
Mar 26, 2025
Jan 23, 2025
Mar 26, 2025

Repository files navigation

🎬 SiYuan Media Player

📚 Quick Navigation

📖 Help Documentation | 💬 Feedback & Discussion | 📋 Changelog | 👏 Acknowledgments

For detailed information about the latest features and improvements, please refer to the Changelog.

🧧 Support, Encouragement & Feature Requests

Alipay QR Code

Alipay

WeChat QR Code

WeChat

🚀 Recent Updates

Version 0.3.3 (2025.5.18):

  • 🚀 UI Overhaul: Removed top icons, now accessible through dock bar button
  • 🎛️ Button Layout: Moved function buttons to the top with toggle visibility option
  • 🔂 Loop Features: Added single item loop and playlist loop functionality
  • ⏸️ Pause Control: Added pause after loop completion feature
  • 💬 Danmaku List: Added danmaku list for easy export of bullet comments
  • 👤 Account Display: Optimized account display
  • 🔄 Sorting Function: Added playlist sorting functionality with support for default, name, time, and type sorting
  • 📜 Script Loading: Support for loading custom JavaScript scripts with script status management through settings panel (preliminary)

Version 0.3.2 (2025.5.11):

  • 🎨 UI Optimization: Unified styling for assistant, playlist, and settings panels
  • ☁️ AList Support: Added AList cloud storage support for more media sources
  • 📂 File Selection: Enhanced local file import with direct file selection
  • 📋 Menu Simplification: Streamlined tab menu, removing complex tab+right-click logic
  • ↔️ Resizable Panels: Added support for resizing panels through drag and drop
  • ⏸️ Pause After Loop: New setting to pause playback after loop completion
  • 📝 Insertion Methods: Extended document insertion options with multiple modes
  • 🔗 Link Format Extension: Support for inserting timestamps with screenshots in one action
  • 📔 Media Notes: Added media notes creation with customizable templates, shortcut key support, and options to create in selected notebook or insert into current document
  • 🎛️ Format Standardization: Unified custom formats with reset to default options
  • 🔄 Tab Opening Modes: Customizable player tab opening methods (new tab, right tab, bottom tab, new window)
  • 💻 Developer Enhancement: Improved developer API with more comprehensive interfaces and event support
  • ✨ More Improvements: Many more optimizations to discover
View History Updates

Version 0.3.1:

  • 💬 Bilibili Subtitle Control: Support showing/hiding Bilibili video subtitles via the subtitle button
  • 📜 Auto-scrolling Subtitles: Media assistant subtitle list now automatically scrolls with playback progress
  • 🎨 UI Optimization: Improved media assistant interface for better user experience
  • 🛠️ Bug Fixes: Resolved issues with special characters in file paths
  • 📸 Screenshot Enhancement: Optimized screenshot feature with direct clipboard support
  • 🔄 Subtitle Processing: Unified subtitle handling logic for improved player performance

Version 0.3.0:

  • 🎯 Bilibili Danmaku Support: Added support for Bilibili video bullet comments
  • ✨ Pro Features: Introduced optional Pro features
  • 🔖 Enhanced Bilibili Favorites: Direct selection for adding to playlist
  • 🧠 Media Assistant: Subtitle browsing and video summary features
  • 💬 Subtitle Support: Support for both local media and Bilibili videos
  • 📑 Video Summary: AI-generated video content overview (Bilibili videos only for now)

🎯 Feature Overview

SiYuan Media Player is a powerful multimedia playback plugin that helps you conveniently play, manage, and reference various media resources within SiYuan notes.

🎥 Video Playback

  • 📁 Local Video Support: Play local video files with support for various common video formats
  • 🅱️ Bilibili Video Support: Play Bilibili videos directly without leaving SiYuan notes
  • 💬 Automatic Subtitle Detection: Automatically detect and load matching subtitle files
  • 💭 Danmaku Support: Display Bilibili video danmaku (bullet comments) for an authentic viewing experience
  • 🎛️ Multiple Playback Controls: Time navigation, volume adjustment, playback speed, fullscreen and more

📋 Playlist Management

  • 📚 Multiple Playlist Management: Create and manage multiple playlists for organizing media by category
  • 👁️ View Mode Switching: Support for detailed view, compact view, grid view, and cover view
  • 📥 Batch Import: One-click import of Bilibili favorites or local folders to playlists

📝 Note Integration Features

  • ⏱️ Timestamp Links: Generate links pointing to specific timestamps in videos, inserted into notes
  • 🔄 Loop Segments: Create links that loop specific segments of videos, useful for repeated learning
  • 📸 Video Screenshots: Capture video frames and insert them directly into notes
  • 📔 Media Notes: Create comprehensive media notes with customizable templates
  • 🖊️ Flexible Insertion Options: Choose from multiple insertion methods (cursor position, block append/prepend, document top/bottom, or clipboard)

✨ Advanced Features (Pro Version)

  • 🧠 Media Assistant:
    • 📜 Subtitle List: Easily browse and search video subtitle content
    • 📊 Video Summary: AI-generated video content summaries for quick understanding of key points
    • 📤 One-click Export: Export subtitle and summary content to notes
  • 🔖 Tag Extensions:
    • 📂 Local Folders: Directly browse and manage local media files
    • 🌟 Bilibili Favorites: Seamless integration of Bilibili favorite content
    • 🚀 More features in development...

📖 How to Use

Click to expand How to Use

🎬 Basic Operations

Playing Local Videos
  1. Click the "Add Media" button in the player window
  2. Select a local video file
  3. The player will automatically detect and load same-named subtitle files (if available)
  4. Use the player control bar to control playback
Playing Bilibili Videos
  1. Copy the Bilibili video link (supports standard links and short links)
  2. Click the "Add Media" button in the player
  3. Paste the link and confirm
  4. The player will automatically load the video, subtitles, and danmaku
Using AList Cloud Storage
  1. Configure your AList server connection in the settings panel
  2. Click "Add Media" and select "Add AList Cloud"
  3. Browse the AList directory structure to find media files
  4. Select the media you want to add to the playlist
  5. The player will stream content directly from your AList server
Importing Bilibili Favorites
  1. Log in to your Bilibili account (in the settings panel)
  2. Select "Add Bilibili Favorites" in the playlist panel
  3. Choose the favorite folder to import
  4. Confirm the import, videos will be batch added to the current playlist
Managing Bilibili Account
  1. Find the Bilibili account section in the settings panel
  2. Click the login button to display a QR code
  3. Scan the QR code using the Bilibili mobile app to log in
  4. After logging in, you can access and import your personal favorite folders

📝 Note Integration

Creating Timestamps and Loop Segments
  1. Play the video to the position you want to mark
  2. Click the timestamp button to create a timestamp, or click the loop segment button to set a start point
  3. If creating a loop segment, continue playing to the end position and click the loop segment button again
  4. The generated link will be automatically copied to the clipboard or inserted at the cursor position (based on settings)
Creating Media Notes
  1. Play the video or audio you want to take notes on
  2. Click the "Media Notes" button in the control bar (or use a custom shortcut key)
  3. A new note will be created based on your customized template
  4. The note includes media information like title, current timestamp, and thumbnail
  5. Based on your settings, the note will either:
    • Be inserted into the current document (using your preferred insertion method)
    • Or be created in your specified notebook (target notebook can be selected in settings)
  6. You can customize the note template in settings to suit your workflow
  7. You can assign a shortcut key to the media notes function for improved efficiency

🧠 Advanced Features

Using Media Assistant (Pro Version)
  1. Click the Media Assistant button in the control bar while playing a video
  2. Browse the subtitle list or view the video summary in the assistant panel
  3. Click on subtitle entries to jump to the corresponding timestamp
  4. Use the export button to export content to your notes

⌨️ Keyboard Shortcuts

Built-in Player Shortcuts
  • Space: Toggle play/pause
  • Arrow Left/Right: Rewind/Fast forward
  • Arrow Up/Down: Increase/Decrease volume
Custom Shortcuts

You can customize keyboard shortcuts for the following features in SiYuan settings:

  1. Open SiYuan Settings > Shortcuts
  2. Search for "Media Player" or "siyuan-media-player"
  3. Set custom shortcuts for these functions:
    • ⏱️ Create Timestamp: Generate a link for the current playback time
    • 🔄 Create Loop Segment: Set start and end points for loop playback
    • 📸 Take Screenshot: Capture the current video frame
    • 📔 Create Media Notes: Create media notes for the current media
    • 🧠 Toggle Media Assistant: Show or hide the subtitles and summary panel (Pro version)

⚙️ Setting Options

Click to expand Setting Options

🛠️ General Settings

  • 🔊 Volume: Set default playback volume
  • ⏩ Playback Speed: Set default playback speed
  • 🔁 Loop Count: Set the number of times to loop a segment
  • ⏸️ Pause After Loop: Whether to automatically pause playback after loop completion
  • 💬 Show Subtitles: Whether to display subtitles by default
  • 💭 Enable Danmaku: Whether to display danmaku by default

🎛️ Player Settings

  • 📺 Player Selection: Choose to use the built-in player, PotPlayer, or browser
  • 🔄 Open Mode: Choose how to open the player tab:
    • Default: Open in a new tab
    • Right: Open in a right side tab
    • Bottom: Open in a bottom tab
    • Window: Open in a new window
  • 📌 Insertion Method: Choose how to insert content:
    • Insert at cursor: Add content at the current cursor position
    • Append to block: Add content to the end of the current block
    • Prepend to block: Add content to the beginning of the current block
    • Update current block: Replace current block content
    • Insert at document start: Add content to the top of document
    • Insert at document end: Add content to the bottom of document
    • Copy to clipboard: Simply copy to clipboard without insertion
  • 🔗 Link Format: Customize the generated link format, with support for adding emojis and screenshots
  • 📝 Media Notes Template: Customize the template for creating media notes
  • 📓 Target Notebook: Select the notebook where media notes will be created

❓ Common Issues

Video Won't Play
  • Check if your network connection is working properly
  • For Bilibili videos, try refreshing or re-adding the link
  • Confirm if the video format is supported
Subtitles Not Showing
  • Confirm that the subtitle file has the same name as the video file and is in the same directory
  • Check if the subtitle file format is .srt, .vtt, or .ass
  • Verify that the "Show Subtitles" option is enabled in settings
Danmaku Not Showing
  • Confirm that the "Enable Danmaku" option is enabled
  • Only Bilibili videos support the danmaku feature
  • Some videos may not have danmaku data
Failed to Import Favorites
  • Confirm you are logged into your Bilibili account
  • Check your network connection
  • Try logging in to your account again

💡 Advanced Tips

Click to expand Advanced Tips

🔗 Custom Link Format

In settings, you can customize the display format of timestamp links. For example:

- [😄Title Time Subtitle](Link)  // Link with emoji
> 🕒 Time | Title | Subtitle     // Quote-formatted link

📚 Multiple Playlist Management

  • Create theme-related playlists, such as "Study Materials," "Entertainment Videos," etc.
  • Use the pin feature to keep frequently used lists at the top
  • Regularly organize and clean up media content that is no longer needed

📥 Batch Processing Tips

  • Use the local folder import feature to add multiple videos at once
  • Use Bilibili favorites import to quickly add series videos
  • Switch between view modes to efficiently browse and manage media in different scenarios

📝 Custom Media Notes Template

You can create your own media notes template in settings with various variables:

# 📽️ Title Media Notes
- 📅 Date: Date
- ⏱️ Duration: Duration
- 🎨 Artist: Artist
- 🔖 Type: Type
- 🔗 Link: [Link](Link)
- ![Cover](Cover)
- 📝 Notes:

Available variables include:

  • Media title, current timestamp, artist name, media URL, media duration, media thumbnail, media type, media ID, current date, current date and time

↔️ Panel Resizing

  • You can resize the player panels by dragging their edges
  • Hover near the edge of a panel until the cursor changes to a resize cursor
  • Click and drag to adjust the panel size
  • This works for the playlist panel, settings panel, and media assistant panel
  • Panel sizes are remembered between sessions

🔄 Playlist Sorting

The playlist supports various sorting methods. Click the sort button at the top of the playlist to cycle through different sorting modes:

  • Default Order: Sort by the order items were added
  • Sort by Name: Sort alphabetically by media title
  • Sort by Time: Sort by addition time, with newest items first
  • Sort by Type: Group and sort by media type

The sorting function preserves pinned items at the top and only sorts unpinned items.

💻 Developer API

Click to expand Developer API

SiYuan Media Player provides a comprehensive API for other plugins or scripts to interact with, enabling more customized functionality.

Basic Usage

// Get plugin instance
const mp = window.siyuan.plugins.find(p => p.name === 'siyuan-media-player');

// Direct play media
mp.api.playMedia('https://example.com/video.mp4', {
  title: 'Title',      // Optional
  startTime: 30,       // Optional, start seconds
  endTime: 60,         // Optional, end seconds
  isLoop: true         // Optional, loop playback
});

// Add to playlist
mp.api.playMedia('https://example.com/music.mp3', {
  addToPlaylist: true,
  autoPlay: true       // Default true
});

Event Mechanism

// Call via events
window.dispatchEvent(new CustomEvent('directMediaPlay', { 
  detail: {id: `c-${Date.now()}`, title: 'Title', url: 'URL', type: 'video'}
}));

window.dispatchEvent(new CustomEvent('addMediaToPlaylist', { 
  detail: {url: 'URL', autoPlay: true}
}));

// Register event listeners
window.addEventListener('mediaPlayerStateChange', (e) => {
  const { playing, currentTime, duration } = e.detail;
  console.log(`Player state: ${playing ? 'playing' : 'paused'}, time: ${currentTime}/${duration}`);
});

window.addEventListener('mediaPlayerReady', (e) => {
  console.log('Media player is ready', e.detail);
});

Extended API

// Advanced control
mp.api.getPlayer().then(player => {
  // Get current player instance
  console.log('Current media:', player.getCurrentMedia());
  
  // Control playback
  player.pause();
  player.play();
  player.seek(120); // Jump to 2 minutes position
  
  // Set volume and speed
  player.setVolume(0.8);
  player.setPlaybackRate(1.5);
});

// Playlist management
mp.api.getPlaylists().then(playlists => {
  console.log('All playlists:', playlists);
});

mp.api.getCurrentPlaylist().then(playlist => {
  console.log('Current playlist:', playlist);
});

For more API details, please check the Developer Documentation.