fade in elements on post activities

This commit is contained in:
2015-08-17 21:26:19 +02:00
parent ae22c7e28e
commit e468fae550
3 changed files with 57 additions and 33 deletions

View File

@@ -26,7 +26,9 @@
</head>
<body>
<header><!-- <i class="fa fa-icon fa-date"></i> --><time id="date"></time></header>
<main><i id="buffer" class="fa fa-spinner fa-spin"></i></main>
<main>
<div id="buffer"><i class="fa fa-spinner fa-spin"></i></div>
</main>
<div id="feedback">
<h1><i class="fa fa-icon fa-feedback"></i>Filtered films</h1>
<div id="feed_content"></div>

View File

@@ -16,10 +16,10 @@ function Film()
{
this._ban.status = true;
this._ban.reason = sReason;
this.error('Hidding "'+this.name()+'". Ban reason: '+this.ban().reason);
this.feedback('Hidding movie "'+this.name()+'". Ban reason: '+this.ban().reason);
this.anchor().addClass('banned');
}
else this.error('setting ban status with no reason');
else this.error('Setting ban status with no reason');
}
this.id = function(iFilmId)
@@ -89,6 +89,7 @@ function Film()
//Add film to DOM
this._anchor = $('<div>', {'class':'film', 'id':'film_'+this.getRank()})
.data('rank', this.getRank())
.data('id', this.id())
//.append($('<img>', {'class':'bg', 'src':this.poster()}))
.append($('<img>', {'class':'poster', 'src':this.poster()}))
.append($('<div>', {'class':'info'})
@@ -126,8 +127,8 @@ function Film()
var sCinema = asCinemas[iCinemaId];
$.each(asLang, function(iKey, sLang)
{
if(sLang=='VF' && ('VOSTF' in self.timetable(iCinemaId))) self.error('Hiding VF version of "'+self.name()+'" @'+sCinema+' (VOSTF available)');
else if(sLang=='VFSTF') self.error('Hiding hearing-impaired version ('+sLang+') of "'+self.name()+'" @'+sCinema)
if(sLang=='VF' && ('VOSTF' in self.timetable(iCinemaId))) self.feedback('Hiding VF of "'+self.name()+'" @'+sCinema+' (VOSTF available)');
else if(sLang=='VFSTF') self.feedback('Hiding hearing-impaired version ('+sLang+') of "'+self.name()+'" @'+sCinema)
else
{
var $Timetable = $('<p>')
@@ -136,7 +137,6 @@ function Film()
.append($('<span>', {'class':'cinema_name'}).text(sCinema)))
.append($('<span>', {'class':'lang'}).text(sLang))
.appendTo(self.anchor().find('.timetable'));
var test = self.timetable(iCinemaId, sLang);
if(!test) console.log('cinema '+iCinemaId+' lang '+sLang+' film '+self.id());
@@ -154,10 +154,15 @@ function Film()
return (Date.parse('01/01/1970 '+sTime1.time+':00') > Date.parse('01/01/1970 '+sTime2.time+':00'));
};
this.error = function(sMsg)
this.feedback = function(sMsg)
{
$('#feed_content').append($('<p>').text(sMsg));
};
this.error = function(sMsg)
{
console.log('Film Error: '+sMsg);
};
}
function Affiche(oDate)
@@ -173,16 +178,11 @@ function Affiche(oDate)
this.consts = { days:["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
months:["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]};
this.$Header = $('header');
this.$Main = $('main');
this.$Footer = $('footer');
this.$Feedback = $('#feedback');
this.isLoaded = function()
{
//TODO
return true;
};
this.wip = function(iProgress)
{
if(!iProgress) return this._wip;
@@ -195,19 +195,30 @@ function Affiche(oDate)
this.onPostLoad = function()
{
//Sort films
$Films = $('.film');
$Films.sort(function(oFilm1, oFilm2)
{
return ($(oFilm1).data('rank') < $(oFilm2).data('rank'))?1:-1;
//Display Header
this.$Header.css('visibility', 'visible');
//Sort films
$Films.sort(function(oFilm1, oFilm2){return ($(oFilm1).data('rank') < $(oFilm2).data('rank'))?1:-1;}).detach();
//Remove movies with no screening
$Films.not('.banned').each(function(iKey, hFilm){
var $Film = $(hFilm);
if($Film.find('.timetable').is(':empty'))
{
var oFilm = self.film($Film.data('id'));
self.feedback('Hiding movie "'+oFilm.name()+'". No screening today');
$Film.addClass('banned');
}
});
//Remove loading
this.$Main.find('#buffer').hide();
$Films
.detach()
.appendTo(this.$Main)
.not('.banned')
.show();
//Add films (except bans)
$Films.appendTo(this.$Main).not('.banned').slideDown('slow');
this.$Footer.add(this.$Feedback).show();
};
@@ -272,12 +283,7 @@ function Affiche(oDate)
getUgcPage( 'filmsAfficheAction!loadDatesList.action',
{filmId:oFilm.id(), cinemaId:iCinemaId, cinemaCode:'', day:''},
function(jData){
if(!(self.date.timestamp in jData.dates))
{
self.error('No times today for "'+oFilm.name()+'" @'+asCinemas[iCinemaId]+' (first date available: '+jData.dates[Object.keys(jData.dates)[0]]+')');
//if(self.isLoaded()) oFilm.removeSpinner();
self.wip(-1);
}
if(!(self.date.timestamp in jData.dates)) self.wip(-1);
else
{
getUgcPage( 'filmsAfficheAction!reloadSeancesList.action',
@@ -305,19 +311,18 @@ function Affiche(oDate)
});
asLangs.push(sLang);
oFilm.renderTimetable(iCinemaId, asLangs);
//if(self.isLoaded()) oFilm.removeSpinner();
self.wip(-1);
},
function(){
self.wip(-1);
self.error('Error detected on film "'+oFilm.name()+'" @'+asCinemas[iCinemaId]+'. UGC website Temporarily Unavailable');
self.error('Ajax Error detected on movie "'+oFilm.name()+'" @'+asCinemas[iCinemaId]+'. UGC website Temporarily Unavailable');
},
'html');
}
},
function(){
self.wip(-1);
self.error('Error detected on film "'+oFilm.name()+'" @'+asCinemas[iCinemaId]+'. UGC website Temporarily Unavailable');
self.error('Ajax Error detected on movie "'+oFilm.name()+'" @'+asCinemas[iCinemaId]+'. UGC website Temporarily Unavailable');
},
'json');
}
@@ -341,10 +346,15 @@ function Affiche(oDate)
else this._films[iFilmId] = oFilm;
};
this.error = function(sMsg)
this.feedback = function(sMsg)
{
$('#feed_content').append($('<p>').text(sMsg));
};
this.error = function(sMsg)
{
console.log('Affiche Error: '+sMsg);
};
}
function getUgcPage(sPath, asData, fOnSuccess, fOnFail, sType)

View File

@@ -67,6 +67,7 @@ header {
margin:0 0 0 0.5em;
font-size: 2em;
color:#08288B;
visibility:hidden;
}
/* Section - Main */
@@ -76,7 +77,18 @@ main {
}
#buffer {
position: fixed;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
width: 1em;
height: 1em;
margin: auto;
padding: 0px;
font-size:2em;
color:#08288B;
padding-bottom: 0.5em;
}
/* Section - Film */