Vorlage:SH
Aus BogenWiki
(Unterschied zwischen Versionen)
Nugman (Diskussion | Beiträge) |
Nugman (Diskussion | Beiträge) |
||
| (Der Versionsvergleich bezieht 31 dazwischenliegende Versionen mit ein.) | |||
| Zeile 3: | Zeile 3: | ||
Zeigen/Verbergen: {{SH|Cmd=CreateImg|ImgID=SHTestImg|ElemID=SHTestElem}} <br> | Zeigen/Verbergen: {{SH|Cmd=CreateImg|ImgID=SHTestImg|ElemID=SHTestElem}} <br> | ||
<div id="SHTestElem" style="display:inline-block;border:1px silver solid;"> | <div id="SHTestElem" style="display:inline-block;border:1px silver solid;"> | ||
| - | dies ist | + | dies ist ein Test ...<br> |
| - | dies ist | + | dies ist ein Test ...<br> |
| - | dies ist | + | dies ist ein Test ...<br> |
| - | dies ist | + | dies ist ein Test ... |
</div> | </div> | ||
{{SH|Cmd=InitElem|ImgID=SHTestImg|ElemID=SHTestElem|Default=show}} | {{SH|Cmd=InitElem|ImgID=SHTestImg|ElemID=SHTestElem|Default=show}} | ||
| Zeile 22: | Zeile 22: | ||
eSHElem.style.display = 'none'; | eSHElem.style.display = 'none'; | ||
eSHButton.src = '/bogenwiki/images/Symbol_'+sFNShowImg+'.png'; | eSHButton.src = '/bogenwiki/images/Symbol_'+sFNShowImg+'.png'; | ||
| + | } | ||
| + | } | ||
| + | function CountSHBD(sSHID) | ||
| + | { | ||
| + | console.log('CountSHBD('+sSHID+')'); | ||
| + | let nRowsShown = 0; | ||
| + | let nRowsAvail = 0; | ||
| + | let nRowsTotal = 0; | ||
| + | // count display state of rows with objects | ||
| + | let sNodeSel = 'tr[id^=SH-objrow-'+sSHID+']'; | ||
| + | let aNodes = document.querySelectorAll(sNodeSel); | ||
| + | nRowsAvail = aNodes.length; | ||
| + | nRowsTotal = aNodes.length; | ||
| + | for (var i = 0; i < aNodes.length; i++) | ||
| + | nRowsShown = (aNodes[i].style.display=='table-row' ? nRowsShown+1 : nRowsShown); | ||
| + | // count display state of empty rows | ||
| + | sNodeSel = 'tr[id^=SH-emptyrow-'+sSHID+']'; | ||
| + | aNodes = document.querySelectorAll(sNodeSel); | ||
| + | nRowsTotal += aNodes.length; | ||
| + | for (var i = 0; i < aNodes.length; i++) | ||
| + | nRowsShown = (aNodes[i].style.display=='table-row' ? nRowsShown+1 : nRowsShown); | ||
| + | console.log('[CountSHBD()]: Shown='+nRowsShown+', Avail='+nRowsAvail+', Total='+nRowsTotal); | ||
| + | return [nRowsShown,nRowsAvail,nRowsTotal]; | ||
| + | } | ||
| + | function AddNodesSHBD(sSel,aNodes=[]) | ||
| + | { | ||
| + | console.log('AddNodesSHBD("'+sSel+'",'+aNodes.length+')'); | ||
| + | let aAddNodes = document.querySelectorAll(sSel); | ||
| + | for (var i = 0; i < aAddNodes.length; i++) { aNodes.push(aAddNodes[i]); } | ||
| + | console.log('[AddNodesSHBD()]: aNodes[].length='+aNodes.length); | ||
| + | return aNodes; | ||
| + | } | ||
| + | function SetBtnStateSHBD(sBtnID,sState) | ||
| + | { | ||
| + | console.log('SetBtnStateSHBD('+sBtnID+','+sState+')'); | ||
| + | let sNewImage = '???'; | ||
| + | let sNewTitle = '???'; | ||
| + | switch (sState) { | ||
| + | case 'hideall': sNewImage = 'HideT'; sNewTitle = 'Alle verbergen'; break; | ||
| + | case 'showall': sNewImage = 'ShowT'; sNewTitle = 'Alle anzeigen'; break; | ||
| + | case 'showavail': sNewImage = 'ShowMixedT'; sNewTitle = 'Alle vorhandenen anzeigen'; break; | ||
| + | } | ||
| + | console.log('[SetBtnStateSHBD()]: sNewImage='+sNewImage+', sNewTitle="'+sNewTitle+'"'); | ||
| + | let eHeaderBtn = document.getElementById(sBtnID); | ||
| + | eHeaderBtn.src = '/bogenwiki/images/Symbol_'+sNewImage+'.png'; | ||
| + | eHeaderBtn.title = sNewTitle; | ||
| + | } | ||
| + | function SetRowStateSHBD(sRowID,sState) | ||
| + | { | ||
| + | console.log('SetRowStateSHBD('+sRowID+','+sState+')'); | ||
| + | sNewDisplayState = '???'; | ||
| + | switch (sState) { | ||
| + | case 'showall': sNewDisplayState = 'table-row'; break; | ||
| + | case 'showavail': sNewDisplayState = (sRowID.split('-')[1] == 'objrow' ? 'table-row' : 'none'); break; | ||
| + | case 'hideall': sNewDisplayState = 'none'; break; | ||
| + | } | ||
| + | eRow = document.getElementById(sRowID); | ||
| + | console.log('[SetRowStateSHBD()]: sRowID='+sRowID+', '+eRow.style.display+' => '+sNewDisplayState); | ||
| + | eRow.style.display = sNewDisplayState; | ||
| + | } | ||
| + | function GetActAndNewStateSHBD(sSHID) | ||
| + | { | ||
| + | console.log('GetActAndNewStateSHBD(): sSHID="'+sSHID+'"'); | ||
| + | // count shown rows, rows with available objects and total rows | ||
| + | let [nRowsShown,nRowsAvail,nRowsTotal] = CountSHBD(sSHID); | ||
| + | // State-/display-order: hideall => showavail => showall | ||
| + | // State showavail is skipped if all rows contain available objects | ||
| + | // ActState NewState | ||
| + | // nRowsShown == 0, nRowsAvail > 0 && < nRowsTotal: hideall => showavail | ||
| + | // nRowsShown == 0, nRowsAvail == nRowsTotal: hideall => showall | ||
| + | // nRowsShown == nRowsAvail > 0 && < nRowsTotal: showavail => showall | ||
| + | // nRowsShown == nRowsAvail == nRowsTotal: showall => hideall | ||
| + | let sActState = ''; | ||
| + | let sNewState = ''; | ||
| + | if (nRowsShown == 0) { | ||
| + | sActState = 'hideall'; | ||
| + | sNewState = (nRowsAvail > 0 ? (nRowsAvail < nRowsTotal ? 'showavail' : 'showall') : 'showall'); | ||
| + | } else { | ||
| + | sActState = (nRowsAvail > 0 ? (nRowsAvail < nRowsTotal ? 'showavail' : 'showall') : 'showall'); | ||
| + | sNewState = (nRowsShown < nRowsTotal ? 'showall' : 'hideall'); | ||
| + | } | ||
| + | console.log('[GetActAndNewStateSHBD()]: sActState='+sActState+', sNewState="'+sNewState+'"'); | ||
| + | return [sActState,sNewState]; | ||
| + | } | ||
| + | function ShowHideBD(sSHID,sCmd) | ||
| + | { | ||
| + | console.log('ShowHideBD('+sSHID+','+sCmd+')'); | ||
| + | let aNodesAll = []; | ||
| + | let sActState = ''; | ||
| + | let sNewState = ''; | ||
| + | switch (sCmd) { | ||
| + | case 'init': | ||
| + | break; | ||
| + | case 'showall': | ||
| + | break; | ||
| + | case 'showallavail': | ||
| + | break; | ||
| + | case 'hideall': | ||
| + | break; | ||
| + | case 'showgroup': | ||
| + | break; | ||
| + | case 'showgroupavail': | ||
| + | break; | ||
| + | case 'hidegroup': | ||
| + | break; | ||
| + | case 'toggleall': | ||
| + | // determine current state and new state | ||
| + | [sActState,sNewState] = GetActAndNewStateSHBD(sSHID) | ||
| + | // show/hide rows | ||
| + | aNodesAll = AddNodesSHBD('tr[id^=SH-objrow-'+sSHID+']') | ||
| + | aNodesAll = AddNodesSHBD('tr[id^=SH-emptyrow-'+sSHID+']',aNodesAll) | ||
| + | // update display state of the rows | ||
| + | for (let i = 0; i < aNodesAll.length; i++) | ||
| + | SetRowStateSHBD(aNodesAll[i].id,sNewState); | ||
| + | // update header button | ||
| + | [sActState,sNewState] = GetActAndNewStateSHBD(sSHID) | ||
| + | SetBtnStateSHBD('SH-headbtn-'+sSHID,sNewState); | ||
| + | // update group buttons | ||
| + | let aNodesGroup = AddNodesSHBD('tr[id^=SH-divrow-'+sSHID+']'); | ||
| + | for (var i = 0; i < aNodesGroup.length; i++) { | ||
| + | let sSHGroupID = aNodesGroup[i].id.split('-')[2]; | ||
| + | let [sGroupActState,sGroupNewState] = GetActAndNewStateSHBD(sSHGroupID) | ||
| + | SetBtnStateSHBD('SH-divbtn-'+sSHGroupID,sGroupNewState); | ||
| + | } | ||
| + | break; | ||
| + | case 'togglegroup': | ||
| + | [sActState,sNewState] = GetActAndNewStateSHBD(sSHID) | ||
| + | // show/hide rows | ||
| + | aNodesAll = AddNodesSHBD('tr[id^=SH-objrow-'+sSHID+']') | ||
| + | aNodesAll = AddNodesSHBD('tr[id^=SH-emptyrow-'+sSHID+']',aNodesAll) | ||
| + | // update display state of the rows | ||
| + | for (let i = 0; i < aNodesAll.length; i++) { | ||
| + | SetRowStateSHBD(aNodesAll[i].id,sNewState); | ||
| + | } | ||
| + | SetBtnStateSHBD('SH-divbtn-'+sSHID,sNewState); | ||
| + | |||
| + | break; | ||
} | } | ||
} | } | ||
Aktuelle Version vom 22:26, 2. Okt. 2026
Zeigen/Verbergen:
dies ist ein Test ...
dies ist ein Test ...
dies ist ein Test ...
dies ist ein Test ...
