mirror of
https://github.com/cisagov/manage.get.gov.git
synced 2025-08-06 01:35:22 +02:00
Add a click listener on the 'from' list
This commit is contained in:
parent
7d36e4399e
commit
4e684a7cad
1 changed files with 79 additions and 70 deletions
|
@ -80,6 +80,76 @@ function checkElementThenAddToList(id, listOfElements, attempts) {
|
|||
}
|
||||
}
|
||||
|
||||
function customizeSelectElement(el, elId) {
|
||||
let changeLink = createAndCustomizeLink(
|
||||
el,
|
||||
elId,
|
||||
'related-widget-wrapper-link change-related',
|
||||
'Change selected item',
|
||||
'/public/admin/img/icon-changelink.svg',
|
||||
'Change',
|
||||
{
|
||||
'contacts': '/admin/registrar/contact/__fk__/change/?_to_field=id&_popup=1',
|
||||
'websites': '/admin/registrar/website/__fk__/change/?_to_field=id&_popup=1',
|
||||
'alternative_domains': '/admin/registrar/website/__fk__/change/?_to_field=id&_popup=1',
|
||||
},
|
||||
true,
|
||||
0
|
||||
);
|
||||
|
||||
let deleteLink = createAndCustomizeLink(
|
||||
el,
|
||||
elId,
|
||||
'related-widget-wrapper-link delete-related',
|
||||
'Delete selected item',
|
||||
'/public/admin/img/icon-deletelink.svg',
|
||||
'Delete',
|
||||
{
|
||||
'contacts': '/admin/registrar/contact/__fk__/delete/?_to_field=id&_popup=1',
|
||||
'websites': '/admin/registrar/website/__fk__/delete/?_to_field=id&_popup=1',
|
||||
'alternative_domains': '/admin/registrar/website/__fk__/delete/?_to_field=id&_popup=1',
|
||||
},
|
||||
true,
|
||||
2
|
||||
);
|
||||
|
||||
let viewLink = createAndCustomizeLink(
|
||||
el,
|
||||
elId,
|
||||
'related-widget-wrapper-link view-related',
|
||||
'View selected item',
|
||||
'/public/admin/img/icon-viewlink.svg',
|
||||
'View',
|
||||
{
|
||||
'contacts': '/admin/registrar/contact/__fk__/change/?_to_field=id',
|
||||
'websites': '/admin/registrar/website/__fk__/change/?_to_field=id',
|
||||
'alternative_domains': '/admin/registrar/website/__fk__/change/?_to_field=id',
|
||||
},
|
||||
false,
|
||||
3
|
||||
);
|
||||
|
||||
let fromList = el.closest('.selector').querySelector(".selector-available select");
|
||||
|
||||
fromList.addEventListener('click', function(event) {
|
||||
handleSelectClick(event, fromList, changeLink, deleteLink, viewLink);
|
||||
});
|
||||
|
||||
el.addEventListener('click', function(event) {
|
||||
handleSelectClick(event, el, changeLink, deleteLink, viewLink);
|
||||
});
|
||||
|
||||
// Disable buttons when the selectors are interated with (items are moved from one column to the other)
|
||||
let selectorButtons = [];
|
||||
selectorButtons.push(el.closest(".selector").querySelector(".selector-chooseall"));
|
||||
selectorButtons.push(el.closest(".selector").querySelector(".selector-add"));
|
||||
selectorButtons.push(el.closest(".selector").querySelector(".selector-remove"));
|
||||
|
||||
selectorButtons.forEach((selector) => {
|
||||
selector.addEventListener("click", ()=>{disableRelatedWidgetButtons(changeLink, deleteLink, viewLink)});
|
||||
});
|
||||
}
|
||||
|
||||
function createAndCustomizeLink(selectEl, selectElId, className, title, imgSrc, imgAlt, dataMappings, dataPopup, position) {
|
||||
// Create a link element
|
||||
var link = document.createElement('a');
|
||||
|
@ -124,77 +194,16 @@ function createAndCustomizeLink(selectEl, selectElId, className, title, imgSrc,
|
|||
return link;
|
||||
}
|
||||
|
||||
function customizeSelectElement(el, elId) {
|
||||
let changeLink = createAndCustomizeLink(
|
||||
el,
|
||||
elId,
|
||||
'related-widget-wrapper-link change-related',
|
||||
'Change selected item',
|
||||
'/public/admin/img/icon-changelink.svg',
|
||||
'Change',
|
||||
{
|
||||
'contacts': '/admin/registrar/contact/__fk__/change/?_to_field=id&_popup=1',
|
||||
'websites': '/admin/registrar/website/__fk__/change/?_to_field=id&_popup=1',
|
||||
'alternative_domains': '/admin/registrar/draftdomain/__fk__/change/?_to_field=id&_popup=1',
|
||||
},
|
||||
true,
|
||||
0
|
||||
);
|
||||
function handleSelectClick(event, selectElement, changeLink, deleteLink, viewLink) {
|
||||
// Access the target element that was clicked
|
||||
var clickedElement = event.target;
|
||||
|
||||
let deleteLink = createAndCustomizeLink(
|
||||
el,
|
||||
elId,
|
||||
'related-widget-wrapper-link delete-related',
|
||||
'Delete selected item',
|
||||
'/public/admin/img/icon-deletelink.svg',
|
||||
'Delete',
|
||||
{
|
||||
'contacts': '/admin/registrar/contact/__fk__/delete/?_to_field=id&_popup=1',
|
||||
'websites': '/admin/registrar/website/__fk__/delete/?_to_field=id&_popup=1',
|
||||
'alternative_domains': '/admin/registrar/draftdomain/__fk__/delete/?_to_field=id&_popup=1',
|
||||
},
|
||||
true,
|
||||
2
|
||||
);
|
||||
|
||||
let viewLink = createAndCustomizeLink(
|
||||
el,
|
||||
elId,
|
||||
'related-widget-wrapper-link view-related',
|
||||
'View selected item',
|
||||
'/public/admin/img/icon-viewlink.svg',
|
||||
'View',
|
||||
{
|
||||
'contacts': '/admin/registrar/contact/__fk__/change/?_to_field=id',
|
||||
'websites': '/admin/registrar/website/__fk__/change/?_to_field=id',
|
||||
'alternative_domains': '/admin/registrar/draftdomain/__fk__/change/?_to_field=id',
|
||||
},
|
||||
false,
|
||||
3
|
||||
);
|
||||
|
||||
el.addEventListener('click', function(event) {
|
||||
// Access the target element that was clicked
|
||||
var clickedElement = event.target;
|
||||
|
||||
// If one item is selected enable buttons, otherwise disable them
|
||||
if (el.selectedOptions.length === 1) {
|
||||
enableRelatedWidgetButtons(changeLink, deleteLink, viewLink, clickedElement.value);
|
||||
} else {
|
||||
disableRelatedWidgetButtons(changeLink, deleteLink, viewLink);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
// Disable buttons when the selectors are interated with (items are moved from one column to the other)
|
||||
let selectorButtons = [];
|
||||
selectorButtons.push(el.closest(".selector").querySelector(".selector-chooseall"));
|
||||
selectorButtons.push(el.closest(".selector").querySelector(".selector-add"));
|
||||
selectorButtons.push(el.closest(".selector").querySelector(".selector-remove"));
|
||||
|
||||
selectorButtons.forEach((selector) => {
|
||||
selector.addEventListener("click", ()=>{disableRelatedWidgetButtons(changeLink, deleteLink, viewLink)});
|
||||
});
|
||||
// If one item is selected, enable buttons; otherwise, disable them
|
||||
if (selectElement.selectedOptions.length === 1) {
|
||||
enableRelatedWidgetButtons(changeLink, deleteLink, viewLink, clickedElement.value);
|
||||
} else {
|
||||
disableRelatedWidgetButtons(changeLink, deleteLink, viewLink);
|
||||
}
|
||||
}
|
||||
|
||||
function disableRelatedWidgetButtons(changeLink, deleteLink, viewLink) {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue