I made some Ghost Emoji, from rmoravcik’s design.
Printed on a Flashforge Adventurer 3 Lite in mostly white filament from Hatchbox. We used sparkle black PLA for the eyes, and the tongues in the FlashForge red sample that came with the printer.
I printed without supports, so the bottom of each ghost needed a bit of cleanup. I also found the tolerances for the eyes too tight, so I shrank them by 5% and those fit great.
I’ve sent some of these to the co-ghosts of GHOST PARTY 👻🎉!
I feel the spirits calling me … to savings! What a deal to have GHOST PARTY 👻🎉 partner with BloodReads!
Two amazing GHOST PARTY 👻🎉 shows this weekend! As usual we celebrated the spooky atmosphere of October with a time travel trip back to an 80s high-school homecoming and a whole show about sports.
Thanks to everyone who came out to watch (and get pulled into a dance party). Thanks to Lighting Dragon Design for the Saturday night laze and haze magic. Thanks to all of our amazing performers and support ghosts, who put so much faith in us. And the most special of thanks to Kim Le and Julia Hall who are the best co-ghost and ghost wranglers possible.
Acolytes! Keep your calendars clear! Beatrice and Derek will call another meeting soon! 👻🎉
Ain’t no party like a 👻🎉!
Come help GHOST PARTY put on a festival so important it’s like our lives depend on it!
This post gives more technical detail for the recent talk that I gave at Bring-a-Hack NYC. In it, I describe a system that copies posts from Ghost Party's Instagram automatically to the Ghost Party Website at ghostparty.today.
This roughly works like so:
One missing step in that rough outline is the bit where we tell OwnYourGram *how* to post to our site via Micropub, as well as making sure that OwnYourGram can prove that we have given it permission to post there. Many Micropub clients support IndieAuth as a way to do this permission-granting step (known as authorization). With a typical personal website, I'd delegate this process to indieauth.com, which lets you offload the step of "proving" that you own the website where you're trying to post by instead letting you log into an existing social network account.
ghostparty.today is a shared website, so I thought a simpler way to approach this would be to create a custom authorization endpoint that accepts a password. I could give this password to other GHOST PARTY folks and they can post whatever they like.
Some nice folks in the IndieWeb community had already created an authorization endpoint that works this way, called selfauth. I created a pretty simplistic port of selfauth from PHP to JavaScript using NodeJS on the awesome Glitch social code hosting platform. It needs some more robust error checking, and some micropub clients seem to have trouble with it, but it works with OwnYourGram and Quill, so it's Good Enough for now!
If you're interested, you can find the source for this endpoint here: https://glitch.com/edit/#!/befitting-price
Finally, there's the Micropub endpoint itself. I based mine off of this Glitch micropub project, created by Adam Bachman at IndieWebCamp Baltimore this year. Specfically, I took the bits that verify the access token. From there, it was a matter of stumbling through various bits of handling a Micropub post, pulling in extra libraries as I needed them. I slowly added support for saving uploaded files to our Neocities site via the Neocities API, then for generating an HTML snippet for the new post, and finally for adding the post to the site's main page.
The process for adding the generated post content to the site itself is extremely retro. The Micropub endpoint actually downloads the HTML from https://ghostparty.today/index.html. Inside there is a comment that looks like:
<!-- NEW POSTS BELOW -->
So the new contents for index.html is everything before the comment, the comment, the new content, and then everything after the comment. Once that's constructed, the endpoint uploads index.html back to Neocities with the new contents.
You can find the source for the Micropub endpoint here: https://glitch.com/edit/#!/prism-dirt
It should be possible to fork the project on Glitch and configure it to work with your own Neocities site! You'll need to use cURL with the Neocities API to generate an authorization token to configure the app, rather than saving username and password info in the project!
The GHOST PARTY site follows an extremely old-school publishing model where each post only exists as a small section of HTML on a single long page. This complicates things a bit because interacting with posts on the IndieWeb typically requires three things:
Microformats2 parsers like X-Ray do a great job at parsing HTML page into meaningful data, but the programs that use the parsed data usually stop at the first thing they find. So, if I ask X-Ray to parse https://ghostparty.today/, this is what it sees:
{
"data":{
"type":"card",
"name":"GHOST PARTY",
"url":"https://ghostparty.today/",
"photo":"https://ghostparty.neocities.org/ghost-party-logo.png"
},
"url":"https://ghostparty.today/",
"code":200
}
This is great in that it contains the "identity" information that we want the page to have. However, that page also has a feed! How can I get at that? By telling X-Ray to only look at a fragment of the page! Here's how X-Ray sees https://ghostparty.today/#feed:
{
"data":{
"type":"feed",
"items":[
{
"type":"entry",
"published":"2018-03-07T16:44:16+00:00",
"url":"https://ghostparty.today/#2018-03-07-181020",
"photo":["https://ghostparty.today/uploads/2018-03-07/181020-ig0LN1JG.jpg"],
"content":{"text":"snow day selfie #snowday #snowfie #ghoststories"}
},
{
"type":"entry",
...
},
...
],
"url":"https://ghostparty.today/#feed",
"code":200,
"info":{"found_fragment":true}
}
}
Data! Nice! So if we want to follow ghostparty.today with an indie reader, we use https://ghostparty.today/#feed as the URL.
Looking at the content of the feed, you'll notice that the individual items have a url property which also has a fragment ID in the URL. This allows IndieWeb sites to interact with a particular post, even though it's one of many on the same page. For example, I was able to create an RSVP post to the most recent Ghost Party show, and (by looking just at the content in the fragment at https://ghostparty.today/#show-2018-02-14) my site was able to pick up the machine-readable details about the event to display them on my own site.
The microformats markup for the h-card and h-feed are built into the index.html file itself and don't change very often. However, for each new micropub post we need to convert those properties into a chunk of HTML for the index.html page that also contains the microformats h-entry markup. To do this, I made this Handlebars template:
{% raw %}<div class="h-entry" id="{{ mp-slug }}">
<a class="u-author" href="/"></a>
<a class="u-url" href="#{{ mp-slug }}">{{#if name}}<h2 class="p-name">{{ name }}</h2>{{/if}}</a>
<time class="dt-published" datetime="{{ published }}"></time>
{{#if video}}
{{#each video}}
<video controls loop class="u-video" src="{{ . }}"></video>
{{/each}}
{{ else }}
{{#each photo}}
<img class="u-photo" src="{{ . }}" />
{{/each}}
{{#each audio}}
<audio class="u-audio" src="{{ . }}"></audio>
{{/each}}
{{/if}}
<div class="e-content">{{ content }}</div>
</div>
<img src="ghosts.gif" />
{% endraw %}Not so bad!
Here's a collection of some of the other libraries and docs I used to pull this thing together:
This post is a rough summary of a lightning talk that I gave on February 28th at the Bring-A-Hack NYC with Hackaday + Ultimaker + New Lab. Many thanks to Shayna Gentiluomo for organizing and sometimes co-conspirator Matt Griffin for nudging me to speak!
I have a lot of distrust for social silos like Facebook and Twitter which draw us in with the promise of connecting with family, friends, and interesting people, but I sometimes have trouble articulating that in a succinct way. Thankfully, I saw a perfect example this morning:
Posting on the @facebook website is not working in Mac OS today. JavaScript eats CSS & HTML, making data entry field disappear except for a spookily disembodied close-box X. Been this way a few hours. — @zeldman, 9:53 AM - 28 Feb 2018
Some Facebook team pushed an (untested?) update which broke the website, preventing some users from posting. "Move fast and break things". These silos don't value us or our content. So, we should get out. But what is the alternative?
The IndieWeb helps us take our content back, by posting to our own websites on our own domains. With some work, we can even get the benefits of these social networks and take our conversations with us. There’s a whole lot of great stuff on the IndieWeb website, so go spend a couple of days reading it. But I’m not here to talk about all those good things today. I’m here to talk about how I used them to do a dumb hack.
ghostparty.today is a website for Ghost Party – an improv project that has a ... certain aesthetic. Specifically the website was pitched as “exactly like the Heaven’s Gate website” but we compromised on “extreme Geocities”.
My Ghost Party co-host (co-ghost) built the first version of the site on Neocities.org, a lovely hosting provider that recaptures the feel of editing raw HTML directly in your browser. However, hand-editing HTML gets exhausting and sometimes you just want to post things to Instagram (and, of course, Ghost Party has an Instagram).
And Instagram is fine as a marketing platform! Lots of people look at it and like the pictures. But what about our website? Our aesthetic?
Micropub is a standard (and now W3C Recommendation) designed over some years of practice from the IndieWeb community that defines a way for apps and clients to easily make new posts to any website (even yours) if it supports Micropub.
I used Glitch, an amazing community and JavaScript-server-app hosting service, to make a simple micropub service for ghostparty.today.
It accepts posts via micropub, including file uploads, and uses the Neocities API (hey, it’s not the 90s! Neocities has an API!) to upload the files to our website. Then, it fetches our site’s index.html, adds the content of the new post, and uploads it back. You can find the source here on Glitch and fork it for your own purposes!
Now that our site supports micropub, we can make use of a wonderful service called OwnYourGram. Once we give OwnYourGram permission to post to our site and read our Instagram feed, it will poll our Instagram account and copy each new post back to our website, where we can display it however we want.
We can go a step further, using an IndieWeb building block called Webmention and a service called brid.gy, to bring all of those responses, those Instagram and Facebook likes and comments, Twitter retweets, and more, back to our site for display.
And to show how it works, here’s a micropub client call Quill that works for any micropub-enabled site. Let’s make a quick post, now!
Once we hit the "Post" button and refresh the homepage, we can see the new post on the site!
This was the end of time time. I would have like to further encourage folks to check out Homebrew Website Clubs in their own communities, or to start one if they don't exist. They're part show-and-tell, part support group, and part mad science lab for people who love the web!
Every GHOST PARTY 👻🎉 show is special, and this one may be the most special yet.
Please join us to celebrate… love? Probably?
