UPLOADIFY - BIZAMAJIG PROTOTYPE

Use uploadify to Transloadit -> S3

by bizamajig

HTML

<script src="http://www.uploadify.com/wp-content/themes/uploadify/js/jquery.uploadify.min.js"></script>
<link rel="stylesheet" href="http://www.uploadify.com/wp-content/themes/uploadify/style.css">
<style>
    .uploadify-button {
        background-color: transparent;
        border: none;
        padding: 0;
    }
    .uploadify:hover .uploadify-button {
        background-color: transparent;
    }
</style>
<input class="hidden-position" type="file" name="file_upload" id="file_upload" />
<div class="file_upload-display">FILE GOES HERE</div>

CSS

.uploadify-button {
        background-color: transparent;
        border: none;
        padding: 0;

	text-indent: none !important;
}
.uploadify:hover .uploadify-button {
        background-color: transparent;
}
.mvc-crud-c-submit-button-fileupload,
.mvc-crud-u-submit-button-fileupload,
#bizamajig-ui-button-file-upload,
#bizamajig-ui-button-file-save {
	padding: 5px;

	width: 100px;

    background: red;
    
	color: #ffffff;
	text-decoration: none;
	text-align: center;

	cursor: pointer;

	-moz-border-radius-bottomleft: 4px;
	-webkit-border-bottom-left-radius: 4px;
	border-bottom-left-radius: 4px;
	-moz-border-radius-topleft: 4px;
	-webkit-border-top-left-radius: 4px;
	border-top-left-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	-webkit-border-bottom-right-radius: 4px;
	border-bottom-right-radius: 4px;
	-moz-border-radius-topright: 4px;
	-webkit-border-top-right-radius: 4px;
	border-top-right-radius: 4px;
}
.mvc-crud-c-submit-button-fileupload:hover,
.mvc-crud-c-submit-button-fileupload:hover,
#bizamajig-ui-button-file-upload:hover,
#bizamajig-ui-button-file-save:hover {
	background: #FF5500; 
}





.uploadify{position:relative;margin-bottom:1em}.uploadify-button{background-color:#505050;background-image:linear-gradient(bottom, #505050 0, #707070 100%);background-image:-o-linear-gradient(bottom, #505050 0, #707070 100%);background-image:-moz-linear-gradient(bottom, #505050 0, #707070 100%);background-image:-webkit-linear-gradient(bottom, #505050 0, #707070 100%);background-image:-ms-linear-gradient(bottom, #505050 0, #707070 100%);background-image:-webkit-gradient(linear,left bottom,left top,color-stop(0, #505050),color-stop(1, #707070));background-position:center top;background-repeat:no-repeat;-webkit-border-radius:30px;-moz-border-radius:30px;border-radius:30px;border:2px solid #808080;color:#FFF;font:bold 12px Arial,Helvetica,sans-serif;text-align:center;text-shadow:0 -1px 0 rgba(0,0,0,.25);width:100%}.uploadify:hover...

JavaScript

$('#file_upload').uploadify({
				    auto:														true,
					hideButton: 												true, // True if we want to use our own custom button
					wmode: 														'transparent',
					width: 														'32', // to match icon for Edit Image
					height: 													'32', // to match icon for Edit Image
     swf: 						'http://uploadify.com/uploadify/uploadify.swf',
     uploader: 					'http://bizamajig.com/uploader.asp?bizamajig_portal_owner_file_path_info=/content/18805', // was $('#doc_url').val()
     buttonImage: 				'http://bizamajig.com/resources/bizamajig/art/icon-edit-2x.png'
//					folder: 													'/content/18805', // was $('#doc_url').val()
					multi: 														false,
					queueID: 													'', // 'bizamajig-input-file-queue',
					queueSizeLimit:												1
});
$(".mvc-crud-c-submit-button-fileupload").each(function() {
//		$('#file_upload').uploadify({
//	    $( '#' + $(this).prop( 'id' ) ).uploadify({
		$( '#file_upload-button' ).uploadify({
				    auto:														true,
					hideButton: 												true, // True if we want to use our own custom button
					wmode: 														'transparent',
					width: 														'32', // to match icon for Edit Image
					height: 													'32', // to match icon for Edit Image
	
					method: 													'POST',
					buttonText: 												'',
            
	
					swf: 														'http://bizamajig.com/include/jquery/uploadify/uploadify.swf',
					uploader: 													'uploader.asp?bizamajig_portal_owner_file_path_info=/content/18805', // was $('#doc_url').val()
	
					buttonImage: 												'/resources/bizamajig/art/icon-edit-2x.png',
					cancelImg: 													'',
					fileDesc: 													'Upload a new image',
					fileExt: 													'*.*;',
					folder: 													'/content/18805', // was $('#doc_url').val()
					multi: 														false,
					queueID: 													'', // 'bizamajig-input-file-queue',
					queueSizeLimit:												1
        });
});

      ...