javascript - さまざまな長さのjavascript ctx.rect関数を使用して正方形を描く

Question

私はjavascriptがまったく初めてです。座標と距離に基づいて長方形を描くプログラムがあります。正方形を描くオプションを追加したい。以下は、HTMLで長方形を選択したときのJSのコードです。変数modeNameに「square」のオプションを追加した場合、次のコードでどのような変更を加える必要があるか、誰でも教えてください。ありがとう

return {
    setRadio: function(groupNum,buttonNum) {
      var oldFillColor=fillColor,oldStrokeColor=strokeColor;
      // add option square
      var modeName=["Selection","Rectangle", "Set Properties"];

      switch (groupNum) {
        case 0: // Mode options 
          if (modeOption==buttonNum)
            return;
          trace("Mode switch from "+modeName[modeOption]+" to "+
            modeName[buttonNum]);
          if (buttonNum==0) { // Change to selection, save state
            selectionSaveFillColor=fillColor;
            selectionSaveStrokeColor=strokeColor;
            selectionSaveStrokeThickness=strokeThickness;
            setDisabled(true);
            }
          else if (modeOption==0) { // Change from selection, restore state
            fillColor=selectionSaveFillColor;
            document.getElementById("radio1"+fillColor).checked=true;
            strokeColor=selectionSaveStrokeColor;
            document.getElementById("radio2"+strokeColor).checked=true;
            strokeThickness=selectionSaveStrokeThickness;
            document.getElementById("radio3"+strokeThickness).checked=true;
            setDisabled(false);
            }
          modeOption=buttonNum;
          break;
        case 1: // Fill color
          fillColor=colorOptions[buttonNum];
          break;
        case 2: // Stroke color
          strokeColor=colorOptions[buttonNum];
          break;
        case 3: // Stroke thickness
          strokeThickness=buttonNum==5 ? "inherit" : buttonNum+1;
          break;
        }
      if ((oldFillColor!=fillColor || oldStrokeColor!=strokeColor)
      && fillColor=="none" && strokeColor=="none")
        trace("new objects will be invisible!");
    },

    setState: function(fillColor,strokeColor,strokeThickness) {
      selectionSaveFillColor=fillColor;
      selectionSaveStrokeColor=strokeColor;
      selectionSaveStrokeThickness=strokeThickness;
      trace("Rectangle props:  filled with "+ fillColor+
            "   stroked with "+strokeColor+
            "   @ thickness "+ strokeThickness);
      }
    };