ADD кнопка, отключающая автопросмотр - автомаркдаун, так сказать

ground/controllers/ArticleController.php

@@ -77,6 +77,7 @@ class ArticleController extends Controller
 		self::addScript('/js/jquery-ui-1.10.4.custom.min.js');
 		self::addScript('/js/bootstrap.min.js');
 		self::addScript('/js/app.js?ver=' . App::getConfig('version'));
+		self::addScript('/js/jquery.cookie.js');
 		self::addScript('/js/articleEdit.js?ver=' . App::getConfig('version'));
 		self::addScript('http://cdnjs.cloudflare.com/ajax/libs/fotorama/4.6.3/fotorama.js');
 		self::addStyle('/css/style.css?ver=' . App::getConfig('version'));

ground/views/articles/edit.php

@@ -3,7 +3,7 @@
 	<input type="hidden" name="allowComments" value="1" />
 <!--	<input type="checkbox" name="allowComments" id="articleComments" <?= $article->allowComments ? 'checked' : '' ?> />Разрешить комментарии-->
 
-	<table style="height: 100%; width: 100%">
+	<table style="height: 100%; width: 100%" class="<?= (isset($_COOKIE["disableAutoview"]) && $_COOKIE["disableAutoview"] == 'true')?'singleEditor':'doubleEditor' ?>" id="mainEditorTable">
 		<tr  style="height: 1%;">
 			<td colspan="2">
 				<div class="form-group" style="margin-bottom: -1px;">
@@ -21,13 +21,13 @@
 					<?php endif; ?>
 					<a href="/user/" class="btn btn-sm btn-danger" onclick="return confirm('Несохраненные изменения будут утеряны! Выйти?')" title="Выйти без сохранения"><span class="glyphicon glyphicon-floppy-remove" aria-hidden="true"></span> выйти из редактора</a>
 				</div>
-				<div class="btn-group" role="group" aria-label="...">
+				<div class="btn-group" role="group">
 					<?php if ($article->status == 'draft') : ?>
 						<button type="submit" class="btn btn-sm btn-default" name="save" value="published" title="Сохранить"><span class="glyphicon glyphicon-floppy-saved"></span> сохранить и опубликовать</button>
 					<?php endif; ?>
 					<button type="submit" id="submitButton" class="btn btn-sm btn-default" name="save" value="save" title="Сохранить изменения"><span class="glyphicon glyphicon-floppy-disk"></span> сохранить<?= ($article->status == 'draft') ? ' черновик' : '' ?></button>
 				</div>
-				<div class="btn-group" role="group" aria-label="...">
+				<div class="btn-group" role="group">
 					<button type="button" class="btn btn-default btn-sm" title="Жирый" onclick="markBold()"><b>Ж</b></button>
 					<button type="button" class="btn btn-default btn-sm" title="Курсив" onclick="markItalic()"><i>К</i></button>
 					<button type="button" class="btn btn-default btn-sm" title="Подчеркивание" onclick="markUnderline()"><u>П</u></button>
@@ -35,13 +35,16 @@
 					<button type="button" class="btn btn-default btn-sm" title="Ссылка на точку" onclick="insertPoint()"><span class="glyphicon glyphicon-map-marker" aria-hidden="true"></span></button>
 					<button type="button" class="btn btn-default btn-sm" title="Подсказка по разметке" onclick="$('#articleInfoModal').modal('show');"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span> разметка</button>
 				</div>
+				<div class="btn-group" role="group">
+					<button type="button" id="autoviewSwitcher" class="btn btn-default btn-sm <?= (isset($_COOKIE["disableAutoview"]) && $_COOKIE["disableAutoview"] == 'true')?'':'active' ?>" title="Автопросмотр" onclick="toggleAutoview()">Автопросмотр</button>
+				</div>
 			</td>
 		</tr>
-		<tr  style="height: 99%;">
-			<td style="width: 50%;">
+		<tr  style="height: 99%;" class="main">
+			<td>
 				<textarea name="text" id="articleText" class="form-control"  onscroll="monitor.scrollTop=scrollTop" style="height: 100%; min-height: 100px; padding-top: 4px; resize: none;" ><?= $article->text ?></textarea>
 			</td>
-			<td style="width: 50%;"><div id="monitor" style=""></div></td>
+			<td id="monitorContainer"><div id="monitor" style=""></div></td>
 		</tr>
 	</table>
 </form>

public/css/articleEdit.css

@@ -6,6 +6,10 @@ input#articleTitle {font-size: 30px;font-weight: 600;height: 45px; border-radius
 .nopaddingx {padding-left: 0;padding-right: 0;}
 .nopaddingy {padding-bottom: 0;padding-top: 0;}
 
+table.doubleEditor tr.main td {width: 50%}
+table.singleEditor tr.main td {width: 100%}
+table.singleEditor tr.main td#monitorContainer {display: none;}
+
 #articleText {border-radius:0;}
 #articleText {width: 100%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;font-family: monospace;color: #fffbec;background-color: #1e1e1e;}
 #monitor {height: 100%; width: 100%; background-color: white; overflow-y: scroll; padding: 5px 10px; border: solid 1px #ccc; border-radius: 0px;}

public/js/articleEdit.js

@@ -101,7 +101,9 @@ $('#articleText').keyup(function () {
 	clearTimeout(monitorTimeout);
 	monitorTimeout = setTimeout(function () {
 		$('#submitButton').removeClass('btn-default').addClass('btn-info');
-		markdown();
+		if ($('#mainEditorTable').hasClass('doubleEditor')) {
+			markdown();
+		}
 	}, 200);
 }).keydown(function () {
 	clearTimeout(monitorTimeout)
@@ -129,3 +131,11 @@ function togglePhotobank()
 {
 	$('#photobankContainer').slideToggle(200);
 }
+
+function toggleAutoview()
+{
+	$('#mainEditorTable').toggleClass('doubleEditor').toggleClass('singleEditor');
+	$('#autoviewSwitcher').toggleClass('active');
+	markdown();
+	$.cookie('disableAutoview', $('#mainEditorTable').hasClass('singleEditor'));
+}