| 1 |
<?php |
| 2 |
/** |
| 3 |
* HTML for the welcome page. |
| 4 |
* |
| 5 |
* @package Code_Snippets |
| 6 |
* @subpackage Views |
| 7 |
*/ |
| 8 |
|
| 9 |
namespace Code_Snippets; |
| 10 |
|
| 11 |
/** |
| 12 |
* Loaded from the Welcome_Menu class. |
| 13 |
* |
| 14 |
* @var Welcome_Menu $this |
| 15 |
*/ |
| 16 |
|
| 17 |
if ( ! defined( 'ABSPATH' ) ) { |
| 18 |
return; |
| 19 |
} |
| 20 |
|
| 21 |
$hero = $this->api->get_hero_item(); |
| 22 |
|
| 23 |
$changelog_sections = [ |
| 24 |
'Added' => [ |
| 25 |
'title' => __( 'New features', 'code-snippets' ), |
| 26 |
'icon' => 'lightbulb', |
| 27 |
], |
| 28 |
'Improved' => [ |
| 29 |
'title' => __( 'Improvements', 'code-snippets' ), |
| 30 |
'icon' => 'chart-line', |
| 31 |
], |
| 32 |
'Fixed' => [ |
| 33 |
'title' => __( 'Bug fixes', 'code-snippets' ), |
| 34 |
'icon' => 'buddicons-replies', |
| 35 |
], |
| 36 |
'Other' => [ |
| 37 |
'title' => __( 'Other', 'code-snippets' ), |
| 38 |
'icon' => 'open-folder', |
| 39 |
], |
| 40 |
]; |
| 41 |
|
| 42 |
$plugin_types = [ |
| 43 |
'core' => _x( 'Core', 'badge label', 'code-snippets' ), |
| 44 |
'pro' => _x( 'Pro', 'badge label', 'code-snippets' ), |
| 45 |
]; |
| 46 |
|
| 47 |
?> |
| 48 |
|
| 49 |
<div class="csp-welcome-wrap"> |
| 50 |
<div class="csp-welcome-header"> |
| 51 |
<header class="csp-welcome-logo"> |
| 52 |
<img width="50px" |
| 53 |
src="<?php echo esc_url( plugins_url( 'assets/icon.svg', PLUGIN_FILE ) ); ?>" |
| 54 |
alt="<?php esc_attr_e( 'Code Snippets Logo', 'code-snippets' ); ?>"> |
| 55 |
<h1> |
| 56 |
<?php echo wp_kses( __( "Resources and <span>What's New</span>", 'code-snippets' ), [ 'span' => [] ] ); ?> |
| 57 |
</h1> |
| 58 |
</header> |
| 59 |
<ul class="csp-welcome-nav"> |
| 60 |
<?php foreach ( $this->get_header_links() as $link_name => $link_info ) { ?> |
| 61 |
<li> |
| 62 |
<a href="<?php echo esc_url( $link_info['url'] ); ?>" target="_blank" |
| 63 |
class="csp-link-<?php echo esc_attr( $link_name ); ?>"> |
| 64 |
<span><?php echo esc_html( $link_info['label'] ); ?></span> |
| 65 |
|
| 66 |
<?php if ( 'discord' === $link_info['icon'] ) { ?> |
| 67 |
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 127.14 96.36"> |
| 68 |
<path d="M107.7,8.07A105.15,105.15,0,0,0,81.47,0a72.06,72.06,0,0,0-3.36,6.83A97.68,97.68,0,0,0,49,6.83,72.37,72.37,0,0,0,45.64,0,105.89,105.89,0,0,0,19.39,8.09C2.79,32.65-1.71,56.6.54,80.21h0A105.73,105.73,0,0,0,32.71,96.36,77.7,77.7,0,0,0,39.6,85.25a68.42,68.42,0,0,1-10.85-5.18c.91-.66,1.8-1.34,2.66-2a75.57,75.57,0,0,0,64.32,0c.87.71,1.76,1.39,2.66,2a68.68,68.68,0,0,1-10.87,5.19,77,77,0,0,0,6.89,11.1A105.25,105.25,0,0,0,126.6,80.22h0C129.24,52.84,122.09,29.11,107.7,8.07ZM42.45,65.69C36.18,65.69,31,60,31,53s5-12.74,11.43-12.74S54,46,53.89,53,48.84,65.69,42.45,65.69Zm42.24,0C78.41,65.69,73.25,60,73.25,53s5-12.74,11.44-12.74S96.23,46,96.12,53,91.08,65.69,84.69,65.69Z" /> |
| 69 |
</svg> |
| 70 |
<?php } else { ?> |
| 71 |
<span class="dashicons dashicons-<?php echo esc_attr( $link_info['icon'] ); ?>"></span> |
| 72 |
<?php } ?> |
| 73 |
</a> |
| 74 |
</li> |
| 75 |
<?php } ?> |
| 76 |
</ul> |
| 77 |
</div> |
| 78 |
|
| 79 |
<section class="csp-section-changes"> |
| 80 |
<h1>📰 <?php esc_html_e( 'Latest news', 'code-snippets' ); ?></h1> |
| 81 |
<div class="csp-cards"> |
| 82 |
<a class="csp-card" href="<?php echo esc_url( $hero['follow_url'] ); ?>" target="_blank" |
| 83 |
title="<?php esc_html_e( 'Read more', 'code-snippets' ); ?>"> |
| 84 |
<header> |
| 85 |
<span class="dashicons dashicons-external"></span> |
| 86 |
<h2><?php echo esc_html( $hero['name'] ); ?></h2> |
| 87 |
</header> |
| 88 |
<figure> |
| 89 |
<div id="csp-loading-spinner" class="csp-loading-spinner"></div> |
| 90 |
<img id="csp-changes-img" |
| 91 |
onload="hideLoadingAnimation()" |
| 92 |
src="<?php echo esc_url( $hero['image_url'] ); ?>" |
| 93 |
alt="<?php esc_attr_e( 'Latest news image', 'code-snippets' ); ?>);"> |
| 94 |
</figure> |
| 95 |
</a> |
| 96 |
|
| 97 |
<a class="csp-card" href="https://wordpress.org/plugins/code-snippets/changelog" target="_blank" |
| 98 |
title="<?php esc_html_e( 'Read the full changelog', 'code-snippets' ); ?>"> |
| 99 |
<header> |
| 100 |
<span class="dashicons dashicons-external"></span> |
| 101 |
<h2><?php esc_html_e( 'Latest changes', 'code-snippets' ); ?></h2> |
| 102 |
</header> |
| 103 |
<div class="csp-section-changelog"> |
| 104 |
<?php foreach ( $this->api->get_changelog() as $version => $version_changes ) { ?> |
| 105 |
<h3><?php echo esc_html( $version ); ?></h3> |
| 106 |
<article> |
| 107 |
<?php |
| 108 |
foreach ( $changelog_sections as $section_key => $section ) { |
| 109 |
if ( empty( $version_changes[ $section_key ] ) ) { |
| 110 |
continue; |
| 111 |
} |
| 112 |
?> |
| 113 |
<h4> |
| 114 |
<span class="dashicons dashicons-<?php echo esc_attr( $section['icon'] ); ?>"></span> |
| 115 |
<?php echo esc_html( $section['title'] ); ?> |
| 116 |
</h4> |
| 117 |
<ul> |
| 118 |
<?php |
| 119 |
foreach ( $plugin_types as $plugin_type => $type_label ) { |
| 120 |
if ( empty( $version_changes[ $section_key ][ $plugin_type ] ) ) { |
| 121 |
continue; |
| 122 |
} |
| 123 |
|
| 124 |
foreach ( $version_changes[ $section_key ][ $plugin_type ] as $change ) { |
| 125 |
?> |
| 126 |
<li> |
| 127 |
<span class="badge <?php echo esc_attr( $plugin_type ); ?>-badge"> |
| 128 |
<?php echo esc_html( $type_label ); ?> |
| 129 |
</span> |
| 130 |
<span><?php echo esc_html( $change ); ?></span> |
| 131 |
</li> |
| 132 |
<?php |
| 133 |
} |
| 134 |
} |
| 135 |
?> |
| 136 |
</ul> |
| 137 |
<?php } ?> |
| 138 |
</article> |
| 139 |
<?php } ?> |
| 140 |
</div> |
| 141 |
</a> |
| 142 |
</div> |
| 143 |
</section> |
| 144 |
|
| 145 |
<section class="csp-section-articles csp-section-links"> |
| 146 |
<h1>🛟 <?php esc_html_e( 'Helpful articles', 'code-snippets' ); ?></h1> |
| 147 |
<div class="csp-cards"> |
| 148 |
<?php foreach ( $this->api->get_features() as $feature ) { ?> |
| 149 |
<a class="csp-card" |
| 150 |
href="<?php echo esc_url( $feature['follow_url'] ); ?>" target="_blank" |
| 151 |
title="<?php esc_html_e( 'Read more', 'code-snippets' ); ?>"> |
| 152 |
<figure> |
| 153 |
<img src="<?php echo esc_url( $feature['image_url'] ); ?>" |
| 154 |
alt="<?php esc_attr_e( 'Feature image', 'code-snippets' ); ?>"> |
| 155 |
</figure> |
| 156 |
<header> |
| 157 |
<h2><?php echo esc_html( $feature['title'] ); ?></h2> |
| 158 |
<p class="csp-card-item-description"><?php echo esc_html( $feature['description'] ); ?></p> |
| 159 |
</header> |
| 160 |
<footer> |
| 161 |
<p class="csp-card-item-category"><?php echo esc_html( $feature['category'] ); ?></p> |
| 162 |
<span class="dashicons dashicons-external"></span> |
| 163 |
</footer> |
| 164 |
</a> |
| 165 |
<?php } ?> |
| 166 |
</div> |
| 167 |
</section> |
| 168 |
|
| 169 |
<section class="csp-section-links csp-section-partners"> |
| 170 |
<h1>🚀 <?php esc_html_e( 'Partners and apps', 'code-snippets' ); ?></h1> |
| 171 |
<div class="csp-cards"> |
| 172 |
<?php foreach ( $this->api->get_partners() as $partner ) { ?> |
| 173 |
<a class="csp-card" |
| 174 |
href="<?php echo esc_url( $partner['follow_url'] ); ?>" target="_blank" |
| 175 |
title="<?php esc_attr_e( 'Go to Partner', 'code-snippets' ); ?>"> |
| 176 |
<figure> |
| 177 |
<img src="<?php echo esc_url( $partner['image_url'] ); ?>" |
| 178 |
alt="<?php esc_attr_e( 'Partner image', 'code-snippets' ); ?>"> |
| 179 |
</figure> |
| 180 |
<header> |
| 181 |
<span class="dashicons dashicons-external"></span> |
| 182 |
<h2><?php echo esc_html( $partner['title'] ); ?></h2> |
| 183 |
</header> |
| 184 |
</a> |
| 185 |
<?php } ?> |
| 186 |
</div> |
| 187 |
</section> |
| 188 |
</div> |
| 189 |
|
| 190 |
<script type="text/javascript"> |
| 191 |
function hideLoadingAnimation() { |
| 192 |
document.getElementById('csp-loading-spinner').style.display = 'none' |
| 193 |
document.getElementById('csp-changes-img').style.display = 'block' |
| 194 |
} |
| 195 |
</script> |
| 196 |
|
