databap/masks/doc.html

<div id="doc">
	<div id="doc_container">
		<div id="titles_edit" class="hide">
			<form id="doc_form" name="doc_form">
				<div id="title_edit" class="step_box round">
					<p class="step_nb_box">Titre</p>
					<input type="text" name="title" id="title" class="step_line_item inc_border round" maxlength="200" value="" />
				</div>
				<div id="desc_edit" class="step_box round">
					<p class="step_nb_box">Description</p>
					<input type="text" name="description" id="description" class="step_line_item inc_border round" maxlength="500" value="" />
				</div>
				<div id="desc_edit" class="step_box round">
					<p class="step_nb_box">Fichiers</p>
					<div id="attach_file"></div>
				</div>
				<div id="doc_menu"><a id="submit_doc" class="button round"><i class="fa fa-c-ok"></i>Valider</a></div>
			</form>
		</div>
		<div id="titles_read" class="step_box round hide">
			<p class="read_title"><span id="titles_read_title"></span></p>
			<p class="read_details">Cr&eacute;&eacute; par <span id="titles_read_user"></span> (<span id="titles_read_company"></span>) le <span id="titles_read_led"></span></p>
			<p class="read_description"><i class="fa fa-c-desc"></i><span id="titles_read_description"></span></p>
		</div>
		<div id="docs_read" class="step_box round hide">
			<p class="step_nb_box">Documents</p>
			<p id="doc_links"></p>
		</div>
	</div>
</div>
<script type="text/javascript">
databap.pageInit = function()
{
	self.tmp('started', false);
	self.initScrollBar('#main', '#doc', '#doc_container');
	
	//load Uploader
	oUploader = new qq.FileUploader
	(
		{
			element: document.getElementById('attach_file'),
			action: databap.getActionLink('upload_doc'),
			allowedExtensions: databap.consts.authorized_file_exts,
			sizeLimit: parseInt(databap.consts.max_size)*100,
			addSlideText: 'Glisser les fichier ici',
			addFileText: 'Ajouter des fichiers',
			debug: true,
			stepId: 1
        }
	);

	if(databap.vars.id>0)
	{
		loadDoc
		(
			databap.vars.id,
			function()
			{
				databap.setInitEnd(true);
			}
		);
	}
	else
	{
		setDisplay('edit');
		
		//Init's end
		databap.setInitEnd(true);
	}

	//submit
	databap.getMainElem('#submit_doc').click(saveDoc);
};

databap.onResize = function()
{
	self.setScrollBarSize('maximize');
	//var maxWidth = databap.getMainElem('#desc_edit').find('p.step_nb_box').width();
	//databap.getMainElem('#description').width(maxWidth-10);
};

databap.onQuit = function(){ return (self.tmp('started') === false); };

function loadDoc(iDocId, fOnSuccess)
{
	databap.getInfo
	(
		'get_doc',
		function(doc_info)
		{
			if(doc_info.desc == databap.consts.errors.not_found)
			{
				databap.addErrorBefore('Documentation introuvable', '#submit_doc');
				databap.addSuccessBefore('Mais vous pouvez la créer !', '#submit_doc');
				setDisplay('edit');
			}
			else
			{
				databap.getMainElem('#titles_read_title').html(doc_info.title);
				databap.getMainElem('#titles_read_user').html(doc_info.name);
				databap.getMainElem('#titles_read_company').html(doc_info.company);
				databap.getMainElem('#titles_read_led').html(doc_info.led);
				databap.getMainElem('#titles_read_description').html(doc_info.description);
	
				//links
				for(var i in doc_info.files)
				{
					databap.getMainElem('#doc_links').addButton('file-'+doc_info.files[i].ext+' fa-30', 
																doc_info.files[i].description, 
																databap.getActionLink('dl_file', {id:i}),
																null,
																'inverse');
				}
				setDisplay('read');
			}
			fOnSuccess();
		},
		{id:iDocId},
		'json'
	);
}

function saveDoc()
{
	if(databap.getMainElem('#title').val()!='' && databap.getMainElem('#description').val()!='')
	{
		databap.saveForm
		(
			'add_doc', 
			databap.getMainElem('#doc_form'), 
			function(data)
			{
				if(data.result == databap.consts.success)
				{
					databap.tmp('started', false);
					databap.goToInternalLink('doc', data.doc_id);
				}
			}, 
			true, 
			'json'
		);
	}
	else
	{
		databap.addErrorBefore('Tous les champs en sont pas remplis', '#doc_menu');
	}
}

function setDisplay(sNewMode)
{	
	//Hide / show boxes
	var $EditBoxes = databap.getMainElem('#titles_edit');
	var $ReadBoxes = databap.getMainElem('#titles_read, #docs_read');
	
	switch(sNewMode)
	{
		case 'read':
			$EditBoxes.hide();
			$ReadBoxes.show();
			break;
		case 'edit':
			$EditBoxes.show();
			$ReadBoxes.hide();
			break;
	}
}

</script>