Steemblr is open source microblogging platform powered by steem blockchain . It allows user to post and explore content which is smaller than a traditional blog.
You can check developer version here: https://steemblr.com
Repository
https://github.com/snwolak/steemblr
New Features
Parsing images
Showing images and gifs instead of links in posts.
How does it work?
Every link(remarkable i'm using to parse markdown is making a links automatically) is parsed and checked with regexp to find out if its image or not.
/(https?:\/\/.*\.(?:png|jpg|gif|jpeg))/i;
If image is found, the tag is changed from a to img
transformTags: {
a: function(tagName, attribs) {
const re = /(https?:\/\/.*\.(?:png|jpg|gif|jpeg))/i;
if (re.test(attribs.href)) {
return {
tagName: "img",
attribs: {
src: attribs.href
},
text: ""
};
}
return {
tagName: "a",
attribs: {
href: attribs.href
}
};
}
}
To make it work I have used sanitize-html dependency and regex to test links.
Links validation
To prevent users from sending unsupported links and breaking stuff I have implemented functionality which checks if link is supported by app.
How does it work?
It is using regex to found out if link is supported or not, if not there is error as you can se above on the gif. Error is shown by using redux controlled interface I have made earlier.
Right now photo section is supporting: jpg,jpeg, png, gifs as direct links audio section: soundcloud and youtube links and video section only youtube links.
Additional Changelog
- Beneficiary reward is now changed from 15% to 5%
- App is now reloading when user encounter error with steemconnect or db,
- Styling changes on post, updated font weight on headers and word wrap on links
Github Account
https://github.com/snwolak