68 lines
No EOL
2.2 KiB
JavaScript
68 lines
No EOL
2.2 KiB
JavaScript
import ActiveObjectContext from '@/components/Context/activeObject/ObjectContext';
|
|
import CanvasContext from '@/components/Context/canvasContext/CanvasContext';
|
|
import { Button } from '@/components/ui/button';
|
|
import { useToast } from '@/hooks/use-toast';
|
|
import { useContext, useEffect, useState } from 'react';
|
|
import { Lock, Unlock } from "lucide-react";
|
|
import { Card } from '@/components/ui/card';
|
|
|
|
const LockObject = () => {
|
|
const { canvas } = useContext(CanvasContext);
|
|
const { activeObject } = useContext(ActiveObjectContext);
|
|
const [isLocked, setIsLocked] = useState(false);
|
|
const { toast } = useToast();
|
|
|
|
useEffect(() => {
|
|
if (activeObject?.lockMovementX === false) {
|
|
setIsLocked(false);
|
|
}
|
|
else {
|
|
setIsLocked(true);
|
|
}
|
|
}, [activeObject])
|
|
|
|
const toggleLock = () => {
|
|
if (!canvas || !activeObject) {
|
|
toast({
|
|
title: "No object selected",
|
|
description: "Please select an object to lock or unlock.",
|
|
variant: "destructive",
|
|
})
|
|
return;
|
|
}
|
|
|
|
const newLockState = !activeObject.lockMovementX;
|
|
activeObject.set({
|
|
lockMovementX: newLockState,
|
|
lockMovementY: newLockState,
|
|
lockRotation: newLockState,
|
|
lockScalingX: newLockState,
|
|
lockScalingY: newLockState,
|
|
});
|
|
|
|
setIsLocked(newLockState);
|
|
canvas.requestRenderAll();
|
|
|
|
toast({
|
|
title: newLockState ? "Object locked" : "Object unlocked",
|
|
description: newLockState ? "The object is now locked in place." : "The object can now be moved and resized.",
|
|
})
|
|
}
|
|
|
|
return (
|
|
<Card className="p-2">
|
|
<h2 className='font-bold'>{!isLocked ? "Lock" : "Unlock"} Object</h2>
|
|
<Button
|
|
onClick={toggleLock}
|
|
variant="outline"
|
|
size="icon"
|
|
disabled={!activeObject}
|
|
title={isLocked ? "Unlock object" : "Lock object"}
|
|
>
|
|
{isLocked ? <Unlock className="h-4 w-4" /> : <Lock className="h-4 w-4" />}
|
|
</Button>
|
|
</Card>
|
|
)
|
|
}
|
|
|
|
export default LockObject |