{"comment":{"url":"https://api.github.com/repos/udacity/project-pixel-art-maker-starter/comments/29572065","html_url":"https://github.com/udacity/project-pixel-art-maker-starter/commit/b9ca1056c4c45330b6c78fa76451be9985d2d2e4#commitcomment-29572065","id":29572065,"node_id":"MDEzOkNvbW1pdENvbW1lbnQyOTU3MjA2NQ==","user":{"login":"Rawllince18","id":40774313,"node_id":"MDQ6VXNlcjQwNzc0MzEz","avatar_url":"https://avatars1.githubusercontent.com/u/40774313?v=4","gravatar_id":"","url":"https://api.github.com/users/Rawllince18","html_url":"https://github.com/Rawllince18","followers_url":"https://api.github.com/users/Rawllince18/followers","following_url":"https://api.github.com/users/Rawllince18/following{/other_user}","gists_url":"https://api.github.com/users/Rawllince18/gists{/gist_id}","starred_url":"https://api.github.com/users/Rawllince18/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Rawllince18/subscriptions","organizations_url":"https://api.github.com/users/Rawllince18/orgs","repos_url":"https://api.github.com/users/Rawllince18/repos","events_url":"https://api.github.com/users/Rawllince18/events{/privacy}","received_events_url":"https://api.github.com/users/Rawllince18/received_events","type":"User","site_admin":false},"position":null,"line":null,"path":null,"commit_id":"b9ca1056c4c45330b6c78fa76451be9985d2d2e4","created_at":"2018-07-02T20:55:46Z","updated_at":"2018-07-02T20:55:46Z","author_association":"NONE","body":"$(function () {\r\n\r\n// Select input\r\nlet height = $('#inputHeight');\r\nlet width = $('#inputWidth');\r\n\r\n// Select color \r\nlet colorPicker = $('#colorPicker');\r\n\r\n// Select canvas\r\nconst canvas = $('#pixelCanvas');\r\n\r\n\r\n// Make Grid when user inputs sizes\r\nfunction makeGrid() {\r\ncanvas.find('tbody').remove();\r\n\r\n// Submits the user's inputs to make the Grid\r\nlet gridHeight = $('#inputHeight').val();\r\nlet gridWidth = $('#inputWidth').val();\r\n\r\n// Adds the rows and columns \r\ncanvas.append('<tbody></tbody>');\r\n\r\nlet canvasBody = canvas.find('tbody');\r\n\r\n// Draw rows\r\nfor (let x = 0; x < gridWidth; x++) {\r\n    canvasBody.append('<tr></tr>');\r\n}\r\n\r\n// Draw columns\r\nfor (y = 0; y < gridHeight; y++) {\r\n    canvas.find('tr').append('<td></td>');\r\n}\r\n}\r\n\r\ncell = canvas.find('td');\r\n\r\n/**cell.click(function() {\r\n    var color = $('#colorPicker').val();\r\n    $(this).attr('background-color', color);\r\n});**/\r\n\r\n// The color to be shown when the user selects\r\ncanvas.on('click', \"td\", function(){\r\n    var color = $('#colorPicker').val();\r\n        $(this).attr(\"bgcolor\", color);\r\n});\r\n\r\n\r\n$(document).ready(function () {\r\n// Click the submit button to make the Grid\r\n$('button[type=\"button\"]').on('click', function (e) {\r\ne.preventDefault();\r\n    makeGrid();\r\n});\r\n\r\n});\r\n\r\n/**let addEvent = function(cell){\r\n    cell.addEventListener('click', function(){\r\n        cell.style.bgcolor = color.val();\r\n    });\r\n}**/\r\n$(\"td\").click(function() {\r\n    $(this).css(\"bgcolor\", color.val());\r\n  });\r\n});\r\n\r\n//Animation\r\n$('#pixelArtMaker').addClass('animated infinite shake');\r\n$('#pixelArtTop').addClass('animated bounceInDown');\r\n$('#pixelArtDown').addClass('animated bounceInUp')\r\n"}}
{"actor":{"display_login":"Rawllince18"}}