Fossil SCM

pixchr layout changes requested at [https://pikchr.org/home/forumpost/504f54f61b]. See the comments about alt/ctrl/meta keys.

stephan 2020-09-18 01:21 trunk
Commit cd22f0f07d452bcc542bc949eb5f28f1f65ec4caf690758b7e570672ac6ca5e0
Parent 82a0b517a78e44c…
2 files changed +16 -11 +4 -1
~ src/fossil.pikchr.js ~ src/pikchrshow.c
M src/fossil.pikchr.js
+16 -11
--- src/fossil.pikchr.js
+++ src/fossil.pikchr.js
@@ -36,26 +36,29 @@
3636
 already dealt with.
3737
3838
 This code expects the following structure around the SVGs, and
3939
 will not process any which don't match this:
4040
41
- <DIV><SVG.pikchr></SVG><PRE.pikchr-src></PRE></DIV>
41
+ <DIV>
42
+ <DIV><SVG.pikchr></SVG></DIV>
43
+ <PRE.pikchr-src></PRE>
44
+ </DIV>
4245
 */
4346
 P.addSrcView = function f(svg){
4447
 if(!f.hasOwnProperty('parentClick')){
4548
 f.parentClick = function(ev){
46
- if(ev.ctrlKey || this.classList.contains('toggle')){
49
+ if(ev.altKey || ev.metaKey || ev.ctrlKey
50
+ /* Every combination of special key (alt, shift, ctrl,
51
+ meta) is handled differently everywhere. Shift is used
52
+ by the browser, Ctrl doesn't work on an iMac, and Alt is
53
+ intercepted by most Linux window managers to control
54
+ window movement! So... we just listen for *any* of them
55
+ (except Shift) and the user will need to find one which
56
+ works on on their environment. */
57
+ || this.classList.contains('toggle')){
4758
 this._childs.forEach((e)=>e.classList.toggle('hidden'));
4859
 }
49
- /* For the sake of small pics, we have to eliminate the
50
- parent element's max-width... */
51
- const src = this._childs[1];
52
- if(src.classList.contains('hidden')){
53
- this.style.maxWidth = this.dataset.origMaxWidth;
54
- }else{
55
- this.style.maxWidth = "unset";
56
- }
5760
 };
5861
 };
5962
 if(!svg) svg = 'svg.pikchr';
6063
 if('string' === typeof svg){
6164
 document.querySelectorAll(svg).forEach((e)=>f.call(this, e));
@@ -67,21 +70,23 @@
6770
 if(svg.dataset.pikchrProcessed){
6871
 return this;
6972
 }
7073
 svg.dataset.pikchrProcessed = 1;
7174
 const parent = svg.parentNode;
72
- const srcView = svg.nextElementSibling;
75
+ const srcView = parent.nextElementSibling;
7376
 if(!srcView || !srcView.classList.contains('pikchr-src')){
7477
 /* Without this element, there's nothing for us to do here. */
7578
 return this;
7679
 }
7780
 parent.dataset.origMaxWidth = parent.style.maxWidth;
7881
 parent._childs = [svg, srcView];
7982
 D.addClass(srcView, 'hidden');
8083
 D.removeClass(svg, 'hidden');
8184
 parent.addEventListener('click', f.parentClick, false);
85
+ /* When the parent is hidden, it has 0 height so cannot be clicked, so... */
86
+ srcView.addEventListener('click', (ev)=>f.parentClick.call(parent, ev), false);
8287
 if(parent.classList.contains('source')){
8388
 /* Start off in source-view mode via a very fake click event */
8489
 f.parentClick.call(parent, {ctrlKey:true});
8590
 }
8691
 };
8792
 })(window.fossil);
8893
--- src/fossil.pikchr.js
+++ src/fossil.pikchr.js
@@ -36,26 +36,29 @@
36 already dealt with.
37
38 This code expects the following structure around the SVGs, and
39 will not process any which don't match this:
40
41 <DIV><SVG.pikchr></SVG><PRE.pikchr-src></PRE></DIV>
 
 
 
42 */
43 P.addSrcView = function f(svg){
44 if(!f.hasOwnProperty('parentClick')){
45 f.parentClick = function(ev){
46 if(ev.ctrlKey || this.classList.contains('toggle')){
 
 
 
 
 
 
 
 
47 this._childs.forEach((e)=>e.classList.toggle('hidden'));
48 }
49 /* For the sake of small pics, we have to eliminate the
50 parent element's max-width... */
51 const src = this._childs[1];
52 if(src.classList.contains('hidden')){
53 this.style.maxWidth = this.dataset.origMaxWidth;
54 }else{
55 this.style.maxWidth = "unset";
56 }
57 };
58 };
59 if(!svg) svg = 'svg.pikchr';
60 if('string' === typeof svg){
61 document.querySelectorAll(svg).forEach((e)=>f.call(this, e));
@@ -67,21 +70,23 @@
67 if(svg.dataset.pikchrProcessed){
68 return this;
69 }
70 svg.dataset.pikchrProcessed = 1;
71 const parent = svg.parentNode;
72 const srcView = svg.nextElementSibling;
73 if(!srcView || !srcView.classList.contains('pikchr-src')){
74 /* Without this element, there's nothing for us to do here. */
75 return this;
76 }
77 parent.dataset.origMaxWidth = parent.style.maxWidth;
78 parent._childs = [svg, srcView];
79 D.addClass(srcView, 'hidden');
80 D.removeClass(svg, 'hidden');
81 parent.addEventListener('click', f.parentClick, false);
 
 
82 if(parent.classList.contains('source')){
83 /* Start off in source-view mode via a very fake click event */
84 f.parentClick.call(parent, {ctrlKey:true});
85 }
86 };
87 })(window.fossil);
88
--- src/fossil.pikchr.js
+++ src/fossil.pikchr.js
@@ -36,26 +36,29 @@
36 already dealt with.
37
38 This code expects the following structure around the SVGs, and
39 will not process any which don't match this:
40
41 <DIV>
42 <DIV><SVG.pikchr></SVG></DIV>
43 <PRE.pikchr-src></PRE>
44 </DIV>
45 */
46 P.addSrcView = function f(svg){
47 if(!f.hasOwnProperty('parentClick')){
48 f.parentClick = function(ev){
49 if(ev.altKey || ev.metaKey || ev.ctrlKey
50 /* Every combination of special key (alt, shift, ctrl,
51 meta) is handled differently everywhere. Shift is used
52 by the browser, Ctrl doesn't work on an iMac, and Alt is
53 intercepted by most Linux window managers to control
54 window movement! So... we just listen for *any* of them
55 (except Shift) and the user will need to find one which
56 works on on their environment. */
57 || this.classList.contains('toggle')){
58 this._childs.forEach((e)=>e.classList.toggle('hidden'));
59 }
 
 
 
 
 
 
 
 
60 };
61 };
62 if(!svg) svg = 'svg.pikchr';
63 if('string' === typeof svg){
64 document.querySelectorAll(svg).forEach((e)=>f.call(this, e));
@@ -67,21 +70,23 @@
70 if(svg.dataset.pikchrProcessed){
71 return this;
72 }
73 svg.dataset.pikchrProcessed = 1;
74 const parent = svg.parentNode;
75 const srcView = parent.nextElementSibling;
76 if(!srcView || !srcView.classList.contains('pikchr-src')){
77 /* Without this element, there's nothing for us to do here. */
78 return this;
79 }
80 parent.dataset.origMaxWidth = parent.style.maxWidth;
81 parent._childs = [svg, srcView];
82 D.addClass(srcView, 'hidden');
83 D.removeClass(svg, 'hidden');
84 parent.addEventListener('click', f.parentClick, false);
85 /* When the parent is hidden, it has 0 height so cannot be clicked, so... */
86 srcView.addEventListener('click', (ev)=>f.parentClick.call(parent, ev), false);
87 if(parent.classList.contains('source')){
88 /* Start off in source-view mode via a very fake click event */
89 f.parentClick.call(parent, {ctrlKey:true});
90 }
91 };
92 })(window.fossil);
93
M src/pikchrshow.c
+4 -1
--- src/pikchrshow.c
+++ src/pikchrshow.c
@@ -178,17 +178,20 @@
178178
 zClassToggle = " toggle";
