관리-도구

편집 파일: control.js.map

{"mappings":"gBAEWA,EACHC,IADGD,SACHC,EAAMC,GAAGC,YAwDX,WAgDD,SAAUC,EAAYC,GACvBL,EAAA,wBAAwBM,YAAA,aACtBN,EAAA,wBAAYK,GAAAE,SAAA,aACZP,EAAA,+BAAYO,SAAA,gCACXP,EAAG,+BAAAK,EAAA,MAAAC,YAAA,oCA3CDE,EAPJJ,EAAA,YAOII,EAAWC,SAAeC,iBAAkB,yBAChCC,iBAGXC,KAAkCJ,GAAAK,SAAA,SAAAC,KAC9BC,iBAAoB,SAAM,SAAAC,GAC/B,IAAAX,EAAAY,KAAAC,aAAA,qBAEJjB,EAAAkB,gBAAAC,IAAAf,SAkBCJ,EAAwBkB,gBAAAE,MAAA,SAAEC,GACDlB,EAAAkB,qEA1FR,WAEnB,IAAMC,EAAgBd,SAASC,iBAC7B,qCAEF,GAAKa,EAAcZ,OAAnB,CAGA,IAAIa,EAAgB,GAEpB,GAAGC,MAAMb,KAAKW,GAAeV,SAAQ,SAAUa,GAC7C,IAAMC,EAAqBD,EAAaE,QAAQC,wBAC1CxB,EAASqB,EAAaE,QAAQE,mBAC9BC,EAAUL,EAAaE,QAAQI,aAEhCR,EAAcS,SAASN,IAC1BH,EAAcU,KAAKP,SAckDlB,SAAAC,iBAAA,uCAAAqB,EAAA,MAEnEI,EAAexB,QAAQ,GAAAc,MAAAb,KAAAuB,GAA2BtB,SAAA,SAAAuB,GAGvDA,EAAAR,QAAAC,wBAAAF,EAEoDS,EAAAR,QAAAE,mBAAAzB,UAQnDQ,SAAe,SACQwB,GAExB,IAAAC,EAAAtC,EAAA,sBAAAqC,EAAA,0BACFC,EAAAC,KAAA,yBAAAF,GAEKC,EAAeE,SAAO,sBAAAH,EAAA","sources":["src/control.js"],"sourcesContent":["import \"./control.scss\";\r\n\r\n(function ($) {\r\n const api = wp.customize;\r\n\r\n const setupDevices = () => {\r\n // Get all controls which are responsive-able (not the device control it self).\r\n const childControls = document.querySelectorAll(\r\n \"[data-kirki-parent-responsive-id]\"\r\n );\r\n if (!childControls.length) return;\r\n\r\n // Responsive ids are collection of the id of the responsive controls (the device controls).\r\n let responsiveIds = [];\r\n\r\n [].slice.call(childControls).forEach(function (childControl) {\r\n const parentResponsiveId = childControl.dataset.kirkiParentResponsiveId;\r\n const device = childControl.dataset.kirkiDevicePreview;\r\n const setting = childControl.dataset.kirkiSetting;\r\n\r\n if (!responsiveIds.includes(parentResponsiveId)) {\r\n responsiveIds.push(parentResponsiveId);\r\n }\r\n\r\n /**\r\n * Grouped controls are collection of control which contains some child-controls.\r\n * Example of grouped controls: field-dimensions, field-typography, field-multicolor.\r\n */\r\n const groupedControls = document.querySelectorAll(\r\n '[data-kirki-parent-control-setting=\"' + setting + '\"]'\r\n );\r\n\r\n // Check if childControl is a field that groups other controls.\r\n if (groupedControls.length) {\r\n [].slice.call(groupedControls).forEach(function (groupedControl) {\r\n // Inherit the parentResponsiveId & device from the group's parent.\r\n groupedControl.dataset.kirkiParentResponsiveId = parentResponsiveId;\r\n groupedControl.dataset.kirkiDevicePreview = device;\r\n });\r\n }\r\n });\r\n\r\n // Move the device icons next to the control's title.\r\n responsiveIds.forEach(function (responsiveId) {\r\n const $deviceButtons = $(\r\n \"#customize-control-\" + responsiveId + \" .kirki-device-buttons\"\r\n );\r\n\r\n $deviceButtons.attr(\"data-kirki-devices-for\", responsiveId);\r\n\r\n $deviceButtons.appendTo(\r\n \"#customize-control-\" + responsiveId + \" .customize-control-title\"\r\n );\r\n });\r\n };\r\n\r\n const setupPreview = () => {\r\n function init() {\r\n switchDevice(\"desktop\"); // Initial state.\r\n setupDeviceClicks();\r\n syncPreviewButtons();\r\n }\r\n\r\n function setupDeviceClicks() {\r\n const deviceButtons = document.querySelectorAll(\".kirki-device-button\");\r\n if (!deviceButtons.length) return;\r\n\r\n // Loop through Kirki device buttons and assign the click event.\r\n [].slice.call(deviceButtons).forEach(function (deviceButton) {\r\n deviceButton.addEventListener(\"click\", function (e) {\r\n var device = this.getAttribute(\"data-kirki-device\");\r\n\r\n // Trigger WordPress device event.\r\n api.previewedDevice.set(device);\r\n });\r\n });\r\n }\r\n\r\n /**\r\n * Sync device preview button from WordPress to Kirki and vice versa.\r\n */\r\n function syncPreviewButtons() {\r\n // Bind device changes from WordPress default.\r\n api.previewedDevice.bind(function (newDevice) {\r\n switchDevice(newDevice);\r\n });\r\n }\r\n\r\n /**\r\n * Setup device preview.\r\n *\r\n * @param string device The device (mobile, tablet, or desktop).\r\n */\r\n function switchDevice(device) {\r\n $(\".kirki-device-button\").removeClass(\"is-active\");\r\n $(\".kirki-device-button-\" + device).addClass(\"is-active\");\r\n\r\n $(\"[data-kirki-device-preview]\").addClass(\"kirki-responsive-item-hidden\");\r\n $('[data-kirki-device-preview=\"' + device + '\"]').removeClass(\r\n \"kirki-responsive-item-hidden\"\r\n );\r\n }\r\n\r\n init();\r\n };\r\n\r\n // Run setupDevices & setupPreview after the customizer is ready.\r\n wp.customize.bind(\"ready\", function () {\r\n setTimeout(function () {\r\n setupDevices();\r\n setupPreview();\r\n }, 250);\r\n });\r\n})(jQuery);\r\n"],"names":["$","api","wp","customize","switchDevice","device","removeClass","addClass","deviceButtons","document","querySelectorAll","length","call","forEach","deviceButton","addEventListener","e","this","getAttribute","previewedDevice","set","bind","newDevice","childControls","responsiveIds","slice","childControl","parentResponsiveId","dataset","kirkiParentResponsiveId","kirkiDevicePreview","setting","kirkiSetting","includes","push","groupedControls","groupedControl","responsiveId","$deviceButtons","attr","appendTo"],"version":3,"file":"control.js.map"}