sibu 0.9.3 → 1.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +81 -4
- data/app/assets/javascripts/sibu/sibu.js.erb +17 -3
- data/app/assets/javascripts/tabs/van11y-accessible-tab-panel-aria.js +122 -124
- data/app/assets/stylesheets/sibu/defaults.scss +76 -80
- data/app/assets/stylesheets/sibu/sibu.css +8 -0
- data/app/controllers/sibu/application_controller.rb +8 -0
- data/app/controllers/sibu/pages_controller.rb +11 -4
- data/app/controllers/sibu/sites_controller.rb +4 -0
- data/app/helpers/sibu/application_helper.rb +1 -1
- data/app/helpers/sibu/pages_helper.rb +104 -23
- data/app/models/sibu/page.rb +3 -3
- data/app/models/sibu/site.rb +15 -1
- data/app/models/sibu/site_template.rb +1 -1
- data/app/views/layouts/sibu/edit_content.html.erb +184 -125
- data/app/views/sibu/images/edit.js.erb +5 -3
- data/app/views/sibu/pages/_code_edit_panel.html.erb +3 -2
- data/app/views/sibu/pages/_form.html.erb +8 -0
- data/app/views/sibu/pages/_link_edit_panel.html.erb +6 -6
- data/app/views/sibu/pages/_map_edit_panel.html.erb +3 -2
- data/app/views/sibu/pages/_media_edit_panel.html.erb +6 -6
- data/app/views/sibu/pages/_new_section_panel.html.erb +1 -1
- data/app/views/sibu/pages/_paragraph_edit_panel.html.erb +2 -2
- data/app/views/sibu/pages/_text_edit_panel.html.erb +2 -2
- data/app/views/sibu/pages/child_element.js.erb +2 -2
- data/app/views/sibu/pages/clone_element.js.erb +2 -2
- data/app/views/sibu/pages/create_section.js.erb +1 -1
- data/app/views/sibu/pages/delete_element.js.erb +1 -1
- data/app/views/sibu/pages/delete_section.js.erb +1 -1
- data/app/views/sibu/pages/edit_element.js.erb +68 -66
- data/app/views/sibu/pages/edit_section.js.erb +6 -5
- data/app/views/sibu/pages/index.html.erb +2 -2
- data/app/views/sibu/pages/new_section.js.erb +22 -13
- data/app/views/sibu/pages/update_element.js.erb +2 -2
- data/app/views/sibu/pages/update_section.js.erb +3 -3
- data/config/initializers/constants.rb +5 -3
- data/db/migrate/20200401130601_add_ref_to_site_templates.rb +5 -0
- data/lib/sibu/engine.rb +0 -2
- data/lib/sibu/version.rb +1 -1
- metadata +3 -18
- data/app/views/sibu/pages/destroy.html.erb +0 -2
- data/app/views/sibu/pages/update.html.erb +0 -2
data/app/models/sibu/page.rb
CHANGED
@@ -30,12 +30,12 @@ module Sibu
|
|
30
30
|
save
|
31
31
|
end
|
32
32
|
|
33
|
-
def update_path
|
33
|
+
def update_path(force_update = false)
|
34
34
|
prefix = site.version == Sibu::Site::DEFAULT_VERSION ? '' : "#{site.version}/"
|
35
35
|
if is_home == 'true'
|
36
|
-
self.path =
|
36
|
+
self.path = prefix
|
37
37
|
else
|
38
|
-
self.path = "#{prefix}#{name.parameterize}" if self.path.blank?
|
38
|
+
self.path = "#{prefix}#{name.parameterize}" if self.path.blank? || force_update
|
39
39
|
end
|
40
40
|
end
|
41
41
|
|
data/app/models/sibu/site.rb
CHANGED
@@ -36,7 +36,7 @@ module Sibu
|
|
36
36
|
end
|
37
37
|
|
38
38
|
def section_template(section)
|
39
|
-
|
39
|
+
"#{site_template.path}/#{section["category"]}/#{section["template"]}"
|
40
40
|
end
|
41
41
|
|
42
42
|
def not_found
|
@@ -51,6 +51,13 @@ module Sibu
|
|
51
51
|
pages.where(id: page_id).select(:id, :path).first
|
52
52
|
end
|
53
53
|
|
54
|
+
def update_paths
|
55
|
+
pages.each do |p|
|
56
|
+
p.update_path(true)
|
57
|
+
p.save
|
58
|
+
end
|
59
|
+
end
|
60
|
+
|
54
61
|
def save_and_init
|
55
62
|
if valid?
|
56
63
|
self.sections = site_template.sections
|
@@ -69,6 +76,13 @@ module Sibu
|
|
69
76
|
Hash[pages.collect {|p| [p.id.to_s, p.path]}]
|
70
77
|
end
|
71
78
|
|
79
|
+
def update_paths
|
80
|
+
pages.each do |p|
|
81
|
+
p.update_path(true)
|
82
|
+
p.save
|
83
|
+
end
|
84
|
+
end
|
85
|
+
|
72
86
|
def init_pages(source)
|
73
87
|
site_data = Rails.application.config.sibu[:site_data][source]
|
74
88
|
site_data.pages.each do |p|
|
@@ -6,7 +6,7 @@ module Sibu
|
|
6
6
|
store :default_styles, accessors: [:primary_font, :secondary_font, :primary_color, :secondary_color], coder: JSON
|
7
7
|
|
8
8
|
def reference
|
9
|
-
name.parameterize.gsub('-', '_')
|
9
|
+
ref || name.parameterize.gsub('-', '_')
|
10
10
|
end
|
11
11
|
|
12
12
|
def available_sections(path_prefix = 'app/views/shared')
|
@@ -2,14 +2,13 @@
|
|
2
2
|
<html>
|
3
3
|
<head>
|
4
4
|
<title><%= conf[:title] %></title>
|
5
|
-
<%= stylesheet_link_tag 'sibu/sibu', media: 'all' %>
|
6
|
-
<%= stylesheet_link_tag "#{conf[:stylesheet]}-edit", media: 'all' %>
|
7
|
-
<%= javascript_include_tag 'sibu/sibu' %>
|
8
|
-
<%= javascript_include_tag "#{conf[:javascript]}-edit" %>
|
9
5
|
<% if @site %>
|
10
6
|
<%= stylesheet_link_tag (conf[:custom_styles] ? @site.style_url : @site.site_template.path), media: "all" %>
|
11
|
-
<%= javascript_include_tag
|
7
|
+
<%= javascript_include_tag @site.site_template.path %>
|
12
8
|
<% end %>
|
9
|
+
<%= stylesheet_link_tag 'sibu/sibu', media: 'all' %>
|
10
|
+
<%= stylesheet_link_tag "#{conf[:stylesheet]}-edit", media: 'all' %>
|
11
|
+
<%= javascript_include_tag "#{conf[:javascript]}-edit" %>
|
13
12
|
<%= csrf_meta_tags %>
|
14
13
|
<%= yield :styles %>
|
15
14
|
</head>
|
@@ -42,46 +41,50 @@
|
|
42
41
|
</div>
|
43
42
|
<% end %>
|
44
43
|
<% end %>
|
44
|
+
<%= javascript_include_tag 'sibu/sibu' %>
|
45
45
|
<script>
|
46
|
-
|
47
|
-
|
48
|
-
$(function () {
|
49
|
-
initOverlays();
|
46
|
+
document.addEventListener("DOMContentLoaded", function() {
|
47
|
+
initOverlays("<%= @edit_section || '' %>");
|
50
48
|
sibuCallback("editContent");
|
51
|
-
<% unless @edit_section.blank? %>
|
52
|
-
$("[data-sb-overlay='<%= @edit_section %>']").click();
|
53
|
-
<% end %>
|
54
49
|
});
|
55
50
|
|
56
51
|
function setEditMode(section, overlay, left, top, width, height) {
|
57
|
-
var editMode =
|
58
|
-
editMode.
|
59
|
-
editMode.
|
60
|
-
editMode.
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
52
|
+
var editMode = document.querySelector("#edit_mode_overlay");
|
53
|
+
editMode.querySelector(".overlay_top").style.height = top + "px";
|
54
|
+
editMode.querySelector(".overlay_bottom").style.top = top + height + "px";
|
55
|
+
var leftOverlay = editMode.querySelector(".overlay_left"), rightOverlay = editMode.querySelector(".overlay_right"),
|
56
|
+
editModeActions = editMode.querySelector(".edit_mode_actions");
|
57
|
+
leftOverlay.style.height = height + "px";
|
58
|
+
leftOverlay.style.width = left + "px";
|
59
|
+
leftOverlay.style.top = top + "px";
|
60
|
+
rightOverlay.style.height = height + "px";
|
61
|
+
rightOverlay.style.left = left + width + "px";
|
62
|
+
rightOverlay.style.top = top + "px";
|
63
|
+
editModeActions.style.top = (top <= 120 ? (top + height) : (top - 40 - 20)) + "px";
|
64
|
+
editModeActions.style.left = left + "px";
|
65
|
+
editModeActions.style.width = width + "px";
|
66
|
+
editMode.querySelector("#edit_section_msg").innerText = "Modifier la section";
|
67
|
+
editMode.style.display = "block";
|
68
|
+
if(section.getAttribute('data-sb-entity') === 'site') {
|
69
|
+
editMode.querySelector("#new_section_before").style.display = "none";
|
70
|
+
editMode.querySelector("#new_section_after").style.display = "none";
|
71
|
+
editMode.querySelector("#delete_section").style.display = "none";
|
69
72
|
} else {
|
70
|
-
editMode.
|
71
|
-
editMode.
|
72
|
-
editMode.
|
73
|
+
editMode.querySelector("#new_section_before").style.display = "block";
|
74
|
+
editMode.querySelector("#new_section_after").style.display = "block";
|
75
|
+
editMode.querySelector("#delete_section").style.display = "block";
|
73
76
|
}
|
74
|
-
|
75
|
-
section.
|
77
|
+
window.scrollTo(0, top);
|
78
|
+
section.classList.add('sb-editing');
|
76
79
|
initInnerOverlays(section);
|
77
|
-
|
80
|
+
document.querySelector("#edit_overlays").innerHTML = "";
|
78
81
|
}
|
79
82
|
|
80
83
|
function cancelEditMode() {
|
81
84
|
refreshAfterEdit(false);
|
82
|
-
|
85
|
+
document.querySelector("#edit_mode_overlay").style.display = "none";
|
83
86
|
cancelEdit();
|
84
|
-
|
87
|
+
document.querySelector(".sb-editing").classList.remove("sb-editing");
|
85
88
|
initOverlays();
|
86
89
|
if(typeof editCancelledCallback === "function") {
|
87
90
|
editCancelledCallback();
|
@@ -89,110 +92,109 @@
|
|
89
92
|
}
|
90
93
|
|
91
94
|
function newSection(isAfter) {
|
92
|
-
var section =
|
93
|
-
var sectionsPanel =
|
94
|
-
sectionsPanel.
|
95
|
+
var section = document.querySelector(".sb-editing");
|
96
|
+
var sectionsPanel = document.querySelector("#sections_panel");
|
97
|
+
sectionsPanel.innerHTML =
|
95
98
|
'<div class="sibu_panel sibu_view"><h2>Choix du type de section</h2></div>' +
|
96
99
|
'<div><div class="sibu_sections sibu_site_content" style="text-align: center;">Chargement en cours...</div></div>' +
|
97
|
-
'<div class="sibu_panel sibu_view"><div class="sibu_actions"><a href="#" onclick="cancelSectionsEdit(); return false;">Annuler</a></div></div>'
|
98
|
-
);
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
entity: section.data("sb-entity"),
|
100
|
+
'<div class="sibu_panel sibu_view"><div class="sibu_actions"><a href="#" onclick="cancelSectionsEdit(); return false;">Annuler</a></div></div>';
|
101
|
+
sectionsPanel.classList.add("active");
|
102
|
+
sendXmlHttpRequest(
|
103
|
+
"GET",
|
104
|
+
"<%= new_section_site_page_path(@site.id, @page.id) %>",
|
105
|
+
{
|
106
|
+
section_id: section.getAttribute("data-sb-id"),
|
107
|
+
entity: section.getAttribute("data-sb-entity"),
|
106
108
|
after: isAfter
|
107
109
|
}
|
108
|
-
|
110
|
+
);
|
109
111
|
}
|
110
112
|
|
111
113
|
function editSection() {
|
112
|
-
var section =
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
section_id: section.
|
118
|
-
entity: section.
|
114
|
+
var section = document.querySelector(".sb-editing");
|
115
|
+
sendXmlHttpRequest(
|
116
|
+
"GET",
|
117
|
+
"<%= edit_section_site_page_path(@site.id, @page.id) %>",
|
118
|
+
{
|
119
|
+
section_id: section.getAttribute("data-sb-id"),
|
120
|
+
entity: section.getAttribute("data-sb-entity")
|
119
121
|
}
|
120
|
-
|
122
|
+
);
|
121
123
|
}
|
122
124
|
|
123
125
|
function deleteSection() {
|
124
126
|
if (window.confirm("Supprimer la section ?")) {
|
125
|
-
var section =
|
126
|
-
|
127
|
-
|
128
|
-
|
129
|
-
|
130
|
-
section_id: section.
|
131
|
-
entity: section.
|
127
|
+
var section = document.querySelector(".sb-editing");
|
128
|
+
sendXmlHttpRequest(
|
129
|
+
"DELETE",
|
130
|
+
"<%= delete_section_site_page_path(@site.id, @page.id) %>",
|
131
|
+
{
|
132
|
+
section_id: section.getAttribute("data-sb-id"),
|
133
|
+
entity: section.getAttribute("data-sb-entity")
|
132
134
|
}
|
133
|
-
|
135
|
+
);
|
134
136
|
}
|
135
137
|
}
|
136
138
|
|
137
139
|
function cloneElement(entity, sectionId, elementId) {
|
138
140
|
if (window.confirm("Dupliquer l'élément ?")) {
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
141
|
+
sendXmlHttpRequest(
|
142
|
+
"POST",
|
143
|
+
"<%= clone_element_site_page_path(@site.id, @page.id) %>",
|
144
|
+
{
|
143
145
|
section_id: sectionId,
|
144
146
|
element_id: elementId,
|
145
147
|
entity: entity
|
146
148
|
}
|
147
|
-
|
149
|
+
);
|
148
150
|
}
|
149
151
|
}
|
150
152
|
|
151
153
|
function deleteElement(entity, sectionId, elementId) {
|
152
154
|
if (window.confirm("Supprimer l'élément ?")) {
|
153
|
-
|
154
|
-
|
155
|
-
|
156
|
-
|
155
|
+
sendXmlHttpRequest(
|
156
|
+
"DELETE",
|
157
|
+
"<%= delete_element_site_page_path(@site.id, @page.id) %>",
|
158
|
+
{
|
157
159
|
section_id: sectionId,
|
158
160
|
element_id: elementId,
|
159
161
|
entity: entity
|
160
162
|
}
|
161
|
-
|
163
|
+
);
|
162
164
|
}
|
163
165
|
}
|
164
166
|
|
165
167
|
function addChildElement(entity, sectionId, elementId) {
|
166
168
|
if (window.confirm("Ajouter un sous-menu ?")) {
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
169
|
+
sendXmlHttpRequest(
|
170
|
+
"POST",
|
171
|
+
"<%= child_element_site_page_path(@site.id, @page.id) %>",
|
172
|
+
{
|
171
173
|
section_id: sectionId,
|
172
174
|
element_id: elementId,
|
173
175
|
entity: entity
|
174
176
|
}
|
175
|
-
|
177
|
+
);
|
176
178
|
}
|
177
179
|
}
|
178
180
|
|
179
181
|
function cancelEdit() {
|
180
|
-
|
181
|
-
|
182
|
+
document.querySelector("#edit_panel").classList.remove("active");
|
183
|
+
document.querySelector("#edit_panel").innerHTML = "";
|
182
184
|
document.body.style.overflow = "initial";
|
183
185
|
}
|
184
186
|
|
185
187
|
function cancelSectionsEdit() {
|
186
|
-
|
187
|
-
|
188
|
+
document.querySelector("#edit_panel").classList.remove("active");
|
189
|
+
document.querySelector("#sections_panel").innerHTML = "";
|
188
190
|
document.body.style.overflow = "initial";
|
189
191
|
}
|
190
192
|
|
191
193
|
function editContent(eltId, sectionId, entity, repeat, contentType, size, children) {
|
192
|
-
|
193
|
-
|
194
|
-
|
195
|
-
|
194
|
+
sendXmlHttpRequest(
|
195
|
+
"GET",
|
196
|
+
"<%= edit_element_site_page_path(@site.id, @page.id, format: :js) %>",
|
197
|
+
{
|
196
198
|
element_id: eltId,
|
197
199
|
section_id: sectionId,
|
198
200
|
entity: entity,
|
@@ -201,60 +203,117 @@
|
|
201
203
|
size: size,
|
202
204
|
children: children
|
203
205
|
}
|
204
|
-
|
206
|
+
);
|
205
207
|
}
|
206
208
|
|
207
209
|
function initInnerOverlays(section) {
|
208
|
-
var editables = section.
|
209
|
-
editables.
|
210
|
-
|
211
|
-
|
212
|
-
|
213
|
-
|
214
|
-
|
215
|
-
|
216
|
-
|
217
|
-
|
218
|
-
|
219
|
-
|
220
|
-
|
221
|
-
|
222
|
-
|
223
|
-
|
210
|
+
var editables = section.querySelectorAll("[data-type]");
|
211
|
+
for (var i = 0; i < editables.length; i++) {
|
212
|
+
if (editables[i].getAttribute("data-type") !== 'group' || editables[i].getAttribute("data-repeat") === 'true' || editables[i].getAttribute("data-children") === 'true') {
|
213
|
+
editables[i].addEventListener("mouseenter", function(evt) {
|
214
|
+
evt.stopPropagation();
|
215
|
+
evt.currentTarget.classList.add("sb-editable");
|
216
|
+
});
|
217
|
+
editables[i].addEventListener("mouseleave", function(evt) {
|
218
|
+
evt.currentTarget.classList.remove("sb-editable");
|
219
|
+
});
|
220
|
+
editables[i].addEventListener("click", function(evt) {
|
221
|
+
evt.stopPropagation();
|
222
|
+
evt.preventDefault();
|
223
|
+
var elt = evt.currentTarget, eltId = elt.getAttribute("data-id"), repeat = elt.getAttribute("data-repeat"),
|
224
|
+
type = elt.getAttribute("data-type"), size = elt.getAttribute("data-size"), children = elt.getAttribute("data-children");
|
225
|
+
var sectionId = section.getAttribute("data-sb-id"), entity = section.getAttribute("data-sb-entity");
|
226
|
+
editContent(eltId, sectionId, entity, repeat, type, size, children);
|
227
|
+
});
|
228
|
+
}
|
229
|
+
}
|
224
230
|
}
|
225
231
|
|
226
|
-
function initOverlays() {
|
227
|
-
|
228
|
-
|
229
|
-
|
230
|
-
|
231
|
-
|
232
|
-
|
233
|
-
|
234
|
-
|
235
|
-
|
236
|
-
|
237
|
-
|
238
|
-
|
239
|
-
|
240
|
-
|
241
|
-
|
242
|
-
|
243
|
-
|
244
|
-
|
245
|
-
|
232
|
+
function initOverlays(activeSection = "") {
|
233
|
+
setTimeout(function() {
|
234
|
+
var container = document.querySelector("#edit_overlays"), sections = document.querySelectorAll("[data-sb-id]");
|
235
|
+
container.innerHTML = "";
|
236
|
+
|
237
|
+
for (var i = 0; i < sections.length; i++) {
|
238
|
+
var sectionBox = sections[i].getBoundingClientRect();
|
239
|
+
var yOffset = sectionBox.top - document.querySelector(".sibu_content_panel").getBoundingClientRect().top;
|
240
|
+
var width = sections[i].offsetWidth, height = (sections[i].offsetHeight === 0 ? childrenHeight(sections[i]) : sections[i].offsetHeight);
|
241
|
+
var overlay = document.createElement("div");
|
242
|
+
overlay.setAttribute("data-sb-overlay", sections[i].getAttribute("data-sb-id"));
|
243
|
+
overlay.innerHTML = "Modifier";
|
244
|
+
container.appendChild(overlay);
|
245
|
+
overlay.style.top = yOffset + "px";
|
246
|
+
overlay.style.left = sectionBox.left + "px";
|
247
|
+
overlay.style.width = width + "px";
|
248
|
+
overlay.style.height = height + "px";
|
249
|
+
overlay.addEventListener("click", (function(section, offsetLeft, offsetTop, editWidth, editHeight) {
|
250
|
+
return function(evt) {
|
251
|
+
setEditMode(section, evt.currentTarget, offsetLeft, offsetTop, editWidth, editHeight);
|
252
|
+
};
|
253
|
+
})(sections[i], sectionBox.left, yOffset, width, height));
|
254
|
+
}
|
255
|
+
if (activeSection) {
|
256
|
+
document.querySelector("[data-sb-overlay='" + activeSection + "']").click();
|
257
|
+
}
|
258
|
+
}, 800);
|
246
259
|
}
|
247
260
|
|
248
261
|
function childrenHeight(parentElt) {
|
249
|
-
var height = 0;
|
250
|
-
|
251
|
-
var childHeight =
|
262
|
+
var height = 0, children = parentElt.querySelectorAll("*");
|
263
|
+
for (var i = 0; i < children.length; i++) {
|
264
|
+
var childHeight = children[i].clientHeight;
|
252
265
|
if(childHeight > height) {
|
253
266
|
height = childHeight;
|
254
267
|
}
|
255
|
-
}
|
268
|
+
}
|
256
269
|
return height;
|
257
270
|
}
|
271
|
+
|
272
|
+
function submitForm(formElt, callback) {
|
273
|
+
sendXmlHttpRequest(formElt.getAttribute("method").toUpperCase(), formElt.getAttribute("action"),
|
274
|
+
new FormData(formElt))
|
275
|
+
}
|
276
|
+
|
277
|
+
function sendXmlHttpRequest(method, url, data, callback) {
|
278
|
+
var req = new XMLHttpRequest(), param;
|
279
|
+
if (callback) {
|
280
|
+
req.onload = callback;
|
281
|
+
} else {
|
282
|
+
req.onload = function() {
|
283
|
+
eval(req.responseText);
|
284
|
+
}
|
285
|
+
}
|
286
|
+
|
287
|
+
if (method === 'GET') {
|
288
|
+
var params = [];
|
289
|
+
for(param in data ) {
|
290
|
+
if (data.hasOwnProperty(param)) {
|
291
|
+
params.push(encodeURIComponent(param) + '=' + encodeURIComponent(data[param] || ""));
|
292
|
+
}
|
293
|
+
}
|
294
|
+
req.open(method, url + '?' + params.join('&').replace(/%20/g, '+'));
|
295
|
+
req.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
|
296
|
+
req.send();
|
297
|
+
} else {
|
298
|
+
if (data instanceof FormData) {
|
299
|
+
formData = data;
|
300
|
+
} else {
|
301
|
+
var formData = new FormData();
|
302
|
+
for (var key in data) {
|
303
|
+
if (data.hasOwnProperty(key)) {
|
304
|
+
formData.append(key, data[key]);
|
305
|
+
}
|
306
|
+
}
|
307
|
+
}
|
308
|
+
|
309
|
+
req.open(method, url);
|
310
|
+
req.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
|
311
|
+
var token = document.getElementsByName("csrf-token")[0].content;
|
312
|
+
req.setRequestHeader('X-CSRF-Token', token);
|
313
|
+
|
314
|
+
req.send(formData);
|
315
|
+
}
|
316
|
+
}
|
258
317
|
</script>
|
259
318
|
<%= yield :site_scripts %>
|
260
319
|
<%= yield :page_scripts %>
|