lukmangrd
/
platypush
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Added switch.tplink web widget

This commit is contained in:
Fabio Manganiello 2018-06-26 22:14:11 +02:00
parent 0f3895ad41
commit 65f9610cce
5 changed files with 116 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
platypush/backend/http/static/css/switch.tplink.css Normal file
View File

@ -0,0 +1,29 @@
#tplink-container {
background-color: #f8f8f8;
padding: 12px;
border: 1px solid #ddd;
border-radius: 10px;
font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 400;
line-height: 38px;
letter-spacing: .1rem;
}
.tplink-device {
padding: 1.5em 1em .2em .5em;
border-radius: 10px;
}
.tplink-device:nth-of-type(odd) {
background-color: #ececec;
}
.tplink-device:hover {
background-color: #daf8e2 !important;
}
.toggle-container {
text-align: right;
padding-right: 1em;
}

76
platypush/backend/http/static/js/switch.tplink.js Normal file
View File

@ -0,0 +1,76 @@
$(document).ready(function() {
var switches,
$tplinkContainer = $('#tplink-container');
var createPowerToggleElement = function(dev) {
var $powerToggle = $('<div></div>').addClass('toggle toggle--push switch-ctrl-container');
var $input = $('<input></input>').attr('type', 'checkbox')
.data('name', dev.host).attr('name', dev.alias).addClass('toggle--checkbox switch-ctrl');
var $label = $('<label></label>').attr('for', dev.alias).addClass('toggle--btn');
$input.appendTo($powerToggle);
$label.appendTo($powerToggle);
if (dev.on) {
$input.prop('checked', true);
}
return $powerToggle;
};
var updateDevices = function(devices) {
for (var dev of devices) {
var $dev = $('<div></div>').addClass('row tplink-device').data('name', dev.alias);
var $devName = $('<div></div>').addClass('ten columns name').text(dev.alias);
var $toggleContainer = $('<div></div>').addClass('two columns toggle-container');
var $toggle = createPowerToggleElement(dev);
$toggle.appendTo($toggleContainer);
$devName.appendTo($dev);
$toggleContainer.appendTo($dev);
$dev.appendTo($tplinkContainer);
}
};
var initWidget = function() {
execute(
{
type: 'request',
action: 'switch.tplink.status'
},
onSuccess = function(response) {
updateDevices(Object.values(response.response.output.devices));
}
);
};
var initBindings = function() {
$tplinkContainer.on('click touch', '.switch-ctrl-container', function() {
var $input = $(this).find('.switch-ctrl');
var devAddr = $input.data('name');
execute(
{
type: 'request',
action: 'switch.tplink.toggle',
args: { device: devAddr }
},
onSuccess = function(response) {
var status = response.response.output.status;
$input.prop('checked', status == 'on' ? true : false);
}
);
});
};
var init = function() {
initWidget();
initBindings();
};
init();
});

2
platypush/backend/http/static/js/switch.wemo.js
View File

@ -7,7 +7,7 @@ $(document).ready(function() {
var $input = $('<input></input>').attr('type', 'checkbox')
.attr('name', dev.name).addClass('toggle--checkbox switch-ctrl');
var $label = $('<label></label>').attr('for', id).addClass('toggle--btn');
var $label = $('<label></label>').attr('for', dev.name).addClass('toggle--btn');
$input.appendTo($powerToggle);
$label.appendTo($powerToggle);

5
platypush/backend/http/templates/plugins/switch.tplink.html Normal file
View File

@ -0,0 +1,5 @@
<script type="text/javascript" src="{{ url_for('static', filename='js/switch.tplink.js') }}"></script>
<link rel="stylesheet" href="{{ url_for('static', filename='css/switch.tplink.css') }}"></script>
<div id="tplink-container" class="row"></div>

12
platypush/plugins/switch/tplink.py
View File

@ -22,17 +22,15 @@ class SwitchTplinkPlugin(SwitchPlugin):
:returns: The available device over the network as a
"""
devices = dict(
(ip, {
devices = { 'devices': {
ip: {
'alias': dev.alias,
'current_consumption': dev.current_consumption,
'current_consumption': dev.current_consumption(),
'host': dev.host,
'hw_info': dev.hw_info,
'on': dev.is_on,
})
for (ip, dev) in self._scan()
)
} for (ip, dev) in self._scan().items()
} }
return Response(output=devices)