[PiDomeParticipant]

Hi Dimitar,

Thank you for your answer, too bad though.

John.

[PiDomeParticipant]

Hi Dimitar,

I have a jsfiddle ready at: http://jsfiddle.net/z06c7m1c/4/

I just removed a piece from the series i had recently to “mimic” a data gap. Normally this data is loaded by an url, hence the strange “fake” parameters, i replaced it with a local var.

Just in case it is a browser issue, this is how the fiddle looks in chrome

[PiDomeParticipant]

Hi Dimitar,

I think i have found the issue. My docking is loaded not in the head but in the body after a async call to the getFavoriteDevices. This function is dynamic in the way that users can add/remove their favorite devices which will cause this rpc call to have a entry added or removed.

I have tested it with 3.5.0 and it now works only when i use custom device id’s on the windows, which is logical due to the application setup, so it is clear to me now. When i add a new favorite device (new block). All goes fine the moved blocks are put where they are supposed to and the other blocks are shifted according the rpc call output order. So that’s good!

But, here it comes, when i remove a device, so a specific window id is not present, i get the popup again about an invalid json. This is a kinda misleading message because the json itself is not invalid, the json is correct, but the docking just can not find the window id stated in the json.

So yes, it is working, but, i really really really need to get rid of this alert box in a graceful way so it just skips the not found window id and it continues with the the window following up.

If i have to hack and slash my way through the code i won’t mind. This dashboard setup has been presented during JavaOne this week. So when i release an upcoming version i really need to get this up and running without errors. So if there is any option to discard a non found id you will make me very happy. If there ain’t such an option could you please point me to the location where i can suppress this message and let the docking continue it’s work?

[PiDomeParticipant]

Hi Dimitar,

I will try the above and will report back, thank you.

John.

[PiDomeParticipant]

Also, is it possible to assign custom id’s to the windows so i could create dynamic listings? Unless this already is possible.

[PiDomeParticipant]

Hi Dimitar,

The following is the output from the external service

{
    "jsonrpc": "2.0",
    "id": "DeviceService.getFavoriteDevices",
    "result": {
        "data": [
            {
                "friendlyname": "Rasp server",
                "locationname": "Location unknown",
                "categoryconstant": "PIDOME",
                "categoryname": "PiDome",
                "location": 1,
                "id": 1,
                "category": 2,
                "commandgroups": [
                    {
                        "name": "Device values",
                        "id": "values",
                        "commands": [
                            {
                                "commandtype": "data",
                                "currentvalue": 15.39,
                                "typedetails": {
                                    "visualtype": "",
                                    "graphtype": "time-series",
                                    "shortcut": 1,
                                    "datatype": "float",
                                    "prefix": "",
                                    "visual": false,
                                    "commandset": [],
                                    "id": "memusage",
                                    "label": "Memory usage",
                                    "deviceCommandValue": 15.39,
                                    "suffix": "MB",
                                    "graph": true
                                }
                            },
                            {
                                "commandtype": "data",
                                "currentvalue": 44.9,
                                "typedetails": {
                                    "visualtype": "",
                                    "graphtype": "time-series",
                                    "datatype": "float",
                                    "prefix": "",
                                    "visual": false,
                                    "commandset": [],
                                    "id": "procheat",
                                    "label": "Pi temperature",
                                    "deviceCommandValue": 44.9,
                                    "suffix": "°C",
                                    "graph": true
                                }
                            },
                            {
                                "commandtype": "data",
                                "currentvalue": 5.16,
                                "typedetails": {
                                    "visualtype": "",
                                    "graphtype": "time-series",
                                    "shortcut": 0,
                                    "datatype": "float",
                                    "prefix": "",
                                    "visual": false,
                                    "commandset": [],
                                    "id": "cpuusage",
                                    "label": "CPU load",
                                    "deviceCommandValue": 5.16,
                                    "suffix": "%",
                                    "graph": true
                                }
                            },
                            {
                                "commandtype": "data",
                                "currentvalue": 602.81,
                                "typedetails": {
                                    "visualtype": "",
                                    "graphtype": "time-series",
                                    "datatype": "float",
                                    "prefix": "",
                                    "visual": false,
                                    "commandset": [],
                                    "id": "diskspace",
                                    "label": "Disk space",
                                    "deviceCommandValue": 602.81,
                                    "suffix": "MB",
                                    "graph": true
                                }
                            }
                        ]
                    }
                ]
            },
            {
                "friendlyname": "PiDome User stats",
                "locationname": "Location unknown",
                "categoryconstant": "DISPLAY",
                "categoryname": "Display",
                "location": 1,
                "id": 17,
                "category": 11,
                "commandgroups": [
                    {
                        "name": "Environment",
                        "id": "0",
                        "commands": [
                            {
                                "commandtype": "data",
                                "currentvalue": 16.0751,
                                "typedetails": {
                                    "visualtype": "luxlevel",
                                    "graphtype": "time-log",
                                    "shortcut": 1,
                                    "datatype": "float",
                                    "prefix": "",
                                    "visual": true,
                                    "commandset": [],
                                    "id": "V_LIGHT_LEVEL",
                                    "label": "Light",
                                    "deviceCommandValue": 16.0751,
                                    "suffix": "Lux",
                                    "graph": true
                                }
                            },
                            {
                                "commandtype": "data",
                                "currentvalue": 22.3,
                                "typedetails": {
                                    "visualtype": "celsiuslevel",
                                    "graphtype": "time-series",
                                    "shortcut": 0,
                                    "datatype": "float",
                                    "prefix": "",
                                    "visual": true,
                                    "commandset": [],
                                    "id": "V_TEMP",
                                    "label": "Temperature",
                                    "deviceCommandValue": 22.3,
                                    "suffix": "°C",
                                    "graph": true
                                }
                            }
                        ]
                    }
                ]
            },
            {
                "friendlyname": "Motion sensor living",
                "locationname": "Location unknown",
                "categoryconstant": "MOTION",
                "categoryname": "Motion",
                "location": 1,
                "id": 20,
                "category": 10,
                "commandgroups": [
                    {
                        "name": "Detection",
                        "id": "devicereadings",
                        "commands": [
                            {
                                "commandtype": "data",
                                "currentvalue": false,
                                "typedetails": {
                                    "visualtype": "",
                                    "graphtype": "",
                                    "shortcut": 0,
                                    "datatype": "boolean",
                                    "prefix": "",
                                    "visual": false,
                                    "commandset": [],
                                    "id": "devicenoticed",
                                    "label": "Movement",
                                    "deviceCommandValue": false,
                                    "suffix": "",
                                    "graph": false
                                }
                            }
                        ]
                    }
                ]
            },
            {
                "friendlyname": "Lights at wall cabinet",
                "locationname": "Location unknown",
                "categoryconstant": "LIGHT",
                "categoryname": "Lighting",
                "location": 1,
                "id": 24,
                "category": 3,
                "commandgroups": [
                    {
                        "name": "Device actions",
                        "id": "deviceactions",
                        "commands": [
                            {
                                "commandtype": "toggle",
                                "currentvalue": true,
                                "typedetails": {
                                    "shortcut": 0,
                                    "datatype": "hex",
                                    "commandset": {
                                        "off": {
                                            "label": "Off",
                                            "value": "off"
                                        },
                                        "on": {
                                            "label": "On",
                                            "value": "on"
                                        }
                                    },
                                    "id": "deviceswitch",
                                    "label": "Switch device",
                                    "deviceCommandValue": true
                                }
                            }
                        ]
                    }
                ]
            }
        ],
        "success": true,
        "message": ""
    }
}

