diff options
Diffstat (limited to '2020/info/05.md')
| -rw-r--r-- | 2020/info/05.md | 81 |
1 files changed, 53 insertions, 28 deletions
diff --git a/2020/info/05.md b/2020/info/05.md index 69af293e..852caff3 100644 --- a/2020/info/05.md +++ b/2020/info/05.md @@ -1,11 +1,11 @@ # Bard Bivou(m)acs - Building a bandcamp-like page for an album of music Grant Shangreaux -[[!template id=vid src="https://mirror.csclub.uwaterloo.ca/emacsconf/2020/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--grant-shangreaux.webm" subtitles="/2020/subtitles/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--grant-shangreaux.vtt"]] +[[!template id=vid vidid="mainVideo" src="https://mirror.csclub.uwaterloo.ca/emacsconf/2020/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--grant-shangreaux.webm" subtitles="/2020/subtitles/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--grant-shangreaux.vtt"]] [Download compressed .webm video (20.3M)](https://mirror.csclub.uwaterloo.ca/emacsconf/2020/smaller/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--grant-shangreaux--vp9-q56-video-original-audio.webm) [View transcript](#transcript) -[[!template id=vid src="https://mirror.csclub.uwaterloo.ca/emacsconf/2020/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--questions--grant-shangreaux.webm" download="Download Q&A video, 720p" subtitles="/2020/subtitles/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--questions--grant-shangreaux.vtt"]] +[[!template id=vid vidid="qnaVideo" src="https://mirror.csclub.uwaterloo.ca/emacsconf/2020/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--questions--grant-shangreaux.webm" download="Download Q&A video, 720p" subtitles="/2020/subtitles/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--questions--grant-shangreaux.vtt"]] [Download compressed Q&A .webm video (15.7M)](https://mirror.csclub.uwaterloo.ca/emacsconf/2020/smaller/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--questions--grant-shangreaux--vp9-q56-video-original-audio.webm) [View transcript for Q&A](#transcript-questions) @@ -118,7 +118,8 @@ with Unabridged Software in Lincoln, Nebraska. Long time Emacs user, relatively new Emacs hacker. Hopefully, I'll be able to show you my workflow, with how I publish music with Emacs. All right. -(00:30) So as a musician, I would like to publish my music online. I could +(<a href="#mainVideo" class="time-link">00:30</a>) +So as a musician, I would like to publish my music online. I could publish with popular online music services, but I'm more of a DIY-type, so I chose to go ahead and publish with Emacs. What's the motivation behind this? A lot of it comes down to some fundamental @@ -133,7 +134,8 @@ something that should be shared and should be freely enjoyed by everyone. Of course, artists should be compensated as well, but that's a whole different topic. -(01:39) So when I want to share my music, I want to do it without +(<a href="#mainVideo" class="time-link" data-timestamp="99">01:39</a>) +So when I want to share my music, I want to do it without impacting anyone's freedom. Using GNU software like Emacs is a good way that I can ensure that I won't be requiring people to sign away their freedoms for anything. There's a lot more I could say about this @@ -147,7 +149,8 @@ access... All the tools I need are right under my fingertips with this tool that I use every day for a long time. I don't need to look elsewhere. -(02:31) It was a challenge. I wanted to see if I could do this all +(<a href="#mainVideo" class="time-link">02:31</a>) +It was a challenge. I wanted to see if I could do this all within Emacs itself. So, how do you use Emacs to publish music? Well, for me, I needed a couple of things. I needed to be able to audition and label unlabeled audio tracks. I have a lot of files that I don't @@ -157,7 +160,8 @@ whatever audio format it is and rename the files based on that metadata, potentially. And in the end, I wanted to take those files and programmatically produce a web page for people to consume. -(03:08) I found out that Emacs scores a hundred percent on all of +(<a href="#mainVideo" class="time-link">03:08</a>) +I found out that Emacs scores a hundred percent on all of these requirements that I had for this, and a lot of that came from EMMS, the Emacs multimedia system. EMMS is great. If you haven't checked it out, please do. It's a little bit unintuitive, but once you @@ -165,7 +169,8 @@ get into it, you know it works. Basically, what EMMS gave me was the ability to listen to the tracks, organize playlists. On top of that, it gave me super-powered metadata authoring. -(03:42) I'm going to demonstrate that to you. So in order to do this, +(<a href="#mainVideo" class="time-link">03:42</a>) +I'm going to demonstrate that to you. So in order to do this, you have to require markable playlists, so (require 'emms-mark). I'm going to go through, and I'm going to open the red... I've got this. These files here. So you can see these files are mp3s. They're @@ -175,7 +180,8 @@ these files and I can do EMMS add to .., and now they've been loaded into a playlist. So you can see the playlist here. There's some leftover files. -(04:30) So I've got these three files in my playlist, and as +(<a href="#mainVideo" class="time-link">04:30</a>) +So I've got these three files in my playlist, and as you can see, it's just the file name, the path. I don't have any metadata associated with them. In this playlist, I can hit E, and it'll bring up a buffer showing the tag information that I have. I @@ -193,7 +199,8 @@ had much more than three files to do this with. Submit the changes with C-c C-c, and now we've got the playlist. You can see the artist and track number have been updated here. -(6:15) And then the final piece of this is that if you look at this, +(<a href="#mainVideo" class="time-link">6:15</a>) +And then the final piece of this is that if you look at this, you can see that the file name is still the same. So if I were looking at the directory, I would still have this file name. When packaging these up for a release, for people to download, it's nice to be able @@ -206,14 +213,16 @@ it--you'll see it's been updated with the artist, track number and track name. This format is a format string, so it's customizable of course. I just decided to go with the default. -(7:21) So that's pretty great, this workflow just with EMMS. I didn't +(<a href="#mainVideo" class="time-link">7:21</a>) +So that's pretty great, this workflow just with EMMS. I didn't have to do anything. This is all there. It's all built in. It gave me exactly what I was looking for in terms of being able to process a lot of raw audio files add metadata to them and get them ready for publishing. And this is for publishing for playback in any media player. It'll be useful. Not just for the web page that I'm building. -(7:48) So the final part, of course, is to build the web page. Emacs +(<a href="#mainVideo" class="time-link">7:48</a>) +So the final part, of course, is to build the web page. Emacs makes authoring HTML trivial. As I was going through this, I wanted to challenge myself and just be, like, can I do this just all with Emacs? Can I just make this? I don't need a... I don't need Ruby. I don't @@ -231,7 +240,8 @@ in, you can build some strings together. Here you can see I'm doing a random number, so every time I execute this, my content change. I can generate dynamic content in HTML blocks with Elisp. -(9:04) For my web page builder, It's a little more complex. I'm +(<a href="#mainVideo" class="time-link">9:04</a>) +For my web page builder, It's a little more complex. I'm pulling data out using EMMS data structures, so it's pulling that out from the track data. And then I'm using some program to generate list elements, so each track is going to have the title and track number, @@ -258,7 +268,8 @@ of of tracks here. It's kind of messy to look at, but this track list, this whole div here, is all generated by my generator code, and it works. It's great. Okay, moving on. -(11:27) So the other thing was that as I was developing this, I +(<a href="#mainVideo" class="time-link">11:27</a>) +So the other thing was that as I was developing this, I decided to use Org Babel and some of his its features for multi-language things because I needed to style it with CSS and and put actions in Javascript, and also I used SVG for authoring stuff. It @@ -290,14 +301,16 @@ just run org-babel-tangle and get my thing out and just edit one file instead of multiple files. Not for everyone, but I thought it was kind of fun. All right. -(13:45) Oh, and the final thing is that in Emacs, you can author and +(<a href="#mainVideo" class="time-link">13:45</a>) +Oh, and the final thing is that in Emacs, you can author and view SVG. So this is just an Org. This SVG, I used to make the play and pause buttons. I didn't know this, but if you edit an SVG file, you can toggle back and forth between the code and the image. It's pretty sweet. So I can iteratively work through this because of how Emacs is. -(14:20) Final considerations here, like when doing this, I want it to +(<a href="#mainVideo" class="time-link">14:20</a>) +Final considerations here, like when doing this, I want it to be all free, so I want to use fonts that use a free license. I found GNU Unifont. It's kind of cool. The content license... I chose Creative Commons Attribution ShareAlike, which is kind of like the @@ -308,13 +321,14 @@ that you can just click or link to a playlist on your favorite player, even EMMS if you want, and then packing up those albums in like a ZIP or .tar file. -(15:04) So you can go to churls.world . It just has a link to this +(<a href="#mainVideo" class="time-link">15:04</a>) +So you can go to churls.world . It just has a link to this album. I'll display it here in just a second. You can contact me. I'm shoshin on #emacs in IRC and on sourcehut. You can email me grant@churls.world, personal, or grant@unabridgedsoftware.com. All right, now. Let's see about this... This is up online, so if you want to listen to my college band's album from 20 years ago, here it is: -Cassiopeia Basement Days. Whoops. I made this art in Krita. You can +Casiopeia Basement Days. Whoops. I made this art in Krita. You can press play. You can skip around. I do have the playlist up here too. So yeah, thanks for listening. I hope you enjoyed it, and enjoy the rest of EmacsConf. Goodbye! @@ -344,7 +358,8 @@ the webcam.) Yeah, okay. (Amin: I'll maximize your webcam.) Okay, thanks. I'll get to the answer for my color theme here in a bit in IRC. -(1:31) Next question on the Etherpad, does this metadata workflow also +(<a href="#qnaVideo" class="time-link">1:31</a>) +Next question on the Etherpad, does this metadata workflow also support unsynchronized lyrics within ID3 tags, multi-line metadata? I don't know, actually. It's funny because I was trying out different things with metadata, and really the biggest thing was to figure out @@ -358,7 +373,8 @@ if you can't do it out of the box, I think you could script EMMS to do that. I'd like to know more, and I'm certainly going to be investigating it. I will try and post my findings somewhere online. -(2:39) Is it possible to import batch metadata? I'm not sure. I would +(<a href="#qnaVideo" class="time-link">2:39</a>) +Is it possible to import batch metadata? I'm not sure. I would guess yes is the answer. EMMS can connect to metadata services. I haven't done that because I was just using audio files that I created myself. I know that on the back end, it calls out to shell programs @@ -368,7 +384,8 @@ I was working with. You can also use tiny tag, and there's some other... That might be the python library. I can't remember. There's two other libraries that I can shell out to for doing metadata. -(3:24) My current workflow for tagging music is to first apply replay +(<a href="#qnaVideo" class="time-link">3:24</a>) +My current workflow for tagging music is to first apply replay gain in fubar 2000, fix egregious mistakes, use beats to apply metadata from music brains, or discogs, go over remaining albums with fubar 2000 again. Is there a chance textual tagging could allow doing @@ -381,7 +398,8 @@ work with text, and being able to use Emacs as a front end for those updates would be really fantastic. So really, it's just a matter of writing the interface to the external tool. -(4:22) Is there a link to some info expanding philosophy of how to +(<a href="#qnaVideo" class="time-link">4:22</a>) +Is there a link to some info expanding philosophy of how to compensate musicians? No, I don't really have a lot of philosophy around that. I guess the first thing I could say would be something like a universal income. I feel like that would solve a lot of @@ -390,12 +408,14 @@ about their pay. I will think about it more. This is one of my first forays into getting public with some of these ideas, so I will try to do more and let the community know. -(4:54) What Emacs theme am I using? Can't remember. It's one of the +(<a href="#qnaVideo" class="time-link">4:54</a>) +What Emacs theme am I using? Can't remember. It's one of the Kaolin themes. I think it was Aurora or or Bubble Gum, maybe, but the Kaolin themes are nice. I recommend them. Not using Doom Emacs, Doom mode line though. It's very pretty. -(5:17) SVG support built into Emacs? I'm using Emacs 27.1, and yes, +(<a href="#qnaVideo" class="time-link">5:17</a>) +SVG support built into Emacs? I'm using Emacs 27.1, and yes, SVG support is built in. I may have had to compile it with some Cairo support. I don't remember for sure. But yes, you can even take screenshots of your Emacs from within Emacs in SVG. It's pretty great. @@ -409,17 +429,20 @@ it's been fun so far. How did I manage? I can post a snippet of that, or actually I can share my screen, can't I... Okay. I actually have it up right here. -(6:49) So I think I got this from alphapapa, to be honest. I define +(<a href="#qnaVideo" class="time-link">6:49</a>) +So I think I got this from alphapapa, to be honest. I define screenshot-svg. It's an interactive command. Oh yeah, there's alphae.papa Okay, there we go. I would like to change this so that I can get it into the copy-paste buffer so I don't have to copy the file in, but I haven't really hacked on it yet. -(7:20) Okay, org heading colors. That might be a good question. I know, the +(<a href="#qnaVideo" class="time-link">7:20</a>) +Okay, org heading colors. That might be a good question. I know, the presentation... Sorry, it's hard to think and type at the same time. Think and talk and type. -(7:41) So the presentation is just a normal org file, right, so I have my +(<a href="#qnaVideo" class="time-link">7:41</a>) +So the presentation is just a normal org file, right, so I have my headers, and the author--you can even stick your email and other headers in there. But there's a package called org-tree-slide. Whoops, why is it not... I must have not required it. Good question. (Amin: @@ -442,7 +465,8 @@ as well, because it's still just an Org document using narrowing, you know. It doesn't actually change anything. Definitely recommend org-tree-slide mode. Okay, let's see, what else... -(10:29) Share my screen to demo. Oh, that's the SVG. Let's see. Okay, so I +(<a href="#qnaVideo" class="time-link">10:29</a>) +Share my screen to demo. Oh, that's the SVG. Let's see. Okay, so I don't know if you can see this now, but I'm actually viewing the SVG screenshot that I took with Emacs. See here's the source of it. So Emacs made that. And here's the image. It's cool because you can even @@ -458,7 +482,8 @@ remembering correctly. I got Emacs 27. I'm not on a Mac. I saw alphapapa's comment on reddit, and then I recompiled it with Cairo support. Yes. -(12:18) Okay, lots of good conversation on here. Yep, I have like one or two +(<a href="#qnaVideo" class="time-link">12:18</a>) +Okay, lots of good conversation on here. Yep, I have like one or two more minutes. Okay I guess while I'm here, I might as well say thank you to the organizers. I really appreciate everybody's work on this. It's fun to be a part of this community. I'm enjoying the other talks |