Pridana fotogalerie

dist/custom.css

@@ -1,23 +1,3 @@
-
-.title-image {
-	height: 700px;
-	width: 100%;
-	background-repeat: no-repeat;
-	background-size: cover;
-	background-position: center center;
-	margin-bottom: 3rem;
-}
-
-
-.image-preview {
-	max-width: 100%;
-	border: solid 1px;
-	margin: 10px 0;
-	display: none;
-}
-
-
-
 /*Google Places autocomplete*/
 .pac-container {
 	z-index: 99999;

dist/custom.js

@@ -1,53 +1,4 @@
-
+$ ('#mainInfoModal').on ('show.bs.modal', function (e) {
-var editors =new Jodit('.wysiwyg');
-
-function readURL(input, preview) {
-
-	// ignore
-	if (preview == null) {
-		alert('preview is null');
-		return;
-	}
-
-	// display preview in given element
-	if (input.files && input.files[0]) {
-		var reader = new FileReader();
-
-		reader.onload = function(e) {
-			preview.attr('src', e.target.result).show();
-		}
-
-		reader.readAsDataURL(input.files[0]);
-	}
-}
-
-$(".file-upload").change(function() {
-	var preview = null;
-
-	if ($(this).data('preview')) {
-		preview = $($(this).data('preview'));
-	}
-
-	readURL(this, preview);
-});
-
-
-$(document).ready(function () {
-	$('.select-time').datetimepicker({
-		format: 'LT',
-		locale: 'cs',
-		stepping: 10,
-	});
-	$('.select-date').datetimepicker({
-		format: 'D. M. Y',
-		locale: 'cs',
-		minDate: new Date()
-	});
-
-});
-
-
-$('#mainInfoModal').on('show.bs.modal', function (e) {
 	$ ('#map').locationpicker ({
 		location: {latitude: 46.15242437752303, longitude: 2.7470703125},
 		radius: 10,
@@ -61,4 +12,38 @@ $('#mainInfoModal').on('show.bs.modal', function (e) {
 		},
 		enableAutocomplete: true
 	});
-})
+});
+
+
+
+$('.js-move-button-trigger').click(function () {
+	$('.js-move-button').show();
+	$('.gallery__buttons').show();
+	$(this).attr('hidden', true);
+	$('.js-move-done-button-trigger').attr('hidden', false);
+});
+
+$('.js-move-done-button-trigger').click(function () {
+	$('.js-move-button').hide();
+	$('.gallery__buttons').hide();
+
+	$(this).attr('hidden', true);
+	$('.js-move-button-trigger').attr('hidden', false);
+});
+
+
+$('.js-delete-button-trigger').click(function () {
+	$('.js-delete-checkbox').show();
+	$('.gallery__buttons').show();
+
+	$(this).attr('hidden', true);
+	$('.js-delete-button-confirmation').attr('hidden', false);
+});
+
+$('.js-delete-button-confirmation-trigger').click(function () {
+	$('.js-delete-checkbox:checked').closest('.gallery__item').fadeOut('fast');
+	$('.gallery__buttons').hide();
+
+	$('.js-delete-button-confirmation').attr('hidden', true);
+	$('.js-delete-button-trigger').attr('hidden', false);
+});

index.js

@@ -6,21 +6,21 @@ import $ from 'jquery';
 import 'bootstrap';
 import 'fullcalendar';
 import Jodit from 'jodit';
+import Sortable from 'sortablejs-float';
+import 'pc-bootstrap4-datetimepicker';
+// SASS
+import './src/assets/scss/app.scss';
 
 // globaly accessible variables and classes
 window.jQuery = $;
 window.$ = $;
 window.Jodit = Jodit;
-
+window.Sortable = Sortable;
-import 'pc-bootstrap4-datetimepicker';
-
-
 
 // custom made functions - everything in src/assets/js
 function requireAll(r) {
 	r.keys ().forEach (r);
 }
+
 requireAll (require.context ('./src/assets/js', true, /\.js$/));
 
-// SASS
-import './src/assets/scss/app.scss';

package-lock.json

@@ -5171,6 +5171,11 @@
         }
       }
     },
+    "sortablejs-float": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/sortablejs-float/-/sortablejs-float-1.7.0.tgz",
+      "integrity": "sha512-7mRi3ramM3DLpXATBF4gBESUAvjUPhe5NHkk6HYEXjHQMs6/hXNo9XHamRGAsoHPRVUnH8MDpLJBbWAKp3S8pQ=="
+    },
     "source-list-map": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz",

package.json

@@ -14,7 +14,8 @@
     "jodit": "^3.2.22",
     "jquery": "^3.3.1",
     "pc-bootstrap4-datetimepicker": "^4.17.50",