179179
 }
180180
 if(PIKCHR_PROCESS_DIV_SOURCE & pikFlags){
181181
 zClassSource = " source";
182182
 }
183
- blob_appendf(pOut,"<div class=\"pikchr-svg%s%s\" "
183
+ blob_appendf(pOut,"<div><div class=\"pikchr-svg%s%s\" "
184184
 "style=\"%b\">\n",
185185
 zClassToggle/*safe-for-%s*/,
186186
 zClassSource/*safe-for-%s*/, &css);
187187
 blob_reset(&css);
188188
 }
189189
 blob_append(pOut, zOut, -1);
190
+ if(PIKCHR_PROCESS_DIV & pikFlags){
191
+ blob_append(pOut, "</div>\n", 7);
192
+ }
190193
 if((PIKCHR_PROCESS_SRC & pikFlags)
191194
 || (PIKCHR_PROCESS_SRC_HIDDEN & pikFlags)){
192195
 blob_appendf(pOut, "<pre class='pikchr-src%s'>"
193196
 "%h</pre>\n",
194197
 (PIKCHR_PROCESS_SRC_HIDDEN & pikFlags)
195198
--- src/pikchrshow.c
+++ src/pikchrshow.c
@@ -178,17 +178,20 @@
178 zClassToggle = " toggle";
179 }
180 if(PIKCHR_PROCESS_DIV_SOURCE & pikFlags){
181 zClassSource = " source";
182 }
183 blob_appendf(pOut,"<div class=\"pikchr-svg%s%s\" "
184 "style=\"%b\">\n",
185 zClassToggle/*safe-for-%s*/,
186 zClassSource/*safe-for-%s*/, &css);
187 blob_reset(&css);
188 }
189 blob_append(pOut, zOut, -1);
 
 
 
