Implement Guest Login and Whiteboard History Playback (Time-Travel)#53
Open
Ashish1896 wants to merge 20 commits into
Open
Implement Guest Login and Whiteboard History Playback (Time-Travel)#53Ashish1896 wants to merge 20 commits into
Ashish1896 wants to merge 20 commits into
Conversation
Ashish1896
changed the title
Added keyboard shortcuts for brush, eraser, clear, undo, redo, and help functionality. Enhanced toolbar with autosave and improved button styles.
…les and remove button - Implements draggable image layer with grab cursor feedback - Four corner resize handles (NW, NE, SW, SE) with proportional scaling - Real-time position and scale updates via onUpdate callback - Remove button (X) to delete images from canvas - Proper event handling with mouse move/up listeners - Visual feedback with blue border and resize cursors - Prevents default drag behavior and event propagation - Works as children component in canvas to display imported images - Closes IEEE-PatchFest#14: Image Import Feature
- Import ImageLayer component for rendering draggable/resizable images - Map through playbackData.images array and render ImageLayer for each image - Implement onUpdate callback that updates image state and emits socket events - Implement onRemove callback that deletes images and emits removal events - Pass canvas size to ImageLayer for proper boundary calculations - Emit 'updateImage' and 'removeImage' events for real-time collaboration - Closes IEEE-PatchFest#14: Image Import Feature (partial - rendering and interaction)
Added a comprehensive contribution roadmap outlining strategic priorities, technical implementations, and expected outcomes for contributors to the real-time collaborative whiteboard project.
…chFest#8) This file implements the CommandHistory class for managing undo/redo functionality in a collaborative whiteboard drawing application. It includes Command, DrawCommand, and ClearCommand classes to handle Implement stack-based undo/redo system with Command design pattern: - CommandHistory class managing undo/redo stacks with max size limits - DrawCommand for recording individual drawing strokes - ClearCommand for canvas clear operations - Support for multiple commands with proper state management - Prevents recursive command execution - Includes serialization for potential localStorage persistence - Ready for integration into Canvas component Closes IEEE-PatchFest#8: Add Undo / Redo Functionalitydrawing actions and state management.
Implement custom React hook for undo/redo integration: - Custom useUndoRedo hook integrating CommandHistory with React - Provides recordDraw, recordClear, undo, redo methods - Tracks canUndo/canRedo states for UI integration - Keyboard shortcuts: Ctrl+Z (undo), Ctrl+Y or Ctrl+Shift+Z (redo) - Works with canvas context and ref for drawing operations - Cleanup on component unmount to prevent memory leaks - Ready to integrate into Canvas component Part of IEEE-PatchFest#8: Add Undo / Redo Functionality
Integrate CommandHistory and useUndoRedo hook with Canvas: - Import useUndoRedo hook at top of component - Initialize hook with canvasRef and canvas context - Call recordDraw() in both startDrawing and draw functions - Call recordClear() in canvas clear method - Hook automatically handles keyboard shortcuts (Ctrl+Z, Ctrl+Y) - Canvas state now tracked with full undo/redo capability - Ready for toolbar button integration Part of IEEE-PatchFest#8: Add Undo / Redo Functionality
Add Undo/Redo buttons with full UI integration: - Add onUndo, onRedo, canUndo, canRedo parameters to Toolbar component - Implement disabled state styling based on canUndo/canRedo - Green (#4CAF50) Undo button with ↶ icon - Blue (#2196F3) Redo button with ↷ icon - Keyboard shortcut hints in button titles - Proper button styling matching existing toolbar buttons - Buttons automatically disable when no history available Closes IEEE-PatchFest#8: Add Undo / Redo Functionality
…st#9) Add comprehensive room management utility: - Create new rooms with auto-generated IDs - Join existing rooms by ID - List all available rooms - Socket.io namespace isolation per room - Async drawing save/load per room - Room statistics tracking (users, drawing count) - Room ID validation and generation - Proper error handling for room operations - Ready for API endpoints integration Implements IEEE-PatchFest#9: Create Multiple Rooms
Implement useRoom custom React hook: - Create new rooms with automatic naming - Join existing rooms by ID - Fetch list of all available rooms - Save/load drawings per room - Room statistics tracking - Loading and error state management - Async room operations with proper error handling - Auto-load drawings when joining room - Direct manager access for advanced usage Part of IEEE-PatchFest#9: Create Multiple Rooms
…est#16) Add comprehensive viewport management for zoom/pan: - Mouse wheel zoom (0.1x to 5x scale) with center-point zoom - Pan via click-drag (space+drag or middle-mouse support ready) - Coordinate transformation (screen↔world) for accurate drawing - Configurable zoom bounds and step size - Viewport state save/restore for persistence - Fit-to-view auto-scaling functionality - Transform matrix management for proper scaling - Smooth zoom with center point preservation Implements IEEE-PatchFest#16: Add Zoom & Pan Controls
…E-PatchFest#16) Added viewport management functionality to the canvas component, allowing zooming and resetting the view.
…PatchFest#16) Added panning functionality and zoom controls to the canvas component.
Updated project title and enhanced project overview with badges and features.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This PR addresses issue #21 by implementing:
set-username).Fixes #21