Tantek Çelik tantek.com

{
    "type": "entry",
    "published": "2019-10-25 03:52-0700",
    "url": "http://tantek.com/2019/298/t1/lightning-talk-redecentralize-rdc19",
    "category": [
        "rdc19",
        "redecentralize"
    ],
    "content": {
        "text": "Gave a 3min lightning talk @redecentralize #rdc19, show > tell. #redecentralize links shown & words spoken from memory:\n\n* Started with: https://tantek.com/\n\nHi my name is Tantek, the .com is silent. \n\nI\u2019m @t on Twitter when not blocked. I have been posting on my own site instead of Twitter for nearly 10 years now. (https://twitter.com/kevinmarks/status/1187675785978634240)\n\n10 years ago I got frustrated with Twitter and built my own way to post notes, similar to what people take for granted today using Mastodon etc. This is the result.\n\n* https://tantek.com/2019/290/t2/wonderfu-hybrid-indieweb-local-first-meetup\n\nI also post replies, including replies to tweets, from my own site which are then automatically cross-posted to Twitter\n\n* https://twitter.com/t/status/1184919114717917184\n\nand threaded there so I don't have to ask everyone to use my solution. Interoperate with how people work today.\n\n* https://tantek.com/2019/289/t2/orange-sunbeams-npsf\n\nI also post photos on my own site, and similarly automatically send a copy to Twitter:\n\n* https://twitter.com/t/status/1184724799723057152\n\nAlso something people are now doing with decentralized solutions.\n\n* https://tantek.com/2019/303/e1/homebrew-website-club-sf\n\nWhat about events? I post events on my own site, receive federated RSVPs, and cross post the details to Twitter:\n\n* https://twitter.com/t/status/1184919994263453696\n\nIncluding the ability to Add to Calendar to your calendar program, whichever you use, using the ICS standard.\n\nWe heard about a decentralized git issues project, \n\n* https://tantek.com/2019/261/b1/proliferation-manifests-w3c\n\nwell I believe everyone should own their own issues as well, instead of posting them on someone else\u2019s decentralized server, and then syndicate to wherever a project is aggregating their issues, like GitHub:\n\n* https://github.com/w3ctag/design-reviews/issues/423\n\nThis is all made possible through services and standards,\n\n* https://brid.gy/\n\nlike Bridgy. I did not have to write to the GitHub API etc. I used a web standard called Webmention, and Bridgy did the work for me to cross-post.\n\n* https://www.w3.org/TR/webmention/\n\nWebmention is a W3C Recommendation, one of a half dozen we produced during the W3C Social Web Working Group that I chaired.\n\n* https://spec.indieweb.org/\n\nWebmention is now one of many standards maintained by the IndieWeb community, see spec dot indieweb dot org for more.\n\n* https://indiewebify.me/\n\nAnd if you want to get started on the IndieWeb, setting up your site, check out IndieWebify dot me which provides step by step instructions and validators / tests. There\u2019s lots more at indieweb.org. (https://twitter.com/kevinmarks/status/1187674891249733632)\n\n* https://chat.indieweb.org/\n\nLike all the other awesome projects here we have heard about, the IndieWeb community has a chat channel.\n\nIt of course bridges to Matrix, and also Discourse, as well as Slack. (https://twitter.com/kevinmarks/status/1187675021487022082)\n\n* https://indieweb.org/2019/Berlin2\n\nBecause we believe in the value of human interaction and connection we also hold events. I want to invite everyone here to come to an IndieWebCamp in person as well. (https://twitter.com/kevinmarks/status/1187675118199300096)\n\nIf you\u2019re in Europe please checkout IndieWebCamp Berlin November 23-24th.\n\n* https://indieweb.org/2019/SF\n\nAnd if you\u2019re in the States, please join us in IndieWebCamp San Francisco!\n\nAny questions?\n\n(Thanks to @KevinMarks for live-tweeting as much as he could (tweetlinks inline in parentheses) keep up with my rapid speech and tab-switching :)",
        "html": "Gave a 3min lightning talk <a class=\"h-cassis-username\" href=\"https://twitter.com/redecentralize\">@redecentralize</a> #<span class=\"p-category\">rdc19</span>, show &gt; tell. #<span class=\"p-category\">redecentralize</span> links shown &amp; words spoken from memory:<br /><br />* Started with: <a href=\"https://tantek.com/\">https://tantek.com/</a><br /><br />Hi my name is Tantek, the .com is silent. <br /><br />I\u2019m <a class=\"h-cassis-username\" href=\"https://twitter.com/t\">@t</a> on Twitter when not blocked. I have been posting on my own site instead of Twitter for nearly 10 years now. (<a href=\"https://twitter.com/kevinmarks/status/1187675785978634240\">https://twitter.com/kevinmarks/status/1187675785978634240</a>)<br /><br />10 years ago I got frustrated with Twitter and built my own way to post notes, similar to what people take for granted today using Mastodon etc. This is the result.<br /><br />* <a href=\"https://tantek.com/2019/290/t2/wonderfu-hybrid-indieweb-local-first-meetup\">https://tantek.com/2019/290/t2/wonderfu-hybrid-indieweb-local-first-meetup</a><br /><br />I also post replies, including replies to tweets, from my own site which are then automatically cross-posted to Twitter<br /><br />* <a href=\"https://twitter.com/t/status/1184919114717917184\">https://twitter.com/t/status/1184919114717917184</a><br /><br />and threaded there so I don't have to ask everyone to use my solution. Interoperate with how people work today.<br /><br />* <a href=\"https://tantek.com/2019/289/t2/orange-sunbeams-npsf\">https://tantek.com/2019/289/t2/orange-sunbeams-npsf</a><br /><br />I also post photos on my own site, and similarly automatically send a copy to Twitter:<br /><br />* <a href=\"https://twitter.com/t/status/1184724799723057152\">https://twitter.com/t/status/1184724799723057152</a><br /><br />Also something people are now doing with decentralized solutions.<br /><br />* <a href=\"https://tantek.com/2019/303/e1/homebrew-website-club-sf\">https://tantek.com/2019/303/e1/homebrew-website-club-sf</a><br /><br />What about events? I post events on my own site, receive federated RSVPs, and cross post the details to Twitter:<br /><br />* <a href=\"https://twitter.com/t/status/1184919994263453696\">https://twitter.com/t/status/1184919994263453696</a><br /><br />Including the ability to Add to Calendar to your calendar program, whichever you use, using the ICS standard.<br /><br />We heard about a decentralized git issues project, <br /><br />* <a href=\"https://tantek.com/2019/261/b1/proliferation-manifests-w3c\">https://tantek.com/2019/261/b1/proliferation-manifests-w3c</a><br /><br />well I believe everyone should own their own issues as well, instead of posting them on someone else\u2019s decentralized server, and then syndicate to wherever a project is aggregating their issues, like GitHub:<br /><br />* <a href=\"https://github.com/w3ctag/design-reviews/issues/423\">https://github.com/w3ctag/design-reviews/issues/423</a><br /><br />This is all made possible through services and standards,<br /><br />* <a href=\"https://brid.gy/\">https://brid.gy/</a><br /><br />like Bridgy. I did not have to write to the GitHub API etc. I used a web standard called Webmention, and Bridgy did the work for me to cross-post.<br /><br />* <a href=\"https://www.w3.org/TR/webmention/\">https://www.w3.org/TR/webmention/</a><br /><br />Webmention is a W3C Recommendation, one of a half dozen we produced during the W3C Social Web Working Group that I chaired.<br /><br />* <a href=\"https://spec.indieweb.org/\">https://spec.indieweb.org/</a><br /><br />Webmention is now one of many standards maintained by the IndieWeb community, see spec dot indieweb dot org for more.<br /><br />* <a href=\"https://indiewebify.me/\">https://indiewebify.me/</a><br /><br />And if you want to get started on the IndieWeb, setting up your site, check out IndieWebify dot me which provides step by step instructions and validators / tests. There\u2019s lots more at <a href=\"http://indieweb.org\">indieweb.org</a>. (<a href=\"https://twitter.com/kevinmarks/status/1187674891249733632\">https://twitter.com/kevinmarks/status/1187674891249733632</a>)<br /><br />* <a href=\"https://chat.indieweb.org/\">https://chat.indieweb.org/</a><br /><br />Like all the other awesome projects here we have heard about, the IndieWeb community has a chat channel.<br /><br />It of course bridges to Matrix, and also Discourse, as well as Slack. (<a href=\"https://twitter.com/kevinmarks/status/1187675021487022082\">https://twitter.com/kevinmarks/status/1187675021487022082</a>)<br /><br />* <a href=\"https://indieweb.org/2019/Berlin2\">https://indieweb.org/2019/Berlin2</a><br /><br />Because we believe in the value of human interaction and connection we also hold events. I want to invite everyone here to come to an IndieWebCamp in person as well. (<a href=\"https://twitter.com/kevinmarks/status/1187675118199300096\">https://twitter.com/kevinmarks/status/1187675118199300096</a>)<br /><br />If you\u2019re in Europe please checkout IndieWebCamp Berlin November 23-24th.<br /><br />* <a href=\"https://indieweb.org/2019/SF\">https://indieweb.org/2019/SF</a><br /><br />And if you\u2019re in the States, please join us in IndieWebCamp San Francisco!<br /><br />Any questions?<br /><br />(Thanks to <a class=\"h-cassis-username\" href=\"https://twitter.com/KevinMarks\">@KevinMarks</a> for live-tweeting as much as he could (tweetlinks inline in parentheses) keep up with my rapid speech and tab-switching :)"
    },
    "author": {
        "type": "card",
        "name": "Tantek \u00c7elik",
        "url": "http://tantek.com/",
        "photo": "https://aperture-media.p3k.io/tantek.com/acfddd7d8b2c8cf8aa163651432cc1ec7eb8ec2f881942dca963d305eeaaa6b8.jpg"
    },
    "post-type": "note",
    "_id": "5783092",
    "_source": "1",
    "_is_read": true
}

