billy_cms 0.0.2

data/app/assets/javascripts/billy_cms/backend.js

@@ -0,0 +1,15 @@
+// This is a manifest file that'll be compiled into application.js, which will include all the files
+// listed below.
+//
+// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
+// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path.
+//
+// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
+// compiled file.
+//
+// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
+// about supported directives.
+//
+//= require jquery_ujs
+//= require ./backend/app
+//= require_tree ./backend

data/app/assets/javascripts/billy_cms/frontend/api_connector.js

@@ -0,0 +1,5 @@
+var BillyCms = BillyCms || {};
+
+BillyCms.ApiConnector = {
+
+};

data/app/assets/javascripts/billy_cms/frontend/editing.es6

@@ -0,0 +1,120 @@
+'use strict';
+
+var BillyCms = window.BillyCms || {};
+
+BillyCms.API_BASE_URL = '/billy_cms/api/pages';
+
+BillyCms.Editing = {
+    isEditModeOn: false,
+
+    setEditMode(state) {
+        this.isEditModeOn = state;
+        var editableFields = $('[contenteditable]');
+        var container = $('.container');
+        if (state === true) {
+            container.addClass('edit-mode-enabled');
+            editableFields.attr('contenteditable', true);
+        } else {
+            container.removeClass('edit-mode-enabled');
+            editableFields.attr('contenteditable', false);
+        }
+    },
+
+    savePageProperty(page_id, property, content) {
+        return $.ajax({
+            url: `${BillyCms.API_BASE_URL}/${page_id}`,
+            method: 'PATCH',
+            data: {
+                page: {
+                    [property]: content
+                }
+            }
+        }).done(data => {
+            if (data.success) {
+                console.log('page saved.');
+                console.log(data.page);
+            } else {
+                alert(`Es hat sich ein Fehler ereignet: ${data.error}`);
+            }
+        }).fail((jqXHR, textStatus, error) => {
+            alert(`Es hat sich ein Fehler ereignet: ${error}`);
+        });
+    }
+};
+
+$(function() {
+    $('.billycms_edit_button').on('click', function() {
+        BillyCms.Editing.setEditMode(!BillyCms.Editing.isEditModeOn);
+    });
+
+    $('.page-content-binary input[type=file]').on('change', function(evt) {
+        if (BillyCms.Editing.isEditModeOn) {
+            var container = $(this).parent('.page-content-binary');
+            var pageId = parseInt(container.attr('billycms-page'), 10);
+            var files = this.files;
+            if (files.length < 1) { return; }
+            var file = files[0];
+            var reader = new FileReader();
+            var image = container.find('img');
+
+            reader.onloadend = function() {
+                var result = reader.result;
+                BillyCms.Editing.savePageProperty(pageId, 'content', result)
+                    .done(function() {
+                        image.attr('src', result);
+                    })
+            }
+            reader.readAsDataURL(file);
+        }
+    });
+
+    $('[contenteditable]').on('blur', function() {
+        if (BillyCms.Editing.isEditModeOn) {
+            let el = $(this),
+                id = el.attr('billycms-page'),
+                attribute = el.attr('billycms-attribute');
+            BillyCms.Editing.savePageProperty(id, attribute, el.html())
+        }
+    });
+
+    $('.page-settings-modal').each((index, modalElement) => {
+        let pageSettingsModal = $(modalElement);
+        let pageSettingsForm = pageSettingsModal.find('form').first();
+        let pageSettingsButton = pageSettingsModal.find('.btn.btn-primary').last();
+        let saveSettingsFn = function() {
+            let form = pageSettingsForm;
+            let id = form.attr('billycms-id');
+            if (!id) {
+                return alert('Diese Seite existiert nicht.');
+            }
+            id = form.attr('billycms-id');
+            let page = {};
+            form.find('input').not('[type=hidden]').not('[disabled]').each((i, element) => {
+                let el = $(element);
+                let name = el.attr('name');
+                let val = el.val();
+                if (name) {
+                    page[name] = val;
+                }
+            });
+            console.log(page);
+            $.ajax({
+                url: `${BillyCms.API_BASE_URL}/${id}`,
+                method: 'PATCH',
+                data: { page }
+            }).done(data => {
+                if (data.success) {
+                    console.log('page saved.');
+                    console.log(data.page);
+                    pageSettingsModal.modal('hide');
+                } else {
+                    alert(`Es hat sich ein Fehler ereignet: ${data.error}`);
+                }
+            }).fail((jqXHR, textStatus, error) => {
+                alert(`Es hat sich ein Fehler ereignet: ${error}`);
+            });
+        };
+        pageSettingsButton.on('click', saveSettingsFn);
+        pageSettingsForm.on('submit', saveSettingsFn);
+    });
+});

