ajax loading of edlp studio from custom block link ok

also refactored page layout for better display of footer
This commit is contained in:
Bachir Soussi Chiadmi
2018-03-12 16:55:13 +01:00
parent 294d660d5f
commit 119f89abca
25 changed files with 569 additions and 96 deletions
@@ -28,7 +28,7 @@ edlp_vars = {
var _$body = $('body');
var _is_front = _$body.is('.path-frontpage');
var _$corpus_canvas;
var _$content_container = $('.layout-container>main>.layout-content');
var _$content_container = $('main[role="main"]>.layout-content');
var _$ajaxLinks;
function init(){
@@ -117,6 +117,7 @@ edlp_vars = {
// TODO: previous and next btns
},
openDocument(node){
console.log('AudioPlayer openDocument', node);
this.setSRC(node.audio_url);
this.loadNode(node.nid);
},
@@ -129,13 +130,13 @@ edlp_vars = {
},
onNodeLoaded(data){
console.log('AudioPlayer node loaded', data);
this.$cartel.html(data.rendered);
this.$cartel.removeClass('loading');
this.$cartel.html(data.rendered).removeClass('loading');
_$body.trigger({'type':'new-audio-cartel-loaded'});
initAjaxLinks();
},
onNodeLoadFail(jqxhr, textStatus, error){
console.warn('AudioPlayer node load failed', jqxhr.responseText);
this.$cartel.removeClass('loading').html('');
},
// audio functions
setSRC(url){
@@ -1095,16 +1095,16 @@ body, html {
margin: 0;
padding: 0; }
div.layout-container {
header[role="banner"] {
z-index: 1;
position: relative;
width: 100%;
height: 100%;
padding: 0.5em 1em;
-webkit-box-sizing: border-box;
box-sizing: border-box;
z-index: 1; }
padding: 0.5em 1em; }
header[role="banner"] > .wrapper {
border-bottom: 1px solid red;
height: 70px; }
main[role="main"] {
z-index: 1;
pointer-events: none;
position: absolute;
left: 0;
@@ -1119,26 +1119,26 @@ main[role="main"] {
width: 100%;
height: 100%;
overflow: hidden; }
main[role="main"] .layout-content > * {
pointer-events: auto; }
main[role="main"] .layout-content > .messages {
max-height: 500px;
overflow: auto; }
main[role="main"] .layout-content > * {
pointer-events: auto; }
footer[role="contentinfo"] {
z-index: 1;
position: fixed;
bottom: 0;
width: 100%; }
-webkit-box-sizing: content-box;
box-sizing: content-box;
width: 100%;
padding: 0.5em 1em; }
.os-scroll {
height: 100%; }
.layout-container {
pointer-events: none; }
header[role="banner"] {
position: relative;
padding: 0 0 0.5em 0;
border-bottom: 1px solid red;
pointer-events: all;
height: 70px; }
pointer-events: all; }
#block-edlptheme-branding {
display: inline-block; }
@@ -1496,6 +1496,81 @@ body.ajax-loading main[role="main"]:before {
.chutier-icon:hover .popup {
display: block; }
.row .col .studio-ui-wrapper {
height: 100%; }
#studio-ui {
height: 100%; }
#studio-ui .chutier_ui {
height: 50%;
border-bottom: 1px solid red; }
#studio-ui .chutier_ui > h2 {
margin: 0.5em 0;
font-size: 1em;
font-weight: 500;
text-transform: uppercase; }
#studio-ui .chutier_ui .documents ul, #studio-ui .chutier_ui .documents li {
margin: 0;
padding: 0;
line-height: 1.2; }
#studio-ui .chutier_ui .documents li {
display: inline-block;
vertical-align: top;
width: 49%;
margin-bottom: 0.5em; }
#studio-ui .chutier_ui .documents li .entrees {
line-height: 0;
display: inline-block; }
#studio-ui .chutier_ui .documents li .entrees span {
display: inline-block;
width: 8px;
height: 8px;
background-color: black;
margin-right: 3px; }
#studio-ui .chutier_ui .documents li .entrees span[tid='134'] {
background-color: #2b8f2f; }
#studio-ui .chutier_ui .documents li .entrees span[tid='121'] {
background-color: #3a33b6; }
#studio-ui .chutier_ui .documents li .entrees span[tid='125'] {
background-color: #2c9f57; }
#studio-ui .chutier_ui .documents li .entrees span[tid='119'] {
background-color: #c48978; }
#studio-ui .chutier_ui .documents li .entrees span[tid='132'] {
background-color: #5270bb; }
#studio-ui .chutier_ui .documents li .entrees span[tid='122'] {
background-color: #fb54d3; }
#studio-ui .chutier_ui .documents li .entrees span[tid='129'] {
background-color: #e07483; }
#studio-ui .chutier_ui .documents li .entrees span[tid='120'] {
background-color: #655845; }
#studio-ui .chutier_ui .documents li .entrees span[tid='130'] {
background-color: #7e0868; }
#studio-ui .chutier_ui .documents li .entrees span[tid='118'] {
background-color: #0e7121; }
#studio-ui .chutier_ui .documents li .entrees span[tid='127'] {
background-color: #dabd42; }
#studio-ui .chutier_ui .documents li .entrees span[tid='133'] {
background-color: #0399bb; }
#studio-ui .chutier_ui .documents li .entrees span[tid='128'] {
background-color: #399a1c; }
#studio-ui .chutier_ui .documents li .entrees span[tid='124'] {
background-color: #708540; }
#studio-ui .chutier_ui .documents li .entrees span[tid='116'] {
background-color: #191bff; }
#studio-ui .chutier_ui .documents li .entrees span[tid='117'] {
background-color: #279d84; }
#studio-ui .chutier_ui .documents li .entrees span[tid='131'] {
background-color: #5219ab; }
#studio-ui .chutier_ui .documents li .entrees span[tid='126'] {
background-color: #d49cb6; }
#studio-ui .chutier_ui .documents li .entrees span[tid='123'] {
background-color: #497715; }
#studio-ui .chutier_ui .documents li a {
text-transform: capitalize;
font-size: 1em; }
#studio-ui .composition_ui {
height: 50%; }
body.path-agenda main .col > .wrapper {
height: 100%; }
@@ -1558,19 +1633,27 @@ body.path-productions .layout-content .row {
padding: 0 1em; }
footer {
pointer-events: none;
display: table;
padding: 0 0 0.5em 0; }
footer > .region {
display: table-cell;
position: relative;
pointer-events: none; }
footer > .wrapper {
white-space: nowrap; }
footer .region-footer-left {
text-align: left; }
footer .region-footer-center {
text-align: center; }
footer .region-footer-right {
text-align: right;
min-width: 30px; }
footer > .wrapper > .region {
display: inline-block;
vertical-align: baseline;
white-space: normal; }
footer > .wrapper > .region > * {
display: inline-block;
vertical-align: bottom; }
footer > .wrapper .region-footer-left {
width: 12%;
text-align: left; }
footer > .wrapper .region-footer-center {
width: 72%;
overflow: hidden;
text-align: center; }
footer > .wrapper .region-footer-right {
width: 12%;
text-align: right; }
footer nav.block-menu {
display: inline-block; }
footer nav.block-menu ul {
@@ -1595,6 +1678,8 @@ footer {
text-transform: uppercase;
font-size: 0.756em;
white-space: nowrap; }
footer nav.block-menu ul li:first-of-type {
margin-left: 1em; }
footer .block-language {
display: inline-block;
position: relative; }
@@ -1628,6 +1713,7 @@ footer {
body:not(.path-productions) footer #block-productions {
display: none; }
footer #block-productions ul {
margin-left: -3em;
white-space: nowrap; }
footer #block-productions ul li a {
pointer-events: all;
@@ -1659,6 +1745,7 @@ footer {
body.path-productions footer .block-block-edlp-entrees {
display: none; }
footer .block-block-edlp-entrees ul {
margin: 0;
white-space: nowrap; }
footer .block-block-edlp-entrees ul li {
display: inline-block;
@@ -1813,6 +1900,17 @@ footer {
footer .block-block-edlp-entrees ul li.opened .entree-content {
width: 350px;
opacity: 1; }
footer #block-studiolinkblock {
pointer-events: all; }
footer #block-studiolinkblock a {
display: block;
width: 20px;
height: 20px;
background-image: url(../img/studio.svg);
background-size: contain;
text-indent: 40px;
margin: 0;
overflow: hidden; }
footer #block-userlogin {
pointer-events: all;
position: relative;
@@ -1837,6 +1935,8 @@ footer {
padding: 0.5em;
padding-bottom: 20px;
background-color: rgba(255, 255, 255, 0.95);
border-top: 1px solid red;
border-bottom: 1px solid red;
overflow: hidden;
-webkit-box-sizing: border-box;
box-sizing: border-box;