{
    "type": "entry",
    "author": {
        "name": "Neil Mather",
        "url": "https://doubleloop.net/",
        "photo": null
    },
    "url": "https://doubleloop.net/2019/10/24/i-wonder-if-it-posted-just/",
    "published": "2019-10-24T20:44:29+00:00",
    "content": {
        "html": "Replied to <a href=\"https://diggingthedigital.com/how-do-i-posse-to-mastodon-now/\">How do I POSSE to Mastodon now?</a> by an author\n<blockquote>This is what I\u2019m running into to try to make new Indieweb technology as simple to explain as possible. Ryan Barrett did some amazing work and made it possible to connect your own Mastodon account to your site. So you can get likes and replies from Mastodon in the comments of your own site. But you...</blockquote>\n\nI wonder if it posted just the title and the link as it recognised this post as an article type (you can see objectType: article in the logs).\n<p>If you were to create a note then it would post the full content of the note as a toot, I think.</p>",
        "text": "Replied to How do I POSSE to Mastodon now? by an author\nThis is what I\u2019m running into to try to make new Indieweb technology as simple to explain as possible. Ryan Barrett did some amazing work and made it possible to connect your own Mastodon account to your site. So you can get likes and replies from Mastodon in the comments of your own site. But you...\n\nI wonder if it posted just the title and the link as it recognised this post as an article type (you can see objectType: article in the logs).\nIf you were to create a note then it would post the full content of the note as a toot, I think."
    },
    "post-type": "note",
    "_id": "5774568",
    "_source": "1895",
    "_is_read": true
}

