assets
1 year ago
class-front-view-model.php
1 year ago
class-front-view.php
1 year ago
index.php
1 year ago
class-front-view.php
319 lines
| 1 | <?php |
| 2 | /** |
| 3 | * WPFront Scroll Top |
| 4 | * |
| 5 | * @package wpfront-scroll-top |
| 6 | * @author Syam Mohan |
| 7 | * @copyright 2013 WPFront |
| 8 | * @license GPL-2.0-or-later |
| 9 | */ |
| 10 | |
| 11 | namespace WPFront\Scroll_Top; |
| 12 | |
| 13 | defined( 'ABSPATH' ) || exit; |
| 14 | |
| 15 | /** |
| 16 | * Front view class. |
| 17 | * |
| 18 | * @package wpfront-scroll-top |
| 19 | */ |
| 20 | class Front_View { |
| 21 | |
| 22 | /** |
| 23 | * Settings entity instance. |
| 24 | * |
| 25 | * @var Settings_Entity |
| 26 | */ |
| 27 | private $settings; |
| 28 | |
| 29 | /** |
| 30 | * WPFront Scroll Top instance. |
| 31 | * |
| 32 | * @var WPFront_Scroll_Top |
| 33 | */ |
| 34 | private $st; |
| 35 | |
| 36 | /** |
| 37 | * WP wrapper instance. |
| 38 | * |
| 39 | * @var WP_Wrapper |
| 40 | */ |
| 41 | private $wp; |
| 42 | |
| 43 | /** |
| 44 | * Constructor. |
| 45 | * |
| 46 | * @param WPFront_Scroll_Top $st WPFront Scroll Top instance. |
| 47 | * @param WP_Wrapper $wp WordPress wrapper instance. |
| 48 | */ |
| 49 | public function __construct( WPFront_Scroll_Top $st, WP_Wrapper $wp ) { |
| 50 | $this->st = $st; |
| 51 | $this->wp = $wp; |
| 52 | } |
| 53 | |
| 54 | /** |
| 55 | * Writes the HTML for the front view. |
| 56 | * |
| 57 | * @param Settings_Entity $settings Settings object. |
| 58 | * |
| 59 | * @return string HTML output. |
| 60 | */ |
| 61 | public function get_html( $settings ) { |
| 62 | $this->settings = $settings; |
| 63 | |
| 64 | ob_start(); |
| 65 | $this->write_html(); |
| 66 | $html = ob_get_clean(); |
| 67 | $html = empty( $html ) ? '' : $html; |
| 68 | return $html; |
| 69 | } |
| 70 | |
| 71 | /** |
| 72 | * Writes the HTML for the front view. |
| 73 | * |
| 74 | * @return void |
| 75 | */ |
| 76 | private function write_html() { |
| 77 | $tag = 'url' === $this->settings->button_action ? 'a' : 'button'; |
| 78 | printf( |
| 79 | '<%1$s id="wpfront-scroll-top-container" aria-label="%2$s" title="%3$s" %4$s>', |
| 80 | esc_html( $tag ), |
| 81 | esc_attr( $this->settings->accessibility_aria_label ), |
| 82 | esc_attr( $this->settings->accessibility_title ), |
| 83 | 'a' === $tag ? sprintf( 'href="%s"', esc_url( $this->settings->button_action_page_url ) ) : '' |
| 84 | ); |
| 85 | $this->write_inner_html(); |
| 86 | echo '</' . esc_html( $tag ) . '>'; |
| 87 | } |
| 88 | |
| 89 | /** |
| 90 | * Writes the inner HTML for the front view. |
| 91 | * |
| 92 | * @return void |
| 93 | */ |
| 94 | private function write_inner_html() { |
| 95 | $this->write_screen_reader_html(); |
| 96 | |
| 97 | switch ( $this->settings->button_style ) { |
| 98 | case 'text': |
| 99 | $this->write_text_button_html(); |
| 100 | break; |
| 101 | case 'font-awesome': |
| 102 | $this->write_font_awesome_button_html(); |
| 103 | break; |
| 104 | default: |
| 105 | $this->write_image_button_html(); |
| 106 | break; |
| 107 | } |
| 108 | } |
| 109 | |
| 110 | /** |
| 111 | * Writes the image HTML for the front view. |
| 112 | * |
| 113 | * @return void |
| 114 | */ |
| 115 | private function write_image_button_html() { |
| 116 | if ( 'custom' === $this->settings->image ) { |
| 117 | $img = $this->settings->custom_url; |
| 118 | } else { |
| 119 | $img = $this->st->get_plugin_url( 'includes/assets/icons/' ) . $this->settings->image; |
| 120 | } |
| 121 | |
| 122 | printf( |
| 123 | '<img src="%s" alt="%s" title="%s">', |
| 124 | esc_url( $img ), |
| 125 | esc_attr( $this->settings->image_alt ), |
| 126 | esc_attr( $this->settings->image_title ) |
| 127 | ); |
| 128 | } |
| 129 | |
| 130 | /** |
| 131 | * Writes the text HTML for the front view. |
| 132 | * |
| 133 | * @return void |
| 134 | */ |
| 135 | private function write_text_button_html() { |
| 136 | printf( |
| 137 | '<span class="text-holder">%s</span>', |
| 138 | esc_html( $this->settings->text_button_text ) |
| 139 | ); |
| 140 | } |
| 141 | |
| 142 | /** |
| 143 | * Writes the Font Awesome button HTML for the front view. |
| 144 | * |
| 145 | * @return void |
| 146 | */ |
| 147 | private function write_font_awesome_button_html() { |
| 148 | printf( |
| 149 | '<i class="%s" aria-hidden="true"></i>', |
| 150 | esc_attr( $this->settings->fa_button_class ) |
| 151 | ); |
| 152 | } |
| 153 | |
| 154 | /** |
| 155 | * Writes the screen reader text for the front view. |
| 156 | * |
| 157 | * @return void |
| 158 | */ |
| 159 | private function write_screen_reader_html() { |
| 160 | if ( empty( $this->settings->accessibility_screen_reader_text ) ) { |
| 161 | return; |
| 162 | } |
| 163 | |
| 164 | echo '<span class="sr-only screen-reader-text">' . esc_html( $this->settings->accessibility_screen_reader_text ) . '</span>'; |
| 165 | } |
| 166 | |
| 167 | /** |
| 168 | * Returns the CSS for the front view. |
| 169 | * |
| 170 | * @param Settings_Entity $settings Settings object. |
| 171 | * |
| 172 | * @return string CSS output. |
| 173 | */ |
| 174 | public function get_css( $settings ) { |
| 175 | $this->settings = $settings; |
| 176 | |
| 177 | ob_start(); |
| 178 | $this->write_css(); |
| 179 | $css = ob_get_clean(); |
| 180 | $css = empty( $css ) ? '' : $css; |
| 181 | return $css; |
| 182 | } |
| 183 | |
| 184 | /** |
| 185 | * Writes the CSS for the front view. |
| 186 | * |
| 187 | * @return void |
| 188 | */ |
| 189 | private function write_css() { |
| 190 | include dirname( __DIR__ ) . '/assets/wpfront-scroll-top.css'; |
| 191 | |
| 192 | $this->location_css(); |
| 193 | $this->write_hide_small_window_css(); |
| 194 | |
| 195 | $this->write_image_button_css(); |
| 196 | $this->write_text_button_css(); |
| 197 | $this->write_font_awesome_button_css(); |
| 198 | |
| 199 | $this->write_extra_css(); |
| 200 | } |
| 201 | |
| 202 | /** |
| 203 | * Outputs the CSS for the location. |
| 204 | * |
| 205 | * @return void |
| 206 | */ |
| 207 | protected function location_css() { |
| 208 | $margin_x = strval( $this->settings->margin_x ); |
| 209 | $margin_y = strval( $this->settings->margin_y ); |
| 210 | |
| 211 | echo '#wpfront-scroll-top-container{'; |
| 212 | switch ( $this->settings->location ) { |
| 213 | case 1: |
| 214 | echo 'right:' . esc_attr( $margin_x ) . 'px;'; |
| 215 | echo 'bottom:' . esc_attr( $margin_y ) . 'px;'; |
| 216 | break; |
| 217 | case 2: |
| 218 | echo 'left:' . esc_attr( $margin_x ) . 'px;'; |
| 219 | echo 'bottom:' . esc_attr( $margin_y ) . 'px;'; |
| 220 | break; |
| 221 | case 3: |
| 222 | echo 'right:' . esc_attr( $margin_x ) . 'px;'; |
| 223 | echo 'top:' . esc_attr( $margin_y ) . 'px;'; |
| 224 | break; |
| 225 | case 4: |
| 226 | echo 'left:' . esc_attr( $margin_x ) . 'px;'; |
| 227 | echo 'top:' . esc_attr( $margin_y ) . 'px;'; |
| 228 | break; |
| 229 | } |
| 230 | echo '}'; |
| 231 | } |
| 232 | |
| 233 | /** |
| 234 | * Outputs the CSS for the image button. |
| 235 | * |
| 236 | * @return void |
| 237 | */ |
| 238 | private function write_image_button_css() { |
| 239 | $button_width = strval( $this->settings->button_width ); |
| 240 | $button_height = strval( $this->settings->button_height ); |
| 241 | ?> |
| 242 | #wpfront-scroll-top-container img { |
| 243 | width: <?php echo 0 === $this->settings->button_width ? 'auto' : esc_attr( $button_width ) . 'px'; ?>; |
| 244 | height: <?php echo 0 === $this->settings->button_height ? 'auto' : esc_attr( $button_height ) . 'px'; ?>; |
| 245 | } |
| 246 | <?php |
| 247 | } |
| 248 | |
| 249 | /** |
| 250 | * Outputs the CSS for the text button. |
| 251 | * |
| 252 | * @return void |
| 253 | */ |
| 254 | private function write_text_button_css() { |
| 255 | $button_width = strval( $this->settings->button_width ); |
| 256 | $button_height = strval( $this->settings->button_height ); |
| 257 | ?> |
| 258 | #wpfront-scroll-top-container .text-holder { |
| 259 | color: <?php echo esc_attr( $this->settings->text_button_text_color ); ?>; |
| 260 | background-color: <?php echo esc_attr( $this->settings->text_button_background_color ); ?>; |
| 261 | width: <?php echo 0 === $this->settings->button_width ? 'auto' : esc_attr( $button_width ) . 'px'; ?>; |
| 262 | height: <?php echo 0 === $this->settings->button_height ? 'auto' : esc_attr( $button_height ) . 'px'; ?>; |
| 263 | <?php echo 0 === $this->settings->button_height ? '' : 'line-height:' . esc_attr( $button_height ) . 'px'; ?>; |
| 264 | |
| 265 | <?php |
| 266 | $this->wp->echo_css( $this->settings->text_button_css ); |
| 267 | ?> |
| 268 | } |
| 269 | |
| 270 | #wpfront-scroll-top-container .text-holder:hover { |
| 271 | background-color: <?php echo esc_attr( $this->settings->text_button_hover_color ); ?>; |
| 272 | } |
| 273 | <?php |
| 274 | } |
| 275 | |
| 276 | /** |
| 277 | * Outputs the CSS for the font awesome button. |
| 278 | * |
| 279 | * @return void |
| 280 | */ |
| 281 | protected function write_font_awesome_button_css() { |
| 282 | ?> |
| 283 | #wpfront-scroll-top-container i { |
| 284 | color: <?php echo esc_attr( $this->settings->fa_button_text_color ); ?>; |
| 285 | } |
| 286 | |
| 287 | <?php |
| 288 | $this->wp->echo_css( $this->settings->fa_button_css ); |
| 289 | } |
| 290 | |
| 291 | /** |
| 292 | * Outputs the CSS to hide the button in small windows. |
| 293 | * |
| 294 | * @return void |
| 295 | */ |
| 296 | protected function write_hide_small_window_css() { |
| 297 | if ( $this->settings->hide_small_window ) { |
| 298 | ?> |
| 299 | @media screen and (max-width: <?php echo esc_attr( strval( $this->settings->small_window_width ) ) . 'px'; ?>) { |
| 300 | #wpfront-scroll-top-container { |
| 301 | visibility: hidden; |
| 302 | } |
| 303 | } |
| 304 | <?php |
| 305 | } |
| 306 | } |
| 307 | |
| 308 | /** |
| 309 | * Outputs the extra CSS. |
| 310 | * |
| 311 | * @return void |
| 312 | */ |
| 313 | protected function write_extra_css() { |
| 314 | if ( ! empty( $this->settings->css_extra_css ) ) { |
| 315 | $this->wp->echo_css( $this->settings->css_extra_css ); |
| 316 | } |
| 317 | } |
| 318 | } |
| 319 |