Users Guide

What?

BeardedSpice allows you to control web based media players (Like SoundCloud, and YouTube ... List of supported sites to date) and some native apps with the media keys found on Mac keyboards.

How?

All you need to do is just open your favorite supported media site in either Chrome or Safari, then click on BeardedSpice's Menubar icon and select the website you want to control using your media keys.

Interested in doing it with a keyboard-shortcut?

We've got you covered, give the Shortcuts section a look below!

Download

Ready to give BeardedSpice a spin? You can download the latest release here*, or find a full list of all our previously released binaries here.

*Mac OS X 10.8 or greater required.

Features

Smart Mode

This feature is a work-in-progress, we are currently working on bringing it to all our supported sites!

BeardedSpice tries to automatically guess which tab it should control for you. When you press any media key or BeardedSpice shortcut with BeardedSpice open, it will automatically control the site currently playing media, if you have no playing sites, it will try to control the currently focused tab (if it is one of our supported sites) if BeardedSpice failed to do either, it will automatically control the first.

Automatic Updates

No more checking for new releases on our website, BeardedSpice will automatically notify you when a new release is available.

Keyboard Shortcuts

BeardedSpice comes with a handy list of Keyboard Shortcuts that can be configured under the Shortcuts tab of BeardedSpice Prefrences (available through the menubar icon). Here is a table of Default Keyboard Shortcuts:

