define(["sugar-web/graphics/palette"], function (palette) {
|
|
|
|
'use strict';
|
|
|
|
var sizepalette = {};
|
|
|
|
sizepalette.SizePalette = function (game, invoker, primaryText, menuData) {
|
|
console.log(game);
|
|
console.log(invoker);
|
|
palette.Palette.call(this, invoker, primaryText);
|
|
|
|
var div = document.createElement('div');
|
|
|
|
var fourbutton = document.createElement('button');
|
|
fourbutton.className = 'toolbutton';
|
|
fourbutton.setAttribute('id','four-button');
|
|
fourbutton.setAttribute('data-l10n-id','four-button');
|
|
fourbutton.setAttribute('title','4x4 grid');
|
|
fourbutton.onclick = function() {
|
|
that.setSize(4);
|
|
}
|
|
|
|
var fivebutton = document.createElement('button');
|
|
fivebutton.className = 'toolbutton';
|
|
fivebutton.setAttribute('id','five-button');
|
|
fivebutton.setAttribute('data-l10n-id','five-button');
|
|
fivebutton.setAttribute('title','5x5 grid');
|
|
fivebutton.onclick = function() {
|
|
that.setSize(5);
|
|
}
|
|
|
|
var sixbutton = document.createElement('button');
|
|
sixbutton.className = 'toolbutton';
|
|
sixbutton.setAttribute('id','six-button');
|
|
sixbutton.setAttribute('data-l10n-id','six-button');
|
|
sixbutton.setAttribute('title','6x6 grid');
|
|
sixbutton.onclick = function() {
|
|
that.setSize(6);
|
|
}
|
|
|
|
var sevenbutton = document.createElement('button');
|
|
sevenbutton.className = 'toolbutton';
|
|
sevenbutton.setAttribute('id','seven-button');
|
|
sevenbutton.setAttribute('data-l10n-id','seven-button');
|
|
sevenbutton.setAttribute('title','7x7 grid');
|
|
sevenbutton.onclick = function() {
|
|
that.setSize(7);
|
|
}
|
|
|
|
this.setSize = function(state) {
|
|
that.popDown();
|
|
g.setSize(state);
|
|
that.setUsed();
|
|
}
|
|
this.resetBackgroundCols = function(){
|
|
fourbutton.style.backgroundColor = "#C0C0C0";
|
|
fivebutton.style.backgroundColor = "#C0C0C0";
|
|
sixbutton.style.backgroundColor = "#C0C0C0";
|
|
sevenbutton.style.backgroundColor = "#C0C0C0";
|
|
}
|
|
this.setUsed = function(){
|
|
this.resetBackgroundCols();
|
|
var sizebutton = document.getElementById("size-button");
|
|
//TODO: This is a hack - more palettes will break it.
|
|
var sizepalettebutton = document.getElementsByClassName("palette-invoker")[1];
|
|
switch(game.startgridwidth) {
|
|
case 4:
|
|
sizebutton.style.backgroundImage = "url(icons/4x4.svg)";
|
|
sizepalettebutton.style.backgroundImage = "url(icons/4x4.svg)";
|
|
fourbutton.style.backgroundColor = "#808080";
|
|
break;
|
|
case 5:
|
|
sizebutton.style.backgroundImage = "url(icons/5x5.svg)";
|
|
sizepalettebutton.style.backgroundImage = "url(icons/5x5.svg)";
|
|
fivebutton.style.backgroundColor = "#808080";
|
|
break;
|
|
case 6:
|
|
sizebutton.style.backgroundImage = "url(icons/6x6.svg)";
|
|
sizepalettebutton.style.backgroundImage = "url(icons/6x6.svg)";
|
|
sixbutton.style.backgroundColor = "#808080";
|
|
break;
|
|
case 7:
|
|
sizebutton.style.backgroundImage = "url(icons/7x7.svg)";
|
|
sizepalettebutton.style.backgroundImage = "url(icons/7x7.svg)";
|
|
sevenbutton.style.backgroundColor = "#808080";
|
|
break;
|
|
}
|
|
}
|
|
|
|
div.appendChild(fourbutton);
|
|
div.appendChild(fivebutton);
|
|
div.appendChild(sixbutton);
|
|
div.appendChild(sevenbutton);
|
|
|
|
this.setContent([div]);
|
|
var that = this;
|
|
var g = game;
|
|
};
|
|
|
|
var addEventListener = function (type, listener, useCapture) {
|
|
return this.getPalette().addEventListener(type, listener, useCapture);
|
|
};
|
|
|
|
sizepalette.SizePalette.prototype =
|
|
Object.create(palette.Palette.prototype, {
|
|
addEventListener: {
|
|
value: addEventListener,
|
|
enumerable: true,
|
|
configurable: true,
|
|
writable: true
|
|
}
|
|
});
|
|
sizepalette.SizePalette.prototype.setShared = function(state) {
|
|
this.setShared(state);
|
|
}
|
|
|
|
return sizepalette;
|
|
});
|