Use template strings

lebab --replace src/ --transform template
main
Isaiah Odhner 2019-10-29 17:16:33 -04:00
parent d0f4b08690
commit 6e130de69e
20 changed files with 69 additions and 73 deletions

View File

@ -145,9 +145,9 @@ function $ColorBox(){
}
const rgb = col.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
function hex(x){
return ("0" + parseInt(x).toString(16)).slice(-2);
return (`0${parseInt(x).toString(16)}`).slice(-2);
}
return rgb ? ("#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3])) : col;
return rgb ? (`#${hex(rgb[1])}${hex(rgb[2])}${hex(rgb[3])}`) : col;
}
});
$palette.width(Math.ceil(palette.length/2) * width_per_button);

View File

@ -2,7 +2,7 @@
function $Component(name, orientation, $el){
// A draggable widget that can be undocked into a window
const $c = $(E("div")).addClass("component");
$c.addClass(""+name+"-component");
$c.addClass(`${name}-component`);
$c.append($el);
$c.attr("touch-action", "none");

View File

@ -63,7 +63,7 @@ function $FontBox(){
width: 16,
height: 16,
backgroundImage: "url(images/text-tools.png)",
backgroundPosition: xi*-16 + "px 0px"
backgroundPosition: `${xi*-16}px 0px`
});
$button.on("click", () => {
$button.toggleClass("selected");

View File

@ -13,7 +13,7 @@ function $MenuBar(menus){
$menus.attr("touch-action", "none");
let selecting_menus = false;
const _html = menus_key => menus_key.replace(/&(.)/, m => "<span class='menu-hotkey'>" + m[1] + "</span>");
const _html = menus_key => menus_key.replace(/&(.)/, m => `<span class='menu-hotkey'>${m[1]}</span>`);
const _hotkey = menus_key => menus_key[menus_key.indexOf("&")+1].toUpperCase();
const close_menus = () => {
@ -175,7 +175,7 @@ function $MenuBar(menus){
const $menu_popup = $MenuPopup(menu_items).appendTo($menu_container);
const menu_id = menus_key.replace("&", "").replace(/ /g, "-").toLowerCase();
$menu_button.addClass("" + menu_id + "-menu-button");
$menu_button.addClass(`${menu_id}-menu-button`);
if(menu_id == "extras"){
// TODO: refactor shared key string, move to function
// if localStorage is not available, the default setting is visible

View File

@ -30,7 +30,7 @@ function $ToolBox(tools, is_extras){
width: 16,
height: 16,
backgroundImage: `url(${theme_folder}/tools.png)`,
backgroundPosition: bx + "px 0px",
backgroundPosition: `${bx}px 0px`,
});
};
update_css();

View File

@ -22,8 +22,8 @@ class OnCanvasObject {
height: magnification * this.height,
});
if (updateStatus) {
$status_position.text(this.x + "," + this.y);
$status_size.text(this.width + "," + this.height);
$status_position.text(`${this.x},${this.y}`);
$status_size.text(`${this.width},${this.height}`);
}
}
destroy() {

View File

@ -11,14 +11,14 @@ class OnCanvasTextBox extends OnCanvasObject {
font.background = tool_transparent_mode ? "transparent" : colors.background;
this.$editor.css({
fontFamily: font.family,
fontSize: font.size * magnification + "px",
fontSize: `${font.size * magnification}px`,
fontWeight: font.bold ? "bold" : "normal",
fontStyle: font.italic ? "italic" : "normal",
textDecoration: font.underline ? "underline" : "none",
writingMode: font.vertical ? "vertical-lr" : "",
MsWritingMode: font.vertical ? "vertical-lr" : "",
WebkitWritingMode: font.vertical ? "vertical-lr" : "",
lineHeight: font.size * font.line_scale * magnification + "px",
lineHeight: `${font.size * font.line_scale * magnification}px`,
color: font.color,
background: font.background,
});
@ -106,7 +106,7 @@ class OnCanvasTextBox extends OnCanvasObject {
ctx.fillRect(this.x, this.y, this.width, this.height);
ctx.fillStyle = font.color;
const style_ = (font.bold ? (font.italic ? "italic bold " : "bold ") : (font.italic ? "italic " : ""));
ctx.font = style_ + font.size + "px " + font.family;
ctx.font = `${style_ + font.size}px ${font.family}`;
ctx.textBaseline = "top";
const max_width = Math.max(this.width, font.size);
draw_text_wrapped(ctx, text, this.x + 1, this.y + 1, max_width, font.size * font.line_scale);
@ -145,12 +145,12 @@ function draw_text_wrapped(ctx, text, x, y, maxWidth, lineHeight) {
words[i] = test;
}
test = line + words[i] + ' ';
test = `${line + words[i]} `;
metrics = ctx.measureText(test);
if (metrics.width > maxWidth && i > 0) {
ctx.fillText(line, x, y);
line = words[i] + ' ';
line = `${words[i]} `;
y += lineHeight;
} else {
line = test;

View File

@ -447,7 +447,7 @@ storage.get({
if(window.document_file_path_to_open){
open_from_file_path(document_file_path_to_open, err => {
if(err){
return show_error_message("Failed to open file " + document_file_path_to_open, err);
return show_error_message(`Failed to open file ${document_file_path_to_open}`, err);
}
});
}
@ -582,7 +582,7 @@ function canvas_pointer_move(e){
}
$canvas.on("pointermove", e => {
pointer = e2c(e);
$status_position.text(pointer.x + "," + pointer.y);
$status_position.text(`${pointer.x},${pointer.y}`);
});
$canvas.on("pointerenter", e => {
pointer_over_canvas = true;

View File

@ -63,14 +63,14 @@ window.save_to_file_path = (filePath, formatName, savedCallback) => {
// "24-bit Bitmap": "image/bitmap",
}[formatName];
if(!mimeType){
return show_error_message("Can't save as " + formatName + ". Format is not supported.");
return show_error_message(`Can't save as ${formatName}. Format is not supported.`);
}
// if(mimeType === "image/gif"){
// new GIF();
// }
canvas.toBlob(blob => {
if(blob.type !== mimeType){
return show_error_message("Failed to save as " + formatName + " (your browser doesn't support exporting a canvas as \"" + mimeType + "\")");
return show_error_message(`Failed to save as ${formatName} (your browser doesn't support exporting a canvas as "${mimeType}")`);
}
sanity_check_blob(blob, () => {
blob_to_buffer(blob, (err, buffer) => {
@ -127,7 +127,7 @@ window.systemSaveCanvasAs = (canvas, suggestedFileName, savedCallback) => {
}
const formatNameMatched = ((filters.find(filter => filter.extensions.includes(extension))) || {}).name;
if(!formatNameMatched){
return show_error_message("Can't save as *." +extension + " - try adding .png to the file name");
return show_error_message(`Can't save as *.${extension} - try adding .png to the file name`);
}
save_to_file_path(filePath, formatNameMatched, savedCallback);

View File

@ -237,7 +237,7 @@ function reset_canvas_and_history(){
}
function update_title(){
document.title = file_name + " - Paint";
document.title = `${file_name} - Paint`;
}
function create_and_trigger_input(attrs, callback){
@ -305,7 +305,7 @@ function load_image_from_URI(uri, callback){
img.crossOrigin = "Anonymous";
img.onload = function(){
if (!this.complete || typeof this.naturalWidth == "undefined" || this.naturalWidth === 0) {
return callback && callback(new Error("Image failed to load; naturalWidth == " + this.naturalWidth));
return callback && callback(new Error(`Image failed to load; naturalWidth == ${this.naturalWidth}`));
}
callback(null, img);
};
@ -347,9 +347,9 @@ function get_image_file_from_FileList_or_show_error(files, user_input_method_ver
}
if(files.length > 1){
show_error_message("None of the files " + user_input_method_verb_past_tense + " appear to be images.");
show_error_message(`None of the files ${user_input_method_verb_past_tense} appear to be images.`);
}else{
show_error_message("File " + user_input_method_verb_past_tense + " does not appear to be an image.");
show_error_message(`File ${user_input_method_verb_past_tense} does not appear to be an image.`);
}
}
function open_from_FileList(files, user_input_method_verb_past_tense){
@ -401,7 +401,7 @@ function file_load_from_url(){
// (but still load from the hash when necessary)
// make sure it doesn't overwrite the old session before switching
$w.close();
location.hash = "load:" + encodeURIComponent(uris[0]);
location.hash = `load:${encodeURIComponent(uris[0])}`;
} else {
show_error_message("Invalid URL. It must include a protocol (https:// or http://)");
}
@ -417,7 +417,7 @@ function file_save(){
deselect();
if(file_name.match(/\.svg$/)){
//TODO: only affect suggested name in save dialog, don't change file_name
file_name = file_name.replace(/\.svg$/, "") + ".png";
file_name = `${file_name.replace(/\.svg$/, "")}.png`;
return file_save_as();
}
if(document_file_path){
@ -434,7 +434,7 @@ function file_save(){
function file_save_as(){
deselect();
save_canvas_as(canvas, file_name.replace(/\.(bmp|dib|a?png|gif|jpe?g|jpe|jfif|tiff?|webp|raw)$/, "") + ".png", (saved_file_path, saved_file_name) => {
save_canvas_as(canvas, `${file_name.replace(/\.(bmp|dib|a?png|gif|jpe?g|jpe|jfif|tiff?|webp|raw)$/, "")}.png`, (saved_file_path, saved_file_name) => {
saved = true;
document_file_path = saved_file_path;
file_name = saved_file_name;
@ -449,7 +449,7 @@ function are_you_sure(action, canceled){
}else{
const $w = new $FormWindow().addClass("dialogue-window");
$w.title("Paint");
$w.$main.text("Save changes to "+file_name+"?");
$w.$main.text(`Save changes to ${file_name}?`);
$w.$Button("Save", () => {
$w.close();
file_save();
@ -762,7 +762,7 @@ function render_history_as_gif(){
gif.on("progress", p => {
$progress.val(p);
$progress_percent.text(~~(p*100)+"%");
$progress_percent.text(`${~~(p*100)}%`);
});
gif.on("finished", blob => {
@ -784,7 +784,7 @@ function render_history_as_gif(){
$win.$Button("Save", () => {
$win.close();
sanity_check_blob(blob, () => {
saveAs(blob, file_name.replace(/\.(bmp|dib|a?png|gif|jpe?g|jpe|jfif|tiff?|webp|raw)$/, "") + " history.gif");
saveAs(blob, `${file_name.replace(/\.(bmp|dib|a?png|gif|jpe?g|jpe|jfif|tiff?|webp|raw)$/, "")} history.gif`);
});
});
$cancel.appendTo($win.$buttons);
@ -869,7 +869,7 @@ function undoable(callback, action){
if(redos.length > 5){
const $w = new $FormWindow().addClass("dialogue-window");
$w.title("Paint");
$w.$main.html("Discard "+redos.length+" possible redo-able actions?<br>(Ctrl+Y or Ctrl+Shift+Z to redo)<br>");
$w.$main.html(`Discard ${redos.length} possible redo-able actions?<br>(Ctrl+Y or Ctrl+Shift+Z to redo)<br>`);
$w.$Button(action ? "Discard and Apply" : "Discard", () => {
$w.close();
redos.length = 0;
@ -995,7 +995,7 @@ async function edit_copy(execCommandFallback){
if (execCommandFallback) {
return try_exec_command("copy");
} else {
throw new Error("The Async Clipboard API is not supported by this browser. " + browserRecommendationForClipboardAccess);
throw new Error(`The Async Clipboard API is not supported by this browser. ${browserRecommendationForClipboardAccess}`);
}
}
navigator.clipboard.writeText(text);
@ -1004,7 +1004,7 @@ async function edit_copy(execCommandFallback){
if (execCommandFallback) {
return try_exec_command("copy");
} else {
throw new Error("The Async Clipboard API is not supported by this browser. " + browserRecommendationForClipboardAccess);
throw new Error(`The Async Clipboard API is not supported by this browser. ${browserRecommendationForClipboardAccess}`);
}
}
selection.canvas.toBlob(blob => {
@ -1028,7 +1028,7 @@ function edit_cut(execCommandFallback){
if (execCommandFallback) {
return try_exec_command("cut");
} else {
throw new Error("The Async Clipboard API is not supported by this browser. " + browserRecommendationForClipboardAccess);
throw new Error(`The Async Clipboard API is not supported by this browser. ${browserRecommendationForClipboardAccess}`);
}
}
edit_copy();
@ -1043,7 +1043,7 @@ async function edit_paste(execCommandFallback){
if (execCommandFallback) {
return try_exec_command("paste");
} else {
throw new Error("The Async Clipboard API is not supported by this browser. " + browserRecommendationForClipboardAccess);
throw new Error(`The Async Clipboard API is not supported by this browser. ${browserRecommendationForClipboardAccess}`);
}
}
const clipboardText = await navigator.clipboard.readText();
@ -1054,7 +1054,7 @@ async function edit_paste(execCommandFallback){
if (execCommandFallback) {
return try_exec_command("paste");
} else {
throw new Error("The Async Clipboard API is not supported by this browser. " + browserRecommendationForClipboardAccess);
throw new Error(`The Async Clipboard API is not supported by this browser. ${browserRecommendationForClipboardAccess}`);
}
}
try {
@ -1277,7 +1277,7 @@ function image_attributes(){
const $table = $(E("table")).appendTo($main);
for(const k in table){
const $tr = $(E("tr")).appendTo($table);
const $key = $(E("td")).appendTo($tr).text(k + ":");
const $key = $(E("td")).appendTo($tr).text(`${k}:`);
const $value = $(E("td")).appendTo($tr).text(table[k]);
}
@ -1310,7 +1310,7 @@ function image_attributes(){
$units.append('<label><input type="radio" name="units" value="in">Inches</label>');
$units.append('<label><input type="radio" name="units" value="cm">Cm</label>');
$units.append('<label><input type="radio" name="units" value="px">Pixels</label>');
$units.find("[value=" + current_unit + "]").attr({checked: true});
$units.find(`[value=${current_unit}]`).attr({checked: true});
$units.on("change", () => {
const new_unit = $units.find(":checked").val();
$width.val(width_in_px / unit_sizes_in_px[new_unit]);
@ -1321,12 +1321,12 @@ function image_attributes(){
const $colors = $(E("fieldset")).appendTo($main).append('<legend>Colors</legend>');
$colors.append('<label><input type="radio" name="colors" value="monochrome">Black and White</label>');
$colors.append('<label><input type="radio" name="colors" value="polychrome">Color</label>');
$colors.find("[value=" + (monochrome ? "monochrome" : "polychrome") + "]").attr({checked: true});
$colors.find(`[value=${monochrome ? "monochrome" : "polychrome"}]`).attr({checked: true});
const $transparency = $(E("fieldset")).appendTo($main).append('<legend>Transparency</legend>');
$transparency.append('<label><input type="radio" name="transparency" value="transparent">Transparent</label>');
$transparency.append('<label><input type="radio" name="transparency" value="opaque">Opaque</label>');
$transparency.find("[value=" + (transparency ? "transparent" : "opaque") + "]").attr({checked: true});
$transparency.find(`[value=${transparency ? "transparent" : "opaque"}]`).attr({checked: true});
// Buttons on the right
@ -1470,7 +1470,7 @@ function image_stretch_and_skew(){
const $RowInput = ($table, img_src, label_text, default_value, label_unit) => {
const $tr = $(E("tr")).appendTo($table);
const $img = $(E("img")).attr({
src: "images/transforms/" + img_src + ".png"
src: `images/transforms/${img_src}.png`
}).css({
marginRight: "20px"
});
@ -1519,7 +1519,7 @@ function save_canvas_as(canvas, fileName, savedCallbackUnreliable){
// TODO: file name + type dialog
canvas.toBlob(blob => {
sanity_check_blob(blob, () => {
const file_saver = saveAs(blob, file_name.replace(/\.(bmp|dib|a?png|gif|jpe?g|jpe|jfif|tiff?|webp|raw)$/, "") + ".png");
const file_saver = saveAs(blob, `${file_name.replace(/\.(bmp|dib|a?png|gif|jpe?g|jpe|jfif|tiff?|webp|raw)$/, "")}.png`);
file_saver.onwriteend = () => {
// this won't fire in chrome
savedCallbackUnreliable();
@ -1554,7 +1554,7 @@ function set_as_wallpaper_centered(c){
c.toBlob(blob => {
sanity_check_blob(blob, () => {
saveAs(blob, file_name.replace(/\.(bmp|dib|a?png|gif|jpe?g|jpe|jfif|tiff?|webp|raw)$/, "") + " wallpaper.png");
saveAs(blob, `${file_name.replace(/\.(bmp|dib|a?png|gif|jpe?g|jpe|jfif|tiff?|webp|raw)$/, "")} wallpaper.png`);
});
});
}

View File

@ -70,7 +70,7 @@ function show_help(){
const object = parse_object_params($(li).children("object"));
const $item_li = $(E("li")).addClass("page");
$item_li.append($Item(object.Name).on("click", e => {
$iframe.attr({src: "help/" + object.Local});
$iframe.attr({src: `help/${object.Local}`});
}));
$folder_items_ul.append($item_li);
});

View File

@ -24,9 +24,7 @@ const TAU = //////|//////
const $G = $(window);
function Cursor(cursor_def){
return "url(images/cursors/" + cursor_def[0] + ".png) " +
cursor_def[1].join(" ") +
", " + cursor_def[2];
return `url(images/cursors/${cursor_def[0]}.png) ${cursor_def[1].join(" ")}, ${cursor_def[2]}`;
}
function E(t){

View File

@ -633,12 +633,12 @@ function draw_grid(ctx, scale) {
}
function begincallback(type) {
if (type !== libtess.primitiveType.GL_TRIANGLES) {
console.log('expected TRIANGLES but got type: ' + type);
console.log(`expected TRIANGLES but got type: ${type}`);
}
}
function errorcallback(errno) {
console.log('error callback');
console.log('error number: ' + errno);
console.log(`error number: ${errno}`);
}
// callback for when segments intersect and must be split
function combinecallback(coords, data, weight) {
@ -726,8 +726,7 @@ function draw_grid(ctx, scale) {
if (!gl.getShaderParameter(vertexShader, gl.COMPILE_STATUS)) {
console.log(
'Vertex shader failed to compile. Log: ' +
gl.getShaderInfoLog(vertexShader)
`Vertex shader failed to compile. Log: ${gl.getShaderInfoLog(vertexShader)}`
);
}
@ -744,8 +743,7 @@ function draw_grid(ctx, scale) {
if (!gl.getShaderParameter(fragmentShader, gl.COMPILE_STATUS)) {
console.log(
'Fragment shader failed to compile. Log: ' +
gl.getShaderInfoLog(fragmentShader)
`Fragment shader failed to compile. Log: ${gl.getShaderInfoLog(fragmentShader)}`
);
}

View File

@ -89,7 +89,7 @@ function show_imgur_uploader(blob){
req.upload.addEventListener('progress', event => {
if(event.lengthComputable){
const progress_value = event.loaded / event.total;
const percentage_text = Math.floor(progress_value * 100) + "%";
const percentage_text = `${Math.floor(progress_value * 100)}%`;
$progress.val(progress_value);
$progress_percent.text(percentage_text);
}
@ -142,7 +142,7 @@ function show_imgur_uploader(blob){
}
});
req.open("DELETE", "https://api.imgur.com/3/image/" + response.data.deletehash, true);
req.open("DELETE", `https://api.imgur.com/3/image/${response.data.deletehash}`, true);
req.setRequestHeader("Authorization", "Client-ID 203da2f300125a1");
req.setRequestHeader("Accept", "application/json");

View File

@ -53,7 +53,7 @@ function manage_storage(){
const $img = $(E("img")).attr({src: imgSrc});
const $remove = $(E("button")).text("Remove").addClass("remove-button");
const href = "#" + k.replace("image#", "local:");
const href = `#${k.replace("image#", "local:")}`;
const $open_link = $(E("a")).attr({href: href, target: "_blank"}).text("Open");
const $thumbnail_open_link = $(E("a")).attr({href: href, target: "_blank"}).addClass("thumbnail-container");
$thumbnail_open_link.append($img);

View File

@ -446,7 +446,7 @@ const menus = {
}else if(name.match(/[./[\]#$]/)){
show_error_message("The session name cannot contain any of ./[]#$");
}else{
location.hash = "session:" + name;
location.hash = `session:${name}`;
}
}
},

View File

@ -97,8 +97,8 @@
class LocalSession {
constructor(session_id) {
const lsid = "image#" + session_id;
log("local storage id: " + lsid);
const lsid = `image#${session_id}`;
log(`local storage id: ${lsid}`);
// save image to storage
const save_image_to_storage = () => {
const save_paused = handle_data_loss();
@ -178,11 +178,11 @@
};
// The main cursor color
user.color = "hsla(" + user.hue + ", " + user.saturation + "%, " + user.lightness + "%, 1)";
user.color = `hsla(${user.hue}, ${user.saturation}%, ${user.lightness}%, 1)`;
// Unused
user.color_transparent = "hsla(" + user.hue + ", " + user.saturation + "%, " + user.lightness + "%, 0.5)";
user.color_transparent = `hsla(${user.hue}, ${user.saturation}%, ${user.lightness}%, 0.5)`;
// (@TODO) The color used in the toolbar indicating to other users it is selected by this user
user.color_desaturated = "hsla(" + user.hue + ", " + ~~(user.saturation*0.4) + "%, " + user.lightness + "%, 0.8)";
user.color_desaturated = `hsla(${user.hue}, ${~~(user.saturation*0.4)}%, ${user.lightness}%, 0.8)`;
// The image used for other people's cursors
@ -193,10 +193,10 @@
class FireSession {
constructor(session_id) {
this.id = session_id;
file_name = "[Loading " + this.id + "]";
file_name = `[Loading ${this.id}]`;
update_title();
const on_firebase_loaded = () => {
file_name = "[" + this.id + "]";
file_name = `[${this.id}]`;
update_title();
this.start();
};
@ -217,7 +217,7 @@
})
.fail(() => {
show_error_message("Failed to load Firebase; the document will not load, and changes will not be saved.");
file_name = "[Failed to load " + this.id + "]";
file_name = `[Failed to load ${this.id}]`;
update_title();
});
}
@ -389,7 +389,7 @@
}
}, error => {
show_error_message("Failed to retrieve data from Firebase. The document will not load, and changes will not be saved.", error);
file_name = "[Failed to load " + this.id + "]";
file_name = `[Failed to load ${this.id}]`;
update_title();
});
// Update the cursor status
@ -417,7 +417,7 @@
$G.off(".session-hook");
// Remove collected Firebase event listeners
this._fb_listeners.forEach(({ fb, event_type, callback, error_callback }) => {
log("remove listener for " + fb.path.toString() + " .on " + event_type);
log(`remove listener for ${fb.path.toString()} .on ${event_type}`);
fb.off(event_type, callback);
});
this._fb_listeners.length = 0;
@ -470,10 +470,10 @@
// @TODO: Ask if you want to save before starting a new session
end_current_session();
if(local){
log("starting a new local session, id: "+session_id);
log(`starting a new local session, id: ${session_id}`);
current_session = new LocalSession(session_id);
}else{
log("starting a new Firebase session, id: "+session_id);
log(`starting a new Firebase session, id: ${session_id}`);
current_session = new FireSession(session_id);
}
}
@ -505,7 +505,7 @@
log("switching to new session from #load: URL because of user interaction");
end_current_session();
const new_session_id = generate_session_id();
location.hash = "local:" + new_session_id;
location.hash = `local:${new_session_id}`;
}
});
}, 100);
@ -515,7 +515,7 @@
log("no session id in hash");
end_current_session();
const new_session_id = generate_session_id();
history.replaceState(null, document.title, "#local:" + new_session_id);
history.replaceState(null, document.title, `#local:${new_session_id}`);
log("after replaceState", location.hash);
update_session_from_location_hash();
}

View File

@ -4,7 +4,7 @@
((() => {
let isArray, localStore;
isArray = Array.isArray || (a => ("" + a) !== a && {}.toString.call(a) === "[object Array]");
isArray = Array.isArray || (a => (`${a}`) !== a && {}.toString.call(a) === "[object Array]");
localStore = {
get(key, callback) {

View File

@ -1,7 +1,7 @@
(() => {
const default_theme = "classic.css";
const theme_storage_key = "jspaint theme";
const href_for = theme => "styles/themes/" + theme;
const href_for = theme => `styles/themes/${theme}`;
let current_theme;
try {

View File

@ -312,7 +312,7 @@ tools = [{
const g = id.data[1];
const b = id.data[2];
const a = id.data[3];
this.current_color = "rgba("+r+","+g+","+b+","+a/255+")";
this.current_color = `rgba(${r},${g},${b},${a/255})`;
}else{
this.current_color = "white";
}