Craig @qrayg craigerskine

Detecting outside clicks in Vue.js

See this StackOverflow thread

First off, include the directive at the end of this gist.

On your open button, make sure to use @click.stop to prevent the open click event from closing your modal.
On your modal, add the v-click-outside directive and points it at a function to call when clicked outside.

npm install

For no module script:

npm run bundle:iife

	var SITE = SITE \|\| {};

	SITE.fileInputs = function() {
	var $this = $(this),
	$val = $this.val(),
	valArray = $val.split('\\'),
	newVal = valArray[valArray.length-1],
	$button = $this.siblings('.button'),
	$fakeFile = $this.siblings('.file-holder');
	if(newVal !== '') {

	// 2024 Update, use URLSearchParams [https://caniuse.com/urlsearchparams]
	export function createQueryString2(name: string, value: string, searchParams: any) {
	const params = new URLSearchParams(searchParams);
	params.set(name, value.toLowerCase());

	return params.toString();
	}

	// ---- Original 2012 version, when browsers really sucked ----
	// Explicitly save/update a url parameter using HTML5's replaceState().

	<?xml version="1.0" encoding="UTF-8"?>
	<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
	<xsl:output method="html" encoding="UTF-8" indent="yes" />
	<xsl:template match="/">

	<xsl:text disable-output-escaping="yes"><</xsl:text>!DOCTYPE html<xsl:text disable-output-escaping="yes">></xsl:text>

	<xsl:text disable-output-escaping="yes"><![CDATA[
	<!--[if lt IE 7 ]> <html lang="en" class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
	<!--[if IE 7 ]> <html lang="en" class="no-js lt-ie9 lt-ie8"> <![endif]-->

	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
	<html>

	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>Single-Column Responsive Email Template</title>

	<style>
	@media only screen and (min-device-width: 541px) {
	.content {

	$(document).ready(function(){

	// queryStrip
	function queryStrip(string) {
	string = string.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
	var regex = new RegExp('[\\?&]' + string + '=([^&#]*)'),
	results = regex.exec(location.search);
	return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ''));
	}

	Drop in replace functions for setTimeout() & setInterval() that
	make use of requestAnimationFrame() for performance where available

	/*
	* Replace all SVG images with inline SVG
	*/
	jQuery('img.svg').each(function(){
	var $img = jQuery(this);
	var imgID = $img.attr('id');
	var imgClass = $img.attr('class');
	var imgURL = $img.attr('src');

	jQuery.get(imgURL, function(data) {