From 8b17dfacaec125caa4ff4f3b4708256ae49e3cc7 Mon Sep 17 00:00:00 2001
From: Eike Cochu <eike@cochu.com>
Date: Fri, 27 May 2016 01:12:54 +0200
Subject: [PATCH] added some loading messages
---
vipra-ui/app/html/articles/index.html | 6 ++++++
vipra-ui/app/html/articles/show.html | 1 +
vipra-ui/app/html/entities/index.html | 6 ++++++
vipra-ui/app/html/entities/show.html | 1 +
vipra-ui/app/html/explorer.html | 11 ++++++++++-
vipra-ui/app/html/index.html | 6 ++++--
vipra-ui/app/html/topics/index.html | 6 ++++++
vipra-ui/app/html/topics/show.html | 1 +
vipra-ui/app/html/words/index.html | 6 ++++++
vipra-ui/app/html/words/show.html | 1 +
vipra-ui/app/js/controllers.js | 27 ++++++++++++++++++++++-----
vipra-ui/app/less/app.less | 8 +++++++-
12 files changed, 71 insertions(+), 9 deletions(-)
diff --git a/vipra-ui/app/html/articles/index.html b/vipra-ui/app/html/articles/index.html
index 7757ce3e..4a4f3cf2 100644
--- a/vipra-ui/app/html/articles/index.html
+++ b/vipra-ui/app/html/articles/index.html
@@ -40,6 +40,12 @@
<article-link article="::article"/>
</td>
</tr>
+ <tr ng-show="loadingArticles">
+ <td>Loading...</td>
+ </tr>
+ <tr ng-show="!loadingArticles&&!articles.length">
+ <td>No Articles</td>
+ </tr>
</tbody>
</table>
<div class="panel-footer">
diff --git a/vipra-ui/app/html/articles/show.html b/vipra-ui/app/html/articles/show.html
index f9d3cc1e..3a676eaa 100644
--- a/vipra-ui/app/html/articles/show.html
+++ b/vipra-ui/app/html/articles/show.html
@@ -174,6 +174,7 @@
</div>
</div>
</div>
+ <div class="loading" ng-hide="article">Loading...</div>
</div>
</div>
<div ng-cloak ui-view></div>
diff --git a/vipra-ui/app/html/entities/index.html b/vipra-ui/app/html/entities/index.html
index ba032878..233a0b95 100644
--- a/vipra-ui/app/html/entities/index.html
+++ b/vipra-ui/app/html/entities/index.html
@@ -37,6 +37,12 @@
<entity-link entity="::entity" />
</td>
</tr>
+ <tr ng-show="loadingEntities">
+ <td>Loading...</td>
+ </tr>
+ <tr ng-show="!loadingEntities&&!entities.length">
+ <td>No Entities</td>
+ </tr>
</tbody>
</table>
<div class="panel-footer">
diff --git a/vipra-ui/app/html/entities/show.html b/vipra-ui/app/html/entities/show.html
index 4330f3ed..3d0a10a3 100644
--- a/vipra-ui/app/html/entities/show.html
+++ b/vipra-ui/app/html/entities/show.html
@@ -50,6 +50,7 @@
<p class="text-muted" ng-hide="entity.types.length">No types</p>
</div>
</div>
+ <div class="loading" ng-hide="entity">Loading...</div>
</div>
</div>
<div ng-cloak ui-view></div>
\ No newline at end of file
diff --git a/vipra-ui/app/html/explorer.html b/vipra-ui/app/html/explorer.html
index ef29ffe7..8058d7f5 100644
--- a/vipra-ui/app/html/explorer.html
+++ b/vipra-ui/app/html/explorer.html
@@ -35,7 +35,10 @@
<span class="colorbox" style="background:{{::topic.color}}" bs-popover popover-title="{{topic.name}}" popover-template="partials/topic-popover.html" popover-delay="500"></span>
</div>
</li>
- <li ng-hide="topics.length > 0">
+ <li ng-show="!topics">
+ <p class="text-muted text-center">Loading...</p>
+ </li>
+ <li ng-show="topics&&!topics.length">
<p class="text-muted text-center">No topics</p>
</li>
</ul>
@@ -125,6 +128,12 @@
<article-link article="::article" />
</td>
</tr>
+ <tr ng-show="loadingArticles">
+ <td>Loading...</td>
+ </tr>
+ <tr ng-show="!loadingArticles&&!articles.length">
+ <td>No Articles</td>
+ </tr>
</tbody>
</table>
<div class="panel-footer">
diff --git a/vipra-ui/app/html/index.html b/vipra-ui/app/html/index.html
index 2cca09e3..9d6feb29 100644
--- a/vipra-ui/app/html/index.html
+++ b/vipra-ui/app/html/index.html
@@ -45,14 +45,16 @@
<ul class="list-unstyled">
<article-link article="::article" badge="false" menu="false" excerpt="false" ng-repeat="article in latestArticles"/>
</ul>
- <p class="text-center" ng-if="!latestArticles.length">No articles</p>
+ <p class="text-center" ng-if="!latestArticles">Loading...</p>
+ <p class="text-center" ng-if="latestArticles&&!latestArticles.length">No Articles</p>
</div>
<div class="col-md-4 text-center">
<h4>Latest topics</h4>
<ul class="list-unstyled">
<topic-link topic="::topic" badge="false" menu="false" ng-repeat="topic in latestTopics"/>
</ul>
- <p class="text-center" ng-if="!latestTopics.length">No topics</p>
+ <p class="text-center" ng-if="!latestTopics">Loading...</p>
+ <p class="text-center" ng-if="latestTopics&&!latestTopics.length">No Topics</p>
</div>
</div>
</div>
diff --git a/vipra-ui/app/html/topics/index.html b/vipra-ui/app/html/topics/index.html
index d9e3b962..08de6287 100644
--- a/vipra-ui/app/html/topics/index.html
+++ b/vipra-ui/app/html/topics/index.html
@@ -39,6 +39,12 @@
<topic-link topic="::topic" />
</td>
</tr>
+ <tr ng-show="loadingTopics">
+ <td>Loading...</td>
+ </tr>
+ <tr ng-show="!loadingTopics&&!topics.length">
+ <td>No Topics</td>
+ </tr>
</tbody>
</table>
<div class="panel-footer">
diff --git a/vipra-ui/app/html/topics/show.html b/vipra-ui/app/html/topics/show.html
index 9a0b3e68..3f3866d4 100644
--- a/vipra-ui/app/html/topics/show.html
+++ b/vipra-ui/app/html/topics/show.html
@@ -155,6 +155,7 @@
</div>
</div>
</div>
+ <div class="loading" ng-hide="topic">Loading...</div>
</div>
</div>
diff --git a/vipra-ui/app/html/words/index.html b/vipra-ui/app/html/words/index.html
index 34a4cac3..276f1786 100644
--- a/vipra-ui/app/html/words/index.html
+++ b/vipra-ui/app/html/words/index.html
@@ -37,6 +37,12 @@
<word-link word="::word" />
</td>
</tr>
+ <tr ng-show="loadingWords">
+ <td>Loading...</td>
+ </tr>
+ <tr ng-show="!loadingWords&&!words.length">
+ <td>No Words</td>
+ </tr>
</tbody>
</table>
<div class="panel-footer">
diff --git a/vipra-ui/app/html/words/show.html b/vipra-ui/app/html/words/show.html
index 32c26744..e3746db2 100644
--- a/vipra-ui/app/html/words/show.html
+++ b/vipra-ui/app/html/words/show.html
@@ -32,6 +32,7 @@
</table>
</div>
</div>
+ <div class="loading" ng-hide="word">Loading...</div>
</div>
</div>
<div ng-cloak ui-view></div>
\ No newline at end of file
diff --git a/vipra-ui/app/js/controllers.js b/vipra-ui/app/js/controllers.js
index 43dc465c..e2910e8b 100644
--- a/vipra-ui/app/js/controllers.js
+++ b/vipra-ui/app/js/controllers.js
@@ -849,12 +849,16 @@
$scope.sequenceChanged = function() {
if(!$scope.explorerModels.activeTopic || !$scope.explorerModels.activeSequence) return;
+ $scope.loadingArticles = true;
TopicFactory.articles({
id: $scope.explorerModels.activeTopic.id,
from: new Date($scope.explorerModels.activeSequence.window.startDate).getTime(),
to: new Date($scope.explorerModels.activeSequence.window.endDate).getTime()
}, function(data) {
$scope.articles = data;
+ $scope.loadingArticles = false;
+ }, function() {
+ $scope.loadingArticles = false;
});
};
@@ -915,6 +919,7 @@
$scope.reloadArticles = function() {
if (!$scope.rootModels.topicModel) return;
+ $scope.loadingArticles = true;
ArticleFactory.query({
skip: ($scope.articlesIndexModels.page - 1) * $scope.articlesIndexModels.limit,
limit: $scope.articlesIndexModels.limit,
@@ -926,6 +931,9 @@
$scope.articles = data;
$scope.articlesTotal = headers("V-Total");
$scope.maxPage = Math.ceil($scope.articlesTotal / $scope.articlesIndexModels.limit);
+ $scope.loadingArticles = false;
+ }, function() {
+ $scope.loadingArticles = false;
});
};
@@ -1097,6 +1105,7 @@
$scope.reloadTopics = function() {
if (!$scope.rootModels.topicModel) return;
+ $scope.loadingTopics = true;
TopicFactory.query({
topicModel: $scope.rootModels.topicModel.id,
skip: ($scope.topicsIndexModels.page - 1) * $scope.topicsIndexModels.limit,
@@ -1108,6 +1117,9 @@
$scope.topics = data;
$scope.topicsTotal = headers("V-Total");
$scope.maxPage = Math.ceil($scope.topicsTotal / $scope.topicsIndexModels.limit);
+ $scope.loadingTopics = false;
+ }, function() {
+ $scope.loadingTopics = false;
});
};
@@ -1158,11 +1170,8 @@
// preselect first sequence
if ($scope.topic.sequences && $scope.topic.sequences.length)
$scope.topicsShowModels.sequence = $scope.topic.sequences[0];
-
- $timeout(function() {
- $scope.redrawRelevanceGraph();
- //$scope.redrawWordEvolutionChart(); TODO remove
- }, 0);
+
+ $scope.redrawRelevanceGraph();
});
$scope.redrawRelevanceGraph = function() {
@@ -1343,6 +1352,7 @@
$scope.reloadEntities = function() {
if (!$scope.rootModels.topicModel) return;
+ $scope.loadingEntities = true;
EntityFactory.query({
topicModel: $scope.rootModels.topicModel.id,
skip: ($scope.entitiesIndexModels.page - 1) * $scope.entitiesIndexModels.limit,
@@ -1354,6 +1364,9 @@
$scope.entities = data;
$scope.entitiesTotal = headers("V-Total");
$scope.maxPage = Math.ceil($scope.entitiesTotal / $scope.entitiesIndexModels.limit);
+ $scope.loadingEntities = false;
+ }, function() {
+ $scope.loadingEntities = false;
});
};
@@ -1443,6 +1456,7 @@
$scope.reloadWords = function() {
if (!$scope.rootModels.topicModel) return;
+ $scope.loadingWords = true;
WordFactory.query({
topicModel: $scope.rootModels.topicModel.id,
skip: ($scope.wordsIndexModels.page - 1) * $scope.wordsIndexModels.limit,
@@ -1454,6 +1468,9 @@
$scope.words = data;
$scope.wordsTotal = headers("V-Total");
$scope.maxPage = Math.ceil($scope.wordsTotal / $scope.wordsIndexModels.limit);
+ $scope.loadingWords = false;
+ }, function() {
+ $scope.loadingWords = false;
});
};
diff --git a/vipra-ui/app/less/app.less b/vipra-ui/app/less/app.less
index b7ea8434..9c4b77a2 100644
--- a/vipra-ui/app/less/app.less
+++ b/vipra-ui/app/less/app.less
@@ -374,7 +374,7 @@ a:hover {
margin: 0;
}
.menu-button {
- left: 5px;
+ left: 2px;
}
}
@@ -397,6 +397,7 @@ a:hover {
label {
margin: 0;
font-weight: normal;
+ padding: 0;
&:before,
&:after {
margin-top: 2px;
@@ -898,6 +899,11 @@ entity-menu {
width: 40px;
}
+.loading {
+ text-align: center;
+ padding: 10px;
+}
+
@keyframes spin {
100% {
-webkit-transform: rotateY(360deg);
--
GitLab