<?sphp $this->text('pagetitle') ?>
 
Home of the Squeezebox™ & Transporter® network music players.

SqueezeJS

From SqueezeboxWiki

Revision as of 12:28, 25 June 2010 by Soulkeeper (Talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

SqueezeJS is a JavaScript framework based on ExtJS. It's primarily been created for use with the new Default skin. But it can be used to easily create new pages using the same behaviour and UI components.

Contents

SqueezeJS.Controller

This is the core of SqueezeJS. It monitors Squeezebox Server acitivity, firing specific events, providing some static methods. Most of the time SqueezeJS based web pages shouldn't care about querying SqueezeCenter's status, but listen to some events fired by the Controller.

Inheriting Ext.util.Observable

SqueezeJS.Controller.getPlayer()

Return currently selected player ID

SqueezeJS.Controller.selectPlayer()

Select a player by ID

SqueezeJS.Controller.request([JSON formatted CLI request])

Execute a CLI command using the JSON/RPC interface.

SqueezeJS.Controller.playerRequest([JSON formatted CLI request])

Execute a player specific CLI call using the JSON/RPC interface.

// pause playback
SqueezeJS.Controller.playerControl(['pause']);

SqueezeJS.Controller.urlRequest()

Request any URL from the server. This can be eg. a command which is not available over the CLI, but as a page handler. The request is executed in the background.

SqueezeJS.Strings

Provide localized strings using the jsString Template Toolkit block:

<script type="text/javascript">
	[% PROCESS jsString id='LOADING' jsId='loading' %]
	alert(SqueezeJS.string('loading'));
</script>

Loading strings dynamically

Processing strings as described above is the recommended way to include strings. It's still possible to load them dynamically:

<script type="text/javascript">
	SqueezeJS.loadString('PLAY');
	SqueezeJS.loadStrings(['NEXT', 'PREVIOUS]);
	...
	alert(SqueezeJS.string('play'));
</script>

Please note that as these requests are run asynchronously, strings won't immediately be available using the string() method. Thus you should try to run the loadString[s]() calls during initialisation, eg. using Ext.onReady().

SqueezeJS.SonginfoParser

Static class parsing song information from the status query.

// get currently playing track title
var title = SqueezeJS.SonginfoParser.title(data);

SqueezeJS.UI

SqueezeJS.UI.Component

Inheriting from Ext.Component - Base class for labels & more, adding listeners for SqueezeCenter specific events.

SqueezeJS.UI.[ Album | AlbumTitle | AlbumYear | Bitrate | CompoundPlaytime | CompoundTitle | Contributors | Coverart | CurrentIndex | Duration | Playtime | PlaytimeRemaining | RawTitle | SongCount | Title | TrackNo ]

Inheriting from SqueezeJS.UI.Component - various labels displaying track and playlist information. Some of them are linking to browse mode pages and songinfo page (unless using noLink in object configuration)

SqueezeJS.UI.Button

Inheriting from Ext.Button - Base class for all Buttons, adding listeners for SqueezeCenter specific events.

SqueezeJS.UI.Buttons

SqueezeJS.UI.ScannerInfo =

Inheriting from Ext.Component - display one line scanner information to be used in eg. the status bar

SqueezeJS.UI.ScannerInfoExtended

Static class - display multi line scanner information as used in progress.html and settings/server/status.html

SqueezeJS.DDProxy

Inherting Ext.dd.DDProxy - A helper class implementing items which can be dragged around. This class adds default behaviour for highlighting elements.

SqueezeJS Tutorial