Commit 93ac36d9 authored by Pat Kira's avatar Pat Kira
Browse files

FIX manage collection pages

And a small class change on auth/lib.php for Evonne

behatnotneeded

Change-Id: I2cfab3e5797598ed1d11693a79a139fbd2ba5927
parent 98ba05cc
......@@ -1241,7 +1241,7 @@ function auth_get_login_form() {
function auth_get_login_form_elements() {
// See if user can register
if (count_records('institution', 'registerallowed', 1, 'suspended', 0)) {
$registerlink = '<a class="btn btn-primary btn-xs" href="' . get_config('wwwroot') . 'register.php">' . get_string('register') . '</a> |';
$registerlink = '<a class="register-link text-small" href="' . get_config('wwwroot') . 'register.php">' . get_string('register') . '</a> |';
}
else {
$registerlink = '';
......@@ -1275,8 +1275,8 @@ function auth_get_login_form_elements() {
),
'register' => array(
'type' => 'markup',
'value' => '<div id="login-helplinks" class=" text-small">' . $registerlink
. '<a href="' . get_config('wwwroot') . 'forgotpass.php">' . get_string('lostusernamepassword') . '</a></div>'
'value' => '<div id="login-helplinks" class="login-related-links">' . $registerlink
. '<a class="forgotpass-link text-small" href="' . get_config('wwwroot') . 'forgotpass.php">' . get_string('lostusernamepassword') . '</a></div>'
),
);
$elements = array(
......
......@@ -123,7 +123,7 @@ if ($available = Collection::available_views($owner, $groupid, $institutionname)
$checkboxes = array();
foreach ($available as $a) {
$checkboxes['view_'.$a->id] = array(
'class' => 'btn drag-default-button ',
'class' => 'btn drag-default-button',
'isformgroup' => false,
'type' => 'checkbox',
'title' => $a->title,
......@@ -138,7 +138,7 @@ if ($available = Collection::available_views($owner, $groupid, $institutionname)
);
$elements['submit'] = array(
'class' => 'btn-primary pull-right mtl',
'class' => 'btn-primary pull-right add-pages',
'type' => 'button',
'usebuttontag' => true,
'value' => '<span class="icon icon-arrow-right prs"></span>' . get_string('addviews','collection'),
......@@ -147,7 +147,7 @@ if ($available = Collection::available_views($owner, $groupid, $institutionname)
$viewsform = pieform(array(
'name' => 'addviews',
'class' => 'ptm btn-draggable fullwidth',
'class' => 'btn-draggable fullwidth',
'renderer' => 'div',
'plugintype' => 'core',
'pluginname' => 'collection',
......@@ -157,154 +157,7 @@ if ($available = Collection::available_views($owner, $groupid, $institutionname)
));
}
$noviewsavailable = get_string('noviewsavailable', 'collection');
$inlinejs .= <<<EOF
jQuery(function($) {
var fixhelper = function(e, div) {
var originals = div.children();
var helper = div.clone();
helper.children().each(function(index) {
$(this).width(originals.eq(index).width());
});
return helper;
};
var updaterows = function(viewid) {
var sortorder = $('#collectionviews').sortable('serialize');
$.post(config['wwwroot'] + "collection/views.json.php", { sesskey: '$sesskey', id: $id, direction: sortorder })
.done(function(data) {
// update the page with the new table
if (data.returnCode == '0') {
$('#collectionviews').replaceWith(data.message.html);
if (viewid) {
$('#addviews_view_' + viewid + '_container').remove();
// check if we have just removed the last option leaving
// only the add pages button
if ($("#addviews .checkbox").children().length <= 1) {
$("#addviews").remove();
$("#pagestoadd .panel-body").append('$noviewsavailable');
}
}
if (data.message.message) {
var warningClass = data.message.messagestatus === 'ok' ? 'success' : 'warning';
var warnmessage = $('<div id="changestatusline" class="alert alert-dismissible alert-' + warningClass + '" role="alert"><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button><p>' + data.message.message + '</p></div>');
$('#messages').empty().append(warnmessage);
}
wiresortables();
wireaddrow();
}
});
};
var wiresortables = function() {
$('#collectionviews').sortable({
items: '> div',
cursor: 'move',
helper: fixhelper,
placeholder: "highlight",
over: function(e, ui) {
if (ui.placeholder[0].tagName == 'DIV') {
var container = $('#collectionviews');
var div = $('#collectionviews div.highlight');
div.css('width', container.width());
div.css('height', '30px');
$(ui.helper).addClass('btn-warning');
}
},
stop: function(e, ui) {
// Get label within the div using children
var labelfor = ui.item.children().attr('for');
if (typeof labelfor !== 'undefined' && labelfor !== false) {
// remove all but the digits
var viewid = ui.item.children().attr('for').replace(/[^\d.]/g,'');
ui.item.replaceWith('<div id="row_' + viewid + '" class="dropped-in-row">' + ui.item.html() + '</div>');
updaterows(viewid);
}
else {
updaterows(false);
}
}
})
.disableSelection()
.hover(function() {
$(this).css('cursor', 'move');
});
};
var wireaddrow = function() {
$('#addviews div').draggable({
connectToSortable: '#collectionviews',
cursor: 'move',
revert: 'invalid',
helper: 'clone',
}).hover(function() {
$(this).css('cursor', 'move');
});
};
var wireaddnewrow = function() {
$('#addviews > div').draggable({
cursor: 'move',
revert: 'invalid',
helper: 'clone',
start: function(e, ui) {
$('#collectionpages .message').addClass('highlight');
},
stop: function(e, ui) {
$('#collectionpages .message').removeClass('highlight');
},
}).hover(function() {
$(this).css('cursor', 'move');
});
};
var wiredrop = function() {
$('#collectionpages .dropzone-previews').droppable({
accept: "div",
drop: function (e, ui) {
var labelfor = ui.draggable.children().attr('for');
if (typeof labelfor !== 'undefined' && labelfor !== false) {
// remove all but the digits
var viewid = ui.draggable.children().attr('for').replace(/[^\d.]/g,'');
$('#collectionpages .dropzone-previews').replaceWith('<div id="collectionviews"><div id="row_' + viewid + '">' + ui.draggable.html() + '</div></div>');
wiresortables();
updaterows(viewid);
}
},
});
};
var wireselectall = function() {
$("#selectall").click(function(e) {
e.preventDefault();
$("#addviews :checkbox").prop("checked", true);
});
};
var wireselectnone = function() {
$("#selectnone").click(function(e) {
e.preventDefault();
$("#addviews :checkbox").prop("checked", false);
});
};
// init
if ($('#collectionviews > li').length > 0) {
wireaddrow();
wiresortables();
}
else {
wireaddnewrow();
wiredrop();
}
wireselectall();
wireselectnone();
});
EOF;
$smarty = smarty(array('jquery','js/jquery/jquery-ui/js/jquery-ui-1.10.2.min.js','js/jquery/jquery-ui/js/jquery-ui.touch-punch.min.js'));
$smarty = smarty(array('jquery','js/jquery/jquery-ui/js/jquery-ui-1.10.2.min.js','js/jquery/jquery-ui/js/jquery-ui.touch-punch.min.js', 'manage-collection-pages'));
setpageicon($smarty, 'icon-folder-open');
if (!empty($groupid)) {
......@@ -317,6 +170,7 @@ else {
$smarty->assign('PAGEHEADING', SUBTITLE);
}
$smarty->assign('id', $id);
$smarty->assign('INLINEJAVASCRIPT', $inlinejs);
$smarty->assign('baseurl', $baseurl);
$smarty->assign('displayurl', get_config('wwwroot') . 'collection/views.php?id=' . $id);
......
/**
* Javascript for the manage collection pages
*
* @package mahara
* @subpackage core
* @author Catalyst IT Ltd
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL version 3 or later
* @copyright For copyright information on Mahara, please see the README file distributed with this software.
*
*/
jQuery(function($) {
var fixhelper = function(e, div) {
var originals = div.children();
var helper = div.clone();
helper.children().each(function(index) {
$(this).width(originals.eq(index).width());
});
return helper;
};
var updaterows = function(viewid) {
var sortorder = $('#collectionviews').sortable('serialize');
var collectionid = $('#collectionpages').data('collectionid');
$.post(config.wwwroot + "collection/views.json.php", {
sesskey: config.sesskey,
id: collectionid,
direction: sortorder }
)
.done(function(data) {
// update the page with the new table
if (data.returnCode == '0') {
$('#collectionviews').replaceWith(data.message.html);
if (viewid) {
$('#addviews_view_' + viewid + '_container').remove();
// check if we have just removed the last option leaving
// only the add pages button
if ($('#addviews .checkbox').children().length <= 1) {
// Remove addview button
$('#addviews').remove();
// Disply no page to add message
// And hide bulk select pages buttons
$('.select-pages').addClass('hidden');
$('#nopagetoadd').removeClass('hidden');
}
}
if (data.message.message) {
var warningClass = data.message.messagestatus === 'ok' ? 'success' : 'warning';
var warnmessage = $('<div id="changestatusline" class="alert alert-dismissible alert-' + warningClass + '" role="alert"><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button><p>' + data.message.message + '</p></div>');
$('#messages').empty().append(warnmessage);
}
wiresortables();
wireaddrow();
}
});
};
var wiresortables = function() {
$('#collectionviews').sortable({
items: '> li',
appendTo: document.body,
cursor: 'move',
helper: fixhelper,
opacity: 0.8,
placeholder: 'highlight',
stop: function(e, ui) {
// Get label within the div using children
// This is for receiving item from all pages list
var labelfor = ui.item.children().attr('for');
if (typeof labelfor !== 'undefined' && labelfor !== false) {
// remove all but the digits
var viewid = ui.item.children().attr('for').replace(/[^\d.]/g,'');
ui.item.replaceWith('<li id="row_' + viewid + '" class="dropped-in-row">' + ui.item.html() + '</li>');
updaterows(viewid);
}
else {
updaterows(false);
}
}
})
.disableSelection()
.hover(function() {
$(this).css('cursor', 'move');
});
};
var wireaddrow = function() {
$('#addviews div').draggable({
connectToSortable: '#collectionviews',
cursor: 'move',
revert: 'invalid',
helper: 'clone',
}).hover(function() {
$(this).css('cursor', 'move');
});
};
var wiredrop = function() {
$('#collectionpages .dropzone-previews').droppable({
accept: 'div',
activeClass: 'highlight',
drop: function (e, ui) {
var labelfor = ui.draggable.children().attr('for');
if (typeof labelfor !== 'undefined' && labelfor !== false) {
// remove all but the digits
var viewid = ui.draggable.children().attr('for').replace(/[^\d.]/g,'');
$('#collectionpages .dropzone-previews').replaceWith('<ol id="collectionviews"><li id="row_' + viewid + '">' + ui.draggable.html() + '</li></ol>');
wiresortables();
updaterows(viewid);
}
},
});
};
var wireselectall = function() {
$("#selectall").click(function(e) {
e.preventDefault();
$("#addviews :checkbox").prop("checked", true);
});
};
var wireselectnone = function() {
$("#selectnone").click(function(e) {
e.preventDefault();
$("#addviews :checkbox").prop("checked", false);
});
};
// init
if ($('#collectionviews > li').length > 0) {
wireaddrow();
wiresortables();
}
else {
wireaddrow();
wiredrop();
}
wireselectall();
wireselectnone();
});
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -84,3 +84,31 @@
}
}
}
// Custom styles for edit collection pages
// See views.tpl and views.json.tpl
.manage-collection-pages {
.pagelist {
.select-pages {
margin: -10px 0 0 0;
padding-top: 8px;
}
.add-pages {
margin: 5px;
}
}
.collection-pages {
.list-group {
.highlight {
padding: 20px;
}
}
.single-arrow-up {
padding-right: 32px;
}
.single-arrow-down {
padding-left: 38px;
}
}
}
.dropzone-previews {
border-radius: 4px;
clear: both;
......@@ -18,7 +17,7 @@
font-size: $font-size-large;
color: $gray-light;
}
@media (min-width: $screen-sm-min) {
clear: none;
float: right;
......@@ -29,17 +28,21 @@
}
}
.block-placeholder,
.highlight {
@extend .dropzone-previews;
border-radius: 4px;
width: 100%;
padding: 20px;
margin-bottom: 20px;
background-color: $panel-warning-heading-bg;
border: 2px dashed darken( $panel-warning-border, 10%);
}
// Extending dropzone-previews for adding artefact to a page
.block-placeholder {
@extend .dropzone-previews;
padding: 20px;
margin-bottom: 20px;
}
.highlight {
margin:0;
}
\ No newline at end of file
margin: 0;
}
.drag-default-button {
@extend .btn-default; // Button like styling for drag element
background-color: #ffffff;
border-color: $list-group-border;
border-left: none; // Don't need side borders because the elements are inside panel
border-right: none;
}
.btn-draggable .btn-group-vertical > .btn {
@extend .icon;
padding: $padding-base-vertical $padding-base-horizontal $padding-base-vertical $grid-gutter-width;
padding: 10px 12px 10px 35px;
text-align: left;
&:before {
box-sizing: border-box;
color: rgba(#777, 0.7);
color: #777;
opacity: 0.7;
content: "\f047";
display: block;
height: 100%;
left: 0px;
line-height: 1.3em;
padding: 8px 5px 5px;
padding: 10px 15px 5px;
position: absolute;
top: 0px;
width: 22px;
}
&.checkbox {
margin-top: -1px;
}
.checkbox {
right: 10px;
top: 6px;
top: 10px;
}
}
.draggable {
......@@ -35,14 +42,14 @@
z-index: 0;
position: relative;
}
// This is a different case where we can use the icon itself
.icon-drag:before{
.icon-drag:before {
display: block;
float: left;
margin-right: 10px;
height: 100%;
color: rgba(#555, 0.4);
}
.icon-drag-current {
......@@ -80,3 +87,7 @@
.ui-sortable-helper {
overflow: hidden;
}
.ui-sortable {
list-style-type: none;
}
This source diff could not be displayed because it is too large. You can view the blob instead.
<ol class="list-group" id="collectionviews">
{foreach from=$views.views item=view}
<li class="list-group-item" id="row_{$view->view}">
<li class="list-group-item" id="row_{$view->view}">
{if $views.count > 1}
{if $view->displayorder == $views.min}
<a href="{$displayurl}&amp;view={$view->view}&amp;direction=down">
<span class="icon icon-long-arrow-down prs"></span>
<a class="btn btn-xs text-default single-arrow-down" href="{$displayurl}&amp;view={$view->view}&amp;direction=down">
<span class="icon icon-lg icon-long-arrow-down prs"></span>
<span class="sr-only">{str tag=moveitemdown}</span>
</a>
{elseif $view->displayorder == $views.max}
<a href="{$displayurl}&amp;view={$view->view}&amp;direction=up">
<span class="icon icon-long-arrow-up prs"></span>
<a class="btn btn-xs text-default single-arrow-up" href="{$displayurl}&amp;view={$view->view}&amp;direction=up">
<span class="icon icon-lg icon-long-arrow-up prs"></span>
<span class="sr-only">{str tag=moveitemup}</span>
</a>
{else}
<a href="{$displayurl}&amp;view={$view->view}&amp;direction=up">
<span class="icon icon-long-arrow-up prs"></span>
<a class="btn btn-xs text-default" href="{$displayurl}&amp;view={$view->view}&amp;direction=up">
<span class="icon icon-lg icon-long-arrow-up prs"></span>
<span class="sr-only">{str tag=moveitemup}</span>
</a>
<a href="{$displayurl}&amp;view={$view->view}&amp;direction=down">
<span class="icon icon-long-arrow-down "></span>
<a class="btn btn-xs text-default" href="{$displayurl}&amp;view={$view->view}&amp;direction=down">
<span class="icon icon-lg icon-long-arrow-down "></span>
<span class="sr-only">{str tag=moveitemdown}</span>
</a>
{/if}
{/if}
{/if}
<strong>
<a href="{$view->fullurl}" class="text-link">
......@@ -33,5 +31,4 @@
{$view->remove|safe}
</li>
{/foreach}
</ol>
......@@ -3,30 +3,29 @@
{if $GROUP}
<h2>{$PAGESUBHEADING}{if $SUBPAGEHELPNAME}<span class="page-help-icon">{$PAGEHELPICON|safe}</span>{/if}</h2>
{/if}
<div class="row" id="collectionpages">
<div class="row manage-collection-pages" id="collectionpages" data-collectionid="{$id}">
<div class="col-md-12">
<p class="lead">{str tag=collectiondragupdate1 section=collection}</p>
<fieldset class="panel panel-default panel-half first draggable" id="pagestoadd">
<fieldset class="panel panel-default panel-half first pagelist draggable " id="pagestoadd">
<h3 class="panel-heading">
{str tag=addviewstocollection section=collection}
{if $viewsform}
<span class="btn-group select-pages" role="group">
<a class="btn btn-xs btn-default" href="" id="selectall">{str tag=All}</a>
<a class="btn btn-xs btn-default" href="" id="selectnone">{str tag=none}</a>
</span>
{/if}
</h3>
<div class="panel-body">
<div class="pagesavailable">
{if $viewsform}
<div class="pull-right">
<a href="" id="selectall">{str tag=All}</a>&nbsp;&nbsp;
<a href="" id="selectnone">{str tag=none}</a>
</div>
{$viewsform|safe}
{else}
<div class="lead text-small">{str tag=noviewsavailable section=collection}</div>
{$viewsform|safe}
{/if}
<div id="nopagetoadd"class="no-results lead text-small {if $viewsform} hidden{/if}">
{str tag=noviewsavailable section=collection}
</div>
</div>
</fieldset>
<fieldset class="panel panel-default panel-half droppable" id="pagesadded">
<fieldset class="panel panel-default panel-half collection-pages droppable" id="pagesadded">
<h3 class="panel-heading">{str tag=viewsincollection section=collection}</h3>
{if !$views}
<div class="message dropzone-previews full-width">
......@@ -40,24 +39,23 @@
<li class="list-group-item" id="row_{$view->view}">
{if $views.count > 1}
{if $view->displayorder == $views.min}
<a href="{$displayurl}&amp;view={$view->view}&amp;direction=down">
<span class="icon icon-long-arrow-down prs"></span>
<a class="btn btn-xs text-default single-arrow-down" href="{$displayurl}&amp;view={$view->view}&amp;direction=down">
<span class="icon icon-lg icon-long-arrow-down prs"