Link in Dasboard / Devices

Development
1

Hi Everybody, i try to insert a hyperlink in the GUI dashboard to open the device config page directly in a new browser tab. If you click on a remote device in the dashboard it expand and shows details. In one line is the IP address of the connected device. I want to click on the small symbol before “Address” and get a new Page which connect me directly to this device (http://ip_of_the_device:3834.

in Index.html I found in line 716 the relevant part for the icon and put a href for testing inside. Of course, this gives me the wrong port.

<th><a target="_blank" rel="noopener noreferrer" href="http://{{deviceAddr(deviceCfg)}}"><span class="fas fa-fw fa-link"></span></a>&nbsp<span translate>Address</span></th>

Is there an Variable I can use instead of {{deviceAddr(deviceCfg)}} which gives me just the IP of the remote device whitout the port number ?

Thanks and best regards

2

I don’t think so, you will probably need to implement some splitting or replacement logic.

3

OK, thanks. In case someone else is interested in this:

i found the function in line 1054 of syncthingController.js. looks like it is not used somewhere else, so i split the conn.address and returned only the first part:

$scope.deviceAddr = function (deviceCfg) {

            var conn = $scope.connections[deviceCfg.deviceID];

            if (conn && conn.connected) {

                var IP = (conn.address.split(":"))[0];

                return IP;

            }

            return '?';

        };

in line 716 of index.html just use this:

<th><a target="_blank" rel="noopener noreferrer" href="http://{{deviceAddr(deviceCfg)}}:8384"><span class="fas fa-fw fa-link"></span></a>&nbsp<span translate>Address</span></th>

If you click now on the small icon before the adress field, a new browser tab opens and lead you directly to the remote device webpanel.

4

If nothing else you will likely want to split on the last colon, given IPv6 stuff like [2001:db8::42%foo]:2000. I don’t think changing the function return just the IP is great, there is some value in seeing the port used for other device.

5

Yes, thanks. Thats right. So leaving the original function intact and add a new one with a better split.

$scope.remoteWeb = function (deviceCfg) {

            var conn = $scope.connections[deviceCfg.deviceID];

            if (conn && conn.connected) {

                var IP = conn.address.substring(0,conn.address.lastIndexOf(":"));                

                return IP;

            }

            return '?';

        };

and calling it via {{remoteWeb(deviceCfg)}} So, the Link is working and the display of IP and port stays as before. Need to say coding is not my daily business. So, there is room to improve on this.

Btw. I detected Syncthing a few days ago. I was searching for a replacement of Microsoft DFSR. I will use it to sync around 80 sites connectected via satellite link (Inmarsat and VSAT). So far it is rolled out on 11 sites as a test and so far looks very good. Amazing piece of software !

1 Like