Which produces the blocks as seen in this screenshot (The upper part below the devices header):

[PiDomeParticipant]

The below is when i export a layout

{"panel0": {"jqxWidget3ca77739":{"collapsed":false},
            "jqxWidget0c82ec80":{"collapsed":false}},
 "panel1": {},
 "panel2": {"jqxWidget3138414c":{"collapsed":false},
            "jqxWidget1ffc446d":{"collapsed":false}},
 "floating":{},
 "orientation": "horizontal"}

[PiDomeParticipant]

Hi Dimitar,

I’m using the following code:

        <div id="favoriteblock" style="max-height: 500px;margin-left: 0px; overflow-x:hidden; overflow-y:auto;">
            <div id="favoriteblock_0"></div>
            <div id="favoriteblock_1"></div>
            <div id="favoriteblock_2"></div>
        </div>

        $.get('/jsonrpc.json?rpc={"jsonrpc": "2.0", "method": "DeviceService.getFavoriteDevices","id":"DeviceService.getFavoriteDevices"}').done(function(data) {
            try {
                var curBlock;
                for(var i=0;i<data.result.data.length;i++){
                    var device = data.result.data[i];
                    curBlock = '#favoriteblock_' + i%3;
                    $(curBlock).append('<div class="favitemdock"><div><div onclick="refreshPageContent(\'/desktop/devices.html?deviceLink='+device.id+'\')" style="cursor:pointer; line-height:17px;">'+device.friendlyname+'</div></div>\n\
                                                    <div>\n\
                                                        <div style="min-height:50px; padding-bottom:0px;">\n\
                                                            <img src="" id="fav_img_'+device.id+'" alt="'+device.friendlyname+'" style="float:left;"/>\n\
                                                            <table style="float:left;margin-left:5px;" id="fav_'+device.id+'"></table>\n\
                                                            <div style="clear:both;"></div>\n\
                                                        </div>\n\
                                                    </div></div>');
                    composeDeviceVisuals('fav_'+device.id, device, false, true, true);
                    setDeviceCatImage('fav_img_'+device.id, device.categoryconstant);
                }
                $("#favoriteblock").jqxDocking({ cookieOptions: { expires: 3600 }, cookies: true, mode: 'docked', orientation: 'horizontal', width: 820, theme: siteSettings.getTheme()});
                $("#favoriteblock").jqxDocking('hideAllCloseButtons');
                $('#favoriteblock').jqxDocking('showAllCollapseButtons');
            } catch (err){
                alert(err);
            }
        });

All the docked items appear as they should, The error pops up when cookies are set to true, i have also tried to set cookie options host to the ip address where the page runs. When cookies are set to false the message is gone.

