aboutsummaryrefslogtreecommitdiffstats
path: root/view
diff options
context:
space:
mode:
Diffstat (limited to 'view')
-rw-r--r--view/css/full.css5
-rw-r--r--view/css/minimal.css3
-rw-r--r--view/css/mod_pdledit_gui.css3
-rw-r--r--view/pdl/mod_pdledit_gui.pdl1
-rw-r--r--view/php/default.php14
-rw-r--r--view/php/full.php15
-rw-r--r--view/php/minimal.php39
-rw-r--r--view/php/none.php9
-rw-r--r--view/php/zen.php16
-rw-r--r--view/theme/redbasic/js/redbasic.js15
-rw-r--r--view/tpl/pdledit_gui.tpl243
-rw-r--r--view/tpl/pdledit_gui_item.tpl18
-rw-r--r--view/tpl/pdledit_gui_templates.tpl11
13 files changed, 362 insertions, 30 deletions
diff --git a/view/css/full.css b/view/css/full.css
index 3f9a01d24..1a36c9b08 100644
--- a/view/css/full.css
+++ b/view/css/full.css
@@ -7,7 +7,6 @@ header #banner {
}
section {
- display: block;
- min-height: 112px;
- margin: 50px 10px;
+ height: 100vh;
+ padding: 4.5rem 7px 200px 7px;
}
diff --git a/view/css/minimal.css b/view/css/minimal.css
new file mode 100644
index 000000000..3bd04a5df
--- /dev/null
+++ b/view/css/minimal.css
@@ -0,0 +1,3 @@
+section {
+ height: 100vh;
+}
diff --git a/view/css/mod_pdledit_gui.css b/view/css/mod_pdledit_gui.css
new file mode 100644
index 000000000..dcda842dc
--- /dev/null
+++ b/view/css/mod_pdledit_gui.css
@@ -0,0 +1,3 @@
+.aside_wrapper {
+ min-height: 70vh;
+}
diff --git a/view/pdl/mod_pdledit_gui.pdl b/view/pdl/mod_pdledit_gui.pdl
new file mode 100644
index 000000000..7590b7fa0
--- /dev/null
+++ b/view/pdl/mod_pdledit_gui.pdl
@@ -0,0 +1 @@
+[template]none[/template]
diff --git a/view/php/default.php b/view/php/default.php
index 64d58a0c1..10e150906 100644
--- a/view/php/default.php
+++ b/view/php/default.php
@@ -1,3 +1,15 @@
+<?php
+/**
+ * * Name: default
+ * * Description: Hubzilla default 3-column layout
+ * * Version: 1
+ * * Author: Mario Vavti
+ * * Maintainer: Mario Vavti
+ * * ContentRegion: aside, left_aside_wrapper
+ * * ContentRegion: content, region_2
+ * * ContentRegion: right_aside, right_aside_wrapper
+ */
+?>
<!DOCTYPE html >
<html prefix="og: http://ogp.me/ns#">
<head>
@@ -8,7 +20,7 @@
<body <?php if($page['direction']) echo 'dir="rtl"' ?> >
<?php if(x($page,'banner')) echo $page['banner']; ?>
<header><?php if(x($page,'header')) echo $page['header']; ?></header>
- <?php if(x($page,'nav')) echo $page['nav']; ?></nav>
+ <?php if(x($page,'nav')) echo $page['nav']; ?>
<main>
<div class="content">
<div class="columns">
diff --git a/view/php/full.php b/view/php/full.php
index 1a9cd9a84..d855fb650 100644
--- a/view/php/full.php
+++ b/view/php/full.php
@@ -1,3 +1,13 @@
+<?php
+/**
+ * * Name: full
+ * * Description: A single column full width layout with the hubzilla navbar
+ * * Version: 1
+ * * Author: None
+ * * Maintainer: None
+ * * ContentRegion: content, region_1
+ */
+?>
<!DOCTYPE html >
<html prefix="og: http://ogp.me/ns#">
<head>
@@ -8,8 +18,9 @@
<body <?php if($page['direction']) echo 'dir="rtl"' ?> >
<?php if(x($page,'banner')) echo $page['banner']; ?>
<header><?php if(x($page,'header')) echo $page['header']; ?></header>
- <nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark"><?php if(x($page,'nav')) echo $page['nav']; ?></nav>
- <section id="region_2"><?php if(x($page,'content')) echo $page['content']; ?>
+ <?php if(x($page,'nav')) echo $page['nav']; ?>
+ <section id="region_1">
+ <?php if(x($page,'content')) echo $page['content']; ?>
<div id="page-footer"></div>
</section>
</body>
diff --git a/view/php/minimal.php b/view/php/minimal.php
index 3572f3b5c..3fab0c5f9 100644
--- a/view/php/minimal.php
+++ b/view/php/minimal.php
@@ -1,14 +1,25 @@
-<!DOCTYPE html >
-<html prefix="og: http://ogp.me/ns#">
-<head>
- <title><?php if(x($page,'title')) echo $page['title'] ?></title>
- <script>var baseurl="<?php echo z_root() ?>";</script>
- <?php if(x($page,'htmlhead')) echo $page['htmlhead'] ?>
-</head>
-<body>
- <section style="margin:0px!important; padding:0px!important; float:none!important;display:block!important;"><?php if(x($page,'content')) echo $page['content']; ?>
- <div id="page-footer"></div>
- </section>
-</body>
-</html>
-
+<?php
+/**
+ * * Name: full
+ * * Description: A single column full width layout without a navbar
+ * * Version: 1
+ * * Author: None
+ * * Maintainer: None
+ * * ContentRegion: content, region_1
+ */
+?>
+<!DOCTYPE html >
+<html prefix="og: http://ogp.me/ns#">
+<head>
+ <title><?php if(x($page,'title')) echo $page['title'] ?></title>
+ <script>var baseurl="<?php echo z_root() ?>";</script>
+ <?php if(x($page,'htmlhead')) echo $page['htmlhead'] ?>
+</head>
+<body>
+ <section id="region_1">
+ <?php if(x($page,'content')) echo $page['content']; ?>
+ <div id="page-footer"></div>
+ </section>
+</body>
+</html>
+
diff --git a/view/php/none.php b/view/php/none.php
index 51d0e83dc..5e92310b7 100644
--- a/view/php/none.php
+++ b/view/php/none.php
@@ -1 +1,10 @@
+<?php
+/**
+ * * Name: none
+ * * Description: A barebones empty single page template
+ * * Version: 1
+ * * Author: None
+ * * Maintainer: None
+ */
+?>
<?php if(x($page,'content')) echo $page['content']; ?>
diff --git a/view/php/zen.php b/view/php/zen.php
index a96cf722f..24aae951b 100644
--- a/view/php/zen.php
+++ b/view/php/zen.php
@@ -1,11 +1,11 @@
<!DOCTYPE html>
<html prefix="og: http://ogp.me/ns#">
-<head>
- <title><?php if(x($page,'title')) echo $page['title'] ?></title>
- <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1">
- <?php if(x($page,'htmlhead')) echo $page['htmlhead'] ?>
-</head>
-<body>
- <?php if(x($page,'content')) echo $page['content']; ?>
-</body>
+ <head>
+ <title><?php if(x($page,'title')) echo $page['title'] ?></title>
+ <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1">
+ <?php if(x($page,'htmlhead')) echo $page['htmlhead'] ?>
+ </head>
+ <body>
+ <?php if(x($page,'content')) echo $page['content']; ?>
+ </body>
</html>
diff --git a/view/theme/redbasic/js/redbasic.js b/view/theme/redbasic/js/redbasic.js
index c0c03d4f8..04469cb85 100644
--- a/view/theme/redbasic/js/redbasic.js
+++ b/view/theme/redbasic/js/redbasic.js
@@ -17,8 +17,13 @@ $(document).ready(function() {
}
$('#css3-calc').remove(); // Remove the test element
- stickyScroll('.aside_spacer_left', '.aside_spacer_top_left', '.content', parseFloat(window.getComputedStyle(document.querySelector('#region_1')).getPropertyValue('padding-top')), 0);
- stickyScroll('.aside_spacer_right', '.aside_spacer_top_right', '.content', parseFloat(window.getComputedStyle(document.querySelector('#region_3')).getPropertyValue('padding-top')), 20);
+ if (document.querySelector('#region_1')) {
+ stickyScroll('.aside_spacer_left', '.aside_spacer_top_left', '.content', parseFloat(window.getComputedStyle(document.querySelector('#region_1')).getPropertyValue('padding-top')), 0);
+ }
+
+ if (document.querySelector('#region_3')) {
+ stickyScroll('.aside_spacer_right', '.aside_spacer_top_right', '.content', parseFloat(window.getComputedStyle(document.querySelector('#region_3')).getPropertyValue('padding-top')), 20);
+ }
$('#expand-aside').on('click', function() {
if($('main').hasClass('region_1-on')){
@@ -121,8 +126,14 @@ function setStyle(element, cssProperty) {
}
function stickyScroll(sticky, stickyTop, container, topOffset, bottomOffset) {
+
var lastScrollTop = 0;
var sticky = document.querySelector(sticky);
+
+ if (!sticky) {
+ return;
+ }
+
var stickyHeight = sticky.getBoundingClientRect().height;
var stickyTop = document.querySelector(stickyTop);
var content = document.querySelector(container);
diff --git a/view/tpl/pdledit_gui.tpl b/view/tpl/pdledit_gui.tpl
new file mode 100644
index 000000000..8c4ca3e50
--- /dev/null
+++ b/view/tpl/pdledit_gui.tpl
@@ -0,0 +1,243 @@
+<div id="pdledit_gui_offcanvas" class="offcanvas offcanvas-lg offcanvas-bottom shadow border rounded-top start-50 translate-middle-x" tabindex="-1" data-bs-backdrop="false" data-bs-scroll="true" style="min-width: 300px">
+ <div id="pdledit_gui_offcanvas_body" class="offcanvas-body"></div>
+ <div class="offcanvas-header">
+ <div class="offcanvas-title h3"></div>
+ <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
+ </div>
+</div>
+
+<div id="pdledit_gui_offcanvas_edit" class="offcanvas offcanvas-lg offcanvas-bottom shadow border rounded-top start-50 translate-middle-x" tabindex="-1" data-bs-backdrop="false" data-bs-scroll="true" style="min-width: 300px">
+ <div id="pdledit_gui_offcanvas_edit_body" class="offcanvas-body">
+ <textarea id="pdledit_gui_offcanvas_edit_textarea" class="form-control font-monospace h-100"></textarea>
+ </div>
+ <div class="offcanvas-header">
+ <button id="pdledit_gui_offcanvas_edit_submit" type="button" class="btn btn-primary">Submit</button>
+ <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
+ </div>
+</div>
+
+<div id="pdledit_gui_offcanvas_submit" class="offcanvas offcanvas-lg offcanvas-bottom shadow border rounded-top start-50 translate-middle-x" tabindex="-1" data-bs-backdrop="false" data-bs-scroll="true" style="min-width: 300px">
+ <div id="pdledit_gui_offcanvas_submit_body" class="offcanvas-body"></div>
+ <div class="offcanvas-header">
+ <button id="pdledit_gui_offcanvas_submit_submit" type="button" class="btn btn-primary">Submit</button>
+ <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
+ </div>
+</div>
+
+<ul class="nav position-fixed bottom-0 start-50 bg-light translate-middle-x text-uppercase" style="min-width: 300px">
+ <li class="nav-item">
+ <a id="pdledit_gui_modules" class="nav-link" href="#">Modules</a>
+ </li>
+ <li class="nav-item">
+ <a id="pdledit_gui_templates" class="nav-link" href="#">Templates</a>
+ </li>
+ <li class="nav-item">
+ <a id="pdledit_gui_items" class="nav-link" href="#">Items</a>
+ </li>
+ <li class="nav-item">
+ <a id="pdledit_gui_src" class="nav-link" href="#">Source</a>
+ </li>
+ {{if $module_modified}}
+ <li class="nav-item">
+ <a id="pdledit_gui_reset" class="nav-link" href="#">Reset</a>
+ </li>
+ {{/if}}
+ <li class="nav-item">
+ <a id="pdledit_gui_save" class="nav-link" href="#">Apply</a>
+ </li>
+</ul>
+
+<script>
+ $(document).ready(function() {
+ let poi;
+ let regions = [];
+ let content_regions = [];
+ let page_src = atob('{{$page_src}}');
+
+ let offcanvas = new bootstrap.Offcanvas(document.getElementById('pdledit_gui_offcanvas'));
+ let edit_offcanvas = new bootstrap.Offcanvas(document.getElementById('pdledit_gui_offcanvas_edit'));
+ let submit_offcanvas = new bootstrap.Offcanvas(document.getElementById('pdledit_gui_offcanvas_submit'));
+
+ {{foreach $content_regions as $content_region}}
+ regions.push('{{$content_region.0}}');
+ content_regions.push('{{$content_region.1}}');
+
+ let sortable_{{$content_region.1}} = document.getElementById('{{$content_region.1}}');
+ new Sortable(sortable_{{$content_region.1}}, {
+ group: 'shared',
+ handle: '.pdledit_gui_item_handle',
+ animation: 150
+ });
+ {{/foreach}}
+
+ let sortable_items = document.getElementById('pdledit_gui_offcanvas_body');
+ new Sortable(sortable_items, {
+ group: {
+ name: 'shared',
+ pull: 'clone',
+ put: false
+ },
+ sort: false,
+ handle: '.pdledit_gui_item_handle',
+ animation: 150,
+ onEnd: function (e) {
+ $(e.item).find('button').removeClass('disabled');
+ }
+ });
+
+ $(document).on('click', '.pdledit_gui_item_src', function(e) {
+ poi = this.closest('.pdledit_gui_item');
+ let src = atob(poi.dataset.src);
+ $('#pdledit_gui_offcanvas_edit_textarea').val(src);
+ $('#pdledit_gui_offcanvas_edit_textarea').bbco_autocomplete('comanche');
+ edit_offcanvas.show();
+ });
+
+ $(document).on('click', '.pdledit_gui_item_remove', function(e) {
+ poi = this.closest('.pdledit_gui_item');
+ $(poi).remove();
+ });
+
+ $(document).on('click', '#pdledit_gui_offcanvas_edit_submit', function(e) {
+ let src = $('#pdledit_gui_offcanvas_edit_textarea').val();
+
+ if (poi) {
+ poi.dataset.src = btoa(src);
+ }
+ else {
+ $.post(
+ 'pdledit_gui',
+ {
+ 'save_src': 1,
+ 'module': '{{$module}}',
+ 'src': $('#pdledit_gui_offcanvas_edit_textarea').val()
+ }
+ )
+ .done(function(data) {
+ if (data.success) {
+ window.location.href = 'pdledit_gui/' + data.module;
+ }
+ });
+ }
+
+ edit_offcanvas.hide();
+ });
+
+ $(document).on('click', '#pdledit_gui_offcanvas_submit_submit', function(e) {
+ if ($('#pdledit_gui_templates_form').length) {
+ $.post(
+ 'pdledit_gui',
+ {
+ 'save_template': 1,
+ 'module': '{{$module}}',
+ 'data': $('#pdledit_gui_templates_form').serializeArray()
+ }
+ )
+ .done(function(data) {
+ if (data.success) {
+ window.location.href = 'pdledit_gui/' + data.module;
+ }
+ });
+ }
+
+ submit_offcanvas.hide();
+ });
+
+ $(document).on('click', '#pdledit_gui_src', function(e) {
+ e.preventDefault();
+ poi = null; // this is important!
+
+ let obj = {};
+
+ content_regions.forEach(function (content_region, i) {
+ let data_src = [];
+ $('#' + content_region + ' > .card').each(function () {
+ data_src.push(atob(this.dataset.src));
+ });
+ obj[regions[i]] = data_src;
+ });
+
+ for (let [region, entries] of Object.entries(obj)) {
+ let region_pdl = '';
+
+ entries.forEach(function (entry) {
+ region_pdl = region_pdl.concat(entry + "\r\n");
+ });
+
+ let regex_str = '\\[region=' + region + '\\](.*?)\\[\\/region\\]';
+ let replace_str = '[region=' + region + ']' + "\r\n" + region_pdl + "\r\n" + '[/region]'
+ let regex = new RegExp(regex_str, 'ism');
+
+ page_src = page_src.replace(regex, replace_str);
+ }
+
+ $('#pdledit_gui_offcanvas_edit_textarea').val(page_src);
+ $('#pdledit_gui_offcanvas_edit_textarea').bbco_autocomplete('comanche');
+ edit_offcanvas.show();
+ });
+
+ $(document).on('click', '#pdledit_gui_items', function(e) {
+ e.preventDefault();
+ $('#pdledit_gui_offcanvas_body').html(atob('{{$items}}'));
+ offcanvas.show();
+ });
+
+ $(document).on('click', '#pdledit_gui_templates', function(e) {
+ e.preventDefault();
+ $('#pdledit_gui_offcanvas_submit_body').html(atob('{{$templates}}'));
+
+ submit_offcanvas.show();
+ });
+
+ $(document).on('click', '#pdledit_gui_modules', function(e) {
+ e.preventDefault();
+ $('#pdledit_gui_offcanvas_body').html(atob('{{$modules}}'));
+ offcanvas.show();
+ });
+
+ $(document).on('click', '#pdledit_gui_save', function(e) {
+ e.preventDefault();
+
+ let obj = {};
+
+ content_regions.forEach(function (content_region, i) {
+ let data_src = [];
+ $('#' + content_region + ' > .card').each(function () {
+ data_src.push(this.dataset.src);
+ });
+ obj[regions[i]] = data_src;
+ });
+
+ $.post(
+ 'pdledit_gui',
+ {
+ 'save': 1,
+ 'module': '{{$module}}',
+ 'data': JSON.stringify(obj)
+ }
+ )
+ .done(function(data) {
+ if (data.success) {
+ window.location.href = 'pdledit_gui/' + data.module;
+ }
+ });
+ });
+
+ $(document).on('click', '#pdledit_gui_reset', function(e) {
+ e.preventDefault();
+ $.post(
+ 'pdledit_gui',
+ {
+ 'reset': 1,
+ 'module': '{{$module}}'
+ }
+ )
+ .done(function(data) {
+ if (data.success) {
+ window.location.href = 'pdledit_gui/' + data.module;
+ }
+ });
+ });
+
+ });
+</script>
diff --git a/view/tpl/pdledit_gui_item.tpl b/view/tpl/pdledit_gui_item.tpl
new file mode 100644
index 000000000..9d0095ed4
--- /dev/null
+++ b/view/tpl/pdledit_gui_item.tpl
@@ -0,0 +1,18 @@
+<div class="pdledit_gui_item card mb-3" data-src="{{$entry.src}}">
+ <div class="card-header d-flex justify-content-between">
+ <span class="text-uppercase">{{$entry.name}}</span>
+ <div class="badge rounded-pill{{if $entry.type === 'widget'}} bg-info text-dark{{/if}}{{if $entry.type === 'content'}} bg-primary{{/if}}{{if $entry.type === 'menu'}} bg-secondary{{/if}}{{if $entry.type === 'block'}} bg-warning text-dark{{/if}}">
+ {{$entry.type}}
+ </div>
+ </div>
+ <div class="card-body">
+ {{if $entry.desc}}
+ <div class="mb-3 text-muted">{{$entry.desc}}</div>
+ {{/if}}
+ {{if $entry.type !== 'content'}}
+ <button type="button" class="btn btn-sm btn-outline-primary pdledit_gui_item_src{{if $disable_controls}} disabled{{/if}}">Edit</button>
+ <button type="button" class="btn btn-sm btn-outline-danger pdledit_gui_item_remove{{if $disable_controls}} disabled{{/if}}">Remove</button>
+ <i class="fa fa-fw fa-arrows-alt m-2 float-end cursor-pointer pdledit_gui_item_handle"></i>
+ {{/if}}
+ </div>
+</div>
diff --git a/view/tpl/pdledit_gui_templates.tpl b/view/tpl/pdledit_gui_templates.tpl
new file mode 100644
index 000000000..0f3d8a7b6
--- /dev/null
+++ b/view/tpl/pdledit_gui_templates.tpl
@@ -0,0 +1,11 @@
+<form id="pdledit_gui_templates_form">
+ {{foreach $templates as $template}}
+ <div class="form-check mb-2">
+ <input class="form-check-input" type="radio" name="template" id="id_template_{{$template.name}}" value="{{$template.name}}" {{if $template.name == $active}} checked{{/if}}>
+ <label class="form-check-label" for="id_template_{{$template.name}}">
+ {{$template.name}}
+ </label>
+ <small class="text-muted">{{$template.desc}}</small>
+ </div>
+ {{/foreach}}
+</form>