{"id":61,"date":"2017-05-15T19:05:17","date_gmt":"2017-05-15T19:05:17","guid":{"rendered":"http:\/\/www.giacomomiceli.com\/blog\/?p=61"},"modified":"2018-04-22T19:09:16","modified_gmt":"2018-04-22T19:09:16","slug":"8-bit-color-cycling-time-aware-live-wallpapers-by-mark-ferrari","status":"publish","type":"post","link":"https:\/\/jamez.it\/blog\/2017\/05\/15\/8-bit-color-cycling-time-aware-live-wallpapers-by-mark-ferrari\/","title":{"rendered":"8-bit color cycling time-aware live wallpapers by Mark Ferrari"},"content":{"rendered":"<p>&nbsp;<\/p>\n<p>A few days ago I stumbled upon\u00a0the fantastic <a href=\"http:\/\/www.effectgames.com\/demos\/worlds\/\" target=\"_blank\" rel=\"noopener noreferrer\">Seize The Day 24 Hour Palette Art Gallery<\/a> by Mark Ferrari and converted to HTML5 by Joseph Huckaby. As we all know 8-bit art is awesome: as soon as I saw the impressive collection of landscapes I decided I had to place them somewhere close to my eyes so that I could gorge on them continuously. Each landscape\u00a0matches a different month of the year and all of them feature a fancy palette cycling that animates the scene in a loop and also shows different illumination according to the time of the day. I thought this would make a perfect animated live wallpaper. Kind of like\u00a0f.lux but with a retro, pixelated heart.<\/p>\n<p>This all started as a Sunday afternoon project, but it turned out to take a bit longer mostly because I dig using Linux. One of my goals was to reach some degree of compatibility across\u00a0different OSs and sure enough, the HTML5\u00a0visualizations can be placed as a Desktop wallpaper very easily on Windows and macOS. Just install one of the dedicated applications that let you use a web page as a wallpaper, point it to the address and it&#8217;s done.<\/p>\n<p>Some of the scenes can palette-cycle through different weather condition, so I added a function that checks the location of the client and matches the scene with the current weather, when available. I also sacrificed a bit the refresh rate of the visualization for the sake of reaching a CPU usage that I could accept. Currently this live wallpaper is costing me between 4\u00a0and 8% load of one CPU of my quad core laptop. If you too are interested in sacrificing a few CPU cycles for some top notch 8-bit art, follow the Howto below.<\/p>\n<p><strong>macOS Howto<\/strong><\/p>\n<p>Install <a href=\"https:\/\/itunes.apple.com\/us\/app\/desktopr-free-make-wallpaper-from-any-website\/id547104940\" target=\"_blank\" rel=\"noopener noreferrer\">Desktopr<\/a>. Open it, feel free to remove the placeholder URLs and add a new one: <a href=\"http:\/\/www.jamez.it\/8bit-wallpaper\/\" target=\"_blank\" rel=\"noopener noreferrer\">http:\/\/www.jamez.it\/8bit-wallpaper\/<\/a> and you&#8217;re done.<\/p>\n<p><strong>Windows Howto<\/strong><\/p>\n<p>Install <a href=\"http:\/\/store.steampowered.com\/app\/431960\/Wallpaper_Engine\/\" target=\"_blank\" rel=\"noopener noreferrer\">Wallpaper Engine<\/a>. Open it, select Open From URL, paste\u00a0<a href=\"http:\/\/www.jamez.it\/8bit-wallpaper\/\" target=\"_blank\" rel=\"noopener noreferrer\">http:\/\/www.jamez.it\/8bit-wallpaper\/<\/a> and you&#8217;re done.<\/p>\n<p><strong>Linux Howto<\/strong><\/p>\n<p>There&#8217;s a plethora of Window Managers, each with their quirks and strangeness. In order to place a browser window on my Desktop background, I ended up using <a href=\"https:\/\/github.com\/lmartinking\/webscreensaver\" target=\"_blank\" rel=\"noopener noreferrer\">WebScreensaver<\/a>, a python script that uses WebKit to create an\u00a0interfaceless browser window, and\u00a0<a href=\"https:\/\/shantanugoel.com\/2008\/09\/03\/shantz-xwinwrap\/\" target=\"_blank\" rel=\"noopener noreferrer\">XWinWrap<\/a>, a utility that shows its wrinkles, but still manages to display said window on your desktop under certain conditions.<\/p>\n<p>What are those conditions? You must use <a href=\"https:\/\/mate-desktop.org\/\" target=\"_blank\" rel=\"noopener noreferrer\">MATE window manager <\/a>which luckily is one of my favorite\u00a0WM, or accept to face all sort of glitches. I am a Desktop-with-icons kinda guy (I know, GUIs are for wimps anyways) and XWinWrap with Gnome Classic, Gnome3, Xfce and KDE couldn&#8217;t deal with the right z-axis (thus hiding my icon layer) or downright refused to remain sticky. The only issue I couldn&#8217;t fix yet using MATE is that any icon ending behind the visualization remains hidden there. Luckily I tend to keep my icons close to the edges, forming a canvas of sorts, so this was never a problem. You can wrap everything together with a script that fires on Startup.<\/p>\n<pre class=\"brush: bash; title: ; notranslate\" title=\"\">\r\n#!\/bin\/bash\r\n#give the script some sleeping time, otherwise the Desktop won't be initialized and the wallpaper will fail to launch\r\nsleep 4; xwinwrap -d &quot;x-caja-desktop&quot; -ov -g 650x530+600+250 -- \/usr\/lib\/xscreensaver\/webscreensaver -url &quot;http:\/\/www.jamez.it\/8bit-wallpaper\/&quot; -window-id WID\r\n<\/pre>\n<p><strong>Bonus points<\/strong><\/p>\n<p>You can pass some parameters to the address for extra goodies.<\/p>\n<blockquote><p><a href=\"http:\/\/www.jamez.it\/8bit-wallpaper\/?view=september\" target=\"_blank\" rel=\"noopener noreferrer\">http:\/\/www.jamez.it\/8bit-wallpaper\/?view=september<\/a><\/p><\/blockquote>\n<p>forces to load a specific view. Views for December and March are a bit weak because half the canvas was designed to accommodate for <a href=\"http:\/\/everonward.webs.com\/seizetheday.htm\" target=\"_blank\" rel=\"noopener noreferrer\">Seize The Day<\/a> calendar utility, <em>a truly marvelous program from 1994 &#8211; way ahead of its time, and timeless still.\u00a0<\/em>If you want to skip to a specific month just specify the name, for istance &#8220;view=september&#8221;. If you don&#8217;t want to limit your choice to time-synchronized views, try &#8220;view=random&#8221;. With that option on, every three hours a new\u00a0view will be loaded from a special pool of non-time-synchronized views.<\/p>\n<blockquote><p><a href=\"http:\/\/www.jamez.it\/8bit-wallpaper\/?zoom=true\" target=\"_blank\" rel=\"noopener noreferrer\">http:\/\/www.jamez.it\/8bit-wallpaper\/?zoom=true<\/a><\/p><\/blockquote>\n<p>Normally the canvas loaded uses the native resolution of 640&#215;480. Force stretch view to full available space with this parameter.<\/p>\n<blockquote><p><a href=\"http:\/\/www.jamez.it\/8bit-wallpaper\/?place=Miami,Florida\" target=\"_blank\" rel=\"noopener noreferrer\">http:\/\/www.jamez.it\/8bit-wallpaper\/?place=Miami,Florida<\/a><\/p><\/blockquote>\n<p>Forces a specific client location to load current Weather report from. Useful when geolocation fails.<\/p>\n<p>Obviously the parameters can be concatenated:<\/p>\n<blockquote><p><a href=\"http:\/\/www.jamez.it\/8bit-wallpaper\/?view=february&amp;place=berlin,germany&amp;zoom=true\" target=\"_blank\" rel=\"noopener noreferrer\">http:\/\/www.jamez.it\/8bit-wallpaper\/?view=february&amp;place=berlin,germany&amp;zoom=true<\/a><\/p><\/blockquote>\n<p>Enjoy!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In which I am totally hypnotized by the retro art from the illustrator of Monkey-Islandian memory and set on a mission to have it always close to my eyes. &#8230;<\/p>\n<p><a class=\"understrap-read-more-link button button-black\" href=\"https:\/\/jamez.it\/blog\/2017\/05\/15\/8-bit-color-cycling-time-aware-live-wallpapers-by-mark-ferrari\/\">Continue Reading &rarr;<\/a><\/p>\n","protected":false},"author":1,"featured_media":71,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[1],"tags":[11,23,78,10],"_links":{"self":[{"href":"https:\/\/jamez.it\/blog\/wp-json\/wp\/v2\/posts\/61"}],"collection":[{"href":"https:\/\/jamez.it\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jamez.it\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jamez.it\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/jamez.it\/blog\/wp-json\/wp\/v2\/comments?post=61"}],"version-history":[{"count":27,"href":"https:\/\/jamez.it\/blog\/wp-json\/wp\/v2\/posts\/61\/revisions"}],"predecessor-version":[{"id":533,"href":"https:\/\/jamez.it\/blog\/wp-json\/wp\/v2\/posts\/61\/revisions\/533"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/jamez.it\/blog\/wp-json\/wp\/v2\/media\/71"}],"wp:attachment":[{"href":"https:\/\/jamez.it\/blog\/wp-json\/wp\/v2\/media?parent=61"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jamez.it\/blog\/wp-json\/wp\/v2\/categories?post=61"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jamez.it\/blog\/wp-json\/wp\/v2\/tags?post=61"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}