bachir/edlp_d8
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

enregistrement transcription interface is ok

Browse Source
This commit is contained in:
bachir
2018-04-15 00:00:40 +02:00
parent 6d88ca7c8d
commit ea435b7517
9 changed files with 196 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
sites/all/themes/custom/edlptheme/assets/dist/scripts/main.min.js
Vendored
+37 -3
View File
@@ -194,7 +194,11 @@
console.log('selector', state.selector);
$('a[selector="'+state.selector+'"]').addClass('is-active');
}else{
$('a[data-drupal-link-system-path="'+state.sys_path+'"]').addClass('is-active');
if(typeof state.view_mode != 'undefined'){
$('a[viewmode="'+state.view_mode+'"][data-drupal-link-system-path="'+state.sys_path+'"]').addClass('is-active');
}else{
$('a[data-drupal-link-system-path="'+state.sys_path+'"]').addClass('is-active');
}
// as new content is not related to entree, we trigger close entree
_$body.trigger({'type':'new-content-not-entree-ajax-loaded'});
}
@@ -228,6 +232,12 @@
addCloseModalBtnToCols();
}
// enregistrement transcription
if(data.entity_type == "node" && data.bundle == "enregistrement" && data.view_mode == "transcript"){
// window.requestAnimationFrame(initEnregistrementTranscript);
initEnregistrementTranscript();
}
// update the language switcher block if it comes in the response
if(typeof data.translations_links != 'undefined'){
console.log('state',state);
@@ -261,7 +271,6 @@
_$body.attr('booted', 'booted');
_$body.removeClass('ajax-loading');
// url is null means that we are loading content on popState event
// so we don't record the state again
if(state.url){
@@ -271,7 +280,7 @@
// };
// console.log('url:'+url+' ; state',state);
// console.log(window.location);
// we can not pushestate with absolute url
// /!\ we can not pushestate with absolute url /!\
history.pushState(state, null, state.url);
}
};
@@ -713,6 +722,7 @@
stop(){
// console.log('AudioPlayer stop()');
this.audio.pause();
// TODO: don't close player if article or transcript is open
this.timeOutToHide();
},
// audio events
@@ -1201,6 +1211,30 @@
});
};
// ___ _ _ _
// | __|_ _ _ _ ___ __ _(_)__| |_ _ _ ___ _ __ ___ _ _| |_
// | _|| ' \| '_/ -_) _` | (_-< _| '_/ -_) ' \/ -_) ' \ _|
// |___|_||_|_| \___\__, |_/__/\__|_| \___|_|_|_\___|_||_\__|
// |___/
function initEnregistrementTranscript(){
console.log('initEnregistrementTranscript');
var $node = _$row.find('article.node--type-enregistrement.node--view-mode-transcript');
var $nav = $('<nav>').prependTo($node);
$node.find('.field--name-field-transcript-vo').addClass('visible').find('.field__label')
.clone().appendTo($nav).addClass('is-active')
.attr('field_target', '.field--name-field-transcript-vo');
$node.find('.field--name-field-transcript-trad').find('.field__label')
.clone().appendTo($nav)
.attr('field_target', '.field--name-field-transcript-trad');
$nav.find('.field__label').on('click', function(){
var $this = $(this).addClass('is-active');
$this.siblings('.is-active').removeClass('is-active');
$this.parents('article.node').find('.field.visible').removeClass('visible');
$this.parents('article.node').find($this.attr('field_target')).addClass('visible');
});
};
// __ __ _ _
// | \/ |___ __| |__ _| |___
// | |\/| / _ \/ _` / _` | (_-<
sites/all/themes/custom/edlptheme/assets/dist/styles/app.min.css
Vendored
+48 -3
View File
@@ -1306,14 +1306,59 @@ main[role="main"] .layout-content {
main[role="main"] .layout-content .field.text-formatted a.audio-link {
border-bottom: 1px dotted red; }
main[role="main"] article.node > h2, main[role="main"] h2.title {
main[role="main"] h3.sur-title {
font-size: 0.9em;
font-weight: normal;
text-transform: uppercase;
margin: 0.9em 0 0; }
main[role="main"] article.node:not(.node--type-enregistrement) > h2, main[role="main"] h2.title {
font-size: 0.9em;
font-weight: normal;
text-transform: uppercase; }
main[role="main"] article.node.node--type-enregistrement > h2 {
font-size: 0.82em;
font-weight: 600;
line-height: 1.6;
margin: 0.9em 0 0 0; }
html.js main[role="main"] article.node.node--type-enregistrement h3.sur-title {
display: none; }
main[role="main"] article.node.node--type-enregistrement .field--name-field-transcript-vo .field__label, main[role="main"] article.node.node--type-enregistrement .field--name-field-transcript-trad .field__label {
font-size: 0.9em;
font-weight: normal;
text-transform: uppercase; }
html.js main[role="main"] article.node.node--type-enregistrement .field--name-field-transcript-vo .field__label, html.js main[role="main"] article.node.node--type-enregistrement .field--name-field-transcript-trad .field__label {
display: none; }
main[role="main"] article.node.node--type-enregistrement .field--name-field-transcript-vo:not(.visible), main[role="main"] article.node.node--type-enregistrement .field--name-field-transcript-trad:not(.visible) {
display: none; }
main[role="main"] article.node.node--type-enregistrement nav {
padding: 1em 0 0; }
main[role="main"] article.node.node--type-enregistrement nav div.field__label {
font-size: 0.9em;
font-weight: normal;
text-transform: uppercase;
display: inline-block;
cursor: pointer;
margin-right: 1em; }
main[role="main"] article.node.node--type-enregistrement nav div.field__label:before {
content: "";
display: inline-block;
width: 7px;
height: 7px;
border: 1px solid red;
margin-right: 0.5em; }
main[role="main"] article.node.node--type-enregistrement nav div.field__label:hover:before, main[role="main"] article.node.node--type-enregistrement nav div.field__label.is-active:before {
background-color: red; }
main[role="main"] article.node p {
font-size: 0.75em;
font-weight: normal; }
font-size: 0.82em;
font-weight: normal;
line-height: 1.6; }
main[role="main"] img {
max-width: 100%;
sites/all/themes/custom/edlptheme/assets/scripts/main.js
+37 -3
View File
@@ -194,7 +194,11 @@
console.log('selector', state.selector);
$('a[selector="'+state.selector+'"]').addClass('is-active');
}else{
$('a[data-drupal-link-system-path="'+state.sys_path+'"]').addClass('is-active');
if(typeof state.view_mode != 'undefined'){
$('a[viewmode="'+state.view_mode+'"][data-drupal-link-system-path="'+state.sys_path+'"]').addClass('is-active');
}else{
$('a[data-drupal-link-system-path="'+state.sys_path+'"]').addClass('is-active');
}
// as new content is not related to entree, we trigger close entree
_$body.trigger({'type':'new-content-not-entree-ajax-loaded'});
}
@@ -228,6 +232,12 @@
addCloseModalBtnToCols();
}
// enregistrement transcription
if(data.entity_type == "node" && data.bundle == "enregistrement" && data.view_mode == "transcript"){
// window.requestAnimationFrame(initEnregistrementTranscript);
initEnregistrementTranscript();
}
// update the language switcher block if it comes in the response
if(typeof data.translations_links != 'undefined'){
console.log('state',state);
@@ -261,7 +271,6 @@
_$body.attr('booted', 'booted');
_$body.removeClass('ajax-loading');
// url is null means that we are loading content on popState event
// so we don't record the state again
if(state.url){
@@ -271,7 +280,7 @@
// };
// console.log('url:'+url+' ; state',state);
// console.log(window.location);
// we can not pushestate with absolute url
// /!\ we can not pushestate with absolute url /!\
history.pushState(state, null, state.url);
}
};
@@ -713,6 +722,7 @@
stop(){
// console.log('AudioPlayer stop()');
this.audio.pause();
// TODO: don't close player if article or transcript is open
this.timeOutToHide();
},
// audio events
@@ -1201,6 +1211,30 @@
});
};
// ___ _ _ _
// | __|_ _ _ _ ___ __ _(_)__| |_ _ _ ___ _ __ ___ _ _| |_
// | _|| ' \| '_/ -_) _` | (_-< _| '_/ -_) ' \/ -_) ' \ _|
// |___|_||_|_| \___\__, |_/__/\__|_| \___|_|_|_\___|_||_\__|
// |___/
function initEnregistrementTranscript(){
console.log('initEnregistrementTranscript');
var $node = _$row.find('article.node--type-enregistrement.node--view-mode-transcript');
var $nav = $('<nav>').prependTo($node);
$node.find('.field--name-field-transcript-vo').addClass('visible').find('.field__label')
.clone().appendTo($nav).addClass('is-active')
.attr('field_target', '.field--name-field-transcript-vo');
$node.find('.field--name-field-transcript-trad').find('.field__label')
.clone().appendTo($nav)
.attr('field_target', '.field--name-field-transcript-trad');
$nav.find('.field__label').on('click', function(){
var $this = $(this).addClass('is-active');
$this.siblings('.is-active').removeClass('is-active');
$this.parents('article.node').find('.field.visible').removeClass('visible');
$this.parents('article.node').find($this.attr('field_target')).addClass('visible');
});
};
// __ __ _ _
// | \/ |___ __| |__ _| |___
// | |\/| / _ \/ _` / _` | (_-<
sites/all/themes/custom/edlptheme/assets/styles/app.scss
+46 -1
View File
@@ -254,8 +254,53 @@ main[role="main"]{
}
}
}
article.node>h2, h2.title{
h3.sur-title{
@include content_titles;
margin:0.9em 0 0;
}
article.node:not(.node--type-enregistrement)>h2, h2.title{
@include content_titles;
}
article.node.node--type-enregistrement{
>h2{
@include content_subtitles;
margin:0.9em 0 0 0;
}
html.js &{
h3.sur-title{display:none;}
}
.field--name-field-transcript-vo, .field--name-field-transcript-trad{
.field__label{
@include content_titles;
html.js &{
display: none;
}
}
&:not(.visible){
display:none;
}
}
nav{
padding:1em 0 0;
div.field__label{
@include content_titles;
display: inline-block;
cursor:pointer;
margin-right: 1em;
&:before{
content: "";
display:inline-block;
$sq:7px;
width: $sq; height:$sq;
border: 1px solid red;
margin-right: 0.5em;
}
&:hover:before,
&.is-active:before{
background-color: red;
}
}
}
}
article.node p{
@include content_courant;
sites/all/themes/custom/edlptheme/assets/styles/base/_fonts.scss
+11 -3
View File
@@ -3,7 +3,15 @@
font-weight: normal;
text-transform: uppercase;
}
@mixin content_courant {
font-size: 0.75em;
font-weight: normal;
@mixin content_subtitles {
font-size: 0.82em;
font-weight: 600;
line-height: 1.6;
}
@mixin content_courant {
font-size: 0.82em;
font-weight: normal;
line-height: 1.6;
}
sites/all/themes/custom/edlptheme/edlptheme.theme
+5
View File
@@ -36,6 +36,11 @@ function edlptheme_preprocess_node(&$vars){
$vars['link_attributes'] = new Attribute(array(
'data-drupal-link-system-path' => $system_path=='' ? '<front>' : $system_path
));
if($node->bundle() == 'enregistrement' && in_array($vars['view_mode'], ['article','transcript'])){
$vars['page'] = true;
$vars['sur_title'] = $vars['view_mode'];
}
}
/**
sites/all/themes/custom/edlptheme/templates/content/node.html.twig
+10 -5
View File
@@ -83,12 +83,17 @@
{{ attach_library('classy/node') }}
<article{{ attributes.addClass(classes) }}>
{{ title_prefix }}
{% if not page %}
<h2{{ title_attributes.addClass('node-title') }}>
<a href="{{ url }}" rel="bookmark" {{ link_attributes }}>{{ label }}</a>
</h2>
{% if sur_title %}
<h3 class="sur-title">{{ sur_title }}</h3>
{% endif %}
{{ title_prefix }}
<h2{{ title_attributes.addClass('node-title') }}>
{% if not page %}
<a href="{{ url }}" rel="bookmark" {{ link_attributes }}>{{ label }}</a>
{% else %}
{{ label }}
{% endif %}
</h2>
{{ title_suffix }}
{% if display_submitted %}
sites/default/config/sync/field.field.node.enregistrement.field_transcript_trad.yml
+1 -1
View File
@@ -11,7 +11,7 @@ id: node.enregistrement.field_transcript_trad
field_name: field_transcript_trad
entity_type: node
bundle: enregistrement
label: 'Transcription (Traduction)'
label: Traduction
description: ''
required: false
translatable: true
sites/default/config/sync/field.field.node.enregistrement.field_transcript_vo.yml
+1 -1
View File
@@ -11,7 +11,7 @@ id: node.enregistrement.field_transcript_vo
field_name: field_transcript_vo
entity_type: node
bundle: enregistrement
label: 'Transcription (Version Originale)'
label: Transcription
description: ''
required: false
translatable: false