alihan/openmct
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Frontend] Messages major work

Browse Source 
open #159
open #170
CSS, markup and JS test files initially complete;
Templates renamed for consistency;
message-type icons styled;
Added severity constant "alert";
TO-DO: check refactored CSS against mobile,
see what's broken;
This commit is contained in:
Charles Hacskaylo
2015-10-08 13:09:41 -07:00
parent 0ca9e5c952
commit 0e840ae003
15 changed files with 846 additions and 477 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
platform/commonUI/dialog/res/templates/message-list.html
View File

@@ -1,24 +0,0 @@
<mct-container key="overlay" class="t-message severity-{{ngModel.dialog.severity}}">
<div class="abs ui-symbol type-icon message-type">&#xe610;</div>
<div class="abs message-contents">
<div class="abs top-bar">
<div class="title">{{ngModel.dialog.title}}</div>
<div class="hint" ng-hide="ngModel.dialog.hint === undefined">{{ngModel.dialog.hint}}</div>
</div>
<div class="abs editor">
<ul>
<li ng-repeat="msg in ngModel.dialog.messages">
Message: {{msg.title}}
<mct-include key="'message'" ng-model="msg.ngModel"></mct-include>
</li>
</ul>
</div>
<div class="abs bottom-bar">
<a ng-repeat="dialogAction in ngModel.dialog.actions"
class="s-btn major"
ng-click="dialogAction.action()">
{{dialogAction.label}}
</a>
</div>
</div>
</mct-container>

40
platform/commonUI/dialog/res/templates/message.html
View File

@@ -1,22 +1,24 @@
<div class="abs ui-symbol type-icon message-type">!</div>
<div class="abs message-contents">
<div class="abs top-bar">
<div class="title">Title: {{ngModel.dialog.title}}</div>
<div class="hint" ng-hide="ngModel.dialog.hint === undefined">{{ngModel.dialog.hint}}</div>
</div>
<div class="abs editor">
<div class="message-action">
{{ngModel.dialog.actionText}}
<div class="l-message message-severity-{{ngModel.dialog.severity}}">
<div class="ui-symbol type-icon message-type"></div>
<div class="message-contents">
<div class="top-bar">
<div class="title">{{ngModel.dialog.title}}</div>
<div class="hint" ng-hide="ngModel.dialog.hint === undefined">{{ngModel.dialog.hint}}</div>
</div>
<div class="message-body">
<div class="message-action">
{{ngModel.dialog.actionText}} message-severity-{{ngModel.dialog.severity}}
</div>
<mct-include key="'progress-bar'"
ng-model="ngModel"
ng-hide="ngModel.dialog.progress === undefined"></mct-include>
</div>
<div class="bottom-bar">
<a ng-repeat="dialogAction in ngModel.dialog.actions"
class="s-btn major"
ng-click="dialogAction.action()">
{{dialogAction.label}}
</a>
</div>
<mct-include key="'progress-bar'"
ng-model="ngModel"
ng-hide="ngModel.dialog.progress === undefined"></mct-include>
</div>
<div class="abs bottom-bar">
<a ng-repeat="dialogAction in ngModel.dialog.actions"
class="s-btn major"
ng-click="dialogAction.action()">
{{dialogAction.label}}
</a>
</div>
</div>

2
platform/commonUI/dialog/res/templates/overlay-blocking-message.html
View File

@@ -19,7 +19,7 @@
this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information.
-->
<mct-container key="overlay" class="t-message severity-{{ngModel.dialog.severity}}">
<mct-container key="overlay" class="t-message-single">
<mct-include key="'message'" ng-model="ngModel">
</mct-include>
</mct-container>

25
platform/commonUI/dialog/res/templates/overlay-message-list.html Normal file
View File

@@ -0,0 +1,25 @@
<mct-container key="overlay" class="t-message-list">
<div class="message-contents">
<div class="abs top-bar">
<div class="title">{{ngModel.dialog.title}}</div>
<div class="hint">Displaying {{ngModel.dialog.messages.length}} message<span ng-show="ngModel.dialog.messages.length > 1">s</span>
</div>
</div>
<div class="abs message-body">
<mct-include ng-repeat="msg in ngModel.dialog.messages" key="'message'" ng-model="msg.ngModel"></mct-include>
<!-- <ul>
<li ng-repeat="msg in ngModel.dialog.messages">
&lt;!&ndash;Message: {{msg.title}}&ndash;&gt;
</li>
</ul>-->
</div>
<div class="abs bottom-bar">
<a ng-repeat="dialogAction in ngModel.dialog.actions"
class="s-btn major"
ng-click="dialogAction.action()">
{{dialogAction.label}}
</a>
</div>
</div>
</mct-container>