Results 1 to 2 of 2

Thread: Help! - Creating Custom Web Interface using JSON

  1. #1
    Automated Home Jr Member
    Join Date
    Apr 2016
    Posts
    26

    Question Help! - Creating Custom Web Interface using JSON

    Hi all, I have a programmable custom controller that has network connection and a web interface which mimics the push button actions of the controller. I'd like to create a better GUI as the one provided is pretty basic but I don't have much understanding on how to do this. Can anyone point me in the direction of resources or if there is a programmer out there that can help it would be appreciated. I can do HTML fairly easily and CSS to a certain point but managing JSON is beyond me!

    Commands such as this is what is returned when entering the url http://xxx.xxx.xxx.xxx/json/base_status and that should feed into the web interface GUI to set the layout rules.

    {
    "base_status": {
    "status_id": 1,
    "unit_name": "",
    "buttons": [{
    "id": 1,
    "mode": "low",
    "rgb": [255, 255, 255],
    "css": "rgb(255, 255, 255)",
    "label": ""
    }, {
    "id": 2,
    "mode": "low",
    "rgb": [255, 255, 255],
    "css": "rgb(255, 255, 255)",
    "label": ""
    }, {
    "id": 3,
    "mode": "low",
    "rgb": [255, 255, 255],
    "css": "rgb(255, 255, 255)",
    "label": ""
    }, {
    "id": 4,
    "mode": "low",
    "rgb": [255, 255, 255],
    "css": "rgb(255, 255, 255)",
    "label": ""
    }, {
    "id": 5,
    "mode": "low",
    "rgb": [255, 255, 255],
    "css": "rgb(255, 255, 255)",
    "label": ""
    }, {
    "id": 6,
    "mode": "low",
    "rgb": [255, 255, 255],
    "css": "rgb(255, 255, 255)",
    "label": ""
    }, {
    "id": 7,
    "mode": "low",
    "rgb": [255, 255, 255],
    "css": "rgb(255, 255, 255)",
    "label": ""
    }, {
    "id": 8,
    "mode": "low",
    "rgb": [255, 255, 255],
    "css": "rgb(255, 255, 255)",
    "label": ""
    }, {
    "id": 9,
    "mode": "low",
    "rgb": [255, 255, 255],
    "css": "rgb(255, 255, 255)",
    "label": ""
    }, {
    "id": 10,
    "mode": "low",
    "rgb": [255, 255, 255],
    "css": "rgb(255, 255, 255)",
    "label": ""
    }]
    }
    }

  2. #2
    Automated Home Jr Member
    Join Date
    Apr 2016
    Posts
    26

    Default

    Oh, just to add, I know what the actual commands and returns mean and their intended function, but what I can't do is correlate them to a GUI action. For example, If I pressed button 1 (ID1) then the label changes, the RGB changes and the mode changes and behind all of that there are some actions that are performed such as RS232 or IR control. The GUI would then reflect the current status of the controller. As one of the action of the button press is to change the function of the other buttons (button 1 is "Amplifier" buttons 2 - 8 now change functions on the amp) then I want the images for the buttons on the GUI to change.

    Once I can figure out how to do this then I can programme all 8 levels for all 8 buttons and volume control.

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •