yetangitu/OpenSTF
1
0
Fork 0
mirror of https://github.com/openstf/stf synced 2025-10-06 03:50:04 +02:00
Code Issues Releases Wiki Activity

Start implementing new port forwarding UI.

Browse source
This commit is contained in:
Simo Kinnunen 2014-10-14 14:15:23 +09:00
parent 8ffb037fbd
commit 04d261044c
2 changed files with 39 additions and 136 deletions
Download patch file Download diff file Expand all files Collapse all files

145
res/app/control-panes/advanced/port-forwarding/port-forwarding-controller.js
View file

@ -1,127 +1,34 @@
var _ = require('lodash')
module.exports = function PortForwardingCtrl($scope, ngTableParams,
SettingsService, gettext) {
$scope.forwarding = false
// SettingsService.bind($scope, {
// key: 'forwarding',
// storeName: 'PortForwarding.forwarding'
// })
// SettingsService.bind($scope, {
// key: 'portSets',
// storeName: 'PortForwarding.portSets'
// })
function getPortSets() {
return $scope.portSets.slice(0, -1) // Last item is empty
}
function forwardPorts() {
_.forEach(getPortSets(), function (portSet) {
$scope.control.createForward(portSet).then(function (result) {
console.log(result)
if (result.error === 'fail_forward') {
alert(gettext('Error: Forwarding ports failed.'))
}
}).catch(function (err) {
console.error(err)
})
})
}
function unforwardPorts() {
_.forEach(getPortSets(), function (portSet) {
$scope.control.removeForward(portSet).then(function (result) {
console.log(result)
if (result.error) {
alert(result.error)
}
}).catch(function (err) {
console.error(err)
})
})
}
$scope.$watch('forwarding', function (newValue, oldValue) {
if (newValue !== oldValue) {
if (newValue) {
forwardPorts()
} else {
if (typeof oldValue !== 'undefined') {
unforwardPorts()
}
}
} else {
// It's the first time, probably not forwarding
$scope.forwarding = false
}
})
function portFieldsAreEmpty(ports) {
return (_.isEmpty(ports.targetHost) && _.isEmpty(ports.targetPort) &&
_.isEmpty(ports.devicePort))
}
$scope.portSets = [
module.exports = function PortForwardingCtrl(
$scope
, SettingsService
) {
$scope.reversePortForwards = [
{
targetHost: 'localhost',
targetPort: 8080,
devicePort: 8080
targetHost: 'localhost'
, targetPort: 8080
, devicePort: 8080
, enabled: false
}
]
// SettingsService.getItem('PortForwarding.portSets').then(function (result) {
// if (result) {
// $scope.portSets = result
// } else {
// console.log('here')
// }
// console.log(result)
// })
function createEmptyField() {
if (!$scope.portSets) {
$scope.portSets = []
}
var empty = {
targetHost: null,
targetPort: null,
devicePort: null
}
$scope.portSets.push(empty)
}
// Adds a new row whenever necessary
$scope.$watch('portSets', function (newValue) {
if (newValue) {
// Remove all empty sets from the middle
_.remove(newValue, function (ports, index) {
// Skip last and remove empty fields
return !!(newValue.length !== index + 1 && portFieldsAreEmpty(ports))
SettingsService.bind($scope, {
target: 'reversePortForwards'
, source: 'reversePortForwards'
})
var last = _.last(newValue)
if (!portFieldsAreEmpty(last)) {
createEmptyField()
}
}
//SettingsService.setItem('PortForwarding.portSets', angular.copy($scope.portSets))
}, true)
$scope.portsTable = new ngTableParams({
page: 1,
count: 5
}, {
counts: [],
total: 1,
getData: function ($defer) {
$defer.resolve($scope.portSets)
}
$scope.enableForward = function(forward) {
forward.processing = true
return $scope.control.createForward(forward)
.finally(function() {
forward.processing = false
})
}
$scope.disableForward = function(forward) {
forward.processing = true
return $scope.control.removeForward(forward)
.finally(function() {
forward.processing = false
})
}
}

32
res/app/control-panes/advanced/port-forwarding/port-forwarding.jade
View file

@ -4,30 +4,26 @@
i.fa.fa-random
span(translate).pointer Port forwarding
button(ng-click='forwarding = !forwarding', ng-class="{active: forwarding}").btn.btn-primary-outline.btn-xs.pull-right
i.fa(ng-class="{'fa-arrow-circle-right': !forwarding, 'fa-times-circle': forwarding}")
span(ng-show='forwarding', translate) Unforward
span(ng-hide='forwarding', translate) Forward
.widget-content.padded(collapse='isCollapsed')
table(ng-table='portsTable').table.table-striped
table
thead
tr
th(width='28%')
th(colspan='2')
span(translate) Device
.button-spacer
i.fa.fa-arrow-right.fa-fw
th(width='44%')
th(colspan='3')
span(translate) Host
th(width='28%')
tbody
tr(ng-repeat='ports in $data')
//td(data-title='"Local" | translate').check
label
input(type='checkbox', ng-model='ports.targetLocal')
span
tr(ng-repeat='forward in reversePortForwards track by forward.devicePort')
td
input.form-control(type='number', min='0', ng-model='ports.devicePort', placeholder='{{"Port"|translate}}')
div.input-group
span.input-group-addon
input(type='checkbox', ng-model='forward.enabled')
input.form-control(type='number', min='0', ng-model='forward.devicePort', ng-model-options="{ updateOn: 'blur' }", placeholder='{{"Port"|translate}}')
td
input.form-control(type='text', ng-model='ports.targetHost', placeholder='{{"Hostname"|translate}}', ng-disabled='ports.targetLocal')
i.fa.fa-arrow-right.fa-fw
td
input.form-control(type='number', min='0', ng-model='ports.targetPort', ng-change='targetPortChanged(result)', placeholder='{{"Port"|translate}}')
input.form-control(type='text', ng-model='forward.targetHost', ng-model-options="{ updateOn: 'blur' }", placeholder='{{"Hostname"|translate}}')
td
span :
td
input.form-control(type='number', min='0', ng-model='forward.targetPort', ng-model-options="{ updateOn: 'blur' }", placeholder='{{"Port"|translate}}')