Create Music Artist Table Notification 1.2

Learn how to create a notification that shows the last 10 albums by an artist, each one clickable

  1. joaomgcd
    WARNING: Because Spotify removed anonymous access from their Web API this won't work anymore. The JSON Read actions will now fail.

    Please download the attached file for a version that uses AutoWeb instead of AutoTools JSON Read.


    Because AutoWeb can authenticate your user on the Spotify API, it'll work correctly there. Make sure to import the AutoWeb Spotify API before using this project.

    The attached version also allows you to enable Google Play Music mode. Set the %mode variable in the "Artist Notification" task to change it or send it from another task in Parameter 2 as shown in the "Call From Another Task" task.


    I'll leave the old tutorial here because you can still learn some stuff from using the old method and building the notification itself still applies.

    Here's what the finished version will look like:
    [​IMG]

    The basic process is:
    • Get Artist information from Spotify API
    • Get last 10 albums for artist
    • Show a table with the info and make each album clickable
    You are going to need:
    You can download the finished project directly if you want.

    STEP 1 - CREATE TASK


    • Create a task and call it Artist Notification
    • Create a variable called %artist and set it to your favorite artist like Pearl Jam


    STEP 2 - GET ARTIST INFO


    (i) This is a URL for the Spotify API that searches for an artist and returns some info. As you can see the %artist variable is used in the URL
    • Set the Fields field to id,url,spotify,genres() to get the artist's ID, Image URL, Spotify Artist URL and genres. Check this JSON for example to understand what these fields' values could look like.
    (i) Learn more about JSON and JSON in AutoTools here.
    • Go back to Tasker


    STEP 3 - GET ALBUMS INFO


    (i) These are the full paths for the fields we want in a Json structure like this one. You are getting the album name, image url, id, artist name, and spotify URL for each of the returned albums
    • Choose Filter and in the Filter Fields type items.images.height
    • In the Filter Values write >300
    (i) Since the Spotify API returns 3 images for each of the albums we are filtering these to only get the biggest one for each album, so that we end up with as many images as album names. If we got all the images we would end up with more images than album names.


    STEP 4 - SET VARIABLE NAMES IN STEP 2


    /!\ You may have noticed that we were using a %aid variable in the last URL there, which doesn't exist. That's because I forgot to properly name the variables on step 2. Let's do that now

    • Edit Action 2
    • Under Advanced -> Variable Name write aid, artist image, artist URL
    (i) As you can see AutoTools will properly set these names to lower case and trim them so they are Tasker compatible variable names


    STEP 5 - FLASH ALL VARIABLES


    • Add a flash action to show all the variables we got this far:
    Code (Text):
    %aid
    %artistimage
    %artisturl
    %items_external_urls_spotify(#)
    %items_id(#)
    %items_images_url(#)
    %items_name(#)
    (i) Notice on how we used (#) on arrays because we are interested in knowing how many items each array has and not their contents. This is because we need to make sure that all arrays have the same length so that everything lines up correctly in the table notification
    • Run the task and check that something's wrong! The arrays are all empty!
    /!\ Yes, it's not working correctly because we forgot to disable Simple Mode in the JSON Read action on step 3. Simple mode needs to be disabled because we are using full paths to values there, instead of simply using the variable names like on step 2. This is needed because there are multiple items on Step 3 with the same variable names so the full path is required.


    STEP 6 - DISABLE SIMPLE MODE ON STEP 3


    • Edit Action 3 and disable Simple Mode
    • Run the task again. Each array should now contain 10 elements. Hooray!


    STEP 7 - START CREATING TABLE NOTIFICATION


    • Add an AutoNotification Table action
    • Set the Title to %artist
    • Set the Texts to this:
    • Code (Text):
      %items_name(:5)
      %items_images_url(:5)
      %items_name(6:)
      %items_images_url(6:)
    (i) This is going to add 4 lines to our table. First line: first 5 album names. Second line: first 5 album covers. Third line: album names from 6 to 10. Fourth line: album covers from 6 to 10
    • Set the Commands field to this:
    • Code (Text):
      %items_external_urls_spotify(:5)
      %items_external_urls_spotify(:5)
      %items_external_urls_spotify(6:)
      %items_external_urls_spotify(6:)
    (i) This is going to set the commands for each cell in our table. The first 2 rows will be linked to the album spotify urls for the first 5 albums, and the 3rd and 4th row will be linked to the album urls for albums from 6 to 10. This will make clicking on each album name and cover open the corresponding url.
    • Set the Command Prefix to openurl
    (i) This will make each command have openurl=:= at the start. For example, if an album url is http://spotify/album1 then the command sent on click will be openurl=:=http://spotify/album1 . This allows us to have 1 AutoApps profile that can open any album (or URL) we want using the AutoApps Command System.
    • Test the task again. Check that stuff shows up but is not properly formatted. But at least everything is clickable!


    STEP 8 - ADJUST LAYOUT


    • Go back into the AutoNotification Table action and set the Texts -> Row Separator to a single new line which is what we used to separate each row when we set the Texts before
    • Go back to Tasker and test it again. Rows now show up correctly! The covers are too big though so they don't fit correctly!
    • Edit the action again and set the Table Layout -> Cell Widths to 75
    • Also, set the Image Size to 48
    • Run the task again and now the images fit better! There's still too much vertical space though...
    • You may notice that each time we test this, we have to clear the notification because a new one is always created. Edit the action again and set a notification ID so that it always replaces the old one.
    • Now set the Cell Heights to 32 to make vertical spacing better
    • Test it again and now everything fits! Awesome!


    STEP 9 - SET COLORS AND ICONS


    • Maybe this would look better if the background was black and the text white? ;) Ok, let's change that in the Icons and Colors section!
    • Set the Status Bar Icon to https://www.dropbox.com/s/28m7de01x49gsa9/music.png?dl=1 or any other transparent icon you'd like
    • Set the Big Icon to %artistimage
    • Also, to open the artist when touching the notification itself, set the Actions -> Command On Touch field to openurl=:=%artisturl
    • Also, you can set the Table Layout -> Text Alignment to Center to make it look a bit better (not in video)
    • Test it again. Looking good!


    STEP 10 - ADDING GENRES


    • As a finishing touch we could add the artist genres to the notification's subtext. Luckily we're already getting them on Step 2
    • Edit Step 2 and add the variable name genres() (make sure to include () so that AutoTools knows it's an array)
    • In the Flash action add %genres()
    • In the notification make the notification Subtext be %genres()
    • Test the task. Hmmm, that's a bit too much text at the top. Let's limit it to 3 genres!
    • Edit the notification and set the Subtext to %genres:)3) which will limit it to the first 3 genres
    • Test it again. Ok, looks finished! Let's react to the commands now!


    STEP 11 - REACT TO COMMANDS


    • Add a new profile with the AutoApps Command event condition
    • Set the Command Filter to openurl=:= (which is what we set our command prefix to, remember?)
    • Set the Variable Names to url so that AutoApps creates a variable called %url with whatever is on the right of openurl=:=
    • In the task use the Browse URL action with the %url variable.
    • Exit Tasker to save


    Now if you touch any of the albums in the notification that album should open in Spotify! If you touch the notification itself it'll open the Artist! :cool:

    (i)If you want you can change the commands to open on Google Play Music instead by using the AutoShare Intents to open albums or artists there. Remember that you have to use the album or artist names there, and not their URLs.

    Extra: if you want to trigger this notification from AutoVoice, you can do it like this:

    Then make sure that in the task you only set %artist to a value if it doesn't already have a value, because if you trigger it from AutoVoice, %artist will already contain the artist you said in the AutoVoice command.


    If you want to trigger it from another task you can do it like this: