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
92
Crystal
david50407
0
280
Mail Server
david50407
0
84
Git 基礎講座
david50407
0
380
PHP Cookie/Session MySQL 資料庫操作
david50407
1
190

Other Decks in Education

See All in Education
Qualtricsで相互作用実験する「SMARTRIQS」入門編
kscscr
0
300
Adobe Analytics入門講座【株式会社ニジボックス】
nbkouhou
0
17k
(2024) Couper un gâteau... sans connaître le nombre de convives
mansuy
2
120
Adobe Express
matleenalaakso
1
7.4k
小・中・高等学校における情報教育の体系的な学習を目指したカリキュラムモデル案/curriculum model
codeforeveryone
1
2.1k
アニメに学ぶチームの多様性とコンピテンシー
terahide
0
210
Image Processing 1 : 1.Introduction
hachama
0
190
学習指導要領から職場の学びを考えてみる / Thinking about workplace learning from learning guidelines
aki_moon
1
670
#英語力ランキング批判：EF-EPI，TOEFLスコア，英語教育実施状況調査
terasawat
0
530
Library Prefects 2024-2025
cbtlibrary
0
100
Contentless Marketing
jonoalderson
0
1.5k
Epithelium Flashcards
ndevaul
0
970

Featured

See All Featured
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
328
21k
How GitHub (no longer) Works
holman
311
140k
Build The Right Thing And Hit Your Dates
maggiecrowley
32
2.4k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
46
2.1k
Become a Pro
speakerdeck
PRO
24
5k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5k
What's in a price? How to price your products and services
michaelherold
243
12k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3k
The Invisible Side of Design
smashingmag
297
50k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
355
29k
Building Adaptive Systems
keathley
38
2.2k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
4
290

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