123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718 |
- /**
- * Main
- */
-
- 'use strict';
-
- var separator_element = '<div class="separator" ondrop="drop(event)" ondragover="allowDrop(event)"></div>';
- function allowDrop(ev) {
- ev.preventDefault();
- }
-
- $.each($('.toolkit'),function(index){
- $(this).on('dragstart',function(ev){
- console.log($(this).attr('act'));
- ev.originalEvent.dataTransfer.setData("type", $(this).attr('act'));
- })
- });
-
-
- function drop(ev) {
- ev.preventDefault();
- var data = ev.dataTransfer.getData("type");
- if(data == 'column1'){
- var element = document.createElement('div');
- element.innerHTML = '<div class="row"><div class="col-12">'+separator_element+'</div></div>';
- element = element.firstChild;
- }else if(data == 'column2'){
- var element = document.createElement('div');
- element.innerHTML = '<div class="row"><div class="col-6">'+separator_element+'</div><div class="col-6">'+separator_element+'</div></div>';
- element = element.firstChild;
- }else if(data == 'column3'){
- var element = document.createElement('div');
- element.innerHTML = '<div class="row"><div class="col-4">'+separator_element+'</div><div class="col-4">'+separator_element+'</div><div class="col-4">'+separator_element+'</div></div>';
- element = element.firstChild;
- }else if(data == 'column4'){
- var element = document.createElement('div');
- element.innerHTML = '<div class="row"><div class="col-3">'+separator_element+'</div><div class="col-3">'+separator_element+'</div><div class="col-3">'+separator_element+'</div><div class="col-3">'+separator_element+'</div></div>';
- element = element.firstChild;
- }else if(data == 'textarea'){
- var element = document.createElement('div');
- element.innerHTML = '<textarea style="width:100%"></textarea>';
- element = element.firstChild;
- }else if(data == 'text'){
- var element = document.createElement('div');
- element.innerHTML = '<input style="width:100%"></input>';
- element = element.firstChild;
- }else if(data == 'picture'){
- var element = document.createElement('div');
- element.innerHTML = '<input type="file" id="imageInput" accept="image/*" onchange="addImageFromGallery()">';
- element = element.firstChild;
- }else if(data == 'button'){
- var element = document.createElement('div');
- element.innerHTML = '<button type="submit" name="submit" class="btn-submit solid"></button>';
- element = element.firstChild;
- }else{
- var element = document.createElement('textarea');
- }
-
- if (ev.target.parentNode) {
- var condision = document.createElement('div');
- condision.innerHTML = separator_element;
- const lists = ev.target.parentNode.insertBefore(condision.firstChild, ev.target);
- const list = ev.target.parentNode.insertBefore(element, ev.target);
- } else {
- console.error("parentNode tidak tersedia");
- }
-
- // ev.target.appendChild(document.getElementById(data));
- // const list = ev.target.parentNode.insertBefore(element,ev.target);
- }
-
-
- window.isRtl = window.Helpers.isRtl();
- window.isDarkStyle = window.Helpers.isDarkStyle();
- let menu,
- animate,
- isHorizontalLayout = false;
-
- if (document.getElementById('layout-menu')) {
- isHorizontalLayout = document.getElementById('layout-menu').classList.contains('menu-horizontal');
- }
-
- (function () {
- setTimeout(function () {
- window.Helpers.initCustomOptionCheck();
- }, 1000);
-
- if (typeof Waves !== 'undefined') {
- Waves.init();
- Waves.attach(".btn[class*='btn-']:not([class*='btn-outline-']):not([class*='btn-label-'])", ['waves-light']);
- Waves.attach("[class*='btn-outline-']");
- Waves.attach("[class*='btn-label-']");
- Waves.attach('.pagination .page-item .page-link');
- }
-
- // Initialize menu
- //-----------------
-
- let layoutMenuEl = document.querySelectorAll('#layout-menu');
- layoutMenuEl.forEach(function (element) {
- menu = new Menu(element, {
- orientation: isHorizontalLayout ? 'horizontal' : 'vertical',
- closeChildren: isHorizontalLayout ? true : false,
- // ? This option only works with Horizontal menu
- showDropdownOnHover: localStorage.getItem('templateCustomizer-' + templateName + '--ShowDropdownOnHover') // If value(showDropdownOnHover) is set in local storage
- ? localStorage.getItem('templateCustomizer-' + templateName + '--ShowDropdownOnHover') === 'true' // Use the local storage value
- : window.templateCustomizer !== undefined // If value is set in config.js
- ? window.templateCustomizer.settings.defaultShowDropdownOnHover // Use the config.js value
- : true // Use this if you are not using the config.js and want to set value directly from here
- });
- // Change parameter to true if you want scroll animation
- window.Helpers.scrollToActive((animate = false));
- window.Helpers.mainMenu = menu;
- });
-
- // Initialize menu togglers and bind click on each
- let menuToggler = document.querySelectorAll('.layout-menu-toggle');
- menuToggler.forEach(item => {
- item.addEventListener('click', event => {
- event.preventDefault();
- window.Helpers.toggleCollapsed();
- // Enable menu state with local storage support if enableMenuLocalStorage = true from config.js
- if (config.enableMenuLocalStorage && !window.Helpers.isSmallScreen()) {
- try {
- localStorage.setItem(
- 'templateCustomizer-' + templateName + '--LayoutCollapsed',
- String(window.Helpers.isCollapsed())
- );
- // Update customizer checkbox state on click of menu toggler
- let layoutCollapsedCustomizerOptions = document.querySelector('.template-customizer-layouts-options');
- if (layoutCollapsedCustomizerOptions) {
- let layoutCollapsedVal = window.Helpers.isCollapsed() ? 'collapsed' : 'expanded';
- layoutCollapsedCustomizerOptions.querySelector(`input[value="${layoutCollapsedVal}"]`).click();
- }
- } catch (e) {}
- }
- });
- });
-
- // Menu swipe gesture
-
- // Detect swipe gesture on the target element and call swipe In
- window.Helpers.swipeIn('.drag-target', function (e) {
- window.Helpers.setCollapsed(false);
- });
-
- // Detect swipe gesture on the target element and call swipe Out
- window.Helpers.swipeOut('#layout-menu', function (e) {
- if (window.Helpers.isSmallScreen()) window.Helpers.setCollapsed(true);
- });
-
- // Display in main menu when menu scrolls
- let menuInnerContainer = document.getElementsByClassName('menu-inner'),
- menuInnerShadow = document.getElementsByClassName('menu-inner-shadow')[0];
- if (menuInnerContainer.length > 0 && menuInnerShadow) {
- menuInnerContainer[0].addEventListener('ps-scroll-y', function () {
- if (this.querySelector('.ps__thumb-y').offsetTop) {
- menuInnerShadow.style.display = 'block';
- } else {
- menuInnerShadow.style.display = 'none';
- }
- });
- }
-
- // Update light/dark image based on current style
- function switchImage(style) {
- if (style === 'system') {
- if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
- style = 'dark';
- } else {
- style = 'light';
- }
- }
- const switchImagesList = [].slice.call(document.querySelectorAll('[data-app-' + style + '-img]'));
- switchImagesList.map(function (imageEl) {
- const setImage = imageEl.getAttribute('data-app-' + style + '-img');
- imageEl.src = assetsPath + 'img/' + setImage; // Using window.assetsPath to get the exact relative path
- });
- }
-
- //Style Switcher (Light/Dark/System Mode)
- let styleSwitcher = document.querySelector('.dropdown-style-switcher');
-
- // Get style from local storage or use 'system' as default
- let storedStyle =
- localStorage.getItem('templateCustomizer-' + templateName + '--Style') || //if no template style then use Customizer style
- (window.templateCustomizer?.settings?.defaultStyle ?? 'light'); //!if there is no Customizer then use default style as light
-
- // Set style on click of style switcher item if template customizer is enabled
- if (window.templateCustomizer && styleSwitcher) {
- let styleSwitcherItems = [].slice.call(styleSwitcher.children[1].querySelectorAll('.dropdown-item'));
- styleSwitcherItems.forEach(function (item) {
- item.addEventListener('click', function () {
- let currentStyle = this.getAttribute('data-theme');
- if (currentStyle === 'light') {
- window.templateCustomizer.setStyle('light');
- } else if (currentStyle === 'dark') {
- window.templateCustomizer.setStyle('dark');
- } else {
- window.templateCustomizer.setStyle('system');
- }
- });
- });
-
- // Update style switcher icon based on the stored style
-
- const styleSwitcherIcon = styleSwitcher.querySelector('i');
-
- if (storedStyle === 'light') {
- styleSwitcherIcon.classList.add('ti-sun');
- new bootstrap.Tooltip(styleSwitcherIcon, {
- title: 'Light Mode',
- fallbackPlacements: ['bottom']
- });
- } else if (storedStyle === 'dark') {
- styleSwitcherIcon.classList.add('ti-moon');
- new bootstrap.Tooltip(styleSwitcherIcon, {
- title: 'Dark Mode',
- fallbackPlacements: ['bottom']
- });
- } else {
- styleSwitcherIcon.classList.add('ti-device-desktop');
- new bootstrap.Tooltip(styleSwitcherIcon, {
- title: 'System Mode',
- fallbackPlacements: ['bottom']
- });
- }
- }
-
- // Run switchImage function based on the stored style
- switchImage(storedStyle);
-
- // Internationalization (Language Dropdown)
- // ---------------------------------------
-
- if (typeof i18next !== 'undefined' && typeof i18NextHttpBackend !== 'undefined') {
- i18next
- .use(i18NextHttpBackend)
- .init({
- lng: window.templateCustomizer ? window.templateCustomizer.settings.lang : 'en',
- debug: false,
- fallbackLng: 'en',
- backend: {
- loadPath: assetsPath + 'json/locales/{{lng}}.json'
- },
- returnObjects: true
- })
- .then(function (t) {
- localize();
- });
- }
-
- let languageDropdown = document.getElementsByClassName('dropdown-language');
-
- if (languageDropdown.length) {
- let dropdownItems = languageDropdown[0].querySelectorAll('.dropdown-item');
-
- for (let i = 0; i < dropdownItems.length; i++) {
- dropdownItems[i].addEventListener('click', function () {
- let currentLanguage = this.getAttribute('data-language');
- let textDirection = this.getAttribute('data-text-direction');
-
- for (let sibling of this.parentNode.children) {
- var siblingEle = sibling.parentElement.parentNode.firstChild;
-
- // Loop through each sibling and push to the array
- while (siblingEle) {
- if (siblingEle.nodeType === 1 && siblingEle !== siblingEle.parentElement) {
- siblingEle.querySelector('.dropdown-item').classList.remove('active');
- }
- siblingEle = siblingEle.nextSibling;
- }
- }
- this.classList.add('active');
-
- i18next.changeLanguage(currentLanguage, (err, t) => {
- window.templateCustomizer ? window.templateCustomizer.setLang(currentLanguage) : '';
- directionChange(textDirection);
- if (err) return console.log('something went wrong loading', err);
- localize();
- });
- });
- }
- function directionChange(textDirection) {
- if (textDirection === 'rtl') {
- if (localStorage.getItem('templateCustomizer-' + templateName + '--Rtl') !== 'true')
- window.templateCustomizer ? window.templateCustomizer.setRtl(true) : '';
- } else {
- if (localStorage.getItem('templateCustomizer-' + templateName + '--Rtl') === 'true')
- window.templateCustomizer ? window.templateCustomizer.setRtl(false) : '';
- }
- }
- }
-
- function localize() {
- let i18nList = document.querySelectorAll('[data-i18n]');
- // Set the current language in dd
- let currentLanguageEle = document.querySelector('.dropdown-item[data-language="' + i18next.language + '"]');
-
- if (currentLanguageEle) {
- currentLanguageEle.click();
- }
-
- i18nList.forEach(function (item) {
- item.innerHTML = i18next.t(item.dataset.i18n);
- });
- }
-
- // Notification
- // ------------
- const notificationMarkAsReadAll = document.querySelector('.dropdown-notifications-all');
- const notificationMarkAsReadList = document.querySelectorAll('.dropdown-notifications-read');
-
- // Notification: Mark as all as read
- if (notificationMarkAsReadAll) {
- notificationMarkAsReadAll.addEventListener('click', event => {
- notificationMarkAsReadList.forEach(item => {
- item.closest('.dropdown-notifications-item').classList.add('marked-as-read');
- });
- });
- }
- // Notification: Mark as read/unread onclick of dot
- if (notificationMarkAsReadList) {
- notificationMarkAsReadList.forEach(item => {
- item.addEventListener('click', event => {
- item.closest('.dropdown-notifications-item').classList.toggle('marked-as-read');
- });
- });
- }
-
- // Notification: Mark as read/unread onclick of dot
- const notificationArchiveMessageList = document.querySelectorAll('.dropdown-notifications-archive');
- notificationArchiveMessageList.forEach(item => {
- item.addEventListener('click', event => {
- item.closest('.dropdown-notifications-item').remove();
- });
- });
-
- // Init helpers & misc
- // --------------------
-
- // Init BS Tooltip
- const tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
- tooltipTriggerList.map(function (tooltipTriggerEl) {
- return new bootstrap.Tooltip(tooltipTriggerEl);
- });
-
- // Accordion active class
- const accordionActiveFunction = function (e) {
- if (e.type == 'show.bs.collapse' || e.type == 'show.bs.collapse') {
- e.target.closest('.accordion-item').classList.add('active');
- } else {
- e.target.closest('.accordion-item').classList.remove('active');
- }
- };
-
- const accordionTriggerList = [].slice.call(document.querySelectorAll('.accordion'));
- const accordionList = accordionTriggerList.map(function (accordionTriggerEl) {
- accordionTriggerEl.addEventListener('show.bs.collapse', accordionActiveFunction);
- accordionTriggerEl.addEventListener('hide.bs.collapse', accordionActiveFunction);
- });
-
- // If layout is RTL add .dropdown-menu-end class to .dropdown-menu
- // if (isRtl) {
- // Helpers._addClass('dropdown-menu-end', document.querySelectorAll('#layout-navbar .dropdown-menu'));
- // }
-
- // Auto update layout based on screen size
- window.Helpers.setAutoUpdate(true);
-
- // Toggle Password Visibility
- window.Helpers.initPasswordToggle();
-
- // Speech To Text
- window.Helpers.initSpeechToText();
-
- // Init PerfectScrollbar in Navbar Dropdown (i.e notification)
- window.Helpers.initNavbarDropdownScrollbar();
-
- let horizontalMenuTemplate = document.querySelector("[data-template^='horizontal-menu']");
- if (horizontalMenuTemplate) {
- // if screen size is small then set navbar fixed
- if (window.innerWidth < window.Helpers.LAYOUT_BREAKPOINT) {
- window.Helpers.setNavbarFixed('fixed');
- } else {
- window.Helpers.setNavbarFixed('');
- }
- }
-
- // On window resize listener
- // -------------------------
- window.addEventListener(
- 'resize',
- function (event) {
- // Hide open search input and set value blank
- if (window.innerWidth >= window.Helpers.LAYOUT_BREAKPOINT) {
- if (document.querySelector('.search-input-wrapper')) {
- document.querySelector('.search-input-wrapper').classList.add('d-none');
- document.querySelector('.search-input').value = '';
- }
- }
- // Horizontal Layout : Update menu based on window size
- if (horizontalMenuTemplate) {
- // if screen size is small then set navbar fixed
- if (window.innerWidth < window.Helpers.LAYOUT_BREAKPOINT) {
- window.Helpers.setNavbarFixed('fixed');
- } else {
- window.Helpers.setNavbarFixed('');
- }
- setTimeout(function () {
- if (window.innerWidth < window.Helpers.LAYOUT_BREAKPOINT) {
- if (document.getElementById('layout-menu')) {
- if (document.getElementById('layout-menu').classList.contains('menu-horizontal')) {
- menu.switchMenu('vertical');
- }
- }
- } else {
- if (document.getElementById('layout-menu')) {
- if (document.getElementById('layout-menu').classList.contains('menu-vertical')) {
- menu.switchMenu('horizontal');
- }
- }
- }
- }, 100);
- }
- },
- true
- );
-
- // Manage menu expanded/collapsed with templateCustomizer & local storage
- //------------------------------------------------------------------
-
- // If current layout is horizontal OR current window screen is small (overlay menu) than return from here
- if (isHorizontalLayout || window.Helpers.isSmallScreen()) {
- return;
- }
-
- // If current layout is vertical and current window screen is > small
-
- // Auto update menu collapsed/expanded based on the themeConfig
- if (typeof TemplateCustomizer !== 'undefined') {
- if (window.templateCustomizer.settings.defaultMenuCollapsed) {
- window.Helpers.setCollapsed(true, false);
- } else {
- window.Helpers.setCollapsed(false, false);
- }
- }
-
- // Manage menu expanded/collapsed state with local storage support If enableMenuLocalStorage = true in config.js
- if (typeof config !== 'undefined') {
- if (config.enableMenuLocalStorage) {
- try {
- if (localStorage.getItem('templateCustomizer-' + templateName + '--LayoutCollapsed') !== null)
- window.Helpers.setCollapsed(
- localStorage.getItem('templateCustomizer-' + templateName + '--LayoutCollapsed') === 'true',
- false
- );
- } catch (e) {}
- }
- }
- })();
-
- // ! Removed following code if you do't wish to use jQuery. Remember that navbar search functionality will stop working on removal.
- if (typeof $ !== 'undefined') {
- $(function () {
- // ! TODO: Required to load after DOM is ready, did this now with jQuery ready.
- window.Helpers.initSidebarToggle();
- // Toggle Universal Sidebar
-
- // Navbar Search with autosuggest (typeahead)
- // ? You can remove the following JS if you don't want to use search functionality.
- //----------------------------------------------------------------------------------
-
- var searchToggler = $('.search-toggler'),
- searchInputWrapper = $('.search-input-wrapper'),
- searchInput = $('.search-input'),
- contentBackdrop = $('.content-backdrop');
-
- // Open search input on click of search icon
- if (searchToggler.length) {
- searchToggler.on('click', function () {
- if (searchInputWrapper.length) {
- searchInputWrapper.toggleClass('d-none');
- searchInput.focus();
- }
- });
- }
- // Open search on 'CTRL+/'
- $(document).on('keydown', function (event) {
- let ctrlKey = event.ctrlKey,
- slashKey = event.which === 191;
-
- if (ctrlKey && slashKey) {
- if (searchInputWrapper.length) {
- searchInputWrapper.toggleClass('d-none');
- searchInput.focus();
- }
- }
- });
- // Note: Following code is required to update container class of typeahead dropdown width on focus of search input. setTimeout is required to allow time to initiate Typeahead UI.
- setTimeout(function () {
- var twitterTypeahead = $('.twitter-typeahead');
- searchInput.on('focus', function () {
- if (searchInputWrapper.hasClass('container-xxl')) {
- searchInputWrapper.find(twitterTypeahead).addClass('container-xxl');
- twitterTypeahead.removeClass('container-fluid');
- } else if (searchInputWrapper.hasClass('container-fluid')) {
- searchInputWrapper.find(twitterTypeahead).addClass('container-fluid');
- twitterTypeahead.removeClass('container-xxl');
- }
- });
- }, 10);
-
- if (searchInput.length) {
- // Filter config
- var filterConfig = function (data) {
- return function findMatches(q, cb) {
- let matches;
- matches = [];
- data.filter(function (i) {
- if (i.name.toLowerCase().startsWith(q.toLowerCase())) {
- matches.push(i);
- } else if (
- !i.name.toLowerCase().startsWith(q.toLowerCase()) &&
- i.name.toLowerCase().includes(q.toLowerCase())
- ) {
- matches.push(i);
- matches.sort(function (a, b) {
- return b.name < a.name ? 1 : -1;
- });
- } else {
- return [];
- }
- });
- cb(matches);
- };
- };
-
- // Search JSON
- var searchJson = 'search-vertical.json'; // For vertical layout
- if ($('#layout-menu').hasClass('menu-horizontal')) {
- var searchJson = 'search-horizontal.json'; // For vertical layout
- }
- // Search API AJAX call
- var searchData = $.ajax({
- url: assetsPath + 'json/' + searchJson, //? Use your own search api instead
- dataType: 'json',
- async: false
- }).responseJSON;
- // Init typeahead on searchInput
- searchInput.each(function () {
- var $this = $(this);
- searchInput
- .typeahead(
- {
- hint: false,
- classNames: {
- menu: 'tt-menu navbar-search-suggestion',
- cursor: 'active',
- suggestion: 'suggestion d-flex justify-content-between px-3 py-2 w-100'
- }
- },
- // ? Add/Update blocks as per need
- // Pages
- {
- name: 'pages',
- display: 'name',
- limit: 5,
- source: filterConfig(searchData.pages),
- templates: {
- header: '<h6 class="suggestions-header text-primary mb-0 mx-3 mt-3 pb-2">Pages</h6>',
- suggestion: function ({ url, icon, name }) {
- return (
- '<a href="' +
- url +
- '">' +
- '<div>' +
- '<i class="ti ' +
- icon +
- ' me-2"></i>' +
- '<span class="align-middle">' +
- name +
- '</span>' +
- '</div>' +
- '</a>'
- );
- },
- notFound:
- '<div class="not-found px-3 py-2">' +
- '<h6 class="suggestions-header text-primary mb-2">Pages</h6>' +
- '<p class="py-2 mb-0"><i class="ti ti-alert-circle ti-xs me-2"></i> No Results Found</p>' +
- '</div>'
- }
- },
- // Files
- {
- name: 'files',
- display: 'name',
- limit: 4,
- source: filterConfig(searchData.files),
- templates: {
- header: '<h6 class="suggestions-header text-primary mb-0 mx-3 mt-3 pb-2">Files</h6>',
- suggestion: function ({ src, name, subtitle, meta }) {
- return (
- '<a href="javascript:;">' +
- '<div class="d-flex w-50">' +
- '<img class="me-3" src="' +
- assetsPath +
- src +
- '" alt="' +
- name +
- '" height="32">' +
- '<div class="w-75">' +
- '<h6 class="mb-0">' +
- name +
- '</h6>' +
- '<small class="text-muted">' +
- subtitle +
- '</small>' +
- '</div>' +
- '</div>' +
- '<small class="text-muted">' +
- meta +
- '</small>' +
- '</a>'
- );
- },
- notFound:
- '<div class="not-found px-3 py-2">' +
- '<h6 class="suggestions-header text-primary mb-2">Files</h6>' +
- '<p class="py-2 mb-0"><i class="ti ti-alert-circle ti-xs me-2"></i> No Results Found</p>' +
- '</div>'
- }
- },
- // Members
- {
- name: 'members',
- display: 'name',
- limit: 4,
- source: filterConfig(searchData.members),
- templates: {
- header: '<h6 class="suggestions-header text-primary mb-0 mx-3 mt-3 pb-2">Members</h6>',
- suggestion: function ({ name, src, subtitle }) {
- return (
- '<a href="app-user-view-account.html">' +
- '<div class="d-flex align-items-center">' +
- '<img class="rounded-circle me-3" src="' +
- assetsPath +
- src +
- '" alt="' +
- name +
- '" height="32">' +
- '<div class="user-info">' +
- '<h6 class="mb-0">' +
- name +
- '</h6>' +
- '<small class="text-muted">' +
- subtitle +
- '</small>' +
- '</div>' +
- '</div>' +
- '</a>'
- );
- },
- notFound:
- '<div class="not-found px-3 py-2">' +
- '<h6 class="suggestions-header text-primary mb-2">Members</h6>' +
- '<p class="py-2 mb-0"><i class="ti ti-alert-circle ti-xs me-2"></i> No Results Found</p>' +
- '</div>'
- }
- }
- )
- //On typeahead result render.
- .bind('typeahead:render', function () {
- // Show content backdrop,
- contentBackdrop.addClass('show').removeClass('fade');
- })
- // On typeahead select
- .bind('typeahead:select', function (ev, suggestion) {
- // Open selected page
- if (suggestion.url) {
- window.location = suggestion.url;
- }
- })
- // On typeahead close
- .bind('typeahead:close', function () {
- // Clear search
- searchInput.val('');
- $this.typeahead('val', '');
- // Hide search input wrapper
- searchInputWrapper.addClass('d-none');
- // Fade content backdrop
- contentBackdrop.addClass('fade').removeClass('show');
- });
-
- // On searchInput keyup, Fade content backdrop if search input is blank
- searchInput.on('keyup', function () {
- if (searchInput.val() == '') {
- contentBackdrop.addClass('fade').removeClass('show');
- }
- });
- });
-
- // Init PerfectScrollbar in search result
- var psSearch;
- $('.navbar-search-suggestion').each(function () {
- psSearch = new PerfectScrollbar($(this)[0], {
- wheelPropagation: false,
- suppressScrollX: true
- });
- });
-
- searchInput.on('keyup', function () {
- psSearch.update();
- });
- }
- });
- }
|