UA-Fediland/pixelfed
2
0
Fork 0
mirror of https://github.com/pixelfed/pixelfed.git synced 2024-11-10 00:34:50 +00:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #208 from hellcp/patch-14

Browse source 
Show messages about loading pages
This commit is contained in:
daniel 2018-06-05 01:17:07 -06:00 committed by GitHub
commit ba9cd33301
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 57 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
resources/assets/js/timeline.js vendored
View file

@ -1,12 +1,14 @@
$(document).ready(function() { $(document).ready(function() {
$('.pagination').hide(); $('.pagination').hide();
$('.page-load-status').show();
let elem = document.querySelector('.timeline-feed'); let elem = document.querySelector('.timeline-feed');
let infScroll = new InfiniteScroll( elem, { let infScroll = new InfiniteScroll( elem, {
path: '.pagination__next', path: '.pagination__next',
append: '.timeline-feed', append: '.timeline-feed',
status: '.page-load-status',
history: false, history: false,
}); });
infScroll.on( 'append', function( response, path, items ) { infScroll.on( 'append', function( response, path, items ) {
pixelfed.hydrateLikes(); pixelfed.hydrateLikes();
}); });
}); });

12
resources/assets/sass/custom.scss vendored
View file

@ -202,3 +202,15 @@ body, button, input, textarea {
z-index:1020 z-index:1020
} }
} }
@keyframes loading-bar {
from { background-position: 0 0; }
to { background-position: 100vw 0; }
}
.loading-page {
background-image: linear-gradient(to right, #6736dd, #10c5f8, #10c5f8, #6736dd);
width: 100vw;
height: .25rem;
animation: loading-bar 3s linear infinite;
}

21
resources/views/timeline/personal.blade.php
View file

@ -36,6 +36,27 @@
</div> </div>
@endif @endif
</div> </div>
<div class="page-load-status">
<div class="infinite-scroll-request">
<div class="fixed-top loading-page"></div>
</div>
<div class="infinite-scroll-last">
<h3>No more content</h3>
<p class="text-muted">
Maybe you could try
<a href="{{route('discover')}}">discovering</a>
more people you can follow.
</p>
</div>
<div class="infinite-scroll-error">
<h3>Whoops, an error</h3>
<p class="text-muted">
Try reloading the page
</p>
</div>
</div>
<div class="d-flex justify-content-center"> <div class="d-flex justify-content-center">
{{$timeline->links()}} {{$timeline->links()}}
</div> </div>

21
resources/views/timeline/public.blade.php
View file

@ -27,6 +27,27 @@
@endforeach @endforeach
</div> </div>
<div class="page-load-status">
<div class="infinite-scroll-request">
<div class="fixed-top loading-page"></div>
</div>
<div class="infinite-scroll-last">
<h3>No more content</h3>
<p class="text-muted">
Maybe you could try
<a href="{{route('discover')}}">discovering</a>
more people you can follow.
</p>
</div>
<div class="infinite-scroll-error">
<h3>Whoops, an error</h3>
<p class="text-muted">
Try reloading the page
</p>
</div>
</div>
<div class="d-flex justify-content-center"> <div class="d-flex justify-content-center">
{{$timeline->links()}} {{$timeline->links()}}
</div> </div>