Added a directive to retain the scroll position when the page is refreshed. Currently I have not tested this.

This commit is contained in:
Alex van den Hoogen 2014-10-22 15:29:39 +02:00
parent 7ed43ebc0b
commit 4bcc0a1e50
3 changed files with 33 additions and 2 deletions

View File

@ -58,5 +58,6 @@
<script src="js/directives/clickToEdit.js"></script>
<script src="js/directives/onLoadCallback.js"></script>
<script src="js/directives/fileUpload.js"></script>
<script src="js/directives/keepScrollPos.js"></script>
</body>
</html>

View File

@ -0,0 +1,30 @@
// Source: http://stackoverflow.com/a/25073496/1110183
taskBoardDirectives.directive("keepScrollPos", function($route, $window, $timeout, $location, $anchorScroll) {
// cache scroll position of each route's templateUrl
var scrollPosCache = {};
// compile function
return function(scope, element, attrs) {
scope.$on('$routeChangeStart', function() {
// store scroll position for the current view
if ($route.current) {
scrollPosCache[$route.current.loadedTemplateUrl] = [ $window.pageXOffset, $window.pageYOffset ];
}
});
scope.$on('$routeChangeSuccess', function() {
// if hash is specified explicitly, it trumps previously stored scroll position
if ($location.hash()) {
$anchorScroll();
// else get previous scroll position; if none, scroll to the top of the page
} else {
var prevScrollPos = scrollPosCache[$route.current.loadedTemplateUrl] || [ 0, 0 ];
$timeout(function() {
$window.scrollTo(prevScrollPos[0], prevScrollPos[1]);
}, 0);
}
});
}
});

View File

@ -37,7 +37,7 @@
</div>
<div class="boardColumn" data-ng-repeat="lane in currentBoard.ownLane | orderBy:'position':false"
data-ng-class="{'collapsed': lane.collapsed}" data-lane-id="{{ lane.id }}"
data-context-menu="onContextMenu(lane.id)" data-target="laneMenu">
data-context-menu="onContextMenu(lane.id)" data-target="laneMenu" data-keep-scroll-pos>
<h3>{{ lane.name }}
<span class="badge" title="Column Items" data-ng-if="lane.collapsed">
{{ lane.ownItem.length || 0 }}
@ -59,7 +59,7 @@
<h4>{{ item.title }}</h4>
<span class="badge" title="Points">{{ item.points }}</span>
</div>
<div class="description" data-ng-bind-html="marked(item.description)"></div>
<div class="description" data-ng-bind-html="marked(item.description)" data-keep-scroll-pos></div>
<p class="assignee">
<span data-ng-if="userNames[item.assignee]">Assigned To: </span>
{{ userNames[item.assignee] }}