diff --git a/.htaccess b/.htaccess index e6fbd29..10363e5 100644 --- a/.htaccess +++ b/.htaccess @@ -14,7 +14,7 @@ #Rezept Seite RewriteRule ^recipe/([0-9]+)$ ?site=recipe&number=$1 - #Rezepteditieren + #Rezept editieren RewriteRule ^edit-recipe/([0-9]+)$ ?site=edit-recipe&number=$1 #Loginseite diff --git a/bin/adduser.js b/bin/adduser.js index 486c94f..e68c806 100644 --- a/bin/adduser.js +++ b/bin/adduser.js @@ -30,8 +30,8 @@ function userPopover(title, text){ $("#newuser").data("toggle", "popover"); $("#newuser").data("container", "body"); $("#newuser").data("placement", "bottom"); + $("#newuser").data("trigger", "focus"); $("#newuser").data("html", true); - // $("#newuser").data("trigger", "focus"); $("#newuser").attr("title", title); $("#newuser").data("content", text); $("#newuser").popover('show'); diff --git a/bin/autocomplete.js b/bin/autocomplete.js index 31daf95..c211afa 100644 --- a/bin/autocomplete.js +++ b/bin/autocomplete.js @@ -1,80 +1,34 @@ -function autocomplete(textelement, values) { - var currentFocus; - textelement.addEventListener("input", function(e){ - var a, b, i, val = this.value; - closeAllLists(); - if(!val){ return false;} - currentFocus = -1; - a = document.createElement("div"); - a.setAttribute("id", this.id + "ingredientAutocomplete-list"); - a.setAttribute("class", "ingredientAutocomplete-items"); - this.parentNode.appendChild(a); - for (var i = 0; i < values.length; i++) { - if(values[i].substr(0, val.length).toUpperCase() == val.toUpperCase()){ - b = document.createElement("div"); - b.innerHTML = "" + values[i].substr(0, val.length) + ""; - b.innerHTML += values[i].substr(val.length); - b.innerHTML += ""; - b.addEventListener("click", function(e){ - textelement.value = this.getElementsByTagName("input")[0].value; - closeAllLists(); +function autocomplete() { + var apiurl = $(this).data("apiurl"); + var search = $(this).val(); + var elem = $(this); + if (search.length > $(this).data("strlen")) { + $.post({ + url: apiurl, + data: { + q: search + }, + success: function (data) { createAutocompleteDropdown(elem, JSON.parse(data)); } }); - a.appendChild(b); - } } - }); - textelement.addEventListener("keydown", function(e){ - var x = document.getElementById(this.id + "ingredientAutocomplete-list"); - if (x) {x.getElementsByTagName("div");} - if (e.keyCode == 40) { - currentFocus++; - addActive(x); - } - else if (e.keyCode == 38) { - currentFocus--; - addActive(x); - } - else if (e.keyCode == 13) { - e.preventDefault(); - if (currentFocus > -1) { - if (x) { - var y = $("#"+x.id).parent().find("input"); - x.childNodes[currentFocus].click(); - y.focus(); - } - } - } - }); - function addActive(x) { - if(!x) {return false;} - removeActive(x); - if(currentFocus>=x.childNodes.length){currentFocus=0;} - if(currentFocus<0){currentFocus = (x.childNodes.length-1);} - x.childNodes[currentFocus].classList.add("ingredientAutocomplete-active"); - } - function removeActive(x) { - for (var i = 0; i < x.childNodes.length; i++) { - x.childNodes[i].classList.remove("ingredientAutocomplete-active"); - } - } - function closeAllLists(elmnt){ - var x = document.getElementsByClassName("ingredientAutocomplete-items"); - for (var i = 0; i < x.length; i++) { - x[i].parentNode.removeChild(x[i]); - } - } - document.addEventListener("click", function(e){ - closeAllLists(e.target); - }); } -var values = []; -$(document).ready(function(){ - $.ajax({ - type: "POST", - url: "/api/recipes/auto", - data: {}, - success: function(data){ - values = data.split("||"); +function createAutocompleteDropdown(elem, values) { + var dropdownmenue = $('[aria-labelledby=' + elem.attr("id") + ']'); + var dropdownItems = dropdownmenue.find(".dropdown-item"); + dropdownItems.remove(); + + for (index = 0; index < values.length; index++) { + var value = values[index]; + var regex = new RegExp((elem).val(), "ig"); + var displayvalue = value.replace(regex, ("" + (elem).val() + "")); + + var button = $(""); + button.click(dropdownButtonClick); + + dropdownmenue.append(button); } - }); -}); +} +function dropdownButtonClick() { + var string = $(this).data("val"); + $('#' + $(this).attr("aria-textfield")).val(string); +} \ No newline at end of file diff --git a/bin/bootstrap.autocomplete.js b/bin/bootstrap.autocomplete.js new file mode 100644 index 0000000..2f87664 --- /dev/null +++ b/bin/bootstrap.autocomplete.js @@ -0,0 +1 @@ +!function(n){var i={};function s(e){if(i[e])return i[e].exports;var t=i[e]={i:e,l:!1,exports:{}};return n[e].call(t.exports,t,t.exports,s),t.l=!0,t.exports}s.m=n,s.c=i,s.d=function(e,t,n){s.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},s.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},s.t=function(t,e){if(1&e&&(t=s(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(s.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var i in t)s.d(n,i,function(e){return t[e]}.bind(null,i));return n},s.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return s.d(t,"a",t),t},s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.p="",s(s.s="./src/main.ts")}({"./src/dropdown.ts":function(module,__webpack_exports__,__webpack_require__){"use strict";eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Dropdown\", function() { return Dropdown; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"DropdownV4\", function() { return DropdownV4; });\n/*\n *\tDropdown class. Manages the dropdown drawing\n */\nvar Dropdown = /** @class */ (function () {\n function Dropdown(e, formatItemCbk, autoSelect, noResultsText) {\n this.initialized = false;\n this.shown = false;\n this.items = [];\n this._$el = e;\n this.formatItem = formatItemCbk;\n this.autoSelect = autoSelect;\n this.noResultsText = noResultsText;\n // initialize it in lazy mode to deal with glitches like modals\n // this.init();\n }\n Dropdown.prototype.init = function () {\n var _this = this;\n // Initialize dropdown\n var pos = $.extend({}, this._$el.position(), {\n height: this._$el[0].offsetHeight\n });\n // create element\n this._dd = $('