Difference between revisions of "Widget:DCTList"

From LINKS Community Center
Jump to: navigation, search
Line 341: Line 341:
 
                 + '|?Has_description=' + DESC_KEY;
 
                 + '|?Has_description=' + DESC_KEY;
 
             const functionsQueryResponse = await fetch(getQueryUrl(functionsQuery)).then(response => response.json());
 
             const functionsQueryResponse = await fetch(getQueryUrl(functionsQuery)).then(response => response.json());
−
 
−
            console.log(functionsQueryResponse)
 
  
 
             const sortOrder = Object.keys(fnImages);
 
             const sortOrder = Object.keys(fnImages);
Line 360: Line 358:
 
                     );
 
                     );
 
                 });
 
                 });
−
 
−
                console.log(functionsData)
 
  
 
             const allFunctions = Array.from(functionsData.values(), entry => entry[FUNC_KEY]).flat();
 
             const allFunctions = Array.from(functionsData.values(), entry => entry[FUNC_KEY]).flat();
Line 437: Line 433:
  
 
                 functionsCheck = checkEmpty && checkNonempty;
 
                 functionsCheck = checkEmpty && checkNonempty;
 +
                // TODO: Empty should no longer exist, once every category is fully listed in the filter.
 +
                // TODO: The filtering of functions therefore should be reduced to nonempty only.
 
             }
 
             }
  
Line 451: Line 449:
 
                 ? filterState.hasUC === dct.hasUC
 
                 ? filterState.hasUC === dct.hasUC
 
                 : true;
 
                 : true;
 +
 
             return sourcesCheck && functionsCheck && businessModelCheck && dmUseCheck && ucCheck;
 
             return sourcesCheck && functionsCheck && businessModelCheck && dmUseCheck && ucCheck;
 
         }
 
         }
Line 470: Line 469:
 
                 const funcOpts = new Map();
 
                 const funcOpts = new Map();
 
                 functionFilterBlocks.forEach(block => {
 
                 functionFilterBlocks.forEach(block => {
 +
                    // This is still valid, since function blocks still have whole-category checkboxes.
 +
                    // They have simply been hidden.
 
                     const cat = block.querySelector('input.func-cat');
 
                     const cat = block.querySelector('input.func-cat');
 
                     if (cat.checked) {
 
                     if (cat.checked) {
Line 504: Line 505:
 
             Array.from(functionsData).forEach(([fnCat, fnInfo], index) => {
 
             Array.from(functionsData).forEach(([fnCat, fnInfo], index) => {
 
                 const identifier = 'func-filter-' + escapeAttr(fnCat);
 
                 const identifier = 'func-filter-' + escapeAttr(fnCat);
−
                 funcFilterHtml += (index < 4)
+
                 funcFilterHtml +=  
−
                    ?
 
−
                    // Disable the selection of categories with subfunctions, as it is not clear how their semantics should work
 
−
                    // Removing the for-property for the label as well to prevent activating the checkbox
 
−
                    `<div class="func-filter-block">
 
−
                        <div>
 
−
                            <input type="checkbox" id="${identifier}" value="${fnCat}" class="func-cat" style="display:none;">
 
−
                            <label title="${fnInfo[DESC_KEY]}"><img src="${fnImages[fnCat]}"> ${fnCat}</label>
 
−
                        </div>`
 
−
                    :
 
−
                    // The following is the original. TODO: This should be cleared up when all categories have subfunctions
 
 
                     `<div class="func-filter-block">
 
                     `<div class="func-filter-block">
 
                         <div>
 
                         <div>
 
                             <input type="checkbox" id="${identifier}" value="${fnCat}" class="func-cat">
 
                             <input type="checkbox" id="${identifier}" value="${fnCat}" class="func-cat">
 
                             <label for="${identifier}" title="${fnInfo[DESC_KEY]}"><img src="${fnImages[fnCat]}"> ${fnCat}</label>
 
                             <label for="${identifier}" title="${fnInfo[DESC_KEY]}"><img src="${fnImages[fnCat]}"> ${fnCat}</label>
−
                         </div>`
+
                         </div>`;
  
 
                 // add subfunctions  
 
                 // add subfunctions  
−
                 if (index < 4) {
+
                 funcFilterHtml += '<div class="subfunc-filter-block">';
−
                    funcFilterHtml += '<div class="subfunc-filter-block">';
+
                for (const func of fnInfo.functions) {
−
                    for (const func of fnInfo.functions) {
+
                    const subfuncId = 'subfunc-filter-' + escapeAttr(func);
−
                        const subfuncId = 'subfunc-filter-' + escapeAttr(func);
+
                    funcFilterHtml +=
−
                        funcFilterHtml +=
+
                        `<div>
−
                            `<div>
+
                            <input type="checkbox" id="${subfuncId}" value="${func}">
−
                                <input type="checkbox" id="${subfuncId}" value="${func}">
+
                            <label for="${subfuncId}">${func}</label>
−
                                <label for="${subfuncId}">${func}</label>
+
                        </div>`;
−
                            </div>`;
 
−
                    }
 
−
                    funcFilterHtml += '</div>';
 
 
                 }
 
                 }
 +
                funcFilterHtml += '</div>';
 +
 
                 funcFilterHtml += '</div>';
 
                 funcFilterHtml += '</div>';
 
             });
 
             });

Revision as of 16:31, 25 July 2023

DCT list widget.
Currently in use – do not modify!

Retrieved from "https://links.communitycenter.eu/index.php?title=Widget:DCTList&oldid=10632"