data/app/assets/javascripts/billy_cms/frontend/google_maps.js

@@ -0,0 +1,13 @@
+'use strict';
+
+$(function() {
+	$('.google-map-embedded').each(function(i, mapBox) {
+		var mapOptions = JSON.parse($($(mapBox).attr('data-box-content')).text());
+		var map = new google.maps.Map(mapBox, mapOptions);
+
+		if (mapOptions.marker) {
+			mapOptions.marker.map = map;
+			var marker = new google.maps.Marker(mapOptions.marker);
+		}
+	});
+});

data/app/assets/javascripts/billy_cms/frontend/slick.es6

@@ -0,0 +1,8 @@
+'use strict';
+
+$(function() {
+	$('.slick-carousel').slick({
+		autoplay: true,
+  		autoplaySpeed: 3500,
+	});
+});

data/app/assets/javascripts/billy_cms.js

@@ -0,0 +1,16 @@
+// This is a manifest file that'll be compiled into application.js, which will include all the files
+// listed below.
+//
+// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
+// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path.
+//
+// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
+// compiled file. JavaScript code in this file should be added after the last require_* statement.
+//
+// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
+// about supported directives.
+//
+//= require jquery
+//= require jquery_ujs
+// require turbolinks
+//= require_tree ./billy_cms/frontend

data/app/assets/stylesheets/billy_cms/backend/index.scss

@@ -0,0 +1,17 @@
+.file-wrapper {
+	position: relative;
+	cursor: pointer;
+	> input[type=file] {
+		border: red 1px solid;
+		position: absolute;
+		width: 100%;
+		height: 100%;
+		opacity: 0;
+		cursor: pointer;
+	}
+}
+
+i.jstree-icon.binary-type {
+    background: url(/assets/billy_cms/fileicon.png);
+    background-size: 80% 80%;
+}

data/app/assets/stylesheets/billy_cms/editmode.scss

@@ -0,0 +1,78 @@
+@mixin editbutton {
+  border: 1px solid #AFADAD;
+  border-radius: 3px;
+  padding: 5px 10px 5px 10px;
+  font-size: 13px;
+  background-color: #C1C1C1;
+  color: #fff;
+  position: absolute;
+  font-weight: 100px;
+  left: 1em;
+  min-width: 85px;
+  outline: none;
+    &:hover {
+      background-color: #E6B0B0;
+      border: 1px solid #DC8888;
+    }
+}
+@mixin editbutton-current {
+  background-color: #BFE2BB;
+  border: 1px solid #6DB145;
+  color: #6DB145;
+      &:focus {
+      box-shadow: 0px 0px 5px green;
+    }
+}
+
+.edit-mode-enabled {
+    [contenteditable], .page-content-binary {
+        border: 1px solid #F3B9B9;
+        background-color: #FFF0F0;
+        min-height: 1em;
+        border-radius: 3px;
+        padding: 5px;
+        outline: none;
+        input[type=file] {
+            display: block;
+        }
+      &:focus {
+        box-shadow: 0px 0px 5px red;
+      }
+    }
+}
+
+.page-content-binary {
+    position: relative;
+    input[type=file] {
+        width: 100%;
+        height: 100%;
+        position: absolute;
+        top: 0;
+        left: 0;
+        opacity: 0;
+        display: none;
+    }
+}
+
+.billycms_edit_button {
+    @include editbutton;
+    right: 2em;
+    &::before {
+        content: 'bearbeiten';
+    }
+}
+.edit-mode-enabled .billycms_edit_button {
+  @include editbutton-current;
+  &::before {
+      content: 'fertig';
+  }
+}
+
+.billycms_settings_button {
+  @include editbutton;
+  top: 12em;
+  z-index: 100;
+  &::before {
+    content: 'Seiteneinstellungen';
+  }
+}

data/app/assets/stylesheets/billy_cms/index.scss

@@ -0,0 +1,5 @@
+@import "jstree";
+
+@import "editmode";
+
+@import "backend/index";