<?xml version="1.0" encoding="utf-8"?><feed xmlns="http://www.w3.org/2005/Atom" ><generator uri="https://jekyllrb.com/" version="4.4.1">Jekyll</generator><link href="https://joelchrono.xyz/feeds/tutorial.xml" rel="self" type="application/atom+xml" /><link href="https://joelchrono.xyz/" rel="alternate" type="text/html" /><updated>2026-07-11T12:34:20-06:00</updated><id>https://joelchrono.xyz/feeds/tutorial.xml</id><title type="html">joelchrono’s blog</title><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><entry><title type="html">How to turn off Calibre AI features</title><link href="https://joelchrono.xyz/blog/disable-calibre-ai-features/" rel="alternate" type="text/html" title="How to turn off Calibre AI features" /><published>2026-03-27T16:37:45-06:00</published><updated>2026-03-27T16:37:45-06:00</updated><id>https://joelchrono.xyz/blog/disable-calibre-ai-features</id><content type="html" xml:base="https://joelchrono.xyz/blog/disable-calibre-ai-features/"><![CDATA[<p>A while back <a href="https://calibre-ebook.com">Calibre</a>—a book management program which I have been using for years—integrated <a href="https://calibre-ebook.com/whats-new#:~:text=Allow%20asking%20AI%20questions%20about%20any%20book%20in%20your%20calibre%20library">AI features</a>, in an option that showed up in the context menu, when selecting a book and clicking on <em>View</em>, titled <em>Discuss selected book with AI</em>. Clicking it opens a chat interface that connects to any “provider”—also known as <em>slop generator</em>—of your choice.</p>

<p>Of course, I see no use for such a useless feature, and if you don’t either, here’s how to hide it completely:</p>

<ul>
  <li>Go to <em>Preferences</em> &gt; <em>Plugins</em> &gt; <em>AI provider</em>, select each one and click on <strong>Enable/disable plugin</strong>.</li>
  <li>Go to <em>Preferences</em> &gt; <em>Tweaks</em>
    <ul>
      <li>Scroll all the way down until you see <em>Hide AI features</em> (You could also use the search bar for this)</li>
      <li>Go to the text editor box and set the variable to <code class="language-plaintext highlighter-rouge">True</code>.</li>
    </ul>
  </li>
  <li>Restart Calibre.</li>
</ul>

<p>All the references and buttons will be gone from Calibre’s interface, it’s a bit of a bummer that the plugins can’t be fully deleted, but hey, as they say, out of sight, out of mind.</p>

<p>Of course there are also some forks made due to this addition in the form of <a href="https://codeberg.org/rereading/arcalibre">Arcalibre</a>, as well as library management alternatives like <a href="https://github.com/mvanhorn/booklore/">Booklore</a>.</p>

<p>Personally, regular Calibre works fine and I don’t really feel the need to fully switch away from it. It has been a great project for years, and since most of the alternatives are rather young and have yet to prove themselves, I am inclined to just not bother, at least for now.</p>

<p>This is day 41 of <a href="https://100daystooffload.com">#100DaysToOffload</a></p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="tutorial" /><category term="reading" /><category term="tech" /><summary type="html"><![CDATA[I was not particularly bothered by these, but a friend was so I poked around and figured out how to hide all the AI stuff from Calibre.]]></summary></entry><entry><title type="html">Share this post to Mastodon</title><link href="https://joelchrono.xyz/blog/share-this-post-to-mastodon/" rel="alternate" type="text/html" title="Share this post to Mastodon" /><published>2026-03-04T20:22:22-06:00</published><updated>2026-03-04T20:22:22-06:00</updated><id>https://joelchrono.xyz/blog/share-this-post-to-mastodon</id><content type="html" xml:base="https://joelchrono.xyz/blog/share-this-post-to-mastodon/"><![CDATA[<p>The people at Mastodon recently released a <a href="https://blog.joinmastodon.org/2026/03/a-new-share-button/">share button for websites!</a> and I think it works rather well, as it remembers the instance you selected for the next time you use it somewhere else.</p>

<p>I added the following button to the bottom of my articles! I made use of Jekyll’s <a href="https://jekyllrb.com/docs/liquid/">Liquid syntax</a>.</p>

<div class="language-html highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nt">&lt;a</span> <span class="na">class=</span><span class="s">"button"</span> <span class="na">href=</span><span class="s">"https://share.joinmastodon.org/#text=Check%20this%20blogpost%20by%20%40joel%40fosstodon.org! https://joelchrono.xyz{{ page.url | uri_scape }}"</span> <span class="na">target=</span><span class="s">"_blank"</span> <span class="na">rel=</span><span class="s">"noopener"</span><span class="nt">&gt;</span>Share on Mastodon<span class="nt">&lt;/a&gt;</span>
</code></pre></div></div>

<p>You can find this line in use on my <code class="language-plaintext highlighter-rouge">_includes/comments.html</code> file—available on my <a href="https://github.com/joelchrono12/website/blob/main/_includes/comments.html">git repo</a>, where I also have my <a href="https://joelchrono.xyz/blog/how-to-add-mastodon-comments-to-jekyll-blog/">Mastodon-based comments section</a>, just in case you are also interested on getting those set up on your static website!</p>

<p>Thought I’d make a shorter post for once. Could it just be part of <a href="/tags/weeknotes/">my weeknotes?</a> maybe, but I write whatever I want on my website. I actually realized this thanks to a <a href="http://82mhz.net/posts/2026/03/website-update-links-page/">short update post</a>, not too different to this one, on Andreas’ website. Cool stuff!</p>

<p>Anyway, I should go back to playing CrossCode before the day is over, I have a bunny to catch.</p>

<p>This is day 28 of <a href="https://100daystooffload.com">#100DaysToOffload</a></p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="jekyll" /><category term="tutorial" /><category term="webdev" /><category term="short" /><summary type="html"><![CDATA[I added a share button for the people who read my stuff and share them! As well as some other small changes to my site]]></summary></entry><entry><title type="html">Rockbox for Innioasis Y1; or, a ramble on installing stuff</title><link href="https://joelchrono.xyz/blog/rockbox-innioasis-y1-install-stuff-ramble/" rel="alternate" type="text/html" title="Rockbox for Innioasis Y1; or, a ramble on installing stuff" /><published>2025-11-07T12:35:00-06:00</published><updated>2025-11-07T12:35:00-06:00</updated><id>https://joelchrono.xyz/blog/installing-rockbox</id><content type="html" xml:base="https://joelchrono.xyz/blog/rockbox-innioasis-y1-install-stuff-ramble/"><![CDATA[<p>I’m still playing around with the Innioasis Y1 music player, and I thought to installing <a href="https://rockbox.org">Rockbox</a> on it might be a worthy endeavour.</p>

<p>Rockbox is an alternative software that works on lots of music players, most commonly used with modded iPods. It fulfills a similar function to what <a href="https://koreader.rocks">KOReader</a> does for Kobo, Kindle and other e-readers. It’s free, more powerful, more compatible, and more customizable.</p>

<p><strong>This is not a tutorial</strong>—<a href="https://www.reddit.com/r/innioasis/s/5NdRE90y88">here’s a decent one from Reddit</a>—just some thoughts and observations about the whole thing thus far. Yes I am aware the <a href="/tags/tutorial/">tutorial</a> tag is there.</p>

<p>The community developed <a href="https://github.com/y1-community/Innioasis-Updater">Innioasis Updater</a>—a fork of the MTKclient for this specific device—which let’s you flash the official firmware, or Rockbox, or both at once!</p>

<p>One of the most interesting things to me when it comes to installing random programs like this is <strong>the barrier to entry</strong>. Specifically, how <strong>installations methods differ between operating systems</strong>.</p>

<p>I was reading some of the comments across a few reddit posts, from people who clearly come from Windows, saying things about <strong>drivers not working</strong>, or how some step went wrong or how themes don’t show up.</p>

<p>I must admit I chuckled a bit. The installation method for Linux is <strong>not officially supported</strong>, it basically consists in following the instructions from MTKclient’s repo: Install some dependencies, run a command or two, setup a python virtual environnment (or just run <code class="language-plaintext highlighter-rouge">pip</code> as is), then run  <code class="language-plaintext highlighter-rouge">python ./updater.py</code>, and you’re golden, the updater interface will show up and the process from there is self-explanatory.</p>

<p>I sometimes like to think Linux is usable for most people, but it’s weird at moments like this, because it kind of represents how many basic things I take for granted that a normal computer user might not—even worse when people barely know how their phone works nowadays.</p>

<p>A newcomer would not understand what the <code class="language-plaintext highlighter-rouge">venv</code> command does (to be fair, I don’t know either, but I get the idea), or why they can’t find the <code class="language-plaintext highlighter-rouge">.rockbox</code> folder in their file manager.</p>

<p>In a way, <strong>Linux encourages you to learn how a computer system works</strong>. I now know what packages are, I can uninstall or install them with a simple command, they will go to a certain location and can be called in a script and be depended upon by other programs. I also know hidden folders are a thing, and that most file managers on Linux display them with a simple <code class="language-plaintext highlighter-rouge">Ctrl + H</code> or a checkbox in a right-click menu (or just an <code class="language-plaintext highlighter-rouge">ls -a</code> in the terminal of course).</p>

<p>I’d say it was worth learning and doing that. Even if it is more complex at first, it’s better than dealing with <em>Next, Next, Next</em> install wizards and drivers that will do <em>who-knows-what</em> on <em>who-knows-where</em> in my computer. Those easy installers and countless drivers can end up being a pain. Same goes for trying to remember where the File Manager settings are, a panel (which looks straight out of 1998 as well) with a bunch of tabs and checkboxes to go through, all just to show hidden folders or file extensions.</p>

<p>And yet, that second option is what most people do and deal with.</p>

<p>What is easier then?</p>

<p>Obviously I am biased towards Linux. I guess I just like to bring suffering to myself or something.</p>

<p>Back in college I remember installing stuff like <em>LabVIEW</em>, <em>MATLAB</em> or <em>Code Composer</em>, it was absolute torture, so much so <strong>I chose to dual-boot for many years</strong> because of some of those programs—although I got some working on Linux at some point.</p>

<p>However, while the install on Windows was fine enough, they were also super bloated. <em>LabVIEW</em> would ask me to install some stuff from <em>National Instruments</em>, driver after package after plug-in. And I could not uninstall any of it from the control panel because they had to be removed from a package manager that got installed too.</p>

<p>When I eventually figured out <a href="/blog/installing-labview-in-linux-mint-20-3/">how to use LabVIEW from Linux</a>—a couple distro-hops later or so—I was happy that at least every single thing I installed was inside the <code class="language-plaintext highlighter-rouge">/opt</code> folder, and the script was a simple <code class="language-plaintext highlighter-rouge">uninstall.sh</code> that was very pleasant to run once the semester was over.</p>

<p>I guess that at this point I just prefer to maybe have a harder time, while also understanding what is going on behind the curtains.</p>

<p>Back to Rockbox, the install went well, although I’ve not been too happy with the 240p version, it is recommended because it has a lot of themes, but it is too blurry or pixelated for my liking. Besides, many themes are not looking right for some reason, gotta learn some more I guess.</p>

<p>I think I’ll install the 360p version instead, <a href="https://github.com/rockbox-y1/themes/">less themes</a> but at least they’re good ones, I want to try <a href="https://github.com/D0-0K/adwaitapod/">Adwaitapod</a>, which seems to work fine. It looks like <a href="https://82mhz.net">82Mhz</a> contributed to it back in the day? Cool stuff.</p>

<p>Anyway, installing stuff is more fun when you are actually able to learn and understand what’s going on and you can have a sense of control on everything. Wether you use Linux, Windows or Mac, you can still learn anyway. I’m only a bit annoyed at how much the younger generations are missing out in the current technological landscape.</p>

<p>Seriously, a lot of them don’t even know what adblocking is anymore, they are just accepting advertising as something normal, even as a feature, because “that way I don’t need to look up what to be interested about” or whatever.</p>

<p>I’m gonna end it here, because I can feel the rant incoming, but this is plenty enough for a day. The Innioasis Y1 is fun to thinker with! Next time I may end up doing some hardware mods to it for some reason. Whatever happens, it will.</p>

