Update app.py

app.py

@@ -468,7 +468,7 @@ with gr.Blocks(css=css) as demo:
                       if (document.getElementById(\"cr\").getAttribute(\"stroke\") == \"none\") {
                         if (x > 255 && xold > 255) {
                           BABYLON.Engine.LastCreatedScene.getNodes()[parseInt(document.getElementById(\"fnum\").getElementsByTagName(\"input\")[0].value)+1].position.y = 256-y-128;
-                          document.getElementById(\"cr\").setAttribute(\"r\", 256-y);
+                          document.getElementById(\"cr\").setAttribute(\"r\", (256-y)/2);
                         } else {
                           BABYLON.Engine.LastCreatedScene.getNodes()[parseInt(document.getElementById(\"fnum\").getElementsByTagName(\"input\")[0].value)+1].position.x = x-128;
                           BABYLON.Engine.LastCreatedScene.getNodes()[parseInt(document.getElementById(\"fnum\").getElementsByTagName(\"input\")[0].value)+1].position.z = y-128;
@@ -481,8 +481,8 @@ with gr.Blocks(css=css) as demo:
                           BABYLON.Engine.LastCreatedScene.getNodes()[parseInt(document.getElementById(\"fnum\").getElementsByTagName(\"input\")[0].value)+1].rotation.y = (y-128)/128*Math.PI;
                           document.getElementById(\"rg\").setAttribute(\"r\", (256-y)/256*100+\"%\");
                         } else {
-                          BABYLON.Engine.LastCreatedScene.getNodes()[parseInt(document.getElementById(\"fnum\").getElementsByTagName(\"input\")[0].value)+1].rotation.z = (x-128)/128*Math.PI;
-                          BABYLON.Engine.LastCreatedScene.getNodes()[parseInt(document.getElementById(\"fnum\").getElementsByTagName(\"input\")[0].value)+1].rotation.x = (y-128)/128*Math.PI;
+                          BABYLON.Engine.LastCreatedScene.getNodes()[parseInt(document.getElementById(\"fnum\").getElementsByTagName(\"input\")[0].value)+1].rotation.x = (x-128)/128*Math.PI;
+                          BABYLON.Engine.LastCreatedScene.getNodes()[parseInt(document.getElementById(\"fnum\").getElementsByTagName(\"input\")[0].value)+1].rotation.z = (y-128)/128*Math.PI;
                           document.getElementById(\"rg\").setAttribute(\"cx\", x/256*100+\"%\");
                           document.getElementById(\"rg\").setAttribute(\"cy\", y/256*100+\"%\");
                         }
@@ -512,7 +512,8 @@ with gr.Blocks(css=css) as demo:
                     <stop offset='100%' stop-color='black'/>
                   </radialGradient>
                 </defs>
-                <circle cx='127' cy='127' r='32' id='cr' stroke='none' fill='url(#rg)'/>
+                <circle cx='127' cy='127' r='64' id='cr' stroke='none' fill='url(#rg)'/>
+                <line x1='256' y1='0' x2='256' y2='256' stroke='black' />
               </svg><br/><label for='mode'>Mode </label><select id='mode' onchange='
               try {
               if (this.selectedIndex == 0) {