Understanding Networks Wk 10: Restful API Drawing Machine (Updated)

Live Drawing Show!

Goal:

  •  User will draw on the website’s draw page. The Axi Draw will update based on user’s drawing. There will be a camera that is recording. The recording will be sent to the website’s live stream page so others can see the live stream of the drawing. 
    Image result for axi draw

    IMG_7722.jpg

Functionality:

  • Co-Draw allows people to contribute to a drawing using a web interface
  • Control the Axidraw’s position based on the user’s mouse x and y position on the website.
  • Include a camera that video records the Live Drawing show. The live stream will be posted on a separate page on the website.
  • Ideally: use socket.io to allow 2 people to draw at the same time.

REST API:

1.) Identify Axi Draw Machine

  • Address: /identify_axi
  • Method: ?


2. ) Find current position of the user’s mouse x and mouse y on the website

 

Address: /pen_position

Method: post

Body:

{
   “mouse_x”: 2344,
   “mouse_y”: 281,
   “state” : 1  //pen state is from 0 to 1 (down/on)
}

Response:

“coordinates”: [
        {
        “success”: 
            {
             “type”: “200”, //ok
             “mouse_x”: “2344”,
             “mouse_y”: “281”,
             “state”: “1”
            },
         “error”: 
             {
               “type”: “400”, //error
               “details”: “invalid inputs”
             }
         }
     ]
}

3. ) Set to original position when user presses Reset Button

Address: /original
Method: POST
Body: 

{
   “mouse_x”: 0,
   “mouse_y”: 0,
   “state” : 0 // off
}

Response: 

{
    “original_position”:[
        “success”: 
        {
            “mouse_x”: 0,
            “mouse_y”: 0,
            “state” : 0 // off
         },

   “error”: 
        {
             “type”: “400”,
             “details”: “invalid inputs”
         }
      ] 
}

Video for live stream

4.) Get channel 

Address: /channel
Method: GET
Body: 

Response: 

{
    “channel”:[
        “success”: 
        {
            “recording”: on, //turn channel on or off
            “channel_id”: {channel_id}, //integer
            “width": 1920px,
            "height": 1080px
         },

   “error”: 
        {
             “type”: “400”,
             “details”: “invalid inputs”
         }
      ] 
}

5.) Post channel data to client

Address: /channel
Method: POST

{
 “channel”:
      “recording”: on, //turn channel on or off
      “channel_id”: {channel_id}, //integer
      “width": 1920px,
      "height": 1080px
}

Reference: