<commit_before>"use strict";

var f = function ($compile) {
    return {
        restrict: 'E',
        template: '<canvas width="600" height="600" id="canvasId"></canvas>',
        scope: {
            rows: '=data'
        },
        link: function (scope, element, attrs) {
            var canvas = element.find('canvas')[0];
            var nodeLocations = [];
            var rows = null;

            scope.settings = {
                canvasWidth: attrs.canvasWidth || 600,
                canvasHeight: attrs.canvasHeight || 600,
                freeSeatColour: attrs.freeSeatColour || '#76D75D',
                freeSeatTextColour: attrs.freeSeatTextColour || '#C1F2B4',
                takenSeatColour: attrs.takenSeatColour || '#F56979',
                takenSeatTextColour: attrs.takenSeatTextColour || '#BB1F31',
                selectedSeatColor: attrs.selectedSeatColor || '#7854AF',
                selectedSeatTextColor: attrs.selectedSeatTextColor || '#472085'
            };

            var structure = 
                {
                    eachCabangX: 0,
                    eachCabangY: 0,
                    eachSquare : { width : 0, height : 0 }
                }

            var onRowDataChanged = function (newData) {
                if (newData == null)
                    return; 

                rows = newData.rows;
                var canvasWidth = scope.settings.canvasWidth;
                var canvasHeight = scope.settings.canvasHeight;

                var longestRow = 0;

                for (var i = 0; i < rows.length; ++i) {
                    if (rows[i].nodes.length >= longestRow)
                        longestRow = rows[i].nodes.length;
                }

                var numberOfCabangX = longestRow + 1;
                var numberOfCabangY = rows.length + 1;

                var totalCabangSpaceX = canvasWidth * 0.1;
                var totalCabangSpaceY = canvasHeight * 0.1;

                structure.eachCabangX = totalCabangSpaceX / numberOfCabangX;
                structure.eachCabangY = totalCabangSpaceY / numberOfCabangY;
                structure.eachSquare.width = (canvasWidth - totalCabangSpaceX) / longestRow;
                structure.eachSquare.height = (canvasHeight - totalCabangSpaceY) / rows.length;

                draw();
            };

            scope.$watch('rows', onRowDataChanged);

            var draw = function () {
                if (rows == null)
                    return;

                var ctx = canvas.getContext('2d');

                var lastUp = 0;
                for (var i = 0; i < rows.length; ++i) {
                    var lastRight = 0;

                    for (var j = 0; j < rows[i].nodes.length; ++j) {
                        if (rows[i].nodes[j].type == 0) {
                            lastRight = lastRight + structure.eachCabangX + structure.eachSquare.width;
                        }
                        else {
                            var seatColour = '#000000';
                            var textColour = '#000000';

                            switch (rows[i].nodes[j].selected) {
                                case 0:
                                    seatColour = scope.settings.freeSeatColour;
                                    textColour = scope.settings.freeSeatTextColour;
                                    break;
                                case 1:
                                    seatColour = scope.settings.takenSeatColour;
                                    textColour = scope.settings.takenSeatTextColour;
                                    break;
                                case 2:
                                    seatColour = scope.settings.selectedSeatColour;
                                    textColour = scope.settings.selectedSeatTextColor;
                                    break;
                            }

                            ctx.fillStyle = seatColour;
                            ctx.fillRect(lastRight + structure.eachCabangX, lastUp + structure.eachCabangY, structure.eachSquare.width, structure.eachSquare.height);

                            nodeLocations.push({
                                node: rows[i].nodes[j],
                                x: lastRight + structure.eachCabangX,
                                y: lastUp + structure.eachCabangY,
                                width: structure.eachSquare.width,
                                height: structure.eachSquare.height
                            });

                            ctx.fillStyle = textColour;
                            ctx.textBaseline = 'middle';
                            ctx.textAlign = 'center';
                            ctx.font = "20pt sans-serif";
                            ctx.fillText(rows[i].nodes[j].displayName, lastRight + structure.eachCabangX + (structure.eachSquare.width / 2), lastUp + structure.eachCabangY + (structure.eachSquare.height / 2));

                            lastRight = lastRight + structure.eachCabangX + structure.eachSquare.width;
                        }
                    }

                    lastUp = lastUp + structure.eachCabangY + structure.eachSquare.height;
                }

                addClickEventToCanvas(); 
            };

            var reDraw = function (node) {
                var ctx = canvas.getContext('2d');

                ctx.fillStyle = node.node.selected == 0 ? scope.settings.freeSeatColour : scope.settings.selectedSeatColor;
                ctx.fillRect(node.x, node.y, node.width, node.height);

                ctx.fillStyle = node.node.selected == 0 ? scope.settings.freeSeatTextColour : scope.settings.selectedSeatTextColor;
                ctx.textBaseline = 'middle';
                ctx.textAlign = 'center';
                ctx.font = "20pt sans-serif";
                ctx.fillText(node.node.displayName, node.x + (structure.eachSquare.width / 2), node.y + (structure.eachSquare.height / 2));
            };

            var onCanvasClick = function (e) {
                var x = e.pageX - canvas.offsetLeft;
                var y = e.pageY - canvas.offsetTop;

                var clickedNode = null;

                for (var i = 0; i < nodeLocations.length; i++) {
                    var minX = nodeLocations[i].x;
                    var maxX = nodeLocations[i].x + nodeLocations[i].width;
                    var minY = nodeLocations[i].y;
                    var maxY = nodeLocations[i].y + nodeLocations[i].height;

                    var isInBox = (x > minX && x < maxX) && (y > minY && y < maxY);

                    if (isInBox) {
                        clickedNode = nodeLocations[i];
                        if (clickedNode.node.selected != 1) {
                            clickedNode.node.selected = clickedNode.node.selected == 0 ? 2 : 0;
                            nodeLocations[i] = clickedNode;
                        }
                    }
                }

                if (clickedNode == null || clickedNode.node.selected == 1)
                    return; else 
                    reDraw(clickedNode);
            };

            var addClickEventToCanvas = function () {
                canvas.addEventListener('click', onCanvasClick, false);
            };
        }
    }
};

