gistfile1.txt

/**
 * An individual cell's surface
 * @author Michael Harris
 */
Sudoku.CellSurface = SC.View.extend({

    init: function(){
        sc_super();
        var layers = this.get('layers'),
            frame = this.get('frame'),
            w = frame[2],
            h = frame[3];

//        this._valueLayer = Sudoku.ValueLayer.create({
////            layout: {top: 0, left: 0, right: 0, bottom: 0}
//        });
        this._valueLayer = SC.TextLayer.create({
            layout: {top: 0, left: 0, right: 0, bottom: 0},
            value: '5',
            font: "30pt Calibri",
            textAlign: 'center',
            lineHeight: h
        });
//        this._valueLayer.set('frame', SC.MakeRect(0, 0, w, h));
//        console.log('layer frame', SC.MakeRect(0, 0, w, h));

        layers.pushObject(this._valueLayer);

    },

    willRenderLayers: function(ctx) {
        console.log('willRenderLayers');
        SC.Benchmark.start('cellUpdateDisplay');

        var w = this.get('frame')[2],
            h = this.get('frame')[3],
            i = this.get('i'),
            j = this.get('j'),
            base03 = "#002b36";

        ctx.save();

        // Clear background.
        ctx.fillStyle = base3;
        ctx.fillRect(0, 0, w, h);
        ctx.strokeStyle = "#aaa";
        ctx.strokeRect(0, 0, w, h);

        if (j === 0) {
            ctx.beginPath();
            ctx.lineTo(0, 1);
            ctx.lineTo(w, 1);
            ctx.closePath();
//            ctx.strokeStyle = "#aaa";
            ctx.stroke();
        }

        if (j === 2 || j === 5) {
            ctx.beginPath();
            ctx.lineTo(0, h - 1);
            ctx.lineTo(w, h - 1);
            ctx.closePath();
            ctx.stroke();
        }

        if (i === 2 || i === 5) {
            ctx.beginPath();
            ctx.lineTo(w - 1, 0);
            ctx.lineTo(w - 1, h);
            ctx.closePath();
            ctx.stroke();
        }

        SC.Benchmark.end('cellUpdateDisplay');
        ctx.restore();
    },

    _createLayers: function() {
        this._layersCreated = true;


    }

});