{
    "type": "entry",
    "author": {
        "name": "Neil Mather",
        "url": "https://doubleloop.net/",
        "photo": null
    },
    "url": "https://doubleloop.net/2019/10/24/the-way-i-tested-it-is/",
    "published": "2019-10-24T20:16:40+00:00",
    "content": {
        "html": "Replied to <a href=\"https://diggingthedigital.com/how-do-i-posse-to-mastodon-now/\">How do I POSSE to Mastodon now?</a> by an author\n<blockquote>This is what I\u2019m running into to try to make new Indieweb technology as simple to explain as possible. Ryan Barrett did some amazing work and made it possible to connect your own Mastodon account to your site. So you can get likes and replies from Mastodon in the comments of your own site. But you...</blockquote>\n\nThe way I tested it is as you described \u2013 by adding the brid.gy/publish/mastodon link as a custom provider in Syndication Links.\n<p>My own test post wasn\u2019t great though \u2013 it included the link back to my site (even though I have it set not to in Syndication Links), and also included the text \u2018Also on\u2019.</p>\n<p>When I get chance I will test it further, and maybe write a blog post revisiting all the different IndieWeb to Mastodon options!</p>",
        "text": "Replied to How do I POSSE to Mastodon now? by an author\nThis is what I\u2019m running into to try to make new Indieweb technology as simple to explain as possible. Ryan Barrett did some amazing work and made it possible to connect your own Mastodon account to your site. So you can get likes and replies from Mastodon in the comments of your own site. But you...\n\nThe way I tested it is as you described \u2013 by adding the brid.gy/publish/mastodon link as a custom provider in Syndication Links.\nMy own test post wasn\u2019t great though \u2013 it included the link back to my site (even though I have it set not to in Syndication Links), and also included the text \u2018Also on\u2019.\nWhen I get chance I will test it further, and maybe write a blog post revisiting all the different IndieWeb to Mastodon options!"
    },
    "post-type": "note",
    "_id": "5774569",
    "_source": "1895",
    "_is_read": true
}

{
    "type": "entry",
    "published": "2019-10-24T08:20:17-04:00",
    "url": "https://miklb.com/blog/2019/10/24/5330/",
    "syndication": [
        "https://twitter.com/miklb/status/1187343061237587968"
    ],
    "content": {
        "text": "In some personal news, I\u2019ve been accepted into the GitHub Sponsors program & you can now sponsor my work on my IndieWeb Jekyll & WordPress themes or to work on other open source projects. More details soon.",
        "html": "<p>In some personal news, I\u2019ve been accepted into the GitHub Sponsors program &amp; you can now sponsor my work on my IndieWeb Jekyll &amp; WordPress themes or to work on other open source projects. More details soon.\n</p>"
    },
    "post-type": "note",
    "_id": "5764912",
    "_source": "42",
    "_is_read": true
}

Jamie Tanna www.jvt.me

Own Your Content

{
    "type": "entry",
    "published": "2019-10-20T09:29:00+0100",
    "url": "https://www.jvt.me/mf2/2019/10/ma6dz/",
    "category": [
        "indieweb"
    ],
    "bookmark-of": [
        "https://www.zachleat.com/web/own-your-content/"
    ],
    "name": "Own Your Content",
    "author": {
        "type": "card",
        "name": "Jamie Tanna",
        "url": "https://www.jvt.me",
        "photo": "https://www.jvt.me/img/profile.png"
    },
    "post-type": "bookmark",
    "_id": "5751018",
    "_source": "2169",
    "_is_read": true
}

Jeremy Keith adactio.com

{
    "type": "entry",
    "published": "2019-10-22T15:28:29Z",
    "url": "https://adactio.com/links/15994",
    "category": [
        "indieweb",
        "personal",
        "publishing",
        "posse",
        "pesos",
        "microformats",
        "micropub",
        "webmentions",
        "microsub",
        "indieauth",
        "presentation",
        "talk",
        "transcript"
    ],
    "bookmark-of": [
        "https://www.jvt.me/posts/2019/10/20/indieweb-talk/"
    ],
    "content": {
        "text": "The IndieWeb Movement: Owning Your Data and Being the Change You Want to See in the Web \u00b7 Jamie Tanna\n\n\n\nA great introduction to indie web building blocks from Jamie.",
        "html": "<h3>\n<a class=\"p-name u-bookmark-of\" href=\"https://www.jvt.me/posts/2019/10/20/indieweb-talk/\">\nThe IndieWeb Movement: Owning Your Data and Being the Change You Want to See in the Web \u00b7 Jamie Tanna\n</a>\n</h3>\n\n<p>A great introduction to indie web building blocks from Jamie.</p>"
    },
    "author": {
        "type": "card",
        "name": "Jeremy Keith",
        "url": "https://adactio.com/",
        "photo": "https://adactio.com/images/photo-150.jpg"
    },
    "post-type": "bookmark",
    "_id": "5744765",
    "_source": "2",
    "_is_read": true
}

Marty McGuire martymcgui.re

IndieWeb NYC Meetup 2019-10-19 Wrap-Up