Default Shortcut	Action
⌘ + F8	Set Focused Browser tab as Active Player (effectively directing your commands to that tab)
⌘ + F6	Focus Active Player (Shows the tab currently controled by BeardedSpice)
⌘ + F10	Toggle Favorite (Add currently playing track to your favorites on it's site)
⌘ + F11	Show Track information (shows a notification with info about the currently playing tab)

Multimedia keys of non-Apple keyboards

Using a 3rd-party keyboard? or even a keyboard with no multimedia keys? No problems, BeardedSpice allows you to set your multimedia keys under shortcuts tab, so you can use any key (or key combination) of your liking.

Disabling certain handlers

From the preferences tab, uncheck any types of webpages that you don't want BeardedSpice to have control over. By default, all implemented handlers are enabled.

Supported Mac OS X applications

• iTunes
• Spotify
• VOX

Supported Sites

• 8Tracks
• 22Tracks
• Amazon Music
• AudioMack
• BandCamp
• Beatguide
• BeatsMusic
• Blitzr
• Bop.fm
• Chorus
• Coursera
• Composed
• Deezer
• Digitally Imported
• focus@will
• Google Music
• GrooveShark
• HypeMachine
• IndieShuffle
• Kollekt.FM
• Last.fm
• [Le Tournedisque] (http://www.letournedisque.com/)
• Logitech Media Server (Default web interface only)
• Mixcloud
• Music Unlimited
• NoAdRadio.com
• NoonPacific.com
• NRK Radio
• Odnoklassniki
• Overcast.fm
• Pandora
• Plex Web
• Pocket Casts
• Rdio
• Saavn
• Shuffler.fm
• Slacker
• SomaFM
• Songza
• SoundCloud
• Spotify (Web)
• STITCHER
• Subsonic (personal media streamer)
• Synology
• TIDAL (Web)
• TuneIn
• Vimeo
• VK ("My Music" from vk.com)
• WONDER.FM
• XboxMusic
• Yandex Music
• Yandex Radio
• YouTube

Don't see your favorite site in the list ?

No Problem, Just submit an issue. Or, if you're in the mood to try something new, just follow the Developers' Guide below and write your own media strategy, integrating a new app in BeardedSpice is really easy and requires minimal objective-c experience and a little of JavaScript basics.

---

#Developers' Guide

Dependencies

We use CocoaPods to manage all obj-c/cocoa dependences. Install them locally using:

sudo gem install cocoapods
pod setup
pod install

Always use BeardedSpice.xcworkspace for development, NOT BeardedSpice.xcodeproject

BeardedSpice is built with SPMediaKeyTap and works well with other applications listening to media key events.

Writing a MediaStrategy

Media controllers are written as strategies. Each strategy defines a collection of Javascript functions to be excecuted on particular webpages.

@interface MediaStrategy : NSObject
/**
Returns name of that media stratery. 
*/
-(NSString *) displayName; // Required override in subclass.

/**
Checks tab that it is accepted this strategy.
*/
-(BOOL) accepts:(TabAdapter *)tab; // Required override in subclass.

/**
Checks tab that it is in the playback state.
*/
- (BOOL)isPlaying:(TabAdapter *)tab;

/**
Returns track information object from tab.
*/
- (Track *)trackInfo:(TabAdapter *)tab;

/**
Returns javascript code of the play/pause toggle.
*/
-(NSString *) toggle; // Required override in subclass.

/**
Returns javascript code of the previous track action.
*/
-(NSString *) previous;

/**
Returns javascript code of the next track action.
*/
-(NSString *) next;

/**
Returns javascript code of the pausing action.
Used mainly for pausing before switching active tabs.
*/
-(NSString *) pause; // Required override in subclass.

/**
Returns javascript code of the "favorite" toggle.
*/
-(NSString *) favorite;

/**
Helper method for obtaining album artwork from url string
*/
- (NSImage *)imageByUrlString:(NSString *)urlString;

@end

The accepts method takes a Tab object and returns YES if the strategy can control the given tab. displayName must return a unique string describing the controller and will be used as the name shown in the Preferences panel. Some other functions return a Javascript function for the particular action. pause is a special case and is used when changing the active tab. Optional but useful methods isPlaying and trackInfo. If you will define isPlaying method, media strategy will be used in autoselect mechanism, description of it you may see in issue #67. trackInfo method returns Track object, which used in notifications for user.

Define these properties of the Track object:

@property NSString *track;
@property NSString *album;
@property NSString *artist;
@property NSImage *image;
@property NSNumber *favorited;

A sample strategy for YandexMusic:

@implementation YandexMusicStrategy

- (id)init {
    self = [super init];
    if (self) {
        predicate =
            [NSPredicate predicateWithFormat:@"SELF LIKE[c] '*music.yandex.*'"];
    }
    return self;
}

- (BOOL)accepts:(TabAdapter *)tab {
    return [predicate evaluateWithObject:[tab URL]];
}

- (BOOL)isPlaying:(TabAdapter *)tab {

    NSNumber *value =
        [tab executeJavascript:@"(function(){return "
                               @"JSON.parse($('body').attr('data-unity-state')"
                               @").playing;})()"];

    return [value boolValue];
}

- (NSString *)toggle {
    return @"(function(){document.querySelector('div.b-jambox__play, "
           @".player-controls__btn_play').click()})()";
}

- (NSString *)previous {
    return @"(function(){document.querySelector('div.b-jambox__prev, "
           @".player-controls__btn_prev').click()})()";
}

- (NSString *)next {
    return @"(function(){document.querySelector('div.b-jambox__next, "
           @".player-controls__btn_next').click()})()";
}

- (NSString *)pause {
    return @"(function(){\
        var e=document.querySelector('.player-controls__btn_play');\
        if(e!=null){\
            if(e.classList.contains('player-controls__btn_pause')){e.click()}\
        }else{\
            var e=document.querySelector('div.b-jambox__play');\
            if(e.classList.contains('b-jambox__playing')){e.click()}\
        }\
    })()";
}

- (NSString *)displayName {
    return @"YandexMusic";
}

- (NSString *)favorite {

    return @"(function(){$('.player-controls "
           @".like.player-controls__btn').click();})()";
}

- (Track *)trackInfo:(TabAdapter *)tab {

    NSDictionary *info = [tab
        executeJavascript:@"(function(){return "
                          @"$.extend(JSON.parse($('body').attr('data-unity-"
                          @"state')), ({'favorited': ($('.player-controls "
                          @".like.like_on.player-controls__btn').length)}))})("
                          @")"];

    Track *track = [Track new];

    track.track = info[@"title"];
    track.artist = info[@"artist"];
    track.image = [self imageByUrlString:info[@"albumArt"]];
    track.favorited = info[@"favorited"];

    return track;
}

@end

Update the MediaStrategyRegistry to include an instance of your new strategy:

+(NSArray *) getDefaultMediaStrategies
{
        DefaultMediaStrategies = [NSArray arrayWithObjects:
                                  // ...
                                  [GoogleMusicStrategy new],
                                  [RdioStrategy new],
                                  // add your new strategy!
                                  [YandexMusicStrategy new],
                                  nil];
}

Finally, update the default preferences plist to include your strategy.

Contact

• @chedkid
• @trhodeos