waterbearlang / waterbear

Visual block syntax for programming languages
http://waterbearlang.com/
357 stars 88 forks source link

Error in changing font text size #1324

Open huynhk3 opened 8 years ago

huynhk3 commented 8 years ago

Certain blocks in strings do not work as intended, using the string block where it modifies the text does not actually modify the text at all.

For example, using the blocks like in the picture gives a text output of "test," but changing the size variables in the first block modifier and the width parameter in the 2nd block does not have any affect.

example4

This was a small error I've found while fooling around with Waterbear, if I've found something irrelevant or I've structured the syntax wrong, please let me know.

huynhk3 commented 8 years ago

Hey, quick little update here, don't mind me. After extensive testing (and googling), I've found that in the function:

setFont: function(size, fontStyle) {
                var sizeString = size[0] + size[1];
                getContext().font = sizeString + " " + fontStyle;

            },

the parameter fontStyle was actually only returning 2, as indicated in this alert box I used for debugging.

example12

I modified the code slightly in the html for the list object and text input object in the font block to have IDs so I could reference them in the changes I did to the setFont function.

example13

setFont: function(size) {
                var list = document.getElementById("fontSizeList").selectedIndex;
                var family = document.getElementById("familyText").value;
                if (list == 0) {
                  getContext().font = size + "px " + family;
                } else if (list == 1) {
                  getContext().font = size + "em " + family;
                } else if (list == 2) {
                  getContext().font = size + "% " + family;
                } else if (list == 3) {
                  getContext().font = size + "pt " + family;
                }
            },

After testing, all functionality of the font block now works, you can modify the text to whatever family and change sizes depending on px, %, em, and pt. The code is a little messy (I'm not the greatest programmer) but I hope this can be useful!