ObsidianBlk
/
nespaint
Tarkkaile 1
Äänestä 0
Fork 0
Koodi Ongelmat 0 Pull-pyynnöt 0 Julkaisut 0 Wiki Activity
A pixel art painter geared specifically at NES pixel art. Includes export for .chr binary file as well as palette and namespace data.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
120 Commitit
4 Branchit
Puu: ad0b29b0dc
Branchit Tagit
${ item.name }
Create branch ${ searchTerm }
from 'ad0b29b0dc'
${ noResults }
nespaint/views/surface.html

214 lines
12KB
Raaka Blame Historia 

  1.         <div class="pure-u-2-3">

  2.           <div class="pure-g">

  3.             <div class="pure-u-1 simple-padding">

  4.               <canvas id="painter" width:"128" height:"256"></canvas>

  5.             </div>

  6.           </div>

  7.           <div class="pure-g">

  8.             <div class="pure-u-1-2">

  9.               <div class="simple-padding">

  10.                 NES System Palette

  11.               </div>

  12.               <div class="NES-palette simple-padding">

  13.                 <div class="pure-g">

  14.                   <div class="pure-u-1-4"> 

  15.                     <div class="pure-g">

  16.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="00">00</button></div>

  17.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="01">01</button></div>

  18.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="02">02</button></div>

  19.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="03">03</button></div>

  20.                     </div>

  21.                   </div>

  22.                   <div class="pure-u-1-4">

  23.                     <div class="pure-g">

  24.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="04">04</button></div>

  25.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="05">05</button></div>

  26.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="06">06</button></div>

  27.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="07">07</button></div>

  28.                     </div>

  29.                   </div>

  30.                   <div class="pure-u-1-4">

  31.                     <div class="pure-g">

  32.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="08">08</button></div>

  33.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="09">09</button></div>

  34.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="0A">0A</button></div>

  35.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="0B">0B</button></div>

  36.                     </div>

  37.                   </div>

  38.                   <div class="pure-u-1-4">

  39.                     <div class="pure-g">

  40.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="0C">0C</button></div>

  41.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="0D">0D</button></div>

  42.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="0E">0E</button></div>

  43.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="0F">0F</button></div>

  44.                     </div>

  45.                   </div> 

  46.                 </div>

  47.                 <div class="pure-g">

  48.                   <div class="pure-u-1-4">

  49.                     <div class="pure-g">

  50.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="10">10</button></div>

  51.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="11">11</button></div>

  52.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="12">12</button></div>

  53.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="13">13</button></div>

  54.                     </div>

  55.                   </div>

  56.                   <div class="pure-u-1-4">

  57.                     <div class="pure-g">

  58.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="14">14</button></div>

  59.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="15">15</button></div>

  60.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="16">16</button></div>

  61.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="17">17</button></div>

  62.                     </div>

  63.                   </div>

  64.                   <div class="pure-u-1-4">

  65.                     <div class="pure-g">

  66.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="18">18</button></div>

  67.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="19">19</button></div>

  68.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="1A">1A</button></div>

  69.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="1B">1B</button></div>

  70.                     </div>

  71.                   </div>

  72.                   <div class="pure-u-1-4">

  73.                     <div class="pure-g">

  74.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="1C">1C</button></div>

  75.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="1D">1D</button></div>

  76.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="1E">1E</button></div>

  77.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="1F">1F</button></div>

  78.                     </div>

  79.                   </div>

  80.                 </div>

  81.                 <div class="pure-g">

  82.                   <div class="pure-u-1-4">

  83.                     <div class="pure-g">

  84.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="20">20</button></div>

  85.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="21">21</button></div>

  86.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="22">22</button></div>

  87.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="23">23</button></div>

  88.                     </div>

  89.                   </div>

  90.                   <div class="pure-u-1-4">

  91.                     <div class="pure-g">

  92.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="24">24</button></div>

  93.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="25">25</button></div>

  94.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="26">26</button></div>

  95.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="27">27</button></div>

  96.                     </div>

  97.                   </div>

  98.                   <div class="pure-u-1-4">

  99.                     <div class="pure-g">

  100.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="28">28</button></div>

  101.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="29">29</button></div>

  102.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="2A">2A</button></div>

  103.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="2B">2B</button></div>

  104.                     </div>

  105.                   </div>

  106.                   <div class="pure-u-1-4">

  107.                     <div class="pure-g">

  108.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="2C">2C</button></div>

  109.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="2D">2D</button></div>

  110.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="2E">2E</button></div>

  111.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="2F">2F</button></div>

  112.                     </div>

  113.                   </div> 

  114.                 </div>

  115.                 <div class="pure-g">

  116.                   <div class="pure-u-1-4">

  117.                     <div class="pure-g">

  118.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="30">30</button></div>

  119.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="31">31</button></div>

  120.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="32">32</button></div>

  121.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="33">33</button></div>

  122.                     </div>

  123.                   </div>

  124.                   <div class="pure-u-1-4">

  125.                     <div class="pure-g">

  126.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="34">34</button></div>

  127.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="35">35</button></div>

  128.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="36">36</button></div>

  129.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="37">37</button></div>

  130.                     </div>

  131.                   </div>

  132.                   <div class="pure-u-1-4">

  133.                     <div class="pure-g">

  134.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="38">38</button></div>

  135.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="39">39</button></div>

  136.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="3A">3A</button></div>

  137.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="3B">3B</button></div>

  138.                     </div>

  139.                   </div>

  140.                   <div class="pure-u-1-4">

  141.                     <div class="pure-g">

  142.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="3C">3C</button></div>

  143.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="3D">3D</button></div>

  144.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="3E">3E</button></div>

  145.                       <div class="pure-u-1-4"><button class="pure-button" nesidx="3F">3F</button></div>

  146.                     </div>

  147.                   </div> 

  148.                 </div>

  149.               </div>

  150.             </div>

  151.             <div class="pure-u-1-2">

  152.               <div class-"simple-padding">

  153.                 Drawing Palettes

  154.               </div>

  155.               <div class="pure-g">

  156.                 <div class="pure-u-1-2">

  157.                   <div class="simple-padding">

  158.                     Palette 1

  159.                   </div>

  160.                   <div class="simple-padding">

  161.                     <div class="pure-button-group" role="group">

  162.                       <button class="pure-button" cidx="0" pidx="0">0</button>

  163.                       <button class="pure-button" cidx="1" pidx="0">1</button>

  164.                       <button class="pure-button" cidx="2" pidx="0">2</button>

  165.                       <button class="pure-button" cidx="3" pidx="0">3</button>

  166.                     </div>

  167.                   </div>

  168.                 </div>

  169.                 <div class="pure-u-1-2">

  170.                   <div class="simple-padding">

  171.                     Palette 2

  172.                   </div>

  173.                   <div class="simple-padding">

  174.                     <div class="pure-button-group" role="group">

  175.                       <button class="pure-button" cidx="0" pidx="1">0</button>

  176.                       <button class="pure-button" cidx="1" pidx="1">1</button>

  177.                       <button class="pure-button" cidx="2" pidx="1">2</button>

  178.                       <button class="pure-button" cidx="3" pidx="1">3</button>

  179.                     </div>

  180.                   </div>

  181.                 </div>

  182.               </div>

  183.               <div class="pure-g">

  184.                 <div class="pure-u-1-2">

  185.                   <div class="simple-padding">

  186.                     Palette 3

  187.                   </div>

  188.                   <div class="simple-padding">

  189.                     <div class="pure-button-group" role="group">

  190.                       <button class="pure-button" cidx="0" pidx="2">0</button>

  191.                       <button class="pure-button" cidx="1" pidx="2">1</button>

  192.                       <button class="pure-button" cidx="2" pidx="2">2</button>

  193.                       <button class="pure-button" cidx="3" pidx="2">3</button>

  194.                     </div>

  195.                   </div>

  196.                 </div>

  197.                 <div class="pure-u-1-2">

  198.                   <div class="simple-padding">

  199.                     Palette 4

  200.                   </div>

  201.                   <div class="simple-padding">

  202.                     <div class="pure-button-group" role="group">

  203.                       <button class="pure-button" cidx="0" pidx="3">0</button>

  204.                       <button class="pure-button" cidx="1" pidx="3">1</button>

  205.                       <button class="pure-button" cidx="2" pidx="3">2</button>

  206.                       <button class="pure-button" cidx="3" pidx="3">3</button>

  207.                     </div>

  208.                   </div>

  209.                 </div>

  210.               </div>

  211.             </div>

  212.           </div>

  213.         </div>