{
    "type": "entry",
    "published": "2019-10-21T11:34:08-0400",
    "url": "https://martymcgui.re/2019/10/21/indieweb-nyc-meetup-2019-10-19-wrap-up/",
    "category": [
        "IndieWeb",
        "meetup",
        "HWC",
        "NYC",
        "wrap-up"
    ],
    "name": "IndieWeb NYC Meetup 2019-10-19 Wrap-Up",
    "content": {
        "text": "IndieWeb NYC's meetup for October 2019 met at Think Coffee on Mercer St on October 19th around 2pm.\n  \n\n\n  tiaramiller.com \u2014 Relaunched her site as a Hugo site hosted on Netlify during the recent IndieWebCamp NYC. Since then, has been working on adding features. Set up voxpelli's webpage-micropub-to-github on Heroku and was able to log into Indigenous and create a new like post! webpage-micropub-to-github is designed for Jekyll, so it created the post file in an unexpected place, but she should be able to tweak that and get things working. Also added herself (back) to the IndieWeb Webring.\n  \n\n\n  mfgriffin.com \u2014 Upon some (possibly bad) advice from Marty and Tiara, Matt worked towards hosting his Hugo-powered site via GitHub and Netlify, rather than compiling it on his laptop and uploading the finished HTML to a server. Ran into issues with git submodules, and then a version mismatch between the theme he was using and the version of Hugo on Netlify. He was able to update the published HTML pages to let himself login to indieweb.org to review his todo list, meaning he made it to \"step zero\" on his list of goals for the day.\n  \n\nmartymcgui.re \u2014 Working on indieweb.nyc, a site for IndieWeb events in and around New York City. Mostly spent time on plumbing, setting up a barebones Hugo site and hosting it on Netlify. Keeps finding himself pulled between desires: to get barebones content up, to allow interested folks to add events to their calendar, to work on plumbing that will make it easier to manage events via micropub, and to work on styling, theming, and logo.\nLeft-to-right: tiaramiller.com, mfgriffin.com, martymcgui.re\n  Thanks to everyone who came out and braved the crowded weekend tables. Apparently it was midterms time at NYU? We hope that you'll join us for the next meetup, on November 16th. Watch indieweb.nyc for info about the exact time and location!",
        "html": "<p>\n  <a href=\"https://indieweb.org/events/2019-10-19-homebrew-website-club-nyc\">IndieWeb NYC's meetup for October 2019</a> met at Think Coffee on Mercer St on October 19th around 2pm.\n  <br /></p>\n<p>\n  tiaramiller.com \u2014 Relaunched her site as a Hugo site hosted on <a href=\"https://www.netlify.com/\">Netlify</a> during the recent IndieWebCamp NYC. Since then, has been working on adding features. Set up <a href=\"https://indieweb.org/User:Mfgriffin.com\">voxpelli's webpage-micropub-to-github</a> on <a href=\"https://www.heroku.com/\">Heroku</a> and was able to log into <a href=\"https://indieweb.org/Indigenous_for_Android\">Indigenous</a> and create a new <a href=\"https://indieweb.org/like\">like post</a>! webpage-micropub-to-github is designed for Jekyll, so it created the post file in an unexpected place, but she should be able to tweak that and get things working. Also added herself (back) to the <a href=\"https://xn--sr8hvo.ws/\">IndieWeb Webring</a>.\n  <br /></p>\n<p>\n  mfgriffin.com \u2014 Upon some (possibly bad) advice from Marty and Tiara, Matt worked towards hosting his Hugo-powered site via GitHub and Netlify, rather than compiling it on his laptop and uploading the finished HTML to a server. Ran into issues with git submodules, and then a version mismatch between the theme he was using and the version of Hugo on Netlify. He <i>was</i> able to update the published HTML pages to let himself login to indieweb.org to review <a href=\"https://indieweb.org/User:Mfgriffin.com\">his todo list</a>, meaning he made it to \"step zero\" on his list of goals for the day.\n  <br /></p>\n<p>martymcgui.re \u2014 Working on <a href=\"https://indieweb.nyc/\">indieweb.nyc</a>, a site for IndieWeb events in and around New York City. Mostly spent time on plumbing, setting up a barebones Hugo site and hosting it on Netlify. Keeps finding himself pulled between desires: to get barebones content up, to allow interested folks to add events to their calendar, to work on plumbing that will make it easier to manage events via micropub, and to work on styling, theming, and logo.</p>\n<img src=\"https://media.martymcgui.re/56/70/ec/1c/2967c691a2cdea8c16590733f2d010cf85ba1417972d4a8feff8e130.jpg\" alt=\"Three people crowded around laptops look into the camera, with toothy grins on their faces.\" />Left-to-right: tiaramiller.com, mfgriffin.com, martymcgui.re<p>\n  Thanks to everyone who came out and braved the crowded weekend tables. Apparently it was midterms time at NYU? We hope that you'll join us for the next meetup, on November 16th. Watch <a href=\"https://martymcgui.re/posts/indieweb.nyc\">indieweb.nyc</a> for info about the exact time and location!\n  <br /></p>"
    },
    "author": {
        "type": "card",
        "name": "Marty McGuire",
        "url": "https://martymcgui.re/",
        "photo": "https://martymcgui.re/images/logo.jpg"
    },
    "post-type": "article",
    "_id": "5727471",
    "_source": "175",
    "_is_read": true
}

Jeremy Keith adactio.com

Indy web

