Files
Disco/Disco.Web/Views/User/UserParts/_Resources.cshtml
T

357 lines
21 KiB
Plaintext

@model Disco.Web.Models.User.ShowModel
@{
Authorization.Require(Claims.User.ShowAttachments);
var canAddAttachments = Authorization.Has(Claims.User.Actions.AddAttachments);
var canRemoveAnyAttachments = Authorization.Has(Claims.User.Actions.RemoveAnyAttachments);
var canRemoveOwnAttachments = Authorization.Has(Claims.User.Actions.RemoveOwnAttachments);
Html.BundleDeferred("~/Style/Shadowbox");
Html.BundleDeferred("~/ClientScripts/Modules/Shadowbox");
Html.BundleDeferred("~/ClientScripts/Modules/jQuery-SignalR");
if (canAddAttachments)
{
Html.BundleDeferred("~/ClientScripts/Modules/Disco-AttachmentUploader");
}
}
<div id="UserDetailTab-Resources" class="UserPart">
<table id="userShowResources">
<tr>
<td id="AttachmentsContainer">
<div id="Attachments" class="@(canAddAttachments ? "canAddAttachments" : "cannotAddAttachments") @(canRemoveAnyAttachments ? "canRemoveAnyAttachments" : "cannotRemoveAnyAttachments") @(canRemoveOwnAttachments ? "canRemoveOwnAttachments" : "cannotRemoveOwnAttachments")" data-userid="@CurrentUser.UserId" data-uploadurl="@(Url.Action(MVC.API.User.AttachmentUpload(Model.User.UserId, null)))" data-onlineuploadurl="@(Url.Action(MVC.API.User.AttachmentOnlineUploadSession(Model.User.UserId)))" data-qrcodeurl="@Url.Content("~/ClientSource/Scripts/Modules/qrcode.min.js")">
@Html.AntiForgeryToken()
<div class="Disco-AttachmentUpload-DropTarget">
<h2>Drop Attachments Here</h2>
</div>
<div class="attachmentOutput">
@if (Model.User.UserAttachments != null)
{
foreach (var ua in Model.User.UserAttachments.OrderByDescending(a => a.Id))
{
<a href="@Url.Action(MVC.API.User.AttachmentDownload(ua.Id))" data-attachmentid="@ua.Id" data-mimetype="@ua.MimeType">
<span class="icon" title="@ua.Filename">
<img alt="Attachment Thumbnail" src="@(Url.Action(MVC.API.User.AttachmentThumbnail(ua.Id)))" />
</span>
<span class="comments" title="@ua.Comments">
@{if (!string.IsNullOrEmpty(ua.DocumentTemplateId))
{ @ua.DocumentTemplate.Description}
else
{ @(ua.Comments ?? ua.Filename) }}
</span><span class="author">@ua.TechUser.ToStringFriendly()</span>@if (canRemoveAnyAttachments || (canRemoveOwnAttachments && ua.TechUserId.Equals(CurrentUser.UserId, StringComparison.OrdinalIgnoreCase)))
{<text><span class="remove fa fa-times-circle"></span></text>}<span class="timestamp" data-livestamp="@(ua.Timestamp.ToUnixEpoc())" title="@ua.Timestamp.ToFullDateTime()">@ua.Timestamp.ToFullDateTime()</span>
</a>
}
}
</div>
@if (canAddAttachments)
{
<div class="Disco-AttachmentUpload-Progress"></div>
<div class="attachmentInput clearfix">
<span class="action enabled upload fa fa-upload disabled" title="Attach File"></span><span class="action enabled photo fa fa-camera disabled" title="Capture Image"></span><span class="action enabled online-upload fa fa-qrcode disabled" title="Upload with Online Services"></span>
</div>
}
<script type="text/javascript">
Shadowbox.init({
skipSetup: true,
modal: true
});
$(function () {
var $Attachments = $('#Attachments');
var $attachmentOutput = $Attachments.find('.attachmentOutput');
var $dialogRemoveAttachment = null;
// Connect to Hub
var hub = $.connection.userUpdates;
// Map Functions
hub.client.addAttachment = onAddAttachment;
hub.client.removeAttachment = onRemoveAttachment;
$.connection.hub.qs = { UserId: '@(Model.User.UserId.Replace(@"\", @"\\"))' };
$.connection.hub.error(onHubFailed);
$.connection.hub.disconnected(onHubFailed);
$.connection.hub.reconnecting(function () {
$('#AttachmentsContainer').find('span.action.enabled').addClass('disabled');
});
$.connection.hub.reconnected(function () {
$('#AttachmentsContainer').find('span.action.enabled').removeClass('disabled');
});
// Start Connection
$.connection.hub.start(function () {
$('#AttachmentsContainer').find('span.action.enabled').removeClass('disabled');
}).fail(onHubFailed);
function onHubFailed(error) {
// Disable UI
$('#AttachmentsContainer').find('span.action.enabled').addClass('disabled');
// Show Dialog Message
if ($('.disconnected-dialog').length == 0) {
$('<div>')
.addClass('dialog disconnected-dialog')
.html('<h3><span class="fa-stack fa-lg"><i class="fa fa-wifi fa-stack-1x"></i><i class="fa fa-ban fa-stack-2x error"></i></span>Disconnected from the Disco ICT Server</h3><div>This page is not receiving live updates. Please ensure you are connected to the server, then refresh this page to enable features.</div>')
.dialog({
resizable: false,
title: 'Disconnected',
width: 400,
modal: true,
buttons: {
'Refresh Now': function () {
$(this).dialog('option', 'buttons', null);
window.location.reload(true);
},
'Close': function () {
$(this).dialog('destroy');
}
}
});
}
}
function onAddAttachment(id, quick) {
var data = { id: id };
$.ajax({
url: '@Url.Action(MVC.API.User.Attachment())',
dataType: 'json',
data: data,
success: function (d) {
if (d.Result == 'OK') {
var a = d.Attachment;
if ($Attachments.hasClass('canRemoveAnyAttachments'))
buildAttachment(a, true, quick);
else if ($Attachments.hasClass('canRemoveOwnAttachments'))
buildAttachment(a, (a.AuthorId === $Attachments.attr('data-userid')), quick);
else
buildAttachment(a, false, quick);
} else {
alert('Unable to add attachment: ' + d.Result);
}
},
error: function (jqXHR, textStatus, errorThrown) {
alert('Unable to add attachment: ' + textStatus);
}
});
}
function buildAttachment(a, canRemove, quick) {
var t = '<a><span class="icon"><img alt="Attachment Thumbnail" /></span><span class="comments"></span><span class="author"></span>';
if (canRemove)
t += '<span class="remove fa fa-times-circle"></span>';
t += '<span class="timestamp"></span></a>';
var e = $(t);
e.attr('data-attachmentid', a.Id).attr('data-mimetype', a.MimeType).attr('href', '@(Url.Action(MVC.API.User.AttachmentDownload()))/' + a.Id);
e.find('.comments').text(a.Description);
e.find('.author').text(a.Author);
e.find('.timestamp').text(a.TimestampFull).attr('title', a.TimestampFull).livestamp(a.TimestampUnixEpoc);
if (canRemove)
e.find('.remove').click(removeAttachment);
if (!quick)
e.hide();
$attachmentOutput.prepend(e);
onUpdate();
if (!quick)
e.show('slow');
if (a.MimeType.toLowerCase().indexOf('image/') == 0)
e.shadowbox({ gallery: 'attachments', player: 'img', title: a.Description });
else
e.click(onDownload);
// Add Thumbnail
var buildThumbnail = function () {
var retryCount = 0;
var img = e.find('.icon img');
var setThumbnailUrl = function () {
img.attr('src', '@(Url.Action(MVC.API.User.AttachmentThumbnail()))/' + a.Id + '?v=' + retryCount);
};
img.on('error', function () {
img.addClass('loading');
retryCount++;
if (retryCount < 6)
window.setTimeout(setThumbnailUrl, retryCount * 250);
});
img.on('load', function () {
img.removeClass('loading');
});
window.setTimeout(setThumbnailUrl, 100);
};
buildThumbnail();
}
function onDownload() {
var $this = $(this);
var url = $this.attr('href');
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 (!$attachmentDownloadHost) {
$attachmentDownloadHost = $('<iframe>')
.attr({ 'src': url, 'title': 'Attachment Download Host' })
.addClass('hidden')
.appendTo('body')
.contents();
} else {
$attachmentDownloadHost[0].location.href = url;
}
}
return false;
}
function onRemoveAttachment(id) {
var a = $attachmentOutput.find('a[data-attachmentid=' + id + ']');
a.hide(300).delay(300).queue(function () {
var $this = $(this);
if ($this.attr('data-mimetype').toLowerCase().indexOf('image/') == 0)
Shadowbox.removeCache(this);
$this.find('.timestamp').livestamp('destroy');
$this.remove();
onUpdate();
});
}
function onUpdate() {
var attachmentCount = $attachmentOutput.children('a').length;
var tabHeading = 'Attachments [' + attachmentCount + ']';
$('#UserDetailTab-ResourcesLink').text(tabHeading);
}
@if (canAddAttachments)
{<text>
//#region Add Attachments
var attachmentUploader = new document.Disco.AttachmentUploader($Attachments);
var $attachmentInput = $Attachments.find('.attachmentInput');
$attachmentInput.find('.online-upload').on('click', function () {
if ($(this).hasClass('disabled'))
alert('Disconnected from the Disco ICT Server, please refresh this page and try again');
else
attachmentUploader.onlineUpload();
});
if (window.location.protocol != 'https:') {
$attachmentInput.find('.photo')
.removeClass('enabled')
.addClass('disabled')
.attr('title', 'Capture Image: this functionality is only available over a HTTPS connection');
}
$attachmentInput.find('.photo').click(function () {
if (!$(this).hasClass('enabled'))
alert('This functionality is only available over a HTTPS connection');
else if ($(this).hasClass('disabled'))
alert('Disconnected from the Disco ICT Server, please refresh this page and try again');
else
attachmentUploader.uploadImage();
});
$attachmentInput.find('.upload').click(function () {
if ($(this).hasClass('disabled'))
alert('Disconnected from the Disco ICT Server, please refresh this page and try again');
else
attachmentUploader.uploadFiles();
});
var resourcesTab;
$(document).on('dragover', function () {
if (!resourcesTab) {
var tabs = $Attachments.closest('.ui-tabs');
resourcesTab = {
tabs: tabs,
resourcesIndex: tabs.children('ul.ui-tabs-nav').find('a[href="#UserDetailTab-Resources"]').closest('li').index()
};
}
var selectedIndex = resourcesTab.tabs.tabs('option', 'active');
if (resourcesTab.resourcesIndex !== selectedIndex)
resourcesTab.tabs.tabs('option', 'active', resourcesTab.resourcesIndex);
});
//#endregion
</text>}
@if (canRemoveAnyAttachments || canRemoveOwnAttachments)
{<text>
//#region Remove Attachments
$attachmentOutput.find('span.remove').click(removeAttachment);
function removeAttachment() {
$this = $(this).closest('a');
var data = { id: $this.attr('data-attachmentid') };
if (!$dialogRemoveAttachment) {
$dialogRemoveAttachment = $('#dialogRemoveAttachment').dialog({
resizable: false,
height: 140,
modal: true,
autoOpen: false
});
}
$dialogRemoveAttachment.dialog("enable");
$dialogRemoveAttachment.dialog('option', 'buttons', {
"Remove": function () {
$dialogRemoveAttachment.dialog("disable");
$dialogRemoveAttachment.dialog("option", "buttons", null);
$.ajax({
url: '@Url.Action(MVC.API.User.AttachmentRemove())',
dataType: 'json',
data: data,
success: function (d) {
if (d == 'OK') {
// Do nothing, await SignalR notification
} else {
alert('Unable to remove attachment: ' + d);
}
$dialogRemoveAttachment.dialog("close");
},
error: function (jqXHR, textStatus, errorThrown) {
alert('Unable to remove attachment: ' + textStatus);
$dialogRemoveAttachment.dialog("close");
}
});
},
Cancel: function () {
$dialogRemoveAttachment.dialog("close");
}
});
$dialogRemoveAttachment.dialog('open');
return false;
}
//#endregion
</text>}
$attachmentOutput.children('a').each(function () {
$this = $(this);
if ($this.attr('data-mimetype').toLowerCase().indexOf('image/') == 0)
$this.shadowbox({ gallery: 'attachments', player: 'img', title: $this.find('.comments').text() });
else
$this.click(onDownload);
});
});
</script>
</div>
</td>
</tr>
</table>
<script>
$('#UserDetailTabItems').append('<li><a href="#UserDetailTab-Resources" id="UserDetailTab-ResourcesLink">Attachments [@(Model.User.UserAttachments == null ? 0 : Model.User.UserAttachments.Count)]</a></li>');
</script>
</div>
@if (canRemoveAnyAttachments || canRemoveOwnAttachments)
{
<div id="dialogRemoveAttachment" class="dialog" title="Remove this Attachment?">
<p>
<i class="fa fa-exclamation-triangle fa-lg"></i>&nbsp;Are you sure?
</p>
</div>
}