From bd559904ec11f6cd5eb35ed0feddacd14a34a3d9 Mon Sep 17 00:00:00 2001
From: Diego Najar <dignajar@gmail.com>
Date: Fri, 4 Jan 2019 14:18:40 +0100
Subject: [PATCH] switch for publish and draft

---
 bl-kernel/admin/themes/booty/css/bludit.css | 59 +++++++++++++++++++++
 bl-kernel/admin/views/content.php           |  8 ++-
 bl-kernel/admin/views/edit-content.php      | 49 ++++++++++-------
 bl-kernel/admin/views/new-content.php       | 51 ++++++++++--------
 4 files changed, 126 insertions(+), 41 deletions(-)

diff --git a/bl-kernel/admin/themes/booty/css/bludit.css b/bl-kernel/admin/themes/booty/css/bludit.css
index 2b5f6ddb..f40a7f10 100644
--- a/bl-kernel/admin/themes/booty/css/bludit.css
+++ b/bl-kernel/admin/themes/booty/css/bludit.css
@@ -340,3 +340,62 @@ img.profilePicture {
 	border: 1px solid #ccc;
 }
 
+/* Switch button */
+.switch {
+	position: relative;
+	height: 26px;
+	width: 120px;
+	background: #f3f3f3;
+	border: 1px solid #ced4d9;
+	border-radius: 2px;
+}
+
+.switch-label {
+	position: relative;
+	z-index: 2;
+	float: left;
+	width: 58px;
+	line-height: 25px;
+	font-size: 11px;
+	text-align: center;
+	cursor: pointer;
+	margin: 0 !important;
+}
+.switch-label:active {
+	font-weight: bold;
+}
+
+.switch-label-off {
+	padding-left: 2px;
+}
+
+.switch-label-on {
+	padding-right: 2px;
+}
+
+.switch-input {
+	display: none;
+}
+
+.switch-input:checked + .switch-label {
+	font-weight: bold;
+	color: #fff;
+	transition: 0.15s ease-out;
+	transition-property: color, text-shadow;
+}
+.switch-input:checked + .switch-label-on ~ .switch-selection {
+	left: 50%;
+}
+
+.switch-selection {
+	position: absolute;
+	z-index: 1;
+	top: 2px;
+	left: 2px;
+	display: block;
+	width: 58px;
+	height: 21px;
+	border-radius: 2px;
+	background-color: #6c757d;
+	transition: left 0.15s ease-out;
+}
diff --git a/bl-kernel/admin/views/content.php b/bl-kernel/admin/views/content.php
index 3f36ab2b..fcf2f3f9 100644
--- a/bl-kernel/admin/views/content.php
+++ b/bl-kernel/admin/views/content.php
@@ -87,7 +87,9 @@ function table($type) {
 
 					echo '<td class="pt-3 text-center d-none d-sm-table-cell w-25">'.PHP_EOL;
 					echo '<a class="btn btn-outline-secondary btn-sm mb-1" href="'.HTML_PATH_ADMIN_ROOT.'edit-content/'.$page->key().'"><span class="oi oi-pencil"></span> '.$L->g('Edit').'</a>'.PHP_EOL;
-					echo '<button type="button" class="btn btn-outline-danger btn-sm deletePageButton mb-1" data-toggle="modal" data-target="#jsdeletePageModal" data-key="'.$page->key().'"><span class="oi oi-trash"></span> '.$L->g('Delete').'</button>'.PHP_EOL;
+					if (count($page->children())==0) {
+						echo '<button type="button" class="btn btn-outline-danger btn-sm deletePageButton mb-1" data-toggle="modal" data-target="#jsdeletePageModal" data-key="'.$page->key().'"><span class="oi oi-trash"></span> '.$L->g('Delete').'</button>'.PHP_EOL;
+					}
 					echo '</td>';
 
 					echo '</tr>';
@@ -143,7 +145,9 @@ function table($type) {
 
 				echo '<td class="pt-3 text-center d-none d-sm-table-cell w-25">'.PHP_EOL;
 				echo '<a class="btn btn-outline-secondary btn-sm mb-1" href="'.HTML_PATH_ADMIN_ROOT.'edit-content/'.$page->key().'"><span class="oi oi-pencil"></span> '.$L->g('Edit').'</a>'.PHP_EOL;
-				echo '<button type="button" class="btn btn-outline-danger btn-sm deletePageButton mb-1" data-toggle="modal" data-target="#jsdeletePageModal" data-key="'.$page->key().'"><span class="oi oi-trash"></span> '.$L->g('Delete').'</button>'.PHP_EOL;
+				if (count($page->children())==0) {
+					echo '<button type="button" class="btn btn-outline-danger btn-sm deletePageButton mb-1" data-toggle="modal" data-target="#jsdeletePageModal" data-key="'.$page->key().'"><span class="oi oi-trash"></span> '.$L->g('Delete').'</button>'.PHP_EOL;
+				}
 				echo '</td>';
 
 				echo '</tr>';
diff --git a/bl-kernel/admin/views/edit-content.php b/bl-kernel/admin/views/edit-content.php
index e4f1867e..518f3ce9 100644
--- a/bl-kernel/admin/views/edit-content.php
+++ b/bl-kernel/admin/views/edit-content.php
@@ -60,29 +60,37 @@ echo Bootstrap::formOpen(array(
 	</div>
 
 	<div id="jseditorToolbarLeft">
-		<button type="button" class="btn btn-sm btn-primary" id="jsbuttonSave"><?php echo ($page->draft()?$L->g('Publish'):$L->g('Save')) ?></button>
+		<button type="button" class="btn btn-sm btn-primary" id="jsbuttonSave"><?php echo $L->g('Save') ?></button>
 
-		<?php if($page->draft()): ?>
-		<button type="button" class="btn btn-sm btn-secondary" id="jsbuttonDraft"><?php $L->p('Save as draft') ?></button>
-		<?php endif; ?>
-
-		<?php if (count($page->children())==0): ?>
+		<!-- <?php if (count($page->children())==0): ?>
 		<button type="button" class="btn btn-sm btn-danger" id="jsbuttonDelete" data-toggle="modal" data-target="#jsdeletePageModal"><?php $L->p('Delete') ?></button>
-		<?php endif; ?>
+		<?php endif; ?> -->
 
-		<a href="<?php echo HTML_PATH_ADMIN_ROOT ?>dashboard" class="btn btn-sm btn-secondary"><?php $L->p('Cancel') ?></a>
+		<span class="d-inline-block align-middle ml-1">
+			<div class="switch">
+			<input type="radio" class="switch-input" name="switch" value="" id="jsPublishSwitch" <?php echo (!$page->draft()?'checked':'') ?>>
+			<label for="jsPublishSwitch" class="switch-label switch-label-off">Publish</label>
+			<input type="radio" class="switch-input" name="switch" value="" id="jsDraftSwitch" <?php echo ($page->draft()?'checked':'') ?>>
+			<label for="jsDraftSwitch" class="switch-label switch-label-on">Draft</label>
+			<span class="switch-selection"></span>
+			</div>
+		</span>
 	</div>
 
-	<?php if($page->draft()): ?>
-	<div class="alert alert-warning p-1 mt-1 mb-0"><?php $L->p('the-content-is-saved-as-a-draft-to-publish-it') ?></div>
-	<?php endif; ?>
-
 	<?php if($page->scheduled()): ?>
 	<div class="alert alert-warning p-1 mt-1 mb-0"><?php $L->p('scheduled') ?>: <?php echo $page->date(SCHEDULED_DATE_FORMAT) ?></div>
 	<?php endif; ?>
 </div>
 <script>
 	$(document).ready(function() {
+		$("#jsPublishSwitch").on("click", function() {
+			$("#jstype").val("published");
+		});
+
+		$("#jsDraftSwitch").on("click", function() {
+			$("#jstype").val("draft");
+		});
+
 		$("#jsoptionsSidebar").on("click", function() {
 			$("#jseditorSidebar").toggle();
 			$("#jsshadow").toggle();
@@ -177,11 +185,11 @@ echo Bootstrap::formOpen(array(
 
 				// Type
 				echo Bootstrap::formSelectBlock(array(
-					'name'=>'typeTMP',
+					'name'=>'typeSelector',
 					'label'=>$L->g('Type'),
 					'selected'=>$page->type(),
 					'options'=>array(
-						'published'=>'- '.$L->g('Default').' -',
+						'default'=>'- '.$L->g('Default').' -',
 						'sticky'=>$L->g('Sticky'),
 						'static'=>$L->g('Static')
 					),
@@ -382,11 +390,16 @@ echo Bootstrap::formOpen(array(
 <script>
 $(document).ready(function() {
 
-	// Button Publish or Save
+	// Button Save
 	$("#jsbuttonSave").on("click", function() {
-		// Get the type
-		var type = $("#jstypeTMP option:selected").val();
-		$("#jstype").val(type);
+		// Get the type from the selector
+		var typeSelector = $("#jstypeSelector option:selected").val();
+		// Get the type from the switch
+		var typeSwitch = $("#jstype").val();
+		// Set the type from the selector if the switch is publish
+		if ((typeSelector!='default') && (typeSwitch=='published')) {
+			$("#jstype").val(typeSelector);
+		}
 
 		// Get the content
 		$("#jscontent").val( editorGetContent() );
diff --git a/bl-kernel/admin/views/new-content.php b/bl-kernel/admin/views/new-content.php
index 0f7bd51b..b174d610 100644
--- a/bl-kernel/admin/views/new-content.php
+++ b/bl-kernel/admin/views/new-content.php
@@ -54,13 +54,29 @@ echo Bootstrap::formOpen(array(
 	</div>
 
 	<div id="jseditorToolbarLeft">
-		<button type="button" class="btn btn-sm btn-primary" id="jsbuttonSave"><?php $L->p('Publish') ?></button>
-		<button type="button" class="btn btn-sm btn-secondary" id="jsbuttonDraft"><?php $L->p('Save as draft') ?></button>
-		<a href="<?php echo HTML_PATH_ADMIN_ROOT ?>dashboard" class="btn btn-sm btn-secondary"><?php $L->p('Cancel') ?></a>
+		<button type="button" class="btn btn-sm btn-primary" id="jsbuttonSave"><?php $L->p('Save') ?></button>
+
+		<span class="d-inline-block align-middle ml-1">
+			<div class="switch">
+			<input type="radio" class="switch-input" name="switch" value="" id="jsPublishSwitch" checked>
+			<label for="jsPublishSwitch" class="switch-label switch-label-off">Publish</label>
+			<input type="radio" class="switch-input" name="switch" value="" id="jsDraftSwitch">
+			<label for="jsDraftSwitch" class="switch-label switch-label-on">Draft</label>
+			<span class="switch-selection"></span>
+			</div>
+		</span>
 	</div>
 </div>
 <script>
 	$(document).ready(function() {
+		$("#jsPublishSwitch").on("click", function() {
+			$("#jstype").val("published");
+		});
+
+		$("#jsDraftSwitch").on("click", function() {
+			$("#jstype").val("draft");
+		});
+
 		$("#jsoptionsSidebar").on("click", function() {
 			$("#jseditorSidebar").toggle();
 			$("#jsshadow").toggle();
@@ -147,11 +163,11 @@ echo Bootstrap::formOpen(array(
 
 				// Type
 				echo Bootstrap::formSelectBlock(array(
-					'name'=>'typeTMP',
+					'name'=>'typeSelector',
 					'label'=>$L->g('Type'),
 					'selected'=>'',
 					'options'=>array(
-						'published'=>'- '.$L->g('Default').' -',
+						'default'=>'- '.$L->g('Default').' -',
 						'sticky'=>$L->g('Sticky'),
 						'static'=>$L->g('Static')
 					),
@@ -320,23 +336,16 @@ echo Bootstrap::formOpen(array(
 <script>
 $(document).ready(function() {
 
-	// Button Publish or Save
+	// Button Save
 	$("#jsbuttonSave").on("click", function() {
-		// Get the type
-		var type = $("#jstypeTMP option:selected").val();
-		$("#jstype").val(type);
-
-		// Get the content
-		$("#jscontent").val( editorGetContent() );
-
-		// Submit the form
-		$("#jsform").submit();
-	});
-
-	// Button Save as draft
-	$("#jsbuttonDraft").on("click", function() {
-		// Set the type as draft
-		$("#jstype").val("draft");
+		// Get the type from the selector
+		var typeSelector = $("#jstypeSelector option:selected").val();
+		// Get the type from the switch
+		var typeSwitch = $("#jstype").val();
+		// Set the type from the selector if the switch is publish
+		if ((typeSelector!='default') && (typeSwitch=='published')) {
+			$("#jstype").val(typeSelector);
+		}
 
 		// Get the content
 		$("#jscontent").val( editorGetContent() );