An expandable widget base type for Dashing.io
Add data-expsizex
and data-expsizey
to the widget <li>
tag:
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1" data-expsizex="2" data-expsizey="2">
When the mouse cursor moves over the widget, it expands to the size
specified in these attributes. Also, the onExpand()
method of the
widget class gets called. When the mouse leaves the widget, its size
gets back to the original, and the onReduce()
method gets called.
A bit stupid, but working example may be:
class MyWidgetClass extends Dashing.ExpandingWidget
onData: (data) ->
@exp_color = data.exp_color
@color = data.color
$(@node).css("background-color", data.color)
onExpand: ->
$(@node).css("background-color", @exp_color)
onReduce: ->
$(@node).css("background-color", @color)
This accepts color
and exp_color
in the incoming data, and assigns
the normal background color immediately. When the widget is expanded,
exp_color
is set as the background.