Question

Is it possible to share variables between Less(CSS) and CoffeScript(JavaScript) in Play.

Less:

@width: 600px;
@height: 800px;

.right {
  width: @width;
  height: @height;
}

CoffeScript:

width = 600
height = 800

stage = new Kinetic.Stage(
  container: 'mainCanvas'
  width: width
  height: height
)

I find it highly inconvenient to have to repeat myself in both files.

Naturally I would like to be able to define the width and the height at a higher abstraction layer.

Of course any technique that is more general and may be applied to any framework is also appreciated.

Answer 1

What if you simply try to set the css-class via jquery?

stage = new Kinetic.Stage
    container: 'mainCanvas'
    width: 0
    height: 0

mc = $("#mainCanvas")
#assuming that mainCanvas is the element you want to style
mc.addClass "right"