Permalink
Fetching contributors…
Cannot retrieve contributors at this time
116 lines (89 sloc) 3.83 KB
<div class="ly-compact ly-device ly-device-{{device.id}} ly-type-{{type.id}}" ng-class="{'ly-sensor': !hasFunctions}">
<!-- ---------------- -->
<!-- Device Message -->
<!-- ---------------- -->
<div class="ly-message ly-generic-message ly-animation-fast" ng-if="view.path=='/message'">
<p class="ly-description">{{message.title}}</p>
<p class="ly-description-sub">{{message.description}}</p>
</div>
<!-- ----------------- -->
<!-- Loading message -->
<!-- ----------------- -->
<div class="ly-message ly-loading" ng-if="view.path=='/loading'">
<p class="ly-description">Loading Device</p>
<div class="ly-spinner">
<div class="ly-bounce-1"></div>
<div class="ly-bounce-2"></div>
<div class="ly-bounce-3"></div>
</div>
</div>
<!-- Device Content -->
<div class="ly-content" ng-class="{'ly-animation': view.path=='/default'}" ng-if="view.path!='/loading' && view.path!='/message'">
<!-- Device status -->
<div class="ly-status">
<!-- Default function circle button -->
<div class="ly-execute" ng-click="execute(status.function)">
<button class="ly-button"></button>
<div class="ly-spinner ly-animation" ng-if="device.pending">
<div class="ly-bounce-1"></div>
<div class="ly-bounce-2"></div>
<div class="ly-bounce-3"></div>
</div>
</div>
<!-- Description -->
<div class="ly-description" ng-click="fire('open')">
<p class="ly-name">{{device.name}}</p>
<p class="ly-extras ly-updated-animation">
{{status.name || 'Undefined status'}}
</p>
<p class="ly-open-button">
<i class="fa fa-angle-right"></i>
</p>
</div>
</div>
<!-- Device functions -->
<div class="ly-functions" ng-if="hasFunctions">
<div class="ly-function-container" ng-repeat="function in functions">
<!-- Function form -->
<div class="ly-function-form ly-modal ly-animation-fast" ng-if="function.visibleForm">
<div class="ly-modal-backdrop" ng-click="function.visibleForm=false"></div>
<div class="ly-modal-window">
<a class="ly-close" href="" ng-click="function.visibleForm=false">×</a>
<div class="ly-header">
<p class="ly-name">{{function.name}}</p>
</div>
<form class="ly-form" ng-submit="execute(function)">
<div class="ly-fields">
<div class="ly-field ly-editable"
ng-repeat="property in function.properties"
ng-class="{'ly-no-underline': (property.type=='range' || property.type=='color') }"
ng-if="property.toFill">
<p class="ly-description">
<span>Set {{property.name | lowercase}}</span>
<span ng-if="property.type=='range'">to {{property.expected}}</span>
</p>
<input class="ly-value ly-{{property.type}}"
type="{{property.type}}"
min="{{property.range.min}}"
max="{{property.range.max}}"
step="{{property.range.step}}"
ng-if="property.accepted==null"
ng-model="property.expected">
</input>
<select class="ly-value"
ng-model="property.expected"
ng-options="key as value for (key , value) in property.accepted"
ng-if="property.accepted && property.type=='text'">
</select>
</div>
</div>
<div class="ly-actions">
<button class="ly-button ly-update-button" ng-click="execute(function)">Execute</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>