Commit 040a3ad7 authored by Caleb Weeks's avatar Caleb Weeks

lots of new features to support documentation, resized frame panels, and fixing annotations

parent 92a7767a
{{#each annotations}}
{{#each annotations}}
<div class="row annotations-widget z-depth-2">
<div class="col s12" style="background-color:{{color}};">
<table class="highlight" style="background-color: #fafafa;">
{{#each entries}}
{{#ifop author "&&" message}}
<tr>
<th style="width: 1%; white-space: nowrap">{{author}}</th>
<td style="white-space:normal;padding: 15px 5px;color:black;">{{message}}</td>
</tr>
{{/ifop}}
{{/each}}
</table>
</div>
</div>
{{/each}}
{{else}}
<div class="row">
<ul class="collection"><li class="collection-item">No annotations found. Switch to Preview mode to add annotations.</li></ul>
</div>
{{/each}}
\ No newline at end of file
......@@ -9,27 +9,34 @@ module.exports.process=function(data,$,cb){
if(req.method === "GET"){
var pagePath = req.query.path;
var jsonData = req.originalUrl.indexOf('/annotations.js') > -1;
if(pagePath){
var slingPath = pagePath.indexOf('jcr:content') > -1 ? pagePath : pagePath + '/jcr:content';
$.sc.getSling(slingPath + '.infinity.json',{leaveMangledNames: true},function(err, slingData){
if(!err && slingData){
var aggregate = [];
module.exports.findBlAnnotations(slingData, slingPath, aggregate);
res.json(aggregate);
console.log('req.originalUrl', req.originalUrl);
if(jsonData){
res.json(aggregate);
cb(null, false);
}else{
data.annotations = aggregate;
cb();
}
}else{
res.status(500).send('Error getting pagePath data: ' + err);
cb(null, false);
}
});
}else{
res.status(500).send("pagePath is required for GET annotations");
cb(null, false);
}
}
cb(null, false);
return false;
};
//////////////////
......
......@@ -10,9 +10,6 @@
{{{mapping}}}
</div>
<div class="annotations-body" style="display:none;">
{{{annotations}}}
</div>
</form>
<script type="text/javascript">
......
......@@ -3,7 +3,6 @@ var _=require("lodash");
var util=require("util");
// var blMapRender=require("./bl-map-render");
var blMapRender=require("../../../widgets/mapping-widget/mapping-widget").renderDialogPage;
var annotationsRender=require("./annotations-render");
var sanitize = global.bl.sanitize;
......@@ -272,10 +271,9 @@ module.exports.process=function(data,$,cb){
var mapping=blMapRender(blMaps, slingData['sling:resourceType']);
var annotations = annotationsRender(slingData, slingPath);
var dialogContent = $.template({body:dialogBody, mapping, annotations, lock:inheritFrom?true:false, widgetConfigs:configs, dialogConfig: dialogConfig, title: dialogConfig.title, blMaps: blMaps});
var dialogContent = $.template({body:dialogBody, mapping, lock:inheritFrom?true:false, widgetConfigs:configs, dialogConfig: dialogConfig, title: dialogConfig.title, blMaps: blMaps});
res.send(dialogContent);
res.end();
}catch(err){
......
const _ = require('lodash');
const fs = require('fs');
module.exports.process=function(data, $, cb){
var sc=$.sc;
var res=$.express.res;
var mainPath = "/" + $.page.action;
//handle virtual paths
if(/\/-/.test(mainPath)){
mainPath = mainPath.substring(0, mainPath.indexOf('/-'));
}
let tagsMode = /^\/etc\/tags/.test(mainPath);
let mediaMode = /^\/content\/(dam|media)\//.test(mainPath);
let sendError = (errorMessage)=>{
res.end(errorMessage)
cb(null,false);
}
if(sc.mode === 'author'){
if(tagsMode || mediaMode){
sendError("Documentation not supported here.");
}else{
let pageMode = mainPath.indexOf('jcr:content') < 0;
let slingPath = (pageMode ? mainPath + "/jcr:content" : mainPath) + ".1.json";
sc.getSling(slingPath, {leaveMangledNames: true},function(err, slingData){
if(err){
sendError("No page found. Documentation not supported here.")
}else{
let rtype=slingData["sling:resourceType"];
if(!rtype){
sendError("No resource type found. Documentation not supported here.");
}else{
let comp =$.componentRegistry.get(rtype);
if(!comp){
sendError(`Invalid resource type found: ${rtype} Documentation not supported here.`);
}else{
//does this type have an md file
let documentationPath = comp.path + '/' + _.last(comp.path.split('/')) + '.md';
fs.access(documentationPath, (accessError)=>{
if(accessError){
sendError(`Component '${comp.title ? comp.title : ''} (${rtype})' has no documentation.`);
}else{
//read in the file
fs.readFile(documentationPath, 'utf-8', (err, mdFile)=>{
if(err){
sendError(`Component '${comp.title ? comp.title :''} (${rtype})' : Error reading documentation file.`);
}else{
var html=$.templates["doc-page"]({body : global.bl.marked(mdFile), blConfig:$.blConfig, includePreviewControls: pageMode, path : mainPath});
res.end(html);
cb(null,false);
}
});
}
});
}
}
}
});
}
}else{
res.status(404).send('Unavailable');
cb(null,false);
}
}
\ No newline at end of file
......@@ -28,6 +28,7 @@ module.exports.process=function(data, $, cb){
data.blConfig.modes={
view:viewButton,
edit:editButton,
documentation : {icon : "library_books", title: "Documentation", prefix: appsMount + "blacklight/edit/documentation/"},
list:{icon:"view_list", title:"Page list view", prefix: appsMount + "blacklight/edit/list/"},
multilingual:{icon:"language", title:"Languages", prefix: appsMount + "blacklight/edit/ml/"},
raw:{icon:"view_quilt", title:"Data view", postfix:".raw"},
......
......@@ -24,6 +24,7 @@
<li><a href="javascript:;" class="bl-activation btn-floating blue accent-2 tooltipped" data-position="left" data-tooltip="Activate Page"><i class="material-icons ">thumb_up</i></a></li>
<li><a href="javascript:;" class="bl-activation btn-floating blue accent-2 tooltipped" data-position="left" data-tooltip="Deactivate Page" data-deactivate="true"><i class="material-icons ">thumb_down</i></a></li>
<li><a href="javascript:;" class="bl-documentation btn-floating blue accent-2 tooltipped" data-position="left" data-tooltip="Documentation" data-deactivate="true"><i class="material-icons ">library_books</i></a></li>
<li><a href="javascript:;" class="bl-go-preview btn-floating blue accent-2 tooltipped" data-position="left" data-tooltip="Page Preview" data-deactivate="true"><i class="material-icons ">visibility</i></a></li>
</ul>
......
......@@ -16,6 +16,7 @@ document.addEventListener('DOMContentLoaded', function() {
window.BL.proxyPrefix="{{blConfig.slingProxyPrefix}}";
window.BL.isFoss=!!("{{isFoss}}");
window.BL.author="{{author}}";
window.BL.previewControlOptions = window.BL.previewControlOptions || {};
window.BL.blacklightPreviewControls = function() {
......@@ -31,10 +32,12 @@ document.addEventListener('DOMContentLoaded', function() {
var $img=hideBulb?$("<span></span>"):$(
"<div id='bl-preview-actions' class='bl-preview " + (showAnnotations ? "showing-annotations" : "") + "'><div>" +
"<a data-bl-tooltip='Edit Page' ><img id='bl-light-bulb' draggable='true' src='{{publicMount}}blacklight/edit/images/blacklight-bulb-white.svg'></a>" +
(!window.BL.previewControlOptions.editLinkOnly ? (
"<ul>" +
"<li class='show-annotations' data-bl-tooltip='Show Annotations'><a class='btn-floating blue'><i class='material-icons'>chat</i></a></li>" +
"<li data-bl-tooltip='Hide Annotations'><a class='hide-annotations btn-floating blue' ><i class='material-icons'>chat_bubble_outline</i></a></li>" +
"</ul>" +
"</ul>" ) : "" ) +
"</div></div>");
$("body").append($img);
......@@ -112,10 +115,10 @@ document.addEventListener('DOMContentLoaded', function() {
var isProxied = !("{{blConfig.slingProxyPrefix}}");
if(isProxied){
window.BL.utils.setCookie("wcmmode", "edit", 7);
window.location.assign(document.location.pathname + document.location.hash);
window.location.assign((window.BL.previewControlOptions.pagePath || document.location.pathname) + document.location.hash);
window.location.reload(true);
}else{
var editUrl=document.location.origin + "{{appsMount}}blacklight/edit/page" + document.location.pathname + document.location.hash;
var editUrl=document.location.origin + "{{appsMount}}blacklight/edit/page" +(window.BL.previewControlOptions.pagePath || document.location.pathname) + document.location.hash;
window.location.href=editUrl;
}
}
......
<!DOCTYPE html>
<html lang="en">
<head>
<title>Blacklight Documentation</title>
<title>{{first-of title "Blacklight Documentation"}}</title>
<link rel="stylesheet" href="{{@root.blConfig.publicMount}}blacklight/edit/js/vendor/highlight/agate.min.css">
<link rel="stylesheet" href="{{blConfig.publicMount}}blacklight/edit/css/doc.css"/>
{{#if includePreviewControls}}
<link type="text/css" rel="stylesheet" href="/alt/blacklight/edit/css/preview-controls.css">
{{/if}}
</head>
<body>
......@@ -25,8 +28,14 @@
</body>
<script src="{{@root.blConfig.publicMount}}blacklight/edit/js/vendor/jquery/jquery-2.1.1.min.js"></script>
<script src="{{@root.blConfig.publicMount}}fshr/shared/js/jquery-xss-protect.js"></script>
<script src="{{@root.blConfig.publicMount}}blacklight/edit/js/vendor/highlight/highlight.min.js"></script>
<script src="{{@root.blConfig.publicMount}}blacklight/edit/js/doc-markdown-client.js"></script>
{{#if includePreviewControls}}
<script>
window.BL = window.BL || {};
window.BL.previewControlOptions = {editLinkOnly : true, pagePath : "{{path}}" };
</script>
<script src="/alt/apps/blacklight/edit/preview-controls-js/main.js"></script>
{{/if}}
</html>
\ No newline at end of file
{{#each .}}
<div class="row annotations-widget z-depth-2">
<div class="col s12" style="background-color:{{color}};">
<table class="highlight" style="background-color: #fafafa;">
{{#each entries}}
{{#ifop author "&&" message}}
<tr>
<th style="width: 1%; white-space: nowrap">{{author}}</th>
<td style="white-space:normal;padding: 15px 5px;color:black;">{{message}}</td>
</tr>
{{/ifop}}
{{/each}}
</table>
</div>
</div>
{{else}}
<div class="row">
<ul class="collection"><li class="collection-item">No annotations found. Switch to Preview mode to add annotations.</li></ul>
</div>
{{/each}}
<style>
html { overflow: hidden;}
body { overflow: scroll;}
.ui-resizable-handle {
position: absolute;
font-size: 0.1px;
display: block;
}
.ui-resizable-e {
cursor: e-resize;
width: 7px;
right: 0px;
top: 0;
height: 100%;
}
</style>
<div class="fixed" style="background-color:#f0f0f0; font-szie:12px; width: 210px; top:54px; margin-top:1px; height:calc(100% - 55px)">
<div id="left-panel" class="fixed" style="background-color:#f0f0f0; width: 210px;font-size:12px;top:54px; margin-top:1px; height:calc(100% - 55px)">
<div id="nav-tree"></div>
</div>
<div class="mgmt-nav" style="background-color:#f0f0f0; margin-left:210px; height:38px; padding:8px; padding-left:12px;">
<div id="top-panel" class="mgmt-nav" style="background-color:#f0f0f0; margin-left:210px; height:38px; padding:8px; padding-left:12px;">
<a href="#" target="_blank" id="bl-new-window" class="btn right blue accent-2 tooltipped" style="margin-top:0px;margin-right:1em;" data-tooltip="Open in new window" data-position="top"><i class="material-icons dp32">screen_share</i></a>
<a id="bl-reload" class="btn right blue accent-2 tooltipped" style="margin-top:0px;margin-right:8px;" data-tooltip="Refresh view" data-position="top"><i class="material-icons dp32">refresh</i></a>
......
......@@ -83,8 +83,8 @@
<!-- Scripts-->
<script src="{{publicMount}}blacklight/edit/js/utils.js"></script>
<script src="{{publicMount}}blacklight/edit/js/vendor/jquery/jquery-2.1.1.min.js"></script>
<script src="{{publicMount}}fshr/shared/js/jquery-xss-protect.js"></script>
<script src="{{publicMount}}blacklight/edit/js/vendor/jquery/jquery.throttle.js"></script>
<script src="{{publicMount}}blacklight/edit/js/vendor/materialize.js"></script>
......
......@@ -8,7 +8,8 @@ body {
line-height: 18px;
color: #737373;
background-color: white;
margin: 10px 13px 10px 13px;
margin: 0;
padding: 30px 30px 0 30px;
}
table {
margin: 10px 0 15px 0;
......@@ -260,12 +261,6 @@ a.h-link{
* {
-webkit-print-color-adjust: exact;
}
@media screen and (min-width: 914px) {
body {
margin: 30px 34px;
max-width:900px;
}
}
@media print {
body,code,pre code,h1,h2,h3,h4,h5,h6 {
color: black;
......
......@@ -68,27 +68,38 @@ $(function(){
last=cur;
});
////////////////////////////////////////////////////////////////
var $pageToc = $(".page-toc");
var updateBodyWidth = function(){
$('body').css('max-width', $(window).width() - $pageToc.outerWidth() - 50); //to account for padding
$pageToc.css('left', $(window).width() - $pageToc.outerWidth() - 10);
$pageToc.css('max-height', $(window).height() - 84);
}
////////////////////////////////////////////////////////////////
$(".page-toc").each(function(){
function addChildren($parent, children){
var html, cur, $li;
var $ul=$("<ul>");
for(var i=0;i<children.length;i++){
cur=children[i];
$li=$("<li><a href='#" +cur.id + "'>" + cur.title + "</a></li>");
tocCount++;
if(cur.children.length){addChildren($li, cur.children);}
$ul.append($li);
}
$parent.append($ul);
function addChildren($parent, children){
var html, cur, $li;
var $ul=$("<ul>");
for(var i=0;i<children.length;i++){
cur=children[i];
$li=$("<li><a href='#" +cur.id + "'>" + cur.title + "</a></li>");
tocCount++;
if(cur.children.length){addChildren($li, cur.children);}
$ul.append($li);
}
$parent.append($ul);
}
var $pageToc=$(this);
addChildren($pageToc, toc);
if(tocCount<2){
$pageToc.css("display", "none");
}
});
addChildren($pageToc, toc);
if(tocCount<2){
$pageToc.css("display", "none");
}
//update the body max-width.
updateBodyWidth();
////////////////////////////////////////////////////////////////
$(window).on('resize', updateBodyWidth);
});
......@@ -27,7 +27,18 @@ window.BL.buildDialog = module.exports = function buildDialog(options){
}
if(options.url){
loadBody({url:options.url, title:options.title})
if(options.iframe){
$dialogBody.html(
$('<iframe>', {
src: options.url,
frameborder: 0,
height: '100%',
width: '100%'
})
);
}else{
loadBody({url:options.url, title:options.title})
}
}
/*********************************************************************************/
......
......@@ -84,6 +84,49 @@ module.exports=function($, window){
});
}
////////////////////////////////////////////////////////////////////////////
//resizing left panel stuff
var topPanel = $('#top-panel');
var leftPanel = $('#left-panel');
var dragOverlay;
var resizeFrameItems = function(){
topPanel.css('margin-left', leftPanel.width());
$iframe.css('margin-left', leftPanel.width())
$iframe.css('width', "calc(100vw - " + leftPanel.width() + "px)");
};
leftPanel.resizable({
handles: 'e',
minWidth: 210,
start: function(){
//cover the screen with an overlay. this is needed to prevent the
//mouse drag from being captured by the iframe. That leads to a
//really choppy drag experience.
dragOverlay = $('<div>', {css: {
position: 'fixed', top: 0, width: '100%', height: '100%'}
});
dragOverlay.appendTo($('body'));
},
stop: function(){
if(dragOverlay){ dragOverlay.remove(); }
},
resize: function(event, ui){
//need to resize the nav bar and iframe window
resizeFrameItems();
window.BL.utils.setCookie("bl-frame-size", leftPanel.width(), 365);
}
});
//is there a saved frame size?
var savedFrameSize = window.BL.utils.getCookie("bl-frame-size");
if(savedFrameSize){
leftPanel.css('width', savedFrameSize);
resizeFrameItems();
}
$('select').material_select();
var settingsButton = $("#page-actions a[data-action='settings']");
......
......@@ -108,6 +108,16 @@ module.exports=function($, window, page, editDialog){
}
});
};
/***************************************************************************************************/
pageInit[".bl-documentation"]=function($el){
$el.on("click", function(){
var match=window.document.location.href.match(/^(https?:\/\/[^\/]*)\/([^#]*\/blacklight\/edit\/page)?(.*)$/);
if(match){
window.location.href = match[1] + '/alt/apps/blacklight/edit/documentation' + (_.startsWith(match[3], '/') ? '' : '/') + match[3];
}
});
};
/***************************************************************************************************/
......@@ -255,6 +265,7 @@ module.exports=function($, window, page, editDialog){
<li>${isEccEntry?submenuArrow:""}<a class="paste-item" href="#"><i class="material-icons small">content_paste</i>Paste</a></li>
<li class="divider"></li>
<li><a class="add-annotation" href="#"><i class="material-icons small">chat_bubble_outline</i>Notes</a></li>
<li><a class="show-documentation" href="#"><i class="material-icons small">library_books</i>Docs</a></li>
<li><a class="get-info" href="#"><i class="material-icons small">info_outline</i>Inspect</a></li>
</ul>`
// <li class="divider"></li>
......@@ -307,6 +318,24 @@ module.exports=function($, window, page, editDialog){
ev.preventDefault();
});
$menu.find(".add-annotation").click(function(ev){
ev.preventDefault();
buildDialog({
noSave: true,
title: "Annotations",
url: window.BL.config.appsMount + "blacklight/edit/annotations.html?path=" + context.path
});
});
$menu.find(".show-documentation").click(function(ev){
ev.preventDefault();
buildDialog({
noSave: true,
title: "Component Documentation",
url: window.BL.config.appsMount + "blacklight/edit/documentation" + context.path,
iframe: true
});
});
$menu.find(".get-info").click(function(ev){
var $explainDialog = buildDialog({
......
......@@ -9,7 +9,7 @@ module.exports=function($, window, options){
var allowedLanguages = window.BL.config.allowedLanguages;
var langRegex;
window.BL.utils=utils;
//window.BL.utils=utils;
///////////////////////////////////////////////////////////////////////////////////////////
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment