Playing a MIDI file on a Quarto blog

midiblender

midi

Quick test to see if a MIDI player will work on this page. And it does!

Author

Matt Crump

Published

February 13, 2024

Code

from diffusers import DiffusionPipeline
from transformers import set_seed
from PIL import Image
import torch
import random
import ssl
import os
ssl._create_default_https_context = ssl._create_unverified_context

#locate library
#model_id = "./stable-diffusion-v1-5"
model_id = "dreamshaper-xl-turbo"

pipeline = DiffusionPipeline.from_pretrained(
    pretrained_model_name_or_path = "../../../../bigFiles/huggingface/dreamshaper-xl-turbo/"
)

pipeline = pipeline.to("mps")

# Recommended if your computer has < 64 GB of RAM
pipeline.enable_attention_slicing("max")

prompt = "Player piano. piano roll. Automatic self playing piano. white background. transformers cartoon. 3d."

for s in range(30):
  for n in [5,10]:
    seed = s+21
    num_steps = n+1
    set_seed(seed)
    
    image = pipeline(prompt,height = 1024,width = 1024,num_images_per_prompt = 1,num_inference_steps=num_steps)
    
    image_name = "images/synth_{}_{}.jpeg"
    
    image_save = image.images[0].save(image_name.format(seed,num_steps))

This is just a picture. Scroll down to try the MIDI player for real.

I happened upon this midi player for webpages. Will it work here too? https://cifkao.github.io/html-midi-player/

Following the instructions from that website, I am adding this script in the yml for this .qmd file, along with a resources line to make sure the midi file is copied to the docs folder.

Code

resources: 
  - bluesy_C.mid
include-before-body:
  text: |
    <script src="https://cdn.jsdelivr.net/combine/npm/tone@14.7.58,npm/@magenta/music@1.23.1/es6/core.js,npm/focus-visible@5,npm/html-midi-player@1.4.0"></script>

Added an html block that has this code:

Code

<midi-player
  src="bluesy_C.mid"
  sound-font visualizer="#myVisualizer">
</midi-player>
<midi-visualizer type="piano-roll" id="myVisualizer"></midi-visualizer>

And, it works!

Cool, I have not looked deeply into this at all, so I have no idea what’s behind the sound generation. I’m just curious about what happens if I play a midi file that should have a few different voices. I choose the moon theme from the NES ducktales game. Such a great song.

OH YA!!!!!