How to make a tree-like menu on Bitrix, with open subsections on the active item?

Question

1C-Bitrix

Good morning
Please tell me, there is a task to make a tree-like menu in Bitrix.
This is done quite simply, using standard tools, the tree template.
I need to correct it so that when we are in a section, subsections are shown, if any.
The template code is the following:

<?if (!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die();?>

<?if (!empty($arResult)):?>

<div class="menu-sitemap-tree">
<ul>
<?
$previousLevel = 0;
foreach($arResult as $arItem):
?>
  <?if ($previousLevel && $arItem["DEPTH_LEVEL"] < $previousLevel):?>
    <?=str_repeat("</ul></li>", ($previousLevel - $arItem["DEPTH_LEVEL"]));?>
  <?endif?>

  <?if ($arItem["IS_PARENT"]):?>
      <li<?if($arItem["CHILD_SELECTED"] !== true):?> class="menu-close"<?endif?>>
        <div class="folder" onClick="OpenMenuNode(this)"></div>
        <div class="item-text"><a href="<?=$arItem["LINK"]?>"><?=$arItem["TEXT"]?>2</a></div>
        <ul>

  <?else:?>

    <?if ($arItem["PERMISSION"] > "D"):?>
        <li>
          <div class="page"></div>
          <div class="item-text"><a href="<?=$arItem["LINK"]?>"><?=$arItem["TEXT"]?>1</a></div>
        </li>
    <?endif?>

  <?endif?>

  <?$previousLevel = $arItem["DEPTH_LEVEL"];?>

<?endforeach?>

<?if ($previousLevel > 1)://close last item tags?>
  <?=str_repeat("</ul></li>", ($previousLevel-1) );?>
<?endif?>

</ul>
</div>
<?endif?>

There is also a result_modifier.php file in which the conditions are set, as I understand it, it looks like this:

<?
if(!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)
  die();

//determine if child selected

$bWasSelected = false;
$arParents = array();
$depth = 1;
foreach($arResult as $i=>$arMenu)
{
  $depth = $arMenu['DEPTH_LEVEL'];

  if($arMenu['IS_PARENT'] == true)
  {
    $arParents[$arMenu['DEPTH_LEVEL']-1] = $i;
  }
  elseif($arMenu['SELECTED'] == true)
  {
    $bWasSelected = true;
    break;
  }
}

if($bWasSelected)
{
  for($i=0; $i<$depth-1; $i++)
    $arResult[$arParents[$i]]['CHILD_SELECTED'] = true;
}
?>

And the script.js file

function OpenMenuNode(oThis)
{
  if (oThis.parentNode.className == '')
    oThis.parentNode.className = 'menu-close';
  else
    oThis.parentNode.className = '';
  return false;
}

Help me solve the problem, I'm already worried for the second day)

Answer 1

1 Remove jquery, bitrix and javascript tags - do not mislead people - all this is irrelevant to the question.
2 I already wrote to you - just lay it out like this.
3 If you want to correct this layout directly, then:
Remove js altogether completely. In general, sort everything in the file.
lines

<li<?if($arItem["CHILD_SELECTED"] !== true):?> class="menu-close"<?endif?>>
        <div class="folder" onClick="OpenMenuNode(this)"></div>

replace with the following:

<li<?if($arItem["SELECTED"] != "Y"):?> class="menu-close"<?endif?>>