This is the one and only item on the whole site that places a cookie. and the above string is this cookie contents. When i remove the cookie and have set cookies to false, no cookies are set.

There is an alert(err) in the catch block, but when removed the JSON error still appears.

Best regards,
John.

[PiDomeParticipant]

Hi Peter,

Thank you for your response, maybe i’m doing something wrong then, because i can not get the above working correctly. When i initialize the color picker it opens automatically, when clicked outside the color picker region it does not close, and i’m not seeing any options to add a confirm or cancel button.

Should i use for example an jqxwindow with jqxbuttons to mimic the above required options or are there any color picker api possibilities?

Best regards,
John.

[PiDomeParticipant]

Hi Dimitar,

Maybe i’ve overlooked it but this explains the usage of decimalPlaces. Thank you for your response and example.

Best regards,
John.

[PiDomeParticipant]

Hi Peter,

No problem, just created a workaround, thank you for the response.

John.

[PiDomeParticipant]

Hi Peter,

This works perfectly when commandset is an array, but that is not always the case, sometimes it is an object like below:

{
-typedetails: {
id: "cPAUA4LGMu"
label: "Switch device"
datatype: "hex"
shortcut: "true"
pos: "0"
}
commandtype: "toggle"
currentvalue: null
-commandset: {
-off: {
value: "0x00"
}
-on: {
value: "0x54"
}
}
}

Maybe the follow up code which makes use of for example this data adapter may clear’s it up a little bit what i’m trying to achieve

                                                $("#itemMatchDevicegroupaction").jqxDropDownList({source: DataDeviceCommandGroupActionList, valueMember: "id", displayMember: "label", width: '200', theme: siteSettings.getTheme()});
                                                $("#itemMatchDevicegroupaction").on('select', function(event) {
                                                    if (event.args) {
                                                        var item = event.args.item;
                                                        if (item) {
                                                            var deviceItem = $("#itemMatchDevice").jqxComboBox('getItem', $("#itemMatchDevice").jqxComboBox('getSelectedIndex'));
                                                            var groupItem = $("#itemMatchDevicegroup").jqxDropDownList('getItem', $("#itemMatchDevicegroup").jqxDropDownList('getSelectedIndex'));
                                                            var actionItem = $("#itemMatchDevicegroupaction").jqxDropDownList('getItem', $("#itemMatchDevicegroupaction").jqxDropDownList('getSelectedIndex'));
                                                            try {
                                                                var prefix = DataDeviceCommandGroupActionList.records[$("#itemMatchDevicegroupaction").jqxDropDownList('getSelectedIndex')].prefix;
                                                                var suffix = DataDeviceCommandGroupActionList.records[$("#itemMatchDevicegroupaction").jqxDropDownList('getSelectedIndex')].suffix;
                                                            } catch (err) {}
                                                            callBackData = {
                                                                "itemType" : "device",
                                                                "deviceId" : deviceItem.value,
                                                                "deviceGroupId" : groupItem.value,
                                                                "deviceCommandId" : actionItem.value,
                                                                "deviceName" : deviceItem.label,
                                                                "deviceGroupName" : groupItem.label,
                                                                "deviceCommandName" : actionItem.label,
                                                                "deviceCommandPrefix": prefix===undefined?"":prefix,
                                                                "deviceCommandSuffix" : suffix===undefined?"":suffix,
                                                                "deviceCommandType" : DataDeviceCommandGroupActionList.records[$("#itemMatchDevicegroupaction").jqxDropDownList('getSelectedIndex')].commandtype,
                                                                "deviceCommandSet" : DataDeviceCommandGroupActionList.records[$("#itemMatchDevicegroupaction").jqxDropDownList('getSelectedIndex')].commandset
                                                            };
                                                        }
                                                    }
                                                });

When a button is pressed to confirm the selections a previous set callback function will be executed and is passed the callBackData parameter.

I understand the data adapter is meant to supply record data for for example the widgets, but is there a possibility to have a an option which says “type : ‘object'” when the datatype is json or can i do a feature request for it?

Best regards,
John.

[PiDomeParticipant]

Sorry, this is the correct pastebin: http://pastebin.com/3veSBKMc

[PiDomeParticipant]

Hi Peter,

My bad, I will modify my code so it will show values in an other way when hovering.

Thank you for your response,

John.

[PiDomeParticipant]

Hi Peter,

Maybe the next screenshot makes it clearer: http://pidome.wordpress.com/screenshots/web-screenshots/newlocationeditor/

When a user adds or edits a floor, all the floor comboboxes are refreshed with the data adapter. The floor edits also triggers a other data adapter for the locations combobox which are childs of the floors.

On the bottom of the page there is Edit/Delete locations header where the locations dropdown resides and over there i would like to use the categories function with the JSON result as shown above in the first post. There i would like to use the floorname as category.

So the question is as follows:
Can i use a dataBind function for the locations data adapter which: First, as works, retrieve the original JSON result, put it in an array wich it prepares the array with “group”, “value” and “label” fields and finally automatically updates the combobox with the prepared array?

Best regards,
John.

[Author]

Posts