Commit b82df03d authored by Lisa Seeto's avatar Lisa Seeto
Browse files

Bug 1827811: Embedded Media Task



add the block-header to the block.
remove the download link from page as it now shows in the modal.
add artefactid and blockid to image.tpl
fix issue with data-toggle collapse targeting syntax error.
update  active block functionality for block headers
update block-comments-details-header.tpl for icon headers
fix Journals, and tagged entries and recent posts to use icons for block header.
change pdf block to use block header icons
clean up .comments-details class that is no longer needed.
add modal functionality for image gallery blocks for thumbnails and thumbnails square presentation.
add modal functionality for some html block, clear up js for icons that is no longer needed.
add title text to icons and block-header
create activateModalLinks() func to tidy up js modal click events in view/view.php

Change-Id: Ib5967d44288557ef4d380eb99241e8442da90f29
Signed-off-by: default avatarLisa Seeto <lisaseeto@catalyst.net.nz>
parent 44fcc9c9
...@@ -410,10 +410,14 @@ class PluginBlocktypeGallery extends MaharaCoreBlocktype { ...@@ -410,10 +410,14 @@ class PluginBlocktypeGallery extends MaharaCoreBlocktype {
$smarty = smarty_core(); $smarty = smarty_core();
$smarty->assign('instanceid', $instance->get('id')); $smarty->assign('instanceid', $instance->get('id'));
if (isset($configdata['artefactid'])) {
$smarty->assign('artefactid', $configdata['artefactid']);
}
$smarty->assign('count', count($images)); $smarty->assign('count', count($images));
$smarty->assign('images', $images); $smarty->assign('images', $images);
$smarty->assign('showdescription', (!empty($configdata['showdescription'])) ? $configdata['showdescription'] : false); $smarty->assign('showdescription', (!empty($configdata['showdescription'])) ? $configdata['showdescription'] : false);
$smarty->assign('width', $width); $smarty->assign('width', $width);
$smarty->assign('editing', $editing);
if (isset($height)) { if (isset($height)) {
$smarty->assign('height', $height); $smarty->assign('height', $height);
} }
...@@ -429,8 +433,6 @@ class PluginBlocktypeGallery extends MaharaCoreBlocktype { ...@@ -429,8 +433,6 @@ class PluginBlocktypeGallery extends MaharaCoreBlocktype {
require_once(get_config('docroot') . 'lib/view.php'); require_once(get_config('docroot') . 'lib/view.php');
$view = new View($configdata['viewid']); $view = new View($configdata['viewid']);
list($commentcount, $comments) = ArtefactTypeComment::get_artefact_comments_for_view($artefact, $view, $instance->get('id'), true, $editing, $versioning); list($commentcount, $comments) = ArtefactTypeComment::get_artefact_comments_for_view($artefact, $view, $instance->get('id'), true, $editing, $versioning);
$smarty->assign('commentcount', $commentcount);
$smarty->assign('comments', $comments);
} }
return $smarty->fetch('blocktype:gallery:' . $template . '.tpl'); return $smarty->fetch('blocktype:gallery:' . $template . '.tpl');
} }
......
...@@ -30,10 +30,12 @@ class PluginBlocktypeHtml extends MaharaCoreBlocktype { ...@@ -30,10 +30,12 @@ class PluginBlocktypeHtml extends MaharaCoreBlocktype {
$configdata['viewid'] = $instance->get('view'); $configdata['viewid'] = $instance->get('view');
$result = ''; $result = '';
$smarty = smarty_core();
$artefactid = isset($configdata['artefactid']) ? $configdata['artefactid'] : null; $artefactid = isset($configdata['artefactid']) ? $configdata['artefactid'] : null;
if ($artefactid) { if ($artefactid) {
$artefact = $instance->get_artefact_instance($artefactid); $artefact = $instance->get_artefact_instance($artefactid);
$smarty->assign('artefactid', $artefactid);
$smarty->assign('allowcomments', $artefact->get('allowcomments'));
if (!file_exists($artefact->get_path())) { if (!file_exists($artefact->get_path())) {
return; return;
} }
...@@ -44,14 +46,13 @@ class PluginBlocktypeHtml extends MaharaCoreBlocktype { ...@@ -44,14 +46,13 @@ class PluginBlocktypeHtml extends MaharaCoreBlocktype {
require_once(get_config('docroot') . 'lib/view.php'); require_once(get_config('docroot') . 'lib/view.php');
$view = new View($configdata['viewid']); $view = new View($configdata['viewid']);
list($commentcount, $comments) = ArtefactTypeComment::get_artefact_comments_for_view($artefact, $view, $instance->get('id'), true, $editing, $versioning); list($commentcount, $comments) = ArtefactTypeComment::get_artefact_comments_for_view($artefact, $view, $instance->get('id'), true, $editing, $versioning);
}
$smarty = smarty_core();
if ($artefactid) {
$smarty->assign('commentcount', $commentcount); $smarty->assign('commentcount', $commentcount);
$smarty->assign('comments', $comments); $smarty->assign('comments', $comments);
} }
$smarty->assign('editing', $editing);
$smarty->assign('html', $result); $smarty->assign('html', $result);
$smarty->assign('blockid', $instance->get('id'));
return $smarty->fetch('blocktype:html:html.tpl'); return $smarty->fetch('blocktype:html:html.tpl');
} }
......
...@@ -54,31 +54,26 @@ class PluginBlocktypeInternalmedia extends MaharaCoreBlocktype { ...@@ -54,31 +54,26 @@ class PluginBlocktypeInternalmedia extends MaharaCoreBlocktype {
if (!$playerclass) { if (!$playerclass) {
return get_string('typeremoved', 'blocktype.file/internalmedia'); return get_string('typeremoved', 'blocktype.file/internalmedia');
} }
$smarty = smarty_core();
$result = '<div class="mediaplayer-container card-body flush"><div class="mediaplayer">'; $smarty->assign('artefactid', $artefact->get('id'));
$result .= call_static_method($playerclass, 'get_html', $artefact, $instance, $width, $height); $smarty->assign('blockid', $instance->get('id'));
// File download link
$filesize = round($artefact->get('size') / 1000000, 2) . 'MB';
$url = self::get_download_link($artefact, $instance);
$result .= '<div class="media-download content-text">
<span class="icon icon-download left" role="presentation" aria-hidden="true">
</span><span class="sr-only">' . get_string('Download', 'artefact.internal') . '</span>
<a class="media-link text-small" href="' . $url . '">' . hsc($artefact->get('title')) . '</a>
<span class="text-midtone text-small"> [' . $filesize . '] </span>
</div>';
$result .= '</div></div>';
require_once(get_config('docroot') . 'artefact/comment/lib.php'); require_once(get_config('docroot') . 'artefact/comment/lib.php');
require_once(get_config('docroot') . 'lib/view.php'); require_once(get_config('docroot') . 'lib/view.php');
$view = new View($instance->get('view')); $view = new View($instance->get('view'));
$smarty->assign('allowcomments', $artefact->get('allowcomments'));
if (!$artefact->get('allowcomments')) {
$smarty->assign('justdetails', true);
}
list($commentcount, $comments) = ArtefactTypeComment::get_artefact_comments_for_view($artefact, $view, $instance->get('id'), true, $editing, $versioning); list($commentcount, $comments) = ArtefactTypeComment::get_artefact_comments_for_view($artefact, $view, $instance->get('id'), true, $editing, $versioning);
$smarty = smarty_core();
$smarty->assign('commentcount', $commentcount); $smarty->assign('commentcount', $commentcount);
$smarty->assign('comments', $comments); $smarty->assign('comments', $comments);
$blockheader = $smarty->fetch('header/block-comments-details-header.tpl');
$result = $blockheader;
$result .= '<div class="mediaplayer-container card-body flush"><div class="mediaplayer">';
$result .= call_static_method($playerclass, 'get_html', $artefact, $instance, $width, $height);
$result .= '</div></div>';
$smarty->assign('html', $result); $smarty->assign('html', $result);
return $smarty->fetch('blocktype:internalmedia:internalmedia.tpl'); return $smarty->fetch('blocktype:internalmedia:internalmedia.tpl');
} }
......
...@@ -84,10 +84,13 @@ class PluginBlocktypePdf extends MaharaCoreBlocktype { ...@@ -84,10 +84,13 @@ class PluginBlocktypePdf extends MaharaCoreBlocktype {
} }
$smarty = smarty_core(); $smarty = smarty_core();
if ($artefactid) { if ($artefactid) {
$smarty->assign('commentcount', $commentcount); $smarty->assign('artefactid', $artefactid);
$smarty->assign('comments', $comments); $artefact = $instance->get_artefact_instance($configdata['artefactid']);
$smarty->assign('allowcomments', $artefact->get('allowcomments'));
} }
$smarty->assign('html', $result); $smarty->assign('html', $result);
$smarty->assign('editing', $editing);
$smarty->assign('blockid', $instance->get('id'));
return $smarty->fetch('blocktype:pdf:pdfrender.tpl'); return $smarty->fetch('blocktype:pdf:pdfrender.tpl');
} }
......
...@@ -1228,7 +1228,7 @@ jQuery(function($) { ...@@ -1228,7 +1228,7 @@ jQuery(function($) {
$(document).on('click', 'a', function(event) { $(document).on('click', 'a', function(event) {
if ($(this.hash).length && location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && if ($(this.hash).length && location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') &&
!$(this).is('[class^="carousel"]') && !$(this).is('[class^="carousel"]') &&
!$(this).is('[data-toggle="collapse"]') && !($(this).data('toggle') === 'collapse') &&
!($('body').hasClass('modal-open'))) { !($('body').hasClass('modal-open'))) {
event.preventDefault(); event.preventDefault();
var target = $(this.hash); var target = $(this.hash);
......
...@@ -81,8 +81,16 @@ function addFeedbackSuccess(form, data) { ...@@ -81,8 +81,16 @@ function addFeedbackSuccess(form, data) {
} }
// Update the comment link so the correct number of comments is displayed // Update the comment link so the correct number of comments is displayed
var commentlink = ' ' + get_string('commentsanddetails', 'artefact.comment', data.data.count); var commentlink = $('.commentlink').filter('[data-artefactid=' + data.data.artefact + ']');
$('.commentlink').filter('[data-artefactid=' + data.data.artefact + ']').html('<span class="icon icon-comments" role="presentation" aria-hidden="true"></span>' + commentlink); var newlink = '<span class="icon icon-comments" role="presentation" aria-hidden="true"></span>';
if (!(commentlink.closest('div[class*=block-header]').hasClass('bh-displayiconsonly'))) {
newlink += ' ' + get_string('commentsanddetails', 'artefact.comment', data.data.count);
}
else {
newlink += ' (' + data.data.count + ')';
newlink += '<span class="bh-margin-left icon icon-search-plus" role="presentation" aria-hidden="true"></span>';
}
commentlink.html(newlink);
//For brief comments and details previews when there is no block comments and details header //For brief comments and details previews when there is no block comments and details header
$('.comment-count-preview').filter('[data-artefactid=' + data.data.artefact + ']').html('<span class="icon icon-comments" role="presentation" aria-hidden="true"></span> (' + data.data.count + ')'); $('.comment-count-preview').filter('[data-artefactid=' + data.data.artefact + ']').html('<span class="icon icon-comments" role="presentation" aria-hidden="true"></span> (' + data.data.count + ')');
...@@ -240,24 +248,35 @@ function delete_comment_from_modal_submit(form, data) { ...@@ -240,24 +248,35 @@ function delete_comment_from_modal_submit(form, data) {
}); });
// Update the comment link with correct count // Update the comment link with correct count
var commentlink = $('.commentlink').filter('[data-artefactid=' + data.data.artefact + ']');
var newlink ='';
if (data.data.count == 0) { if (data.data.count == 0) {
var newlink = '<span class="icon icon-plus" role="presentation" aria-hidden="true"></span>'; if (commentlink.closest('div[class*=block-header]').hasClass('bh-displayiconsonly')) {
newlink += ' ' + get_string('addcomment', 'artefact.comment'); newlink += '<span class="icon icon-comments" role="presentation" aria-hidden="true"></span>';
newlink += '<span class="bh-margin-left icon icon-link" role="presentation" aria-hidden="true"></span>'; newlink += '<span class="bh-margin-left icon icon-search-plus" role="presentation" aria-hidden="true"></span>';
newlink += ' ' + get_string('Details', 'artefact.comment'); }
$('.commentlink').filter('[data-artefactid=' + data.data.artefact + ']').html(newlink); else {
newlink += '<span class="icon icon-plus" role="presentation" aria-hidden="true"></span>';
//For brief comments and details previews when there is no block comments and details header newlink += ' ' + get_string('addcomment', 'artefact.comment');
$('.comment-count-preview').filter('[data-artefactid=' + data.data.artefact + ']').html(''); newlink += '<span class="bh-margin-left icon icon-link" role="presentation" aria-hidden="true"></span>';
newlink += ' ' + get_string('Details', 'artefact.comment');
}
} }
else { else {
var commentlink = ' ' + get_string('commentsanddetails', 'artefact.comment', data.data.count); if (commentlink.closest('div[class*=block-header]').hasClass('bh-displayiconsonly')) {
$('.commentlink').filter('[data-artefactid=' + data.data.artefact + ']').html('<span class="icon icon-comments" role="presentation" aria-hidden="true"></span>' + commentlink); newlink = '<span class="icon icon-comments" role="presentation" aria-hidden="true"></span> (';
newlink += data.data.count + ')';
//For brief comments and details previews when there is no block comments and details header newlink += '<span class="bh-margin-left icon icon-search-plus" role="presentation" aria-hidden="true"></span>';
$('.comment-count-preview').filter('[data-artefactid=' + data.data.artefact + ']').html('<span class="icon icon-comments" role="presentation" aria-hidden="true"></span> (' + data.data.count + ')'); }
else {
newlink = '<span class="icon icon-comments" role="presentation" aria-hidden="true"></span>';
newlink += ' ' + get_string('commentsanddetails', 'artefact.comment', data.data.count);
}
} }
// Add the new link to the comment link
commentlink.html(newlink);
if ($('#configureblock').hasClass('closed')) { if ($('#configureblock').hasClass('closed')) {
formSuccess(form, data); formSuccess(form, data);
} }
...@@ -327,12 +346,10 @@ function toggleDetailsBtn() { ...@@ -327,12 +346,10 @@ function toggleDetailsBtn() {
if (!$('#details-btn').hasClass('active')) { if (!$('#details-btn').hasClass('active')) {
$('#details-btn').addClass('active'); $('#details-btn').addClass('active');
headers.removeClass('d-none'); headers.removeClass('d-none');
$('.comments-details').removeClass('d-none');
} }
else { else {
$('#details-btn').removeClass('active'); $('#details-btn').removeClass('active');
headers.addClass('d-none'); headers.addClass('d-none');
$('.comments-details').addClass('d-none');
} }
}); });
} }
......
...@@ -25,6 +25,19 @@ ...@@ -25,6 +25,19 @@
{/if} {/if}
<div class="recentblogpost list-group"> <div class="recentblogpost list-group">
{foreach from=$mostrecent item=post} {foreach from=$mostrecent item=post}
{if !($editing)}
{if !$post->allowcomments}
{assign var="justdetails" value=true}
{/if}
{include
file='header/block-comments-details-header.tpl'
artefactid=$post->id
blockid=$blockid
commentcount=$post->commentcount
allowcomments=$post->allowcomments
justdetails=$justdetails
displayiconsonly=true}
{/if}
<div class="list-group-item"> <div class="list-group-item">
<a class="outer-link collapsed" data-toggle="collapse" href="#recent_post_{$post->id}" aria-expanded="false"> <a class="outer-link collapsed" data-toggle="collapse" href="#recent_post_{$post->id}" aria-expanded="false">
<span class="sr-only">{$post->title}</span> <span class="sr-only">{$post->title}</span>
...@@ -38,14 +51,6 @@ ...@@ -38,14 +51,6 @@
{$post->title} {$post->title}
{/if} {/if}
</h4> </h4>
<span class="comments-details d-none comments-details-mg-left comment-count-preview" data-artefactid="{$post->id}">
{if $post->commentcount > 0}
<span class="comment_count" role="presentation" aria-hidden="true"></span>
<span class="icon icon-comments" role="presentation" aria-hidden="true"></span>
({$post->commentcount})
{/if}
</span>
<span class="comments-details d-none icon icon-search-plus bh-margin-left" role="presentation" aria-hidden="true"></span>
<div> <div>
<span class="text-small"> <span class="text-small">
{str tag='postedin' section='blocktype.blog/recentposts'} {str tag='postedin' section='blocktype.blog/recentposts'}
...@@ -70,13 +75,6 @@ ...@@ -70,13 +75,6 @@
<span class="icon icon-chevron-down collapse-indicator float-right" role="presentation" aria-hidden="true"></span> <span class="icon icon-chevron-down collapse-indicator float-right" role="presentation" aria-hidden="true"></span>
</div> </div>
<div id="recent_post_{$post->id}" class="collapse content-text"> <div id="recent_post_{$post->id}" class="collapse content-text">
{if $post->tags}
<div class="tags metadata">
<span class="icon icon-tags left" role="presentation" aria-hidden="true"></span>
<strong>{str tag=tags}:</strong>
{list_tags owner=$post->owner tags=$post->tags}
</div>
{/if}
<span>{$post->description|safe}</span> <span>{$post->description|safe}</span>
</div> </div>
{/foreach} {/foreach}
......
...@@ -65,6 +65,19 @@ ...@@ -65,6 +65,19 @@
{else} {else}
<div class="taggedposts list-group"> <div class="taggedposts list-group">
{foreach from=$results item=post} {foreach from=$results item=post}
{if !$editing}
{if !$post->allowcomments}
{assign var="justdetails" value=true}
{/if}
{include
file='header/block-comments-details-header.tpl'
artefactid=$post->id
blockid=$blockid
commentcount=$post->commentcount
allowcomments=$post->allowcomments
justdetails=$justdetails
displayiconsonly=true}
{/if}
<div class="list-group-item"> <div class="list-group-item">
<a class="outer-link collapsed" data-toggle="collapse" href="#tagged_post_{$post->id}" aria-expanded="false"> <a class="outer-link collapsed" data-toggle="collapse" href="#tagged_post_{$post->id}" aria-expanded="false">
<span class="sr-only">{$post->title}</span> <span class="sr-only">{$post->title}</span>
...@@ -78,14 +91,6 @@ ...@@ -78,14 +91,6 @@
{$post->title} {$post->title}
{/if} {/if}
</h4> </h4>
<span class="comments-details d-none comments-details-mg-left comment-count-preview" data-artefactid="{$post->id}">
{if $post->commentcount > 0}
<span class="comment_count" role="presentation" aria-hidden="true"></span>
<span class="icon icon-comments" role="presentation" aria-hidden="true"></span>
({$post->commentcount})
{/if}
</span>
<span class="comments-details d-none icon icon-search-plus bh-margin-left" role="presentation" aria-hidden="true"></span>
<div> <div>
<span class="metadata"> <span class="metadata">
{str tag='postedon' section='blocktype.blog/taggedposts'} {str tag='postedon' section='blocktype.blog/taggedposts'}
......
...@@ -9,7 +9,8 @@ ...@@ -9,7 +9,8 @@
blockid=$options.blockid blockid=$options.blockid
commentcount=$post->commentcount commentcount=$post->commentcount
allowcomments=$post->allowcomments allowcomments=$post->allowcomments
justdetails=$justdetails} justdetails=$justdetails
displayiconsonly = true}
{/if} {/if}
<div class="post list-group-item clearfix flush"> <div class="post list-group-item clearfix flush">
<div class="post-heading"> <div class="post-heading">
......
{if !$editing}
{include
file='header/block-comments-details-header.tpl'
artefactid=$artefactid
blockid=$instanceid
allowcomments=false
justdetails=true}
{/if}
<div id="thumbnails{$instanceid}" class="card-body thumbnails js-masonry"> <div id="thumbnails{$instanceid}" class="card-body thumbnails js-masonry">
{foreach from=$images item=image} {foreach from=$images item=image}
<div {if $image.squaredimensions}style="width:{$image.squaredimensions}px;height:{$image.squaredimensions}px;"{/if} class="thumb"> <div {if $image.squaredimensions}style="width:{$image.squaredimensions}px;height:{$image.squaredimensions}px;"{/if} class="thumb">
......
{if !$editing}
{include
file='header/block-comments-details-header.tpl'
artefactid=$artefactid
blockid=$instanceid
allowcomments=false
justdetails=true}
{/if}
<div id="thumbnails{$instanceid}" class="card-body thumbnails js-masonry"> <div id="thumbnails{$instanceid}" class="card-body thumbnails js-masonry">
{foreach from=$images item=image} {foreach from=$images item=image}
<div style="width: {$width * 1.5}px;" class="thumb"> <div style="width: {$width * 1.5}px;" class="thumb">
......
<div class="card-body"> <div class="card-body">
{if !$editing}
{if !$allowcomments}
{assign var="justdetails" value=true}
{/if}
{include
file='header/block-comments-details-header.tpl'
artefactid=$artefactid
blockid=$blockid
commentcount=$commentcount
allowcomments=$allowcomments
justdetails=$justdetails}
{/if}
{$html|safe} {$html|safe}
</div> </div>
{$comments|safe}
<div class="imageblock card-body" itemscope itemtype="http://schema.org/ImageObject"> <div class="imageblock card-body" itemscope itemtype="http://schema.org/ImageObject">
<div class="image"> <div class="image">
{if !$editing} {if !$editing}
<a class="modal_link" data-toggle="modal-docked" data-target="#configureblock" href="#" > <a class="modal_link" data-toggle="modal-docked" data-target="#configureblock" href="#" data-artefactid="{$artefactid}" data-target="#configureblock" >
<img src="{$src}" alt="{$description}" itemprop="contentURL" data-blockid="{$blockid}" data-artefactid="{$artefactid}" data-target="#configureblock"> <img src="{$src}" alt="{$description}" itemprop="contentURL" data-blockid="{$blockid}">
</a> </a>
{else} {else}
<img src="{$src}" alt="{$description}" itemprop="contentURL"> <img src="{$src}" alt="{$description}" itemprop="contentURL">
......
<div class="card-body"> <div class="card-body">
{if !$editing}
{if !$allowcomments}
{assign var="justdetails" value=true}
{/if}
{include
file='header/block-comments-details-header.tpl'
artefactid=$artefactid
blockid=$blockid
commentcount=$commentcount
allowcomments=$allowcomments
justdetails=$justdetails
displayiconsonly=true}
{/if}
{$html|safe} {$html|safe}
</div> </div>
{$comments|safe}
...@@ -20,6 +20,17 @@ ...@@ -20,6 +20,17 @@
<div class="fullwidth"> <div class="fullwidth">
<ul class="list-group"> <ul class="list-group">
{foreach from=$children item=child} {foreach from=$children item=child}
{if !$child->allowcomments}
{assign var="justdetails" value=true}
{/if}
{include
file='header/block-comments-details-header.tpl'
artefactid=$child->id
blockid=$blockid
commentcount=$child->commentcount
allowcomments=$child->allowcomments
justdetails=$justdetails
displayiconsonly=true}
<li class="filedownload-item list-group-item"> <li class="filedownload-item list-group-item">
{if $child->artefacttype != 'folder'} {if $child->artefacttype != 'folder'}
<a href="{$WWWROOT}artefact/file/download.php?file={$child->id}&amp;view={$viewid}" class="outer-link icon-on-hover"> <a href="{$WWWROOT}artefact/file/download.php?file={$child->id}&amp;view={$viewid}" class="outer-link icon-on-hover">
......
.block-header { .block-header {
background-color: $theme-block-header-bg-color; a {
text-align: right; display: block;
padding: 5px; color: $theme-block-header-color;
text-align: right;
text-decoration: none;
background-color: $theme-block-header-bg-color;
padding: 8px 10px;
&.active-block {
background-color: $theme-primary-color;
}
}
} }
.list-group { .list-group {
...@@ -38,11 +46,3 @@ ...@@ -38,11 +46,3 @@
.bh-margin-left { .bh-margin-left {
margin-left: 10px; margin-left: 10px;
} }
.active-block {
background-color: $theme-primary-color;
}
span.comments-details-mg-left {
margin-left: 10px;
}
...@@ -145,5 +145,5 @@ $navbar-messages-count-color: #000 !default; ...@@ -145,5 +145,5 @@ $navbar-messages-count-color: #000 !default;
$navbar-messages-count-bg: #fc9f1a !default; $navbar-messages-count-bg: #fc9f1a !default;