jexelmans
/
drawio


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145
							<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>OneDrive Connector Editor</title>
<script src="../new_common/cac.js" type="text/javascript"></script>
<script src="../onedrive_common/ac.js" type="text/javascript"></script>
<script src="../../js/spin/spin.min.js" type="text/javascript"></script>
<script type="text/javascript">
// Sets global environment variables
RESOURCE_BASE = '/resources/dia';
STENCIL_PATH = '/stencils';
SHAPES_PATH = '/shapes';
IMAGE_PATH = '/images';

// Overrides browser language with Confluence user language
var lang = AC.getUrlParam('loc');

// Language is in the Connect URL
if (lang != null)
{
	var dash = lang.indexOf('-');
	
	if (dash >= 0)
	{
		mxLanguage = lang.substring(0, dash);
	}
}
</script>
<script type="text/javascript" src="/js/viewer.min.js"></script>
<script type="text/javascript" src="../vsdx/importer.js"></script>
<link rel="stylesheet" href="//aui-cdn.atlassian.com/aui-adg/5.9.12/css/aui.min.css" media="all">
<style type="text/css">
body {
	font-family:Arial, sans-serif;
	overflow:hidden;
	height:100%;
	width:100%;
	margin:0;
}
.thumbnail {
	box-sizing: border-box;
	height: 100px;
	width: 100px;
	border: 1px solid #CCCCCC;
	border-radius: 3px;
	line-height: 94px;
	text-align:center;
}
#thumbImg {
	vertical-align:middle;
	max-width: 96px;
	max-height: 96px;
}
</style>
</head>
<body style="height:100%;">
<div style="height:100%;">
	<div style="height:100%;width:350px;border-right:1px solid #cccccc;position:absolute;top:0px;display:inline-block;">
		<form class="aui top-label" style="height:100%;top:0px;">
			<div class="field-group" style="padding-left:15px;">
				<label for="filename">File name</label> 
				<input class="text macro-param-input" type="text" id="filename" name="filename" disabled placeholder="Choose a file...">
				<button class="aui-button aui-button-primary ap-dialog-submit" id="filePicker" disabled>Choose</button>
				<div id="spinner-container"></div>
				<div class="description">OneDrive file name</div>
				<div class="error" id="filenameError"></div>
			</div>
			<div class="field-group" style="padding-left:15px;">
				<label for="width">Width</label> <input class="text medium-field" id="width" value="800">
				<div class="description">Width of the viewer (px)</div>
				<div class="error" id="widthError"></div>
			</div>
			<div class="field-group" style="padding-left:15px;">
				<label for="height">Height</label> <input class="text medium-field" id="height" value="600">
				<div class="description">Height of the viewer (px)</div>
				<div class="error" id="heightError"></div>
			</div>
			<div class="field-group" style="padding-left:15px;">
				<input class="checkbox small-field" id="autoSize" type="checkbox" >
				<label for="autoSize" style="display:inline-block;">Automatically set the size of the viewer</label>
			</div>
			<div id="thumbGroup" class="field-group" style="padding-left:15px;">
				<label for="thumbImg">Thumbnail</label>
				<div class="thumbnail">
					<img id="thumbImg">
				</div>
			</div>
			<div class="field-group" style="padding-left:15px;">
				<input type="checkbox" class="checkbox small-fiel" id="useDrawio">
				<label for="useDrawio" style="display:inline-block;">Preview in draw.io</label>
			</div>
		</form>
	</div>
	<div id="preview" style="height:100%;left:351px;position:absolute;top:0px;right:0px;display:inline-block;">
		<a style="display:block;text-align:center;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);cursor:pointer"
			onclick="document.getElementById('filePicker').click();">Choose a file...</a>
	</div>
</div>
<script src="../onedrive_common/editor.js" type="text/javascript"></script>
<script type="text/javascript">
	AC.$('#thumbGroup').style.display = 'none';
	
	OneDriveEditor(function(selectedFile, width, height, autoSize, selFileContent)
	{
		var useDrawio = selectedFile.isDrawio || AC.$('#useDrawio').checked;
		
		function saveMacro()
		{
			var macroParams = 
			{
				filename : selectedFile.name,
				fileId : selectedFile.id,
				driveId: selectedFile.parentReference.driveId,
				width : width,
				height : height,
				isDrawio: useDrawio,
				aspect: selectedFile.aspect,
				autoSize: autoSize? '1' : '0',
				mimeType : selectedFile.file.mimeType,
				embeddedUrl : selectedFile.embeddedUrl,
				dummy: Date.now() //This allows adding the same file more than once
			};

			AP.confluence.saveMacro(macroParams);
			AP.confluence.closeMacroEditor();
		};
		
		if (useDrawio && selFileContent != null)
		{
			var modifiedTS = new Date(selectedFile.lastModifiedDateTime).getTime();
			AC.uploadCachedMxFile(selFileContent, modifiedTS + '_' + selectedFile.name, saveMacro, saveMacro); //Save without caching
		}
		else
		{
			saveMacro();
		}
	}, function(cp)
	{
		AP.confluence.getMacroData(cp);
	});
</script>
</body>
</html>