{
    "type": "entry",
    "published": "2019-10-21T16:58:47Z",
    "url": "https://adactio.com/journal/15992",
    "category": [
        "maps",
        "mapping",
        "geo",
        "polylines",
        "indiewebcamp",
        "brighton",
        "indieweb",
        "visualisation",
        "static",
        "php",
        "javascript",
        "code",
        "coding",
        "backend",
        "frontend",
        "development"
    ],
    "syndication": [
        "https://medium.com/@adactio/293e9af2af85"
    ],
    "name": "Indy web",
    "content": {
        "text": "It was Indie Web Camp Brighton on the weekend. After a day of thought-provoking discussions, I thoroughly enjoyed spending the second day tinkering on my website.\n\nFor a while now, I\u2019ve wanted to add maps to my monthly archive pages (to accompany the calendar heatmaps I added at a previous Indie Web Camp). Whenever I post anything to my site\u2014a blog post, a note, a link\u2014it\u2019s timestamped and geotagged. I thought it would be fun to expose that in a glanceable way. A map seems like the right medium for that, but I wanted to avoid the obvious route of dropping a load of pins on a map. Instead I was looking for something more like the maps in Indiana Jones films\u2014a line drawn from place to place to show the movement over time.\n\nI talked to Aaron about this and his advice was that a client-side JavaScript embedded map would be the easiest option. But that seemed like overkill to me. This map didn\u2019t need to be pannable or zoomable; just glanceable. So I decided to see if how far I could get with a static map. I timeboxed two hours for it.\n\nAfter two hours, I admitted defeat.\n\nI was able to find the kind of static maps I wanted from Mapbox\u2014I\u2019m already using them for my check-ins. I could even add a polyline, which is exactly what I wanted. But instead of passing latitude and longitude co-ordinates for the points on the polyline, the docs explain that I needed to provide \u2026cur ominous thunder and lightning\u2026 The Encoded Polyline Algorithm Format.\n\nGo to that link. I\u2019ll wait.\n\nDid you read through the eleven steps of instructions? Did you also think it was a piss take?\n\n\n  Take the initial signed value.\n  Multiply it by 1e5.\n  Convert that decimal value to binary.\n  Left-shift the binary value one bit.\n  If the original decimal value is negative, invert this encoding.\n  Break the binary value out into 5-bit chunks.\n  Place the 5-bit chunks into reverse order.\n  OR each value with 0x20 if another bit chunk follows.\n  Convert each value to decimal.\n  Add 63 to each value.\n  Convert each value to its ASCII equivalent.\n  \n\nThis was way beyond my brain\u2019s pay grade. But surely someone else had written the code I needed? I did some Duck Duck Going and found a piece of PHP code to do the encoding. It didn\u2019t work. I Ducked Ducked and Went some more. I found a different piece of PHP code. That didn\u2019t work either.\n\nAt this point, my allotted time was up. If I wanted to have something to demo by the end of the day, I needed to switch gears. So I did.\n\nI used Leaflet.js to create the maps I wanted using client-side JavaScript. Here\u2019s the JavaScript code I wrote.\n\nIt waits until the page has finished loading, then it searches for any instances of the h-geo microformat (a way of encoding latitude and longitude coordinates in HTML). If there are three or more, it generates a script element to pull in the Leaflet library, and a corresponding style element. Then it draws the map with the polyline on it. I ended up using Stamen\u2019s beautiful watercolour map tiles.\n\n\n\n\nThat\u2019s what I demoed at the end of the day.\n\nBut I wasn\u2019t happy with it.\n\nSure, it looked good, but displaying the map required requests for a script, a style sheet, and multiple map tiles. I made sure that it didn\u2019t hold up the loading of the rest of the page, but it still felt wasteful.\n\nSo after Indie Web Camp, I went back to investigate static maps again. This time I did finally manage to find some PHP code for encoding lat/lon coordinates into a polyline that worked. Finally I was able to construct URLs for a static map image that displays a line connecting multiple points with a line.\n\nI\u2019ve put this maps on any of the archive pages that also have calendar heat maps. Some examples:\n\nEverything from August 2019\nNotes from July 2018\nLinks from June 2017\nPhotos from October 2014\nJournal entries from December 2012\nIf you go back much further than that, the maps start to trail off. That\u2019s because I wasn\u2019t geotagging everything from the start.\n\nI\u2019m pretty happy with the final results. It\u2019s certainly far more responsible from a performance point of view. Oh, and I\u2019ve also got the maps inside a picture element so that I can swap out the tiles if you switch to dark mode.\n\nIt\u2019s a shame that I can\u2019t use the lovely Stamen watercolour tiles for these static maps though.",
        "html": "<p>It was <a href=\"https://indieweb.org/2019/Brighton\">Indie Web Camp Brighton</a> on the weekend. After a day of thought-provoking discussions, I thoroughly enjoyed spending the second day tinkering on my website.</p>\n\n<p>For a while now, I\u2019ve wanted to add maps to my <a href=\"https://adactio.com/archive/\">monthly archive pages</a> (to accompany the calendar heatmaps I added at a previous Indie Web Camp). Whenever I post anything to my site\u2014a blog post, a note, a link\u2014it\u2019s timestamped and geotagged. I thought it would be fun to expose that in a glanceable way. A map seems like the right medium for that, but I wanted to avoid the obvious route of dropping a load of pins on a map. Instead I was looking for something more like <a href=\"https://www.youtube.com/watch?v=5TY5Fp6O5iM\">the maps in Indiana Jones films</a>\u2014a line drawn from place to place to show the movement over time.</p>\n\n<p>I talked to <a href=\"https://aaronparecki.com/\">Aaron</a> about this and his advice was that a client-side JavaScript embedded map would be the easiest option. But that seemed like overkill to me. This map didn\u2019t need to be pannable or zoomable; just glanceable. So I decided to see if how far I could get with a static map. I timeboxed two hours for it.</p>\n\n<p>After two hours, I admitted defeat.</p>\n\n<p>I was able to find the kind of <a href=\"https://docs.mapbox.com/api/maps/#static-images\">static maps</a> I wanted from Mapbox\u2014I\u2019m already using them for <a href=\"https://adactio.com/notes/checkins\">my check-ins</a>. I could even <a href=\"https://docs.mapbox.com/api/maps/#overlay-options\">add a polyline</a>, which is exactly what I wanted. But instead of passing latitude and longitude co-ordinates for the points on the polyline, the docs explain that I needed to provide \u2026cur ominous thunder and lightning\u2026 <a href=\"https://developers.google.com/maps/documentation/utilities/polylinealgorithm\">The Encoded Polyline Algorithm Format</a>.</p>\n\n<p>Go to <a href=\"https://developers.google.com/maps/documentation/utilities/polylinealgorithm\">that link</a>. I\u2019ll wait.</p>\n\n<p>Did you read through the eleven steps of instructions? Did you also think it was a piss take?</p>\n\n<blockquote>\n  <ol><li>Take the initial signed value.</li>\n  <li>Multiply it by 1e5.</li>\n  <li>Convert that decimal value to binary.</li>\n  <li>Left-shift the binary value one bit.</li>\n  <li>If the original decimal value is negative, invert this encoding.</li>\n  <li>Break the binary value out into 5-bit chunks.</li>\n  <li>Place the 5-bit chunks into reverse order.</li>\n  <li>OR each value with 0x20 if another bit chunk follows.</li>\n  <li>Convert each value to decimal.</li>\n  <li>Add 63 to each value.</li>\n  <li>Convert each value to its ASCII equivalent.</li>\n  </ol></blockquote>\n\n<p>This was way beyond my brain\u2019s pay grade. But surely someone else had written the code I needed? I did some Duck Duck Going and found a piece of PHP code to do the encoding. It didn\u2019t work. I Ducked Ducked and Went some more. I found a different piece of PHP code. That didn\u2019t work either.</p>\n\n<p>At this point, my allotted time was up. If I wanted to have something to demo by the end of the day, I needed to switch gears. So I did.</p>\n\n<p>I used <a href=\"https://leafletjs.com/\">Leaflet.js</a> to create the maps I wanted using client-side JavaScript. Here\u2019s <a href=\"https://gist.github.com/adactio/60359b27bcf7371698c4fdb3c85d00fe\">the JavaScript code I wrote</a>.</p>\n\n<p>It waits until the page has finished loading, then it searches for any instances of the <code>h-geo</code> microformat (a way of encoding latitude and longitude coordinates in HTML). If there are three or more, it generates a <code>script</code> element to pull in the Leaflet library, and a corresponding <code>style</code> element. Then it draws the map with the polyline on it. I ended up using <a href=\"http://maps.stamen.com/#watercolor\">Stamen\u2019s beautiful watercolour map tiles</a>.</p>\n\n<p><a href=\"https://adactio.com/notes/15990\">\n<img src=\"https://adactio.com/images/uploaded/15990/small.jpg\" alt=\"Had some fun at Indie Web Camp Brighton on the weekend messing around with @Stamen\u2019s lovely watercolour map tiles. (I was trying to create Indiana Jones style travel maps for my site \u2026a different kind of Indy web.)\" /></a></p>\n\n<p>That\u2019s what I demoed at the end of the day.</p>\n\n<p>But I wasn\u2019t happy with it.</p>\n\n<p>Sure, it looked good, but displaying the map required requests for a script, a style sheet, and multiple map tiles. I made sure that it didn\u2019t hold up the loading of the rest of the page, but it still felt wasteful.</p>\n\n<p>So after Indie Web Camp, I went back to investigate static maps again. This time I <em>did</em> finally manage to find <a href=\"https://github.com/emcconville/google-map-polyline-encoding-tool\">some PHP code for encoding lat/lon coordinates into a polyline</a> that worked. Finally I was able to construct URLs for a static map image that displays a line connecting multiple points with a line.</p>\n\n<p>I\u2019ve put this maps on any of the archive pages that also have calendar heat maps. Some examples:</p>\n\n<ul><li><a href=\"https://adactio.com/archive/2019/08\">Everything from August 2019</a></li>\n<li><a href=\"https://adactio.com/notes/archive/2018/07\">Notes from July 2018</a></li>\n<li><a href=\"https://adactio.com/links/archive/2017/06\">Links from June 2017</a></li>\n<li><a href=\"https://adactio.com/notes/photos/2014/10\">Photos from October 2014</a></li>\n<li><a href=\"https://adactio.com/journal/archive/2012/12\">Journal entries from December 2012</a></li>\n</ul><p>If you go back much further than that, the maps start to trail off. That\u2019s because I wasn\u2019t geotagging everything from the start.</p>\n\n<p>I\u2019m pretty happy with the final results. It\u2019s certainly <em>far</em> more responsible from a performance point of view. Oh, and I\u2019ve also got the maps inside a <code>picture</code> element so that I can swap out the tiles if you <a href=\"https://adactio.com/journal/15941\">switch to dark mode</a>.</p>\n\n<p>It\u2019s a shame that I can\u2019t use the lovely Stamen watercolour tiles for these static maps though.</p>"
    },
    "author": {
        "type": "card",
        "name": "Jeremy Keith",
        "url": "https://adactio.com/",
        "photo": "https://adactio.com/images/photo-150.jpg"
    },
    "post-type": "article",
    "_id": "5727346",
    "_source": "2",
    "_is_read": true
}