190 if((PIKCHR_PROCESS_SRC & pikFlags)
191 || (PIKCHR_PROCESS_SRC_HIDDEN & pikFlags)){
192 blob_appendf(pOut, "<pre class='pikchr-src%s'>"
193 "%h</pre>\n",
194 (PIKCHR_PROCESS_SRC_HIDDEN & pikFlags)
195
--- src/pikchrshow.c
+++ src/pikchrshow.c
@@ -178,17 +178,20 @@
178 zClassToggle = " toggle";
179 }
180 if(PIKCHR_PROCESS_DIV_SOURCE & pikFlags){
181 zClassSource = " source";
182 }
183 blob_appendf(pOut,"<div><div class=\"pikchr-svg%s%s\" "
184 "style=\"%b\">\n",
185 zClassToggle/*safe-for-%s*/,
186 zClassSource/*safe-for-%s*/, &css);
187 blob_reset(&css);
188 }
189 blob_append(pOut, zOut, -1);
190 if(PIKCHR_PROCESS_DIV & pikFlags){
191 blob_append(pOut, "</div>\n", 7);
192 }
193 if((PIKCHR_PROCESS_SRC & pikFlags)
194 || (PIKCHR_PROCESS_SRC_HIDDEN & pikFlags)){
195 blob_appendf(pOut, "<pre class='pikchr-src%s'>"
196 "%h</pre>\n",
197 (PIKCHR_PROCESS_SRC_HIDDEN & pikFlags)
198

Keyboard Shortcuts

Open search /
Next entry (timeline) j
Previous entry (timeline) k
Open focused entry Enter
Show this help ?
Toggle theme Top nav button