Anonym-tsk / MMM-YouTube

MagicMirror module for youtube player with runtime configuration and controllable by notification.
MIT License
14 stars 4 forks source link

MMM-YouTube

MagicMirror module for youtube player with runtime configuration and controllable by notification.

Feature

New Update

[1.0.4] (2020-03-13)

Installation

cd ~/MagicMirror/modules
git clone https://github.com/eouia/MMM-YouTube

Configuration

Simple Version (Just being ready)

{
  module: "MMM-YouTube",
  position: "top_right",
},

Defaults & Details

You don't need to copy & paste all of these. Just select what you need and rewrite it into your config.js. Other values will be applied automatically.

{
  module: "MMM-YouTube",
  position: "top_right",
  config: {
    verbose:true,
    defaultQuality: "default",
    width: "800px",
    height: "600px",
    volume: 100,
    disableCC: true,
    showPlayingOnly: true,
    defaultLoop: false,
    defaultShuffle: false,
    defaultAutoplay: true,
    onStartPlay: null,
    playerVars: {
      controls: 0,
      hl: "en",
      enablejsapi: 1,
      showinfo: 0,
      rel: 0,
      cc_load_policy: 0,
    },
    telegramBotCommand: {
      YOUTUBE_LOAD_BY_URL: "yt",
      YOUTUBE_LOAD_PLAYLIST: "yl",
      YOUTUBE_CONTROL: "yc"
    },
    outNotifications: {
      "-1": "UNSTARTED",
      "0": "ENDED",
      "1": "PLAYING",
      "2": "PAUSED",
      "3": "BUFFERING",
      "5": "VIDEO CUED",
    }
  }
},

verbose: true

If you set false, front-end log will be hidden. When you need to debug, set this field as true

defaultQuality: "default"

The parameter value can be small, medium, large, hd720, hd1080, highres or default. I recommend that you set the parameter value to default, which instructs YouTube to select the most appropriate playback quality, which will vary for different users, videos, systems and other playback conditions. And even if you set other value, it doesn't mean the quality is guaranteed on playing. It could be changed by YouTube by force. Usually, Quality could be changed by player size, network speed, computing power and etc.

more : https://developers.google.com/youtube/iframe_api_reference#Playback_quality

volume: 100

Set youtube player volume on startup (0 to 100)

disableCC: true

Caption will not be shown with true

showPlayingOnly: true

with true, This module will be appeared only when it is played.

defaultLoop: false,

Set default looping status of video(s)

defaultShuffle: false,

Set default shuffle status of playlist. This will be applied only when playlist be loaded.

defaultAutoplay: true,

Set default autoplay status. If this is set as false, video will be loaded but not played automatically.

playerVars: {}

Set environment of player.

Some of these parameters might not be working due to YouTube API's limitation.

more: https://developers.google.com/youtube/player_parameters#Parameters

onStartPlay: {}

If you want to play a video from startup of MagicMirror, set the video info here. OR if you don't want, just set as null

onStartPlay: {
  type: "id",
  id: "UOxkGD8qRB4",
  shuffle: true,
  loop: false,
  autoplay: true,
}

See VIDEO_LOAD section also.

telegramBotCommand: {}

You can redefine telegramBot commands for this module. Default values are

outNotifications: {}

When player status be changed, one of outNotifications will be emitted.

I believe you don't need to modify this. You can redefine notification message with this.

TelegramBot Commands

You can load and control video with MMM-TelegramBot

Control by notification

You can control video by notification from other module. e.g)

this.sendNotification("YOUTUBE_LOAD", {type:"id", id:"UOxkGD8qRB4"})

YOUTUBE_LOAD

You can use one of 3 types for loading YouTube video. And these object structure could be used onStartPlay.

type:id

this.sendNotification("YOUTUBE_LOAD", {
  type: "id", //REQUIRED
  id: "UOxkGD8qRB4", //REQUIRED. YouTube Video Id.
  loop: false, //OPTIONAL
  autoplay: true, //OPTIONAL
})

type:url

this.sendNotification("YOUTUBE_LOAD", {
  type: "url", //REQUIRED
  id: "https://www.youtube.com/watch?v=UOxkGD8qRB4", //REQUIRED. YouTube Video URL
  loop: false, //OPTIONAL
  autoplay: true, //OPTIONAL
})

type:playlist

this.sendNotification("YOUTUBE_LOAD", {
  type: "playlist", //REQUIRED
  listType: "playlist", //REQUIRED. "playlist", "search", "user_uploads" be available.
  id: "PL4QNnZJr8sRNKjKzArmzTBAlNYBDN2h-J", //REQUIRED. See description
  index: 0, // OPTIONAL.
  shuffle: false, //OPTIONAL
  loop: false, //OPTIONAL
  autoplay: true, //OPTIONAL
})

YOUTUBE_CONTROL

You can use most of YouTube iFrame API methods to control the player.

this.sendNotification("YOUTUBE_CONTROL", {
  command: "playVideo"
})

this.sendNotification("YOUTUBE_CONTROL", {
  command: "setVolume",
  params: "60",
})

this.sendNotification("YOUTUBE_CONTROL", {
  command: "getVolume",
  callback: (ret) => {
    console.log("Current volume is", ret)
  }
})

Each control command could have these fields.

Available commands

playVideo, pauseVideo, nextVideo, previousVideo, mute, unMute, ... See https://developers.google.com/youtube/iframe_api_reference#Functions

KNOWN ISSUE: When you use stopVideo, it will not stop the video but replay current video. Use pauseVideo instead. I'll fix this someday... Sorry.

UPDATE HISTORY

[1.0.3]

[1.0.2]

[1.0.1]