gRegor Morrill gregorlove.com

{
    "type": "entry",
    "published": "2019-10-20 12:17-0700",
    "url": "https://gregorlove.com/2019/10/hi-i-see-youre/",
    "syndication": [
        "https://twitter.com/gRegorLove/status/1185998602675654658"
    ],
    "content": {
        "text": "@artlung Hi! I see you're a fellow indieweb enthusiast. We should meet up sometime. I was thinking about starting up a SD Homebrew Website Club meetup next year (maybe sooner).",
        "html": "<p>@artlung Hi! I see you're a fellow indieweb enthusiast. We should meet up sometime. I was thinking about starting up a SD Homebrew Website Club meetup next year (maybe sooner).</p>"
    },
    "author": {
        "type": "card",
        "name": "gRegor Morrill",
        "url": "https://gregorlove.com/",
        "photo": "https://gregorlove.com/site/assets/files/3473/profile-2016-med.jpg"
    },
    "post-type": "note",
    "_id": "5713354",
    "_source": "95",
    "_is_read": true
}

Jamie Tanna www.jvt.me

The IndieWeb Movement: Owning Your Data and Being the Change You Want to See in the Web

{
    "type": "entry",
    "summary": "A look at what the IndieWeb is, why you should care, and how to get started with it.",
    "url": "https://www.jvt.me/posts/2019/10/20/indieweb-talk/",
    "name": "The IndieWeb Movement: Owning Your Data and Being the Change You Want to See in the Web",
    "author": {
        "type": "card",
        "name": "Jamie Tanna",
        "url": "https://www.jvt.me",
        "photo": "https://www.jvt.me/img/profile.png"
    },
    "post-type": "article",
    "_id": "5711825",
    "_source": "2169",
    "_is_read": true
}

jvt.me talking IndieWeb at #OggCamp!

Read More

{
    "type": "entry",
    "author": {
        "name": "Neil Mather",
        "url": "https://doubleloop.net/",
        "photo": null
    },
    "url": "https://doubleloop.net/2019/10/20/6299/",
    "published": "2019-10-20T14:37:00+00:00",
    "content": {
        "html": "<a href=\"https://doubleloop.net/2019/10/20/6299/attachment/1571582228176/\"><img src=\"https://doubleloop.net/wp-content/uploads/2019/10/1571582228176-1024x576.jpg\" alt=\"\" /></a>\n<a href=\"https://jvt.me/\">jvt.me</a> talking IndieWeb at #OggCamp!",
        "text": "jvt.me talking IndieWeb at #OggCamp!"
    },
    "post-type": "note",
    "_id": "5709936",
    "_source": "1895",
    "_is_read": true
}

Tantek Çelik tantek.com

{
    "type": "entry",
    "published": "2019-10-20 09:20-0700",
    "url": "http://tantek.com/2019/293/t1/indiewebcamp-brighton-hackday-offline",
    "category": [
        "IndieWebCamp",
        "Brighton:",
        "hackday",
        "serviceworker",
        "offlinesupport:"
    ],
    "content": {
        "text": "#IndieWebCamp #Brighton: \n\nFor my #hackday project I added a #serviceworker to my https://tantek.com/ home page with some #offlinesupport:\n\n1 Custom Offline page\n2 Precache home page, CSS, JS, and cache as you go photos\n3 Precache /contact & /pay pages",
        "html": "#<span class=\"p-category\">IndieWebCamp</span> #<span class=\"p-category\">Brighton:</span> <br /><br />For my #<span class=\"p-category\">hackday</span> project I added a #<span class=\"p-category\">serviceworker</span> to my <a href=\"https://tantek.com/\">https://tantek.com/</a> home page with some #<span class=\"p-category\">offlinesupport:</span><br /><br />1 Custom Offline page<br />2 Precache home page, CSS, JS, and cache as you go photos<br />3 Precache /contact &amp; /pay pages"
    },
    "author": {
        "type": "card",
        "name": "Tantek \u00c7elik",
        "url": "http://tantek.com/",
        "photo": "https://aperture-media.p3k.io/tantek.com/acfddd7d8b2c8cf8aa163651432cc1ec7eb8ec2f881942dca963d305eeaaa6b8.jpg"
    },
    "post-type": "note",
    "_id": "5709879",
    "_source": "1",
    "_is_read": true
}

