wip

2026-01-04 17:50:08 -06:00
parent 7e45ce0756
commit acc8ac87a0
4131 changed files with 232562 additions and 250244 deletions
@@ -0,0 +1,95 @@
+
+var _ = require('./_.js');
+let $ = jQuery;
+
+
+// Jquery plugin 'autocomplete'
+// This code will show ghost text of the first matching suggestion for autocompleting a textbox out of provided
+// words 'words'.
+$.fn.xyz_autocomplete = function (options) {
+    var settings = $.extend({
+        words: []
+    }, options);
+
+    var suggestWord = function (input, words) {
+        var typedValue = input.val().toLowerCase().split(' ').pop();
+        if (typedValue === '') {
+            return '';
+        }
+
+        for (var i = 0; i < words.length; i++) {
+            if (words[i].toLowerCase().indexOf(typedValue) === 0) {
+                return words[i].substr(typedValue.length);
+            }
+        }
+        return '';
+    };
+
+    return this.each(function () {
+        var $input = $(this);
+        var $suggestion = $('<span class="auto-complete-suggestion"></span>');
+
+        $input.after($suggestion);
+
+        var inputComputedStyle = window.getComputedStyle($input.get(0));
+
+        $suggestion.css({
+            'pointer-events': 'none',
+            'position': 'absolute',
+            'max-width': $input.innerWidth(),
+            'overflow': 'hidden',
+            'white-space': 'nowrap',
+            'font': $input.css('font'),
+            'padding-left': parseFloat(inputComputedStyle.getPropertyValue('padding-left')) + 1 + parseFloat(inputComputedStyle.getPropertyValue('border-left-width')),
+        });
+
+        var updateSuggestion = function () {
+            var suggestedText = suggestWord($input, settings.words);
+            if (suggestedText !== '' && $input.val().length > 2) {
+                var typedValue = $input.val();
+                var zeroOpacityText = '<span style="opacity: 0;">' + typedValue + '</span>';
+                $suggestion.html(zeroOpacityText + suggestedText);
+                $('body > span:last-child').remove();
+                $suggestion.css({
+                    'top': ($input.position().top + $input.outerHeight() / 2 - $suggestion.outerHeight() / 2) + 'px',
+                    'left': ($input.position().left) + 'px',
+                });
+            } else {
+                $suggestion.text('');
+            }
+        };
+
+        $input.on('input', updateSuggestion);
+
+        // Add keydown event listener to handle the Tab key
+        $input.on('keydown', function (e) {
+            if (e.keyCode === 9) { // Tab key
+                e.preventDefault(); // Prevent the default tab key behavior (switching focus)
+                var suggestedText = $suggestion.text();
+                if (suggestedText !== '') {
+                    $input.val(suggestedText); // Replace the text in the $input element with the suggestion
+                    $suggestion.hide();
+                    $input.blur();
+                    $input.focus();
+                }
+            }
+        });
+
+        $input.on('focus', function () {
+            $suggestion.show();
+            updateSuggestion();
+        });
+
+        $input.on('blur', function () {
+            var suggestedText = $suggestion.text();
+            if (suggestedText !== '') {
+                $input.val(suggestedText); // Replace the text in the $input element with the suggestion
+            }
+            $suggestion.hide();
+        });
+
+        $input.on('resize', function () {
+            $suggestion.css('max-width', $input.innerWidth() - 2);
+        });
+    });
+};