Skip to content

Commit

Permalink
Various changes / improvements to linking and navigation in Bootstrap…
Browse files Browse the repository at this point in the history
… projects:

 - Deep linking to sections now possible via XOT Page Link button in ckeditor (Close #690)
 - Hash added to URL as you navigate through pages mean browser back/fwd buttons now work e.g. xertetoolkits/play_123#page1
 - New 'Page ID' optional property on pages allow you to customise the URLs for individual pages e.g. xertetoolkits/play_123#intro
 - Old format of deep linking using linkIDs has been fixed (this wasn't working properly) e.g. xertetoolkits/play_123?linkID=PG1580462371912 (Close #787)
 - New 'Hide Section Menu' optional property allows section list on left of page to be removed
 - New 'Stand-Alone Page' optional properties allow you to remove pages from page menu & open them only via XOT page links (#531)
   Additional options for stand-alone pages:
    + Open page in new window
    + Hide Header
    + Back button only instead of page menu
  • Loading branch information
FayCross authored and torinfo committed Mar 27, 2020
1 parent 26be3a0 commit 04de95e
Show file tree
Hide file tree
Showing 10 changed files with 599 additions and 313 deletions.
4 changes: 4 additions & 0 deletions editor/css/complex.css
Original file line number Diff line number Diff line change
Expand Up @@ -1153,6 +1153,10 @@ i.tooltipIcon {
margin-right: 5px;
color: #ff0000;
}
.standaloneIcon {
margin-right: 5px;
color: #333366;
}
.iconEnabled
{
display: inline-block;
Expand Down
38 changes: 32 additions & 6 deletions editor/js/toolbox.js
Original file line number Diff line number Diff line change
Expand Up @@ -157,8 +157,8 @@ var EDITOR = (function ($, parent) {
$menu.find(".insert_buttons").last().append(button);
});
}

if (typeof insert_menu_object !== 'undefined')
if (typeof insert_menu_object !== 'undefined')
{
// menu is aleready set once
insert_menu_object.menu("destroy");
Expand Down Expand Up @@ -253,13 +253,20 @@ var EDITOR = (function ($, parent) {
else {
return '<i class="hiddenIcon iconDisabled fa fa-eye-slash " id="' + key + '_hidden" title ="' + language.hidePage.$tooltip + '"></i>';
}
case "advanced":
case "advanced":
if (enabled) {
return '<i class="advancedIcon iconEnabled fa fa-exclamation-circle " id="' + key + '_advanced" title ="' + language.advancedPage.$tooltip + '"></i>';
}
else {
return '<i class="advancedIcon iconDisabled fa fa-exclamation-circle " id="' + key + '_advanced" title ="' + language.advancedPage.$tooltip + '"></i>';
}
case "standalone":
if (enabled) {
return '<i class="standaloneIcon iconEnabled fa fa-external-link " id="' + key + '_standalone" title ="' + language.standalonePage.$tooltip + '"></i>'; // ** lang
}
else {
return '<i class="standaloneIcon iconDisabled fa fa-external-link " id="' + key + '_standalone" title ="' + language.standalonePage.$tooltip + '"></i>'; // ** lang
}
}
},

Expand All @@ -269,6 +276,7 @@ var EDITOR = (function ($, parent) {

var deprecatedState = ($("#"+key+"_deprecated.iconEnabled").length > 0);
var hiddenState = ($("#"+key+"_hidden.iconEnabled").length > 0);
var standaloneState = ($("#"+key+"_standalone.iconEnabled").length > 0);
var unmarkState = ($("#"+key+"_unmark.iconEnabled").length > 0);
var change = false;
var tooltip = "";
Expand All @@ -281,6 +289,10 @@ var EDITOR = (function ($, parent) {
case "hidden":
if (hiddenState != enabled)
change = true;
break;
case "standalone":
if (standaloneState != enabled)
change = true;
break;
case "unmark":
if (unmarkState != enabled)
Expand All @@ -300,6 +312,7 @@ var EDITOR = (function ($, parent) {
}
var deprecatedIcon = getExtraTreeIcon(key, "deprecated", (item == "deprecated" ? enabled : deprecatedState), tooltip);
var hiddenIcon = getExtraTreeIcon(key, "hidden", (item == "hidden" ? enabled : hiddenState));
var standaloneIcon = getExtraTreeIcon(key, "standalone", (item == "standalone" ? enabled : standaloneState));
var unmarkIcon = getExtraTreeIcon(key, "unmark", (item == "unmark" ? enabled : unmarkState));
var nodetext;
if (item == "text")
Expand All @@ -309,7 +322,7 @@ var EDITOR = (function ($, parent) {
else {
nodetext = $("#" + key + '_text').text();
}
nodetext = '<span id="' + key + '_container">' + unmarkIcon + hiddenIcon + deprecatedIcon + '</span><span id="' + key + '_text">' + nodetext + '</span>';
nodetext = '<span id="' + key + '_container">' + unmarkIcon + hiddenIcon + standaloneIcon + deprecatedIcon + '</span><span id="' + key + '_text">' + nodetext + '</span>';
tree.rename_node(node, nodetext);
//tree.set_text(node, nodetext);
//tree.refresh();
Expand Down Expand Up @@ -395,10 +408,11 @@ var EDITOR = (function ($, parent) {

var deprecatedIcon = getExtraTreeIcon(key, "deprecated", wizard_data[xmlData[0].nodeName].menu_options.deprecated, wizard_data[xmlData[0].nodeName].menu_options.deprecated);
var hiddenIcon = getExtraTreeIcon(key, "hidden", xmlData[0].getAttribute("hidePage") == "true");
var standaloneIcon = getExtraTreeIcon(key, "standalone", xmlData[0].getAttribute("linkPage") == "true");
var unmarkIcon = getExtraTreeIcon(key, "unmark", xmlData[0].getAttribute("unmarkForCompletion") == "true" && parent_id == 'treeroot');
var advancedIcon = getExtraTreeIcon(key, "advanced", simple_mode && parent_id == 'treeroot' && template_sub_pages.indexOf(lo_data[key].attributes.nodeName) == -1);
var advancedIcon = getExtraTreeIcon(key, "advanced", simple_mode && parent_id == 'treeroot' && template_sub_pages.indexOf(lo_data[key].attributes.nodeName) == -1);

treeLabel = '<span id="' + key + '_container">' + unmarkIcon + hiddenIcon + deprecatedIcon + advancedIcon + '</span><span id="' + key + '_text">' + treeLabel + '</span>';
treeLabel = '<span id="' + key + '_container">' + unmarkIcon + hiddenIcon + standaloneIcon + deprecatedIcon + advancedIcon + '</span><span id="' + key + '_text">' + treeLabel + '</span>';

var this_json = {
id : key,
Expand Down Expand Up @@ -750,6 +764,9 @@ var EDITOR = (function ($, parent) {
// hiddenIcon.switchClass('iconEnabled', 'iconDisabled');
//}
}
if (toDelete[i] == "linkPage") {
changeNodeStatus(key, "standalone", false);
}
if (toDelete[i] == "unmarkForCompletion"){
changeNodeStatus(key, "unmark", false);
//var unmarkIcon = $("#" + key + "_unmark");
Expand Down Expand Up @@ -789,6 +806,11 @@ var EDITOR = (function ($, parent) {
{
// Place attribute
lo_data[key]['attributes'][name] = defaultvalue;

// unlike hidePage, linkPage is initially set to true so tree icon should show immediately
if (name == "linkPage") {
changeNodeStatus(key, "standalone", defaultvalue == "true");
}

// Enable the optional parameter button
$('#insert_opt_' + name)
Expand Down Expand Up @@ -1807,6 +1829,10 @@ var EDITOR = (function ($, parent) {
}
*/
}

if (names[0] == "linkPage") {
changeNodeStatus(key, "standalone", values[0] == "true");
}

if (names[0] == "unmarkForCompletion") {
changeNodeStatus(key, "unmark", values[0] == "true");
Expand Down
18 changes: 10 additions & 8 deletions editor/js/tree.js
Original file line number Diff line number Diff line change
Expand Up @@ -84,8 +84,8 @@ var EDITOR = (function ($, parent) {
delete_page = function() {
deleteSelectedNodes();
},

toggle_advanced = function()
toggle_advanced = function()
{
// Do toggle advanced mode
advanced_mode = !advanced_mode;
Expand Down Expand Up @@ -115,7 +115,7 @@ var EDITOR = (function ($, parent) {
duplicateSelectedNodes();
},

create_tree_buttons = function() {
create_tree_buttons = function() {
var buttons = $('<div />').attr('id', 'top_buttons');
if (templateframework == "xerte") {
var button_def =
Expand Down Expand Up @@ -497,13 +497,14 @@ var EDITOR = (function ($, parent) {
// Create node text based on xml, do not use text of original node, as this is not correct
var deprecatedIcon = toolbox.getExtraTreeIcon(key, "deprecated", wizard_data[lo_data[key].attributes.nodeName].menu_options.deprecated, wizard_data[lo_data[key].attributes.nodeName].menu_options.deprecated);
var hiddenIcon = toolbox.getExtraTreeIcon(key, "hidden", lo_data[key].attributes.hidePage == "true");
var standaloneIcon = toolbox.getExtraTreeIcon(key, "standalone", lo_data[key].attributes.linkPage == "true");
var unmarkIcon = toolbox.getExtraTreeIcon(key, "unmark", lo_data[key].attributes.unmarkForCompletion == "true" && parent_id == 'treeroot');
var advancedIcon = toolbox.getExtraTreeIcon(key, "advanced", simple_mode && parent_id == 'treeroot' && template_sub_pages.indexOf(lo_data[key].attributes.nodeName) == -1);
// Be carefull. You cannot just find $("#" + current_node.id + "_text").html(), becuase if the node is collapsed this will return undefined!
var advancedIcon = toolbox.getExtraTreeIcon(key, "advanced", simple_mode && parent_id == 'treeroot' && template_sub_pages.indexOf(lo_data[key].attributes.nodeName) == -1);
// Be careful. You cannot just find $("#" + current_node.id + "_text").html(), because if the node is collapsed this will return undefined!
// var nodeText = $("#" + current_node.id + "_text").html();
var nodeText = $("<div>").html(current_node.text).find("#" + current_node.id + "_text").html();

var treeLabel = '<span id="' + key + '_container">' + unmarkIcon + hiddenIcon + deprecatedIcon + advancedIcon + '</span><span id="' + key + '_text">' + nodeText + '</span>';
var treeLabel = '<span id="' + key + '_container">' + unmarkIcon + hiddenIcon + standaloneIcon + deprecatedIcon + advancedIcon + '</span><span id="' + key + '_text">' + nodeText + '</span>';
// Create the tree node
var this_json = {
id : key,
Expand Down Expand Up @@ -1256,10 +1257,11 @@ var EDITOR = (function ($, parent) {
// Add icons to the node, all should be switched off
// Create node text based on xml, do not use text of original node, as this is not correct
var hiddenIcon = toolbox.getExtraTreeIcon(lkey, "hidden", false);
var standaloneIcon = toolbox.getExtraTreeIcon(lkey, "standalone", false);
var unmarkIcon = toolbox.getExtraTreeIcon(lkey, "unmark", false);
var advancedIcon = toolbox.getExtraTreeIcon(lkey, "advanced", simple_mode && template_sub_pages.indexOf(nodeName) == -1);
var advancedIcon = toolbox.getExtraTreeIcon(lkey, "advanced", simple_mode && template_sub_pages.indexOf(nodeName) == -1);

var treeLabel = '<span id="' + lkey + '_container">' + unmarkIcon + hiddenIcon + advancedIcon + '</span><span id="' + lkey + '_text">' + treeLabel + '</span>';
var treeLabel = '<span id="' + lkey + '_container">' + unmarkIcon + hiddenIcon + standaloneIcon + advancedIcon + '</span><span id="' + lkey + '_text">' + treeLabel + '</span>';
var this_json = {
id : lkey,
text : treeLabel,
Expand Down
1 change: 1 addition & 0 deletions languages/wizard_en-GB.xml
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,7 @@
<compPreview tooltip="Preview" error="Preview unavailable"/>
<calendar tooltip="Select Date"/>
<hidePage title="HIDDEN" tooltip="This page is hidden"/>
<standalonePage tooltip="This is a stand-alone page"/>
<unmarkForCompletion tooltip="This page is not required for completion"/>
<advancedPage title="Advanced" tooltip="This page is not part of this (sub-)template and can only be added in advanced mode."/>
<filemenu title="File">
Expand Down
8 changes: 8 additions & 0 deletions modules/site/parent_templates/site/common/css/custom.css
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,10 @@ color: #6FD9D9;
position: static;
}

.navbar .nav .backBtn a {
cursor: pointer;
}

/* --TABLE OF CONTENTS-------------------------------------------------------------- */
.bs-docs-sidenav {
width: 228px;
Expand Down Expand Up @@ -494,6 +498,10 @@ a.glossary:link, a.glossary:visited, a.glossary:hover, a.glossary:active {
padding-right: 0.3em;
}

.backBtn .fa {
padding-right: 0.3em;
}

table {
text-align: left;
border-collapse: collapse;
Expand Down
Loading

0 comments on commit 04de95e

Please sign in to comment.