angular.module('keruc', []).directive('keruc', ['$compile', f]);


<commit_msg>keruC.js as edited in gh-pages<commit_after>"use strict";

var f = function ($compile) {
    return {
        restrict: 'E',
        template: '<canvas width="{{settings.canvasWidth}}" height="{{settings.canvasHeight}}" id="canvasId"></canvas>',
        scope: {
            rows: '=data',
            selectedfucks: '=',
            onSelected: '&',
            onDeselected: '&',
            onDisallowedSelected: '&'
        },
        link: function (scope, element, attrs) {
            var nodeLocations = [];
            var rows = null;

            scope.settings = {
                canvasWidth: attrs.canvasWidth || 500,
                canvasHeight: attrs.canvasHeight || 500,
                freeSeatColour: attrs.freeSeatColour || '#76D75D',
                freeSeatTextColour: attrs.freeSeatTextColour || '#C1F2B4',
                takenSeatColour: attrs.takenSeatColour || '#F56979',
                takenSeatTextColour: attrs.takenSeatTextColour || '#BB1F31',
                selectedSeatColour: attrs.selectedSeatColour || '#7854AF',
                selectedSeatTextColour: attrs.selectedSeatTextColour || '#472085'
            };

            var structure =
                {
                    eachCabangX: 0,
                    eachCabangY: 0,
                    eachSquare: { width: 0, height: 0 }
                }

            var onRowDataChanged = function (newData) {
                if (newData == null)
                    return;

                rows = newData.rows;
                var canvasWidth = scope.settings.canvasWidth;
                var canvasHeight = scope.settings.canvasHeight;

                var longestRow = 0;

                for (var i = 0; i < rows.length; ++i) {
                    if (rows[i].nodes.length >= longestRow)
                        longestRow = rows[i].nodes.length;
                }

                var numberOfCabangX = longestRow + 1;
                var numberOfCabangY = rows.length + 1;

                var totalCabangSpaceX = canvasWidth * 0.1;
                var totalCabangSpaceY = canvasHeight * 0.1;

                structure.eachCabangX = totalCabangSpaceX / numberOfCabangX;
                structure.eachCabangY = totalCabangSpaceY / numberOfCabangY;
                structure.eachSquare.width = (canvasWidth - totalCabangSpaceX) / longestRow;
                structure.eachSquare.height = (canvasHeight - totalCabangSpaceY) / rows.length;

                draw();
                addClickEventToCanvas();
            };

            scope.$watch('rows', onRowDataChanged);

            var drawSquare = function (selected, xPos, yPos, width, height, displayName) {
                var canvas = element.find('canvas')[0];
                var ctx = canvas.getContext('2d');
                var fontSize = structure.eachSquare.width * 0.4;
                var seatColour = '#000000';
                var textColour = '#000000';
                
                var boxCentrePointX = xPos + (structure.eachSquare.width / 2);
                var boxCentrePointY = yPos + (structure.eachSquare.height / 2);

                switch (selected) {
                    case 0:
                        seatColour = scope.settings.freeSeatColour;
                        textColour = scope.settings.freeSeatTextColour;
                        break;
                    case 1:
                        seatColour = scope.settings.takenSeatColour;
                        textColour = scope.settings.takenSeatTextColour;
                        break;
                    case 2:
                        seatColour = scope.settings.selectedSeatColour;
                        textColour = scope.settings.selectedSeatTextColour;

                        ctx.fillStyle = seatColour;
                        ctx.fillRect(xPos, yPos, width, height);

                        ctx.fillStyle = '#472085';
                        ctx.beginPath();
                        ctx.arc(boxCentrePointX, boxCentrePointY, structure.eachSquare.width * 0.2, 0, 2 * Math.PI);
                        ctx.closePath();
                        ctx.fill();

                        ctx.beginPath();
                        ctx.fillStyle = '#472085';
                        ctx.beginPath();
                        ctx.arc(boxCentrePointX, yPos + structure.eachSquare.height, structure.eachSquare.width * 0.35, 0, Math.PI, true);
                        ctx.closePath();
                        ctx.fill();
                        return;
                }

                ctx.fillStyle = seatColour;
                ctx.fillRect(xPos, yPos, width, height);
                ctx.fillStyle = textColour;
                ctx.textBaseline = 'middle';
                ctx.textAlign = 'center';
                ctx.font = fontSize + 'px sans-serif';
                ctx.fillText(displayName, boxCentrePointX, boxCentrePointY);
            };

            var draw = function () {
                if (rows == null)
                    return;

                var lastUp = 0;
                for (var i = 0; i < rows.length; ++i) {
                    var lastRight = 0;

                    for (var j = 0; j < rows[i].nodes.length; ++j) {
                        if (rows[i].nodes[j].type == 0) {
                            lastRight = lastRight + structure.eachCabangX + structure.eachSquare.width;
                        }
                        else {
                            drawSquare(
                                rows[i].nodes[j].selected,
                                lastRight + structure.eachCabangX,
                                lastUp + structure.eachCabangY,
                                structure.eachSquare.width,
                                structure.eachSquare.height,
                                rows[i].nodes[j].displayName
                                );

                            nodeLocations.push({
                                node: rows[i].nodes[j],
                                x: lastRight + structure.eachCabangX,
                                y: lastUp + structure.eachCabangY,
                                width: structure.eachSquare.width,
                                height: structure.eachSquare.height
                            });

                            lastRight = lastRight + structure.eachCabangX + structure.eachSquare.width;
                        }
                    }

                    lastUp = lastUp + structure.eachCabangY + structure.eachSquare.height;
                }
            };

            var onCanvasClick = function (e) {
                var canvas = element.find('canvas')[0];
                var x = e.pageX - canvas.offsetLeft;
                var y = e.pageY - canvas.offsetTop;

                var clickedNode = null;

                for (var i = 0; i < nodeLocations.length; i++) {
                    var minX = nodeLocations[i].x;
                    var maxX = nodeLocations[i].x + nodeLocations[i].width;
                    var minY = nodeLocations[i].y;
                    var maxY = nodeLocations[i].y + nodeLocations[i].height;

                    var isInBox = (x > minX && x < maxX) && (y > minY && y < maxY);

                    if (isInBox) {
                        clickedNode = nodeLocations[i];
                        if (clickedNode.node.selected != 1) {
                            clickedNode.node.selected = clickedNode.node.selected == 0 ? 2 : 0;
                            nodeLocations[i] = clickedNode;

                            switch (clickedNode.node.selected) {
                                case 0: 
                                    var indexof = scope.selectedfucks.indexOf(clickedNode.node);
                                    scope.selectedfucks.splice(indexof, 1); 
                                    break;
                                case 2: scope.selectedfucks.push(clickedNode.node);
                                    break;
                            }
                            scope.$apply();
                        }
                    }
                }

                if (clickedNode == null || clickedNode.node.selected == 1) {
                    scope.onDisallowedSelected({ $node: clickedNode.node });
                    return;
                }
                else {
                    switch (clickedNode.node.selected) {
                        case 0: scope.onDeselected({ $node: clickedNode.node });
                            break;
                        case 2: scope.onSelected({ $node: clickedNode.node });
                            break;
                    }

                    drawSquare(
                        clickedNode.node.selected,
                        clickedNode.x,
                        clickedNode.y,
                        clickedNode.width,
                        clickedNode.height,
                        clickedNode.node.displayName
                        );
                }
            };

            var addClickEventToCanvas = function () {
                var canvas = element.find('canvas')[0];
                canvas.addEventListener('click', onCanvasClick, false);
            };
        }
    }
};

angular.module('keruC', []).directive('kerucSeatpicker', ['$compile', f]);
{'fraction_non_alphanumeric': 0.09456137194939138, 'fraction_numerical': 0.011392936379444744, 'mean_word_length': 1.1202644291889143, 'pattern_counts': {'":': 0, '<': 19, '<?xml version=': 0, '>': 13, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 17, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5051386', 'n_tokens_mistral': 4473, 'n_tokens_neox': 4059, 'n_words': 790}