<figure class="img">
  <picture>
    <source srcset="/assets/img/blogs/2025-11-07-innioasisy1.webp" type="image/webp" />
    <source srcset="/assets/img/blogs/2025-11-07-innioasisy1.jpg" type="image/jpeg" />
    <img class="mx-auto" src="/assets/img/blogs/2025-11-07-innioasisy1.jpg" alt="My Innioasis Y1, teal colored, running Rockbox with the Satellite theme on it." />
  </picture>
  <figcaption class="caption">My Innioasis Y1, teal colored, running Rockbox with the Satellite theme on it.</figcaption></figure>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="tech" /><category term="ramble" /><category term="tutorial" /><summary type="html"><![CDATA[I flashed Rockbox on my music player but that made me deviate about how software is installed on computers and people today don't learn about these things anymore]]></summary><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://joelchrono.xyz/assets/img/blogs/2025-11-07-innioasisy1.jpg" /><media:content medium="image" url="https://joelchrono.xyz/assets/img/blogs/2025-11-07-innioasisy1.jpg" xmlns:media="http://search.yahoo.com/mrss/" /></entry><entry><title type="html">How to get into every hobby I like</title><link href="https://joelchrono.xyz/blog/how-to-get-into-every-hobby-i-like/" rel="alternate" type="text/html" title="How to get into every hobby I like" /><published>2025-08-15T19:12:44-06:00</published><updated>2025-08-15T19:12:44-06:00</updated><id>https://joelchrono.xyz/blog/how-to-get-into-every-hobby-i-like</id><content type="html" xml:base="https://joelchrono.xyz/blog/how-to-get-into-every-hobby-i-like/"><![CDATA[<p>Well, I do have quite <a href="/about/#hobbies--interests">a lot of hobbies</a>, and I probably could turn this into a proper series, if I had enough inspiration to do so. But well, instead of that, I will just share a couple things, be it links, books, videos or whatever, that might be a good place to get you started into whatever hobby I talk about. However, I’m kind of lazy right now, so don’t expect much. I will just share some general advice if you want to get into it, and I’ll let you look for more information by yourself.</p>

<ul>
  <li><strong>Card Magic</strong>: The most important thing here is to understand the reason behind why magicians do what they do. It’s not about fooling or being better than you.<sup id="fnref:1"><a href="#fn:1" class="footnote" rel="footnote" role="doc-noteref">1</a></sup> It’s about the art and amusement of both audience, and performer. With that in mind, learning the theory and techniques and performing well is one thing, and being the cool (or sometimes cringe) bigger cousin or uncle who can do card tricks to kids is the other. Both are perfectly respectable for me, as long as everyone has fun! To learn, I think books are the way to go, and this <a href="https://www.reddit.com/r/Magic/comments/ctdz2u/recommended_resources_for_beginners_in_card_magic">reddit thread</a> is a good resource.</li>
</ul>

<ul>
  <li>
    <p><strong>Reading</strong>: I kind of already wrote about <a href="/blog/the-way-i-read-books/">the way I read</a> so I guess you can check that if you want? Honestly, for this one there’s no such thing as an advice that fits for everyone. Even I am having mixed thoughts nowadays. Do I read on my Kobo to focus on reading? Do I read on my phone for easy access? Do I just have to sit down and read something and push through any external distractions by sheer will? Who knows, set a goal that you feel you can reach, and stick with it. Check <a href="https://standardebooks.org/">Standard Ebooks</a>.</p>
  </li>
  <li>
    <p><strong>Origami</strong>: For this one, simple. Learn the basics well, how to actually mark a fold properly, how to make a square from any kind of paper, and how to cut that square without scissors. Don’t worry about the quality of the paper, or anything like that. Watch tutorials from people who ask for permission to make them (origami is an art, and artists deserve credit), I recommend <a href="https://www.youtube.com/@jonakashima/">Jo Nakashima</a> or <a href="https://www.youtube.com/@jeremyshaferorigami/">Jeremy Shafer</a>. Learn the different types of folds, and how to read diagrams, I like <a href="https://www.pajarita.org/diagramas/">pajarita.org</a> (in Spanish) for some free ones. Check my <a href="/origami">origami</a> section.</p>
  </li>
  <li>
    <p><strong>Gaming</strong>: Huh, well, you already know how to do this one, right? That’s right, buy a <a href="/blog/miyoo-mini-plus-review/">Miyoo Mini Plus</a>.</p>
  </li>
  <li>
    <p><strong>Linux</strong>: Get a USB drive, follow one of the countless tutorials telling you how to install <a href="https://linuxmint.com/">Linux Mint</a> and you’ll be good. Feel free to reach out if you do!</p>
  </li>
  <li>
    <p><strong>Android Customization</strong>: Honestly getting into roms at this point doesn’t seem worth it but if you have a Pixel check <a href="https://grapheneos.social/">Graphene</a> or <a href="https://lineageos.org/">LineageOS</a>. If you only care about customizing your phone aesthetically, you should probably install a launcher such as <a href="https://lawnchair.app/downloads/">Lawnchair</a> or <a href="https://kisslauncher.com/">Kiss Launcher</a> and play around with it. And if you want pretty icons, check <a href="https://arcticons.com/">Arcticons</a> and <a href="https://github.com/Delta-Icons/android">Delta Icon Pack</a>.</p>
  </li>
  <li>
    <p><strong>Web development</strong>: I have to admit, I don’t really think myself as a web developer at all, I pretty much only know all I do because of Linux and because I maintain a static website. So, I guess the real advice here is to start your own personal website and figure things out as you go along!</p>
  </li>
  <li>
    <p><strong>Game Development</strong>: Well, this is a tricky one, because developing games involves not just programming, but graphic design, sound design, gameplay design and all of that. There are <a href="https://opengameart.org/">free resources</a> out there, tools to create <a href="https://www.bfxr.net/">sounds</a>, and other things. I recomment learning <a href="https://github.com/Delta-Icons/android">Godot Engine</a>, because it’s what I got started with. I had a lot of free time during the pandemic and participated in plenty of game jams, some good tutorials are on YouTube, I think <a href="https://www.youtube.com/watch?v=LOhfqjmasi0">this one</a> by Brackeys is nice.</p>
  </li>
  <li>
    <p><strong>Piano &amp; Guitar</strong>: Get someone in person to teach you honestly. I admit I am quite stagnant on these, I learned them years ago and still play them sometimes but I am no master at it and haven’t really sought to learn more.</p>
  </li>
  <li>
    <p><strong>Speedcubing</strong>: I think that <a href="https://www.youtube.com/watch?v=xGHo9XV2ytE">this video</a> by J Perm is really good to get started, as long as you already know how to solve a Rubik’s cube! If you don’t, this <a href="https://www.youtube.com/watch?v=7Ron6MN45LY">other video</a> will do. Learn fingertricks and proper movements and you should be good. Practice constantly but avoid burning out, don’t expect immediate results. Try to get other friends into it and evolve together!</p>
  </li>
</ul>

<p>Honestly, I love when people want to get into a hobby I like, so feel free to reach out if you have any interest on them, wether you already do them or want to get started. I really enjoy talking about them.</p>

<p>At first, this post was supposed to be a “I don’t know what to write about today, I’ll just share some of the ideas I had”, and the first one was this one, but I expected to take a lot of time looking things ups and finding resources online. In the end this idea was long enough to just be this separate post, and well, here we are.</p>

<p>I do have a couple of hobbys that weren’t listed in my About page and that I have learned more recently, like pixel art, graphic design and yoyoing, so I might write about those later. For now, have a good day!</p>
<div class="footnotes" role="doc-endnotes">
  <ol>
    <li id="fn:1">
      <p>If you met one of those, I am so, so sorry. Please watch <a href="https://www.youtube.com/watch?v=5_KcQt0z-eE">this video to know what a real card magic performance</a> is supposed to  look like. <a href="#fnref:1" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
    </li>
  </ol>
</div>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="tutorial" /><category term="thoughts" /><summary type="html"><![CDATA[This started as something else but ended up being a bit of a guide to get started into my hobbies]]></summary></entry><entry><title type="html">Using FreshRSS User Queries to keep up with your websites!</title><link href="https://joelchrono.xyz/blog/using-freshrss-user-queries/" rel="alternate" type="text/html" title="Using FreshRSS User Queries to keep up with your websites!" /><published>2025-07-30T08:10:00-06:00</published><updated>2025-07-30T08:10:00-06:00</updated><id>https://joelchrono.xyz/blog/freshrss-user-queries</id><content type="html" xml:base="https://joelchrono.xyz/blog/using-freshrss-user-queries/"><![CDATA[<p>I love using RSS to keep up with the bloggers out there! and I follow a lot of writers that share stuff in their websites quite regularly, but sometimes it can be a bit of a pain.</p>

<p>This is the case with Week Notes. I love them! And I follow a lot of people writing them consistently, some just call them “Week Notes”, some go for “Weekly Rewind” and I’m sure there are some people out there doing their own thing, such as how I recently went for titling them differently and just adding the week number at the end.</p>

<p>The point is, it’s a bit of a struggle to get them all in one single place!</p>

<p>Here is where <a href="https://freshrss.org">FreshRSS</a> comes to the rescue once again.</p>

<p>I have used and written about many of its features before, such as <a href="/blog/word-filters">word filters</a> and <a href="/blog/newsboat-queries-and-freshrss-scraping">website scraping</a>, and even after all this time, it still manages to surprise me whenever I dive into its feature set once more.</p>

<p>User Queries are like word filters, but in the opposite direction. It is basically a bookmarked search term, that you can easily access in the web interface with a couple of clicks.</p>

<p>Unfortunately, I don’t think there’s any 3rd party client that can use this feature, but given that 99% of my usage is actually done on a computer, I can’t really complain. Besides, Newsboat which is the terminal client I use on Linux, can probably replicate this, and if I ever get around to set that up, I’ll update this post.</p>

<p>To create a query in FreshRSS web frontend, you just need to click the bookmark 🔖 icon in the top row of the main UI, and click on “Bookmark Current Query”, this will take you to the User Queries settings page, where you can click the cogwheel to customize the behavior. Give it a name, description, image, share the query as an RSS feed or OPML. And of course actually define the query itself.</p>

<p>For my usecase, I started with this query:</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>intitle:week intitle:note
</code></pre></div></div>

<p>The usage of search parameters is explained on <a href="https://freshrss.github.io/FreshRSS/en/users/10_filter.html#with-the-search-field">FreshRSS’ Documentation</a>, but in short, having parameters separated by a space is basically an AND operation between them, you can also exclude keywords and even regular expressions with <code class="language-plaintext highlighter-rouge">-</code> or <code class="language-plaintext highlighter-rouge">!</code>.</p>

<p>After messing around for a bit more, I ended up with the following query:</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>(author:gobino intitle:"weekly rewind") OR (intitle:week intitle:note) OR (intitle:"- W" author:joel)
</code></pre></div></div>

<p>Which takes into account the format preferred by <a href="https://gobino.be">Steven</a> and my own updated weeknote format where I use different titles but they all end with the week number (such as “W30”).</p>

<p>I have one or two queries for Monthly Summaries and also Link Blogs, so please let me know if you find other interesting ways to take advantage of them! Or if you don’t use FreshRSS, do you have a different solution for this problem?</p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="rss" /><category term="tutorial" /><category term="software" /><summary type="html"><![CDATA[FreshRSS is still my choice for a selfhosted RSS Reader solution. And User Queries, which have existed for a while, are yet another reason why!]]></summary></entry><entry><title type="html">How to make simple collage images</title><link href="https://joelchrono.xyz/blog/how-to-create-simple-collage-images/" rel="alternate" type="text/html" title="How to make simple collage images" /><published>2025-06-01T17:16:17-06:00</published><updated>2025-06-01T17:16:17-06:00</updated><id>https://joelchrono.xyz/blog/how-to-create-simple-collage-images</id><content type="html" xml:base="https://joelchrono.xyz/blog/how-to-create-simple-collage-images/"><![CDATA[<p>This really is a pretty simple problem, but I may as well share this finding here, if only for me to remember later on.</p>

<p>Months ago I discovered <a href="https://joshdl.substack.com">Joshua’s website</a>, and reading one of his <a href="https://joshdl.substack.com/p/media-consumption-round-up-apr-25">media round ups</a>, I noticed, and really liked his little banner images, featuring a glimpse of whatever show or videogame he writes about.</p>

<p>I thought this was a fantastic idea, that I wanted to implement on my own website as well.</p>

<p>I decided to try it out for a few big blogposts early in the year, such as my yearly recap for <a href="/blog/anime-recap-2024/">anime</a> and my post about <a href="/blog/games-due-for-a-replay/">games I wish to replay soon</a>. I thought that the style was just awesome. As in Josh’s own words, it’s a neat way to add photos whilst not making the page too long.</p>

<p>So, for those blog posts I mentioned, I just used <a href="https://gimp.org">GIMP</a> and downloaded some cool images from around the web. Finding wide banner style pictures can be a little hard, but it doesn’t have to be perfect anyway.</p>

<p>In case you are curious, I found the banners I did by looking them up in <a href="https://backloggd.com">Backloggd</a> and <a href="https://anilist.co">Anilist</a> respectively, since banners like those are already part of their own web design.</p>

<p>However, if I wanted to create a banner out of multiple images, I had to resize them, place them and try to fit everything nicely, and it was a bit tedious to do, so I wondered if there was some tool to generate a collage quickly and simply.</p>

<p>Sure, there are websites and online tools, but they are ridden with ads and I didn’t really felt like using them.</p>

<p>After a quick search, I found something, and used it on <a href="/blog/may-2025-summary/">my latest monthly summary!</a></p>

<p>The tool in question has a pretty obvious name:</p>

<h2 id="photocollage"><a href="https://github.com/adrienverge/PhotoCollage">PhotoCollage</a></h2>

<figure class="img">
  <picture>
    <source srcset="/assets/img/blogs/2025-06-01-photocollages-interface.webp" type="image/webp" />
    <source srcset="/assets/img/blogs/2025-06-01-photocollages-interface.png" type="image/png" />
    <img class="mx-auto" src="/assets/img/blogs/2025-06-01-photocollages-interface.png" alt="PhotoCollage's interface" />
  </picture>
  <figcaption class="caption">PhotoCollage's interface</figcaption></figure>

<p>I installed this from the AUR pretty quickly using:</p>

<div class="language-sh highlighter-rouge"><div class="highlight"><pre class="highlight"><code>yay <span class="nt">-S</span> photocollage
</code></pre></div></div>

<p>This is an extremely simple tool that will allow you to make a selection of as many images as you wish, and generate a simple collage out of it. You get a couple of options, like picture resolution and border thickness, which you can set as desired.</p>

<p>You have a couple of buttons to regenerate the collage, which will alter the positioning and style at random.</p>

<p>You can also drag pictures around between each tile, as well as alter their placement within the tile, in case it’s cropped weirdly.</p>

<p>Finally, you can save the image whenever you want, it will automatically convert them to whatever file extension you save it as. I tried png, jpg and webp without issues.</p>

<p>There’s not much else to it, to be honest, but I thought it was worth sharing!</p>

<p>When it comes to a <strong>quick way to add images to your Jekyll blog</strong>, feel free to check out <a href="/blog/add-images-to-markdown-files-(for-jekyll)">this blogpost</a>.</p>

<p>This is day 76 of <a href="https://100daystooffload.com">#100DaysToOffload</a></p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="foss" /><category term="webdev" /><category term="blog" /><category term="tutorial" /><summary type="html"><![CDATA[I found a simple program to generate collages and use them as banners for my blog posts!]]></summary><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://joelchrono.xyz/assets/img/blogs/2025-06-01-photocollages-interface.webp" /><media:content medium="image" url="https://joelchrono.xyz/assets/img/blogs/2025-06-01-photocollages-interface.webp" xmlns:media="http://search.yahoo.com/mrss/" /></entry><entry><title type="html">Progress bars for my Booklog!</title><link href="https://joelchrono.xyz/blog/progress-bars-for-my-booklog/" rel="alternate" type="text/html" title="Progress bars for my Booklog!" /><published>2024-09-28T21:56:08-06:00</published><updated>2024-09-28T21:56:08-06:00</updated><id>https://joelchrono.xyz/blog/progress-bars-for-my-booklog</id><content type="html" xml:base="https://joelchrono.xyz/blog/progress-bars-for-my-booklog/"><![CDATA[<p>For some reason, I didn’t know how to make progress bars in HTML!</p>

<p>Turns out it’s very simple, just use the <code class="language-plaintext highlighter-rouge">&lt;progress&gt;</code> element! Pretty well documented on the <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/progress">MDN web docs</a> to be honest.</p>

<p>Simply by using something like the following:</p>

<div class="language-html highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nt">&lt;label</span> <span class="na">for=</span><span class="s">"progress"</span><span class="nt">&gt;</span>Progress:<span class="nt">&lt;/label&gt;</span>
<span class="nt">&lt;progress</span> <span class="na">id=</span><span class="s">"progress"</span> <span class="na">max=</span><span class="s">"100"</span> <span class="na">value=</span><span class="s">"70"</span><span class="nt">&gt;</span>70%<span class="nt">&lt;/progress&gt;</span>
</code></pre></div></div>

<p>We get something like this!</p>

<p><label for="progress">Progress:</label></p>
<progress id="progress" max="100" value="70">70%</progress>

<p>So, in order to add that <a href="/booklog">to my booklog</a>, I simply had to add a <code class="language-plaintext highlighter-rouge">progress</code> variable to the YAML file I use on <code class="language-plaintext highlighter-rouge">_data/books.yml</code> like so:</p>

<div class="language-yaml highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="pi">-</span> <span class="na">title</span><span class="pi">:</span> <span class="s2">"</span><span class="s">Leviathan</span><span class="nv"> </span><span class="s">Wakes"</span>
  <span class="na">author</span><span class="pi">:</span> <span class="s2">"</span><span class="s">James</span><span class="nv"> </span><span class="s">S.A.</span><span class="nv"> </span><span class="s">Corey"</span>
  <span class="na">cover</span><span class="pi">:</span> <span class="s2">"</span><span class="s">/assets/img/books/leviathan-wakes.jpg"</span>
  <span class="na">start</span><span class="pi">:</span> <span class="s2">"</span><span class="s">2024-09-19"</span>
  <span class="na">end</span><span class="pi">:</span> <span class="s2">"</span><span class="s">In</span><span class="nv"> </span><span class="s">progress"</span>
  <span class="na">progress</span><span class="pi">:</span> <span class="m">16</span>
</code></pre></div></div>

<p>And of course, style the bar, which was a bit of a pain at least for the filled portion of it.</p>

<div class="language-css highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nt">progress</span><span class="nd">::-moz-progress-bar</span> <span class="p">{</span> <span class="nl">background</span><span class="p">:</span> <span class="nf">var</span><span class="p">(</span><span class="l">--border</span><span class="p">);</span> <span class="p">}</span>
<span class="nt">progress</span><span class="nd">::-webkit-progress-value</span> <span class="p">{</span> <span class="nl">background</span><span class="p">:</span> <span class="nf">var</span><span class="p">(</span><span class="l">--border</span><span class="p">);</span> <span class="p">}</span>
<span class="nt">progress</span> <span class="p">{</span>
    <span class="nl">color</span><span class="p">:</span> <span class="nf">var</span><span class="p">(</span><span class="l">--border</span><span class="p">);</span>
    <span class="nl">height</span><span class="p">:</span> <span class="m">12px</span><span class="p">;</span>
    <span class="nl">width</span><span class="p">:</span> <span class="m">80%</span><span class="p">;</span>
    <span class="nl">border</span><span class="p">:</span> <span class="m">0px</span><span class="p">;</span>
    <span class="nl">background-color</span><span class="p">:</span> <span class="nf">var</span><span class="p">(</span><span class="l">--bg</span><span class="p">);</span>
    <span class="nl">border-radius</span><span class="p">:</span> <span class="m">8px</span><span class="p">;</span>
<span class="p">}</span>
</code></pre></div></div>

<p>And in the end, we end up with something like this!</p>

<style>
progress.css::-moz-progress-bar { background: var(--border); }
progress.css::-webkit-progress-value { background: var(--border); }
progress.css {
    color: var(--border);
    height: 12px;
    width: 80%;
    border: solid 2px var(--border);
    background-color: var(--accent-bg);
}
</style>

<p><label class="css" for="book-progress">Book Progress:</label></p>
<progress class="css" id="book-progress" max="100" value="70">70%</progress>

<p>Here’s the complete liquid syntax for my booklog section! The complete file including the CSS styling can be found <a href="https://github.com/joelchrono12/joelchrono12.ml/blob/main/booklog.md">on my GitHub repo</a>.</p>

<div class="language-html highlighter-rouge"><div class="highlight"><pre class="highlight"><code>{% if site.data.books %}
  {% assign books_by_year = site.data.books | sort: 'end' | group_by_exp: "item", "item.end | date: '%Y'" %}
  {% for year_group in books_by_year reversed %}
  <span class="nt">&lt;h3&gt;</span>{{ year_group.name }}<span class="nt">&lt;/h3&gt;</span>
  <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"responsive-grid"</span><span class="nt">&gt;</span>
  {% for item in year_group.items reversed %}
  <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"book-cover-container"</span><span class="nt">&gt;</span>
  <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"book-cover"</span><span class="nt">&gt;</span>
  <span class="nt">&lt;img</span> <span class="na">class=</span><span class="s">"book-cover"</span> <span class="na">src=</span><span class="s">"{{ item.cover }}"</span><span class="nt">&gt;</span>
  <span class="nt">&lt;/div&gt;</span>
  <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">&gt;</span>
      <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"info"</span><span class="nt">&gt;</span>
      <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">&gt;&lt;i&gt;</span>{{ item.title }}<span class="nt">&lt;/i&gt;&lt;/div&gt;</span>
      <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"artist"</span><span class="nt">&gt;</span>by {{ item.author }}<span class="nt">&lt;/div&gt;</span>
      <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"dates"</span><span class="nt">&gt;</span>Started: {{ item.start }}<span class="nt">&lt;/div&gt;</span>
      {% if item.progress <span class="nt">&lt;</span> <span class="err">100</span> <span class="err">%}</span>
      <span class="err">&lt;</span><span class="na">div</span> <span class="na">class=</span><span class="s">"dates"</span><span class="nt">&gt;</span>
      <span class="nt">&lt;label</span> <span class="na">for=</span><span class="s">"file"</span><span class="nt">&gt;</span>Progress: {{ item.progress }}%<span class="nt">&lt;/label&gt;</span>
      <span class="nt">&lt;progress</span> <span class="na">id=</span><span class="s">"file"</span> <span class="na">value=</span><span class="s">"{{ item.progress }}"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">&gt;</span>{{ item.progress }}%<span class="nt">&lt;/progress&gt;</span>
      <span class="nt">&lt;/div&gt;</span>
      {% else %}
      <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"dates"</span><span class="nt">&gt;</span>Finished: {{ item.end }}<span class="nt">&lt;/div&gt;</span>
      {% endif %}
      <span class="nt">&lt;/div&gt;</span>
      <span class="nt">&lt;/div&gt;</span>
      <span class="nt">&lt;/div&gt;</span>
          {% endfor %}
  <span class="nt">&lt;/div&gt;</span>
  {% endfor %}
{% endif %}
</code></pre></div></div>

<p>Once again, you can see the whole thing in action on <a href="/booklog">my booklog</a>. Now I just have to remember to update it often!</p>

<p>This is day 76 of <a href="https://100daystooffload.com">#100DaysToOffload</a></p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="jekyll" /><category term="webdev" /><category term="tutorial" /><category term="design" /><summary type="html"><![CDATA[Just a small change that I wanted to make to my booklog section on my website to keep track of my reading progress!]]></summary></entry><entry><title type="html">Transferring PSP PS1 save files to Miyoo Mini Plus</title><link href="https://joelchrono.xyz/blog/transferring-psp-ps1-savefiles-to-miyoo-mini-plus/" rel="alternate" type="text/html" title="Transferring PSP PS1 save files to Miyoo Mini Plus" /><published>2024-05-12T23:13:11-06:00</published><updated>2024-05-12T23:13:11-06:00</updated><id>https://joelchrono.xyz/blog/converting-savefile-format-on-ps1-games-from--vmp-to--mri</id><content type="html" xml:base="https://joelchrono.xyz/blog/transferring-psp-ps1-savefiles-to-miyoo-mini-plus/"><![CDATA[<p>Once again I’m here writing some quick notes on the adventures I had today setting up my Miyoo Mini Plus.</p>

<p>I had a few PS1 games on EBOOT.PBP format on my PSP, which have worked quite well so far, but the savefile format only works on the PSP itself and nothing more.</p>

<p>Since my move to the Miyoo Mini Plus, and me deciding to switch my PS1 gaming to it from the time being, I had to figure out how to transfer those savefiles over.</p>

<p>First off: figuring out which savefile is which.</p>

<p>The easiest way to know what save corresponds to what game is to open the game in you PSP, save, exit and then connect the device to a computer and sort by date.</p>

<p>The next best way is to look for your game in the <a href="https://psxdatacenter.com/ntsc-u_list.html">PSX Data Center</a> using Ctrl+F (there are lists for games in PAL and Japanese regions which can be seen there as well) and then finding the corresponding code.</p>

<p>The PSP has its savefiles located in the path <code class="language-plaintext highlighter-rouge">PSP/SAVEDATA/</code> and it probably contains a bunch of folders with titles like this <code class="language-plaintext highlighter-rouge">SLES01734</code> or <code class="language-plaintext highlighter-rouge">SLUS00585</code>, the file that has a matching code will be the one.</p>

<p>Opening the folder you will find a PNG file, usually of the game cover art, which will confirm it is the game we want.</p>

<p>Finally, you can use the online website <a href="https://savefileconverter.com/#/ps1/psp">Save File Converter</a> to convert your saves from the PSP’s <code class="language-plaintext highlighter-rouge">.VMP</code> to proper PS1 save files in the <code class="language-plaintext highlighter-rouge">.mcr</code> format.</p>

<p>Note that The Miyoo Mini Plus will <strong>not recognize this filename extension</strong>, however it is as simple as <strong>renaming</strong> the filename extension to <code class="language-plaintext highlighter-rouge">.srm</code> instead.</p>

<p>Now, the format of the ROM file itself is a different story.</p>

<p>PSP runs <code class="language-plaintext highlighter-rouge">EBOOT.PBP</code> files, you can use these files in the Miyoo Mini Plus, just copy paste it to the proper location and change the name to <code class="language-plaintext highlighter-rouge">Game_Name.pbp</code>. Note that if the file comes with some <code class="language-plaintext highlighter-rouge">KEYS.BIN</code> and other extra files, it will probably not work in the MM+, but I haven’t looked into how to fix that.</p>

<p>The Miyoo Mini Plus supports <code class="language-plaintext highlighter-rouge">.chd</code> and the regular <code class="language-plaintext highlighter-rouge">.cue</code> and <code class="language-plaintext highlighter-rouge">.bin</code> roms. The <code class="language-plaintext highlighter-rouge">.chd</code> format is the smallest in size and the compression is lossless, so I see no reason not to use it. The easiest way would be to source it directly in that file format, but you can also convert <code class="language-plaintext highlighter-rouge">.cue/.bin</code> files by using the <code class="language-plaintext highlighter-rouge">chdman</code> command line tool. This is located in the <code class="language-plaintext highlighter-rouge">mame</code> package in Void Linux, it is a standalone program in Arch as well.</p>

<p>Run this command and you are good to go:</p>

<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code>chdman createcd <span class="nt">-i</span> <span class="s2">"Resident Evil 3 - Nemesis (USA).cue"</span>  <span class="nt">-o</span> <span class="s2">"Resident Evil 3 - Nemesis (USA).chd"</span>
</code></pre></div></div>

<p>If you install <code class="language-plaintext highlighter-rouge">parallel</code> you can do batch conversion of files, with this line:</p>

<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code>parallel chdman createcd <span class="nt">-i</span> <span class="o">{}</span> <span class="nt">-o</span> <span class="o">{</span>.<span class="o">}</span>.chd ::: <span class="k">*</span>.cue
</code></pre></div></div>

<p>Which will convert all the <code class="language-plaintext highlighter-rouge">.cue</code>files in the working directory to <code class="language-plaintext highlighter-rouge">.chd</code>.</p>

<p>Feel free to check the official documentation for more information about <a href="https://onionui.github.io/docs/emulators/psx">running PS1 games on Onion OS</a>.</p>

<p>This is day 44 of <a href="daystooffload.com/">#100DaysToOffload</a> and post 12 of <a href="https://weblog.anniegreens.lol/weblog-posting-month-2024">#WeblogPoMo2024</a></p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="emulation" /><category term="psp" /><category term="gaming" /><category term="tutorial" /><category term="linux" /><summary type="html"><![CDATA[How to turn the PS1 savefiles of games played on PSP, to a regular savefile usable in PS1 emulators and retro emulation devices like the Miyoo Mini Plus]]></summary></entry><entry><title type="html">Fix Activity Tracker duplicates in Miyoo Mini Plus (Onion OS)</title><link href="https://joelchrono.xyz/blog/fix-activity-tracker-duplicates-miyoo-mini-plus/" rel="alternate" type="text/html" title="Fix Activity Tracker duplicates in Miyoo Mini Plus (Onion OS)" /><published>2024-05-11T09:29:35-06:00</published><updated>2024-05-11T09:29:35-06:00</updated><id>https://joelchrono.xyz/blog/fix-activity-tracker-duplicates-miyoo-mini-plus</id><content type="html" xml:base="https://joelchrono.xyz/blog/fix-activity-tracker-duplicates-miyoo-mini-plus/"><![CDATA[<p>I have been having fun with my Miyoo Mini Plus, and after installing Onion OS on it, I found its Activity Tracker app to be one of my favorites. However, I ran into an annoying problem since I got some duplicated entries, after I changed the ROM filename, or after I replaced the ROM with a patched one.</p>

<figure class="img">
  <picture>
    <source srcset="/assets/img/blogs/2024-05-11-onion-os-activity-tracker-app.webp" type="image/webp" />
    <source srcset="/assets/img/blogs/2024-05-11-onion-os-activity-tracker-app.png" type="image/png" />
    <img class="mx-auto" src="/assets/img/blogs/2024-05-11-onion-os-activity-tracker-app.png" alt="The Activity Tracker app in Onion OS is great! But the duplicate entries..." />
  </picture>
  <figcaption class="caption">The Activity Tracker app in Onion OS is great! But the duplicate entries...</figcaption></figure>

<p>The easiest way to fix this is to rename the ROM to the what it was before.<sup id="fnref:1"><a href="#fn:1" class="footnote" rel="footnote" role="doc-noteref">1</a></sup></p>

<p>This fixes the problem from there on? But what about the duplicated entries that are already saved?</p>

<p>Well, this will be easier if you have some basic knowledge of how a database or a spreasheet works, it is not very hard, but still a bit scary.</p>

<p>The Activity Tracker data is stored in the path <code class="language-plaintext highlighter-rouge">/Saves/CurrentProfile/play_activity/play_activity_db.sqlite</code>, it should be the only file in the folder. <strong>Make a copy of the file and put it somewhere safe.</strong></p>

<p>I will use <a href="https://sqlitebrowser.org/">DB Browser for SQLite</a>, a cross-platform program that will let you access the database and edit it, just drag and drop it there, pretty much.</p>

<figure class="img">
  <picture>
    <source srcset="/assets/img/blogs/2024-05-11-this-is-what-the-program-looks-like-after-opening-the-database.webp" type="image/webp" />
    <source srcset="/assets/img/blogs/2024-05-11-this-is-what-the-program-looks-like-after-opening-the-database.png" type="image/png" />
    <img class="mx-auto" src="/assets/img/blogs/2024-05-11-this-is-what-the-program-looks-like-after-opening-the-database.png" alt="This is what the program looks like after opening the database" />
  </picture>
  <figcaption class="caption">This is what the program looks like after opening the database</figcaption></figure>

<p>Go to the <em>Browse Data</em> tab, and in the Table picker you will find two tables to choose from. In the <code class="language-plaintext highlighter-rouge">rom</code> table, you will find a list of ROMS, make sure to check for any duplicated names, and note the <code class="language-plaintext highlighter-rouge">id</code> of them, you should choose on of them to keep.</p>

<figure class="img">
  <picture>
    <source srcset="/assets/img/blogs/2024-05-11-the-table-contents.webp" type="image/webp" />
    <source srcset="/assets/img/blogs/2024-05-11-the-table-contents.png" type="image/png" />
    <img class="mx-auto" src="/assets/img/blogs/2024-05-11-the-table-contents.png" alt="The table contents" />
  </picture>
  <figcaption class="caption">The table contents</figcaption></figure>

<p>For this example, let’s note the Chrono Trigger duplicated entries, with the values <code class="language-plaintext highlighter-rouge">16</code> and <code class="language-plaintext highlighter-rouge">17</code>, you could delete one of them, it is not really necessary, but if you want to tidy up the database, I guess you can do it.</p>

<p>Go to the other table, named <code class="language-plaintext highlighter-rouge">play_activity</code>, the information found here can be a little bit harder to parse, but it’s not that big of a deal.</p>

<figure class="img">
  <picture>
    <source srcset="/assets/img/blogs/2024-05-11-play_activity-table-with-a-filter-enabled.webp" type="image/webp" />
    <source srcset="/assets/img/blogs/2024-05-11-play_activity-table-with-a-filter-enabled.png" type="image/png" />
    <img class="mx-auto" src="/assets/img/blogs/2024-05-11-play_activity-table-with-a-filter-enabled.png" alt="play_activity table with a filter enabled" />
  </picture>
  <figcaption class="caption">play_activity table with a filter enabled</figcaption></figure>

<p>All you need to do, is use the filter in the <code class="language-plaintext highlighter-rouge">rom_id</code> column to find the id’s you want to change, and then edit each individual entry, just click on the cell, type the value you want and hit Enter. You could also execute some simple SQL to accelerate the process:</p>

<div class="language-sql highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="k">UPDATE</span> <span class="n">play_activity</span> <span class="c1">---the table name</span>
<span class="k">SET</span> <span class="n">rom_id</span> <span class="o">=</span> <span class="n">chosen_value</span> <span class="c1">---whatever id value you chose</span>
<span class="k">WHERE</span> <span class="n">rom_id</span> <span class="o">=</span> <span class="n">old_value</span><span class="p">;</span> <span class="c1">---the id value that will be replaced</span>
</code></pre></div></div>

<p>After that, all the entries will be unified to a single <code class="language-plaintext highlighter-rouge">rom_id</code>. Once you are done, remember to click the <em>Write Changes</em> button.</p>

<p>You can load up your SD card and you should see all your play time unified on a single entry! If game art is missing, or game names are incorrect, you can use this same method to edit the <code class="language-plaintext highlighter-rouge">rom</code> table as well, but editing file names might be easier for that.</p>

<p>So, I think this is pretty much it, I don’t write as many tutorials since most of the time there are better ones out there and I would rather link to those, but I could not find any guidance on this problem, and I decided to write my own. I hope it is useful for you!</p>

<p>This is day 43 of <a href="https://100daystooffload.com">#100DaysToOffload</a> and post 11 of <a href="https://weblog.anniegreens.lol/weblog-posting-month-2024">#WeblogPoMo2024</a>.</p>
<div class="footnotes" role="doc-endnotes">
  <ol>
    <li id="fn:1">
      <p>You should also change the filename of the savestates, and the save file itself, and the game cover if there is any. Quite a chore, maybe I’ll make some script for that one day. <a href="#fnref:1" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
    </li>
  </ol>
</div>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="tutorial" /><category term="emulation" /><category term="software" /><category term="linux" /><summary type="html"><![CDATA[So if you ever edit the name of your ROM files you might run into some problems in your Miyoo Mini's Activity Tracker App, here's how I fixed it!]]></summary><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://joelchrono.xyz/assets/img/blogs/2024-05-11-onion-os-activity-tracker-app.png" /><media:content medium="image" url="https://joelchrono.xyz/assets/img/blogs/2024-05-11-onion-os-activity-tracker-app.png" xmlns:media="http://search.yahoo.com/mrss/" /></entry><entry><title type="html">FreshRSS and Nextcloud broke</title><link href="https://joelchrono.xyz/blog/freshrss-and-nextcloud-broke/" rel="alternate" type="text/html" title="FreshRSS and Nextcloud broke" /><published>2023-01-31T14:00:00-06:00</published><updated>2023-01-31T14:00:00-06:00</updated><id>https://joelchrono.xyz/blog/breaking-my-selhosted-services</id><content type="html" xml:base="https://joelchrono.xyz/blog/freshrss-and-nextcloud-broke/"><![CDATA[<p>As my rabbithole on RSS kept going down. I eventually decided to go and import even more feeds to my FreshRSS instance, because sometimes you just feel like the web is terrible and decide run away from it as much as you can, util it is too much of a hassle and the balance returns.</p>

<h1 id="how-i-broke-freshrss">How I broke FreshRSS</h1>

<p>So, I decided to import my Youtube subscriptions, the way I did it was kinda neat. I had found this javascript bookmark that may be better for you, since its <em>just a bit</em> faster than using Google Takeout just for subscriptions.</p>

<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nx">javascript</span><span class="p">:</span><span class="k">if</span><span class="p">(</span><span class="dl">"</span><span class="s2">https://www.youtube.com/feed/channels</span><span class="dl">"</span><span class="o">==</span><span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">.</span><span class="nx">href</span><span class="p">){</span><span class="kd">let</span> <span class="nx">e</span><span class="o">=</span><span class="p">[...</span><span class="nb">document</span><span class="p">.</span><span class="nf">querySelectorAll</span><span class="p">(</span><span class="dl">"</span><span class="s2">#main-link.channel-link</span><span class="dl">"</span><span class="p">)].</span><span class="nf">map</span><span class="p">(</span><span class="nx">e</span><span class="o">=&gt;</span><span class="p">{</span><span class="kd">const</span><span class="p">[,</span><span class="nx">t</span><span class="p">,</span><span class="nx">n</span><span class="p">]</span><span class="o">=</span><span class="nx">e</span><span class="p">.</span><span class="nx">href</span><span class="p">.</span><span class="nf">match</span><span class="p">(</span><span class="dl">"</span><span class="s2">/((?:user)|(?:channel))/(.*)$</span><span class="dl">"</span><span class="p">);</span><span class="k">return</span><span class="dl">"</span><span class="s2">https://www.youtube.com/feeds/videos.xml?</span><span class="dl">"</span><span class="o">+</span><span class="p">(</span><span class="dl">"</span><span class="s2">user</span><span class="dl">"</span><span class="o">===</span><span class="nx">t</span><span class="p">?</span><span class="dl">"</span><span class="s2">user=</span><span class="dl">"</span><span class="p">:</span><span class="dl">"</span><span class="s2">channel_id=</span><span class="dl">"</span><span class="p">)</span><span class="o">+</span><span class="nx">n</span><span class="p">}).</span><span class="nf">join</span><span class="p">(</span><span class="dl">"</span><span class="se">\n</span><span class="dl">"</span><span class="p">);</span><span class="nx">e</span><span class="p">?</span><span class="nb">navigator</span><span class="p">.</span><span class="nx">clipboard</span><span class="p">.</span><span class="nf">writeText</span><span class="p">(</span><span class="nx">e</span><span class="p">).</span><span class="nf">then</span><span class="p">(()</span><span class="o">=&gt;</span><span class="nf">alert</span><span class="p">(</span><span class="dl">"</span><span class="s2">A%20list%20of%20channel%20RSS%20feeds%20has%20been%20copied%20to%20the%20clipboard.%20</span><span class="se">\n</span><span class="s2">Paste%20these%20into%20rssmix.com%20to%20generate%20a%20single%20RSS%20feed,%20or%20opml-gen.ovh%20to%20generate%20an%20OPML%20file.</span><span class="dl">"</span><span class="p">)).</span><span class="k">catch</span><span class="p">(()</span><span class="o">=&gt;</span><span class="p">{</span><span class="nx">console</span><span class="p">.</span><span class="nf">log</span><span class="p">(</span><span class="nx">e</span><span class="p">),</span><span class="nf">alert</span><span class="p">(</span><span class="dl">"</span><span class="s2">A%20list%20of%20channel%20RSS%20feeds%20has%20logged%20to%20the%20console.%20(Unable%20to%20copy%20to%20clipboard)%20</span><span class="se">\n</span><span class="s2">Paste%20these%20into%20rssmix.com%20to%20generate%20a%20single%20RSS%20feed,%20or%20opml-gen.ovh%20to%20generate%20an%20OPML%20file.</span><span class="dl">"</span><span class="p">)}):</span><span class="nf">alert</span><span class="p">(</span><span class="dl">"</span><span class="s2">Couldn't%20find%20any%20subscriptions</span><span class="dl">"</span><span class="p">)}</span><span class="k">else</span><span class="o">%</span><span class="mi">20</span><span class="nf">alert</span><span class="p">(</span><span class="dl">'</span><span class="s1">Please%20run%20at%20"https://www.youtube.com/feed/channels"</span><span class="dl">'</span><span class="p">);</span>
</code></pre></div></div>

<p>All you need to do to make it work is go <a href="https://www.youtube.com/feed/channels">here</a>, scroll ALL the way to the bottom, it might take a while, so use the EndPage key or something a couple of times, or a dozen if you are susbribed to many channels like me. Once done, just run the bookmarklet and all the feed urls will be copied to your clipboard. After that, I found an <a href="https://opml-gen.ovh/">online OPML generator</a>, but you can probably use some bash script too, this time I was lazy.</p>

<p>After that I imported the OPML file to FreshRSS and that’s where the fun begun.</p>

<p>For some reason, I thought that adding 1200 feeds at once would be a decent idea, it was not. The import process took a while, a long while. Even if it didn’t actually break, it was a pain to use and doing a refresh was painfully bad.</p>

<h2 id="bulk-deletion-of-feed-subscriptions">Bulk deletion of feed subscriptions</h2>

<p>I decided to try and remove them. Sadly, as of now there is no way to delete subscriptions in bulk. So I had to fiddle around with the MySQL database via SSH.</p>

<p>Of course, <strong>before doing all this backing up the database is a good idea</strong>. But I didn’t think anything too bad could happen, don’t follow my example though.</p>

<p>I ran the following command, after getting into the freshrss database:</p>

<div class="language-sql highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="k">DELETE</span> <span class="k">FROM</span> <span class="n">freshrss_</span><span class="err">$</span><span class="n">user_feed</span> <span class="k">WHERE</span> <span class="n">category</span> <span class="o">=</span> <span class="mi">14</span><span class="p">;</span> <span class="c1">-- user is your username</span>
</code></pre></div></div>

<p>Of course, to get the category and table name, you should use commands such as <code class="language-plaintext highlighter-rouge">show tables;</code> and also checking the category number in the <code class="language-plaintext highlighter-rouge">freshrss_$user_category</code> with <code class="language-plaintext highlighter-rouge">SELECT * FROM freshrss_$user_category;</code>. But while I am kinda used to MySQL, not everyone is, I hope bulk actions become a thing soon enough in FreshRSS.</p>

<h1 id="and-now-nextcloud-too-️">And now Nextcloud too… 🤦🏻‍♂️</h1>

<p>Later I also decided to check my Yunohost admin settings and saw that some of my applications had updates available. Nextcloud is always down for a while when its being updated, so that’s all right.</p>

<p>I was able to login to Nextcloud just fine from the browser, and verify it updated correctly.</p>

<p>However, I noticed that my desktop client couldn’t connect, and also DAVx5 stopped working, no luck with vdirsyncer. No matter how many times I tried to authenticate, generating an app password would fail as fail.</p>

<p>I actually did quite a bit of things trying to fix this. I changed my domain name, changed the certificates, compared with the example nginx configuration in Nextcloud’s documentation, even a full reboot, nothing worked.</p>

<p>Thankfully, after a while asking around in the Yunohost IRC chat, I discovered <a href="https://forum.yunohost.org/t/authentication-issues-with-yunohost-11-1-0-with-new-ssowat-version-please-upgrade-to-yunohost-11-1-2-to-fix/23059">this thread</a> that had a pinned solution, which worked perfectly fine for me.</p>

<p>Turns out I am using a testing release of Yunohost that got accidentally tagged as stable, and the best course of action at the moment is going all out and switching to the testing branch, at least until a real stable version comes out. I decided to do the change and after the update process completed, Nextcloud worked fine again. Basically, I just ran this on my terminal:</p>

<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code>curl https://install.yunohost.org/switchtoTesting | bash
</code></pre></div></div>

<p>I am glad this problem got solved so easily and I didn’t need to move or edit too many files, because I would have never figured this out myself.</p>

<h1 id="final-thoughts">Final thoughts</h1>

<p>Well, at least I changed the domain for a better one, since I was using one of those free domains Nextcloud can give you. For now its all fine.</p>

<p>I also decided to import my subscriptions from Newpipe instead, since I follow less channels, that end up being more meaningul for me than those hundreds of old channels I had in my YouTube subscriptions.</p>

<p>Sadly, Newpipe has no way to export to OPML. So once again I went and parsed their json file using sed and formatted it properly using the tool I mentioned before.</p>

<p>Everything is running as expected now.</p>

<p>I actually made blogs daily blogs for thw whole of January, this is actually quite incredible for me, I think I will take a bit of a break, but maybe not. It depends on how I feel.</p>

<p>This is day 31 of <a href="https://100daystooffload.com">#100DaysToOffload</a></p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="selfhost" /><category term="raspberrypi" /><category term="rss" /><category term="tutorial" /><summary type="html"><![CDATA[You gotta love when you decide you want to do something completely non-sensical. Its even better if you actually get away with it, mostly without any losses. Its not as funny when the software itself decides to do the non-sensical things though. Here's how I fixed it all.]]></summary></entry><entry><title type="html">A quick tag editor for my website</title><link href="https://joelchrono.xyz/blog/a-quick-tag-editor-for-my-website/" rel="alternate" type="text/html" title="A quick tag editor for my website" /><published>2023-01-05T08:08:43-06:00</published><updated>2023-01-05T08:08:43-06:00</updated><id>https://joelchrono.xyz/blog/a-quick-tag-editor-for-my-website</id><content type="html" xml:base="https://joelchrono.xyz/blog/a-quick-tag-editor-for-my-website/"><![CDATA[<p>I have a bit of a love hate relationship with bash scripting. Because you get to have access to all kinds of small tools, piping and doing unixy things, at the cost of having horrible syntax and being kinda hard to read sometimes.</p>

<p>Anyways, a couple posts ago I shared how to sort tags in different ways, the truth is I’ve been meaning to do some cleaning up, inspired by <a href="https://www.adamsdesk.com/posts/clean-tags-categories-two/">Adam’s post</a>.</p>

<p>He used the usual commands such as <code class="language-plaintext highlighter-rouge">sed</code> and <code class="language-plaintext highlighter-rouge">grep</code>, and I decided to quickly write a script to edit the desired tags for any file in a similar manner.</p>

<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c">#!/usr/bin/bash</span>
<span class="c">#</span>
<span class="nv">file</span><span class="o">=</span><span class="nv">$1</span>
<span class="nv">oldtags</span><span class="o">=</span><span class="si">$(</span><span class="nb">cat</span> <span class="nv">$1</span> | <span class="nb">grep</span> <span class="s2">"tags:"</span> | <span class="nb">head</span> <span class="nt">-1</span> | <span class="nb">awk</span> <span class="s1">'{for (i=2; i&lt;NF; i++) printf $i " "; print $NF}'</span><span class="si">)</span>

<span class="nb">echo</span> <span class="nv">$oldtags</span> <span class="o">&gt;</span> /tmp/tagedit
vim /tmp/tagedit

<span class="nv">newtags</span><span class="o">=</span><span class="si">$(</span><span class="nb">cat</span> /tmp/tagedit<span class="si">)</span>

<span class="nb">rm</span> <span class="nt">-fv</span> /tmp/tagedit

<span class="nb">sed</span> <span class="nt">-i</span> <span class="s2">"s/</span><span class="nv">$oldtags</span><span class="s2">/</span><span class="nv">$newtags</span><span class="s2">/g"</span> <span class="s2">"</span><span class="nv">$file</span><span class="s2">"</span>
</code></pre></div></div>

<p>This code is rather simple, it takes the path of a file, which is given as an argument, running something like</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>./edit-tags.sh filename
</code></pre></div></div>

<p>That filename is parsed, using grep, head and awk. a new temporary file containing all existing tags of that file gets opened with vim, containing the existing tags. From there I can add or remove tags as I please, and once saved, I replace the original file accordingly.</p>

<p>It is rather simple, and I think it could be done better. So please, I beg you to give me any suggestions to improve it. I tried my best to understand stuff like <code class="language-plaintext highlighter-rouge">getopts</code> and the like, to have arguments and flags but I just didn’t really get it.</p>

<p>Regardless, this is day 5 of my second attempt at <a href="https://100daystooffload.com">#100DaysToOffload</a></p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="tutorial" /><category term="coding" /><category term="bash" /><category term="vim" /><summary type="html"><![CDATA[Yeah, I keep adding new scripts to make my blogging life easier. In this case, to help me edit tags with less hassle.]]></summary></entry><entry><title type="html">Sorting tags in Jekyll</title><link href="https://joelchrono.xyz/blog/sorting-tags-in-jekyll/" rel="alternate" type="text/html" title="Sorting tags in Jekyll" /><published>2023-01-03T16:31:39-06:00</published><updated>2023-01-03T16:31:39-06:00</updated><id>https://joelchrono.xyz/blog/sorting-tags-in-jekyll</id><content type="html" xml:base="https://joelchrono.xyz/blog/sorting-tags-in-jekyll/"><![CDATA[<p>So tags are quite a useful feature to loosely categorize posts in my blog. I’ve been using them for quite a while, but I never really liked the way they were shown in my website.</p>

<p>I had been showcasing a <em>tag cloud</em> in my home page for quite a while, I don’t know how many actually used it at all (let me know if you did please, I wanna know), but I decided to move it to my <a href="/tags">tags</a> section, which has been there for a while. However, I also decided to try and sort them in a better way.</p>

<p>So far, I think jekyll sorted my tags in whatever order they were created. This was clearly <strong>not</strong> ideal for me.</p>

<p>I took my time to look around online and see other ways to do this from different blogs such as <a href="https://mindthecode.com/blog/sorting-tags-in-jekyll/">this one</a>, (while writing this blog I came across <a href="https://lei1025.github.io/Implement-Sorting-Tags-by-Name-and-Value-in-Jekyll/">another similar post</a>). I found them kinda hard to understand so wrote this anyways. I think the code I found is kinda good but please, let me know if it can be improved!</p>

<p>Here’s how I can sort them alphabetically as well as based on the amount of posts each has.</p>

<h1 id="sorting-by-name">Sorting by name</h1>

<p>The following snippet will sort all tags by name and will also show the amount of posts they contain.</p>

<div class="language-liquid highlighter-rouge"><div class="highlight"><pre class="highlight"><code>&lt;ul&gt;
<span class="cp">{%</span><span class="w"> </span><span class="nt">assign</span><span class="w"> </span><span class="nv">sorted_tags</span><span class="w"> </span><span class="o">=</span><span class="w"> </span><span class="nv">site</span><span class="p">.</span><span class="nv">tags</span><span class="w"> </span><span class="p">|</span><span class="w"> </span><span class="nf">sort</span><span class="w"> </span><span class="cp">%}</span>
<span class="cp">{%</span><span class="w"> </span><span class="nt">for</span><span class="w"> </span><span class="nv">tag</span><span class="w"> </span><span class="nt">in</span><span class="w"> </span><span class="nv">sorted_tags</span><span class="w"> </span><span class="cp">%}</span>
<span class="cp">{%</span><span class="w"> </span><span class="nt">assign</span><span class="w"> </span><span class="nv">t</span><span class="w"> </span><span class="o">=</span><span class="w"> </span><span class="nv">tag</span><span class="w"> </span><span class="p">|</span><span class="w"> </span><span class="nf">first</span><span class="w"> </span><span class="cp">%}</span>
<span class="cp">{%</span><span class="w"> </span><span class="nt">assign</span><span class="w"> </span><span class="nv">posts</span><span class="w"> </span><span class="o">=</span><span class="w"> </span><span class="nv">tag</span><span class="w"> </span><span class="p">|</span><span class="w"> </span><span class="nf">last</span><span class="w"> </span><span class="cp">%}</span>
&lt;li&gt;&lt;a href="/tags/<span class="cp">{{</span><span class="w"> </span><span class="nv">tag</span><span class="p">[</span><span class="mi">0</span><span class="p">]</span><span class="w"> </span><span class="cp">}}</span>/"&gt;<span class="cp">{{</span><span class="w"> </span><span class="nv">tag</span><span class="p">[</span><span class="mi">0</span><span class="p">]</span><span class="cp">}}</span>&lt;/a&gt; has <span class="cp">{{</span><span class="w"> </span><span class="nv">tag</span><span class="p">[</span><span class="mi">1</span><span class="p">]</span><span class="w"> </span><span class="p">|</span><span class="w"> </span><span class="nf">size</span><span class="w"> </span><span class="cp">}}</span> posts&lt;/li&gt;
<span class="cp">{%</span><span class="w"> </span><span class="nt">endfor</span><span class="w"> </span><span class="cp">%}</span>
&lt;/ul&gt;
</code></pre></div></div>

<h1 id="sorting-by-post-quantity">Sorting by post quantity</h1>

<p>This one was a little trickier, but still quite simple to do.</p>

<div class="language-liquid highlighter-rouge"><div class="highlight"><pre class="highlight"><code>&lt;ul&gt;
<span class="cp">{%</span><span class="w"> </span><span class="nt">capture</span><span class="w"> </span><span class="nv">tags</span><span class="w"> </span><span class="cp">%}</span>
<span class="cp">{%</span><span class="w"> </span><span class="nt">for</span><span class="w"> </span><span class="nv">tag</span><span class="w"> </span><span class="nt">in</span><span class="w"> </span><span class="nv">site</span><span class="p">.</span><span class="nv">tags</span><span class="w"> </span><span class="cp">%}</span>
<span class="cp">{{</span><span class="w"> </span><span class="nv">tag</span><span class="p">[</span><span class="mi">1</span><span class="p">].</span><span class="nf">size</span><span class="w"> </span><span class="p">|</span><span class="w"> </span><span class="nf">plus</span><span class="p">:</span><span class="w"> </span><span class="mi">1000</span><span class="w"> </span><span class="cp">}}</span>#<span class="cp">{{</span><span class="w"> </span><span class="nv">tag</span><span class="p">[</span><span class="mi">0</span><span class="p">]</span><span class="w"> </span><span class="cp">}}</span>#<span class="cp">{{</span><span class="w"> </span><span class="nv">tag</span><span class="p">[</span><span class="mi">1</span><span class="p">].</span><span class="nf">size</span><span class="w"> </span><span class="cp">}}</span>
<span class="cp">{%</span><span class="w"> </span><span class="nt">endfor</span><span class="w"> </span><span class="cp">%}</span>
<span class="cp">{%</span><span class="w"> </span><span class="nt">endcapture</span><span class="w"> </span><span class="cp">%}</span>
<span class="cp">{%</span><span class="w"> </span><span class="nt">assign</span><span class="w"> </span><span class="nv">sortedtags</span><span class="w"> </span><span class="o">=</span><span class="w"> </span><span class="nv">tags</span><span class="w"> </span><span class="p">|</span><span class="w"> </span><span class="nf">split</span><span class="p">:</span><span class="s1">' '</span><span class="w"> </span><span class="p">|</span><span class="w"> </span><span class="nf">sort</span><span class="w"> </span><span class="cp">%}</span>
<span class="cp">{%</span><span class="w"> </span><span class="nt">for</span><span class="w"> </span><span class="nv">tag</span><span class="w"> </span><span class="nt">in</span><span class="w"> </span><span class="nv">sortedtags</span><span class="w"> </span><span class="na">reversed</span><span class="w"> </span><span class="cp">%}</span>
<span class="cp">{%</span><span class="w"> </span><span class="nt">assign</span><span class="w"> </span><span class="nv">tagitems</span><span class="w"> </span><span class="o">=</span><span class="w"> </span><span class="nv">tag</span><span class="w"> </span><span class="p">|</span><span class="w"> </span><span class="nf">split</span><span class="p">:</span><span class="w"> </span><span class="s1">'#'</span><span class="w"> </span><span class="cp">%}</span>
&lt;li&gt;&lt;a href="/tags/<span class="cp">{{</span><span class="w"> </span><span class="nv">tagitems</span><span class="p">[</span><span class="mi">1</span><span class="p">]</span><span class="w"> </span><span class="cp">}}</span>/"&gt;<span class="cp">{{</span><span class="w"> </span><span class="nv">tagitems</span><span class="p">[</span><span class="mi">1</span><span class="p">]</span><span class="cp">}}</span>&lt;/a&gt; has <span class="cp">{{</span><span class="w"> </span><span class="nv">tagitems</span><span class="p">[</span><span class="mi">2</span><span class="p">]</span><span class="w"> </span><span class="cp">}}</span> posts&lt;/li&gt;
<span class="cp">{%</span><span class="w"> </span><span class="nt">endfor</span><span class="w"> </span><span class="cp">%}</span>
&lt;/ul&gt;
</code></pre></div></div>

<h1 id="finishing-up">Finishing up</h1>

<p>So, that’s it. Did you expect me to explain it? This is not original material, I understand the first one maybe but I do not know what the <code class="language-plaintext highlighter-rouge">plus: 1000</code> does on the second snippet nor anything in that line. Regardless, it works just fine for me to be honest and perhaps it could work for you.</p>

<p>I still find Jekyll to be quite enjoyable, it seems to me like most blogs nowadays are either Hugo or plain old WordPress. Maybe its just my own bias and its nothing like that.</p>

<p>Besides, <strong><a href="https://github.com/void-linux/void-linux.github.io/">Void Linux itself</a>, the one above all</strong>, uses Jekyll. Therefore, I will do my duty and stay loyal to it… until I get bored, or something.</p>

<p>Also, this is gonna be day 3 of my second run of <a href="https://100daystooffload.com">#100DaysToOffload</a>, <em>always has been</em>.</p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="jekyll" /><category term="tutorial" /><category term="blog" /><category term="coding" /><category term="webdev" /><summary type="html"><![CDATA[Jekyll allows you to make tags, which are quite useful. I've been working on reducing the amount of tags and changing the way I display them in my blog. So here's what's up]]></summary></entry><entry><title type="html">Using my own domain for Mastodon without hosting a server (kinda)</title><link href="https://joelchrono.xyz/blog/using-my-own-domain-for-mastodon-without-hosting-a-server-(kinda)/" rel="alternate" type="text/html" title="Using my own domain for Mastodon without hosting a server (kinda)" /><published>2022-12-22T16:17:49-06:00</published><updated>2022-12-22T16:17:49-06:00</updated><id>https://joelchrono.xyz/blog/using-my-own-domain-for-mastodon-without-hosting-a-server-(kinda)</id><content type="html" xml:base="https://joelchrono.xyz/blog/using-my-own-domain-for-mastodon-without-hosting-a-server-(kinda)/"><![CDATA[<p>This whole tutorial is based on <a href="https://www.hanselman.com/blog/use-your-own-user-domain-for-mastodon-discoverability-with-the-webfinger-protocol-without-hosting-a-server/">another blog by Scott Hanselman</a>, he also links to a bunch of other resources that I don’t really need to repeat here..</p>

<p>Basically, what I mean with this title is that you will be able to look me up as <code class="language-plaintext highlighter-rouge">@joel@joelchrono12.xyz</code> in my domain. This setup actually makes it so you can type <code class="language-plaintext highlighter-rouge">whatever@joelchrono12.xyz</code> and it will still just show up my actual Fosstodon account. Regardless, I am a single person, so I don’t mind.</p>

<p>This quick tutorial is focused on Jekyll, but you should be able to figure it out using this <a href="https://guide.toot.as/guide/use-your-own-domain/#5-static-files">guide too</a>.</p>

<p>Pretty much paste this into a file in the root of your website and call it a day. Mastodon will do the rest.</p>

<div class="language-json highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="err">---</span><span class="w">
</span><span class="err">layout:</span><span class="w"> </span><span class="err">none</span><span class="w">
</span><span class="err">permalink:</span><span class="w"> </span><span class="err">.well-known/webfinger</span><span class="w">
</span><span class="err">---</span><span class="w">
</span><span class="p">{</span><span class="w">
    </span><span class="nl">"subject"</span><span class="p">:</span><span class="s2">"acct:joel@fosstodon.org"</span><span class="p">,</span><span class="w">
    </span><span class="nl">"aliases"</span><span class="p">:</span><span class="w">
    </span><span class="p">[</span><span class="w">
        </span><span class="s2">"https://fosstodon.org/@joel"</span><span class="p">,</span><span class="w">
        </span><span class="s2">"https://fosstodon.org/users/joel"</span><span class="w">
    </span><span class="p">],</span><span class="w">
    </span><span class="nl">"links"</span><span class="p">:</span><span class="w">
    </span><span class="p">[</span><span class="w">
        </span><span class="p">{</span><span class="w">
            </span><span class="nl">"rel"</span><span class="p">:</span><span class="s2">"http://webfinger.net/rel/profile-page"</span><span class="p">,</span><span class="w">
            </span><span class="nl">"type"</span><span class="p">:</span><span class="s2">"text/html"</span><span class="p">,</span><span class="w">
            </span><span class="nl">"href"</span><span class="p">:</span><span class="s2">"https://fosstodon.org/@joel"</span><span class="w">
        </span><span class="p">},</span><span class="w">
        </span><span class="p">{</span><span class="w">
            </span><span class="nl">"rel"</span><span class="p">:</span><span class="s2">"self"</span><span class="p">,</span><span class="w">
            </span><span class="nl">"type"</span><span class="p">:</span><span class="s2">"application/activity+json"</span><span class="p">,</span><span class="w">
            </span><span class="nl">"href"</span><span class="p">:</span><span class="s2">"https://fosstodon.org/users/joel"</span><span class="w">
        </span><span class="p">},</span><span class="w">
        </span><span class="p">{</span><span class="w">
            </span><span class="nl">"rel"</span><span class="p">:</span><span class="s2">"http://ostatus.org/schema/1.0/subscribe"</span><span class="p">,</span><span class="w">
            </span><span class="nl">"template"</span><span class="p">:</span><span class="s2">"https://fosstodon.org/authorize_interaction?uri={uri}"</span><span class="w">
        </span><span class="p">}</span><span class="w">
    </span><span class="p">]</span><span class="w">
</span><span class="p">}</span><span class="w">
</span></code></pre></div></div>

<p>Pretty easy right? Now after pushing that to your server you should be able to find yourself with ease, at least within Mastodon. I am not sure how it would work on Pleroma or other Fediverse tools. Still, it is quite cool.</p>

<p>This won’t change your username handle per se, it will just make it so you can search me by my domain. Which would also make it easier to switch instance without having to alter mentioning my username and stuff.</p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="tutorial" /><category term="blog" /><category term="fediverse" /><summary type="html"><![CDATA[So I saw this way of making myself easier to look up and its quite cool I think]]></summary></entry><entry><title type="html">Change URLs without breaking old links in Jekyll</title><link href="https://joelchrono.xyz/blog/change-urls-without-breaking-old-links/" rel="alternate" type="text/html" title="Change URLs without breaking old links in Jekyll" /><published>2022-06-23T16:13:35-05:00</published><updated>2022-06-23T16:13:35-05:00</updated><id>https://joelchrono.xyz/blog/change-urls-without-breaking-old-links-in-jekyll</id><content type="html" xml:base="https://joelchrono.xyz/blog/change-urls-without-breaking-old-links/"><![CDATA[<p>When I started this blog using Jekyll I was amazed at the power it had, using simple plain markdown files and some yaml metadata. One of my favorite features is adding a custom permalink for each blog, which lets me change it from the default, for example, this post would normally have the following URL:</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>https://joelchrono12.xyz/2022/06/23/change-urls-without-breaking-old-links-in-jekyll.html
</code></pre></div></div>

<p>However, by setting a <code class="language-plaintext highlighter-rouge">permalink</code> in the yaml metadata, I can simply have something like:</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>https://joelchrono12.xyz/blog/change-urls-without-breaking-old-links/
</code></pre></div></div>

<p>Which is shorter and easier to type.</p>

<p>However, before doing my <a href="https://joelchrono.xyz/blog/rofi-automated-blog/">rofi script for automatic post creation</a> I initially created my markdown files by hand, and I didn’t really had a format to follow, some of my posts had <code class="language-plaintext highlighter-rouge">/blog/post.title</code>, others had no permalink set at all, and others just had <code class="language-plaintext highlighter-rouge">/post.title</code>.</p>

<p>This means that the generated static files are all over the place, and I kinda wanted to clean that up.</p>

<p>The solution is really simple. I just installed the <a href="https://github.com/jekyll/jekyll-redirect-from">jekyll-redirect-from</a> plugin. After reading the README in their repo, I realized this was exactly what I needed. I won’t really explain it here since its fairly easy to do, but feel free to ask me if you feel like it.</p>

<p>You can test out how the plugin works on my website, here are some of the old URLs that should now redirect you to the new one. You may also find some of those old posts of mine kinda interesting too!</p>

<ul>
  <li><a href="/newpipe-over-vanced/">A comparison on Newpipe and Youtube Vanced</a></li>
  <li><a href="/privacy-android-browsers/">Privacy focused browsers for Android</a></li>
  <li><a href="/request-forgiveness-for-small-things/">Asking for forgiveness for small things</a></li>
  <li><a href="/changing-android-rom/">Changing my Android custom rom</a></li>
</ul>

<p>Even in those old articles I link to some more posts that are still using a different format, which will be redirected too. If you found this useful please let me know!</p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="tutorial" /><category term="jekyll" /><category term="webdev" /><summary type="html"><![CDATA[Using Jekyll and static site generators comes with its own set of problems, one of them is changing URL formats without breaking the previously used links. Thankfully, the solution is fairly simple.]]></summary></entry><entry><title type="html">Sharing my blogs to the Fediverse automatically</title><link href="https://joelchrono.xyz/blog/sharing-my-blogs-to-the-fediverse-automatically/" rel="alternate" type="text/html" title="Sharing my blogs to the Fediverse automatically" /><published>2022-06-10T20:00:34-05:00</published><updated>2022-06-10T20:00:34-05:00</updated><id>https://joelchrono.xyz/blog/sharing-my-blogs-to-the-fediverse-automatically</id><content type="html" xml:base="https://joelchrono.xyz/blog/sharing-my-blogs-to-the-fediverse-automatically/"><![CDATA[<p>There are many problems that come when you don’t use some CMS like Wordpress or Ghost, and this is one of them. When I <a href="https://joelchrono.xyz/blog/how-to-add-mastodon-comments-to-jekyll-blog/">chose Mastodon as commenting system for my blog</a> I realized it would be quite a process to share my post and get the comment section working. I had already <a href="https://joelchrono.xyz/blog/rofi-automated-blog/">automated the blog creation process</a>, but I still had to do all this:</p>

<ul>
  <li>finish writing</li>
  <li>git add, git commit, git push</li>
  <li>write toot on mastodon sharing my blogpost</li>
  <li>copy toot link</li>
  <li>paste toot link id on original blogpost</li>
  <li>git add, git commit, git push</li>
  <li>comments section now works!</li>
</ul>

<p>However, I decided to summon the power of the command line and bash scripting once again, and I finally managed to automate pretty much all of it.</p>

<p>It depends on some basic tools such as <code class="language-plaintext highlighter-rouge">sed</code>, <code class="language-plaintext highlighter-rouge">cut</code>, <code class="language-plaintext highlighter-rouge">grep</code>, but it also requires a very simple mastodon client for the command line, <code class="language-plaintext highlighter-rouge">toot</code>, you probably have it all installed already, and toot is not hard to setup either way.</p>

<p>There really is not a lot to talk about other than this. Here is the script, its not really super clean or anything (any suggestion are absolutely welcome) but at least its serviceable.</p>

<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c">#!/usr/bin/bash</span>

<span class="k">if </span>git rev-parse <span class="nt">--git-dir</span> <span class="o">&gt;</span> /dev/null 2&gt;&amp;1<span class="p">;</span> <span class="k">then</span>
    : <span class="c"># This is a valid git repository</span>

    <span class="c"># All markdown files start with YYYY-MM-DD</span>
    <span class="nv">lastpost</span><span class="o">=</span><span class="si">$(</span>/usr/bin/ls <span class="k">${</span><span class="nv">markdown_posts_folder</span><span class="k">}</span>/<span class="k">*</span>.md | <span class="nb">sort</span> <span class="nt">-r</span> | <span class="nb">head</span> <span class="nt">-n</span> 1<span class="si">)</span> 
    <span class="nv">getdesc</span><span class="o">=</span><span class="si">$(</span><span class="nb">grep</span> <span class="s2">"description:"</span> <span class="nv">$lastpost</span> | <span class="nb">cut</span> <span class="nt">-d</span> <span class="s2">" "</span> <span class="nt">-f2-</span><span class="si">)</span>
    <span class="nv">geturl</span><span class="o">=</span><span class="si">$(</span><span class="nb">grep</span> <span class="s2">"permalink:"</span> <span class="nv">$lastpost</span> | <span class="nb">cut</span> <span class="nt">-d</span> <span class="s2">" "</span> <span class="nt">-f2-</span><span class="si">)</span>
    <span class="nv">gettags</span><span class="o">=</span><span class="si">$(</span><span class="nb">grep</span> <span class="s2">"tags:"</span> <span class="nv">$lastpost</span> | <span class="nb">cut</span> <span class="nt">-d</span> <span class="s2">" "</span> <span class="nt">-f2-</span> | <span class="nb">sed</span> <span class="nt">-r</span> <span class="s1">'s/([^ ]+)/#\1/g'</span><span class="si">)</span>
    <span class="nv">post</span><span class="o">=</span><span class="si">$(</span><span class="nb">echo</span> <span class="nt">-e</span> <span class="s2">"</span><span class="k">${</span><span class="nv">getdesc</span><span class="k">}</span><span class="s2"> </span><span class="se">\n\n</span><span class="s2">https://joelchrono.xyz/</span><span class="k">${</span><span class="nv">geturl</span><span class="k">}</span><span class="s2"> </span><span class="se">\n\n</span><span class="k">${</span><span class="nv">gettags</span><span class="k">}</span><span class="s2"> #blogpost"</span><span class="si">)</span>
    <span class="nv">posturl</span><span class="o">=</span><span class="si">$(</span>toot post <span class="s2">"</span><span class="nv">$post</span><span class="s2">"</span> | <span class="nb">cut</span> <span class="nt">-d</span>/ <span class="nt">-f5</span><span class="si">)</span>
    <span class="nb">echo</span> <span class="nv">$posturl</span>
    <span class="nb">sed</span> <span class="nt">-i</span> <span class="s2">"s/commentsid/</span><span class="nv">$posturl</span><span class="s2">/g"</span> <span class="s2">"</span><span class="nv">$lastpost</span><span class="s2">"</span>

    git add <span class="k">*</span>
    git commit <span class="nt">-m</span> <span class="s2">"automatically added comments"</span>
    git push

    <span class="nb">exit</span>

<span class="c"># directory may not be the top level.</span>
<span class="c"># Check the output of the git rev-parse command if you care</span>
<span class="k">else</span>
    : <span class="c"># this is not a git repository</span>
    <span class="nb">echo</span> <span class="s2">"Run this inside of website folder"</span>
    <span class="nb">exit

</span><span class="k">fi</span>
</code></pre></div></div>

<p>There you go, I hope you find it useful, maybe you can improve it even further. If so, make sure to let me know, I am still learning these things.</p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="blog" /><category term="tutorial" /><category term="coding" /><category term="bash" /><category term="linux" /><category term="git" /><category term="webdev" /><category term="blog" /><summary type="html"><![CDATA[I always share my blogposts on Mastodon when I am done writing them, but it has always been a little annoying to do so. Not anymore.]]></summary></entry><entry><title type="html">Hide web elements with UBlock Origin</title><link href="https://joelchrono.xyz/blog/ublock-origin-cosmetic-filtering/" rel="alternate" type="text/html" title="Hide web elements with UBlock Origin" /><published>2022-05-08T18:35:26-05:00</published><updated>2022-05-08T18:35:26-05:00</updated><id>https://joelchrono.xyz/blog/ublock-origin-cosmetic-filtering</id><content type="html" xml:base="https://joelchrono.xyz/blog/ublock-origin-cosmetic-filtering/"><![CDATA[<p>I was really tempted to make the title of this post a bit more eye-catchy, but decided to keep it more informative. Cosmetic filtering is a great feature that most people seem to not know UBlock Origin has, even though it is the best ad-blocker around!</p>

<p>The name might already tell you what this feature does, but in case you don’t know. Cosmetic filters allows you to hide certain sections of a website. Not only ads, but many other things. Like comment sections, sidebars or annoying pop-ups.</p>

<p>I decided to write this as somewhat of an answer to Ru’s post about using Stylus (a tool to make custom stylesheets for websites) to <a href="https://rusingh.com/hide-followers-following-on-mastodons-web-ui/">hide followers and follows in Mastodon</a>. Stylus might be a little too much for such a simple thing. Besides, having less extensions is always good to make fingerprinting more difficult.</p>

<p>UBlock Origin can help a lot for other use cases, I’ll share my filter list at the end to give you some filters you might want to use too.</p>

<h1 id="how-to-use-it">How to use it</h1>

<p>There are many ways to use this feature, the quickest is to simply click on UBlock’s icon. Then select the color picker icon to enter in <em>Element Picker Mode</em>, then click on any part of a website, to block it, you will see the element’s you choose highlighted in red, then you can click on <em>Create</em> to add it to your filters list.</p>

<p><img src="/assets/img/blogs/2022-05-08-elementpicker.gif" alt="Element picker" /></p>

<p>Another way that can help you be more specific or add multiple filters at a time is to go into UBlock’s settings, then go to the “My Filters” tab, where you will see an empty input area, (unless you’ve already added some). Here you can add as many filters as you want.</p>

<p>Here are some of the ones I’ve added to my list.</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>open.spotify.com##section[aria-label="Fresh Finds"]
open.spotify.com##section[aria-label="Shows you might like"]
open.spotify.com##section[aria-label="Level up"]
open.spotify.com##section[aria-label="15 minutes or less shows"]
open.spotify.com##section[aria-label="Get creative"]
open.spotify.com##section[aria-label="Delve into the news headlines"]
open.spotify.com##section[aria-label="Shows to try"]
open.spotify.com##section[aria-label="What's trending?"]
open.spotify.com##section[aria-label="The Top Podcasts of 2020"]
open.spotify.com##section[aria-label="The Top Podcasts of 2021"]
open.spotify.com##section[aria-label="The Top Podcasts of 2022"]
open.spotify.com##section[aria-label="Episodes for you"]

! 2022-03-04 https://www.youtube.com
www.youtube.com###secondary

! 2022-03-05 https://www.youtube.com
www.youtube.com###header &gt; .ytd-rich-grid-renderer.style-scope

! 2022-05-09 https://benign.town
benign.town##.account__header__extra__links

</code></pre></div></div>

<p>These filters make Youtube’s UI much more simple, and they also hide all the annoying podcast features from Spotify’s Web UI. So, I hope you find them useful.</p>

<p>That’s all folks, let me know if you find this features useful.</p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="tutorial" /><category term="internet" /><category term="detox" /><summary type="html"><![CDATA[Some websites have too much going on. And you might want to use extensions to simplify them, but you might just be able to do it using current ad-blocker]]></summary><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://joelchrono.xyz/assets/img/blogs/2022-05-08-element-blocker.jpg" /><media:content medium="image" url="https://joelchrono.xyz/assets/img/blogs/2022-05-08-element-blocker.jpg" xmlns:media="http://search.yahoo.com/mrss/" /></entry><entry><title type="html">Add images to Markdown files (for Jekyll)</title><link href="https://joelchrono.xyz/blog/add-images-to-markdown-files-(for-jekyll)/" rel="alternate" type="text/html" title="Add images to Markdown files (for Jekyll)" /><published>2022-01-27T10:16:00-06:00</published><updated>2022-01-27T10:16:00-06:00</updated><id>https://joelchrono.xyz/blog/add-images-to-markdown-files-(for-jekyll)</id><content type="html" xml:base="https://joelchrono.xyz/blog/add-images-to-markdown-files-(for-jekyll)/"><![CDATA[<p>So I have already done quite a lot of posts to make the creation of new posts easier. I find Jekyll to be a pretty decent static site generator, but this little script should work with whatever you got. As long as you customize it to your file structure.</p>

<p>The script comes as a request by <a href="https://fosstodon.org/@celia">Ru</a>, or at least this is what I hope she meant when <a href="https://fosstodon.org/@celia/107694900078045072">she posted</a>:</p>

<blockquote>
  <p>Static site users who embed images frequently – what’s your workflow for it? #AskFedi</p>
</blockquote>

<p>Well, my <em>previous workflow</em> was simple enough:</p>

<ol>
  <li>Take pictures.</li>
  <li>Move to assets folder.</li>
  <li>Rename them to something like $date-$filename_without_spaces.png.</li>
  <li>Add markdown syntax and type the whole thing.</li>
  <li>Cry because you messed up the directory path.</li>
</ol>

<p>So I went ahead and decided to work on a little script I named <code class="language-plaintext highlighter-rouge">aijk</code> (Add image to Jekyll), using bash and rofi, tools that I’ve used before with decent success. I am actually really happy of how it turned out.</p>

<h1 id="the-script">The script</h1>

<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c">#!/bin/bash</span>

<span class="c">### AIJK (Add image to Jekyll)</span>
<span class="c">### By joelchrono12</span>

<span class="nv">pic</span><span class="o">=</span><span class="nv">$1</span>
<span class="nv">name</span><span class="o">=</span><span class="si">$(</span>rofi <span class="nt">-l</span> 0 <span class="nt">-width</span> 50 <span class="nt">-p</span> <span class="s2">"Title"</span> <span class="nt">-dmenu</span><span class="si">)</span>
<span class="nv">filen</span><span class="o">=</span><span class="si">$(</span><span class="nb">echo</span> <span class="nv">$name</span> | <span class="nb">tr</span> <span class="s2">" ,.!"</span> <span class="s2">"-"</span>| <span class="nb">awk</span> <span class="s1">'{print tolower($0)}'</span><span class="si">)</span>
<span class="nv">today</span><span class="o">=</span><span class="si">$(</span><span class="nb">date</span> +<span class="s2">"%Y-%m-%d"</span><span class="si">)</span>
<span class="nv">filename</span><span class="o">=(</span><span class="nv">$today</span>-<span class="nv">$filen</span><span class="o">)</span>
<span class="nv">path</span><span class="o">=</span>/path/to/website <span class="c">#without / at the end</span>
<span class="nv">imgs</span><span class="o">=</span>/from/site_root/to/assets/ <span class="c">#example = /assets/img/blogs/</span>
<span class="nv">last_post</span><span class="o">=</span><span class="si">$(</span>/usr/bin/ls /path/to/markdown/files/<span class="k">*</span>.md | <span class="nb">sort</span> <span class="nt">-r</span> | <span class="nb">head</span> <span class="nt">-n</span> 1<span class="si">)</span>

convert <span class="nv">$1</span> <span class="nt">-quality</span> 75 <span class="k">${</span><span class="nv">path</span><span class="k">}${</span><span class="nv">imgs</span><span class="k">}${</span><span class="nv">filename</span><span class="k">}</span>.png

<span class="nb">printf</span> <span class="s2">"</span><span class="se">\n</span><span class="s2">![</span><span class="k">${</span><span class="nv">name</span><span class="k">}</span><span class="s2">](</span><span class="k">${</span><span class="nv">imgs</span><span class="k">}${</span><span class="nv">filename</span><span class="k">}</span><span class="s2">.png)"</span> <span class="o">&gt;&gt;</span> <span class="nv">$last_post</span>

</code></pre></div></div>

<h2 id="how-to-use">How to use</h2>

<p>Once added to your $PATH and making it executable, all you need is to change the required paths in the script, I think most of you will be able to figure it out on your own, but reach me out if you need help.</p>

<p>You can run it just by doing this:</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>aijk file.png
</code></pre></div></div>

<p>This is how it works:</p>

<ul>
  <li>Obtain picture file from argument.</li>
  <li>Add a Title to file via a rofi input.</li>
  <li>Create filename for file itself.</li>
  <li>Set paths to different required things (depends on your site).</li>
  <li>Get the latest markdown files from your site.</li>
  <li>Make changes to picture so its smaller or whatever (can be customized, requires ImageMagick).</li>
  <li>Print formatted markdown line to bottom of the latest markdown file.</li>
</ul>

<h2 id="adding-a-graphical-option-for-mouse-users">Adding a Graphical option for mouse users</h2>

<p>You can run this script with absolute ease from your terminal, if that’s what you want, but I also figured out a way to do it from a GUI if you are using Thunar as a file manager (might be possible with others, haven’t checked).</p>

<ol>
  <li>Open Thunar &gt; Edit &gt; Configure custom actions.</li>
  <li>Add a new entry for <code class="language-plaintext highlighter-rouge">aijk</code> and save it.</li>
</ol>
<figure class="img">
  <picture>
    <source srcset="/assets/img/blogs/2022-01-27-thunar-configuration.webp" type="image/webp" />
    <source srcset="/assets/img/blogs/2022-01-27-thunar-configuration.jpg" type="image/jpeg" />
    <img class="mx-auto" src="/assets/img/blogs/2022-01-27-thunar-configuration.jpg" alt="" />
  </picture>
  </figure>

<ol>
  <li>Set the appearance conditions to images only.</li>
  <li>Right click on any image to try it out!</li>
</ol>

<h1 id="final-thoughts">Final thoughts</h1>

<p>I am not completely happy with how this works. But this is usable and easy to expand, there could be a way to select the destination file instead of just getting the latest one. But I don’t normally add new images to old posts anyways, so I figured most people would be ok with how this works right now.</p>

<p>The script also assumes you want to start all your files with the date, and that your markdown files also start with the dates, since <code class="language-plaintext highlighter-rouge">sort</code>  will fail to place the line in the latest file, if such file is not the first in its output.</p>

<p>There is also no way to do this with multiple files as of now, I might be able to come up with something, I could just create another script that makes use of this one to make multiple additions at once.</p>

<p>Anyways, this is what I’ll do now to add images, I will simply right click, click again and give them a name!. Or do it properly in the terminal, whatever fits me best.</p>

<p>This has been day 95 of <a href="https://100daystooffload.com">#100DaysToOffload</a>. Make sure to check out <a href="https://rusingh.com/">Ru’s website</a>, since she single-handedly managed to inspire me to work on this quick script.</p>

<p><strong>NOTE: This is actually day 96, from here it all went wrong. If you don’t understand this note, [read here]</strong></p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="tutorial" /><category term="coding" /><category term="bash" /><category term="linux" /><category term="webdev" /><category term="blog" /><category term="jekyll" /><summary type="html"><![CDATA[I decided to streamline the process of adding images to new posts quickly, how did I do it? Using bash scripts of course!]]></summary></entry><entry><title type="html">Installing LabVIEW in Linux Mint 20.3</title><link href="https://joelchrono.xyz/blog/installing-labview-in-linux-mint-20-3/" rel="alternate" type="text/html" title="Installing LabVIEW in Linux Mint 20.3" /><published>2022-01-25T10:45:40-06:00</published><updated>2022-01-25T10:45:40-06:00</updated><id>https://joelchrono.xyz/blog/installing-labview-in-linux-mint-20-3</id><content type="html" xml:base="https://joelchrono.xyz/blog/installing-labview-in-linux-mint-20-3/"><![CDATA[<p>So far, I have tried multiple ways to solve this, including the first couple of tutorials that just run the INSTALL script or do it via rpm itself.</p>

<p>Right now I am writing this while following <a href="https://lavag.org/topic/21809-installing-labview2020-on-debian/?do=findComment&amp;comment=133824">this comment</a> because it seems relatively up-to-date. I am installing the latest community edition for LabVIEW, which is from 2021.</p>

<p>I am literally following the list of commands he explains, so I won’t really add too much, unless I fail, quite a lot of deb files have been generated already, I just have to see if they work once the generation process finishes for  all of them.</p>

<p>Having to use these programs pains me, I wish formats like AppImage were used to deal with this nonsense of proprietary software that have bad support, even for Ubuntu. At least MATLAB is relatively sensible and easy to install.</p>

<p>The comment makes use of alien and dpkg, it’s not super hard to follow, if a little repetitive for a bunch of things.</p>

<p>The deb files have been generated, so I proceed to just install them with dpkg. Let’s hope it works.</p>

<p>[…]</p>

<p>Well, it didn’t work, a few of those packages were kinda broken, so I will probably try and install the version used in the tutorials instead and see if I have any luck that way, the teacher is probably using an old version too anyway.</p>

<p>[…]</p>

<p>Ok, my bad, some deb files failed to install, but it looks like the program runs just fine, I just had to edit the desktop file to point to the <code class="language-plaintext highlighter-rouge">labviewprofull</code> binary, and somehow I don’t need to authenticate or anything, it just worked. So here is <del>exactly</del> what <em>I think</em> I did, maybe you don’t need to do half of them, but at least what I did made the program open just fine.</p>

<ul>
  <li>Follow the steps from the already mentioned comment.
    <ul>
      <li>Instead of installing the deb files one by one, I just used <code class="language-plaintext highlighter-rouge">dpkg -i *.deb</code> because why not.</li>
    </ul>
  </li>
  <li>Set up your default root browser to Midori because Chromium and Firefox don’t like to run as root</li>
  <li>Add a symlink to your PATH that points to /usr/local/natinst/LabVIEW-2021-64/labviewcommunity</li>
  <li>Run from terminal using sudo</li>
  <li>Authenticate, in my case it got stuck loading, but I closed the browser and the program worked…</li>
  <li>Tried again without sudo, didn’t work.</li>
  <li>Tried using labviewprofull binary instead of community.</li>
  <li>Replace the Exec line in LabVIEW’s desktop file with the path to labviewprofull</li>
  <li>Replace the symlink too</li>
  <li>Run LabVIEW and it should be done.</li>
</ul>

<p>This is an absolute mess, how am I even running the full version anyway without any license? Or maybe it picked up the community license despite the community version refusing to work without sudo?</p>

<p>I have no idea of what I did, but it worked so far.
This is an absolute mess, how am I even running the full version anyway without any license? Or possibly it picked up the community license despite the community version refusing to work without sudo?</p>

<p>[…]</p>

<p>So the interface sucks, it looks like Windows 95, it already looked like that in Windows itself though, but I had to change the font size since it was set to 10px, which is not readable at all.</p>

<p>Also, the program barely works in tiling window managers, I will probably stick to using it in floating mode the whole time, whatever.</p>

<p>In the end, I guess it’s installed now, it completely messed up the folders and I don’t even know how to uninstall it once the time comes, but I guess I’ll be ready for that.</p>

<p>This has been day 94 of <a href="https://100daystooffload.com">#100DaysToOffload</a></p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="tutorial" /><category term="linux" /><category term="ramble" /><category term="personal" /><category term="school" /><summary type="html"><![CDATA[Trying to install this piece of proprietary software because my school wants me to is quite painful, but here is what I did]]></summary></entry><entry><title type="html">Play Wordle</title><link href="https://joelchrono.xyz/blog/play-wordle/" rel="alternate" type="text/html" title="Play Wordle" /><published>2022-01-17T07:09:30-06:00</published><updated>2022-01-17T07:09:30-06:00</updated><id>https://joelchrono.xyz/blog/play-wordle</id><content type="html" xml:base="https://joelchrono.xyz/blog/play-wordle/"><![CDATA[<p>Wordle is a simple word guessing game where you get 6 chances to guess a 5 letter word. It is a web based game <a href="https://www.powerlanguage.co.uk/wordle/">hosted here</a>.</p>

<p>There are many clones of it, but they are only profiting off the original game. There is only one word per day, the game is not supposed to be played all day long. So, this is how it works</p>

<p>You can guess 6 real words (You can’t input pure vocals or random letters).
The game helps you by showing you if a letter is not in the word (dark grey), if a letter if in the word, but in a different spot (yellow) and if the letter is in the word in the correct spot (green).</p>

<p>The game will generate a simple message containing a set of colored squared emojis, which serve as diagram of words you guessed.</p>

<p>I kinda really enjoy this game, it only takes a few minutes of your day, you can not play it endlessly (or at least, you are not supposed to) and its a nice exercise for the mind, I guess.</p>

<p>I don’t really speak a lot of English in real life, so it even helps me learn a couple of words, which is a nice plus in my opinion.</p>

<p>For today’s wordle, for example, I ended up learning a whole new word since I did not manage to finish it, assuming it was a word I already knew.</p>

<p>The better way to play Wordle is in your mobile device, most browsers, or at least Firefox and Chromium forks will be able to add it to your home screen by going to their 3 dot menu and tapping on either <code class="language-plaintext highlighter-rouge">Install</code> or <code class="language-plaintext highlighter-rouge">Add to Home Screen</code>, doing this will add an icon to your home screen, and opening it will show the pure website without the browser interface, which is a great plus to make it feel native.</p>

<p>This was today’s wordle for me, I did not manage to complete it this time, but it was quite close!</p>

<p>Wordle 212 X/6</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>⬛🟨🟨⬛⬛
🟨🟨⬛⬛🟨
🟨⬛🟨🟨⬛
⬛⬛🟨🟨🟩
🟩⬛🟨⬛🟩
🟩⬛🟩🟩🟩
</code></pre></div></div>

<p>This has been day 86 of <a href="https//100daystooffload.com">#100DaysToOffload</a>, getting closer and closer to the end of this.</p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="tutorial" /><category term="gaming" /><category term="short" /><summary type="html"><![CDATA[So, a few people even in the Fediverse don't really get what Wordle is, so let me explain it as fast as possible]]></summary></entry><entry><title type="html">Fetch full article content in FreshRSS</title><link href="https://joelchrono.xyz/blog/fetch-full-article-content-freshrss/" rel="alternate" type="text/html" title="Fetch full article content in FreshRSS" /><published>2022-01-10T14:20:57-06:00</published><updated>2022-01-10T14:20:57-06:00</updated><id>https://joelchrono.xyz/blog/fetch-full-article-content-freshrss</id><content type="html" xml:base="https://joelchrono.xyz/blog/fetch-full-article-content-freshrss/"><![CDATA[<p>I won’t bring up any names, wait, maybe I will,
<a href="https://fosstodon.org/@ssafar">@ssafar</a>, why do you make me do this? Do you
find joy in my suffering? This blog is made because of you! I got no time to
load your WebGL rotating cube every time I open your website, fetch everything
please, I beg you, but if you don’t, no need to worry anymore!</p>

<p>Anyways, this is a tutorial made because one of the small caveats with FreshRSS
is the lack of an automatic way to fetch the full content of an article. Sites
like <a href="https://androidpolice.com">Android Police</a>, or of course, <a href="https://simonsafar.com">Simon’s
blog</a> do not give you that, sometimes because they want you to open their
site and show ads, others just because they write pure HTML instead of being
lazy (in the right ways) and let the machine generate stuff for them.</p>

<p>So, why does FreshRSS not come with this option by default? No idea, but it
does have a way to do it, it is just not properly explained anywhere in their
docs, I had to find a french comment mentioned in an <a href="https://github.com/FreshRSS/FreshRSS/issues/785">GitHub thread</a>, so I used
<a href="https://deepl.com">DeepL</a> to translate it and, it was actually not that hard
to do, but I decided to explain it a bit more here.</p>

<h1 id="the-proper-tutorial">The proper tutorial</h1>

<p>Open any article from any website that doesn’t let you fetch full, content,
I’ll go with <a href="https://www.androidpolice.com/2020/05/09/android-police-is-now-on-the-mastodon-social-network/">this random article</a>.</p>

<p>Now, in your browser find a way to open the HTML source code of such website.</p>

<p>Here, everything will depend on the site’s structure, but it should contain a
main <code class="language-plaintext highlighter-rouge">body</code> or <code class="language-plaintext highlighter-rouge">article</code> HTML element, which has the important stuff inside of
it. You should be able to find some id or class that makes it easy to
recognize.</p>

<p>In the case of Android Police, we have this line:</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>&lt;section id="article-body" class="article-body" itemprop="articleBody"&gt;
</code></pre></div></div>

<p>Now, we can go to the management settings of the feed we want, and scroll to
the bottom to the Advanced section, there, you should see an option named
<code class="language-plaintext highlighter-rouge">Article CSS selector on original website</code>. There, you will input the class or
id of the HTML element containing the article content. If you got an id, you
should input <code class="language-plaintext highlighter-rouge">#idname</code>, if its a class, you use <code class="language-plaintext highlighter-rouge">.classname</code>, note the use of
the <code class="language-plaintext highlighter-rouge">#</code> and <code class="language-plaintext highlighter-rouge">.</code> to differentiate them. You can see how it would look here:</p>

<figure class="img">
  <picture>
    <source srcset="/assets/img/blogs/2022-01-11-fetch-article-freshrss-css-setting.webp" type="image/webp" />
    <source srcset="/assets/img/blogs/2022-01-11-fetch-article-freshrss-css-setting.jpg" type="image/jpeg" />
    <img class="mx-auto" src="/assets/img/blogs/2022-01-11-fetch-article-freshrss-css-setting.jpg" alt="" />
  </picture>
  </figure>

<p>If the site is super simple or classless, you might want to go with the HTML
element itself, or a sequence of nested elements, such as <code class="language-plaintext highlighter-rouge">main body</code>, its all
up to the site, so make sure to check properly.</p>

<p>Finally, scroll to the bottom of the settings and click the “Reload articles”
button, to fetch everything again, now you should see the full content instead
of just whatever small portion of text is included in the default feed.</p>

<p>This is how Simon’s website posts look now on my feed:</p>

<figure class="img">
  <picture>
    <source srcset="/assets/img/blogs/2022-01-11-fetch-content-rss-final-result.webp" type="image/webp" />
    <source srcset="/assets/img/blogs/2022-01-11-fetch-content-rss-final-result.jpg" type="image/jpeg" />
    <img class="mx-auto" src="/assets/img/blogs/2022-01-11-fetch-content-rss-final-result.jpg" alt="" />
  </picture>
  </figure>

<p>As you can see, some sites will have small problems like duplicate titles or
maybe even a couple ads showing up in there, but hey, its the full article
instead of some summary that requires me to click one more time. Yes, you might
need to do this whole process with every site you follow that doesn’t have full
content in their feeds, but its kinda cool, maybe FreshRSS will add an easier
way to do this soon enough.</p>

<p>So, this is the 79th post for <a href="https://100DaysToOffload.com">#100DaysToOffload</a>
challenge, thanks again for the inspiration Simon.</p>]]></content><author><name>joelchrono</name><email>me@joelchrono.xyz</email></author><category term="tutorial" /><category term="rss" /><category term="foss" /><category term="selfhost" /><summary type="html"><![CDATA[So, some blogs and sites I follow don't want to display full articles in their RSS feed... fine, I'll do it myself, and also teach you!]]></summary></entry></feed>