Issue #3268990 by diegors, luiscarvalho, lucassc, RenatoG: Reimplement show... (191090d5) · Commits · project / modal_page

config/schema/modal.schema.yml

+9 −0

Changes for config/schema/modal.schema.yml: 9 added lines, 0 removed lines.
Original line number	Diff line number	Diff line
		@@ -60,6 +60,15 @@ modal_page.modal.*:
		delay_display:
		type: string
		label: 'Delay to display'
		enable_show_on_height:
		type: boolean
		label: 'Enable show on height'
		height_offset:
		type: string
		label: 'Offset value'
		height_offset_touch:
		type: string
		label: 'Offset position'
		published:
		type: boolean
		label: 'Published'

js/modal-page.js

+45 −0

Changes for js/modal-page.js: 45 added lines, 0 removed lines.
Original line number	Diff line number	Diff line
		@@ -95,6 +95,50 @@
		// Open Modal on Auto Open.
		if (auto_open == true) {

		// Verify if the modal should be trigged by height instead of time
		var offsetHeight = $(modal).find('#height_offset').val();

		if (offsetHeight) {

		// If page has no scrollbar show the modal.
		if ($(document).height() == $(window).height()) {
		modal.modal();
		$(document).off(namespace);
		return;
		}

		// Namespace guarantee we are only working with events of one modal, even on the DOM document.
		var namespace = '.' + $(modal).attr('aria-describedby');
		// Check if is using pixels or percentage, if using percentage
		// remove the % symbol, if using pixels convert to percentage.
		if (!$.isNumeric(offsetHeight)) {
		offsetHeight = offsetHeight.slice(0, -1);
		} else {
		offsetHeight = (offsetHeight / $(document).height()) * 100;
		}
		$(document).on('scroll' + namespace, function () {
		// Account for the offset touch option
		// 0 to start, 0.5 to center, 1 to end.
		var offsetTouch = $(modal).find('#height_offset').attr('offset-type');

		// Getting the position of the scroll on the page according to
		// the page total size and window size.
		var positionY = Math.round(
		($(window).scrollTop() / ($(document).height() - $(window)
		.height())) * 100
		);

		var windowPercentage = Math.round(($(window).height() / $(document).height()) * 100);

		// Adjusting the scroll position by the offsetTouch.
		positionY = positionY + (offsetTouch * windowPercentage);

		if (positionY >= offsetHeight) {
		modal.modal();
		$(document).off(namespace);
		}
		});
		} else {
		// Verify if there is a delay to show Modal.
		var delay = $(modal).find('#delay_display').val() * 1000;

		@@ -102,6 +146,7 @@
		modal.modal();
		}, delay);
		}
		}

		// Open Modal Page clicking on "open-modal-page" class.
		$('.open-modal-page', modal).on('click', function () {

modal_page.module

+6 −0

Changes for modal_page.module: 6 added lines, 0 removed lines.
Original line number	Diff line number	Diff line
		@@ -65,6 +65,9 @@ function modal_page_theme() {
		'display_title' => NULL,
		'text' => NULL,
		'delay_display' => NULL,
		'enable_show_on_height' => NULL,
		'height_offset' => NULL,
		'height_offset_touch' => NULL,
		'modal_size' => NULL,
		'button' => NULL,
		'id' => NULL,
		@@ -134,6 +137,9 @@ function modal_page_preprocess_html(&$variables) {
		'#display_title' => $modal->getDisplayTitle(),
		'#text' => $modal->getBody(),
		'#delay_display' => $modal->getDelayDisplay(),
		'#enable_show_on_height' => $modal->getEnableShowOnHeight(),
		'#height_offset' => $modal->getHeightOffset(),
		'#height_offset_touch' => $modal->getHeightOffsetTouch(),
		'#modal_size' => $modal->getModalSize(),
		'#button' => $modal->getOkLabelButton(),
		'#id' => $modal->id(),

src/Entity/Modal.php

+72 −0

Changes for src/Entity/Modal.php: 72 added lines, 0 removed lines.
Original line number	Diff line number	Diff line
		@@ -52,6 +52,9 @@ use Drupal\Core\Config\Entity\ConfigEntityBase;
		* "roles" = "roles",
		* "type" = "type",
		* "delay_display" = "delay_display",
		* "enable_show_on_height" = "enable_show_on_height",
		* "height_offset" = "height_offset",
		* "height_offset_touch" = "height_offset_touch",
		* "published" = "published",
		* "insert_horizontal_line_header" = "insert_horizontal_line_header",
		* "insert_horizontal_line_footer" = "insert_horizontal_line_footer",
		@@ -95,6 +98,9 @@ use Drupal\Core\Config\Entity\ConfigEntityBase;
		* "roles",
		* "type",
		* "delay_display",
		* "enable_show_on_height",
		* "height_offset",
		* "height_offset_touch",
		* "published",
		* "insert_horizontal_line_header",
		* "insert_horizontal_line_footer",
		@@ -248,6 +254,27 @@ class Modal extends ConfigEntityBase implements ModalInterface {
		*/
		protected $delayDisplay;

		/**
		* Enable Show On Height.
		*
		* @var string
		*/
		protected $enableShowOnHeight;

		/**
		* Height Offset.
		*
		* @var string
		*/
		protected $heightOffset;

		/**
		* Height Offset Touch.
		*
		* @var string
		*/
		protected $heightOffsetTouch;

		/**
		* Published.
		*
		@@ -638,6 +665,51 @@ class Modal extends ConfigEntityBase implements ModalInterface {
		return $this;
		}

		/**
		* Get Enable Show On Height.
		*/
		public function getEnableShowOnHeight() {
		return $this->get('enable_show_on_height');
		}

		/**
		* Set Enable Show On Height.
		*/
		public function setEnableShowOnHeight($enableShowOnHeight) {
		$this->set('enable_show_on_height', $enableShowOnHeight);
		return $this;
		}

		/**
		* Get Height Offset.
		*/
		public function getHeightOffset() {
		return $this->get('height_offset');
		}

		/**
		* Set Height Offset.
		*/
		public function setHeightOffset($heightOffset) {
		$this->set('height_offset', $heightOffset);
		return $this;
		}

		/**
		* Get Height Offset Touch.
		*/
		public function getHeightOffsetTouch() {
		return $this->get('height_offset_touch');
		}

		/**
		* Set Height Offset Touch.
		*/
		public function setHeightOffsetTouch($heightOffsetTouch) {
		$this->set('height_offset_touch', $heightOffsetTouch);
		return $this;
		}

		/**
		* Get Published.
		*/

src/Entity/ModalInterface.php

+30 −0

Changes for src/Entity/ModalInterface.php: 30 added lines, 0 removed lines.
Original line number	Diff line number	Diff line
		@@ -179,6 +179,36 @@ interface ModalInterface extends ConfigEntityInterface {
		*/
		public function setDelayDisplay($delayDisplay);

		/**
		* Get Enable Show On Height.
		*/
		public function getEnableShowOnHeight();

		/**
		* Set Enable Show On Height.
		*/
		public function setEnableShowOnHeight($enableShowOnHeight);

		/**
		* Get Height offset.
		*/
		public function getHeightOffset();

		/**
		* Set Height Offset.
		*/
		public function setHeightOffset($heightOffset);

		/**
		* Get Height offset Touch.
		*/
		public function getHeightOffsetTouch();

		/**
		* Set Height Offset Touch.
		*/
		public function setHeightOffsetTouch($heightOffsetTouch);

		/**
		* Get Published.
		*/