| | |
| | | <?php |
| | | |
| | | use JVBase\meta\Form; |
| | | use JVBase\utility\Features; |
| | | use JVBase\utility\Image; |
| | | |
| | |
| | | } |
| | | |
| | | ?> |
| | | <aside id="queue" class="left col start btw main" 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> |
| | |
| | | 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++; |
| | | } |
| | |
| | | <button class="retry-all">Retry Failed</button> |
| | | </div> |
| | | </aside> |
| | | <button class="qtoggle row" title="Show Queue" aria-controls="queue" hidden> |
| | | <button class="qtoggle row" title="Show Queue" aria-controls="queue" > |
| | | <?= jvbIcon('floppy-disk') ?> |
| | | <span class="screen-reader-text"></span> |
| | | <span class="indicator"></span> |
| | |
| | | <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> |
| | |
| | | * 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('magnifying-glass').'</button> |
| | | </div>'; |
| | | return Form::search($placeholder, $id); |
| | | } |
| | | |
| | | |
| | |
| | | return $image->formatImage($imgID, $start, $end, $addLink, $postSlug); |
| | | } |
| | | |
| | | 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>'; |
| | | } |
| | | |
| | | /** |
| | | * Outputs the notification container in the footer |
| | | * @return void |
| | |
| | | <h2>'.$config['title'].'</h2>'; |
| | | if ( array_key_exists('description', $config)) { |
| | | if (!is_array($config['description'])) { |
| | | $content .= apply_filters('the_content', $config['description']); |
| | | $content .= jvb_filter_content( $config['description']); |
| | | } else { |
| | | // foreach ($config['description'] as $desc) { |
| | | // $content .= apply_filters('the_content', $desc); |
| | | // $content .= jvb_filter_content( $desc); |
| | | // } |
| | | $content .= implode('',array_map(function ($paragraph) { |
| | | return apply_filters('the_content', $paragraph); |
| | | return jvb_filter_content( $paragraph); |
| | | }, $config['description'])); |
| | | } |
| | | |
| | |
| | | return $out; |
| | | } |
| | | |
| | | function jvbRenderProgressBar(string $inside ='', $top = false) |
| | | function jvbRenderProgressBar(string $inside ='', $top = false, $icon = true, $return = false):string |
| | | { |
| | | |
| | | $top = $top ? ' abs top' : ''; |
| | | ?> |
| | | <div class="progress<?=$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 = '') { |
| | |
| | | </div> |
| | | <div class="fstatus row" hidden> |
| | | <div class="spinner"></div> |
| | | <i class="icon"></i> |
| | | <p class="message">'.$message.'</p> |
| | | </div>'; |
| | | } |