blame | history | patch | commit | commitdiff | ignore whitespace
Jake Vanderwerf
2026-02-17 a24a06002081ad71a78ffeff9072725ba39cf121 
 inc/helpers/ui.php


@@ -1,5 +1,9 @@


<?php




use JVBase\meta\Form;


use JVBase\utility\Features;


use JVBase\utility\Image;




if (!defined('ABSPATH')) {


   exit;


}


@@ -9,16 +13,17 @@




function jvbClientQueue():void


{


    if (!jvbSiteHasDashboard() || !is_user_logged_in()) {


    if (!Features::forSite()->has('dashboard') || !is_user_logged_in()) {


        return;


    }




    ?>


    <aside id="queue" class="col start btw" aria-expanded="false" hidden>


    <aside id="queue" class="left col start btw main" aria-expanded="false" >


        <div class="status-actions row start nowrap">


         <div class="refresh row btw">


                <span class="countdown row" title="Will refresh again...">5</span>


                <button class="refreshNow row" title="Check now">


                    <?= jvbIcon('refresh', ['title'=> 'Check now']) ?>


                    <?= jvbIcon('arrows-clockwise', ['title'=> 'Check now']) ?>


                </button>


            </div>


            <div class="popup row"><span></span></div>


@@ -42,7 +47,8 @@


            foreach($filters as $filter => $title) {


               $active = ($i === 0) ? ' active': '';


               ?>


               <button class="filter<?=$active?>" data-filter="<?=$filter?>" data-count="0"><span class="count row"></span><?=$title?></button>


               <input type="radio" id="qfilter-<?=$filter?>" name="qfilter" class="btn filter<?=$active?>" data-filter="<?=$filter?>">


               <label for="qfilter-<?=$filter?>" data-count="0"><span class="count row"></span><?=$title?></label>


               <?php


               $i++;


            }


@@ -50,16 +56,16 @@


            ?>


         </nav>


      </div>


      <div class="qitems col">


         <!-- Operations will be listed here -->


      <div class="qitems col a-start nowrap">


      </div>


      <div class="queue-actions row btw">


      <div class="queue-actions row btw nowrap">


         <button class="dismiss-all">Clear Completed</button>


         <button class="retry-all">Retry Failed</button>


      </div>


    </aside>


   <button class="qtoggle row" title="Show Queue" aria-controls="queue" hidden>


      <?= jvbIcon('save') ?>


   <button class="qtoggle row" title="Show Queue" aria-controls="queue" >


      <?= jvbIcon('floppy-disk') ?>


      <span class="screen-reader-text"></span>


      <span class="indicator"></span>


      <span class="count row"></span>


   </button>


@@ -67,18 +73,22 @@


      <div class="item">


         <div class="header row btw">


            <span class="type"></span>


            <span class="status row"><span class="screen-reader-text"></span></span>


            <span class="status row"><?= jvbIcon('arrows-clockwise') ?><span class="screen-reader-text"></span></span>


         </div>


         <?php jvbRenderProgressBar() ?>


         <?php jvbRenderProgressBar('',false,false) ?>


         <div class="info">


            <div class="details"></div>


            <div class="time row start">


               <?= jvbIcon('clock') ?>


               <span class="started">Started: <span class="time"></span>


               <span class="completed"></span>


               <span class="started">Started: <time></time></span>


               <span class="completed" hidden><span>Completed: </span><time></time></span>


            </div>


         </div>


         <div class="actions row end">


            <button class="retry" data-action="retry"><span>Retry</span><?= jvbIcon('arrows-clockwise')?></button>


            <button class="cancel" data-action="cancel"><span>Cancel</span><?= jvbIcon('x-square')?></button>


            <button class="refresh" data-action="refresh" title="Refresh to see changes"><span>Refresh</span><?= jvbIcon('arrows-clockwise')?></button>


            <button class="dismiss" data-action="dismiss"><span>Dismiss</span><?= jvbIcon('eye-closed')?></button>


         </div>


      </div>


   </template>


@@ -106,8 +116,8 @@


        ob_start();


        ?>


        <li>


            <a href="<?=get_home_url(2, '/dash/')?>" title="Behind the Scenes">


                <?= jvbIcon('dashboard', ['title' => 'Behind the Scenes'])?>


            <a href="<?=get_home_url(null, '/dash/')?>" title="Behind the Scenes">


                <?= jvbIcon('door', ['title' => 'Behind the Scenes'])?>


                <span class="screen-reader-text">Go Behind the Scenes</span>


            </a>


        </li>


@@ -119,7 +129,7 @@


                </span>


            </button>


            <ul class="notifications-preview submenu">


                <li id="view-all"><a href="<?=get_home_url(2, '/dash/notifications/')?>" class="view-all">View All Notifications</a></li>


                <li id="view-all"><a href="<?=get_home_url(null, '/dash/notifications/')?>" class="view-all">View All Notifications</a></li>


            </ul>


            <template class="notificationItem">


                <li class="notification-preview">


@@ -148,7 +158,11 @@


 */


function jvbHelpMenu():string


{


   if (!Features::forSite()->has('helpMenu')) {


      return '';


   }


    $out = get_option(BASE.'help_menu');




    if ($out === false) {


        $open = '<li><a href="';


        $mid = '">';


@@ -168,14 +182,14 @@


                'fields'    => 'ids'


            ));


            if ($page->have_posts()) {


                $end = ($t == 'About') ? '<li><a href="'.get_home_url(2, '/directory/partners/').'" title="View our Partners">Partners</a></li>' : '';


                $end = ($t == 'About') ? '<li><a href="'.get_home_url(null, '/directory/partners/').'" title="View our Partners">Partners</a></li>' : '';


                $links .= $open.get_the_permalink($page->posts[0]).'" title="'.$t.$mid.$t.$close.$end;


            }


            wp_reset_postdata();


        }




        $out = '<li class="has-submenu">


                <button class="toggle quick-help" type="button" title="Toggle Quick Help Menu" aria-expanded="false" aria-controls="quick-help" aria-label="Toggle Quick Help Menu">'.jvbIcon('help', ['title'=> 'Quick Help']).'</button>


                <button class="toggle quick-help" type="button" title="Toggle Quick Help Menu" aria-expanded="false" aria-controls="quick-help" aria-label="Toggle Quick Help Menu">'.jvbIcon('question', ['title'=> 'Quick Help']).'</button>


                <ul class="submenu">


                    '.$links.'


                </ul>


@@ -185,9 +199,9 @@


    }




    if (is_user_logged_in()) {


        $out .= '<li><a href="'.wp_logout_url(get_home_url()).'" title="Logout">'.jvbIcon('logout').'<span class="screen-reader-text">Logout</span></a></li>';


        $out .= '<li><a href="'.wp_logout_url(get_home_url()).'" title="Logout">'.jvbIcon('sign-out').'<span class="screen-reader-text">Logout</span></a></li>';


    } else {


        $out .= '<li><a href="'.wp_login_url(null, true).'" title="Login">'.jvbIcon('login').'<span class="screen-reader-text">Login</span></a></li>';


        $out .= '<li><a href="'.wp_login_url(null, true).'" title="Login">'.jvbIcon('sign-in').'<span class="screen-reader-text">Login</span></a></li>';


    }


    return $out;


}


