# Software Studio 2022 Spring
## Assignment 01 Web Canvas

### Scoring

| **Basic components** | **Score** | **Check** |
| :----------------------------------------------- | :-------: | :-------: |
| Basic control tools | 30% | Y |
| Text input | 10% | Y |
| Cursor icon | 10% | Y |
| Refresh button | 5% | Y |

| **Advanced tools** | **Score** | **Check** |
| :----------------------------------------------- | :-------: | :-------: |
| Different brush shapes | 15% | Y |
| Un/Re-do button | 10% | Y |
| Image tool | 5% | Y |
| Download | 5% | Y |

| **Other useful widgets** | **Score** | **Check** |
| :----------------------------------------------- | :-------: | :-------: |
| Name of widgets | 1~5% | N |

---

### How to use
這些是我設計的基本功能，藍色button依序為畫筆、橡皮擦、文字輸入、矩形、圓形、直線、清空畫布、實心圖案。接著的黃色button是改變畫筆的頭，依序為round、button、square。其中，當滑鼠移到該button時，我用了:hover做變色，讓使用者能更容易辨識自己現在所選的是什麼功能。

位於Toolbar下方的顏色選擇。

在顏色選擇下的下一步、上一步功能鍵。

接著的便是依序為字體選擇的select type、畫筆粗細調整的range type ( 字體的大小也是由此range type調整 ! )、選擇匯入檔案的file type。

最後就是位於右側的儲存檔案button。

### Function description

## ***1.Fill***
我先設了一個global var solid去記，如果點到fill這個button就negation這個var。另外，也會根據solid布林值的不同顯示不同的cursor圖案。
接著，在矩形、三角形、圓形要draw的function中判斷solid，根據他的值去做fill()或stroke()。

## ***2.Linecap***
利用三個function做出不同的筆頭。

### Gitlab page link

Firebase link:
https://software-studio-7fd57.firebaseapp.com/

### Others (Optional)
助教辛苦了! 但Lab6是真滴難.....

<style>
table th{
width: 100%;
}
</style>