Table states

Attention.png

Booked Free.png

Booked Occupied.png

Booked Web order.png

Free.png

Occupied.png

Paid booked.png

Paid.png

SketchSystems.spec

Table states
  Free
    Open order -> Occupied
    #Opened by customer
    Open web order -> Web order
    Upcoming bookings in next 3hrs? -> Booked Free
    
  Seated  
    Occupied
      #Opened by customer
      Open web order -> Web order
      Order paid -> Paid
      Upcoming bookings in next 3hrs? -> Booked Occupied
  
    Web order
      Customer split bill request -> Attention
      Order paid -> Web order paid
      Upcoming bookings in next 3hrs? -> Booked Web order
    
     Web order paid
      Auto-clear after 10min -> Free

    Attention
      #Customer or waiter made changes 
      Made changes to order -> Web order
      Order paid -> Paid
  
    Paid
      Auto-clear after 10min -> Free
    
    Paid booked
      Auto-clear after 10min -> Booked Free
    
    Web order paid booked
      Web order paid -> Booked Web order
  
  Booked
    Booked Free
      Auto-clear when booking time expired -> Free
      New order for booking -> Occupied
      #non-booking order
      New order -> Booked Occupied
      New web order -> Web order
    
    Booked Occupied
      Auto-clear when booking time expired -> Are there other orders? 
      Order paid -> Paid booked
    
    Booked Web order
      New order for booking -> Web order
      Order paid -> Web order paid booked
      
      

Are there other orders?
  Yes -> Occupied
  No -> Free    
  
    
   

SketchSystems_prototype.js

function render(model){
  if (model.active_states[0].image_url) {
    return $("img", 
             {src: model.active_states[0].image_url, style: {height: "100%"}});
  } else {
    return "No image available."
  }
}

Web order paid booked.png

Web order paid.png

Web order.png