Jamie Tanna www.jvt.me

Own Your Content

{
    "type": "entry",
    "published": "2019-10-20T09:29:00+0100",
    "url": "https://www.jvt.me/mf2/83dfd3b0-91b3-4b16-854b-2eb25c8ce28c/",
    "category": [
        "indieweb"
    ],
    "bookmark-of": [
        "https://www.zachleat.com/web/own-your-content/"
    ],
    "name": "Own Your Content",
    "author": {
        "type": "card",
        "name": "Jamie Tanna",
        "url": "https://www.jvt.me",
        "photo": "https://www.jvt.me/img/profile.png"
    },
    "post-type": "bookmark",
    "_id": "5703104",
    "_source": "2169",
    "_is_read": true
}

Jeremy Keith adactio.com

{
    "type": "entry",
    "published": "2019-10-20T07:27:28Z",
    "url": "https://adactio.com/links/15988",
    "category": [
        "conference",
        "talk",
        "presentation",
        "video",
        "slides",
        "indieweb",
        "digital",
        "preservation",
        "jamstack",
        "myspacebook",
        "posse",
        "pesos",
        "syndication"
    ],
    "bookmark-of": [
        "https://www.zachleat.com/web/own-your-content/"
    ],
    "content": {
        "text": "Own Your Content on Social Media Using the IndieWeb\u2014zachleat.com\n\n\n\nA terrific\u2014and fun!\u2014talk from Zach about site deaths, owning your own content, and the indie web.\n\nOh, and he really did create MySpaceBook for the talk.",
        "html": "<h3>\n<a class=\"p-name u-bookmark-of\" href=\"https://www.zachleat.com/web/own-your-content/\">\nOwn Your Content on Social Media Using the IndieWeb\u2014zachleat.com\n</a>\n</h3>\n\n<p>A terrific\u2014and fun!\u2014talk from Zach about site deaths, owning your own content, and the indie web.</p>\n\n<p>Oh, and he really did create <a href=\"https://myspacebook.info/\">MySpaceBook</a> for the talk.</p>"
    },
    "author": {
        "type": "card",
        "name": "Jeremy Keith",
        "url": "https://adactio.com/",
        "photo": "https://adactio.com/images/photo-150.jpg"
    },
    "post-type": "bookmark",
    "_id": "5702866",
    "_source": "2",
    "_is_read": true
}

Marty McGuire martymcgui.re

{
    "type": "entry",
    "published": "2019-10-19T15:56:13-0400",
    "url": "https://martymcgui.re/2019/10/19/155613/",
    "photo": [
        "https://res.cloudinary.com/schmarty/image/fetch/w_960,c_fill/https://media.martymcgui.re/a8/06/f3/74/4621cbfae60bd88eb7c555889654bbe30d51472ce00a2582dbe40dff.jpg"
    ],
    "content": {
        "text": "Photo for this afternoon\u2019s IndieWeb NYC Meetup!",
        "html": "<a href=\"https://media.martymcgui.re/a8/06/f3/74/4621cbfae60bd88eb7c555889654bbe30d51472ce00a2582dbe40dff.jpg\"></a>\n\n  <p>Photo for this afternoon\u2019s IndieWeb NYC Meetup!</p>"
    },
    "author": {
        "type": "card",
        "name": "Marty McGuire",
        "url": "https://martymcgui.re/",
        "photo": "https://martymcgui.re/images/logo.jpg"
    },
    "post-type": "photo",
    "_id": "5700825",
    "_source": "175",
    "_is_read": true
}

Aaron Parecki aaronparecki.com

{
    "type": "entry",
    "published": "2019-10-19T23:58:12+01:00",
    "url": "https://aaronparecki.com/2019/10/19/31/konami",
    "category": [
        "indiewebcamp"
    ],
    "content": {
        "text": "Getting a head start on IndieWebCamp Brighton hack day! If you are on any page on my website and enter the Konami code, you will get a very small surprise. \ud83d\ude06",
        "html": "Getting a head start on IndieWebCamp Brighton hack day! If you are on any page on my website and enter the Konami code, you will get a very small surprise. <a href=\"https://aaronparecki.com/emoji/%F0%9F%98%86\">\ud83d\ude06</a>"
    },
    "author": {
        "type": "card",
        "name": "Aaron Parecki",
        "url": "https://aaronparecki.com/",
        "photo": "https://aperture-media.p3k.io/aaronparecki.com/741d0132e0de1c12b23781d728ada702dc3111ea9ca4b21563eb2445cbf7ebd2.jpg"
    },
    "post-type": "note",
    "_id": "5700639",
    "_source": "16",
    "_is_read": true
}

Jamie Tanna www.jvt.me

Introducing a Microformats API for Eventbrite: eventbrite-mf2.jvt.me

{
    "type": "entry",
    "summary": "Announcing the Microformats translation layer for Eventbrite.com/Eventbrite.co.uk events.",
    "url": "https://www.jvt.me/posts/2019/10/19/microformats-eventbrite/",
    "name": "Introducing a Microformats API for Eventbrite: eventbrite-mf2.jvt.me",
    "author": {
        "type": "card",
        "name": "Jamie Tanna",
        "url": "https://www.jvt.me",
        "photo": "https://www.jvt.me/img/profile.png"
    },
    "post-type": "article",
    "_id": "5700413",
    "_source": "2169",
    "_is_read": true
}

Tantek Çelik tantek.com

{
    "type": "entry",
    "published": "2019-10-19 10:06-0700",
    "url": "http://tantek.com/2019/292/t6/localfirst-offlinefirst-local-offline",
    "category": [
        "LocalFirst",
        "OfflineFirst",
        "NoCloud",
        "multidevices",
        "Brighton",
        "IndieWeb",
        "hackday"
    ],
    "in-reply-to": [
        "https://tantek.com/2019/292/t5/indiewebcamp-brighton-local-offline"
    ],
    "content": {
        "text": "#LocalFirst #OfflineFirst #NoCloud #multidevices @IndieWebCamp #Brighton notes: https://indieweb.org/2019/Brighton/localoffline\n\nThanks @aaronpk @martijnvdven @adactio @calum_ryan @sebsel @HeNeArXn @petermolnar @qubyte for the discussion! \n\nSee you at #IndieWeb #hackday tomorrow!",
        "html": "#<span class=\"p-category\">LocalFirst</span> #<span class=\"p-category\">OfflineFirst</span> #<span class=\"p-category\">NoCloud</span> #<span class=\"p-category\">multidevices</span> <a class=\"h-cassis-username\" href=\"https://twitter.com/IndieWebCamp\">@IndieWebCamp</a> #<span class=\"p-category\">Brighton</span> notes: <a href=\"https://indieweb.org/2019/Brighton/localoffline\">https://indieweb.org/2019/Brighton/localoffline</a><br /><br />Thanks <a class=\"h-cassis-username\" href=\"https://twitter.com/aaronpk\">@aaronpk</a> <a class=\"h-cassis-username\" href=\"https://twitter.com/martijnvdven\">@martijnvdven</a> <a class=\"h-cassis-username\" href=\"https://twitter.com/adactio\">@adactio</a> <a class=\"h-cassis-username\" href=\"https://twitter.com/calum_ryan\">@calum_ryan</a> <a class=\"h-cassis-username\" href=\"https://twitter.com/sebsel\">@sebsel</a> <a class=\"h-cassis-username\" href=\"https://twitter.com/HeNeArXn\">@HeNeArXn</a> <a class=\"h-cassis-username\" href=\"https://twitter.com/petermolnar\">@petermolnar</a> <a class=\"h-cassis-username\" href=\"https://twitter.com/qubyte\">@qubyte</a> for the discussion! <br /><br />See you at #<span class=\"p-category\">IndieWeb</span> #<span class=\"p-category\">hackday</span> tomorrow!"
    },
    "author": {
        "type": "card",
        "name": "Tantek \u00c7elik",
        "url": "http://tantek.com/",
        "photo": "https://aperture-media.p3k.io/tantek.com/acfddd7d8b2c8cf8aa163651432cc1ec7eb8ec2f881942dca963d305eeaaa6b8.jpg"
    },
    "post-type": "reply",
    "refs": {
        "https://tantek.com/2019/292/t5/indiewebcamp-brighton-local-offline": {
            "type": "entry",
            "url": "https://tantek.com/2019/292/t5/indiewebcamp-brighton-local-offline",
            "name": "Tantek\u2019s note",
            "post-type": "article"
        }
    },
    "_id": "5699225",
    "_source": "1",
    "_is_read": true
}

Tantek Çelik tantek.com

{
    "type": "entry",
    "published": "2019-10-19 06:48-0700",
    "url": "http://tantek.com/2019/292/t5/indiewebcamp-brighton-local-offline",
    "category": [
        "IndieWebCamp",
        "localoffline",
        "LocalFirst",
        "OfflineFirst"
    ],
    "content": {
        "text": "#IndieWebCamp Brighton:\nI proposed and am facilitating a session on:\nLocal first vs.\nOffline first vs.\nno cloud,\nand multidevices.\n\n#localoffline\n\nWhat\u2019s the difference between #LocalFirst & #OfflineFirst?\n\netc.",
        "html": "#<span class=\"p-category\">IndieWebCamp</span> Brighton:<br />I proposed and am facilitating a session on:<br />Local first vs.<br />Offline first vs.<br />no cloud,<br />and multidevices.<br /><br />#<span class=\"p-category\">localoffline</span><br /><br />What\u2019s the difference between #<span class=\"p-category\">LocalFirst</span> &amp; #<span class=\"p-category\">OfflineFirst</span>?<br /><br />etc."
    },
    "author": {
        "type": "card",
        "name": "Tantek \u00c7elik",
        "url": "http://tantek.com/",
        "photo": "https://aperture-media.p3k.io/tantek.com/acfddd7d8b2c8cf8aa163651432cc1ec7eb8ec2f881942dca963d305eeaaa6b8.jpg"
    },
    "post-type": "note",
    "_id": "5699226",
    "_source": "1",
    "_is_read": true
}

Tantek Çelik tantek.com

{
    "type": "entry",
    "published": "2019-10-19 02:12-0700",
    "url": "http://tantek.com/2019/292/t4/indiewebcamp-brighton-remote-participation",
    "category": [
        "IndieWebCamp"
    ],
    "content": {
        "text": "#IndieWebCamp Brighton intro demos:\nlive blog: https://chat.indieweb.org/ \nZoom video: https://zoom.us/j/4955358768\n\nCan\u2019t make it in person? We have remote participation with streams of talks, discussions, chat / IRC / Slack!\n\nDetails: https://indieweb.org/2019/Brighton#Remote_Participation",
        "html": "#<span class=\"p-category\">IndieWebCamp</span> Brighton intro demos:<br />live blog: <a href=\"https://chat.indieweb.org/\">https://chat.indieweb.org/</a> <br />Zoom video: <a href=\"https://zoom.us/j/4955358768\">https://zoom.us/j/4955358768</a><br /><br />Can\u2019t make it in person? We have remote participation with streams of talks, discussions, chat / IRC / Slack!<br /><br />Details: <a href=\"https://indieweb.org/2019/Brighton#Remote_Participation\">https://indieweb.org/2019/Brighton#Remote_Participation</a>"
    },
    "author": {
        "type": "card",
        "name": "Tantek \u00c7elik",
        "url": "http://tantek.com/",
        "photo": "https://aperture-media.p3k.io/tantek.com/acfddd7d8b2c8cf8aa163651432cc1ec7eb8ec2f881942dca963d305eeaaa6b8.jpg"
    },
    "post-type": "note",
    "_id": "5696292",
    "_source": "1",
    "_is_read": true
}