From 3d3cf5fa5da60a26b79c651c19ae6fe750c7895d Mon Sep 17 00:00:00 2001 From: Sacha Chua Date: Thu, 10 Dec 2020 12:55:31 -0500 Subject: Add subtitles for talk05 --- ...age-for-an-album-of-music--grant-shangreaux.vtt | 1141 ++++++++++++++++++++ 1 file changed, 1141 insertions(+) create mode 100644 2020/subtitles/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--grant-shangreaux.vtt (limited to '2020/subtitles/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--grant-shangreaux.vtt') diff --git a/2020/subtitles/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--grant-shangreaux.vtt b/2020/subtitles/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--grant-shangreaux.vtt new file mode 100644 index 00000000..dff7fcb0 --- /dev/null +++ b/2020/subtitles/emacsconf-2020--05-bard-bivoumacs-building-a-bandcamp-like-page-for-an-album-of-music--grant-shangreaux.vtt @@ -0,0 +1,1141 @@ +WEBVTT + +00:00:01.360 --> 00:00:04.480 +Hello, my name is Grant Shangreaux. + +00:00:04.480 --> 00:00:07.279 +This is my talk titled Bard Bivou(m)acs: + +00:00:07.279 --> 00:00:07.919 +Publishing Music + +00:00:07.919 --> 00:00:10.719 +with Emacs. I'm a software + +00:00:10.719 --> 00:00:12.799 +developer with Unabridged Software in + +00:00:12.799 --> 00:00:14.400 +Lincoln, Nebraska. + +00:00:14.400 --> 00:00:16.800 +Long time Emacs user, relatively new + +00:00:16.800 --> 00:00:18.720 +Emacs hacker. + +00:00:18.720 --> 00:00:20.480 +Hopefully, I'll be able to show + +00:00:20.480 --> 00:00:22.960 +you my workflow, with + +00:00:22.960 --> 00:00:30.480 +how I publish music with Emacs. + +00:00:30.480 --> 00:00:33.440 +All right. So as a musician, I would like + +00:00:33.440 --> 00:00:35.520 +to publish my music online. + +00:00:35.520 --> 00:00:37.200 +I could publish with popular + +00:00:37.200 --> 00:00:39.040 +online music services, + +00:00:39.040 --> 00:00:42.000 +but I'm more of a DIY-type, so I chose to + +00:00:42.000 --> 00:00:44.719 +go ahead and publish with Emacs. + +00:00:44.719 --> 00:00:48.160 +What's the motivation behind this? + +00:00:48.160 --> 00:00:49.760 +A lot of it comes down to some + +00:00:49.760 --> 00:00:51.600 +fundamental freedoms + +00:00:51.600 --> 00:00:54.960 +that Emacs and GNU software + +00:00:54.960 --> 00:00:59.120 +represent to me, as well as my + +00:00:59.120 --> 00:01:01.840 +ideas on culture and my background. + +00:01:01.840 --> 00:01:04.080 +I don't believe that music is a consumer good. + +00:01:04.080 --> 00:01:06.080 +It's a form of knowledge, + +00:01:06.080 --> 00:01:08.320 +like an algorithm. + +00:01:08.320 --> 00:01:10.479 +And it's just such a part of + +00:01:10.479 --> 00:01:13.119 +culture, like in tribal cultures, music + +00:01:13.119 --> 00:01:16.640 +was seen as a gift from the cosmos or + +00:01:16.640 --> 00:01:18.000 +the gods. It was + +00:01:18.000 --> 00:01:19.920 +a gift maybe through an individual + +00:01:19.920 --> 00:01:21.920 +vessel, but was shared with the people + +00:01:21.920 --> 00:01:23.520 +and shared with everyone, + +00:01:23.520 --> 00:01:26.799 +kept alive by the culture itself. + +00:01:26.799 --> 00:01:29.840 +So to me, music is something that + +00:01:29.840 --> 00:01:31.520 +should be shared and should be + +00:01:31.520 --> 00:01:34.640 +freely enjoyed by everyone. Of course, + +00:01:34.640 --> 00:01:36.560 +artists should be compensated as well, + +00:01:36.560 --> 00:01:39.040 +but that's a whole different topic. + +00:01:39.040 --> 00:01:41.040 +So when I want to share my music, + +00:01:41.040 --> 00:01:42.720 +I want to do it without impacting + +00:01:42.720 --> 00:01:43.520 +anyone's freedom. + +00:01:43.520 --> 00:01:45.680 +Using GNU software like Emacs is a + +00:01:45.680 --> 00:01:49.200 +good way that I can ensure that + +00:01:49.200 --> 00:01:52.840 +I won't be requiring people to + +00:01:52.840 --> 00:01:55.840 +sign away their freedoms for anything. + +00:01:55.840 --> 00:01:57.119 +There's a lot more I could say about + +00:01:57.119 --> 00:01:58.799 +this but I don't have time. + +00:01:58.799 --> 00:02:03.439 +Feel free to reach out to me by email or IRC. + +00:02:03.439 --> 00:02:06.479 +Part of the motivation for me, + +00:02:06.479 --> 00:02:08.239 +personally, is that Emacs is super + +00:02:08.239 --> 00:02:10.720 +magical. It's an all-in-one solution. + +00:02:10.720 --> 00:02:12.720 +Like I said, the GNU software aligns with + +00:02:12.720 --> 00:02:14.480 +Creative Commons' ideas. + +00:02:14.480 --> 00:02:16.800 +I can do file management. I can author + +00:02:16.800 --> 00:02:18.879 +HTML, all the web stuff I need even, + +00:02:18.879 --> 00:02:20.239 +literate-style. + +00:02:20.239 --> 00:02:22.640 +I can handle media and metadata. I've got + +00:02:22.640 --> 00:02:24.640 +version control, remote server access... + +00:02:24.640 --> 00:02:26.800 +All the tools I need are right under my + +00:02:26.800 --> 00:02:28.080 +fingertips with this tool + +00:02:28.080 --> 00:02:30.000 +that I use every day for a long time. + +00:02:30.000 --> 00:02:31.440 +I don't need to look elsewhere. + +00:02:31.440 --> 00:02:34.319 +It was a challenge. + +00:02:34.319 --> 00:02:36.319 +I wanted to see if I could do this + +00:02:36.319 --> 00:02:39.440 +all within Emacs itself. + +00:02:39.440 --> 00:02:41.680 +So, how do you use Emacs to publish music? + +00:02:41.680 --> 00:02:43.440 +Well, for me, I needed + +00:02:43.440 --> 00:02:45.120 +a couple of things. I needed to be able + +00:02:45.120 --> 00:02:46.480 +to audition and label + +00:02:46.480 --> 00:02:48.319 +unlabeled audio tracks. I have a lot of + +00:02:48.319 --> 00:02:50.000 +files that I don't know where they + +00:02:50.000 --> 00:02:51.280 +came from. I don't know what they are. I + +00:02:51.280 --> 00:02:53.840 +need to be able to listen to them, + +00:02:53.840 --> 00:02:56.800 +and I need to be able to add metadata to + +00:02:56.800 --> 00:02:58.480 +whatever audio format it is + +00:02:58.480 --> 00:03:00.800 +and rename the files based on that + +00:03:00.800 --> 00:03:03.200 +metadata, potentially. + +00:03:03.200 --> 00:03:05.120 +And in the end, I wanted to take those + +00:03:05.120 --> 00:03:08.319 +files and programmatically produce a web page + +00:03:08.319 --> 00:03:11.920 +for people to consume. I found out that + +00:03:11.920 --> 00:03:14.879 +Emacs scores a hundred percent on all of + +00:03:14.879 --> 00:03:18.000 +these requirements that I had for this, and + +00:03:18.000 --> 00:03:20.720 +a lot of that came from EMMS, the Emacs + +00:03:20.720 --> 00:03:22.640 +multimedia system. + +00:03:22.640 --> 00:03:26.080 +EMMS is great. + +00:03:26.080 --> 00:03:27.760 +If you haven't checked it out, please do. + +00:03:27.760 --> 00:03:30.000 +It's a little bit unintuitive, but + +00:03:30.000 --> 00:03:34.000 +once you get into it, you know it works. + +00:03:34.000 --> 00:03:36.640 +Basically, what EMMS gave me was the + +00:03:36.640 --> 00:03:38.720 +ability to listen to the tracks, + +00:03:38.720 --> 00:03:39.680 +organize playlists. + +00:03:39.680 --> 00:03:41.280 +On top of that, it gave me + +00:03:41.280 --> 00:03:42.959 +super-powered metadata authoring. + +00:03:42.959 --> 00:03:45.040 +I'm going to demonstrate that to you. + +00:03:45.040 --> 00:03:47.200 +So in order to do this, + +00:03:47.200 --> 00:03:50.879 +you have to require markable playlists, + +00:03:50.879 --> 00:03:54.879 +so (require 'emms-mark). I'm going to + +00:03:54.879 --> 00:03:59.680 +go through, and I'm going to open the red... + +00:03:59.680 --> 00:04:02.319 +I've got this. These files here. So + +00:04:02.319 --> 00:04:04.480 +you can see these files are mp3s. + +00:04:04.480 --> 00:04:06.080 +They're recorded on a + +00:04:06.080 --> 00:04:07.599 +digital recorder. + +00:04:07.599 --> 00:04:09.920 +If I had the choice, I would have a + +00:04:09.920 --> 00:04:12.319 +recorder that used a different format, + +00:04:12.319 --> 00:04:14.640 +but so be it. I can mark all these files + +00:04:14.640 --> 00:04:16.160 +and I can do EMMS + +00:04:16.160 --> 00:04:20.000 +add to .., and now they've been loaded + +00:04:20.000 --> 00:04:27.040 +into a playlist. + +00:04:27.040 --> 00:04:29.040 +So you can see the playlist here. There's + +00:04:29.040 --> 00:04:30.400 +some leftover files. + +00:04:30.400 --> 00:04:32.000 +So I've got these three files in my + +00:04:32.000 --> 00:04:33.759 +playlist, and as you can see, it's just + +00:04:33.759 --> 00:04:34.639 +the file name, + +00:04:34.639 --> 00:04:36.800 +the path. I don't have any metadata + +00:04:36.800 --> 00:04:38.560 +associated with them. + +00:04:38.560 --> 00:04:41.360 +In this playlist, I can hit E, + +00:04:41.360 --> 00:04:43.440 +and it'll bring up a buffer showing + +00:04:43.440 --> 00:04:47.360 +the tag information that I have. + +00:04:47.360 --> 00:04:49.840 +I could edit these here. + +00:04:49.840 --> 00:04:51.520 +I could edit them one at a time, but that's + +00:04:51.520 --> 00:04:53.919 +not really great. I want superpower + +00:04:53.919 --> 00:05:04.479 +metadata authoring. So, + +00:05:04.479 --> 00:05:07.680 +by marking them, I can then hit E, and I + +00:05:07.680 --> 00:05:10.479 +have all three of the tracks loaded up in + +00:05:10.479 --> 00:05:12.639 +this tags buffer. + +00:05:12.639 --> 00:05:15.759 +On top of that, I can do EMMS + +00:05:15.759 --> 00:05:18.800 +tag editor, set all, C-c C-r, + +00:05:18.800 --> 00:05:22.840 +and I want to set the artist. + +00:05:22.840 --> 00:05:25.680 +so these are some recordings of my + +00:05:25.680 --> 00:05:26.320 +family. + +00:05:26.320 --> 00:05:31.039 +So, Shangreaux, set all three of them. + +00:05:31.039 --> 00:05:35.600 +I want to set the album: + +00:05:35.600 --> 00:05:40.160 +Spring Walk with Lap Harp. + +00:05:40.160 --> 00:05:45.520 +I want to set the year. + +00:05:45.520 --> 00:05:48.960 +And then I'm going to go ahead and put + +00:05:48.960 --> 00:05:53.759 +these in manually, + +00:05:53.759 --> 00:05:55.840 +but with the power of Emacs keyboard + +00:05:55.840 --> 00:05:57.039 +macros and + +00:05:57.039 --> 00:05:59.600 +registers and so on. I could do this + +00:05:59.600 --> 00:06:02.319 +programmatically as well, + +00:06:02.319 --> 00:06:04.000 +which would make it a lot easier if I + +00:06:04.000 --> 00:06:06.000 +had much more than three files to + +00:06:06.000 --> 00:06:07.440 +do this with. + +00:06:07.440 --> 00:06:09.919 +Submit the changes with C-c C-c, + +00:06:09.919 --> 00:06:11.520 +and now we've got the playlist. You can + +00:06:11.520 --> 00:06:13.120 +see the artist and track number have + +00:06:13.120 --> 00:06:15.039 +been updated here. + +00:06:15.039 --> 00:06:17.360 +And then the final piece of this is that + +00:06:17.360 --> 00:06:19.039 +if you look at this, you can see that the + +00:06:19.039 --> 00:06:20.479 +file name is still the same. + +00:06:20.479 --> 00:06:22.639 +So if I were looking at the directory, + +00:06:22.639 --> 00:06:24.560 +I would still have this file name. + +00:06:24.560 --> 00:06:26.479 +When packaging these up for a release, + +00:06:26.479 --> 00:06:28.000 +for people to download, + +00:06:28.000 --> 00:06:30.319 +it's nice to be able to have that + +00:06:30.319 --> 00:06:32.400 +filename reflect the track number and the + +00:06:32.400 --> 00:06:34.800 +artist and so on. So there's another + +00:06:34.800 --> 00:06:41.199 +command, EMMS + +00:06:41.199 --> 00:06:44.160 +rename tag editor, rename, so it could be + +00:06:44.160 --> 00:06:45.120 +just capital R. + +00:06:45.120 --> 00:06:47.199 +I think I need to mark all of these, hit + +00:06:47.199 --> 00:06:48.880 +capital R, and then it's going to ask me + +00:06:48.880 --> 00:06:50.000 +to confirm + +00:06:50.000 --> 00:06:54.400 +and say yes to all of them. + +00:06:54.400 --> 00:07:02.720 +And now, if you look in the-- + +00:07:02.720 --> 00:07:04.319 +whoops I have to update it--you'll see + +00:07:04.319 --> 00:07:06.319 +it's been updated with the artist, + +00:07:06.319 --> 00:07:09.840 +track number and + +00:07:09.840 --> 00:07:11.120 +track name. + +00:07:11.120 --> 00:07:14.639 +This format is a format string, so + +00:07:14.639 --> 00:07:17.360 +it's customizable of course. + +00:07:17.360 --> 00:07:21.039 +I just decided to go with the default. + +00:07:21.039 --> 00:07:24.160 +So that's pretty great, this workflow + +00:07:24.160 --> 00:07:26.000 +just with EMMS. I didn't have to do + +00:07:26.000 --> 00:07:28.080 +anything. This is all there. It's all + +00:07:28.080 --> 00:07:30.960 +built in. It gave me exactly what + +00:07:30.960 --> 00:07:32.639 +I was looking for in terms of being able + +00:07:32.639 --> 00:07:35.599 +to process a lot of raw audio files + +00:07:35.599 --> 00:07:37.599 +add metadata to them and get them ready + +00:07:37.599 --> 00:07:39.280 +for publishing. + +00:07:39.280 --> 00:07:41.599 +And this is for publishing for playback + +00:07:41.599 --> 00:07:43.520 +in any media player. It'll be + +00:07:43.520 --> 00:07:46.560 +useful. Not just for the web page that I'm + +00:07:46.560 --> 00:07:48.479 +building. So the + +00:07:48.479 --> 00:07:50.560 +final part, of course, is to build the + +00:07:50.560 --> 00:07:54.960 +web page. Emacs makes authoring HTML trivial. + +00:07:54.960 --> 00:07:57.440 +As I was going through this, I + +00:07:57.440 --> 00:07:59.039 +wanted to challenge myself and just be, + +00:07:59.039 --> 00:08:00.400 +like, can I do this + +00:08:00.400 --> 00:08:03.520 +just all with Emacs? Can I just make this? + +00:08:03.520 --> 00:08:05.440 +I don't need a... I don't need Ruby. I don't + +00:08:05.440 --> 00:08:07.039 +need Rails. I don't need Node. I don't + +00:08:07.039 --> 00:08:08.960 +need any of this other stuff. I have my + +00:08:08.960 --> 00:08:10.560 +tool right here. It's a fully... + +00:08:10.560 --> 00:08:12.560 +It's a whole operating system, basically, + +00:08:12.560 --> 00:08:15.039 +plus programming languages. + +00:08:15.039 --> 00:08:17.360 +So the first thing I started with was + +00:08:17.360 --> 00:08:19.919 +buffer scripting for manipulating text. + +00:08:19.919 --> 00:08:22.560 +That's kind of the easiest way to do it. + +00:08:22.560 --> 00:08:24.319 +Basically, anything you can do in a + +00:08:24.319 --> 00:08:25.280 +buffer, you can do + +00:08:25.280 --> 00:08:28.479 +programmatically with Elisp. So this + +00:08:28.479 --> 00:08:30.319 +might be a good example for beginners. If + +00:08:30.319 --> 00:08:33.919 +you haven't done any Elisp yet, + +00:08:33.919 --> 00:08:36.000 +a simple example is to create this + +00:08:36.000 --> 00:08:36.959 +this div + +00:08:36.959 --> 00:08:40.000 +output here. You + +00:08:40.000 --> 00:08:41.760 +can use this with-temp-buffer, so + +00:08:41.760 --> 00:08:44.240 +basically creating an imaginary buffer. + +00:08:44.240 --> 00:08:46.640 +insert is just like typing, so you put + +00:08:46.640 --> 00:08:48.800 +strings in, you put new lines in, + +00:08:48.800 --> 00:08:50.959 +you can build some strings together. + +00:08:50.959 --> 00:08:52.080 +Here you can see + +00:08:52.080 --> 00:08:54.000 +I'm doing a random number, so every time + +00:08:54.000 --> 00:08:55.360 +I execute this, + +00:08:55.360 --> 00:08:57.920 +my content change,s so I can generate + +00:08:57.920 --> 00:09:01.040 +dynamic content in HTML blocks + +00:09:01.040 --> 00:09:04.399 +with Elisp. For my + +00:09:04.399 --> 00:09:05.920 +web page builder, It's a little more + +00:09:05.920 --> 00:09:08.000 +complex. I'm pulling data out + +00:09:08.000 --> 00:09:12.080 +using EMMS data structures, + +00:09:12.080 --> 00:09:16.080 +so it's pulling that out from the track data. + +00:09:16.080 --> 00:09:19.440 +And then I'm using some program to + +00:09:19.440 --> 00:09:21.440 +generate list elements, so each track is + +00:09:21.440 --> 00:09:23.200 +going to have the title + +00:09:23.200 --> 00:09:25.120 +and track number, and then a button for + +00:09:25.120 --> 00:09:26.959 +playing it, plus the source + +00:09:26.959 --> 00:09:29.519 +of the audio file, which will get added + +00:09:29.519 --> 00:09:30.480 +here. + +00:09:30.480 --> 00:09:32.640 +Right now, this is hard coded for Opus, so + +00:09:32.640 --> 00:09:37.200 +it won't work for my MP3s. + +00:09:37.200 --> 00:09:39.120 +I'm going to skip over snippets. Turns + +00:09:39.120 --> 00:09:41.200 +out format strings were good enough + +00:09:41.200 --> 00:09:45.519 +for me. Snippets could be useful, but + +00:09:45.519 --> 00:09:48.160 +format is super powerful, and I didn't + +00:09:48.160 --> 00:09:49.839 +really even need all that much power, + +00:09:49.839 --> 00:09:51.279 +basically, just doing string + +00:09:51.279 --> 00:09:53.519 +interpolation. So if you haven't seen + +00:09:53.519 --> 00:09:54.560 +format before, + +00:09:54.560 --> 00:09:56.720 +you basically put these control strings + +00:09:56.720 --> 00:09:59.120 +or control characters inside of a string, + +00:09:59.120 --> 00:10:03.120 +and you can generate an + +00:10:03.120 --> 00:10:05.040 +output string that you want. + +00:10:05.040 --> 00:10:07.600 +So in my generator code, basically, it's + +00:10:07.600 --> 00:10:08.720 +down here, + +00:10:08.720 --> 00:10:10.959 +I'm calling format with this Bard + +00:10:10.959 --> 00:10:12.800 +Bivou(m)acs template, + +00:10:12.800 --> 00:10:15.920 +and that's basically a big + +00:10:15.920 --> 00:10:18.240 +a big string of HTML. It's just + +00:10:18.240 --> 00:10:21.200 +my whole page of HTML + +00:10:21.200 --> 00:10:22.959 +with those control characters in just + +00:10:22.959 --> 00:10:24.399 +four places. + +00:10:24.399 --> 00:10:26.399 +One of them populates the track list. + +00:10:26.399 --> 00:10:29.760 +That's really the meat of the program. + +00:10:29.760 --> 00:10:32.079 +Again, this is a combination of using + +00:10:32.079 --> 00:10:33.440 +buffer scripting, + +00:10:33.440 --> 00:10:37.279 +using HTML mode, inserting text format strings, + +00:10:37.279 --> 00:10:40.000 +and then I can indent-region so the HTML + +00:10:40.000 --> 00:10:41.920 +actually looks pretty + +00:10:41.920 --> 00:10:45.200 +when it comes out of it as well. + +00:10:45.200 --> 00:10:50.160 +I will show that, just really quick + +00:10:50.160 --> 00:10:54.000 +actually. + +00:10:54.000 --> 00:10:56.880 +So you can see, this is the HTML that got + +00:10:56.880 --> 00:10:58.800 +generated. I've got my template. + +00:10:58.800 --> 00:11:02.560 +I inserted the title here, the style, the + +00:11:02.560 --> 00:11:05.760 +font was all inserted, + +00:11:05.760 --> 00:11:07.920 +and then this whole list of of tracks here. + +00:11:07.920 --> 00:11:11.200 +It's kind of messy to look at, + +00:11:11.200 --> 00:11:14.399 +but this track list, this whole div here, + +00:11:14.399 --> 00:11:15.920 +is all generated by + +00:11:15.920 --> 00:11:22.480 +my generator code, and it works. It's great. + +00:11:22.480 --> 00:11:27.120 +Okay, moving on. + +00:11:27.120 --> 00:11:30.240 +So the other thing was that as I was + +00:11:30.240 --> 00:11:32.079 +developing this, I decided to use + +00:11:32.079 --> 00:11:33.200 +Org Babel and some of his + +00:11:33.200 --> 00:11:35.360 +its features for multi-language + +00:11:35.360 --> 00:11:36.880 +things because I needed to style it with + +00:11:36.880 --> 00:11:37.839 +CSS and + +00:11:37.839 --> 00:11:40.480 +and put actions in Javascript, and also I + +00:11:40.480 --> 00:11:42.480 +used SVG for authoring stuff. + +00:11:42.480 --> 00:11:46.079 +It was a little bit complicated. + +00:11:46.079 --> 00:11:47.680 +It probably would have been simpler had I + +00:11:47.680 --> 00:11:49.600 +not used Org Babel, but it's also really + +00:11:49.600 --> 00:11:51.440 +fun. I think it's a cool, + +00:11:51.440 --> 00:11:53.839 +cool idea to use literate programming. My + +00:11:53.839 --> 00:11:55.839 +idea was to create HTML + +00:11:55.839 --> 00:11:59.519 +components. I could name it like this, + +00:11:59.519 --> 00:12:01.440 +put a format string inside it, and build + +00:12:01.440 --> 00:12:02.800 +a function + +00:12:02.800 --> 00:12:05.519 +in Elisp to format it and spit out the + +00:12:05.519 --> 00:12:07.120 +HTML that I want. + +00:12:07.120 --> 00:12:10.320 +By doing this, then, I can + +00:12:10.320 --> 00:12:12.880 +just change things in my Org file which, + +00:12:12.880 --> 00:12:14.320 +not getting a whole lot of time to work + +00:12:14.320 --> 00:12:16.959 +on it, I can come back to it and + +00:12:16.959 --> 00:12:19.839 +I have a lot of notes. I can + +00:12:19.839 --> 00:12:21.920 +kind of generate things as I'm going and + +00:12:21.920 --> 00:12:24.399 +keep notes for myself, and keep the... + +00:12:24.399 --> 00:12:25.600 +I don't know. It's cool. Literate + +00:12:25.600 --> 00:12:27.519 +programming is fun. So I don't need to + +00:12:27.519 --> 00:12:29.279 +go into that too much, but you can see if + +00:12:29.279 --> 00:12:31.040 +I execute this here, + +00:12:31.040 --> 00:12:33.360 +I get the the div that I want. It's a + +00:12:33.360 --> 00:12:34.880 +little bit funny. You'll see I have the + +00:12:34.880 --> 00:12:36.480 +string like this, the way that + +00:12:36.480 --> 00:12:39.200 +noweb expands, I can't do this on a + +00:12:39.200 --> 00:12:40.000 +single line. + +00:12:40.000 --> 00:12:43.839 +It looks funny when you do that, + +00:12:43.839 --> 00:12:45.440 +so that might be something to work out + +00:12:45.440 --> 00:12:48.959 +later. CSS blocks can either be tangled out + +00:12:48.959 --> 00:12:52.639 +and referenced in the HTML source or inlined. + +00:12:52.639 --> 00:12:54.639 +Here's an example I have of inlining it. + +00:12:54.639 --> 00:12:56.959 +So I've got my little CSS block named + +00:12:56.959 --> 00:13:00.320 +style, Javascript named script, + +00:13:00.320 --> 00:13:03.040 +and then I've got this HTML source block + +00:13:03.040 --> 00:13:04.839 +with noweb expansion. + +00:13:04.839 --> 00:13:07.920 +These double angle brackets here + +00:13:07.920 --> 00:13:09.839 +are where I'm going to expand the block + +00:13:09.839 --> 00:13:12.639 +named style. I'm actually calling a function, + +00:13:12.639 --> 00:13:14.399 +so I want the result of the function + +00:13:14.399 --> 00:13:17.040 +here, and then the script will just get + +00:13:17.040 --> 00:13:22.959 +expanded here. So org-babel-expand-src-block, + +00:13:22.959 --> 00:13:25.360 +you can see what it looks like. + +00:13:25.360 --> 00:13:28.160 +I've got my style here. I've got my title. + +00:13:28.160 --> 00:13:29.920 +I've got that main content class + +00:13:29.920 --> 00:13:31.279 +I showed before, + +00:13:31.279 --> 00:13:34.480 +and the script as well. So that's kind of cool. + +00:13:34.480 --> 00:13:36.320 +I could just run org-babel-tangle and + +00:13:36.320 --> 00:13:38.160 +get my thing out and just + +00:13:38.160 --> 00:13:40.480 +edit one file instead of multiple files. + +00:13:40.480 --> 00:13:41.600 +Not for everyone, + +00:13:41.600 --> 00:13:45.839 +but I thought it was kind of fun. + +00:13:45.839 --> 00:13:47.760 +All right. Oh, and the final thing is that + +00:13:47.760 --> 00:13:49.199 +in Emacs, you can + +00:13:49.199 --> 00:13:52.880 +author and view SVG. So this is just an + +00:13:52.880 --> 00:13:57.199 +Org. This SVG, I used to make the play + +00:13:57.199 --> 00:13:59.519 +and pause buttons. I didn't know this, + +00:13:59.519 --> 00:14:02.800 +but if you edit an SVG file, you can + +00:14:02.800 --> 00:14:08.800 +toggle back and forth + +00:14:08.800 --> 00:14:13.199 +between the code and the image. + +00:14:13.199 --> 00:14:17.360 +It's pretty sweet. So I can iteratively + +00:14:17.360 --> 00:14:19.680 +work through this because of how + +00:14:19.680 --> 00:14:20.560 +Emacs is. + +00:14:20.560 --> 00:14:24.959 +Final considerations here, + +00:14:24.959 --> 00:14:27.360 +like when doing this, I want it to be all + +00:14:27.360 --> 00:14:29.279 +free, so I want to use fonts that use a + +00:14:29.279 --> 00:14:30.079 +free license. + +00:14:30.079 --> 00:14:32.800 +I found GNU Unifont. It's kind of cool. + +00:14:32.800 --> 00:14:34.800 +The content license... I chose + +00:14:34.800 --> 00:14:37.600 +Creative Commons Attribution ShareAlike, + +00:14:37.600 --> 00:14:39.920 +which is kind of like the GPL. + +00:14:39.920 --> 00:14:42.880 +Ideally, I could serve it with Emacs. I'd + +00:14:42.880 --> 00:14:44.800 +like to remove idiosyncrasy so other + +00:14:44.800 --> 00:14:46.320 +people can use it. + +00:14:46.320 --> 00:14:48.720 +It's pretty much just my tool right now. + +00:14:48.720 --> 00:14:51.040 +Not requiring the web browser... I can + +00:14:51.040 --> 00:14:54.079 +ship playlists so that you can just + +00:14:54.079 --> 00:14:58.000 +click or link to a playlist on your favorite + +00:14:58.000 --> 00:15:00.639 +player, even EMMS if you want, and then + +00:15:00.639 --> 00:15:02.639 +packing up those albums in like a ZIP or + +00:15:02.639 --> 00:15:04.320 +.tar file. + +00:15:04.320 --> 00:15:08.639 +So you can go to churls.world . + +00:15:08.639 --> 00:15:10.880 +It just has a link to this album. I'll + +00:15:10.880 --> 00:15:14.000 +display it here in just a second. + +00:15:14.000 --> 00:15:17.519 +You can contact me. I'm shoshin on #emacs + +00:15:17.519 --> 00:15:21.040 +in IRC and on sourcehut. You can email me + +00:15:21.040 --> 00:15:23.680 +grant@churls.world, personal, or + +00:15:23.680 --> 00:15:26.800 +grant@unabridgedsoftware.com. All right, now. + +00:15:26.800 --> 00:15:32.079 +Let's see about this... + +00:15:32.079 --> 00:15:33.680 +This is up online, so if you want to + +00:15:33.680 --> 00:15:35.120 +listen to my + +00:15:35.120 --> 00:15:39.199 +college band's album from 20 years ago, + +00:15:39.199 --> 00:15:43.040 +here it is: Cassiopeia Basement Days. + +00:15:43.040 --> 00:15:47.680 +Whoops. I made this art in Krita. You can + +00:15:47.680 --> 00:15:51.199 +press play. You can skip around. + +00:15:51.199 --> 00:15:55.040 +I do have the playlist up here too. + +00:15:55.040 --> 00:15:58.560 +So yeah, thanks for listening. + +00:15:58.560 --> 00:16:00.880 +I hope you enjoyed it, and enjoy the rest + +00:16:00.880 --> 00:16:07.360 +of EmacsConf. Goodbye! -- cgit v1.2.3