Upgrade to Pro — share decks privately, control downloads, hide ads and more …

2016 計中短期資訊推廣課程 —— 多人線上繪圖板

David Kuo (Davy)
May 22, 2016
Education
0
130

2016 計中短期資訊推廣課程 —— 多人線上繪圖板

http://www.cc.ncu.edu.tw/teach/TrainingCourse2016/

David Kuo (Davy)

May 22, 2016
Tweet

More Decks by David Kuo (Davy)

See All by David Kuo (Davy)
Operator SDK 帶你玩轉 Kubernetes
david50407
0
360
GraphQL 簡介
david50407
0
110
Open Source Software and Culture -- Crystal
david50407
1
200
簡潔優雅的語言 —— Crystal
david50407
0
160
各種工具介紹
david50407
1
93
Crystal
david50407
0
280
Mail Server
david50407
0
87
Git 基礎講座
david50407
0
380
PHP Cookie/Session MySQL 資料庫操作
david50407
1
190

Other Decks in Education

See All in Education
Padlet opetuksessa
matleenalaakso
4
12k
Image Processing 1 : 1.Introduction
hachama
0
270
Human Perception and Cognition - Lecture 4 - Human-Computer Interaction (1023841ANR)
signer
PRO
0
710
小学生にスクラムを試してみた件～中学受検までの100週間の舞台裏～
ukky86
0
340
Repaso electricidade e electrónica
irocho
0
200
XML and Related Technologies - Lecture 7 - Web Technologies (1019888BNR)
signer
PRO
0
2.5k
CompTIA Security+ SY0-601 Resumo
mariliarochas
2
2.6k
Chapitre_1_-__L_atmosphère_et_la_vie_-_Partie_1.pdf
bernhardsvt
0
220
寺沢拓敬 2024. 09. 「言語政策研究と教育政策研究の狭間で英語教育政策を考える」
terasawat
0
200
ヘイトスピーチがある世界のコミュニケーション
ktanishima
0
130
(2024) Couper un gâteau... sans connaître le nombre de convives
mansuy
2
150
Blogit opetuksessa
matleenalaakso
0
1.6k

Featured

See All Featured
A Tale of Four Properties
chriscoyier
156
23k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
47
2.1k
GitHub's CSS Performance
jonrohan
1030
460k
Speed Design
sergeychernyshev
25
620
Mobile First: as difficult as doing things right
swwweet
222
8.9k
Optimising Largest Contentful Paint
csswizardry
33
2.9k
[RailsConf 2023] Rails as a piece of cake
palkan
52
4.9k
A Modern Web Designer's Workflow
chriscoyier
693
190k
Build The Right Thing And Hit Your Dates
maggiecrowley
33
2.4k
A Philosophy of Restraint
colly
203
16k
GraphQLの誤解/rethinking-graphql
sonatard
67
10k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
25
1.8k

