Limit Aspect Ratio of MP4/MOV Files

Experimental Snippet 🧪

Instructions

  1. Install our free Custom Javascript for Gravity Forms plugin. Download the plugin here: https://gravitywiz.com/gravity-forms-code-chest/
    1. Copy and paste the snippet into the editor of the Custom Javascript for Gravity Forms plugin.

Code

Filename: gpfup-limit-aspect-ratio-of-mp4-mov-files.js

/**
 * Gravity Perks // File Upload Pro // Limit Aspect Ratio of MP4/MOV Files
 * https://gravitywiz.com/documentation/gravity-forms-file-upload-pro/
 *
 * Experimental Snippet 🧪
 *
 * Instruction Video: https://www.loom.com/share/b05a322bbf204e49b23ae366a123be96
 *
 * Instructions:
 *   1. Install our free Custom Javascript for Gravity Forms plugin.
 *      Download the plugin here: https://gravitywiz.com/gravity-forms-code-chest/
 *   2. Copy and paste the snippet into the editor of the Custom Javascript for Gravity Forms plugin.
 */
window.gform.addAction('gpfup_before_upload', (formId, fieldId, file, up, gpfupInstance) => {
	// Update "4:3" to the desired video aspect ratio.
	const targetAspectRatio = '4:3';

	const [width, height] = targetAspectRatio.split(':').map(Number);
	const numericalAspectRatio = width / height;

	const videoMimeTypes = ['video/mp4', 'video/quicktime'];

	if (videoMimeTypes.indexOf(file.type) !== -1) {
		var fileURL = URL.createObjectURL(file.getNative());
		var vid = document.createElement('video');
		vid.src = fileURL;

		// check the video aspect ratio
		vid.onloadedmetadata = function () {
			const aspectRatio = this.videoWidth / this.videoHeight;

			if (numericalAspectRatio != aspectRatio) {
				gpfupInstance.handleFileError(up, file, {
					code: 'does_not_meet_aspect_ratio',
					message: `Video duration must be of ${targetAspectRatio} aspect ratio.`,
				});
			}	
		};
	}
});

Leave a Reply

Your email address will not be published. Required fields are marked *

  • Trouble installing this snippet? See our troubleshooting tips.
  • Need to include code? Create a gist and link to it in your comment.
  • Reporting a bug? Provide a URL where this issue can be recreated.

By commenting, I understand that I may receive emails related to Gravity Wiz and can unsubscribe at any time.