Arlo/CS-Coursework
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added textbox element

Browse Source
This commit is contained in:
Arlo Filley 2022-09-29 16:22:48 +01:00
parent 2285ac71b5
commit d6d020d62f
3 changed files with 143 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
website/index.html
View File

@ -12,10 +12,11 @@
<!-- Element Script Files --> <!-- Element Script Files -->
<script src="./ui_elements/canvas.js"></script> <script src="./ui_elements/canvas.js"></script>
<script src="./ui_elements/textbox.js"></script>
<!-- API Script Files --> <!-- API Script Files -->
</head> </head>
<body> <body>
<button id="button">Submit JSON</button>
</body> </body>
</html> </html>

4
website/index.js
View File

@ -1,9 +1,13 @@
let canvas; let canvas;
let textbox;
function setup() { function setup() {
// Creating the canvas // Creating the canvas
canvas = new Canvas(); canvas = new Canvas();
canvas.resize(); canvas.resize();
canvas.center(); canvas.center();
textbox = new Textbox();
} }
function draw() { function draw() {

137
website/ui_elements/textbox.js Normal file
View File

@ -0,0 +1,137 @@
class Textbox {
constructor(pX, pY, pWidth, pHeight, pLayer, pVisible, pTextColor, pBorder, pBorderColor, pBackgroundColor) {
this.x = pX;
this.y = pY;
this.width = pWidth;
this.height = pHeight;
this.layer = pLayer;
this.visible = pVisible;
this.textColor = pTextColor;
this.border = pBorder;
this.borderColor = pBorderColor;
this.backgroundColor = pBackgroundColor;
this.letters = [];
this.words = "";
this.allowedLetters = []
}
getX() {
return this.x;
}
setX(pX) {
this.x = pX;
}
getY() {
return this.y;
}
setY(pY) {
this.y = pY;
}
getWidth() {
return this.width;
}
setWidth(pWidth) {
this.width = pWidth;
}
getHeight() {
return this.height;
}
setHeight(pHeight) {
this.height = pHeight;
}
getLayer() {
return this.layer;
}
setLayer(pLayer) {
this.layer = pLayer;
}
getVisible() {
return this.visible;
}
setVisible(pVisible) {
this.visible = pVisible;
}
getTextColor() {
return this.textColor;
}
setTextColor(pTextColor) {
this.textColor = pTextColor;
}
getBorder() {
return this.border;
}
setBorder(pBorder) {
this.border = pBorder;
}
getBorderColor() {
return this.borderColor;
}
setBorderColor(pBorderColor) {
this.borderColor = pBorderColor;
}
getBackgroundColor() {
return this.backgroundColor;
}
setBackgroundColor(pBackgroundColor) {
this.backgroundColor = pBackgroundColor;
}
getLetters() {
return this.letters;
}
setLetters(pLetters) {
this.letters = pLetters;
}
letterTyped(pKey) {
if (pkey == "backspace" && letters.length) {
letters.pop()
return
}
for (i in allowedLetters.length - 1) {
if (pkey == i) {
letters.push(pKey)
return;
}
}
}
getWords() {
return this.words;
}
setWords(pWords) {
this.words = pWords;
}
getAllowedLetters() {
return this.allowedLetters;
}
setAllowedLetters(pAllowedLetters) {
this.allowedLetters = pAllowedLetters;
}
}