Discuss Scratch

#1Jan. 4, 2024 05:18:53
SuperGamer474
Scratcher
50 posts

JS / HTML problems

PROBLEM 1

Hi there, please could you help me with my code.
I am trying to make the black area on screen say: > Set variable 1 to hello
I want that to happen if I type in: variable: 1 : hello
But for some reason, it is saying: > Set variable 1 : hello to hello
Here is my code:

HTML code
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="description" content="Use SuperGamer474's SuperEasy programming language for beginners!"/>
        <title>SuperEasy474 Programming</title>
        <link rel="stylesheet" href="styles.css">
        <link rel="shortcut icon" type="image/x-icon" href="icon.ico" />
        <script src="script.js">
        </script>
    </head>
    <body>
        <div id="code"><br/>
        </div>
        <div id="enter">
            <input type="text" placeholder="Type code in here - Click 'Enter' when finished" id="codeInput"/>
        </div>
    </body>
</html>


JS code
...
} else if(document.getElementById("codeInput").value.substr(0, 8) == "variable") {
            colonPlace = [];
            for (i = 0; i < document.getElementById("codeInput").value.length; i++) {
                if (document.getElementById("codeInput").value[i] == ":") {
                    colonPlace.push(i);
                }
            }
            colon1 = document.getElementById("codeInput").value.substr(colonPlace[0] + 1, colonPlace[1] - 2);
            colon2 = document.getElementById("codeInput").value.substr(colonPlace[1] + 2, document.getElementById("codeInput").value.length);
            document.getElementById("code").innerHTML += "<p>&nbsp&nbsp> Set variable&nbsp" + colon1 + "&nbspto&nbsp" + colon2 + "</p>";
            document.getElementById("codeInput").value = "";
...

CSS code
#code {
    background-color: black;
    color: white;
    width: 800px;
    height: 500px;
    font-size: 20px;
    overflow-y: scroll;
}
#codeInput {
    border: none;
    width: 780px;
}

Thanks, SuperGamer474

PROBLEM 2

Hi there, I am having another problem,
How do I make my text add to the front rather than the end.
Here is what I mean:
document.getElementById("divId").innerHTML += "<br><p>Next line of text</p>";
It is adding another line of text to my website underneath the other text.
I want the text to add to the top not to the bottom.
This is for my SuperEasy474 Programming website, so you can see the most recent thing at the top.

Thanks, SuperGamer474
#2Jan. 4, 2024 09:32:38
Vaibhs11
Scratcher
1000+ posts

JS / HTML problems

Reporting to be moved to AT.

For the second problem,
let temp = document.getElementById("divId").innerHTML;
temp.innerHTML = "<p>Next line of text</p><br>" + temp.innerHTML;
// I've moved the br tag to break line after the new text

Last edited by Vaibhs11 (Jan. 4, 2024 09:43:14)

#3Jan. 4, 2024 18:08:28
Maximouse
Scratcher
1000+ posts

JS / HTML problems

There's a simpler way to split a string into parts separated by colons: you can use the split() method to get an array of parts and trim() to remove whitespace from the beginning and end of each part.
#4Jan. 4, 2024 21:32:56
SuperGamer474
Scratcher
50 posts

JS / HTML problems

Vaibhs11 wrote:

Reporting to be moved to AT.

For the second problem,
let temp = document.getElementById("divId").innerHTML;
temp.innerHTML = "<p>Next line of text</p><br>" + temp.innerHTML;
// I've moved the br tag to break line after the new text
Did you mean to make the temp variable have innerHTML, and also use temp.innerHTML.
This is the same as document.getElementById(“divId”).innerHTML.innerHTML
You do not need this twice.
#5Jan. 4, 2024 21:52:36
SuperGamer474
Scratcher
50 posts

JS / HTML problems

Maximouse wrote:

There's a simpler way to split a string into parts separated by colons: you can use the split() method to get an array of parts and trim() to remove whitespace from the beginning and end of each part.
Thanks
#6Jan. 5, 2024 01:28:37
Vaibhs11
Scratcher
1000+ posts

JS / HTML problems

SuperGamer474 wrote:

Did you mean to make the temp variable have innerHTML, and also use temp.innerHTML.
Whoops,
let temp = document.getElementById("divId");
temp.innerHTML = "<p>Next line of text</p><br>" + temp.innerHTML;
#7Jan. 8, 2024 23:04:39
SuperGamer474
Scratcher
50 posts

JS / HTML problems

I am trying to convert text (E.g. Hello) to a number (E.g. 0805121215).
I have looked up many sources, but none of them have worked.

I have tried:
DEV
and
Geeks for Geeks
I tried a few more sources but they all say that text outputs as NaN. I would like it to convert to a number, I don't want Not a Number.

Here is an example of what I want to happen:
Scratch project

Also here:
Stackoverflow
#8Jan. 8, 2024 23:37:04
ajskateboarder
Scratcher
1000+ posts

JS / HTML problems

SuperGamer474 wrote:

I am trying to convert text (E.g. Hello) to a number (E.g. 0805121215).
Here's a function for that:
function textToNumbers(text) {
  let numbers = text.toLowerCase().split("")
    .map(letter => letter.charCodeAt(0) - 96)
    .map(code => code.toString())
    .map(code => (code.length === 1 ? "0" : "") + code)
    .join("")
  return numbers
}
The text is made lowercase so “Hello” and “hello” report the same code (similar to how Scratch would work). If you don't want this, you can remove the “.toLowerCase()” function call. For every letter in the text, we get the corresponding number code for it, and add “0” to the beginning of the code if the number is single-digit. Then we join those codes into a single string

Last edited by ajskateboarder (Jan. 8, 2024 23:38:31)

Powered by DjangoBB