landmark-serve/templates/fields/cloudinaryimages/form.jade

Web Application Framework and Admin GUI / Content Management System built on Express.js and Mongoose

- var hasImages = item.get(field.path).length
- var p = cloudinary.prefix;
- if (p.length)
	- p += '_';
- var tags = [p + field.list.path + '_' + field.path, p + field.list.path + '_' + field.path + '_' + item.id];
- if (cloudinary.prefix)
	- tags.push(cloudinary.prefix);
- if (env != 'production')
	- tags.push(p + 'dev');
- var directUpload = cloudinary.uploader.direct_upload(undefined,{tags:tags})
- var formData = {cloud_name: cloudinary.cloud_name, api_key: cloudinary.api_key, timestamp: directUpload.hidden_fields.timestamp, signature: directUpload.hidden_fields.signature, tags: tags}
.field.type-cloudinaryimages(data-field-type=field.type, data-field-path=field.path, data-field-paths-upload=field.paths.upload, data-field-paths-uploads=field.paths.uploads, data-field-collapse=field.collapse ? 'true' : false, data-field-depends-on=field.dependsOn, data-field-noedit=field.noedit ? 'true' : 'false', data-field-value=hasImages ? 'true' : 'false')
	label.field-label= field.label
	input(type='hidden', name=field.paths.action, value='').field-action
	input(type='hidden', name=field.paths.order, value='').field-order
	input(type='hidden', name=field.paths.uploads, value='').field-uploads
	input(type='file', name='file', multiple, data-form-data='#{JSON.stringify(formData)}').field-upload
	.field-ui(class=hasImages ? 'has-image' : false)
		if field.noedit
			each value in item.get(field.path)
				.image-field.row.col-sm-3.col-md-12(title=value.width + ' x ' + value.height)
					.image-preview
						a(href=value.url, rel=field.path).img-thumbnail
							img(width=90, height=90, data-src=value.fit(false, 90), data-id=value.public_id, data-wysiwyg=(field.options.wysiwyg ? 'true' : false), data-wysiwyg-options=(field.options.wysiwyg ? '#{JSON.stringify(field.options.wysiwyg)}' : false), data-wysiwyg-original=(field.options.wysiwyg ? value.url : false), data-wysiwyg-src=(field.options.wysiwyg ? ( 'object' == typeof field.options.wysiwyg ? value[field.options.wysiwyg.crop](field.options.wysiwyg.width, field.options.wysiwyg.height) : value.src() ) : false)).img-load
							.ion-picture.img-loading
		else
			.images-container.clearfix
				each value in item.get(field.path)
					.image-field.image-sortable.row.col-sm-3.col-md-12(data-id=value.public_id, title=value.width + ' x ' + value.height)
						.image-preview
							a(href=value.url, rel=field.path).img-thumbnail
								img(width=90, height=90, data-src=value.fit(false, 90), data-id=value.public_id, data-wysiwyg=(field.options.wysiwyg ? 'true' : false), data-wysiwyg-options=(field.options.wysiwyg ? '#{JSON.stringify(field.options.wysiwyg)}' : false), data-wysiwyg-original=(field.options.wysiwyg ? value.url : false), data-wysiwyg-src=(field.options.wysiwyg ? ( 'object' == typeof field.options.wysiwyg ? value[field.options.wysiwyg.crop](field.options.wysiwyg.width, field.options.wysiwyg.height) : value.src() ) : false)).img-load
								.ion-picture.img-loading
								.delete-pending(style='display: none;')
						.image-details
							a(href=js, data-alt-text='Delete').btn.btn-link.btn-cancel.btn-remove-image Remove
							a(href=js, data-alt-text='Undo', style='display: none;').btn.btn-link.btn-cancel.btn-undo-remove Undo
				.image-field.image-upload.row.col-sm-3.col-md-12
					.image-preview
						span.img-thumbnail
							span.img-dropzone
							.ion-picture.img-uploading
					.image-details
						span.image-message Drag to upload
			
			.images-toolbar.row.col-sm-3.col-md-12
				div.pull-left
					a(href=js).btn.btn-default.btn-upload Upload Images
				.upload-queued.pull-left
					.alert.alert-success
				.delete-queued.pull-left
					.alert.alert-danger
			if field.note
				.field-note!= field.note