New blog post: "Introducing Pinafore for Mastodon" https://nolanlawson.com/2018/04/09/introducing-pinafore-for-mastodon/
@nolan Oh. :(
@lychee It works for me? Which browser are you using?
@nolan Firefox. My bad, though. Look what happened.
@lychee Hmmmm, looks like it thinks mstdn.io itself is a third-party tracker? Pinafore has to use cross-origin requests in order to hook into instances, so I think you might have to just disable Privacy Badger for Pinafore.
Kind of ironic, since Pinafore has zero trackers... 😕
@nolan Hehe, moving the toggle to the middle worked.
@lychee I should add a note to the readme. That's an unfortunate bug. 😞
@nolan If you do, maybe update the error message with a link to the readme?
Pinafore is an alternative web client for Mastodon that I'm releasing today. The goal is to make a lightweight standalone web app that can plug into multiple instances, with a UI focused on speed and simplicity.
Pinafore is still beta-quality in places, but it's already the main client @ElfLord and I have been using for the past few weeks. I've been working on it since the start of this year. Hope y'all like it. 😊
@nolan Ohhh! This is fantastic! :)
@selfagency Svelte is awesome. I could probably write a whole blog post about how much I love Svelte. It's similar to VueJS but does a really good job of compiling down to a "minimal" JS frontend.
@nolan awesome. can't wait to give it a go. out of curiosity, why not have a dropdown menu to switch between instances in pinafore instead of burying it under settings? also, what about a merged TL that has all instances and lets you choose which account to write/reply from when tooting, including multiple accts, like buffer?
@selfagency Easier instance switching is on the roadmap. I think you should be able to tap your profile picture to switch between them. https://github.com/nolanlawson/pinafore/issues/11
@nolan I'm giving it a try now, works great in Firefox on Android ☺ My only comment atm is that there's no obvious way to jump back to the top of a feed after you've been scrolling for a while.
@kepstin Yep, I think I'm going to make it so you can tap the nav button to get back up to the top. Agreed it needs fixing: https://github.com/nolanlawson/pinafore/issues/21
@ambassador @ElfLord In theory you can run `sapper export` to just output a set of static files. In practice, I need to upgrade to the latest version of Sapper in order to enable this, and plus there is some stuff that just can't work statically without some nginx/apache magic (namely dynamic routes, e.g. /tags/myCoolHashtag).
We have a static web host for artodon/haclyon 😉
Pinafore looks amazing as well. We could see it being a semi-instagram like UI which... kind of our 'killer feature' 😉
(note: we're not asking you to adapt pinafore in any way, just hoping to support the project via a deployment / similar if it makes sense for us)
@ambassador @ElfLord Standalone mobile apps are on my roadmap as a possible future feature: https://github.com/nolanlawson/pinafore#goals-and-non-goals . I do really like that it's "just" a website though. 😊
@nolan @ElfLord I'm actually less concerned about the 'stand alone app' and more about a way to get an instagram like experience 😉
I think I'm going to be deploying a test instance of this shortly to see if it feels like a photo first browser for our instance. (Based on the screen grabs... I think this is darn close to what we've wanted for awhile).
@ambassador
Hey, I'm actually currently working on an instagram-like federated social network called Fontina. I wasn't aware your instance existed until just now, but I would love to see if I could work with y'all to make sure it's great for photographers as well as your average user.
It's still in a very early stage, but I feel it's fairly important to make sure it's welcoming to communities like yours
@nolan holy shit its fast. well done
On a Pixel as FF PWA <3
Where can I start contributing to get a black theme/🌃 mode :D
@rabimba @soapdog @ElfLord I've opened up some issues around theming; it's been a popular request so far! :) https://github.com/nolanlawson/pinafore/issues/12 https://github.com/nolanlawson/pinafore/issues/32
@nolan Looks awesome! Would it be practical to embed the server in a mobile app and make it entirely stand-alone?
@kemonine @bea @jaycie Allowing instances to self-host as an alternative frontend where you're automatically signed in is a possible future goal, but right now it's not quite there yet due to having a separate auth system from Mastodon. https://github.com/nolanlawson/pinafore/issues/35
@nolan
W
O
O
O
T
!!
As noticed by @lychee, it seems Privacy Badger doesn't play nice with Pinafore. It thinks your instance is a "third-party tracker" because of the cross-origin requests. 🙃 https://github.com/nolanlawson/pinafore/issues/23
The only fix is to disable Privacy Badger for Pinafore apparently. Sorry about that; if anyone knows of any workaround please do let me know.
Really love the Mastodon community. Pinafore still has plenty of bugs and missing features, but folks have been super positive in the responses. Makes me want to keep working on it! 😊
@nolan yes please do!
Thanks a ton
@nolan its such a wonderful start, you've done a good job so far and I look forward to it's continued development.
@nolan Mastodon reminds me of when big companies like Twitter and Google still had a developer community. And this time, it doesn't exist at the whims of VCs and advertisers.
@nolan Logout button?
@KinmenRisingProject It's there in the instance settings. :)
@nolan ah, ok, found it. Imho it would be better to put it on the main bar, to be immediately available. Just my 2cents
@nolan wow, just trying this one out, and I must say I am pleased to see how accessible it is to a screen reader! Really well done, Sir!
@marcozehe Awesome, glad to hear! 😊 I did spend some time testing screen readers (mostly VoiceOver on Mac). If you do run into any problems though then please feel free to open an issue: https://github.com/nolanlawson/pinafore/issues
@nolan Yes, will do, thanks! Already found a few keyboard focus transition issues. :) But also saw some instances where keyboard focus was already being handled gracefully. Am really impressed!
@marcozehe Yes, I try my best to maintain keyboard focus across multiple timelines. Curious to know where it loses it though. :)
@nolan See https://github.com/nolanlawson/pinafore/issues/42. There seems to be a difference when using VoiceOver's Activate command versus using Space to activate the Reply button. Interesting... Just noticing this now as I reply.
@nolan is there anyone working on a photo/art (ie Instagram-like) specific UI?
@sivy not a whole lot of progress yet as I still have to do class work, but working on it nonetheless :)
@qonnyr high-5
@nolan and thank you to you for creating such a great web alternative for Mastodon. 👏👍
@nolan @lychee PB determines "trackers" heuristically and by client-side observation, which is why you're getting a lot of "works for me!" replies. (They haven't seen that request from different domains.) A non-trivial workaround is to post a compliant Do Not Track policy (but that might be per instance, so... non-trivial) https://www.eff.org/dnt-policy
@nolan Great work; this is perfect and a huge improvement over the default web client. I was getting super frustrated with focus issues when using the default client in a keyboard-driven browser just a few days ago: https://icosahedron.website/@technomancy/99808365323195732
I like to complain about resource-hungry JavaScript apps getting out of control, so it's so refreshing to see not everything has to be that way.
@loke @ElfLord Yep it does have a light theme. :) https://pinafore.social
@nolan @ElfLord That’s fast, this feels SO refreshing; and very complete!!
Some suggestions I didn’t see in the Github issues:
– it feels a bit too spaced for my taste; especially on small screens. Maybe try to merge CW text and button, or put the button before (on the same line) the CW text with some down arrow icon?
– I don’t like the compose box at the box, it takes place when I really want to see the latest toots.
If that makes sense for you, I can open issues about it. :)
@nolan I’m very impressed. It’s super fast, smooth and feels very lightweight.
@nolan Great Jo b indeed. you should see my own betas
@nolan I'm trying it out now :)
One thing that bothers me is that I can't swipe to switch tabs like with the normal masto/web/UI
@miwilc I chose not to implement swiping for now because I've found it's a bit wonky in some browsers. E.g. in mobile Firefox, sometimes a "scroll down" gesture is interpreted as a "swipe" gesture, which can be frustrating. I'll open an issue, though: https://github.com/nolanlawson/pinafore/issues/38
@nolan Loving the clean look! This is a huge improvement to new users’ Mastodon experience. Well done! I noticed an issue on iOS already: PWA functionality does not play nicely yet on iOS11.3 because when adding an instance, Safari opens & gets the login cookie instead of the sandboxed PWA webview, so it cannot login.
@tbaldauf Oof, I had not tested in the latest iOS 11.3. Opened an issue: https://github.com/nolanlawson/pinafore/issues/45
Hi! Loving Pinafore, but I can’t figure out how to mute or block someone, or how to report a toot? Is this something that’s in the works? Thanks!
@gannet It's not supported yet, sorry about that: https://github.com/nolanlawson/pinafore/issues/6
In the meantime you can copy a permalink to the toot/user (permalinks have a little icon of a square with an arrow coming out of them), and report/block in the main Mastodon web UI.
@nolan thanks, much appreciated.
@wrenpile Unfortunately no, you have to copy the permalink, switch to the other instance, and paste it in to the search. I'd love to add a shortcut for this though (I believe some native clients already have this).
@nolan Ok, I’ll be paying attention to this project for sure.
Thanks for everything you do!
@nolan so, is Svelte all it's cracked up to be?
@nick Svelte is awesome. Can't say enough good things about it. My favorite part is actually the programming model, which is similar to VueJS.
@nolan nice!
@nolan This is way neat! Your introductory blog mentions multiple account support - does this mean account switching?
@ti Yes, you can log in to multiple instances and then switch between them. :)
@nolan Is... there a switch button? How do I do this fabulous life-changing thing? 😃
@ti Right now it's in the instance settings, but in the future it'll probably be on the home timeline for easier access. :)
@nolan never mind, I found it!
@nolan @ElfLord thank you. Thank you so much. My eyes thank you. My already eroded attention span thanks you. Generations of #fedizens yet unborn thank you ...
https://pinafore.social/statuses/100159280227680675
@nolan " I’ve even contributed code to it." link looks broken
@dashie Thanks, fixed!
@nolan very cool! Can't wait to check it out!
@nolan I'm called Little Buttercup, dear Little Buttercup,
Though I could never tell why.
But still I'm called Buttercup, Poor Little Buttercup,
Sweet Little Buttercup, I!
@kaniini Pretty awesome given I didn't test Pleroma. 😅
@nolan what a great thing! Thank you! 🎊
@nolan Nice UI. Thank you for this.
@nolan Absolutely stellar! Probably will be my main mastodon client going forward
@nolan I'm so happy yall made and published this <3
@nolan Looks great.Nice to have another Mastodon client available.I really like it but I found an mistake in your blog post: https://halcyon.social doesn't exist anymore but the project is still alive.You should link to the Github repository or an instance linked there instead: https://github.com/halcyon-suite/halcyon
@nipos Thanks, updated!
@nolan this is awesome! More inspiration for me to think about how I can make a better Mastodon experience :)
@nolan this is so good ty
@nolan great work, thanks for making this available ... has a big potential for mobile, and will maybe make the transition easier for twitter users 😺
@nolan Looks great! I add it to the list of Apps.
@nolan This is awesome!
@nolan I really liked it
@nolan Really silly question that hopefully has a go-to resource somewhere: how do I use a PWA like an mobile app?
I've got pinafore.social bookmarked on my phone's default browser now (Safari) but for the life of me I can't figure out how to get it on my home screen. Googling has been totally unhelpful so far.
@nolan Now I'm wondering what happened to Halcyon.
@nolan It's fantastic! I can't wait for a dark theme.
@nolan i was hoping the multi-instance stuff means it's all… mashed up somehow… 😸
@nolan here's a few feature requests i'd like to have/implement: show if a toot is a response
display of alt-text on mouse-over on images and emoji/emojo
but, uh, did i really like it!!
it's so nice and clean and bright!!!!
*clones your repository*
@hirojin Unfortunately no; right now it's implemented such that you have to switch between instances.
@nolan yupp, i've noticed it
(it's mostly cuz i really, *really* like twidere's mode of operation)
@nolan Great stuff! Thanks!
@nolan Pinafore looks really nice, will be bookmarking on my phone to play with.
@nolan Definitely trying it now. I love the twitter look.
@bob I was told by at least one person that it works with Pleroma, although I admit I haven't tested it.
@nolan I think it needs some installation isntructions. I'd like to host a copy of together with my instance, preferably pre-configured for it.
@Wolf480pl It's in the README.md and CONTRIBUTING.md on GitHub. :)
@nolan oh, totally missed the last paragraph of readme that links to contributing. And tbh, I wouldn't expect installation instructions (esp. production ones) to be in CONTRIBUTING.md
@nolan this looks gorgeous and I'm totally looking at Svelte and Progressive Web Apps now.
Beautifully responsive, super clean, intuitive UI. Great work! I think I'll def try this alongside Tusky.
Really appreciate your explanation RE motivation for the project. Makes a lot of sense and it seems like you've built something really elegant / functional.
Cheers!
@nolan wow, this is really nice
fantastic work!
@nolan Thank you for Pinafore! I've been on it all day so far and it's really nice.
@swordjaw Glad to hear! :D
@nolan confirmed it's for new browsers because doesn't work on firefox os 2.0 hahaha
@nolan I posted this on HN.
This is the very model of a modern masto web ui
both light in weight and beautiful with features to make
cry
Really, though, this is faboo - thanks so much! I can't wait to scratch together the time to shoehorn it into the toot-lab ;)
@djsundog lol I am not trying to make him cry (actually he knew about this before I launched), but yes, I appreciate the song. 😊
@nolan omg looks so good and clean. gonna give it a try. thanks!!
@nolan So i get the single column layout, but is it possible to pin tags as buttons on the nav bar?
@mathuin Not yet, but you can pin the federated timeline, favorites, and lists. Pinning tags is a great idea.
@nolan Is there a minimum mastodon version?
@nolan congrats on the launch!
@collypops Thanks! :)
@nolan just in time for iOS Safari’s new PWA support https://toot.cafe/media/qejcwhjSSCvbsoX5uxE
@nolan although you don’t get redirected back into the PWA after authing an instance, which means it’s currently un-usable (nothing’s shared between iOS PWA sessions and mobile Safari, it seems)
@collypops Thanks yup, sadly I didn't realize this bug because I hadn't tested in latest iOS 11.3... Not sure how to fix it TBH. 😕 https://github.com/nolanlawson/pinafore/issues/45
@nolan so cool! well done on Pinafore! Will be testing this for the next couple of days.
@nolan Maybe Pinafore belongs as a listing on the website pwa.rocks https://github.com/pwarocks/pwa.rocks#how-to-suggest-an-app
@nolan congrats on this! Also, lol at me boosting to your own instance 😉 there’s a couple other people connected tho!
@somelaniesaid Boosting on the same instance still makes sense! :) And yeah this was a fun project; it helped me understand/love CSS Grid. 😊
@nolan WOW that was easy to start using...
*applause*
@nolan what was your experience with Svelte btw? I've never heard of it but it sounds super interesting!
I'm curious if you've had trouble working with it like hard to Google questions or something.
@jag I've found Svelte very easy to use. There aren't really answers on Google/StackOverflow, but the GitHub repo and Gitter channel have been helpful. It's also a pretty logical framework, so I experienced few "surprises." It also gets out of my way when I want to use raw DOM, which I like. Overall, I'd recommend. 👍
@nolan Nice! Thank you I'll keep it in mind for my next project!
@nolan Oooooh! Nice.