expo cartel is moving

This commit is contained in:
2020-01-07 17:41:10 +01:00
parent 4cb1ded556
commit 7c5bc8e053
6 changed files with 99 additions and 6 deletions
@@ -85,7 +85,9 @@ if(this.$playpause){if(this.playlist.length>0){this.$playpause.addClass('is-acti
if(this.$next){if(this.playing&&this.playlist.length>1&&this.current_index<this.playlist.length-1){this.$next.addClass('is-active');}else{this.$next.removeClass('is-active');}}
if(this.$previous){if(this.playing&&this.playlist.length>1&&this.current_index>0){this.$previous.addClass('is-active');}else{this.$previous.removeClass('is-active');}}
return this;},deactivate(){this.stop();this.active=false;},onAudioOpenDocument(args){void 0;if(args.caller!==this){this.reset();}},onAudioPlayerPlay(){if(this.playing&&this.paused){this.paused=false;this.showHideControls();}},onAudioPlayerPause(){if(this.playing&&!this.paused){this.paused=true;this.showHideControls();}},onAudioPlayerEnded(){void 0;if(this.playing){this.paused=false;this.next();}},};function initExpo(){void 0;if(window.location.hash=='#black'){$('body').addClass('expo-black');}
_randomPlayer.start();}
_$body.on('map-node-opened',checkExpoPlayerPositionning);_randomPlayer.start();}
function checkExpoPlayerPositionning(e){void 0;switch(true){case e.node.x>window.innerWidth-800&&e.node.y<200:_audioPlayer.$container.attr('pos','bottom-left');break;case e.node.x>window.innerWidth-800:_audioPlayer.$container.attr('pos','top-left');break;case e.node.y<200:_audioPlayer.$container.attr('pos','bottom-right');break;default:_audioPlayer.$container.attr('pos','top-right');}
_audioPlayer.$container.css({'display':"block",'left':e.node.x+"px",'top':e.node.y+"px",});}
function initGrid(){void 0;if(!_is_mobile){checkGridBlockHeight();_$row.find('.col').addClass('offfield');}
if(false){var $grid=$('.grid',_$row).masonry({itemSelector:'.col',columnWidth:'.col-2',containerStyle:null,resizeContainer:false,transitionDuration:0,});$grid.imagesLoaded().progress(function(){$grid.masonry('layout');});$grid.imagesLoaded(function(){$grid.masonry('layout');});$grid.on('layoutComplete',checkGridBlockVisible);}else{if(!_is_mobile){checkGridBlockVisible();}}};function checkGridBlockHeight(){var $r_h=_$row.height();var $this;$('.grid .col',_$row).each(function(i,e){$this=$(this);if(!$this.is('[init-height]')){$this.attr('init-height',$this.outerHeight())}
$this.height(Math.min($this.attr('init-height'),_$row.height()));});};function checkGridBlockVisible(){var $r_h=_$row.height();var $this,pos;$('.grid .col',_$row).each(function(i,e){$this=$(this);pos=$this.position();if(pos.top+$this.height()<=$r_h){$this.removeClass('offfield');}else{$this.addClass('offfield');}});}
File diff suppressed because one or more lines are too long
@@ -1966,8 +1966,32 @@
if(window.location.hash == '#black'){
$('body').addClass('expo-black');
}
_$body.on('map-node-opened', checkExpoPlayerPositionning);
_randomPlayer.start();
}
function checkExpoPlayerPositionning(e){
console.log('checkExpoPlayerPositionning', e.node);
switch(true){
case e.node.x > window.innerWidth-800 && e.node.y < 200:
_audioPlayer.$container.attr('pos', 'bottom-left');
break;
case e.node.x > window.innerWidth-800:
_audioPlayer.$container.attr('pos', 'top-left');
break;
case e.node.y < 200:
_audioPlayer.$container.attr('pos', 'bottom-right');
break;
default:
_audioPlayer.$container.attr('pos', 'top-right');
}
_audioPlayer.$container.css({
'display':"block",
'left':e.node.x+"px",
'top':e.node.y+"px",
});
}
// ___ _ _
// / __|_ _(_)__| |
@@ -1001,7 +1001,9 @@ main[role="main"]{
opacity:1;
transition: opacity 0.2s ease-in-out;
.entrees{
@include entree-micro-square;
// body:not(.domain-expo-encyclopediedelaparole-org) &{
@include entree-micro-square;
// }
}
h2.node-title{
margin:0.2em 0 0;
@@ -1110,7 +1112,7 @@ main[role="main"]{
transform: translate(-50%, -50%);
background-color: rgba(255,255,255, 0.8);
outline: 1px solid red;
padding:2em 1em 2em 2em; margin:0;
padding:0.5em 0.5em 0 0.5em; margin:0;
.btns,
.actions,
.favoris{
@@ -1120,15 +1122,76 @@ main[role="main"]{
margin:0.80em 0 0;
}
.time{
margin:0.75em 0 0;
margin:1.055em 0 0;
>*{
width:50px;
}
.current-time{
font-size: 1em;
}
.duration{
margin-top:0.28em;
}
}
.cartel{
margin-top: 0;
width:calc(100% - 190px);
.entrees{
span.entree{
}
}
}
* {
background-color: transparent;
}
$w:60px; // diagonal length
$s:($w *1.4)*0.5; // side given the diagonal (1.4 is the square root of 2)
&:before{
content:"";
position: absolute;
width: $w; height:0;
border-top: 1px solid red;
}
// pos attributes refers to where the popup appears
&[pos="bottom-right"]{
transform: translateY($s) translateX($s);
&:before{
top:-1px;
left: -$w - 1px;
transform-origin: bottom right;
transform: rotateZ(45deg);
}
}
&[pos="bottom-left"]{
transform: translateX(-100%) translateY($s) translateX(-$s);
&:before{
// top:calc(100% + 1px);*
top:0;
left: 100%;
transform-origin: top left;
transform: rotateZ(-45deg);
}
}
&[pos="top-left"]{
transform: translateY(-100%) translateX(-100%) translateY(-$s) translateX(-$s);
&:before{
bottom:0;
left: 100%;
transform-origin: top left;
transform: rotateZ(45deg);
}
}
&[pos="top-right"]{
transform: translateY(-100%) translateY(-$s) translateX($s);
&:before{
top:calc(100% + 1px);
left: - ($w +1px);
transform-origin: top right;
transform: rotateZ(-45deg);
}
}
}
body.expo-black &{
background-color: $expo-black-bg;