1
0
mirror of https://github.com/nerzhul/ocsms.git synced 2025-06-07 16:06:15 +00:00

Add ng-cloak support. (#256)

* Add ng-cloak support.

So that the template items aren't displayed until they are required.

* Additional ng-cloak class.
This commit is contained in:
Greg Ross 2018-07-10 02:32:44 -04:00 committed by Loïc Blot
parent ca1c15adac
commit 76d4a9ad1c
2 changed files with 7 additions and 4 deletions

View File

@ -261,3 +261,6 @@ label {
margin: 88px auto; margin: 88px auto;
} }
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
display: none !important;
}

View File

@ -11,7 +11,7 @@ use \OCA\OcSms\Lib\CountryCodes;
<div id="app-mailbox-peers"> <div id="app-mailbox-peers">
<div id="app-contacts-loader" class="icon-loading" ng-show="isContactsLoading"> <div id="app-contacts-loader" class="icon-loading" ng-show="isContactsLoading">
</div> </div>
<ul class="contact-list" ng-show="!isContactsLoading"> <ul class="ng-cloak contact-list" ng-show="!isContactsLoading">
<li ng-repeat="contact in contacts | orderBy:vsettings.contactOrderBy:vsettings.reverseContactOrder" peer-label="{{ contact.label }}" ng-click="loadConversation(contact);" href="#"> <li ng-repeat="contact in contacts | orderBy:vsettings.contactOrderBy:vsettings.reverseContactOrder" peer-label="{{ contact.label }}" ng-click="loadConversation(contact);" href="#">
<img class="ocsms-plavatar" ng-src="{{ contact.avatar }}" ng-show="contact.avatar !== undefined" /> <img class="ocsms-plavatar" ng-src="{{ contact.avatar }}" ng-show="contact.avatar !== undefined" />
<div class="ocsms-plavatar" ng-show="contact.avatar === undefined" ng-style="{'background-color': (contact.uid | peerColor)}">{{ contact.label | firstCharacter }}</div> <div class="ocsms-plavatar" ng-show="contact.avatar === undefined" ng-style="{'background-color': (contact.uid | peerColor)}">{{ contact.label | firstCharacter }}</div>
@ -61,9 +61,9 @@ use \OCA\OcSms\Lib\CountryCodes;
</div> </div>
<div id="ocsms-app-content"> <div id="ocsms-app-content">
<div id="app-content-loader" class="icon-loading" ng-show="isConvLoading"> <div id="app-content-loader" class="ng-cloak icon-loading" ng-show="isConvLoading">
</div> </div>
<div id="app-content-header" ng-show="!isConvLoading && selectedContact.label !== undefined && selectedContact.label !== ''" <div id="app-content-header" class="ng-cloak" ng-show="!isConvLoading && selectedContact.label !== undefined && selectedContact.label !== ''"
ng-style="{'background-color': (selectedContact.uid | peerColor)}"> ng-style="{'background-color': (selectedContact.uid | peerColor)}">
<div id="ocsms-contact-avatar"> <div id="ocsms-contact-avatar">
<img class="ocsms-plavatar-big" ng-show="selectedContact.avatar !== undefined" ng-src="{{ selectedContact.avatar }}" /> <img class="ocsms-plavatar-big" ng-show="selectedContact.avatar !== undefined" ng-src="{{ selectedContact.avatar }}" />
@ -81,7 +81,7 @@ use \OCA\OcSms\Lib\CountryCodes;
</div> </div>
<div id="app-content-wrapper" ng-show="!isConvLoading"> <div id="app-content-wrapper" ng-show="!isConvLoading">
<div ng-show="messages.length == 0" id="ocsms-empty-conversation"><?php p($l->t('Please select a conversation from the list to load it.'));?></div> <div ng-show="messages.length == 0" id="ocsms-empty-conversation"><?php p($l->t('Please select a conversation from the list to load it.'));?></div>
<div ng-show="messages.length > 0" class="ocsms-messages-container"> <div ng-show="messages.length > 0" class="ng-cloak ocsms-messages-container">
<div ng-repeat="message in messages | orderBy:'date'"> <div ng-repeat="message in messages | orderBy:'date'">
<div class="msg-{{ message.type }}"> <div class="msg-{{ message.type }}">
<div>{{ message.content }}</div> <div>{{ message.content }}</div>