Skip to content

Commit

Permalink
SAK-30322: add arrows, last updated date, better delete message (saka…
Browse files Browse the repository at this point in the history
  • Loading branch information
nicholaswilson100 authored and ottenhoff committed Apr 18, 2016
1 parent b8671c7 commit 08c426b
Show file tree
Hide file tree
Showing 6 changed files with 92 additions and 28 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -350,9 +350,9 @@ protected void handleViewRequest(HttpServletRequest req, HttpServletResponse res
ServerConfigurationService.getString("official.institution.background.colour") +"; \">" +
"<div class=\"banner\"><h1 style=\" margin-left:15px; color:" + ServerConfigurationService.getString("official.institution.text.colour") + ";\">" +
Validator.escapeHtml(title) + "</h1></div> " +
(!isPrintView ? "<div class=\"bannerLinks\">" +
"<a class=\"export\" href=" + exportUrlAll + ">Export</a>" + "<a class=\"print\" target=\"_blank\" href=" + req.getRequestURL() + "?printView" + ">Print</a>" +
"<div class=\"lastUpdated\">Last updated: " + displayDate + "</div>" + "</div>" : "") + "</div>");
"<div class=\"bannerLinks\">" +
(!isPrintView ? "<a class=\"export\" href=" + exportUrlAll + ">Export</a>" + "<a class=\"print\" target=\"_blank\" href=" + req.getRequestURL() + "?printView" + ">Print</a>" : "") +
"<div class=\"lastUpdated\">Last updated: " + displayDate + "</div>" + "</div>" + "</div>");
out.println("<div style=\"clear:both;\"></div>");
if( introduction != null && !introduction.trim().equals("") )
{
Expand Down Expand Up @@ -677,31 +677,46 @@ private void displayNestedSections(String title, String citationCollectionId, or
for (CitationCollectionOrder h2Section : nestedSection.getChildren()) {
editorDivId = "sectionInlineEditor" + h2Section.getLocation();
linkId = "link" + h2Section.getLocation();
linkClick = "linkClick" + h2Section.getLocation();
toggleImgDiv = "toggleImgDiv" + h2Section.getLocation();
toggleImg = "toggleImg" + h2Section.getLocation();
addSubsectionId = "addSubsection" + h2Section.getLocation();


if (h2Section.getSectiontype().toString().equals("HEADING2")){

out.println("<li id = '" + linkId + "' class='h2Section' data-location='" + h2Section.getLocation() + "' data-sectiontype='" +
out.println("<li id = '" + linkId + "' class='h2Section " +
(h2Section.getChildren().size() > 0 ? " hasSections" : "") + "' data-location='"
+ h2Section.getLocation() + "' data-sectiontype='" +
h2Section.getSectiontype() + "' style='background: #cef none repeat scroll 0 0;'>" +
"<div id='" + linkClick +"' style='width:100%;'><div id='" + toggleImgDiv + "'>" +
(h2Section.getChildren().size() > 0 ? "<img border='0' width='16' height='16' align='top' alt='Citation View' " +
"src='/library/image/sakai/collapse.gif' class='toggleIcon accordionArrow' id='" + toggleImg + "'>" : "") + "</div>" +
"<div id = '" + editorDivId + "' class='editor h2Editor' style='min-height:30px; padding:5px;'>" +
(h2Section.getValue()!=null ? h2Section.getValue() : "") + "</div>");
(h2Section.getValue()!=null ? h2Section.getValue() : "") + "</div></div>");

// h3 sections
if (h2Section.getChildren().size() > 0) {
out.println("<ol id='" + addSubsectionId + "' class='h3NestedLevel' style='padding-top:0px;'>");
for (CitationCollectionOrder h3Section : h2Section.getChildren()) {
editorDivId = "sectionInlineEditor" + h3Section.getLocation();
linkId = "link" + h3Section.getLocation();
linkClick = "linkClick" + h3Section.getLocation();
toggleImgDiv = "toggleImgDiv" + h3Section.getLocation();
toggleImg = "toggleImg" + h3Section.getLocation();
addSubsectionId = "addSubsection" + h3Section.getLocation();

if (h3Section.getSectiontype().toString().equals("HEADING3")){

out.println("<li id = '" + linkId + "' class='h3Section' data-location='" + h3Section.getLocation() + "' data-sectiontype='" +
out.println("<li id = '" + linkId + "' class='h3Section " +
(h3Section.getChildren().size() > 0 ? " hasSections" : "") + " ' data-location='" + h3Section.getLocation() + "' data-sectiontype='" +
h3Section.getSectiontype() + "'>" +
"<div id='" + linkClick +"' style='width:100%;'><div id='" + toggleImgDiv + "'>" +
(h3Section.getChildren().size() > 0 ? "<img border='0' width='16' height='16' align='top' alt='Citation View' " +
"src='/library/image/sakai/collapse.gif' class='toggleIcon accordionArrow' id='" + toggleImg + "'>" : "") + "</div>" +
"<div style='' id = '" + editorDivId + "' class='editor h3Editor' " +
"style='padding-left:20px; '>" +
"<div style=''>" + (h3Section.getValue()!=null ? h3Section.getValue() : "") + "</div></div>");
"<div style=''>" + (h3Section.getValue()!=null ? h3Section.getValue() : "") + "</div></div></div>");

// nested citations
if (h3Section.getChildren().size() > 0) {
Expand Down
6 changes: 3 additions & 3 deletions citations/citations-tool/tool/src/webapp/css/citations.css
Original file line number Diff line number Diff line change
Expand Up @@ -174,10 +174,10 @@ ol.vertical li.placeholder::before {
background-color: #002147; color:#FFF; padding: 5px; min-height:30px;
}
.h2Editor {
background: #cef none repeat scroll 0 0; color:#000; padding: 5px; min-height:20px;
color:#000; padding: 5px; min-height:20px;
}
.h3Editor {
background: #FFF none repeat scroll 0 0; color:#000;padding:5px; min-height:16px;
color:#000;padding:5px; min-height:16px;
}
.citationNo {
color:#fff;
Expand Down Expand Up @@ -251,7 +251,7 @@ a.print {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
ol.serialization li.hasSections:hover{
ol.serialization li.hasSections div.h1TopBar:hover, ol.serialization li.hasSections.accordionH1:hover {
cursor: pointer;
background: #2a4667 none repeat scroll 0 0;
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -444,10 +444,16 @@
}

function removeSection() {
var confirmMessage = $('#deleteButtonConfirmText').val();
var section = $(this).parent().parent();
var confirmMessage;
if (section != null && section.data('sectiontype')=='DESCRIPTION'){
confirmMessage = $('#deleteButtonDescConfirmText').val();
}
else {
confirmMessage = $('#deleteButtonConfirmText').val();
}
if(confirm(confirmMessage)) {

var section = $(this).parent().parent();
var addButton;
if (section != null && section.data('sectiontype')=='DESCRIPTION'){
addButton = $(this).parent().parent().parent().prev();
Expand Down Expand Up @@ -597,8 +603,16 @@
});
}

$('.h2NestedLevel li[data-sectiontype="HEADING2"] > div[id^=sectionInlineEditor]').click(function() {
$(this).parent().find('ol').slideToggle();
$('.h2NestedLevel li[data-sectiontype="HEADING2"] > div > div[id^=sectionInlineEditor], .h3NestedLevel li[data-sectiontype="HEADING3"] > div > div[id^=sectionInlineEditor]').click(function() {
$(this).parent().parent().find('ol').slideToggle();

var image = $('#' + this.id.replace('linkClick', 'toggleImg').replace('sectionInlineEditor', 'toggleImg')).get(0);

if( image.src.indexOf("/library/image/sakai/expand.gif")!=-1 ) {
image.src = "/library/image/sakai/collapse.gif";
} else {
image.src = "/library/image/sakai/expand.gif";
}
});

// h3 level collapse expand
Expand All @@ -607,10 +621,6 @@
$(this).hide();
});
}

$('.h3NestedLevel li[data-sectiontype="HEADING3"] > div[id^=sectionInlineEditor]').click(function() {
$(this).parent().find('ol').slideToggle();
});
}


Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
$(this).hide();
});

// expand all on click
// expand all h1 on click
$('.h1NestedLevel li[data-sectiontype="HEADING1"] > div[id^=linkClick]').click(function() {
$(this).parent().find('ol').slideToggle();
var image = $('#' + this.id.replace('linkClick', 'toggleImg')).get(0);
Expand All @@ -19,6 +19,18 @@
image.src = "/library/image/sakai/white-arrow-right.gif";
}
});

// expand all h2 or h3 on click
$('.h2NestedLevel li[data-sectiontype="HEADING2"] > div[id^=linkClick], .h3NestedLevel li[data-sectiontype="HEADING3"] > div[id^=linkClick]').click(function() {
$(this).parent().find('ol').slideToggle();
var image = $('#' + this.id.replace('linkClick', 'toggleImg')).get(0);

if( image.src.indexOf("/library/image/sakai/collapse.gif")!=-1 ) {
image.src = "/library/image/sakai/expand.gif";
} else {
image.src = "/library/image/sakai/collapse.gif";
}
});
}
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
<input type="hidden" id="deleteSectionText" value="$tlang.getString("nested.delete.section.button")"/>
<input type="hidden" id="addSubsectionButtonText" value="$tlang.getString("nested.add.subsection.button")"/>
<input type="hidden" id="deleteButtonConfirmText" value="$tlang.getString("nested.delete.section.confirm")"/>
<input type="hidden" id="deleteButtonDescConfirmText" value="$tlang.getString("nested.delete.description.confirm")"/>

#if(!$resourceAdd)
<!-- Markup for Export/RIS -->
Expand Down Expand Up @@ -49,7 +50,6 @@
#set( $addH1SubsectionButtonId = 'addH1SubsectionButton' + $nestedSection.getLocation() )
#set( $buttonsDiv = 'buttonsDiv' + $nestedSection.getLocation() )
#set( $num = $num + 1)
<li id='$linkId' class='h1Editor' data-value='$nestedSection.getValue()' data-location='$nestedSection.getLocation()'
#if ($nestedSection.getChildren().size() > 0)
#set( $hasSectionsClass = ' hasSections')
#end
Expand Down Expand Up @@ -89,6 +89,9 @@
#set( $editorDivId = 'sectionInlineEditor' + $h2Section.getLocation() )
#set( $linkId = 'link' + $h2Section.getLocation() )
#set( $toogleId = 'toggle' + $h2Section.getLocation())
#set( $toggleImgDiv = 'toggleImgDiv' + $h2Section.getLocation())
#set( $toggleImg = 'toggleImg' + $h2Section.getLocation() )
#set( $linkClickId = 'linkClickId' + $h2Section.getLocation() )
#set( $removeDivId = 'removeSection' + $h2Section.getLocation() )
#set( $addSubsectionId = 'addSubsection' + $h2Section.getLocation() )
#set( $addH2SubsectionButtonId = 'addH2SubsectionButton' + $h2Section.getLocation() )
Expand All @@ -99,15 +102,25 @@
#set( $class = 'description' )
#set( $descriptionStyle = 'descriptionButtons' )
#end
#if ($h2Section.getChildren().size() > 0)
#set( $hasSectionsClass = ' hasSections')
#end


## if it's a h1 section or description
#if ($h2Section.getSectiontype()=='HEADING2' || $h2Section.getSectiontype()=='DESCRIPTION')

<li id='$linkId' class='h2Section $class' data-value='$h2Section.getValue()' data-location='$h2Section.getLocation()' data-sectiontype='$h2Section.getSectiontype()'>
<div id='$editorDivId' class='editor h2Editor sectionEditor $class' >
$!h2Section.getValue()
</div>
<li id='$linkId' class='h2Section $class $hasSectionsClass' data-value='$h2Section.getValue()' data-location='$h2Section.getLocation()' data-sectiontype='$h2Section.getSectiontype()'>
<div id="$linkClickId" class="h1TopBar">
#if ($h2Section.getChildren().size() > 0)
<div id="$toggleImgDiv">
<img border="0" width="16" height="16" align="top" id="$toggleImg" class="toggleIcon accordionArrow" style="padding: 0px;" src="/library/image/sakai/collapse.gif" alt="$tlang.getString("link.show.readonly")">
</div>
#end
<div id='$editorDivId' class='editor h2Editor sectionEditor $class' >
$!h2Section.getValue()
</div>
</div>
<div id="$buttonsDiv" class="sectionButtons $descriptionStyle" >
<input type="button" id="$toogleId" class="active" value='$tlang.getString("nested.start.editing.button")'/>
<input type="button" id="$removeDivId" class="active" value='$tlang.getString("nested.delete.section.button")'/>
Expand All @@ -130,6 +143,9 @@
#set( $editorDivId = 'sectionInlineEditor' + $h3Section.getLocation() )
#set( $linkId = 'link' + $h3Section.getLocation() )
#set( $toogleId = 'toggle' + $h3Section.getLocation())
#set( $toggleImgDiv = 'toggleImgDiv' + $h3Section.getLocation())
#set( $toggleImg = 'toggleImg' + $h3Section.getLocation() )
#set( $linkClickId = 'linkClickId' + $h3Section.getLocation() )
#set( $removeDivId = 'removeSection' + $h3Section.getLocation() )
#set( $addSubsectionId = 'addSubsection' + $h3Section.getLocation() )
#set( $buttonsDiv = 'buttonsDiv' + $h3Section.getLocation() )
Expand All @@ -140,16 +156,26 @@
#set( $class = 'description' )
#set( $descriptionStyle = 'descriptionButtons' )
#end
#if ($h3Section.getChildren().size() > 0)
#set( $hasSectionsClass = ' hasSections')
#end


## if it's a h3 section
#if ($h3Section.getSectiontype()=='HEADING3' || $h3Section.getSectiontype()=='DESCRIPTION')


<li id='$linkId' class='h3Section $class' data-value='$h3Section.getValue()' data-location='$h3Section.getLocation()' data-sectiontype='$h3Section.getSectiontype()'>
<div id='$editorDivId' class='editor h3Editor sectionEditor $class'>
$!h3Section.getValue()
</div>
<li id='$linkId' class='h3Section $class $hasSectionsClass' data-value='$h3Section.getValue()' data-location='$h3Section.getLocation()' data-sectiontype='$h3Section.getSectiontype()'>
<div id="$linkClickId" class="h1TopBar">
#if ($h2Section.getChildren().size() > 0)
<div id="$toggleImgDiv">
<img border="0" width="16" height="16" align="top" id="$toggleImg" class="toggleIcon accordionArrow" style="padding: 0px;" src="/library/image/sakai/collapse.gif" alt="$tlang.getString("link.show.readonly")">
</div>
#end
<div id='$editorDivId' class='editor h3Editor sectionEditor $class'>
$!h3Section.getValue()
</div>
</div>
<div id="$buttonsDiv" class="$descriptionStyle">
<input type="button" id="$toogleId" class="active" value='$tlang.getString("nested.start.editing.button")'/>
<input type="button" id="$removeDivId" class="active" value='$tlang.getString("nested.delete.section.button")'/>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -169,6 +169,7 @@ nested.section.description.text = Section Description
nested.add.subsection.button= Add Subsection
nested.section.title.text = <h1>Section Title</h1>
nested.delete.section.confirm=Are you sure you want to delete this section (and any subsections or citations it has)?
nested.delete.description.confirm=Are you sure you want to delete this description?

new.citations.list = New Citation List

Expand Down

0 comments on commit 08c426b

Please sign in to comment.