diff options
Diffstat (limited to '')
| -rw-r--r-- | 2020/info/05.md | 371 |
1 files changed, 371 insertions, 0 deletions
diff --git a/2020/info/05.md b/2020/info/05.md index 103c1ece..8a462efd 100644 --- a/2020/info/05.md +++ b/2020/info/05.md @@ -3,9 +3,11 @@ 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"]] [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"]] [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) I hoped to become a successful musician someday, and while that has yet to happen, I've recorded a fair share of unreleased music over the @@ -103,3 +105,372 @@ screenshots from within Emacs as SVG (if compiled `--with-cairo`). it's worth trying out. The other disadvantage of the approach is that there's few vector animation formats (Flash, HTML5), so saving it losslessly to disk will be tricky. + + +<!-- transcript: 2020/subtitles/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--grant-shangreaux.vtt --> + +<a name="transcript"></a> +# Transcript + +Hello, my name is Grant Shangreaux. This is my talk titled Bard +Bivou(m)acs: Publishing Music with Emacs. I'm a software developer +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 +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 +freedoms that Emacs and GNU software represent to me, as well as my +ideas on culture and my background. I don't believe that music is a +consumer good. It's a form of knowledge, like an algorithm. And it's +just such a part of culture, like in tribal cultures, music was seen +as a gift from the cosmos or the gods. It was a gift maybe through an +individual vessel, but was shared with the people and shared with +everyone, kept alive by the culture itself. So to me, music is +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 +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 +but I don't have time. Feel free to reach out to me by email or IRC. +Part of the motivation for me, personally, is that Emacs is super +magical. It's an all-in-one solution. Like I said, the GNU software +aligns with Creative Commons' ideas. I can do file management. I can +author HTML, all the web stuff I need even, literate-style. I can +handle media and metadata. I've got version control, remote server +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 +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 +know where they came from. I don't know what they are. I need to be +able to listen to them, and I need to be able to add metadata to +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 +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 +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, +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 +recorded on a digital recorder. If I had the choice, I would have a +recorder that used a different format, but so be it. I can mark all +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 +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 +could edit these here. I could edit them one at a time, but that's not +really great. I want superpower metadata authoring. So, by marking +them, I can then hit E, and I have all three of the tracks loaded up +in this tags buffer. On top of that, I can do EMMS tag editor, set +all, C-c C-r, and I want to set the artist. so these are some +recordings of my family. So, Shangreaux, set all three of them. I want +to set the album: Spring Walk with Lap Harp. I want to set the year. +And then I'm going to go ahead and put these in manually, but with the +power of Emacs keyboard macros and registers and so on. I could do +this programmatically as well, which would make it a lot easier if I +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, +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 +to have that filename reflect the track number and the artist and so +on. So there's another command, EMMS rename tag editor, rename, so it +could be just capital R. I think I need to mark all of these, hit +capital R, and then it's going to ask me to confirm and say yes to all +of them. And now, if you look in the-- whoops I have to update +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 +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 +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 +need Rails. I don't need Node. I don't need any of this other stuff. I +have my tool right here. It's a fully... It's a whole operating +system, basically, plus programming languages. So the first thing I +started with was buffer scripting for manipulating text. That's kind +of the easiest way to do it. Basically, anything you can do in a +buffer, you can do programmatically with Elisp. So this might be a +good example for beginners. If you haven't done any Elisp yet, a +simple example is to create this this div output here. You can use +this with-temp-buffer, so basically creating an imaginary buffer. +insert is just like typing, so you put strings in, you put new lines +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 +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, +and then a button for playing it, plus the source of the audio file, +which will get added here. Right now, this is hard coded for Opus, so +it won't work for my MP3s. I'm going to skip over snippets. Turns out +format strings were good enough for me. Snippets could be useful, but +format is super powerful, and I didn't really even need all that much +power, basically, just doing string interpolation. So if you haven't +seen format before, you basically put these control strings or control +characters inside of a string, and you can generate an output string +that you want. So in my generator code, basically, it's down here, I'm +calling format with this Bard Bivou(m)acs template, and that's +basically a big a big string of HTML. It's just my whole page of HTML +with those control characters in just four places. One of them +populates the track list. That's really the meat of the program. +Again, this is a combination of using buffer scripting, using HTML +mode, inserting text format strings, and then I can indent-region so +the HTML actually looks pretty when it comes out of it as well. I will +show that, just really quick actually. So you can see, this is the +HTML that got generated. I've got my template. I inserted the title +here, the style, the font was all inserted, and then this whole list +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 +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 +was a little bit complicated. It probably would have been simpler had +I not used Org Babel, but it's also really fun. I think it's a cool, +cool idea to use literate programming. My idea was to create HTML +components. I could name it like this, put a format string inside it, +and build a function in Elisp to format it and spit out the HTML that +I want. By doing this, then, I can just change things in my Org file +which, not getting a whole lot of time to work on it, I can come back +to it and I have a lot of notes. I can kind of generate things as I'm +going and keep notes for myself, and keep the... I don't know. It's +cool. Literate programming is fun. So I don't need to go into that too +much, but you can see if I execute this here, I get the the div that I +want. It's a little bit funny. You'll see I have the string like this, +the way that noweb expands, I can't do this on a single line. It looks +funny when you do that, so that might be something to work out later. +CSS blocks can either be tangled out and referenced in the HTML source +or inlined. Here's an example I have of inlining it. So I've got my +little CSS block named style, Javascript named script, and then I've +got this HTML source block with noweb expansion. These double angle +brackets here are where I'm going to expand the block named style. I'm +actually calling a function, so I want the result of the function +here, and then the script will just get expanded here. So +org-babel-expand-src-block, you can see what it looks like. I've got +my style here. I've got my title. I've got that main content class I +showed before, and the script as well. So that's kind of cool. I could +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 +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 +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 +GPL. Ideally, I could serve it with Emacs. I'd like to remove +idiosyncrasy so other people can use it. It's pretty much just my tool +right now. Not requiring the web browser... I can ship playlists so +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 +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 +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! + +<!-- /transcript --> + + +<!-- transcript: 2020/subtitles/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--questions--grant-shangreaux.vtt --> + +<a name="transcript-questions"></a> +# Transcript: Q&A + +So first question, what does Bard Bivou(m)acs mean? Good question. In +one version of my talk, I spent too long explaining it, and decided to +cut it out. It's basically a bad pun on band camp. A bivouac--I don't +even know if I'm pronouncing that correctly--it's like a tent or a +camp that you put up hastily, and a bard is a musician, of course. +Yeah, I don't know. I like puns. I'm a dad. That's the best I could +come up with. I'll probably find a different name for it but I liked +that "bivoaucs," if you stick an m in there, it becomes Bivou(m)acs. +It's kind of like editor macros for generating some HTML. Yes, it is +confusing, chatting on IRC at the same time. Great question. (Amin: +Grant, so right now, you're sharing your screen. Are you planning on +showing something with it, or for example, should I maximize you?) I +don't know. I can turn it off for now. Okay. (Amin: You can turn on +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 +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 +how to do mass tag editing. And that was like... It wasn't very +intuitive, like I said, with EMMS. I think EMMS is really great, but +its interface is huge. like if you do M-x and type emms, you get I +don't know, 270-some candidates. There's a lot of functions going on. +I basically found the features that I needed to get this workflow +working. I would guess that you probably can do it, and if you don't, +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 +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 +for tagging things. there's a lot of different options that can shell +out too. I was using the the vorbis tools to tag the particular files +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 +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 +it all in one program? Have I experimented with mass tag update +queries? I have not. Again, I was just doing this workflow, taking raw +files with no tags and doing that. I believe because it calls out to +the programs in the back end, I'm sure you could work that out. I +think EMMS would benefit from having something like that because we +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 +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 +problems, if musicians could just be musicians and not have to worry +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 +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, +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. +I don't know how much more time we have left for questions. That's +most of the things on the etherpad. (Amin: I think we have like 10 +more minutes to catch up with the schedule. If there are more +questions, feel free to answer them.) I'll start looking through IRC. +(Amin: And keep an eye on the pad too.) Thank you all for listening +and for enjoying the talk. I'm glad it turned out well. Awesome. Yeah, +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 +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 +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 +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: +Grant, can you try sharing your screen maybe?) Oh, is it not shared? +I'm sorry. (Amin: Thank you.) There we go, should be coming up. (Amin: +It's coming up. Yep, we see it.) Awesome. All right. Okay. I don't +know why this isn't working. It was working. Okay, you want to see the +screenshot. Whoops. Okay, I just took a screenshot. So, org-tree-slide. +I don't know why it's not launching. I thought that I had required it, +but I must not have. Maybe I'll try. Okay. So there we go. So +org-tree-slide is a way that basically uses narrowing and some kind of +font tricks to... it changes your titles or your metadata into this +banner for the title here, and it automatically sets the faces for +you. You can customize that, of course. And then, as you go through +the Org file, you get these kind of nice animations and-- what's it +called--breadcrumbs up at the top. So org-tree-slide. I highly +recommend it. It's really nice because you can give your presentation +and practice it, and while you're practicing it, you can edit things +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 +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 +do it again and again, and open more screenshots of screenshots. Yeah, +definitely Emacsception. Fun stuff. Anything else in chat? Heading +colors? Oh, yeah. I talked about the themes. This is another Kaolin +theme. I think the one in the talk was maybe this one, Aurora. Oh, +here, there's something funny when you start org-tree-slide with a +different theme. This top header bar gets the faces from that previous +theme. I have not figured out how to fix that yet. Did I have to +compile to get the screenshot? I think maybe I did. Yes, if I'm +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 +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 +I've seen so far today, and I'm looking forward to to the rest. It's +really interesting, just from being on Emacs in IRC for a few months, +I've already connected with a lot of interesting people and have a lot +of cool connections already. (Amin: Thank you for being a part of the +community, Grant.) That's good to be here. I have another talk +tomorrow as well. Oh, thanks for everyone in the Etherpad for putting +more comments on these questions here and taking the notes. (Amin: I +think that's about all the time that we have for the Q&A. Okay. Thank +you again so much, Grant, for your awesome talk and for popping in for +questions.) Yeah, thanks again for hosting. See you later. Cheers! + +<!-- /transcript --> |