Need a method to highlight squares

[oakmac]

How will this work with the highlighting when dragging pieces?

// return an array of currently highlighted squares board.highlight();

// highlight some squares board.highlight('e2', 'e3', 'e4');

// clear highlight board.highlight('clear');

[wmartins]

Is there any class that represents a highlighted square to use in this case?

[wmartins]

And another question, is there any method like 'positionToSquare' that receives the position ('e4' for example) and returns the dom element associated to that? Even if there is no method, is there any array that I can use to solve that?

[oakmac]

The answer to both your questions is "yes", but I'm out right now and will answer when I get back. Look at the CSS file for the highlight classes.

On Friday, July 26, 2013, William Martins wrote:

And another question, is there any method like 'positionToSquare' that receives the position ('e4' for example) and returns the dom element associated to that? Even if there is no method, is there any array that I can use to solve that?

— Reply to this email directly or view it on GitHubhttps://github.com/oakmac/chessboardjs/issues/5#issuecomment-21657749 .

[wmartins]

Cool! Found it:

https://github.com/oakmac/chessboardjs/blob/master/js/chessboard.js#L241

And about the highlight classes, I found them, but those are the same that you use to highlight when dragging pieces. What do you think about creating new ones to that option?

[oakmac]

I'm thinking this should be handled by CSS as in Example 5003

Still pondering it though.

[wmartins]

Well, I thought that some blue color (light) would be nice to highlight. What do you think about it?

[oakmac]

I'm leaning towards not adding this method and encouraging people to just use CSS to handle highlighting. See Example 5003

Still not 100% though; need to make a few more examples with different highlight scenarios and see how it works.

[wmartins]

Agreed!

[ZenLearner]

I would love your suggestion of June 2013 to be operative, that is board.highlight('a1','b2','c3'); (Exactly as proposed) With the CSS I am slightly confused as how the squares are named! Thx

Actually, it is already in place. I simply use greySquare(square);

Truly simple