Files
stf-DeviceFarmer/res/app/device-list/device-list.jade
Gunther Brunner 31899b9939 Device Icon view now is very fast:
- No filters
- Data enhanced
- ng-bind instead of {{}}
- Bind once
- ng-if for Devices List
2014-06-16 18:45:14 +09:00

164 lines
10 KiB
Plaintext

div.stf-device-list
.row
.col-md-12
.widget-container.fluid-height
.widget-content.padded
tabset.overflow-auto(ng-if='activeTabs').device-list-active-tabs
tab(active='activeTabs.devices')
tab-heading
i.fa.fa-th-large
span(translate) Devices
div(ng-if='activeTabs.devices').device-list-devices-content
nothing-to-show(message='{{"No devices connected"|translate}}', icon='fa-sitemap', ng-show='!tracker.devices.length')
.filtering-buttons.pull-right
input(type='search',results='5', autosave='deviceSearch'
name='deviceSearch', ng-model='deviceSearch', ng-change='deviceSearchChanged()',
autocorrect='off', autocapitalize='off', spellcheck='false').xform-control.device-search
//.input-group
input(type='text').form-control
//span.input-group-btn
button.btn.btn-primary-outline(type='button') Search
//clear-button(ng-click="tableParams.sorting({}); tableParams.filter({})")
.clear-filtering-buttons
ul.devices-icon-view
li(ng-repeat='device in tracker.devices | filter:{usable:true} | filter:{name:deviceSearch} | orderBy:"name" track by device.serial',
ng-click='device.usable && toggle(device)',
popover='{{ ::"Model: " | translate }}{{ ::device.model }}', popover-trigger='mouseenter', popover-popup-delay='0',
popover-title='{{ ::device.enhancedName }}', popover-placement='top', ng-hide='!device.model'
).cursor-select.pointer.thumbnail
.device-photo-small
img(ng-src='{{ ::device.enhancedImage120 }}')
.device-name(ng-bind='::device.enhancedName')
button(ng-class='device.enhancedButtonClass'
).btn.btn-xs.device-status(ng-bind='device.enhancedState')
.clear-fix
.clear-fix
.line
ul.devices-icon-view
li(ng-repeat='device in tracker.devices | filter:{usable:false} | filter:{name:deviceSearch} | orderBy:"name" track by device.serial',
ng-disabled='true', ng-hide='!device.model'
).cursor-select.pointer.thumbnail.device-is-busy
.device-photo-small
img(ng-src='{{ ::device.enhancedImage120 }}')
.device-name(ng-bind='::device.enhancedName')
button(ng-class='device.enhancedButtonClass',
ng-dblclick='tryToKick(device)',
).btn.btn-xs.device-status(ng-bind='device.enhancedState')
.clear-fix
tab(active='activeTabs.details', ng-show='!$root.basicMode')
tab-heading
i.fa.fa-list
span(translate) Details
div(ng-if='activeTabs.details', ng-controller='DeviceListDetailsCtrl').device-list-details-content
nothing-to-show(message='{{"No devices connected"|translate}}', icon='fa-sitemap', ng-show='!tracker.devices.length')
.filtering-buttons
clear-button(ng-click="clearSorting()")
filter-button(ng-model='filterEnabled')
.button-spacer.pull-right
.btn-group(dropdown).pull-right
button.btn.btn-sm.btn-primary-outline.dropdown-toggle
i.fa.fa-list-alt
span {{"Customize"|translate}}
ul.dropdown-menu(role='menu', data-toggle='dropdown').pointer.unselectable
li(ng-repeat='column in dynamicColumns', ng-click='$event.stopPropagation()')
label.checkbox
input(type='checkbox', checklist-model='selectedColumns', checklist-value='column')
span(ng-bind='column.title')
button(btn-checkbox, ng-model='showAll').btn.btn-sm.btn-primary-outline.pull-right
i.fa.fa-list-alt
span {{"Show All"|translate}}
//table.table.table-hover.dataTable(ng-table='tableParams', show-filter='filterEnabled')
thead
tr
th(ng-repeat='column in columns', ng-show='column.visible',
ng-class="{'sort-asc': tableParams.isSortBy(column.field, 'asc'), 'sort-desc': tableParams.isSortBy(column.field, 'desc')}",
ng-click="tableParams.sorting(column.field, tableParams.isSortBy(column.field, 'asc') ? 'desc' : 'asc')").text-center.sortable {{column.title}}
tbody
tr(ng-repeat='device in $data', ng-class='{ "device-not-usable": !device.usable }')
td(ng-repeat='column in columns', ng-show='column.visible', sortable='column.sortable', filter='column.filter')
span {{ device[column.field] }}
table.table.table-hover.dataTable(ng-table='tableParams', show-filter='filterEnabled', ng-show='tracker.devices.length').device-list-details
tr(ng-repeat='device in $data', ng-class='{ "device-not-usable": !device.usable }', ng-hide='!device.model')
td(data-title="'Status'|translate", sortable='"stateSorting"', filter="{ 'usable': 'select' }", filter-data="statusFilter($column)")
button(ng-class='device.enhancedButtonClass',
ng-dblclick='tryToKick(device)',
ng-click='device.usable && toggle(device)').btn.btn-xs.device-status {{device.state|statusName|translate}}
td(data-title="::'Model'|translate", sortable='"model"', filter='{"model": "text"}')
span.device-small-image
img(ng-src='/static/devices/icon/x24/{{ ::device.image || "_default.jpg" }}')
span(ng-if='device.state !== "using"') {{device.model}}
a(ng-if='device.state === "using"', ng-href='/#!/control/{{ device.serial }}') {{device.model}}
td(data-title="'Product'|translate", sortable='"name"', filter='{"name": "text"}').device-list-product
span {{::device.name}}
td(data-title="'Carrier'|translate", sortable='"operator"', filter='{"operator": "text"}').device-list-carrier
span {{::device.operator}}
td(data-title="'Released'|translate", sortable='"releasedAtFormatted"', filter='{"releasedAtFormatted": "text"}')
span {{::device.releasedAtFormatted}}
td(data-title="'OS'|translate", sortable='"version"', filter='{"version": "text"}')
span {{::device.version}}
td(data-title="'Network'|translate", sortable='"phone.network"', filter='{"phone": "text"}')
span {{device.phone.network}}
td(ng-show='showAll', data-title="'Screen'|translate", sortable='"display.width"', filter='{"display": "text"}')
span {{device.display.width}}x{{device.display.height}}
td(ng-show='showAll', data-title="'Serial'|translate", sortable='"serial"', filter='{"serial": "text"}')
span {{::device.serial}}
td(ng-show='showAll', data-title="'Manufacturer'|translate", sortable='"manufacturer"', filter='{"manufacturer": "text"}')
span {{::device.manufacturer}}
td(ng-show='showAll', data-title="'SDK'|translate", sortable='"sdk"', filter='{"sdk": "text"}')
span {{::device.sdk}}
td(ng-show='showAll', data-title="'ABI'|translate", sortable='"abi"', filter='{"abi": "text"}')
span {{::device.abi}}
td(ng-show='showAll', data-title="'Phone'|translate", sortable='"phone.phoneNumber"')
span {{device.phone.phoneNumber}}
td(ng-show='showAll', data-title="'Phone IMEI'|translate", sortable='"phone.imei"')
span {{device.phone.imei}}
td(ng-show='showAll', data-title="'Phone ICCID'|translate", sortable='"phone.iccid"')
span {{device.phone.iccid}}
td(ng-show='showAll', data-title="'Battery Health'|translate", sortable='"battery.health"')
span {{device.battery.health | batteryHealth | translate }}
td(ng-show='showAll', data-title="'Battery Source'|translate", sortable='"battery.source"')
span {{device.battery.source | batterySource | translate }}
td(ng-show='showAll', data-title="'Battery Status'|translate", sortable='"battery.status"')
span {{device.battery.status | batteryStatus | translate }}
td(ng-show='showAll', data-title="'Battery Level'|translate", sortable='"battery.level"')
progressbar(value='device.battery.level', max='device.battery.scale', type='success')
span {{ device.battery.level / device.battery.scale * 100 }}%
td(ng-show='showAll', data-title="'Battery Temperature'|translate", sortable='"battery.temp"')
span {{device.battery.temp}}°C
td(data-title="'Location'|translate", sortable='"provider.name"', filter='{"provider": "text"}')
span {{::device.provider.name}}
td(data-title="'User'|translate", sortable='"owner.name"', filter='{"owner": "text"}')
a(ng-if='device.owner', ng-href='{{userContactUrl(device.owner.email)}}', role='button', target='_href') {{device.owner.name || "No name"}}
a(ng-if='!device.owner') -
//p
strong Sorting
pre {{tableParams.sorting() | json}}
pre {{tableParams.filter() | json}}
//ul
li(ng-repeat='device in tracker.devices track by device.serial')
pre {{device|json}}