feature: document handlers
This commit is contained in:
Gary Sharp
@@ -0,0 +1,136 @@
|
||||
(function (window, document, $) {
|
||||
$(function () {
|
||||
let $generationHost = null;
|
||||
const $container = $('#Document_Generation_Container');
|
||||
const $control = $container.find('#Document_Generate');
|
||||
const targetId = $container.attr('data-targetid');
|
||||
const targetType = $container.attr('data-targettype');
|
||||
const generatePdfUrl = $container.attr('data-generatepdfurl');
|
||||
const generatePackageUrl = $container.attr('data-generatepackageurl');
|
||||
const handlersPresent = $container.attr('data-handlerspresent') === 'true';
|
||||
const handlersUrl = $container.attr('data-handlersurl');
|
||||
let $handlersDialog = null;
|
||||
|
||||
const downloadPdf = function (templateId) {
|
||||
|
||||
let url;
|
||||
if (templateId.lastIndexOf('Package:', 0) === 0)
|
||||
url = generatePackageUrl + templateId.substring(8);
|
||||
else
|
||||
url = generatePdfUrl + templateId;
|
||||
url = url + '?TargetId=' + targetId;
|
||||
|
||||
if ($.connection && $.connection.hub && $.connection.hub.transport &&
|
||||
$.connection.hub.transport.name == 'foreverFrame') {
|
||||
// SignalR active with foreverFrame transport - use popup window
|
||||
window.open(url, '_blank', 'height=150,width=250,location=no,menubar=no,resizable=no,scrollbars=no,status=no,toolbar=no');
|
||||
} else {
|
||||
// use iFrame
|
||||
if (!$generationHost) {
|
||||
$generationHost = $('<iframe>')
|
||||
.attr({ 'src': url, 'title': 'Document Generation Host' })
|
||||
.addClass('hidden')
|
||||
.appendTo('body')
|
||||
.contents();
|
||||
} else {
|
||||
$generationHost[0].location.href = url;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const updateHandlers = function (templateId) {
|
||||
const $handlerPicker = $handlersDialog.find('.handlerPicker');
|
||||
const $loadingUi = $handlersDialog.find('#Document_Generation_Dialog_Handlers_Loading');
|
||||
|
||||
$handlerPicker.find('div.handler').remove();
|
||||
$loadingUi.show();
|
||||
|
||||
var formData = new FormData();
|
||||
formData.append('templateId', decodeURI(templateId));
|
||||
formData.append('targetId', decodeURI(targetId));
|
||||
fetch(handlersUrl, {
|
||||
method: 'POST',
|
||||
body: formData
|
||||
}).then(r => r.json())
|
||||
.then(data => {
|
||||
$loadingUi.hide();
|
||||
$.each(data.Handlers, (i, h) => {
|
||||
$('<div class="handler">').text(h.Title).attr({
|
||||
'data-id': h.Id,
|
||||
'data-uiurl': h.UiUrl
|
||||
}).prepend($('<i class="fa fa-fw fa-lg">').addClass('fa-'+h.Icon)).appendTo($handlerPicker);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
$control.change(function () {
|
||||
var templateId = $control.val();
|
||||
if (templateId) {
|
||||
if (handlersPresent) {
|
||||
if (!$handlersDialog) {
|
||||
$handlersDialog = $container.find('#Document_Generation_Dialog');
|
||||
$handlersDialog.dialog({
|
||||
width: 750,
|
||||
height: 500,
|
||||
resizable: false,
|
||||
modal: true,
|
||||
autoOpen: false,
|
||||
buttons: {
|
||||
Cancel: function () {
|
||||
$(this).dialog("close");
|
||||
}
|
||||
}
|
||||
});
|
||||
$handlersDialog.find('#Document_Generation_Dialog_Download').click(e => {
|
||||
e.preventDefault();
|
||||
downloadPdf(templateId);
|
||||
$handlersDialog.dialog('close');
|
||||
return false;
|
||||
})
|
||||
const $handlerPicker = $handlersDialog.find('.handlerPicker');
|
||||
const $Document_Generation_Dialog_Download_Container = $handlersDialog.find('#Document_Generation_Dialog_Download_Container');
|
||||
const $Document_Generation_Dialog_HandlerUI = $handlersDialog.find('#Document_Generation_Dialog_HandlerUI');
|
||||
$handlerPicker.on('click', 'div[data-id]', e => {
|
||||
$handlerPicker.find('div').removeClass('selected');
|
||||
const $this = $(e.currentTarget);
|
||||
$this.addClass('selected');
|
||||
const handlerId = $this.attr('data-id');
|
||||
if (handlerId === 'download') {
|
||||
$Document_Generation_Dialog_Download_Container.show();
|
||||
$Document_Generation_Dialog_HandlerUI.hide();
|
||||
$Document_Generation_Dialog_HandlerUI.empty();
|
||||
} else {
|
||||
$Document_Generation_Dialog_Download_Container.hide();
|
||||
$Document_Generation_Dialog_HandlerUI.empty();
|
||||
$Document_Generation_Dialog_HandlerUI.show();
|
||||
const uiurl = $this.attr('data-uiurl');
|
||||
fetch(uiurl, { method: 'POST' })
|
||||
.then(r => r.text())
|
||||
.then(html => {
|
||||
$Document_Generation_Dialog_HandlerUI.html(html);
|
||||
})
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const $handlerPicker = $handlersDialog.find('.handlerPicker');
|
||||
const $Document_Generation_Dialog_Download_Container = $handlersDialog.find('#Document_Generation_Dialog_Download_Container');
|
||||
const $Document_Generation_Dialog_HandlerUI = $handlersDialog.find('#Document_Generation_Dialog_HandlerUI');
|
||||
$handlerPicker.find('div').removeClass('selected');
|
||||
$handlerPicker.find('div[data-id=download]').addClass('selected');
|
||||
$Document_Generation_Dialog_Download_Container.show();
|
||||
$Document_Generation_Dialog_HandlerUI.hide();
|
||||
$Document_Generation_Dialog_HandlerUI.empty();
|
||||
|
||||
$handlersDialog.dialog('option', 'title', 'Generate Document: ' + $control[0].selectedOptions[0].label);
|
||||
$handlersDialog.dialog('open');
|
||||
updateHandlers(templateId);
|
||||
} else {
|
||||
downloadPdf(templateId);
|
||||
}
|
||||
$control.val('').blur();
|
||||
}
|
||||
});
|
||||
|
||||
})
|
||||
})(window, document, $);
|
||||
@@ -0,0 +1 @@
|
||||
(function(n,t,i){i(function(){let f=null;const r=i("#Document_Generation_Container"),u=r.find("#Document_Generate"),e=r.attr("data-targetid"),v=r.attr("data-targettype"),s=r.attr("data-generatepdfurl"),h=r.attr("data-generatepackageurl"),c=r.attr("data-handlerspresent")==="true",l=r.attr("data-handlersurl");let t=null;const o=function(t){let r;r=t.lastIndexOf("Package:",0)===0?h+t.substring(8):s+t;r=r+"?TargetId="+e;i.connection&&i.connection.hub&&i.connection.hub.transport&&i.connection.hub.transport.name=="foreverFrame"?n.open(r,"_blank","height=150,width=250,location=no,menubar=no,resizable=no,scrollbars=no,status=no,toolbar=no"):f?f[0].location.href=r:f=i("<iframe>").attr({src:r,title:"Document Generation Host"}).addClass("hidden").appendTo("body").contents()},a=function(n){const u=t.find(".handlerPicker"),f=t.find("#Document_Generation_Dialog_Handlers_Loading");u.find("div.handler").remove();f.show();var r=new FormData;r.append("templateId",decodeURI(n));r.append("targetId",decodeURI(e));fetch(l,{method:"POST",body:r}).then(n=>n.json()).then(n=>{f.hide(),i.each(n.Handlers,(n,t)=>{i('<div class="handler">').text(t.Title).attr({"data-id":t.Id,"data-uiurl":t.UiUrl}).prepend(i('<i class="fa fa-fw fa-lg">').addClass("fa-"+t.Icon)).appendTo(u)})})};u.change(function(){var n=u.val();if(n){if(c){if(!t){t=r.find("#Document_Generation_Dialog");t.dialog({width:750,height:500,resizable:!1,modal:!0,autoOpen:!1,buttons:{Cancel:function(){i(this).dialog("close")}}});t.find("#Document_Generation_Dialog_Download").click(i=>(i.preventDefault(),o(n),t.dialog("close"),!1));const f=t.find(".handlerPicker"),e=t.find("#Document_Generation_Dialog_Download_Container"),u=t.find("#Document_Generation_Dialog_HandlerUI");f.on("click","div[data-id]",n=>{f.find("div").removeClass("selected");const t=i(n.currentTarget);t.addClass("selected");const r=t.attr("data-id");if(r==="download")e.show(),u.hide(),u.empty();else{e.hide();u.empty();u.show();const n=t.attr("data-uiurl");fetch(n,{method:"POST"}).then(n=>n.text()).then(n=>{u.html(n)})}})}const f=t.find(".handlerPicker"),s=t.find("#Document_Generation_Dialog_Download_Container"),e=t.find("#Document_Generation_Dialog_HandlerUI");f.find("div").removeClass("selected");f.find("div[data-id=download]").addClass("selected");s.show();e.hide();e.empty();t.dialog("option","title","Generate Document: "+u[0].selectedOptions[0].label);t.dialog("open");a(n)}else o(n);u.val("").blur()}})})})(window,document,$);
|
||||
+136
@@ -0,0 +1,136 @@
|
||||
(function (window, document, $) {
|
||||
$(function () {
|
||||
let $generationHost = null;
|
||||
const $container = $('#Document_Generation_Container');
|
||||
const $control = $container.find('#Document_Generate');
|
||||
const targetId = $container.attr('data-targetid');
|
||||
const targetType = $container.attr('data-targettype');
|
||||
const generatePdfUrl = $container.attr('data-generatepdfurl');
|
||||
const generatePackageUrl = $container.attr('data-generatepackageurl');
|
||||
const handlersPresent = $container.attr('data-handlerspresent') === 'true';
|
||||
const handlersUrl = $container.attr('data-handlersurl');
|
||||
let $handlersDialog = null;
|
||||
|
||||
const downloadPdf = function (templateId) {
|
||||
|
||||
let url;
|
||||
if (templateId.lastIndexOf('Package:', 0) === 0)
|
||||
url = generatePackageUrl + templateId.substring(8);
|
||||
else
|
||||
url = generatePdfUrl + templateId;
|
||||
url = url + '?TargetId=' + targetId;
|
||||
|
||||
if ($.connection && $.connection.hub && $.connection.hub.transport &&
|
||||
$.connection.hub.transport.name == 'foreverFrame') {
|
||||
// SignalR active with foreverFrame transport - use popup window
|
||||
window.open(url, '_blank', 'height=150,width=250,location=no,menubar=no,resizable=no,scrollbars=no,status=no,toolbar=no');
|
||||
} else {
|
||||
// use iFrame
|
||||
if (!$generationHost) {
|
||||
$generationHost = $('<iframe>')
|
||||
.attr({ 'src': url, 'title': 'Document Generation Host' })
|
||||
.addClass('hidden')
|
||||
.appendTo('body')
|
||||
.contents();
|
||||
} else {
|
||||
$generationHost[0].location.href = url;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const updateHandlers = function (templateId) {
|
||||
const $handlerPicker = $handlersDialog.find('.handlerPicker');
|
||||
const $loadingUi = $handlersDialog.find('#Document_Generation_Dialog_Handlers_Loading');
|
||||
|
||||
$handlerPicker.find('div.handler').remove();
|
||||
$loadingUi.show();
|
||||
|
||||
var formData = new FormData();
|
||||
formData.append('templateId', decodeURI(templateId));
|
||||
formData.append('targetId', decodeURI(targetId));
|
||||
fetch(handlersUrl, {
|
||||
method: 'POST',
|
||||
body: formData
|
||||
}).then(r => r.json())
|
||||
.then(data => {
|
||||
$loadingUi.hide();
|
||||
$.each(data.Handlers, (i, h) => {
|
||||
$('<div class="handler">').text(h.Title).attr({
|
||||
'data-id': h.Id,
|
||||
'data-uiurl': h.UiUrl
|
||||
}).prepend($('<i class="fa fa-fw fa-lg">').addClass('fa-'+h.Icon)).appendTo($handlerPicker);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
$control.change(function () {
|
||||
var templateId = $control.val();
|
||||
if (templateId) {
|
||||
if (handlersPresent) {
|
||||
if (!$handlersDialog) {
|
||||
$handlersDialog = $container.find('#Document_Generation_Dialog');
|
||||
$handlersDialog.dialog({
|
||||
width: 750,
|
||||
height: 500,
|
||||
resizable: false,
|
||||
modal: true,
|
||||
autoOpen: false,
|
||||
buttons: {
|
||||
Cancel: function () {
|
||||
$(this).dialog("close");
|
||||
}
|
||||
}
|
||||
});
|
||||
$handlersDialog.find('#Document_Generation_Dialog_Download').click(e => {
|
||||
e.preventDefault();
|
||||
downloadPdf(templateId);
|
||||
$handlersDialog.dialog('close');
|
||||
return false;
|
||||
})
|
||||
const $handlerPicker = $handlersDialog.find('.handlerPicker');
|
||||
const $Document_Generation_Dialog_Download_Container = $handlersDialog.find('#Document_Generation_Dialog_Download_Container');
|
||||
const $Document_Generation_Dialog_HandlerUI = $handlersDialog.find('#Document_Generation_Dialog_HandlerUI');
|
||||
$handlerPicker.on('click', 'div[data-id]', e => {
|
||||
$handlerPicker.find('div').removeClass('selected');
|
||||
const $this = $(e.currentTarget);
|
||||
$this.addClass('selected');
|
||||
const handlerId = $this.attr('data-id');
|
||||
if (handlerId === 'download') {
|
||||
$Document_Generation_Dialog_Download_Container.show();
|
||||
$Document_Generation_Dialog_HandlerUI.hide();
|
||||
$Document_Generation_Dialog_HandlerUI.empty();
|
||||
} else {
|
||||
$Document_Generation_Dialog_Download_Container.hide();
|
||||
$Document_Generation_Dialog_HandlerUI.empty();
|
||||
$Document_Generation_Dialog_HandlerUI.show();
|
||||
const uiurl = $this.attr('data-uiurl');
|
||||
fetch(uiurl, { method: 'POST' })
|
||||
.then(r => r.text())
|
||||
.then(html => {
|
||||
$Document_Generation_Dialog_HandlerUI.html(html);
|
||||
})
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const $handlerPicker = $handlersDialog.find('.handlerPicker');
|
||||
const $Document_Generation_Dialog_Download_Container = $handlersDialog.find('#Document_Generation_Dialog_Download_Container');
|
||||
const $Document_Generation_Dialog_HandlerUI = $handlersDialog.find('#Document_Generation_Dialog_HandlerUI');
|
||||
$handlerPicker.find('div').removeClass('selected');
|
||||
$handlerPicker.find('div[data-id=download]').addClass('selected');
|
||||
$Document_Generation_Dialog_Download_Container.show();
|
||||
$Document_Generation_Dialog_HandlerUI.hide();
|
||||
$Document_Generation_Dialog_HandlerUI.empty();
|
||||
|
||||
$handlersDialog.dialog('option', 'title', 'Generate Document: ' + $control[0].selectedOptions[0].label);
|
||||
$handlersDialog.dialog('open');
|
||||
updateHandlers(templateId);
|
||||
} else {
|
||||
downloadPdf(templateId);
|
||||
}
|
||||
$control.val('').blur();
|
||||
}
|
||||
});
|
||||
|
||||
})
|
||||
})(window, document, $);
|
||||
@@ -1508,4 +1508,66 @@ textarea.block {
|
||||
}
|
||||
#licence li {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
#Document_Generation_Dialog {
|
||||
height: 490px;
|
||||
}
|
||||
#Document_Generation_Dialog .handlerPicker {
|
||||
position: absolute;
|
||||
width: 170px;
|
||||
height: 390px;
|
||||
overflow-y: auto;
|
||||
background-color: #fcfcfc;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
#Document_Generation_Dialog .handlerPicker > div {
|
||||
background-color: #fff;
|
||||
border-bottom: 1px solid #ddd;
|
||||
padding: 6px 0 6px 6px;
|
||||
cursor: pointer;
|
||||
}
|
||||
#Document_Generation_Dialog .handlerPicker > div:hover {
|
||||
background-color: #f4f4f4;
|
||||
}
|
||||
#Document_Generation_Dialog .handlerPicker > div.selected,
|
||||
#Document_Generation_Dialog .handlerPicker > div.selected:hover {
|
||||
background-color: #eee;
|
||||
}
|
||||
#Document_Generation_Dialog .handlerPicker #Document_Generation_Dialog_Handlers_Loading {
|
||||
text-align: center;
|
||||
}
|
||||
#Document_Generation_Dialog .details {
|
||||
position: absolute;
|
||||
left: 200px;
|
||||
height: 390px;
|
||||
width: 540px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
#Document_Generation_Dialog .details #Document_Generation_Dialog_Download_Container {
|
||||
text-align: center;
|
||||
padding-top: 3em;
|
||||
}
|
||||
#Document_Generation_Dialog .details #Document_Generation_Dialog_HandlerUI {
|
||||
display: none;
|
||||
}
|
||||
ul.list-group {
|
||||
background-color: #fff;
|
||||
border: 1px solid #ddd;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
ul.list-group li {
|
||||
padding: 6px 0 6px 6px;
|
||||
cursor: pointer;
|
||||
}
|
||||
ul.list-group li:hover {
|
||||
background-color: #f4f4f4;
|
||||
}
|
||||
ul.list-group li.selected,
|
||||
ul.list-group li.selected:hover {
|
||||
background-color: #eee;
|
||||
}
|
||||
ul.list-group li:not(:first-child) {
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
@@ -1597,3 +1597,77 @@ textarea.block {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
}
|
||||
|
||||
#Document_Generation_Dialog {
|
||||
height: 490px;
|
||||
|
||||
.handlerPicker {
|
||||
position: absolute;
|
||||
width: 170px;
|
||||
height: 390px;
|
||||
overflow-y: auto;
|
||||
background-color: #fcfcfc;
|
||||
border: 1px solid #ccc;
|
||||
|
||||
& > div {
|
||||
background-color: @white;
|
||||
border-bottom: 1px solid #ddd;
|
||||
padding: 6px 0 6px 6px;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: @TableDataBorderColour;
|
||||
}
|
||||
|
||||
&.selected, &.selected:hover {
|
||||
background-color: @TableDataDarkBackgroundColour;
|
||||
}
|
||||
}
|
||||
|
||||
#Document_Generation_Dialog_Handlers_Loading {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.details {
|
||||
position: absolute;
|
||||
left: 200px;
|
||||
height: 390px;
|
||||
width: 540px;
|
||||
overflow-y: auto;
|
||||
|
||||
#Document_Generation_Dialog_Download_Container {
|
||||
text-align: center;
|
||||
padding-top: 3em;
|
||||
}
|
||||
|
||||
#Document_Generation_Dialog_HandlerUI {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ul.list-group {
|
||||
background-color: @white;
|
||||
border: 1px solid #ddd;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
|
||||
li {
|
||||
padding: 6px 0 6px 6px;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: @TableDataBorderColour;
|
||||
}
|
||||
|
||||
&.selected, &.selected:hover {
|
||||
background-color: @TableDataDarkBackgroundColour;
|
||||
}
|
||||
|
||||
&:not(:first-child) {
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user