@@ -197,19 +211,9 @@


 * Outputs the search bar (likely don't need anymore)


 * @return string


 */


function jvbSearch(string $placeholder = 'Search...'):string


function jvbSearch(string $placeholder = 'Search...', string $id = 'search'):string


{


    return '<div class="search-container row start nowrap">


  <input type="search" id="search" placeholder="'.$placeholder.'">


  <button


    title="Clear Search"


    type="button"


    class="clear-search"


    aria-label="Clear search"


    onclick="this.previousElementSibling.value = \'\'; this.previousElementSibling.focus();"


  >'.jvbIcon('x', ['title'=> 'Clear Search']).'</button>


  <button type="button" title="Search" class="toggle search" aria-label="Toggles search input visually" onclick="this.parentNode.classList.toggle(\'open\');this.previousElementSibling.previousElementSibling.focus();">'.jvbIcon('search').'</button>


</div>';


   return Form::search($placeholder, $id);


}






@@ -217,8 +221,8 @@


function jvbModalActions()


{


    return '<div class="m-actions row">


        <button type="button" class="cancel">'.jvbIcon('close').'<span class="screen-reader-text">Cancel</span></button>


        <button type="submit" class="save">'.jvbIcon('save').'<span class="screen-reader-text">Save</span></button>


        <button type="button" class="cancel">'.jvbIcon('x').'<span class="screen-reader-text">Cancel</span></button>


        <button type="submit" class="save">'.jvbIcon('floppy-disk').'<span class="screen-reader-text">Save</span></button>


    </div>';


}




@@ -240,19 +244,17 @@


 *


 * @return string


 */


function jvbFormatImage(int|string $imgID, string $start = 'tiny', string $end = 'large'):string


function jvbFormatImage(int $imgID, string $start = 'tiny', string $end = 'large', bool $addLink = true, ?string $postSlug = null):string


{


    $block = new \JVBase\blocks\CustomBlocks();


    if ($imgID === '' || $imgID === 0) {


        $imgID = $block->imageID($imgID);


    }


    if ($imgID === '' || $imgID === 0 || $imgID === false) {


        return '';


    }


    $image = new Image();


    return $image->formatImage($imgID, $start, $end, $addLink, $postSlug);


}




   $imgID = (int)$imgID;




    return $block->formatImage($imgID, $start, $end);


function jvbImageCaption(int $imgID, string $start = 'tiny', string $end = 'large', bool $addLink = true, ?string $postSlug = null):string


{


   $caption = wp_get_attachment_caption($imgID);


   $caption = ($caption && $caption !== '') ? '<figcaption>'.jvb_filter_content( $caption).'</figcaption>' : '';


   return '<figure>'.jvbFormatImage($imgID, $start, $end, $addLink, $postSlug).$caption.'</figure>';


}




/**


@@ -260,8 +262,6 @@


 * @return void


 */


add_action('wp_footer', 'jvbToastContainer');






function jvbToastContainer():void


{


    ?>


@@ -273,7 +273,7 @@


            <div class="toast-content row btw">


                <p></p>


                <button type="button" class="close-toast" aria-label="Close">


                    <?= jvbIcon('close') ?>


                    <?= jvbIcon('x') ?>


                </button>


            </div>


        </div>


@@ -299,13 +299,13 @@


    <nav id="<?=$id?>" class="on-this-page index">


        <label>Jump to:


            <button type="button" aria-label="Show Index" title="Show Index" class="toggle" aria-expanded="false">


                <?= jvbIcon('add') ?>


                <?= jvbIcon('plus-square') ?>


            </button>


        </label>


        <ul>


            <li>


                <a href="#top" title="Back to Top">


                    <?= jvbIcon('up') ?>


                    <?= jvbIcon('caret-circle-up') ?>


                </a>


            </li>


            <?php


@@ -324,13 +324,15 @@


    return ob_get_clean();


}




add_action('wp_footer', 'jvbLoadingScreen');


function jvbLoadingScreen():string


{


   $icon = apply_filters('jvbLoadingIcon', 'drop-simple');


   return '<dialog class="loading">


      <div class="col">


         <div class="spinner"></div>


         <div class="status col">


            <div class="icon">'.apply_filters('jvbLoadingIcon', jvbIcon('tattoo')).'</div>


            <div class="icon">'.jvbIcon($icon).'</div>


            <h3>Loading</h3>


            <p class="typeText">Please wait...</p>


         </div>


@@ -364,7 +366,12 @@


   $header = '<nav class="tabs row start" role="tablist">';


   $content = '';


   $i = 0;




   foreach ($tabs as $slug => $config) {


      if (!array_key_exists('content', $config) || empty($config['content'])) {


         error_log('No content for tab: '.$slug);


         continue;


      }


      //Header


      $active = ($i === 0) ? ' active' : '';


      $selected = ($i === 0) ? 'true' : 'false';


@@ -385,8 +392,18 @@


      }


      $content .= '>


         <h2>'.$config['title'].'</h2>';


         if ( $config['description']) {


            $content .= apply_filters('the_content', $config['description']);


         if ( array_key_exists('description', $config)) {


            if (!is_array($config['description'])) {


               $content .= jvb_filter_content( $config['description']);


            } else {


//             foreach ($config['description'] as $desc) {


//                $content .= jvb_filter_content( $desc);


//             }


               $content .= implode('',array_map(function ($paragraph) {


                  return jvb_filter_content( $paragraph);


               }, $config['description']));


            }




         }




      $content .= $config['content'].'


@@ -403,17 +420,50 @@


   return $out;


}




function jvbRenderProgressBar(string $inside ='')


function jvbRenderProgressBar(string $inside ='', $top = false, $icon = true, $return = false):string


{


   ?>


   <div class="progress">




   $top = $top ? ' abs top' : '';


   $bar = sprintf(


      '<div class="progress%s">


      <div class="bar">


         <div class="fill"></div>


      </div>


      <div class="details row btw">


         <?=$inside?>


      <div class="row btw">


         %s


         <div class="details">


            %s


         </div>


      </div>


   </div>


   <?php


   </div>',


      $top,


      ($icon) ? '<i class="icon"></i>': '',


      $inside


   );


   if (!$return) {


      echo $bar;


   }


   return $bar;


}




function jvbFormStatus(string $message = '') {


   return '<div class="restore-form col" hidden>


         <h3>Looks like we left things hanging...</h3>


         <p>We\'ve filled in the fields with what you put last time.</p>


         <div class="actions">


            <button type="button" data-action="clear-form">


               '.jvbIcon('arrows-clockwise').'


               <span>Start Over</span>


            </button>


            <button type="button" data-action="dismiss-restore">


               '.jvbIcon('x').'


               <span>Dismiss</span>


            </button>


         </div>


      </div>


      <div class="fstatus row" hidden>


         <div class="spinner"></div>


         <i class="icon"></i>


         <p class="message">'.$message.'</p>


      </div>';


}