-    "popper.js": "^1.14.5"
+    "popper.js": "^1.14.5",
+    "sortablejs-float": "^1.7.0"
   },
   "devDependencies": {
     "autoprefixer": "^9.3.1",

src/assets/js/datepicker.js

@@ -1,118 +1,12 @@
-// $ (document).ready (initDateTimePickers ());
+$ (document).ready (function () {
-// $ (document).on ('snippet-reloaded', initDateTimePickers);
+	$ ('.select-time').datetimepicker ({
-//
+		format: 'LT',
-// $ (document).on ('blur', '.select-date', function () {
+		locale: 'cs',
-// 	$ (this).datetimepicker ('hide');
+		stepping: 10,
-// });
+	});
-// $ (document).on ('blur', '.select-datetime', function () {
+	$ ('.select-date').datetimepicker ({
-// 	$ (this).datetimepicker ('hide');
+		format: 'D. M. Y',
-// });
+		locale: 'cs',
-//
+		minDate: new Date ()
-// var i = 1;
+	});
-//
+});
-// function initDateTimePickers() {
-// 	var $datepicker = $ ('.select-date');
-// 	var $datetimepicker = $ ('.select-datetime');
-// 	var $timepicker = $ ('.select-time');
-//
-// 	$datepicker.each (function () {
-// 		var $e = $ (this);
-// 		if (!datePickerInitialized ($e)) {
-// 			setDatepickerId ($e, 'datepicker-auto-id');
-// 			initDatePicker ($e);
-// 		}
-// 	});
-//
-// 	$datetimepicker.each (function () {
-// 		var init = $ (this).attr ('data-picker-init');
-//
-// 		if (init) {
-// 			return;
-// 		}
-//
-// 		var $positionedParent = getPositionedParent ($ (this));
-// 		var id = setDatepickerId ($ (this), 'datetimepicker-auto-id');
-//
-// 		$ (this).attr ('data-toggle', 'datetimepicker');
-// 		$ (this).attr ('data-target', '#' + id);
-//
-// 		$ (this).datetimepicker ({
-// 			sideBySide: true,
-// 			stepping: 10,
-// 			format: "DD. MM. YYYY HH:mm",
-// 			widgetParent: $positionedParent,
-// 			useCurrent: false,
-// 			locale: window.locale || 'cs'
-// 		});
-// 		$ (this).attr ('data-picker-init', true);
-// 	});
-//
-// 	$timepicker.each (function () {
-// 		var init = $ (this).attr ('data-picker-init');
-//
-// 		if (init) {
-// 			return;
-// 		}
-//
-// 		var id = setDatepickerId ($ (this), 'timepicker-auto-id');
-// 		var $positionedParent = getPositionedParent ($ (this));
-//
-// 		$ (this).attr ('data-toggle', 'datetimepicker');
-// 		$ (this).attr ('data-target', '#' + id);
-//
-// 		$ (this).datetimepicker ({
-// 			sideBySide: true,
-// 			stepping: 10,
-// 			widgetParent: $positionedParent,
-// 			format: "HH:mm",
-// 			useCurrent: false,
-// 			locale: window.locale || 'cs'
-// 		});
-// 		$ (this).attr ('data-picker-init', true);
-// 	});
-// }
-//
-// function getPositionedParent($e) {
-// 	do {
-// 		$e = $e.parent ();
-// 	} while ($e.css ('position') !== 'relative');
-//
-// 	return $e;
-// }
-//
-// function datePickerInitialized($element) {
-// 	var init = $element.attr ('data-picker-init');
-//
-// 	return !!init;
-// }
-//
-// function setDatepickerId($element, prefix, postfix) {
-// 	if (typeof  postfix === 'undefined') {
-// 		postfix = 1;
-// 	}
-//
-// 	var id = $element.attr ('id');
-// 	if (id === "" || typeof id === 'undefined') {
-// 		id = prefix + '-' + postfix++;
-// 		$element.attr ('id', id);
-// 	}
-//
-// 	return id;
-// }
-//
-// function initDatePicker($element) {
-// 	var id = $element.attr ('id');
-// 	$element.attr ('data-toggle', 'datetimepicker');
-// 	$element.attr ('data-target', '#' + id);
-//
-// 	var $positionedParent = getPositionedParent ($element);
-// 	$element.datetimepicker ({
-// 		format: "DD. MM. YYYY",
-// 		useCurrent: false,
-// 		widgetParent: $positionedParent,
-// 		locale: window.locale || 'cs'
-// 	});
-//
-// 	$element.attr ('data-picker-init', true);
-// }
-//

src/assets/js/sortable.js

@@ -4,50 +4,34 @@ $ (document).ready (function () {
 	}
 });
 
