Auto-detect common typos in email addresses

src/pretix/static/pretixpresale/js/ui/typocheck.js

@@ -0,0 +1,79 @@
+/*global $,gettext,ngettext */
+
+function typocheck() {
+    var $target = $("input[data-typocheck-target]"),
+        $sources = $("input[data-typocheck-source]"),
+        orig_val = $target.val(),
+        words = [];
+
+    function regexEscape(str) {
+        return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
+    }
+
+    $sources.each(function () {
+        $.each($(this).val().toLowerCase().replace('-', '').split(' '), function (i, w) {
+            if (w) {
+                words.push(w);
+            }
+        });
+    });
+    words.push(
+        '@gmail.', '@web.', '@gmx.', '@hotmail.', '@live.', '@outlook.', '@yahoo.', '@mail.', '@msn.', '@me.',
+        '@verizon.', '@mac.', '@email.', '@icloud.', '@inbox.', '@rocketmail.', '@bt.', '@orange.',
+        '@online.', '@t-online.'
+    );
+
+    var word, patterns, i, j, k, r,
+        val = orig_val;
+    for (i = 0; i < words.length; i++) {
+        word = words[i];
+        patterns = [];
+        for (j = 0; j < word.length; j++) {
+            if (j > 0) {
+                patterns.push(regexEscape(word.slice(0, j)) + '.' + regexEscape(word.slice(j)));
+            }
+            if (j > 0 || word.slice(0, 1) !== '@') {
+                patterns.push(regexEscape(word.slice(0, j)) + '.' + regexEscape(word.slice(j + 1)));
+                patterns.push(regexEscape(word.slice(0, j)) + regexEscape(word.slice(j + 1, j + 2)) + regexEscape(word.slice(j, j + 1)) + regexEscape(word.slice(j + 2)));
+            }
+            patterns.push(regexEscape(word.slice(0, j)) + regexEscape(word.slice(j + 1)));
+        }
+
+        // Remove conflicting patterns (i.e. gmail.com shouldn't correct email.com)
+        for (j = patterns.length - 1; j >= 0; j--) {
+            r = new RegExp(patterns[j]);
+            for (k = 0; k < words.length; k++) {
+                if (k === i) {
+                    continue;
+                }
+                if (words[k] === '@mail.com') {
+                    console.log(words[k], r, words[k].match(r));
+                }
+                if (words[k].match(r)) {
+                    patterns.splice(j, 1);
+                }
+            }
+        }
+        val = val.replace(new RegExp('(' + patterns.join('|') + ')', 'i'), word);
+    }
+    val = val.replace(/gmail\.(?!com$)[a-z]*$/i, 'gmail.com');
+
+    var changed = (val.toLowerCase() != orig_val.toLowerCase());
+    $(".typo-alert").toggle(changed).find("[data-typosuggest]").text(val);
+    $(".typo-alert").find("[data-typodisplay]").text(orig_val);
+}
+
+$(document).ready(function () {
+    if ($("input[data-typocheck-target]").length === 0) {
+        return;
+    }
+
+    $('body').on('change', 'input[data-typocheck-target], input[data-typocheck-source]', function () {
+        typocheck();
+    });
+    $(".typo-alert span[data-typosuggest]").click(function () {
+        $("input[data-typocheck-target]").val($(this).text());
+        $(".typo-alert").slideUp();
+    })
+    typocheck();
+});

src/pretix/static/pretixpresale/scss/main.scss

@@ -116,6 +116,11 @@ body.loading .container {
     -webkit-transition: opacity .5s ease-in-out;
 }
 
+.typo-alert span[data-typosuggest] {
+    text-decoration: underline;
+    cursor: pointer;
+}
+
 .info-row {
     & > .fa {
         font-size: 26px;