Transcript

  1. 22 05 2016

  2. None
  3. None
  4. None
  5. None
  6. None
  7. None
  8. None
  9. None
  10. None
  11. None
  12. None
  13. None
  14. None
  15. None
  16. None
  17. None
  18. None

  19. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav>

  20. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <nav class="navbar navbar-default"> </nav>

  21. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <nav class="navbar navbar-default"> </nav>

  22. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <nav class="navbar navbar-default"> </nav>

  23. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <nav class="navbar navbar-default"> </nav>

  24. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <nav class="navbar navbar-default"> </nav> navbar-default navbar-inverse

  25. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="container-fluid"> </div>

  26. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="container-fluid"> </div>

  27. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="container-fluid"> </div>

  28. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="navbar-header"> <span class="navbar-brand"> </span> </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div>

  29. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="navbar-header"> <span class="navbar-brand"> </span> </div>

  30. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="navbar-header"> <span class="navbar-brand"> </span> </div>

  31. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="navbar-header"> <span class="navbar-brand"> </span> </div>

  32. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="navbar-header"> <span class="navbar-brand"> </span> </div>

  33. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="navbar-header"> <span class="navbar-brand"> </span> </div>

  34. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="navbar-header"> <span class="navbar-brand"> </span> </div>

  35. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div>

  36. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div>

  37. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div>

  38. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div>

  39. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div>

  40. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div>

  41. <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <span class="navbar-brand"> </span>

    </div> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div> </div> </nav> <div class="collapse navbar-collapse"> <p class="navbar-text navbar-right">Author: [email protected]</p> </div>
  42. None

  43. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div>

  44. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> </div>

  45. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> </div>

  46. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> </div>

  47. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> </div>

  48. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> </div> #colorbar { display: block; text-align: center; margin: 1em; }

  49. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> </div> #colorbar { display: block; text-align: center; margin: 1em; }

  50. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> </div> #colorbar { display: block; text-align: center; margin: 1em; }

  51. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> </div> #colorbar { display: block; text-align: center; margin: 1em; }

  52. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> </div> #colorbar { display: block; text-align: center; margin: 1em; }

  53. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> </div> #colorbar { display: block; text-align: center; margin: 1em; }

  54. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> </div> #colorbar { display: block; text-align: center; margin: 1em; }

  55. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div>

  56. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div>

  57. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> #colorbar .btn-group { float: none; }

  58. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> #colorbar .btn-group { float: none; }

  59. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> #colorbar .btn-group { float: none; }

  60. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> #colorbar .btn-group { float: none; } .btn-group left

  61. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> #colorbar .btn-group { float: none; }

  62. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> #colorbar .btn-group { float: none; }

  63. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> #colorbar .btn-group { float: none; }

  64. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> #colorbar .btn-group { float: none; }

  65. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div>

  66. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div>

  67. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> .colorbox { width: 24px; height: 24px; float: none; }

  68. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> .colorbox { width: 24px; height: 24px; float: none; }

  69. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> .colorbox { width: 24px; height: 24px; float: none; }

  70. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> .colorbox { width: 24px; height: 24px; float: none; }

  71. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> .colorbox { width: 24px; height: 24px; float: none; }

  72. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> .colorbox { width: 24px; height: 24px; float: none; }

  73. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> .colorbox { width: 24px; height: 24px; float: none; }

  74. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div> .colorbox { width: 24px; height: 24px; float: none; } .btn left

  75. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorholder" class="btn-group" role="group"></div>

  76. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorholder" class="btn-group" role="group"></div>

  77. <div id="colorbar" class="btn-toolbar" role="toolbar"> <div class="btn-group" role="group"> <button id="current-color" class="btn

    btn-default colorbox" /> </div> <div id="colorholder" class="btn-group" role="group"></div> </div> <div id="colorholder" class="btn-group" role="group"></div>

  78. var currentColor; var setColor = function (color) { currentColor =

    color; $('#current-color').css("background-color", '#' + color); }; setColor("000");

  79. var currentColor; var setColor = function (color) { currentColor =

    color; $('#current-color').css("background-color", '#' + color); }; setColor("000"); var currentColor;

  80. var currentColor; var setColor = function (color) { currentColor =

    color; $('#current-color').css("background-color", '#' + color); }; setColor("000"); var currentColor;

  81. var currentColor; var setColor = function (color) { currentColor =

    color; $('#current-color').css("background-color", '#' + color); }; setColor("000"); var currentColor;

  82. var currentColor; var setColor = function (color) { currentColor =

    color; $('#current-color').css("background-color", '#' + color); }; setColor("000"); var setColor = function (color) { currentColor = color; $('#current-color').css("background-color", '#' + color); };

  83. var currentColor; var setColor = function (color) { currentColor =

    color; $('#current-color').css("background-color", '#' + color); }; setColor("000"); var setColor = function (color) { currentColor = color; $('#current-color').css("background-color", '#' + color); };

  84. var currentColor; var setColor = function (color) { currentColor =

    color; $('#current-color').css("background-color", '#' + color); }; setColor("000"); var setColor = function (color) { currentColor = color; $('#current-color').css("background-color", '#' + color); }; <div class="btn-group" role="group"> <button id="current-color" class="btn btn-default colorbox" /> </div>

  85. var currentColor; var setColor = function (color) { currentColor =

    color; $('#current-color').css("background-color", '#' + color); }; setColor("000"); var setColor = function (color) { currentColor = color; $('#current-color').css("background-color", '#' + color); };

  86. var currentColor; var setColor = function (color) { currentColor =

    color; $('#current-color').css("background-color", '#' + color); }; setColor("000"); var setColor = function (color) { currentColor = color; $('#current-color').css("background-color", '#' + color); }; #000, #FFF

  87. var currentColor; var setColor = function (color) { currentColor =

    color; $('#current-color').css("background-color", '#' + color); }; setColor("000"); setColor("000");

  88. var currentColor; var setColor = function (color) { currentColor =

    color; $('#current-color').css("background-color", '#' + color); }; setColor("000"); setColor("000");

  89. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); }

  90. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } var colors = ["fff", "000", "f00", "0f0", ...];

  91. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } var colors = ["fff", "000", "f00", "0f0", ...];

  92. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } var colors = ["fff", "000", "f00", "0f0", ...];

  93. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } var colors = ["fff", "000", "f00", "0f0", ...]; #666, #878787

  94. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); }

  95. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); }

  96. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); } colors c

  97. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); } colors c for (var i = 0; i < colors.length; i++) { var c = colors[i];

  98. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); }

  99. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); } button

  100. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); }

  101. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); }

  102. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); }

  103. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); } Class

  104. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); } Class

  105. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); } Class .colorbox { width: 24px; height: 24px; float: none; }

  106. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { item.click((function (color) { return function () { setColor(color); }; })(colors[c])); }

  107. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { item.click((function (color) { return function () { setColor(color); }; })(colors[c])); }

  108. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { item.click((function (color) { return function () { setColor(color); }; })(colors[c])); }

  109. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } (function (color) { return function () { setColor(color); }; })(colors[c])

  110. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } (function (color) { })(colors[c])

  111. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } (function (color) { })(colors[c])

  112. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } (function (color) { })(colors[c])

  113. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } (function (color) { })(colors[c]) c

  114. var a = 100; var myFunc = function () {

    console.log(a); }; a = 200; myFunc();

  115. var a = 100; var myFunc = function () {

    console.log(a); }; a = 200; myFunc();

  116. var a = 100; var myFunc = function () {

    console.log(a); }; a = 200; myFunc(); 200

  117. var a = 100; var myFunc = function () {

    console.log(a); }; a = 200; myFunc(); 200

  118. var a = 100; var myFunc = function () {

    console.log(a); }; a = 200; myFunc(); 200

  119. var a = 100; var myFunc = function () {

    console.log(a); }; a = 200; myFunc(); 200

  120. var a = 100; var myFunc = function () {

    console.log(a); }; a = 200; myFunc(); 200

  121. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc();

  122. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc();

  123. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); 100

  124. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); function (x) { }

  125. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); function (x) { }

  126. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); function (x) { }

  127. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); (function (x) { })(a);

  128. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); (function (x) { })(a);

  129. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); (function (x) { })(a);

  130. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); (function (x) { })(a);

  131. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); var a = 100; (function (x) { })(a);

  132. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); var a = 100; (function (x) { })(a);

  133. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); var a = 100; (function (x) { })(a);

  134. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); var a = 100; (function (x) { })(a);

  135. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); var a = 100; (function (x) { console.log(x); })(a);

  136. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); var a = 100; (function (x) { console.log(x); })(a);

  137. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); var a = 100; (function (x) { console.log(x); })(a);

  138. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); var myFunc = (function (x) { return function () { console.log(x); }; })(a);

  139. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); var myFunc = (function (x) { return function () { console.log(x); }; })(a);

  140. var a = 100; var myFunc = (function (x) {

    return function () { console.log(x); }; })(a); a = 200; myFunc(); var myFunc = (function (x) { return function () { console.log(x); }; })(a);

  141. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } (function (color) { })(colors[c]) c

  142. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { item.click((function (color) { return function () { setColor(color); }; })(colors[c])); }

  143. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { item.click((function (color) { return function () { setColor(color); }; })(colors[c])); }

  144. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { item.click((function (color) { return function () { setColor(color); }; })(colors[c])); }

  145. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { item.appendTo('#colorholder'); }

  146. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { item.appendTo('#colorholder'); }

  147. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { item.appendTo('#colorholder'); } #colorholder

  148. var colors = ["fff", "000", "f00", "0f0", ...]; for (c

    in colors) { var item = $('<button/>') .css("background-color", '#' + colors[c]) .addClass("btn btn-default colorbox"); item.click((function (color) { return function () { setColor(color); }; })(colors[c])); item.appendTo('#colorholder'); } for (c in colors) { item.appendTo('#colorholder'); } #colorholder <div id="colorholder" class="btn-group" role="group"></div>
  149. None

  150. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div>

  151. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div>

  152. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div>

  153. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div> .canvas-container {

    width: 482px; margin: 0 auto; line-height: 0.6; overflow: hidden; }

  154. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div> .canvas-container {

    width: 482px; margin: 0 auto; line-height: 0.6; overflow: hidden; }

  155. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div> .canvas-container {

    width: 482px; margin: 0 auto; line-height: 0.6; overflow: hidden; }

  156. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div> .canvas-container {

    width: 482px; margin: 0 auto; line-height: 0.6; overflow: hidden; } 1 + 480 + 1 ( )

  157. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div> .canvas-container {

    width: 482px; margin: 0 auto; line-height: 0.6; overflow: hidden; }

  158. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div> .canvas-container {

    width: 482px; margin: 0 auto; line-height: 0.6; overflow: hidden; }

  159. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div> .canvas-container {

    width: 482px; margin: 0 auto; line-height: 0.6; overflow: hidden; }

  160. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div> .canvas-container {

    width: 482px; margin: 0 auto; line-height: 0.6; overflow: hidden; } panel 1.2

  161. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div> .canvas-container {

    width: 482px; margin: 0 auto; line-height: 0.6; overflow: hidden; }

  162. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div> .canvas-container {

    width: 482px; margin: 0 auto; line-height: 0.6; overflow: hidden; }

  163. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div>

  164. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div>

  165. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div>

  166. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div>

  167. <div class="panel panel-default canvas-container"> <canvas width="480" height="480"></canvas> </div>

  168. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; }

  169. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; } var myCanvas = $('.canvas-container canvas')[0];

  170. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; } var myCanvas = $('.canvas-container canvas')[0];

  171. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; } var myCanvas = $('.canvas-container canvas')[0]; canvas

  172. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; } var myContext = myCanvas.getContext ? myCanvas.getContext('2d') : null;

  173. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; } var myContext = myCanvas.getContext ? myCanvas.getContext('2d') : null;

  174. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; } var myContext = myCanvas.getContext ? myCanvas.getContext('2d') : null;

  175. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; } var myContext = myCanvas.getContext ? myCanvas.getContext('2d') : null;

  176. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; } var myContext = myCanvas.getContext ? myCanvas.getContext('2d') : null;

  177. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; } var myContext = myCanvas.getContext ? myCanvas.getContext('2d') : null;

  178. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; } if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; }

  179. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; } if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; }

  180. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; } if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; }

  181. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; } if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; }

  182. var myCanvas = $('.canvas-container canvas')[0]; var myContext = myCanvas.getContext ?

    myCanvas.getContext('2d') : null; if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; } if (myContext == null) { alert("Must use a browser that supports HTML5 Canvas."); return; }

  183. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; };

  184. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; var mouseDown = false, lastPoint = null;

  185. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; var mouseDown = false, lastPoint = null;

  186. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; var mouseDown = false, lastPoint = null;

  187. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; var mouseDown = false, lastPoint = null;

  188. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; var mouseDown = false, lastPoint = null;

  189. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; var mouseDown = false, lastPoint = null;

  190. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; var mouseDown = false, lastPoint = null;

  191. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; var mouseDown = false, lastPoint = null;

  192. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; var mouseDown = false, lastPoint = null;

  193. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; myCanvas.onmousedown = function () { mouseDown = true; };

  194. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; myCanvas.onmousedown = function () { mouseDown = true; };

  195. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; myCanvas.onmousedown = function () { mouseDown = true; };

  196. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; myCanvas.onmousedown = function () { mouseDown = true; };

  197. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; myCanvas.onmousedown = function () { mouseDown = true; };

  198. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; };

  199. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; };

  200. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; };

  201. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; };

  202. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; };

  203. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; };

  204. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; };

  205. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; };

  206. var mouseDown = false, lastPoint = null; myCanvas.onmousedown = function

    () { mouseDown = true; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; }; myCanvas.onmouseout = myCanvas.onmouseup = function () { mouseDown = false; lastPoint = null; };

  207. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove);

  208. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); var drawLineOnMouseMove = function (e) { };

  209. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); var drawLineOnMouseMove = function (e) { };

  210. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); var drawLineOnMouseMove = function (e) { };

  211. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); var drawLineOnMouseMove = function (e) { };

  212. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); var drawLineOnMouseMove = function (e) { };

  213. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove);

  214. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove);

  215. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove);

  216. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove);

  217. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove);

  218. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove);

  219. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove);

  220. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); var drawLineOnMouseMove = function (e) { }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove);

  221. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); var drawLineOnMouseMove = function (e) { }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove);

  222. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault(); ... };

  223. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); if (!mouseDown) return; e.preventDefault();

  224. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); if (!mouseDown) return; e.preventDefault();

  225. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); if (!mouseDown) return; e.preventDefault();

  226. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); if (!mouseDown) return; e.preventDefault();

  227. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); if (!mouseDown) return; e.preventDefault();

  228. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); if (!mouseDown) return; e.preventDefault();

  229. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); if (!mouseDown) return; e.preventDefault();

  230. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); ...

  231. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); ...

  232. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); ...
  233. None
  234. None
  235. None
  236. None

  237. var drawLineOnMouseMove = function (e) { if (!mouseDown) return; e.preventDefault();

    ... }; $(myCanvas).mousemove(drawLineOnMouseMove); $(myCanvas).mousedown(drawLineOnMouseMove); var drawLineOnMouseMove = function (e) { ... };

  238. var offset = $('canvas').offset(); var x1 = Math.floor((e.pageX - offset.left)

    / pixSize - 0.1), y1 = Math.floor((e.pageY - offset.top) / pixSize - 0.1); var x0 = (lastPoint == null) ? x1 : lastPoint[0], y0 = (lastPoint == null) ? y1 : lastPoint[1]; var dx = Math.abs(x1 - x0), dy = Math.abs(y1 - y0); var sx = (x0 < x1) ? 1 : -1, sy = (y0 < y1) ? 1 : -1, err = dx - dy; ...

  239. var offset = $('canvas').offset(); var x1 = Math.floor((e.pageX - offset.left)

    / pixSize - 0.1), y1 = Math.floor((e.pageY - offset.top) / pixSize - 0.1); var x0 = (lastPoint == null) ? x1 : lastPoint[0], y0 = (lastPoint == null) ? y1 : lastPoint[1]; var dx = Math.abs(x1 - x0), dy = Math.abs(y1 - y0); var sx = (x0 < x1) ? 1 : -1, sy = (y0 < y1) ? 1 : -1, err = dx - dy; ... var x0 = (lastPoint == null) ? x1 : lastPoint[0], y0 = (lastPoint == null) ? y1 : lastPoint[1]; ...

  240. var offset = $('canvas').offset(); var x1 = Math.floor((e.pageX - offset.left)

    / pixSize - 0.1), y1 = Math.floor((e.pageY - offset.top) / pixSize - 0.1); var x0 = (lastPoint == null) ? x1 : lastPoint[0], y0 = (lastPoint == null) ? y1 : lastPoint[1]; var dx = Math.abs(x1 - x0), dy = Math.abs(y1 - y0); var sx = (x0 < x1) ? 1 : -1, sy = (y0 < y1) ? 1 : -1, err = dx - dy; ... var x0 = (lastPoint == null) ? x1 : lastPoint[0], y0 = (lastPoint == null) ? y1 : lastPoint[1]; ...

  241. var offset = $('canvas').offset(); var x1 = Math.floor((e.pageX - offset.left)

    / pixSize - 0.1), y1 = Math.floor((e.pageY - offset.top) / pixSize - 0.1); var x0 = (lastPoint == null) ? x1 : lastPoint[0], y0 = (lastPoint == null) ? y1 : lastPoint[1]; var dx = Math.abs(x1 - x0), dy = Math.abs(y1 - y0); var sx = (x0 < x1) ? 1 : -1, sy = (y0 < y1) ? 1 : -1, err = dx - dy; ... var x0 = (lastPoint == null) ? x1 : lastPoint[0], y0 = (lastPoint == null) ? y1 : lastPoint[1]; ... var mouseDown = false, lastPoint = null;

  242. while (true) { onDraw(x0, y0, currentColor); if (x0 == x1

    && y0 == y1) break; var e2 = 2 * err; if (e2 > -dy) { err = err - dy; x0 = x0 + sx; } if (e2 < dx) { err = err + dx; y0 = y0 + sy; } } lastPoint = [x1, y1];

  243. while (true) { onDraw(x0, y0, currentColor); if (x0 == x1

    && y0 == y1) break; var e2 = 2 * err; if (e2 > -dy) { err = err - dy; x0 = x0 + sx; } if (e2 < dx) { err = err + dx; y0 = y0 + sy; } } lastPoint = [x1, y1]; while (true) { onDraw(x0, y0, currentColor); }

  244. while (true) { onDraw(x0, y0, currentColor); if (x0 == x1

    && y0 == y1) break; var e2 = 2 * err; if (e2 > -dy) { err = err - dy; x0 = x0 + sx; } if (e2 < dx) { err = err + dx; y0 = y0 + sy; } } lastPoint = [x1, y1]; while (true) { onDraw(x0, y0, currentColor); }

  245. while (true) { onDraw(x0, y0, currentColor); if (x0 == x1

    && y0 == y1) break; var e2 = 2 * err; if (e2 > -dy) { err = err - dy; x0 = x0 + sx; } if (e2 < dx) { err = err + dx; y0 = y0 + sy; } } lastPoint = [x1, y1]; while (true) { onDraw(x0, y0, currentColor); }

  246. while (true) { onDraw(x0, y0, currentColor); if (x0 == x1

    && y0 == y1) break; var e2 = 2 * err; if (e2 > -dy) { err = err - dy; x0 = x0 + sx; } if (e2 < dx) { err = err + dx; y0 = y0 + sy; } } lastPoint = [x1, y1]; while (true) { onDraw(x0, y0, currentColor); }

  247. while (true) { onDraw(x0, y0, currentColor); if (x0 == x1

    && y0 == y1) break; var e2 = 2 * err; if (e2 > -dy) { err = err - dy; x0 = x0 + sx; } if (e2 < dx) { err = err + dx; y0 = y0 + sy; } } lastPoint = [x1, y1]; while (true) { onDraw(x0, y0, currentColor); }

  248. while (true) { onDraw(x0, y0, currentColor); if (x0 == x1

    && y0 == y1) break; var e2 = 2 * err; if (e2 > -dy) { err = err - dy; x0 = x0 + sx; } if (e2 < dx) { err = err + dx; y0 = y0 + sy; } } lastPoint = [x1, y1]; while (true) { onDraw(x0, y0, currentColor); }

  249. while (true) { onDraw(x0, y0, currentColor); if (x0 == x1

    && y0 == y1) break; var e2 = 2 * err; if (e2 > -dy) { err = err - dy; x0 = x0 + sx; } if (e2 < dx) { err = err + dx; y0 = y0 + sy; } } lastPoint = [x1, y1]; while (true) { onDraw(x0, y0, currentColor); }

  250. while (true) { onDraw(x0, y0, currentColor); if (x0 == x1

    && y0 == y1) break; var e2 = 2 * err; if (e2 > -dy) { err = err - dy; x0 = x0 + sx; } if (e2 < dx) { err = err + dx; y0 = y0 + sy; } } lastPoint = [x1, y1]; while (true) { onDraw(x0, y0, currentColor); }

  251. while (true) { onDraw(x0, y0, currentColor); if (x0 == x1

    && y0 == y1) break; var e2 = 2 * err; if (e2 > -dy) { err = err - dy; x0 = x0 + sx; } if (e2 < dx) { err = err + dx; y0 = y0 + sy; } } lastPoint = [x1, y1]; while (true) { onDraw(x0, y0, currentColor); }

  252. while (true) { onDraw(x0, y0, currentColor); if (x0 == x1

    && y0 == y1) break; var e2 = 2 * err; if (e2 > -dy) { err = err - dy; x0 = x0 + sx; } if (e2 < dx) { err = err + dx; y0 = y0 + sy; } } lastPoint = [x1, y1]; while (true) { onDraw(x0, y0, currentColor); }

  253. while (true) { onDraw(x0, y0, currentColor); if (x0 == x1

    && y0 == y1) break; var e2 = 2 * err; if (e2 > -dy) { err = err - dy; x0 = x0 + sx; } if (e2 < dx) { err = err + dx; y0 = y0 + sy; } } lastPoint = [x1, y1]; while (true) { onDraw(x0, y0, currentColor); } var currentColor;

  254. while (true) { onDraw(x0, y0, currentColor); if (x0 == x1

    && y0 == y1) break; var e2 = 2 * err; if (e2 > -dy) { err = err - dy; x0 = x0 + sx; } if (e2 < dx) { err = err + dx; y0 = y0 + sy; } } lastPoint = [x1, y1]; while (true) { onDraw(x0, y0, currentColor); }

  255. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); };

  256. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; var pixSize = 8;

  257. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; var pixSize = 8;

  258. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; var pixSize = 8;

  259. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; var pixSize = 8;

  260. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; var pixSize = 8; 8px

  261. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; var pixSize = 8; 8px <canvas width="480" height="480"></canvas>

  262. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; var pixSize = 8; 8px <canvas width="480" height="480"></canvas> pixSize

  263. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; var onDraw = function (x, y, color) { };

  264. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; var onDraw = function (x, y, color) { };

  265. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; var onDraw = function (x, y, color) { };

  266. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; var onDraw = function (x, y, color) { };

  267. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; var onDraw = function (x, y, color) { };

  268. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; var onDraw = function (x, y, color) { };

  269. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; var onDraw = function (x, y, color) { };

  270. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize);

  271. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillStyle = "#" + color;

  272. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillStyle = "#" + color;

  273. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillStyle = "#" + color;

  274. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillStyle = "#" + color;

  275. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillStyle = "#" + color; aabbcc

  276. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillStyle = "#" + color; aabbcc

  277. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillStyle = "#" + color; #aabbcc aabbcc

  278. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize);

  279. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize);

  280. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize);

  281. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize);

  282. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize);

  283. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize);

  284. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize);

  285. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize);

  286. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize);

  287. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize);

  288. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize);

  289. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize);

  290. var pixSize = 8; var onDraw = function (x, y,

    color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); }; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize);
  291. None
  292. None
  293. None
  294. None
  295. None

  296. var config = { apiKey: "xR4nD03xlgfaq689pzEw9o2raN00mLoLx", databaseURL: "https://waiting-me-c8763.firebaseio.com" }; firebase.initializeApp(config);

    var dataRef = firebase.database().ref();

  297. var config = { apiKey: "xR4nD03xlgfaq689pzEw9o2raN00mLoLx", databaseURL: "https://waiting-me-c8763.firebaseio.com" }; firebase.initializeApp(config);

    var dataRef = firebase.database().ref();

  298. var config = { apiKey: "xR4nD03xlgfaq689pzEw9o2raN00mLoLx", databaseURL: "https://waiting-me-c8763.firebaseio.com" }; firebase.initializeApp(config);

    var dataRef = firebase.database().ref();

  299. var config = { apiKey: "xR4nD03xlgfaq689pzEw9o2raN00mLoLx", databaseURL: "https://waiting-me-c8763.firebaseio.com" }; firebase.initializeApp(config);

    var dataRef = firebase.database().ref();

  300. var config = { apiKey: "xR4nD03xlgfaq689pzEw9o2raN00mLoLx", databaseURL: "https://waiting-me-c8763.firebaseio.com" }; firebase.initializeApp(config);

    var dataRef = firebase.database().ref();

  301. var config = { apiKey: "xR4nD03xlgfaq689pzEw9o2raN00mLoLx", databaseURL: "https://waiting-me-c8763.firebaseio.com" }; firebase.initializeApp(config);

    var dataRef = firebase.database().ref();

  302. var config = { apiKey: "xR4nD03xlgfaq689pzEw9o2raN00mLoLx", databaseURL: "https://waiting-me-c8763.firebaseio.com" }; firebase.initializeApp(config);

    var dataRef = firebase.database().ref();

  303. var config = { apiKey: "xR4nD03xlgfaq689pzEw9o2raN00mLoLx", databaseURL: "https://waiting-me-c8763.firebaseio.com" }; firebase.initializeApp(config);

    var dataRef = firebase.database().ref();

  304. var config = { apiKey: "xR4nD03xlgfaq689pzEw9o2raN00mLoLx", databaseURL: "https://waiting-me-c8763.firebaseio.com" }; firebase.initializeApp(config);

    var dataRef = firebase.database().ref();

  305. var config = { apiKey: "xR4nD03xlgfaq689pzEw9o2raN00mLoLx", databaseURL: "https://waiting-me-c8763.firebaseio.com" }; firebase.initializeApp(config);

    var dataRef = firebase.database().ref();

  306. var config = { apiKey: "xR4nD03xlgfaq689pzEw9o2raN00mLoLx", databaseURL: "https://waiting-me-c8763.firebaseio.com" }; firebase.initializeApp(config);

    var dataRef = firebase.database().ref();

  307. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel);

  308. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel);

  309. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel);

  310. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); child

  311. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); child

  312. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); child child

  313. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel);

  314. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var drawPixel = function(snapshot) { }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel);

  315. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var drawPixel = function(snapshot) { }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel);

  316. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var drawPixel = function(snapshot) { };

  317. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var drawPixel = function(snapshot) { };

  318. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var drawPixel = function(snapshot) { };

  319. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var drawPixel = function(snapshot) { }; key xx:yy val aabbcc

  320. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize);

  321. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize);

  322. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize);

  323. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize);

  324. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); xx:yy

  325. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); xx:yy

  326. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); xx:yy :

  327. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize);

  328. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); aabbcc

  329. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); aabbcc

  330. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); #aabbcc aabbcc

  331. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize);

  332. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); x

  333. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); x

  334. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); x

  335. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); x

  336. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); x

  337. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); x y

  338. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize);

  339. var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle

    = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_added' , drawPixel); dataRef.on('child_changed', drawPixel); var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); var onDraw = function (x, y, color) { myContext.fillStyle = "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); };

  340. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); };

  341. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); };

  342. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); };

  343. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); };

  344. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); };

  345. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); dataRef.child(x + ":" + y) .set(color === "fff" ? null : color); };

  346. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); dataRef.child(x + ":" + y) .set(color === "fff" ? null : color); }; dataRef.child(x + ":" + y) .set(color === "fff" ? null : color);

  347. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); dataRef.child(x + ":" + y) .set(color === "fff" ? null : color); }; dataRef.child(x + ":" + y) .set(color === "fff" ? null : color);

  348. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); dataRef.child(x + ":" + y) .set(color === "fff" ? null : color); }; dataRef.child(x + ":" + y) .set(color === "fff" ? null : color); xx:yy

  349. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); dataRef.child(x + ":" + y) .set(color === "fff" ? null : color); }; dataRef.child(x + ":" + y) .set(color === "fff" ? null : color);

  350. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); dataRef.child(x + ":" + y) .set(color === "fff" ? null : color); }; dataRef.child(x + ":" + y) .set(color === "fff" ? null : color);

  351. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); dataRef.child(x + ":" + y) .set(color === "fff" ? null : color); }; dataRef.child(x + ":" + y) .set(color === "fff" ? null : color);

  352. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); dataRef.child(x + ":" + y) .set(color === "fff" ? null : color); }; dataRef.child(x + ":" + y) .set(color === "fff" ? null : color);

  353. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); dataRef.child(x + ":" + y) .set(color === "fff" ? null : color); }; dataRef.child(x + ":" + y) .set(color === "fff" ? null : color);

  354. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); dataRef.child(x + ":" + y) .set(color === "fff" ? null : color); }; dataRef.child(x + ":" + y) .set(color === "fff" ? null : color);

  355. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); dataRef.child(x + ":" + y) .set(color === "fff" ? null : color); }; dataRef.child(x + ":" + y) .set(color === "fff" ? null : color);

  356. var onDraw = function (x, y, color) { myContext.fillStyle =

    "#" + color; myContext.fillRect(x * pixSize, y * pixSize, pixSize, pixSize); dataRef.child(x + ":" + y) .set(color === "fff" ? null : color); }; dataRef.child(x + ":" + y) .set(color === "fff" ? null : color);

  357. var clearPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.clearRect(

    parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_removed', clearPixel);

  358. var clearPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.clearRect(

    parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_removed', clearPixel); dataRef.on('child_removed', clearPixel);

  359. var clearPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.clearRect(

    parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_removed', clearPixel); dataRef.on('child_removed', clearPixel);

  360. var clearPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.clearRect(

    parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_removed', clearPixel); dataRef.on('child_removed', clearPixel); child

  361. var clearPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.clearRect(

    parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_removed', clearPixel); dataRef.on('child_removed', clearPixel);

  362. var clearPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.clearRect(

    parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_removed', clearPixel); var clearPixel = function(snapshot) { }; dataRef.on('child_removed', clearPixel);

  363. var clearPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.clearRect(

    parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_removed', clearPixel); var clearPixel = function(snapshot) { }; dataRef.on('child_removed', clearPixel);

  364. var clearPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.clearRect(

    parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_removed', clearPixel); var clearPixel = function(snapshot) { }; dataRef.on('child_removed', clearPixel); var drawPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.fillStyle = "#" + snapshot.val(); ... };

  365. var clearPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.clearRect(

    parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_removed', clearPixel); myContext.clearRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize);

  366. var clearPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.clearRect(

    parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_removed', clearPixel); myContext.clearRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize);

  367. var clearPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.clearRect(

    parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_removed', clearPixel); myContext.clearRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize);

  368. var clearPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.clearRect(

    parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_removed', clearPixel); myContext.clearRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize);

  369. var clearPixel = function(snapshot) { var coords = snapshot.key.split(":"); myContext.clearRect(

    parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); }; dataRef.on('child_removed', clearPixel); myContext.clearRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); var drawPixel = function(snapshot) { ... myContext.fillRect( parseInt(coords[0]) * pixSize, parseInt(coords[1]) * pixSize, pixSize, pixSize); };
  370. None
  371. None
  372. None
  373. None
  374. None
  375. None
  376. None
  377. None
  378. None

  379.        

  380. None

  381.   

  382. None