Mantis ticket #17227: Replace ilOverlay with a bootstrap Modal

leifos-gmbh · Aug 9, 2016 · 55b4534 · 55b4534
1 parent 7a37834
commit 55b4534
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 36 deletions.
diff --git a/Modules/Test/classes/class.ilTestScoringByQuestionsGUI.php b/Modules/Test/classes/class.ilTestScoringByQuestionsGUI.php
@@ -90,11 +90,13 @@ private function showManScoringByQuestionParticipantsTable($manPointsPost = arra
 			$tpl->addJavaScript($mathJaxSetting->get("path_to_mathjax"));
 		}
 
-		$tpl->addJavascript('./Services/UIComponent/Overlay/js/ilOverlay.js');
 		$tpl->addJavaScript("./Services/JavaScript/js/Basic.js");
 		$tpl->addJavaScript("./Services/Form/js/Form.js");
+		$tpl->addJavascript('./Services/UIComponent/Modal/js/Modal.js');
 		$tpl->addCss($this->object->getTestStyleLocation("output"), "screen");
 
+		$this->lng->toJSMap(array('answer' => $this->lng->txt('answer')));
+
 		require_once 'Modules/Test/classes/tables/class.ilTestManScoringParticipantsBySelectedQuestionAndPassTableGUI.php';
 		$table = new ilTestManScoringParticipantsBySelectedQuestionAndPassTableGUI($this);
 

diff --git a/...st/classes/tables/class.ilTestManScoringParticipantsBySelectedQuestionAndPassTableGUI.php b/...st/classes/tables/class.ilTestManScoringParticipantsBySelectedQuestionAndPassTableGUI.php
@@ -20,6 +20,11 @@ class ilTestManScoringParticipantsBySelectedQuestionAndPassTableGUI extends ilTa
 	private $manPointsPostData = array();
 
 	private $curQuestionMaxPoints = null;
+
+	/**
+	 * @var bool
+	 */
+	protected $first_row_rendered = false;
 
 	public function __construct($parentObj)
 	{
@@ -126,6 +131,12 @@ public function fillRow($row)
 		 */
 		global $ilCtrl;
 
+		if(!$this->first_row_rendered)
+		{
+			$this->first_row_rendered = true;
+			$this->tpl->touchBlock('row_js');
+		}
+
 		$this->tpl->setVariable('VAL_NAME', $row['participant']->getName());
 		$reached_points = new ilNumberInputGUI('', 'scoring[' . $row['pass_id'] . '][' . $row['active_id'] . '][' . $row['qst_id'] . ']');
 		$reached_points->allowDecimals(true);
@@ -152,7 +163,6 @@ public function fillRow($row)
 			$reached_points->setValue($row['reached_points']);
 		}
 		$this->tpl->setVariable('VAL_REACHED_POINTS', $reached_points->render());
-		$this->tpl->setVariable('VAL_ID', md5($row['pass_id'] . $row['active_id'] . $row['qst_id']));
 
 		$ilCtrl->setParameter($this->getParentObject(), 'qst_id', $row['qst_id']);
 		$ilCtrl->setParameter($this->getParentObject(), 'active_id', $row['active_id']);

diff --git a/Modules/Test/templates/default/tpl.il_as_tst_man_scoring_by_question_tblrow.html b/Modules/Test/templates/default/tpl.il_as_tst_man_scoring_by_question_tblrow.html
@@ -10,49 +10,46 @@
 		<!-- END reached_points_alert -->
 	</td>
 	<td class="std">
-		<a class="il_ContainerItemCommand" id="answ_{VAL_ID}" href="#">{VAL_TXT_ANSWER}</a>
-		<script>
+		<a class="il_ContainerItemCommand iosAssAnswerModalTrigger" data-answer-href="{VAL_LINK_ANSWER}" href="#">{VAL_TXT_ANSWER}</a>
+		<!-- BEGIN row_js -->
+		<script type="text/javascript">
 			(function($) {
-				$("#answ_{VAL_ID}").click(function(e) {
+				$().ready(function() {
+					$(".iosAssAnswerModalTrigger").on("click", function(e) {
+						var $this = $(this),
+							modal = $this.data("modal");
 
-					il.Overlay.hideAllOverlays(e.originalEvent, true);
+						e.preventDefault();
+						e.stopPropagation();
 
-					var $this = $(this);
-					var $panel = $('#answer_container_' + $this.attr('id'));
+						if (modal == undefined) {
+							$.ajax({
+								url: $this.data("answer-href"),
+								dataType: 'html',
+								success: function(data) {
+									modal = il.Modal.dialogue({
+										show:    false,
+										header:  il.Language.txt('answer'),
+										body:    data,
+										buttons: {}
+									});
 
-					if ($panel.size() == 0) {
-						var $panel = $('<div class="ilOverlay ilRightPanel yui-module yui-overlay" style="overflow: auto; display: none;" id="answer_container_' + $this.attr('id') + '"></div>')
-								.css({
-									position: 'fixed',
-									top: '0px',
-									bottom: '0px',
-									left: '',
-									right: '0px',
-									width: '40%',
-									padding: '5px'
-								});
-						$panel.insertAfter($this);
+									$this.data("modal", modal);
 
-						$.ajax({
-							url: '{VAL_LINK_ANSWER}',
-							dataType: 'html',
-							success: function(data) {
-								$panel.html(data);
-								il.Overlay.add('answer_container_' + $this.attr('id'), {yuicfg: {}});
-								il.Overlay.show(e.originalEvent, 'answer_container_' + $this.attr('id'));
+									if (typeof MathJax != "undefined") {
+										MathJax.Hub.Queue(["Typeset", MathJax.Hub]);
+									}
 
-								if (typeof MathJax != "undefined") {
-									MathJax.Hub.Queue(["Typeset", MathJax.Hub]);
+									modal.show();
 								}
-							}
-						})
-					} else {
-						il.Overlay.show(e.originalEvent, 'answer_container_' + $this.attr('id'));
-					}
-					return false;
-
+							})
+						} else {
+							modal.show();
+						}
+					});
 				});
 			}(jQuery));
 		</script>
+		<!-- END row_js -->
 	</td>
 </tr>