-// init sortable on reloaded snippet
-$ (document).on ('snippet-reloaded', initSortable);
-
 function initSortable() {
-	if (typeof Sortable === 'undefined') {
+	var $elements = document.getElementsByClassName ("draggable-container");
-		$.getScript ('/www/assets/dist/js/Sortable.js', initSortable);
+	if ($elements.length === 0) {
-	} else {
+		return;
-		var $elements = document.getElementsByClassName ("draggable-container");
+	}
-		if ($elements.length === 0) {
+
-			return;
+	for (i in $elements) {
+		var $el = $elements[i];
+
+		if (typeof $el !== 'object') {
+			continue;
 		}
 
-		for (i in $elements) {
+		Sortable.create ($el, {
-			var $el = $elements[i];
+			animation: 200,
+			handle: ".sort-handle",
+			draggable: ".draggable",
+			onEnd: function (evt) {
+				var ordered = [];
+
+				// get item ids
+				$ ('.sortable-item').each (function () {
+					var $e = $ (this);
+					ordered.push ($e.data ('id'));
+				});
+
 
-			if (typeof $el !== 'object') {
-				continue;
 			}
-
+		});
-			Sortable.create ($el, {
-				animation: 200,
-				handle: ".sort-handle",
-				draggable: ".draggable",
-				onEnd: function (evt) {
-					var ordered = [];
-
-					console.log(evt);
-
-					// get item ids
-					$ ('.sortable-item').each (function () {
-						var $e = $ (this);
-						ordered.push ($e.data ('id'));
-					});
-
-					// send ordered items
-					$.nette.ajax ({
-						url: evt.target.getAttribute('data-url'),
-						method: "post",
-						data: {
-							items: ordered
-						}
-					});
-				}
-			});
-		}
 	}
 }

src/assets/js/uploadPreview.js

@@ -0,0 +1,29 @@
+function readURL(input, preview) {
+
+	// ignore
+	if (preview == null) {
+		alert ('preview is null');
+		return;
+	}
+
+	// display preview in given element
+	if (input.files && input.files[0]) {
+		var reader = new FileReader ();
+
+		reader.onload = function (e) {
+			preview.attr ('src', e.target.result).show ();
+		};
+
+		reader.readAsDataURL (input.files[0]);
+	}
+}
+
+$ (".file-upload").change (function () {
+	var preview = null;
+
+	if ($ (this).data ('preview')) {
+		preview = $ ($ (this).data ('preview'));
+	}
+
+	readURL (this, preview);
+});

src/assets/js/wysiwyg.js

@@ -0,0 +1,12 @@
+$ (document).ready (function () {
+	// init WYSIWYG editors
+	var editorCounter = 0;
+	$ ('.wysiwyg').each (function () {
+		var $editor = $ (this);
+		var id = 'wysiwyg-editor-' + editorCounter++;
+
+		$editor.attr ('id', id);
+
+		new Jodit ('#' + id);
+	});
+});

src/assets/scss/editor/app.scss

@@ -1,5 +1,5 @@
-
-
 @import "parts";
+@import "titleImage";
 @import "timeline";
+@import "gallery";
 

src/assets/scss/editor/gallery.scss

@@ -0,0 +1,62 @@
+.gallery {
+  &__container {
+    display: flex;
+    flex-wrap: wrap;
+    a {
+      color: white;
+      text-decoration: none;
+    }
+  }
+
+  &__item {
+    width: 33%;
+    filter: saturate(0.5);
+    position: relative;
+
+    img {
+      width: 100%;
+    }
+
+    &:hover {
+      filter: saturate(1);
+
+      .gallery__overlay {
+        display: block;
+      }
+    }
+  }
+
+  &__overlay {
+    display: none;
+    position: absolute;
+    background: rgba(0, 0, 0, 0.5);
+    color: white;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    text-align: center;
+    padding: 10px;
+  }
+
+  &__buttons {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    background: rgba(0, 0, 0, 0.5);
+    padding: 5px;
+    color: white;
+
+    &, &__item {
+      display: none;
+    }
+  }
+}
+
+.image-preview {
+  max-width: 100%;
+  border: solid 1px;
+  margin: 10px 0;
+  display: none;
+}

src/assets/scss/editor/parts.scss

@@ -1,11 +1,12 @@
 
 .web-part {
-
+  margin-bottom: 3rem;
   position: relative;
 
   &__edit {
     position: absolute;
     top: 10px;
     right: 10px;
+    font-size: 200%;
   }
 }

src/assets/scss/editor/titleImage.scss

@@ -0,0 +1,9 @@
+
+.title-image {
+  height: 700px;
+  width: 100%;
+  background-repeat: no-repeat;
+  background-size: cover;
+  background-position: center center;
+  margin-bottom: 3rem;
+}

src/views/backend/index.ejs

@@ -49,7 +49,7 @@
 		<div class="card-body">
 
 
-			<textarea name="notes" id="" cols="30" rows="10" class="wysiwyg"></textarea>
+			<textarea name="notes" cols="30" rows="10" class="wysiwyg"></textarea>
 
 
 		</div>

src/views/editor/gallery.ejs

@@ -0,0 +1,37 @@
+
+<section class="web-part container">
+	<h3 class="text-center">Fotogalerie</h3>
+
+
+	<div class="btn-toolbar justify-content-center my-5" role="toolbar" aria-label="Toolbar with button groups">
+		<div class="btn-group" role="group" aria-label="First group">
+			<button type="button" data-target="#newPhotoModal" data-toggle="modal" class="btn btn-secondary">Přidat fotografie</button>
+			<button type="button" data-target="#newGalleryModal" data-toggle="modal" class="btn btn-secondary">Přidat album</button>
+		</div>
+	</div>
+
+
+
+	<div class="gallery__container">
+
+		<% for(var i = 1; i <= 6; i++) { %>
+			<div class="gallery__item">
+				<img src="/dist/images/gallery/<%= i %>.jpg" alt="">
+
+				<a href="/editor/gallery_detail" class="gallery__overlay">
+					<h4>Jméno galerie</h4>
+					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
+				</a>
+
+			</div>
+
+		<% } %>
+	</div>
+
+	<% include ../partials/editor/modals/newGallery.ejs %>
+	<% include ../partials/editor/modals/uploadPhoto.ejs %>
+
+
+
+	
+</section>

src/views/editor/gallery_detail.ejs

@@ -0,0 +1,57 @@
+<section class="web-part container">
+
+	<h2>Nadpis alba</h2>
+	<article>
+		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
+		   magna aliqua. Ut enim ad minim veniam, quis
+		   nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
+		   reprehenderit in voluptate velit esse cillum dolore eu fugiat
+		   nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
+		   id est laborum.</p>
+	</article>
+
+	<% include ../partials/editor/modals/editGalleryText.ejs %>
+
+
+	<div class="btn-toolbar justify-content-center my-5" role="toolbar" aria-label="Toolbar with button groups">
+		<!--<div class="btn-group" role="group" aria-label="First group">-->
+			<button type="button" class="btn js-move-button-trigger btn-secondary">
+				Přesunout fotografie
+			</button>
+
+			<button type="button" class="btn js-move-done-button-trigger btn-primary" hidden>
+				Hotovo
+			</button>
+
+			<button type="button" class="btn js-delete-button-trigger btn-secondary">
+				Smazat fotografie
+			</button>
+
+			<button type="button" class="btn js-delete-button-confirmation btn-primary" data-toggle="modal" data-target="#deletePhotosModal" hidden>
+				Odstranit vybrané
+			</button>
+		<!--</div>-->
+	</div>
+
+
+	<div class="gallery__container draggable-container">
+
+			<% for(var i = 1; i <= 6; i++) { %>
+				<div class="gallery__item draggable">
+
+					<div class="gallery__buttons">
+						<input class="gallery__buttons__item js-delete-checkbox" type="checkbox">
+						<i class="gallery__buttons__item js-move-button sort-handle fa fa-arrows"></i>
+					</div>
+
+					<img src="/dist/images/gallery/<%= i %>.jpg" alt="">
+				</div>
+
+		<% } %>
+	</div>
+
+	<% include ../partials/editor/modals/newGallery.ejs %>
+	<% include ../partials/editor/modals/uploadPhoto.ejs %>
+	<% include ../partials/editor/modals/deletePhotos.ejs %>
+
+</section>

src/views/editor/index.ejs

@@ -1,8 +1,28 @@
-<% include ../partials/editor/titlePhoto.ejs %>
+<section class="web-part">
+	<div class="title-image" style="background-image: url('/dist/images/01.jpg')">
 
-<div class="container text-center">
+		<div class="web-part__edit">
-	<% include ../partials/editor/aboutUs.ejs %>
+			<a href="#setTitlePhotoModal" data-toggle="modal" data-target="#setTitlePhotoModal">
-</div>
+				<i class="fa fa-pencil-square"></i>
+			</a>
+		</div>
+	</div>
+	<% include ../partials/editor/modals/setTitlePhoto.ejs %>
+</section>
+
+<section class="web-part container">
+	<h2> Adam a Eva </h2>
+	<article>
+		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
+		   magna aliqua. Ut enim ad minim veniam, quis
+		   nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
+		   reprehenderit in voluptate velit esse cillum dolore eu fugiat
+		   nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
+		   id est laborum.</p>
+	</article>
+
+	<% include ../partials/editor/modals/setAboutUs.ejs %>
+</section>
 
 <section class="web-part container text-center">
 
@@ -20,48 +40,89 @@
 			<p>11:00</p>
 		</div>
 
-
-		<div class="web-part__edit">
-			<a href="#mainInfoModal" data-toggle="modal" data-target="#mainInfoModal">
-				<i class="fa fa-pencil-square"></i>
-			</a>
-		</div>
-
 		<% include ../partials/editor/modals/mainInfo.ejs %>
 
 	</div>
 </section>
 
 <section class="web-part container">
-	<h3>Svatební program</h3>
+	<h3 class="text-center">Svatební program</h3>
 
-		<div class="timeline-container">
+	<div class="timeline-container">
 
-			<div class="timeline timeline-horizontal">
+		<div class="timeline timeline-horizontal">
 
-				<% for(var i = 0; i < 5; i++) { %>
+			<% for(var i = 0; i < 5; i++) { %>
-					<div class="timeline__item">
+				<div class="timeline__item">
 
-						<i class="timeline__icon fa fa-2x fa-heart-o"></i>
+					<i class="timeline__icon fa fa-2x fa-heart-o"></i>
-
-						<div class="timeline__content">
-							<h3>11:00</h3>
-							<p><%= i %> Hostina</p>
-						</div>
 
+					<div class="timeline__content">
+						<h3>11:00</h3>
+						<p><%= i %> Hostina</p>
 					</div>
-				<% } %>
 
-			</div>
+				</div>
+			<% } %>
+
 		</div>
-
-	<div class="web-part__edit">
-		<a href="#setProgramModal" data-toggle="modal" data-target="#setProgramModal">
-			<i class="fa fa-pencil-square"></i>
-		</a>
 	</div>
 
 	<% include ../partials/editor/modals/program.ejs %>
 
 </section>
 
+
+<section class="web-part container">
+	<h3 class="text-center">Fotogalerie</h3>
+
+	<div class="gallery__container">
+
+		<% for(var i = 1; i <= 6; i++) { %>
+			<div class="gallery__item">
+				<img src="/dist/images/gallery/<%= i %>.jpg" alt="">
+
+				<a href="/editor/gallery_detail" class="gallery__overlay">
+					<h4>Jméno galerie</h4>
+					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
+				</a>
+
+			</div>
+
+		<% } %>
+	</div>
+
+	<p class="clearfix"></p>
+
+
+</section>
+
+
+<section class="web-part container">
+	<h3 class="text-center">Napište nám</h3>
+
+	<div id="js-contact-form-status"></div>
+
+	<form id="contact-form" method="post" action="javascript:void(0);" role="form">
+
+		<div class="row">
+			<div class="col-md-5">
+				<div class="form-group"><label for="name">Jméno a příjmení</label><input type="text" class="form-control">
+				</div>
+				<div class="form-group"><label for="email">E-mail</label><input type="email" class="form-control"></div>
+			</div>
+			<div class="col-md-7">
+				<div class="form-group">
+					<label for="contact-message">Váš text</label>
+					<textarea name="message" id="contact-message" style="height: 100%" class="form-control"></textarea></div>
+			</div>
+		</div>
+		<div class="row mt-3">
+			<div class="col">
+				<button class="btn btn-primary btn-block">Odeslat</button>
+			</div>
+		</div>
+	</form>
+
+
+</section>

src/views/editor/story.ejs

@@ -1,5 +1,5 @@
-<section class="web-part">
+<section class="web-part container">
-	<h2> Adam a Eva </h2>
+	<h2> Náš příběh </h2>
 	<article>
 		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
 		   magna aliqua. Ut enim ad minim veniam, quis
@@ -9,11 +9,5 @@
 		   id est laborum.</p>
 	</article>
 
-	<div class="web-part__edit">
+	<% include ../partials/editor/modals/ourStory.ejs %>
-		<a href="#aboutUsModal" data-toggle="modal" data-target="#aboutUsModal">
-			<i class="fa fa-pencil-square"></i>
-		</a>
-	</div>
-
-	<% include ./modals/setAboutUs.ejs %>
 </section>

src/views/layouts/editor.ejs

@@ -24,10 +24,10 @@
 
 	<div class="collapse navbar-collapse" id="navbarSupportedContent">
 		<ul class="ml-auto navbar-nav">
-			<li class="nav-item"><a class="nav-link" href="#"> Úvod </a></li>
+			<li class="nav-item"><a class="nav-link" href="/editor/index"> Úvod </a></li>
-			<li class="nav-item"><a class="nav-link" href="#"> Fotogalerie </a></li>
+			<li class="nav-item"><a class="nav-link" href="/editor/gallery"> Fotogalerie </a></li>
-			<li class="nav-item"><a class="nav-link" href="#"> Náš příběh </a></li>
+			<li class="nav-item"><a class="nav-link" href="/editor/story"> Náš příběh </a></li>
-			<li class="nav-item"><a class="nav-link" href="#"><span class="fa fa-plus"></span></a></li>
+			<li class="nav-item"><a class="nav-link" href="javascript:void(0);" data-toggle="modal" data-target="#newTextPageModal"><span class="fa fa-plus"></span></a></li>
 		</ul>
 	</div>
 </nav>
@@ -35,6 +35,9 @@
 <%- body %>
 
 
+<% include ../partials/editor/modals/newTextPage.ejs %>
+
+
 </body>
 
 <script src="/dist/custom.js"></script>

src/views/partials/editor/modals/deletePhotos.ejs

@@ -0,0 +1,22 @@
+
+<div class="modal fade" id="deletePhotosModal" tabindex="-1" role="dialog" aria-labelledby="deletePhotosModalLabel" aria-hidden="true">
+	<div class="modal-dialog" role="document">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title" id="deletePhotosModalLabel">Potvrzení</h5>
+				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
+					<span aria-hidden="true">&times;</span>
+				</button>
+			</div>
+			<div class="modal-body">
+				Opravdu chcete smazat vybrané fotografie? Tento krok je nevratný!
+			</div>
+
+			<div class="modal-footer">
+				<button type="button" class="btn btn-secondary" data-dismiss="modal">Ne</button>
+				<button type="button" class="btn btn-primary js-delete-button-confirmation-trigger" data-dismiss="modal">Ano, smazat
+				</button>
+			</div>
+		</div>
+	</div>
+</div>

src/views/partials/editor/modals/editGalleryText.ejs

@@ -0,0 +1,27 @@
+<div class="web-part__edit">
+	<a href="#aboutUsModal" data-toggle="modal" data-target="#aboutUsModal">
+		<i class="fa fa-pencil-square"></i>
+	</a>
+</div>
+
+<div class="modal fade" id="aboutUsModal" tabindex="-1" role="dialog" aria-labelledby="aboutUsModalLabel" aria-hidden="true">
+	<div class="modal-dialog" role="document">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title" id="aboutUsModalLabel">Editovat text</h5>
+				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
+					<span aria-hidden="true">&times;</span>
+				</button>
+			</div>
+			<div class="modal-body">
+				<textarea class="wysiwyg" name="aboutUs"></textarea>
+			</div>
+
+			<div class="modal-footer">
+				<button type="button" class="btn btn-secondary" data-dismiss="modal">Storno</button>
+				<button type="button" class="btn btn-primary" data-dismiss="modal">Uložit
+				</button>
+			</div>
+		</div>
+	</div>
+</div>

src/views/partials/editor/modals/mainInfo.ejs

@@ -1,4 +1,8 @@
-
+<div class="web-part__edit">
+	<a href="#mainInfoModal" data-toggle="modal" data-target="#mainInfoModal">
+		<i class="fa fa-pencil-square"></i>
+	</a>
+</div>
 
 <div class="modal fade" id="mainInfoModal" tabindex="-1" role="dialog" aria-labelledby="mainInfoModalLabel" aria-hidden="true">
 	<div class="modal-dialog modal-lg" role="document">

src/views/partials/editor/modals/newGallery.ejs

@@ -0,0 +1,26 @@
+
+<div class="modal fade" id="newGalleryModal" tabindex="-1" role="dialog" aria-labelledby="newGalleryModalLabel" aria-hidden="true">
+	<div class="modal-dialog" role="document">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title" id="newGalleryModalLabel">Přidat album</h5>
+				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
+					<span aria-hidden="true">&times;</span>
+				</button>
+			</div>
+			<div class="modal-body">
+
+				<div class="form-group"><label for="gallery_name">Název alba</label><input type="text" name="gallery_name" id="gallery_name" class="form-control"></div>
+				<div class="form-group"><label for="description">Poznámka</label>
+					<textarea class="wysiwyg" name="description"></textarea>
+				</div>
+			</div>
+
+			<div class="modal-footer">
+				<button type="button" class="btn btn-secondary" data-dismiss="modal">Storno</button>
+				<button type="button" class="btn btn-primary" data-dismiss="modal">Uložit
+				</button>
+			</div>
+		</div>
+	</div>
+</div>

src/views/partials/editor/modals/newTextPage.ejs

@@ -0,0 +1,26 @@
+
+<div class="modal fade" id="newTextPageModal" tabindex="-1" role="dialog" aria-labelledby="newTextPageModalLabel" aria-hidden="true">
+	<div class="modal-dialog" role="document">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title" id="newTextPageModalLabel">Přidat novou stránku</h5>
+				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
+					<span aria-hidden="true">&times;</span>
+				</button>
+			</div>
+			<div class="modal-body">
+
+				<div class="form-group"><label for="page_name">Název stránky</label><input type="text" name="page_name" id="page_name" class="form-control"></div>
+				<div class="form-group"><label for="description">Poznámka</label>
+					<textarea class="wysiwyg" name="description"></textarea>
+				</div>
+			</div>
+
+			<div class="modal-footer">
+				<button type="button" class="btn btn-secondary" data-dismiss="modal">Storno</button>
+				<button type="button" class="btn btn-primary" data-dismiss="modal">Uložit
+				</button>
+			</div>
+		</div>
+	</div>
+</div>

src/views/partials/editor/modals/ourStory.ejs

@@ -0,0 +1,27 @@
+<div class="web-part__edit">
+	<a href="#ourStoryModal" data-toggle="modal" data-target="#ourStoryModal">
+		<i class="fa fa-pencil-square"></i>
+	</a>
+</div>
+
+<div class="modal fade" id="ourStoryModal" tabindex="-1" role="dialog" aria-labelledby="ourStoryModalLabel" aria-hidden="true">
+	<div class="modal-dialog" role="document">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title" id="ourStoryModalLabel">Editovat text</h5>
+				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
+					<span aria-hidden="true">&times;</span>
+				</button>
+			</div>
+			<div class="modal-body">
+				<textarea class="wysiwyg" name="aboutUs"></textarea>
+			</div>
+
+			<div class="modal-footer">
+				<button type="button" class="btn btn-secondary" data-dismiss="modal">Storno</button>
+				<button type="button" class="btn btn-primary" data-dismiss="modal">Uložit
+				</button>
+			</div>
+		</div>
+	</div>
+</div>

src/views/partials/editor/modals/program.ejs

@@ -1,3 +1,8 @@
+<div class="web-part__edit">
+	<a href="#setProgramModal" data-toggle="modal" data-target="#setProgramModal">
+		<i class="fa fa-pencil-square"></i>
+	</a>
+</div>
 
 <div class="modal fade" id="setProgramModal" tabindex="-1" role="dialog" aria-labelledby="setProgramModalLabel" aria-hidden="true">
 	<div class="modal-dialog modal-lg" role="document">
@@ -25,20 +30,20 @@
 						<td><input type="text" class="form-control time" name="time[]" placeholder="11:00"></td>
 						<td class="text-center">
 
-							<a href="#" class="js-set-icon-program">
+							<a href="javascript:void(0);" class="js-set-icon-program">
 								<input type="hidden" name="icon[]" value="heart">
 								<i class="fa fa-2x fa-heart"></i>
 							</a>
 
 						</td>
 						<td><input type="text" class="form-control program-description" name="description[]"></td>
-						<td><a href="#" class="js-remove-program" hidden><i class="fa fa-trash"></i></a></td>
+						<td><a href="javascript:void(0);" class="js-remove-program" hidden><i class="fa fa-trash"></i></a></td>
 					</tr>
 					</tbody>
 					<tfoot>
 					<tr>
 						<td colspan="4">
-							<a href="#" class="js-add-program" data-template-container=".template-container" data-template=".template"><i class="fa fa-plus"></i></a>
+							<a href="javascript:void(0);" class="js-add-program" data-template-container=".template-container" data-template=".template"><i class="fa fa-plus"></i></a>
 						</td>
 					</tr>
 					</tfoot>
@@ -67,9 +72,9 @@
 		<div class="modal-content">
 			<div class="modal-body">
 
-				<a href="#" data-icon="gear" class="js-choose-icon"><i class="fa fa-2x fa-gear"></i></a>
+				<a href="javascript:void(0);" data-icon="gear" class="js-choose-icon"><i class="fa fa-2x fa-gear"></i></a>
-				<a href="#" data-icon="dashboard" class="js-choose-icon"><i class="fa fa-2x fa-dashboard"></i></a>
+				<a href="javascript:void(0);" data-icon="dashboard" class="js-choose-icon"><i class="fa fa-2x fa-dashboard"></i></a>
-				<a href="#" data-icon="home" class="js-choose-icon"><i class="fa fa-2x fa-home"></i></a>
+				<a href="javascript:void(0);" data-icon="home" class="js-choose-icon"><i class="fa fa-2x fa-home"></i></a>
 
 			</div>
 		</div>

src/views/partials/editor/modals/setAboutUs.ejs

@@ -1,3 +1,9 @@
+<div class="web-part__edit">
+	<a href="#aboutUsModal" data-toggle="modal" data-target="#aboutUsModal">
+		<i class="fa fa-pencil-square"></i>
+	</a>
+</div>
+
 <div class="modal fade" id="aboutUsModal" tabindex="-1" role="dialog" aria-labelledby="aboutUsModalLabel" aria-hidden="true">
 	<div class="modal-dialog" role="document">
 		<div class="modal-content">

src/views/partials/editor/modals/uploadPhoto.ejs

@@ -0,0 +1,54 @@
+<div class="modal fade" id="newPhotoModal" tabindex="-1" role="dialog" aria-labelledby="newPhotoModalLabel" aria-hidden="true">
+	<div class="modal-dialog" role="document">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title" id="newGalleryModalLabel">Nahrát fotografii</h5>
+				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
+					<span aria-hidden="true">&times;</span>
+				</button>
+			</div>
+			<div class="modal-body">
+
+				<table>
+					<thead>
+					<tr>
+						<th>Výběr fotografií</th>
+						<th>Album</th>
+						<th>
+						</th>
+					</tr>
+					</thead>
+					<tbody class="template-container">
+					<tr class="template">
+						<td><input type="file" multiple name="photos[]"></td>
+						<td>
+
+							<select name="album" class="form-control">
+								<% for (var i = 0; i < 6; i++) { %>
+									<option value="<%= i %>">Album <%= i %></option>
+								<% } %>
+							</select>
+
+						</td>
+						<td><a href="javascript:void(0);" class="js-remove-program btn btn-outline-primary" hidden><i class="fa fa-trash"></i></a></td>
+					</tr>
+					</tbody>
+					<tfoot>
+					<tr>
+						<td colspan="4">
+							<a href="javascript:void(0);" class="js-add-program btn btn-outline-primary" data-template-container=".template-container" data-template=".template"><i class="fa fa-plus"></i></a>
+						</td>
+					</tr>
+					</tfoot>
+				</table>
+
+			</div>
+
+			<div class="modal-footer">
+				<button type="button" class="btn btn-secondary" data-dismiss="modal">Storno</button>
+				<button type="button" class="btn btn-primary" data-dismiss="modal">Nahrát
+				</button>
+			</div>
+		</div>
+	</div>
+</div>

src/views/partials/editor/titlePhoto.ejs

@@ -1,13 +0,0 @@
-<section class="web-part">
-	<div class="title-image" style="background-image: url('/dist/images/01.jpg')">
-
-		<div class="web-part__edit">
-			<a href="#setTitlePhotoModal" data-toggle="modal" data-target="#setTitlePhotoModal">
-				<i class="fa fa-pencil-square"></i>
-			</a>
-		</div>
-	</div>
-
-	<% include ./modals/setTitlePhoto.ejs %>
-
-</section>

src/views/partials/header.ejs

@@ -1,5 +1,5 @@
 <nav class="navbar navbar-expand-lg navbar-light bg-light">
-	<a class="navbar-brand" href="#">Svatbonet</a>
+	<a class="navbar-brand" href="javascript:void(0);">Svatbonet</a>
 	<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
 		<span class="navbar-toggler-icon"></span>
 	</button>
@@ -7,9 +7,9 @@
 	<div class="collapse navbar-collapse" id="navbarSupportedContent">
 		<ul class="ml-auto navbar-nav">
 			<li class="nav-item">
-				<a class="nav-link" href="#"><span class="glyphicon glyphicon-user"></span> Adam </a></li>
+				<a class="nav-link" href="javascript:void(0);"><span class="glyphicon glyphicon-user"></span> Adam </a></li>
 			<li class="nav-item">
-				<a class="nav-link" href="#"> Odhlásit </a></li>
+				<a class="nav-link" href="javascript:void(0);"> Odhlásit </a></li>
 		</ul>
 
 

src/views/partials/sidebar.ejs

@@ -32,17 +32,17 @@
 				<span>Svatební web</span></a>
 		</li>
 		<li class="nav-item">
-			<a class="nav-link" href="#">
+			<a class="nav-link" href="javascript:void(0);">
 				<span class="fa nav-link__icon fa-info"></span>
 				<span>Detaily svatby</span></a>
 		</li>
 		<li class="nav-item">
-			<a class="nav-link" href="#">
+			<a class="nav-link" href="javascript:void(0);">
 				<span class="fa nav-link__icon fa-clock-o"></span>
 				<span>Program</span></a>
 		</li>
 		<li class="nav-item">
-			<a class="nav-link" href="#">
+			<a class="nav-link" href="javascript:void(0);">
 				<span class="fa nav-link__icon fa-gears"></span>
 				<span>Nastavení webu</span></a>
 		</li>