MatitaLabs

Peer.js and WebRTC

Matita — Thu, 26 Jun 2014 12:16:34 +0000

I recently had a talk about PeerJS and WebRTC.

You can find the slides (italian) here and here

How to get Amazon product image by ASIN

Matita — Thu, 15 May 2014 09:46:32 +0000

Here are some hackings to do to build a url to the image of the product

NTS – Quick MusicBrainz guide for Artists

Matita — Fri, 09 May 2014 10:34:11 +0000

Here is a post on how to create an artist profile on MusicBrainz to be correctly linked with BBC.

NTS – Get wikipedia page content by API

Matita — Mon, 17 Dec 2012 13:32:47 +0000

At the url http://en.wikipedia.org/w/api.php?action=parse&page={page_name} you get the html content and some metadata of a Wikipedia page.
E.g. Richard D. James Album

With parameters prop=text&format=json&callback=mycallback you get only the html text with jsonp format.
E.g. Richard D. James Album

With parameter section=0 you get just the infobox and the abstract of the page.
E.g. Richard D. James Album

With parameter prop=text|images you get also the images names.
E.g. Richard D. James Album

To get the full path of the images follow these guidelines: http://commons.wikimedia.org/wiki/FAQ#What_are_the_strangely_named_components_in_file_paths.3F

NTS – Retrieve release cover art

Matita — Mon, 10 Dec 2012 11:02:22 +0000

To get the release cover images by musicbrainz release id, just point to http://coverartarchive.org/release/{mbid}.
For example go to http://coverartarchive.org/release/c63b0c2e-aa56-4808-bf4f-14c9f6a9982d to get a JSON doc with metadata like paths to images for Crystal Castles’ III release.
Or you could populate a src attribute of an img tag with:

full size http://coverartarchive.org/release/c63b0c2e-aa56-4808-bf4f-14c9f6a9982d/front
large thumbnail http://coverartarchive.org/release/c63b0c2e-aa56-4808-bf4f-14c9f6a9982d/front-500
small thumbnail http://coverartarchive.org/release/c63b0c2e-aa56-4808-bf4f-14c9f6a9982d/front-250

Via MusicBrainz

NTS – Feed dei cinema per MyMovies

Matita — Fri, 09 Nov 2012 09:58:16 +0000

Il sito mymovies.it dà la possibilità di iscriversi al feed dei film attualmente in programmazione di un dato cinema.
Per ottenere l’indirizzo del feed bisogna andare sulla pagina del cinema (per esempio Cinema Tiziano), prendere l’id del cinema (in questo caso 5235) e andare all’indirizzo http://www.mymovies.it/cinema/xml/rss/cinema.asp?id={id} (in questo caso http://www.mymovies.it/cinema/xml/rss/cinema.asp?id=5235)

New version of MashPlayer is out! (v0.6.4)

Matita — Sat, 28 Jul 2012 19:34:23 +0000

After some time of inactivity here is the new version of MashPlayer.
And here what’s changed from last version:

NEW LOGO! YAY! (thanks to Morbo aka Idiotist!). I know, I’ve incredibly resized it and put it in an almost hidden place, but I’m planning a complete restyle.
Upcoming events in your area for current artist (thanks to Songkick‘s API).
Buy album you’re listening on Amazon.com. Protip: if you change Amazon’s domain (.com, .it, .de…) to different countries you’ll get different prices.
Recently Ex.fm got some problem on their server so when searching matches for songs MashPlayer had some troubles or slowness, fixed that
bugfix: playlist was repeted even if “repeat” was not selected
bugfix: when clicking play on a track in the middle of playlist with “repeat” off, next track would always be the first of the playlist
bugfix: clicking on facebook icon to share a link closed the mashplayer window

Hope you’ll like it and you’ll give me some feedback

MashPlayer is out!

Matita — Thu, 07 Jun 2012 07:12:45 +0000

I finally released MashPlayer!
Yay!
This is my first project I’m not ashamed to show to public…
It is a web app that allows you to search and listen to online music.
I mean, there are a lot of services that allow you to do that, what’s different in MashPlayer?
You don’t have to sign up and it still remembers all your playlists and your favourite songs!
To you techy guys: it uses HTML5 features to avoid using server side code.
Thanks to MusicBrainz and YouTube API you’ve got a huge catalog to browse to satisfy every music taste.
Next features in the roadmap are sharing on social networks and direct link to tracks you love, support for Ex.fm API and responsive design for a mobile friendly interface.
So, hope you’ll enjoy it and be sure to leave your feedback to let me know what you don’t like about it and what features you’d love to have!

MashPlayer

Online Less compiler bookmarklet

Matita — Mon, 16 Apr 2012 16:34:05 +0000

Premise: as soon as I knew Less I started using it and I hardly think I’ll go back to write pure CSS.
Problem: I don’t always have the tools or the environment I need to code comfortably (it’s a lie, I’m lazy and I never installed what I really need…).
Solution: Less has an awesome Javascript library that processes .less files client side. That’s perfect for developing time, but not really the best solution for the release, considering that you have to put blocking code in the tag of the page to process always the same files (Less has an interesting cache system, but that’s not the argument of this post).
So, when I’m not able to compile the less files on my machine, I use a bookmarklet to copy the code that the client side library compiled and paste it in a .css file.
Here it is:

' + style.innerHTML + ''; } var w = window.open('','','width=600,height=400'); w.document.write(html);)()">Make Less

Just go to the webpage in which you are using the client side less library and click the bookmarklet.
It will open a popup with textareas containing all the styles compiled in plain css.

Warn to myself: this is not the right way to work! This can work only as a temporary or “emergency” case, so move your ass and install the right tools!

Mobile layout bookmarklets

Matita — Sat, 14 Apr 2012 09:53:04 +0000

I often need to view a web page I’m viewing on my desktop as I was on a mobile screen.
I used to manually resize the browser but I could not have a reference on which size should have the browser to be like a tablet or a smartphone.
So I’ve done myself some simple bookmarklets that open the page I’m viewing in a browser page of the correct size.
Here they are:

phone portrait (320×480)

phone landscape (480×320)

iPad landscape (1024×768)

iPad portrait (768×1024)

laptop 1440×960

If you think they can be useful drag them to your bookmarks bar.
I use to put them in a “Screens” folder in my bookmarks bar.

If just resizing the browser isn’t enough and I really want to know how a webpage is viewed on a smartphone and don’t want to write the entire URL with the uncomfortable virtual QWERTY, I show a QR code of the current page by using this bookmarklet:

to qr

After i did them I found Bricss uses a similar way to show how the webpage appears in different screen sizes.
That’s interesting too, because it allows you to see how a webpage appears on different screens at once.