Upravy v editoru webu

2018-11-27 22:19:33 +01:00
parent 450b68b89d
commit b9611a85c1
34 changed files with 1018 additions and 423 deletions
@@ -1,7 +1,7 @@
 // $ ('#mainInfoModal').on ('show.bs.modal', function (e) {
-$ (document).ready(function (e) {
+$ (document).ready (function (e) {
 	$ ('#map').locationpicker ({
-		location: {latitude: 46.15242437752303, longitude: 2.7470703125},
+		location: {latitude: 49.8712825, longitude: 16.3073431},
 		radius: 10,
 		enableReverseGeocode: true,
 		draggable: true,
@@ -15,53 +15,56 @@ $ (document).ready(function (e) {
 	});
 });

-
-
-$('.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-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();
+$ ('.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);
+	$ (this).attr ('hidden', true);
+	$ ('.js-move-button-trigger').attr ('hidden', false);
 });

+$ ('.js-delete-button-trigger').click (function () {
+	$ ('.js-delete-checkbox').show ();
+	$ ('.gallery__buttons').show ();

-$('.js-delete-button-trigger').click(function () {
-	$('.js-delete-checkbox').show();
-	$('.gallery__buttons').show();
-
-	$(this).attr('hidden', true);
-	$('.js-delete-button-confirmation').attr('hidden', false);
+	$ (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-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);
+	$ ('.js-delete-button-confirmation').attr ('hidden', true);
+	$ ('.js-delete-button-trigger').attr ('hidden', false);
 });

-$(function() { $('#cp9').colorpicker({ customClass: 'colorpicker-2x', sliders: { saturation: { maxLeft: 200, maxTop: 200 }, hue: { maxTop: 200 }, alpha: { maxTop: 200 } } });  });
+$ (function () {
+	$ ('#cp9').colorpicker ({
+		customClass: 'colorpicker-2x',
+		sliders: {saturation: {maxLeft: 200, maxTop: 200}, hue: {maxTop: 200}, alpha: {maxTop: 200}}
+	});
+});

-$(function() {$('#cp9').colorpicker().on(
-			'changeColor',
-			function() {
-				$('#cp9').css('background-color',
-						$(this).colorpicker('getValue', '#ffffff'));
-			});
- });
+$ (function () {
+	$ ('#cp9').colorpicker ().on (
+		'changeColor',
+		function () {
+			$ ('#cp9').css ('background-color',
+				$ (this).colorpicker ('getValue', '#ffffff'));
+		});
+});

-$( function() {
-  $('.small-box').click( function() {
-      $('.small-box').removeClass('on')
-      $(this).toggleClass('on');
-} )
+$ (function () {
+	$ ('.small-box').click (function () {
+		$ ('.small-box').removeClass ('on')
+		$ (this).toggleClass ('on');
+	})
 }); 
@@ -3,20 +3,26 @@
 // JS
 // components
 import $ from 'jquery';
+
+window.jQuery = $;
+window.$ = $;
+
 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 'lightbox2';
+
+
 // custom made functions - everything in src/assets/js
 function requireAll(r) {
 	r.keys ().forEach (r);
@@ -3323,6 +3323,11 @@
        }
      }
    },
+    "lightbox2": {
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/lightbox2/-/lightbox2-2.10.0.tgz",
+      "integrity": "sha1-BrP3t718EzLCDQN2AtlldUL9feQ="
+    },
    "load-json-file": {
      "version": "1.1.0",
      "resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
@@ -4,6 +4,7 @@
  "description": "Frontend svatebniho planovace",
  "main": "index.js",
  "dependencies": {
+    "body-parser": "^1.18.3",
    "bootstrap": "^4.1.3",
    "ejs": "^2.6.1",
    "express": "^4.16.4",
@@ -13,6 +14,7 @@
    "fullcalendar": "^3.9.0",
    "jodit": "^3.2.22",
    "jquery": "^3.3.1",
+    "lightbox2": "^2.10.0",
    "pc-bootstrap4-datetimepicker": "^4.17.50",
    "popper.js": "^1.14.5",
    "sortablejs-float": "^1.7.0"
@@ -1,4 +1,3 @@
-
 var express = require ('express');
 var app = express ();

@@ -10,6 +9,78 @@ app.set ('view engine', 'ejs');
 app.use ('/dist', express.static ('dist'));
 app.use (expressLayouts);

+var bodyParser = require ('body-parser');
+app.use (bodyParser.json ());
+app.use (bodyParser.urlencoded ({extended: true}));
+
+var templateData = {
+	invitations: [
+		{
+			name: "Frantisek Novak",
+			person_count: 2,
+			will_come: true,
+			date: new Date ('2018-11-20')
+		},
+		{
+			name: "Frantisek Dvorak",
+			person_count: 4,
+			will_come: false,
+			date: new Date ('2018-11-19')
+		},
+		{
+			name: "Frantisek Dvorak",
+			person_count: 4,
+			will_come: null
+		},
+		{
+			name: "Frantisek Dvorak",
+			person_count: 4,
+			will_come: null
+		},
+	],
+	tasks: [
+		{name: "Ukol 1", done: false},
+		{name: "Ukol 2", done: true},
+		{name: "Ukol 3", done: true},
+		{name: "Ukol 4", done: false},
+	],
+	aboutUs: "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.",
+	notes: "",
+	wedding: {
+		when: '1. 9. 2019',
+		where: 'Zámek Litomyšl',
+		at: '11:00'
+	},
+	ourStory: "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.",
+	program: [
+		{
+			icon: "automobile",
+			time: "10:00",
+			title: "Příjezd nevěsty"
+		},
+		{
+			icon: "heart",
+			time: "11:00",
+			title: "Obřad"
+		},
+		{
+			icon: "cutlery",
+			time: "12:00",
+			title: "Hostina"
+		},
+		{
+			icon: "glass",
+			time: "13:00",
+			title: "Přípitek"
+		},
+		{
+			icon: "birthday-cake",
+			time: "12:00",
+			title: "Krájení dortu"
+		}
+	]
+};
+
 /**
 * Render template - check if exists
 *
@@ -21,8 +92,10 @@ function renderTemplate(req, res) {
 	var urlSegment = url.replace (/[^a-z0-9_]/, '');
 	var viewsRoot = app.get ('views');

+	templateData.queryString = req.query;
+
 	if (fs.existsSync (viewsRoot + '/' + urlSegment + ".ejs")) {
-		res.render (urlSegment);
+		res.render (urlSegment, templateData);
 	} else {
 		res.status (404);
 		res.send ('View ' + viewsRoot + '/' + urlSegment + '.ejs not found');
@@ -49,4 +122,32 @@ app.get ('/:page?', function (req, res) {
 	renderTemplate (req, res);
 });

+function savePost(req, res) {
+	console.log (req.body);
+
+	for (var i in req.body) {
+		templateData[i] = req.body[i];
+	}
+}
+
+app.post ('/:page?', function (req, res) {
+	savePost (req, res);
+
+	var redirectUrl = '/' + (typeof req.params.page === 'undefined' ? 'index' : req.params.page);
+
+	res.redirect (redirectUrl)
+});
+
+app.post ('/editor/:page?', function (req, res) {
+	savePost (req, res);
+
+	var redirectUrl = '/editor/' + (typeof req.params.page === 'undefined' ? 'index' : req.params.page);
+
+	if (typeof req.body.redirectParams !== 'undefined') {
+		redirectUrl += '?'+req.body.redirectParams;
+	}
+
+	res.redirect (redirectUrl)
+});
+
 app.listen (8080);
@@ -1,4 +1,9 @@
 $ (document).ready (function () {
+ initDatePickers();
+});
+
+
+function initDatePickers() {
 	$ ('.select-time').datetimepicker ({
 		format: 'LT',
 		locale: 'cs',
@@ -9,4 +14,4 @@ $ (document).ready (function () {
 		locale: 'cs',
 		minDate: new Date ()
 	});
-});
+}
@@ -108,7 +108,7 @@
 					case "datetime":
 						$input.addClass ('select-datetime');

-						initDateTimePickers ();
+						// initDateTimePickers ();

 						$input.datetimepicker ('show');
 						break;
@@ -147,25 +147,25 @@
 				return newData;
 			}

-			$.nette.ajax ({
-				url: url,
-				method: "POST",
-				data: {
-					value: newData
-				}
-			}).done (function () {
-				// todo: very ugly, sorry...
-				$ ("." + $trigger.attr ('class')).editable (callback);
-
-				// todo remove timepicker in nicer way
-				$ ('.bootstrap-datetimepicker-widget').remove ();
-
-				// todo: somehow not working...?
-				callback ();
-
-				var event = jQuery.Event ("snippet-reloaded");
-				$ (document).trigger (event);
-			});
+			// $.nette.ajax ({
+			// 	url: url,
+			// 	method: "POST",
+			// 	data: {
+			// 		value: newData
+			// 	}
+			// }).done (function () {
+			// 	// todo: very ugly, sorry...
+			// 	$ ("." + $trigger.attr ('class')).editable (callback);
+			//
+			// 	// todo remove timepicker in nicer way
+			// 	$ ('.bootstrap-datetimepicker-widget').remove ();
+			//
+			// 	// todo: somehow not working...?
+			// 	callback ();
+			//
+			// 	var event = jQuery.Event ("snippet-reloaded");
+			// 	$ (document).trigger (event);
+			// });

 			return newData;
 		};
@@ -202,4 +202,3 @@ function initEditable() {
 }

 $ (document).ready (initEditable);
-$ (document).on ('snippet-reloaded', initEditable);
@@ -0,0 +1,9 @@
+
+
+$(document).ready(function () {
+	setTimeout(function () {
+		$('.js-notification').fadeOut(1000);
+
+	}, 1000);
+
+});
@@ -1,13 +1,99 @@
 $ (document).on ('click', '.js-add-program', function () {
-	var $template = $ ($ (this).data ('template'));
-
+	var templateSelector = $ (this).data ('template') + ":last";
+	var $template = $ (templateSelector);
 	var $templateContainer = $ ($ (this).data ('template-container'));

 	var $copy = $template.clone ().removeClass ('template');
-	$copy.find ('.js-remove-program').removeAttr('hidden');

+	var itemsCount = $ ('.template-container__item').length;
+	$copy.find ('input').each (function () {
+		var name = $ (this).attr ('name');
+
+		$ (this).attr ('name', name.replace (/\[0\]/g, '[' + itemsCount + ']'));
+	});

 	$copy.appendTo ($templateContainer);
+
+	$ ('.select-time').datetimepicker ({
+		format: 'LT',
+		locale: 'cs',
+		stepping: 10,
+	});
+});
+
+function renameInputs() {
+	var items = $ ('.template-container__item');
+	var i = 0;
+
+	items.each (function () {
+		var $rows = $ (this).find ('input');
+
+		$rows.each (function () {
+			var name = $ (this).attr ('name');
+			$ (this).attr ('name', name.replace (/\[[0-9]+\]/g, '[' + i + ']'));
+		});
+
+		i++;
+	});
+}
+
+$(document).on('click', '.js-sort-events', function ( ){
+	var $templateContainer = $ ($ (this).data ('template-container'));
+	var $templates = $ ($ (this).data ('template'));
+
+	sortEvents($templateContainer, $templates);
+
+	$(this).fadeOut();
+});
+
+function sortEvents($container, $templates) {
+
+	var elements = $templates.get();
+
+	elements.sort(function (a, b) {
+
+		console.log(a);
+
+		var timeA = $(a).find('.select-time').val();
+		var timeB = $(b).find('.select-time').val();
+
+		return timeA > timeB;
+	});
+
+	$container.append(elements);
+
+	renameInputs();
+}
+
+
+function checkEvents($container, $templates) {
+	var lastTime = null;
+	var orderCorrect = true;
+	$templates.each(function() {
+		var time = $(this).find('.select-time').val();
+
+		if (time < lastTime) {
+			orderCorrect = false;
+		}
+		lastTime = time;
+	});
+
+	if (!orderCorrect) {
+		$('.js-sort-events').fadeIn();
+	} else {
+		$('.js-sort-events').fadeOut();
+	}
+}
+
+$(document).ready(function () {
+
+	setInterval(function () {
+		var $templateContainer = $ ('.template-container');
+		var $templates = $ ('.template');
+
+		checkEvents($templateContainer, $templates);
+	}, 1000);
+
 });

 $ (document).on ('click', '.js-remove-program', function () {
@@ -19,20 +105,20 @@ $ (document).on ('click', '.js-remove-program', function () {
 });

 var $iconTarget = null;
-$(document).on('click', '.js-set-icon-program', function () {
-	$('#setIconProgramModal').modal('show');
+$ (document).on ('click', '.js-set-icon-program', function () {
+	$ ('#setIconProgramModal').modal ('show');

-	$iconTarget = $(this);
+	$iconTarget = $ (this);
 });

-$(document).on('click', '.js-choose-icon', function () {
+$ (document).on ('click', '.js-choose-icon', function () {

-	var icon = $(this).data('icon');
+	var icon = $ (this).data ('icon');

-	$iconTarget.find('input').val(icon);
-	$iconTarget.find('.fa').removeAttr('class').addClass('fa fa-2x fa-'+icon);
+	$iconTarget.find ('input').val (icon);
+	$iconTarget.find ('.fa').removeAttr ('class').addClass ('fa fa-2x fa-' + icon);
 	$iconTarget = null;

-	$('#setIconProgramModal').modal('hide');
+	$ ('#setIconProgramModal').modal ('hide');

 });
@@ -22,15 +22,23 @@ function initSortable() {
 			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'));
+				var items = $ ('.template-container__item');
+				var i = 0;
+
+				items.each (function () {
+					var $rows = $ (this).find ('input');
+
+					$rows.each (function () {
+						var name = $ (this).attr ('name');
+
+						console.log(name);
+
+						$ (this).attr ('name', name.replace (/\[[0-9]+\]/g, '[' + i + ']'));
+					});
+
+					i++;
 				});
-
-
 			}
 		});
 	}
@@ -27,3 +27,17 @@ $ (".file-upload").change (function () {

 	readURL (this, preview);
 });
+
+$(document).on('submit', 'form.js-upload', function (e){
+
+	// var
+	$(this).find('input[type=file]').each(function() {
+
+	});
+
+
+	// e.preventDefault();
+	// return false;
+
+
+});
@@ -27,6 +27,7 @@ $fa-font-path: "~font-awesome/fonts";
@import "main";
@import "backToDashboard";
@import "boxes";
+@import "lightbox";

 // editor
@import "editor/app";
@@ -3,3 +3,12 @@
@import "timeline";
@import "gallery";

+.template:first-child {
+  .js-remove-program {
+    display: none;
+  }
+}
+
+.sort-handle:hover {
+  cursor: move;
+}
@@ -0,0 +1,207 @@
+html.lb-disable-scrolling {
+  overflow: hidden;
+  /* Position fixed required for iOS. Just putting overflow: hidden; on the body is not enough. */
+  position: fixed;
+  height: 100vh;
+  width: 100vw;
+}
+
+.lightboxOverlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 9999;
+  background-color: black;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
+  opacity: 0.8;
+  display: none;
+}
+
+.lightbox {
+  position: absolute;
+  left: 0;
+  width: 100%;
+  z-index: 10000;
+  text-align: center;
+  line-height: 0;
+  font-weight: normal;
+}
+
+.lightbox .lb-image {
+  display: block;
+  height: auto;
+  max-width: inherit;
+  max-height: none;
+  border-radius: 3px;
+
+  /* Image border */
+  border: 4px solid white;
+}
+
+.lightbox a img {
+  border: none;
+}
+
+.lb-outerContainer {
+  position: relative;
+  *zoom: 1;
+  width: 250px;
+  height: 250px;
+  margin: 0 auto;
+  border-radius: 4px;
+
+  /* Background color behind image.
+     This is visible during transitions. */
+  background-color: white;
+}
+
+.lb-outerContainer:after {
+  content: "";
+  display: table;
+  clear: both;
+}
+
+.lb-loader {
+  position: absolute;
+  top: 43%;
+  left: 0;
+  height: 25%;
+  width: 100%;
+  text-align: center;
+  line-height: 0;
+}
+
+.lb-cancel {
+  display: block;
+  width: 32px;
+  height: 32px;
+  margin: 0 auto;
+  //background: url(../images/loading.gif) no-repeat;
+}
+
+.lb-nav {
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 100%;
+  width: 100%;
+  z-index: 10;
+}
+
+.lb-container > .nav {
+  left: 0;
+}
+
+.lb-nav a {
+  outline: none;
+  background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
+}
+
+.lb-prev, .lb-next {
+  height: 100%;
+  cursor: pointer;
+  display: block;
+}
+
+.lb-nav a.lb-prev {
+  width: 34%;
+  left: 0;
+  float: left;
+  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAtCAYAAADsvzj/AAAFF0lEQVR4Ac2ZW0xcVRSGPTNnhlPKcCsUAeeChkEVxhutDQwzMANaqamNWgpaH+yDIaZp1cRHbgH0gTsxkmDCI/hiRAqgD5qYRgKQ8II6TE00wfgGAcIdKeM/ydrNZIezxxg9m518gRxWmn6s9a9zhvNQJBL5T/gfjokwA5Uw0zWFeHBOugiTsAArfSWZky+iABVowAZSwRkiDSTRz1iHlJMmogATsIDTIAPYgRs8SeTTtXSQSLVKFNkivIQKksDDJFCsquqLmqZdAa/i+yCuPQ1cJHOKjdpJEWGdsIFs8BQoy83NvTEzMzO3t7f318HBweHc3Nxdj8dznWQeIWmpIryENUaiCPgdDsfN+fn5XyLcWV5eDlmt1gBqHgOpbAHIFmESySAHeECF0+m8hd/+vcgxZ3d39wBj9grqCkA6iaiyRBRunJhEpcvl+nBhYeG3iM7Z2dnZgkg1ZSgNqLI6wgebSVTZ7faPlpaW/tSTWF9f36ivr+9AbQkF3iZRhAs2dSInJ+eDUCj0h0Biq7S09BPUBkEhyAKJssKusE6QRCGoQLDfn56eDulJrK6ubgeDwS7UXgTPAztIkXUfUbhxKgLlyMRtBPtXPYm1tbXdqqoqJnEOOGhbJQCTkSJ8sJlEMNoJrFhdicPDw6PKyspe1FaD85yE2YBnLUGwSSIrK+s2bnZLehIbGxubfr+/B7WXSMJJ42QlCcVAES7YJJGdnR0dp7BgnLZKSko6qBPngIvrBEkYIKIT7PLoOKET4TjB7kbty+A8SaRxmcAxQEQn2BUI9q3Z2dl7gk7sINhRiZeoE87jMmGECB/s3JhgR8dJV2Jzc3Pb5/N1UieKKdgsEyaAY5wIk2Dj5GHBRifCgmBHb3adLBNsO3HBNkxEAWZwCmSCx4EPwb4ZJ9jbCHYXSRQDpyDYhomoNFIOUIRMvINO/KQnsbKyshMIBD5D7RVwgQWblzBahD2Sp5jN5jzM+9uLi4s/60mEw+FNbKcvUH8DVIECcAZoXLCliaRaLBbX8PBwb0RwRkZGfkftx+BdUM4+KInDbdxoWUCKoih5CQkJgYGBgS/xs6PjRPb394+ampp+RP174CIoBGcpYypQZIqYY+4dz4DLvb29Y6LONDY2fou6OuAF+SCDZCgj8kQSQDqNihfU9vX1TYlkGhoa7qDuDVBKMpQVrjMG30fYCs6gAHuRmdqurq5JkUxLS8sEaq+CMq4zJGOgCB2Fk8kHJSaTqaazs3Pi2MzQaWtrm0RtDfDFyCQyGUNFOJlEkMlkwLWenp5vRDKtra1TNGYsM5mcjKEifGeYjBfUQUaYmebm5omYzLjFC8C4zyNqTGfcNDZ1/2ABjKHudZLXkTFARJAZN/CqqnqNMqN7Ojo6vqMF4ONkVFmvFUQLQNiZ7u7u76PZAn6S4TJjrIhoAdT+iwXAdQYYKCJaAG/iPhNvAYyj7jXwAngUpAGrDBF+ATCZAuBXFOX60NDQ3TiPM1/hyfoyPf7kgNNSXyvwmSGZMk3T3hocHPwhzlPzJLLFnpZT5PztV5wZNyilbTZFmTnZrxU4GZWXATV4ap4kmeNELlEticjsSHyZq/39/V/j374P2Lk/Pj5+BznxUuDlj1acJ4B8cAH/4er29vbPR0dH58fGxubx/ac2my1Ab3iz5Yc9/gJIB05QCJ4Fz9FXD3gC5HIfi+WKCGQ0GpuzwA7yCDtdS+b/SCFfRPwaQqPxSSaS6JrlwUjR+RtEvCM0ct4sLQAAAABJRU5ErkJggg==') left 48% no-repeat;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
+  opacity: 0;
+  -webkit-transition: opacity 0.6s;
+  -moz-transition: opacity 0.6s;
+  -o-transition: opacity 0.6s;
+  transition: opacity 0.6s;
+}
+
+.lb-nav a.lb-prev:hover {
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+  opacity: 1;
+}
+
+.lb-nav a.lb-next {
+  width: 64%;
+  right: 0;
+  float: right;
+  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAtCAYAAADsvzj/AAAFDUlEQVR4Ac2ZS0xcVRjHvTN3hisw0GIRZ3AeLWHQWqdVsRqgA86AUmpqoy20Whd2YYhprJq45BVAF7yJkQQTluDGiEhBF5qYRsIjYYMKQxNNMO4gQHgjZfxP8pF8ufEe0qQ5pyf5BTKcWfzyff/vnHt5xLQ0wgbsQCfswEY80BWPxx8I5sUlHMBJP0nm4RfRWAUMkAqOgseII8AFDNqjPYwiGuEAySADeEEuOEkE6bNjIIX22riQchHWSo+SRACc1nU9ahjGG+ASfn8Vn+WT0BNUMV0so04kFTwJTodCoeuTk5N3dnd397a3t/8dHx+fzM7OvoG/nQPPADdwscqoF2HBPgJynE5nZGFhYTZuWlNTU3/4fL6b2FMMnmUyTpJRLqKTSAbIQyu9vrW1tRv/n4Uqzfv9/g+x7xUQAh6QxmVUV0SnKRWESMXm5uZ63GJNT0//GQgEPsHeUibD20xTLeKioBdUV1e3rKysrFrJzM3N/eP1ej/F3jImIxgAcsOeDLLAKRAtLCz8HDKWlZmdnf3b4/F8zCojGADyz5F04AUvgPJoNNq2tLS0YSUzNjY2iwHwEWXmFHCzymiqRGwgiaaXD7wIysvKytqWl5e3rGQwAO4iM7ewt4SmmYfLqLpr2U0yZ0FFaWlp597e3r6VDEbzXapMlGQEA0COiEYyTmozP8lcKC4u7lhdXV2zksGhOZeVlXWLy5gHgDwRJsMqE6A2qygoKGhBm60L2izmdruZjGkAyBShxTNzlGTOgvMYAO2iAYDKxKjNSgQDQI6IRWb8VJnXMADaUZlNK5mJiYl5DAC6AQgGgCwRWjaWGR/IB+fD4XDr2trahqDN5lEZ3mbZ5gEgW4QPAD6aK3BotmIArAsqE2MDIMTajGTkinAZ3mb5NAAS58zGIQPgJvaGwVMgk5597ECTLcJl+AB4GVyKRCJfLi4uijLzGzLzHrWYj1pMVyXCB4BBz/J5oAzcwDT7OhaLWZ4zMzMzvyNX79rt9uOUNyewqRSxsbzk0Jh9H3w2MDDwV1yw+vv7Ox0OR4C+q1REAzr1+ON0TpSDD+rq6n7d2dmxusbs9/T0fJOUlBTRNO2gIg6lGSGJYyAXFIFrtbW1P4oq0dnZOYR9F8EZdqaoCDtVgrJBEoXgck1Nzfciia6urlHsu0rSOSADJEkXYRK8EufAlYaGhtsiiba2thFk4kAij75Po1fiOcIkkplEGFQ2NTWNCBz2W1tbb9tstkrsLaDvcQlN5hWFS2SyTFxubGwcFUl0dHT8gH1VTCITJHMJWSLmYAcPMlFfXy9sJ0gkMnGNpEnCXAkJIhYSReAtBHvosGCTRBgEWSV0qc8jPNhMIgyutLS0/CSSSGRC1/Uqkg5aZUKGiDkTQVAMqtrb238+RGJUHGyZb1F4Je4/2FfFwZYr4qRb7QnwEngTwR4+5JxIZOJtcbDlv2lMAR5wBjfUi7h2fCuS6Ovru6Np2nVqvzwmQcFW9+43HeSg10twix0RSfT29v5iGMY7dMLniTOh+N8KghN7lKZTIQgKMiG/IkwkCJELFiL7uMWOYE+lWUL8elRNa51APoqGh4cTN9p7TOJed3f3d4nz5P4l1ITdDU66XK5Ic3PzF0NDQ1ODg4NT+P0rCFbQM3qu4MRWLsIfX7PB0yAEngPP089TwA8yBMFWKmJ+qZBGj7FecJzw0mfpwBBLqBexseAbIBWkESnAEPybQLnIf4JfIzSb+FymAAAAAElFTkSuQmCC') right 48% no-repeat;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
+  opacity: 0;
+  -webkit-transition: opacity 0.6s;
+  -moz-transition: opacity 0.6s;
+  -o-transition: opacity 0.6s;
+  transition: opacity 0.6s;
+}
+
+.lb-nav a.lb-next:hover {
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+  opacity: 1;
+}
+
+.lb-dataContainer {
+  margin: 0 auto;
+  padding-top: 5px;
+  *zoom: 1;
+  width: 100%;
+  border-bottom-left-radius: 4px;
+  border-bottom-right-radius: 4px;
+}
+
+.lb-dataContainer:after {
+  content: "";
+  display: table;
+  clear: both;
+}
+
+.lb-data {
+  padding: 0 4px;
+  color: #ccc;
+}
+
+.lb-data .lb-details {
+  width: 85%;
+  float: left;
+  text-align: left;
+  line-height: 1.1em;
+}
+
+.lb-data .lb-caption {
+  font-size: 13px;
+  font-weight: bold;
+  line-height: 1em;
+}
+
+.lb-data .lb-caption a {
+  color: #4ae;
+}
+
+.lb-data .lb-number {
+  display: block;
+  clear: left;
+  padding-bottom: 1em;
+  font-size: 12px;
+  color: #999999;
+}
+
+.lb-data .lb-close {
+  display: block;
+  float: right;
+  width: 30px;
+  height: 30px;
+  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABsAAAAbCAMAAAC6CgRnAAAAPFBMVEX///8AAAD9/f2CgoKAgIAAAAAAAAAAAABLS0sAAAAAAACqqqqqqqq6urpKSkpISEgAAAC7u7u5ubn////zbsMcAAAAE3RSTlMASv6rqwAWS5YMC7/AyZWVFcrJCYaKfAAAAHhJREFUeF590kkOgCAQRFEaFVGc+/53FYmbz6JqBbyQMFSYuoQuV+iTflnstI7ssLXRvMWRaEMs84e2uVckuZe6knL0hiSPObXhj6ChzoEkIolIIpKIO4joICAIeDd7QGIfCCjOKe9HEk8mnxpIAup/F31RPZP9fAG3IAyBSJe0igAAAABJRU5ErkJggg==') top right no-repeat;
+  text-align: right;
+  outline: none;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
+  opacity: 0.7;
+  -webkit-transition: opacity 0.2s;
+  -moz-transition: opacity 0.2s;
+  -o-transition: opacity 0.2s;
+  transition: opacity 0.2s;
+}
+
+.lb-data .lb-close:hover {
+  cursor: pointer;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+  opacity: 1;
+}
@@ -1,5 +1,8 @@

+
 <div class="container-fluid my-5">
+	<h3 class="text-center">Kdo?</h3>
+
 	<div class="row justify-content-center my-5">
 		<div class="col-md-4">

@@ -1,109 +1,129 @@
 <div class="boxes__container">

-	<div class="card boxes__item">
-		<div class="card-header">
-			<h3>
-				<a href="/guests/">Poslední reakce na pozvánky</a>
-			</h3>
-		</div>
-		<div class="card-body">
+    <div class="card boxes__item">
+        <div class="card-header">
+            <h3>
+                <a href="/guests/">Poslední reakce na pozvánky</a>
+            </h3>
+        </div>
+        <div class="card-body">

-			<table class="table table-bordered table-striped table-hover">
-				<thead>
-				<tr>
-					<td>Jméno</td>
-					<td>Počet osob</td>
-					<td>Přijde?</td>
-					<td>Datum reakce</td>
-				</tr>
-				<tbody>
+            <% if (typeof invitations != 'undefined') { %>
+                <table class="table table-bordered table-striped table-hover">
+                    <thead>
+                    <tr>
+                        <td>Jméno</td>
+                        <td>Počet osob</td>
+                        <td>Přijde?</td>
+                        <td>Datum reakce</td>
+                    </tr>
+                    <tbody>

-				<tr>
-					<td></td>
-					<td></td>
-					<td></td>
-					<td></td>
-				</tr>
+                    <% invitations.forEach(function (invitation) { %>

-				</tbody>
-			</table>
+                        <% if (invitation.will_come !== null) { %>

-		</div>
-		<div class="card-footer">
+                            <tr>
+                                <td><%= invitation.name %></td>
+                                <td><%= invitation.person_count %></td>
+                                <td>
+                                    <% if (invitation.will_come) { %>
+                                        Ano
+                                    <% } else { %>
+                                        Ne
+                                    <% } %>
+
+                                </td>
+                                <td>
+                                    <% if (typeof invitation.date != 'undefined') { %>
+                                        <%= invitation.date.toLocaleDateString () %>
+                                    <% } %>
+                                </td>
+                            </tr>
+
+                    <% }
+                    }) %>
+
+                    </tbody>
+                </table>
+            <% } else { %>
+                <div class="alert alert-warning">Zatím nikdo neodpověděl na pozvánku.</div>
+            <% } %>
+
+        </div>
+        <div class="card-footer">


-			Zareagovalo 28 hostů - zúčastní se 20, nemůže 8.
+            Zareagovalo <%= invitations.length %> hostů - zúčastní se 20, nemůže 8.

-			<button class="btn btn-secondary pull-right">
-				Seznam hostů
-			</button>
-		</div>
-	</div>
+            <button class="btn btn-secondary pull-right">
+                Seznam hostů
+            </button>
+        </div>
+    </div>


-	<div class="card boxes__item">
-		<div class="card-header">
-			<h3>
-				Poznámky </h3>
-		</div>
-		<div class="card-body">
+    <div class="card boxes__item">
+        <div class="card-header">
+            <h3>
+                Poznámky </h3>
+        </div>
+        <form action="./" method="post">
+            <div class="card-body">
+                <textarea name="notes" cols="30" rows="10" class="wysiwyg"><%= notes %></textarea>
+            </div>
+
+            <div class="card-footer">
+                <button class="btn btn-secondary pull-right">Uložit</button>
+            </div>
+        </form>
+    </div>


-			<textarea name="notes" cols="30" rows="10" class="wysiwyg"></textarea>
+    <div class="card boxes__item">
+        <div class="card-header">
+            <h3>
+                <a href="/calendar">Nadcházející události</a>
+            </h3>
+        </div>
+        <div class="card-body">


-		</div>
-
-		<div class="card-footer">
-			<button class="btn btn-secondary pull-right">Uložit</button>
-		</div>
-	</div>
+            todo


-	<div class="card boxes__item">
-		<div class="card-header">
-			<h3>
-				<a href="/calendar">Nadcházející události</a>
-			</h3>
-		</div>
-		<div class="card-body">
+        </div>
+    </div>


-			todo
+    <div class="card boxes__item">
+        <div class="card-header">
+            <h3>
+                Úkoly </h3>
+        </div>
+        <div class="card-body">

+            <ul>

-		</div>
-	</div>
+                <% var cnt = 0 %>
+                <% tasks.forEach(function (task) { %>
+                    <li>
+                        <input type="checkbox" name="tasks[<%= cnt++ %>][done]" <%= typeof task.done != 'undefined' && task.done ? 'checked' : '' %>>
+                        <span class="edit-inline"><%= task.name %></span>
+                    </li>
+                <% }) %>

+            </ul>

-	<div class="card boxes__item">
-		<div class="card-header">
-			<h3>
-				Úkoly </h3>
-		</div>
-		<div class="card-body">
+        </div>

-			<ul>
-				<li>
-					<input type="checkbox" checked>
-					<span>Ukol 1</span>
-				</li>
-				<li><input type="checkbox">
-					<span>Ukol 1</span>
-				</li>
-				<li>
-					<input type="checkbox">
-					<span>Ukol 1</span>
-				</li>
-			</ul>
+        <div class="card-footer">

-		</div>
+            <form method="post">
+                <input type="text" name="tasks[<%= tasks.length %>][name]">

-		<div class="card-footer">
-
-			<input type="text">
-
-			<div class="btn btn-secondary ">Uložit</div>
-		</div>
-	</div>
+                <button class="btn btn-secondary ">Uložit</button>
+            </form>
+        </div>
+    </div>
 </div>
@@ -1,37 +1,41 @@
-
 <section class="web-part container">
-	<h3 class="text-center">Fotogalerie</h3>
+    <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="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">

-	<div class="gallery__container">
+        <%- include('../partials/notification.ejs', {parameter: "newAlbum", notificationText: "Album úspěšně vytvořeno."}) %>
+        <%- include('../partials/notification.ejs', {parameter: "upload", notificationText: "Fotografie úspěšně nahrány do vybraných alb."}) %>

-		<% for(var i = 1; i <= 6; i++) { %>
-			<div class="gallery__item">
-				<img src="/dist/images/gallery/<%= i %>.jpg" alt="">
+        <% for(var i = 1; i <= 7; i++) { %>
+            <% if (i < 7 || (typeof queryString.ok !== 'undefined' && queryString.ok == "newAlbum")) { %>

-				<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 %>
+                <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>
@@ -1,57 +1,72 @@
 <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>
+    <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 %>
+    <% 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">
+            <i class="fa fa-arrows"></i>
+            Přesunout fotografie
+        </button>
+
+        <button type="button" class="btn js-move-done-button-trigger btn-primary" hidden>
+            Hotovo
+        </button>
+
+        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#newPhotoModal">
+            <i class="fa fa-plus"></i> Nahrát fotografie
+        </button>
+
+        <button type="button" class="btn js-delete-button-trigger btn-danger">
+            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="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>
+    <%- include('../partials/notification.ejs', {parameter: "upload"}) %>

-			<button type="button" class="btn js-move-done-button-trigger btn-primary" hidden>
-				Hotovo
-			</button>
+    <a name="program"></a>

-			<button type="button" class="btn js-delete-button-trigger btn-secondary">
-				Smazat fotografie
-			</button>
+    <div class="gallery__container draggable-container">

-			<button type="button" class="btn js-delete-button-confirmation btn-primary" data-toggle="modal" data-target="#deletePhotosModal" hidden>
-				Odstranit vybrané
-			</button>
-		<!--</div>-->
-	</div>
+        <% for(var i = 1; i <= 10; i++) { %>
+            <% if (i < 7 || (typeof queryString.ok !== 'undefined' && queryString.ok == "upload")) { %>

+                <div class="gallery__item draggable">

-	<div class="gallery__container draggable-container">
+                    <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>

-			<% for(var i = 1; i <= 6; i++) { %>
-				<div class="gallery__item draggable">
+                    <a href="/dist/images/gallery/<%= i %>.jpg" data-lightbox="gallery">
+                        <img src="/dist/images/gallery/<%= i %>.jpg" alt="">
+                    </a>
+                </div>

-					<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 %>
+    </div>

+    <% include ../partials/editor/modals/newGallery.ejs %>
+    <%- include('../partials/editor/modals/uploadPhoto.ejs', {hideAlbum: true}) %>
+    <% include ../partials/editor/modals/deletePhotos.ejs %>
 </section>
@@ -1,5 +1,7 @@
 <section class="web-part">
-	<div class="title-image" style="background-image: url('/dist/images/01.jpg')">
+    <%- include('../partials/notification.ejs', {parameter: "titlePhoto"})%>
+
+	<div class="title-image" style="background-image: url('/dist/images/<%= (typeof queryString.ok !== 'undefined' && queryString.ok == "titlePhoto") ? '01.jpg' : '02.jpg' %>')">

 		<div class="web-part__edit">
 			<a href="#setTitlePhotoModal" data-toggle="modal" data-target="#setTitlePhotoModal">
@@ -11,14 +13,13 @@
 </section>

 <section class="web-part container">
+    <a name="aboutUs"></a>
+
+    <%- include('../partials/notification.ejs', {parameter: "aboutUs"})%>
+
 	<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>
+		<p><%- aboutUs %></p>
 	</article>

 	<% include ../partials/editor/modals/setAboutUs.ejs %>
@@ -26,18 +27,21 @@

 <section class="web-part container text-center">

+   <%- include('../partials/notification.ejs', {parameter: "weddingInfo"})%>
+
+    <a name="mainInfo"></a>
 	<div class="row">
 		<div class="col-md-4">
 			<h2>Kdy?</h2>
-			<p>1. 9. 2019</p>
+			<p><%= wedding.when %></p>
 		</div>
 		<div class="col-md-4">
 			<h2>Kde?</h2>
-			<p>Zámek Litomyšl</p>
+            <p><%= wedding.where %></p>
 		</div>
 		<div class="col-md-4">
 			<h2>V kolik?</h2>
-			<p>11:00</p>
+            <p><%= wedding.at %></p>
 		</div>

 		<% include ../partials/editor/modals/mainInfo.ejs %>
@@ -46,20 +50,24 @@
 </section>

 <section class="web-part container">
-	<h3 class="text-center">Svatební program</h3>
+
+    <%- include('../partials/notification.ejs', {parameter: "program"})%>
+
+    <a name="program"></a>
+    <h3 class="text-center my-5">Svatební program</h3>

 	<div class="timeline-container">

 		<div class="timeline timeline-horizontal">

-			<% for(var i = 0; i < 5; i++) { %>
+			<% for(var i in program) { %>
 				<div class="timeline__item">

-					<i class="timeline__icon fa fa-2x fa-heart-o"></i>
+					<i class="timeline__icon fa fa-2x fa-<%= program[i]['icon']%>"></i>

 					<div class="timeline__content">
-						<h3>11:00</h3>
-						<p><%= i %> Hostina</p>
+						<h3><%= program[i]['time']%></h3>
+						<p><%= program[i]['title']%></p>
 					</div>

 				</div>
@@ -74,7 +82,7 @@


 <section class="web-part container">
-	<h3 class="text-center">Fotogalerie</h3>
+	<h3 class="text-center my-5">Fotogalerie</h3>

 	<div class="gallery__container">

@@ -101,9 +109,13 @@
 <section class="web-part container">
 	<h3 class="text-center">Napište nám</h3>

-	<div id="js-contact-form-status"></div>
+    <%- include('../partials/notification.ejs', {parameter: "contactForm", notificationText: "Zpráva úspěšně odeslána. Ozveme se co nejdříve."})%>

-	<form id="contact-form" method="post" action="javascript:void(0);" role="form">
+
+	<form id="contact-form" method="post" role="form">
+        <a name="contactForm"></a>
+
+        <input type="hidden" name="redirectParams" value="ok=contactForm#contactForm">

 		<div class="row">
 			<div class="col-md-5">
@@ -1,12 +1,13 @@
+
+
 <section class="web-part container">
-	<h2> Náš příběh </h2>
+
+    <%- include('../partials/notification.ejs', {parameter: "text"})%>
+
+
+    <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
-		   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>
+        <%- ourStory %>
 	</article>

 	<% include ../partials/editor/modals/ourStory.ejs %>
@@ -12,8 +12,10 @@
 					<span aria-hidden="true">&times;</span>
 				</button>
 			</div>
+            <form method="post">
 			<div class="modal-body">

+                <input type="hidden" name="redirectParams" value="ok=weddingInfo#mainInfo">

 				<% include ../../weddingInfo.ejs %>

@@ -23,9 +25,10 @@

 			<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 type="submit" class="btn btn-primary">Uložit
 				</button>
 			</div>
+            </form>
 		</div>
 	</div>
 </div>
@@ -1,26 +1,40 @@
-
 <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="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>
+            <form method="post">
+                <input type="hidden" name="redirectParams" value="ok=newAlbum">

-				<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 class="modal-body">
+
+                    <div class="form-group">
+                        <label for="gallery_name">Název alba</label>
+                        <input type="text" required name="gallery_name" id="gallery_name" class="form-control">
+                    </div>
+
+                    <div class="form-group">
+                        <label for="gallery_name">Vyberte fotografie</label>
+                        <input type="file" multiple required 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="submit" class="btn btn-primary">Uložit
+                    </button>
+                </div>
+            </form>
+        </div>
+    </div>
 </div>
@@ -1,27 +1,32 @@
 <div class="web-part__edit">
-	<a href="#ourStoryModal" data-toggle="modal" data-target="#ourStoryModal">
-		<i class="fa fa-pencil-square"></i>
-	</a>
+    <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-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>
+            <form method="post">

-			<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>
+                <input type="hidden" name="redirectParams" value="ok=text">
+
+                <div class="modal-body">
+                    <textarea class="wysiwyg" name="ourStory"><%= ourStory %></textarea>
+                </div>
+
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Storno</button>
+                    <button type="submit" class="btn btn-primary">Uložit
+                    </button>
+                </div>
+            </form>
+        </div>
+    </div>
 </div>
@@ -1,82 +1,105 @@
 <div class="web-part__edit">
-	<a href="#setProgramModal" data-toggle="modal" data-target="#setProgramModal">
-		<i class="fa fa-pencil-square"></i>
-	</a>
+    <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">
-		<div class="modal-content">
-			<div class="modal-header">
-				<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="modal-dialog modal-lg" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <form method="post">
+
+                <input type="hidden" name="redirectParams" value="ok=program#program">
+
+                <div class="modal-body">


-				<table>
-					<thead>
-					<tr>
-						<th>Čas</th>
-						<th>Ikona</th>
-						<th>Název události</th>
-						<th>
-						</th>
-					</tr>
-					</thead>
-					<tbody class="template-container">
-					<tr class="template">
-						<td><input type="text" class="form-control time" name="time[]" placeholder="11:00"></td>
-						<td class="text-center">
+                    <table class="table">
+                        <thead>
+                        <tr>
+                            <th></th>
+                            <th>Čas</th>
+                            <th>Ikona</th>
+                            <th>Název události</th>
+                            <th></th>
+                        </tr>
+                        </thead>
+                        <tbody class="template-container draggable-container">

-							<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>
+                        <% for(var i in program) { %>
+                            <tr class="template draggable template-container__item">
+                                <td>
+                                    <i class="fa fa-ellipsis-v sort-handle"></i>
+                                </td>
+                                <td style="position: relative">
+                                    <input type="text" class="form-control time select-time" size="4" name="program[<%= i %>][time][]" value="<%= program[i]['time'] %>" placeholder="11:00">
+                                </td>
+                                <td class="text-center">

-						</td>
-						<td><input type="text" class="form-control program-description" name="description[]"></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="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>
-				</table>
+                                    <a href="javascript:void(0);" class="js-set-icon-program">
+                                        <input type="hidden" name="program[<%= i %>][icon][]" value="<%= program[i]['icon'] %>">
+                                        <i class="fa fa-2x fa-<%= program[i]['icon'] %>"></i>
+                                    </a>
+
+                                </td>
+                                <td>
+                                    <input type="text" class="form-control program-description" name="program[<%= i %>][title][]" value="<%= program[i]['title'] %>">
+                                </td>
+                                <td>
+                                    <a href="javascript:void(0);" class="js-remove-program"><i class="fa fa-trash"></i></a>
+                                </td>
+                            </tr>
+
+                        <% } %>
+
+                        </tbody>
+                        <tfoot>
+                        <tr>
+                            <td colspan="4">
+                                <a href="javascript:void(0);" class="btn btn-outline-secondary js-add-program" data-template-container=".template-container" data-template=".template"><i class="fa fa-plus"></i> Přidat akci</a>
+
+                                <a href="javascript:void(0);" class="btn btn-outline-secondary js-sort-events" style="display: none" data-template-container=".template-container" data-template=".template"><i class="fa fa-sort-numeric-asc"></i> Seřadit akce chronologicky</a>
+                            </td>
+                        </tr>
+                        </tfoot>
+                    </table>


+                </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 class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Storno</button>
+                    <button type="submit" class="btn btn-primary">Uložit
+                    </button>
+                </div>
+            </form>
+        </div>
+    </div>
 </div>

-
 <div class="modal fade" id="setIconProgramModal" tabindex="-1" role="dialog" aria-labelledby="setIconProgramModal" aria-hidden="true">
-	<div class="modal-dialog" role="document">
-		<div class="modal-content">
-			<div class="modal-body">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-body">

-				<a href="javascript:void(0);" data-icon="gear" class="js-choose-icon"><i class="fa fa-2x fa-gear"></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="javascript:void(0);" data-icon="home" class="js-choose-icon"><i class="fa fa-2x fa-home"></i></a>
+                <% var icons = ['gear', 'home', 'automobile', 'bell', 'bullhorn', 'child', 'coffee', 'diamond', 'film', 'camera',
+                    'camera-retro', 'fire', 'birthday-cake', 'heart', 'image', 'map', 'map-marker', 'map-o',
+                    'motorcycle', 'plane', 'road', 'cutlery', 'paint-brush', 'gift', 'glass', 'star', 'star-o'
+                ] %>

-			</div>
-		</div>
-		</div>
-		</div>
+                <% for (var i in icons) { %>
+
+                    <a href="javascript:void(0);" data-icon="<%= icons[i] %>" class="js-choose-icon"><i class="fa fa-3x fa-<%= icons[i] %>"></i></a>
+
+                <% } %>
+
+            </div>
+        </div>
+    </div>
+</div>
@@ -13,15 +13,21 @@
 					<span aria-hidden="true">&times;</span>
 				</button>
 			</div>
+            <form method="post">
+
+                <input type="hidden" name="redirectParams" value="ok=aboutUs#aboutUs">
+
 			<div class="modal-body">
-				<textarea class="wysiwyg" name="aboutUs"></textarea>
+				<textarea class="wysiwyg" name="aboutUs"><%= 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>
+				<button type="submit" class="btn btn-primary">Uložit</button>
 			</div>
+
+            </form>
+
 		</div>
 	</div>
 </div>
@@ -8,6 +8,10 @@
 					<span aria-hidden="true">&times;</span>
 				</button>
 			</div>
+            <form method="post">
+
+                <input type="hidden" name="redirectParams" value="ok=titlePhoto">
+
 			<div class="modal-body">
 				<div class="form-group">
 					<label>Vybrat obrázek</label>
@@ -23,8 +27,9 @@
 			</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">Nastavit</button>
+				<button type="submit" class="btn btn-primary">Nastavit</button>
 			</div>
+            </form>
 		</div>
 	</div>
 </div>
@@ -1,54 +1,69 @@
 <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">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title">Nahrát fotografii</h5>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>

-				<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>
+            <form method="post" class="js-upload">

-							<select name="album" class="form-control">
-								<% for (var i = 0; i < 6; i++) { %>
-									<option value="<%= i %>">Album <%= i %></option>
-								<% } %>
-							</select>
+                <input type="hidden" name="redirectParams" value="ok=upload">

-						</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 class="modal-body">

-			</div>
+                    <table>
+                        <thead>
+                        <tr>
+                            <th>Výběr fotografií</th>
+                            <% if (typeof hideAlbum === 'undefined' || !hideAlbum) { %>
+                                <th>Album</th>
+                            <% } %>
+                            <th></th>
+                        </tr>
+                        </thead>
+                        <tbody class="template-container">
+                        <tr class="template">
+                            <td><input type="file" accept="image/*" multiple required name="photos[]"></td>
+                            <% if (typeof hideAlbum === 'undefined' || !hideAlbum) { %>
+                                <td>

-			<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>
+                                    <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>
+                        <% if (typeof hideAlbum === 'undefined' || !hideAlbum) { %>
+
+                            <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="submit" class="btn btn-primary">Nahrát
+                    </button>
+                </div>
+            </form>
+
+        </div>
+    </div>
 </div>
@@ -0,0 +1,14 @@
+<% if (typeof queryString.ok !== "undefined" && queryString.ok == parameter) { %>
+
+    <div class="text-success alert alert-success js-notification" style="position: absolute; width: 50%; left: 25%; top: 0; z-index: 9999">
+        <i class="fa fa-check"></i>
+        <% if (typeof notificationText === 'undefined') { %>
+
+            Úspěšně uloženo
+
+        <% } else { %>
+            <%= notificationText %>
+        <% } %>
+    </div>
+
+<% } %>
@@ -1,17 +1,17 @@
 <div class="row">
 	<div class="col-md-4">
-		<h2>Kdy?</h2>
-		<input type="text" class="form-control select-date">
+		<h3>Kdy?</h3>
+		<input type="text" class="form-control select-date" name="wedding[when]" value="<%= wedding.when%>">
 	</div>
 	<div class="col-md-4">
-		<h2>Kde?</h2>
+		<h3>Kde?</h3>

-		<input type="text" id="map-input" class="form-control" />
+		<input type="text" id="map-input" class="form-control" name="wedding[where]" value="<%= wedding.where%>" />

 	</div>
 	<div class="col-md-4">
-		<h2>V kolik?</h2>
-		<input type="text" class="form-control select-time">
+		<h3>V kolik?</h3>
+		<input type="text" class="form-control select-time" name="wedding[at]" value="<%= wedding.at%>">
 	</div>
 </div>