Dwinzo-Beta/Dwinzo_dev
4
0
Fork 3
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Developed Ui for shortcuts preview

Browse Source
This commit is contained in:
Nalvazhuthi
2025-05-13 16:50:50 +05:30
parent 21ff522f67
commit d9b5f1e2d2
18 changed files with 1658 additions and 238 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
app/src/components/ui/Tools.tsx
View File

@@ -31,6 +31,7 @@ import {
useToolMode,
useTransformMode,
useActiveSubTool,
useShortcutStore,
} from "../../store/store";
import useToggleStore from "../../store/useUIToggleStore";
import {
@@ -133,7 +134,7 @@ const Tools: React.FC = () => {
switch (activeTool) {
case "cursor":
if (toggleView) {
setToolMode('move');
setToolMode("move");
} else {
setTransformMode("translate");
}
@@ -200,16 +201,19 @@ const Tools: React.FC = () => {
setActiveTool(activeTool);
}, [activeTool, toggleView]);
const { showShortcuts } = useShortcutStore();
return (
<>
{!isPlaying ? (
<div className="tools-container">
<div className={`tools-container ${showShortcuts ? "visible" : ""}`}>
<div className="drop-down-icons">
<div className="activeDropicon">
{activeSubTool == "cursor" && (
<div
className={`tool-button ${activeTool === "cursor" ? "active" : ""
}`}
className={`tool-button ${
activeTool === "cursor" ? "active" : ""
}`}
onClick={() => {
setActiveTool("cursor");
}}
@@ -220,8 +224,9 @@ const Tools: React.FC = () => {
)}
{activeSubTool == "free-hand" && (
<div
className={`tool-button ${activeTool === "free-hand" ? "active" : ""
}`}
className={`tool-button ${
activeTool === "free-hand" ? "active" : ""
}`}
onClick={() => {
setActiveTool("free-hand");
}}
@@ -232,8 +237,9 @@ const Tools: React.FC = () => {
)}
{activeSubTool == "delete" && (
<div
className={`tool-button ${activeTool === "delete" ? "active" : ""
}`}
className={`tool-button ${
activeTool === "delete" ? "active" : ""
}`}
onClick={() => {
setActiveTool("delete");
}}
@@ -306,8 +312,9 @@ const Tools: React.FC = () => {
<div className="split"></div>
<div className="draw-tools">
<div
className={`tool-button ${activeTool === "draw-wall" ? "active" : ""
}`}
className={`tool-button ${
activeTool === "draw-wall" ? "active" : ""
}`}
onClick={() => {
setActiveTool("draw-wall");
}}
@@ -316,8 +323,9 @@ const Tools: React.FC = () => {
<WallIcon isActive={activeTool === "draw-wall"} />
</div>
<div
className={`tool-button ${activeTool === "draw-zone" ? "active" : ""
}`}
className={`tool-button ${
activeTool === "draw-zone" ? "active" : ""
}`}
onClick={() => {
setActiveTool("draw-zone");
}}
@@ -326,8 +334,9 @@ const Tools: React.FC = () => {
<ZoneIcon isActive={activeTool === "draw-zone"} />
</div>
<div
className={`tool-button ${activeTool === "draw-aisle" ? "active" : ""
}`}
className={`tool-button ${
activeTool === "draw-aisle" ? "active" : ""
}`}
onClick={() => {
setActiveTool("draw-aisle");
}}
@@ -336,8 +345,9 @@ const Tools: React.FC = () => {
<AsileIcon isActive={activeTool === "draw-aisle"} />
</div>
<div
className={`tool-button ${activeTool === "draw-floor" ? "active" : ""
}`}
className={`tool-button ${
activeTool === "draw-floor" ? "active" : ""
}`}
onClick={() => {
setActiveTool("draw-floor");
}}
@@ -353,8 +363,9 @@ const Tools: React.FC = () => {
<div className="split"></div>
<div className="draw-tools">
<div
className={`tool-button ${activeTool === "measure" ? "active" : ""
}`}
className={`tool-button ${
activeTool === "measure" ? "active" : ""
}`}
onClick={() => {
setActiveTool("measure");
}}
@@ -370,8 +381,9 @@ const Tools: React.FC = () => {
<div className="split"></div>
<div className="draw-tools">
<div
className={`tool-button ${activeTool === "pen" ? "active" : ""
}`}
className={`tool-button ${
activeTool === "pen" ? "active" : ""
}`}
onClick={() => {
setActiveTool("pen");
}}
@@ -408,8 +420,9 @@ const Tools: React.FC = () => {
<div className="split"></div>
<div className="general-options">
<div
className={`tool-button ${activeTool === "comment" ? "active" : ""
}`}
className={`tool-button ${
activeTool === "comment" ? "active" : ""
}`}
onClick={() => {
setActiveTool("comment");
}}
@@ -419,8 +432,9 @@ const Tools: React.FC = () => {
</div>
{toggleThreeD && (
<div
className={`tool-button ${activeTool === "play" ? "active" : ""
}`}
className={`tool-button ${
activeTool === "play" ? "active" : ""
}`}
onClick={() => {
setIsPlaying(!isPlaying);
}}
@@ -434,8 +448,9 @@ const Tools: React.FC = () => {
<>
<div className="split"></div>
<div
className={`toggle-threed-button${toggleThreeD ? " toggled" : ""
}`}
className={`toggle-threed-button${
toggleThreeD ? " toggled" : ""
}`}
onClick={toggleSwitch}
>
<div className="tooltip">toggle view (tab)</div>