I would just make every object (table) a button/link. Each object can be placed onto a pre-defined grid.
Can then add/remove objects on the grid. Get more complex from there, such as assigning waiters to the grid section which would link to that table/object.
I've implemented the click functionality and everything that needs to come after that. So that each waiter can have their own table(s) and tabs on them.
But the problem mostly arrives when the admin wants to change the position of tables, move them freely around the screen and have them saved in that position. And I'm not sure if I can use the mouse X/Y cords due to the resolutions to use it as a center of block and draw around it and than store it like that in the db.
I would just make every object (table) a button/link. Each object can be placed onto a pre-defined grid.
Can then add/remove objects on the grid. Get more complex from there, such as assigning waiters to the grid section which would link to that table/object.
I've implemented the click functionality and everything that needs to come after that. So that each waiter can have their own table(s) and tabs on them.
But the problem mostly arrives when the admin wants to change the position of tables, move them freely around the screen and have them saved in that position. And I'm not sure if I can use the mouse X/Y cords due to the resolutions to use it as a center of block and draw around it and than store it like that in the db.
Don't bother with drag and drop, can just click on the grid area and have a modal with add/remove.
You can use the mouse DOM coordinates. You just have to make sure you translate them into SVG coordinates. You may find these links helpful: