Fossil

Check-in [cd22f0f0]
Login

Check-in [cd22f0f0]

Many hyperlinks are disabled.
Use anonymous login to enable hyperlinks.

Overview
Comment:pixchr layout changes requested at https://pikchr.org/home/forumpost/504f54f61b. See the comments about alt/ctrl/meta keys.
Downloads: Tarball | ZIP archive | SQL archive
Timelines: family | ancestors | descendants | both | trunk
Files: files | file ages | folders
SHA3-256: cd22f0f07d452bcc542bc949eb5f28f1f65ec4caf690758b7e570672ac6ca5e0
User & Date: stephan 2020-09-18 01:21:09
Context
2020-09-18
02:54
Always include a \n after the opening safe_html() nonce when generating Pikchr output, for improved human readability of the generated HTML. ... (check-in: 39b2081e user: drh tags: trunk)
01:21
pixchr layout changes requested at https://pikchr.org/home/forumpost/504f54f61b. See the comments about alt/ctrl/meta keys. ... (check-in: cd22f0f0 user: stephan tags: trunk)
2020-09-17
23:44
pikchr command doc updates. ... (check-in: 82a0b517 user: stephan tags: trunk)
Changes
Hide Diffs Unified Diffs Ignore Whitespace Patch

Changes to src/fossil.pikchr.js.

︙︙
34
35
36
37
38
39
40

41


42
43
44
45








46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81


82
83
84
85
86
87

     it is passed to this function multiple times. Each processed
     element gets a "data" attribute set to it to indicate that it was
     already dealt with.

     This code expects the following structure around the SVGs, and
     will not process any which don't match this:


     <DIV><SVG.pikchr></SVG><PRE.pikchr-src></PRE></DIV>


  */
  P.addSrcView = function f(svg){
    if(!f.hasOwnProperty('parentClick')){
      f.parentClick = function(ev){








        if(ev.ctrlKey || this.classList.contains('toggle')){
          this._childs.forEach((e)=>e.classList.toggle('hidden'));
        }
        /* For the sake of small pics, we have to eliminate the
           parent element's max-width... */
        const src = this._childs[1];
        if(src.classList.contains('hidden')){
          this.style.maxWidth = this.dataset.origMaxWidth;
        }else{
          this.style.maxWidth = "unset";
        }
      };
    };
    if(!svg) svg = 'svg.pikchr';
    if('string' === typeof svg){
      document.querySelectorAll(svg).forEach((e)=>f.call(this, e));
      return this;
    }else if(svg.forEach){
      svg.forEach((e)=>f.call(this, e));
      return this;
    }
    if(svg.dataset.pikchrProcessed){
      return this;
    }
    svg.dataset.pikchrProcessed = 1;
    const parent = svg.parentNode;
    const srcView = svg.nextElementSibling;
    if(!srcView || !srcView.classList.contains('pikchr-src')){
      /* Without this element, there's nothing for us to do here. */
      return this;
    }
    parent.dataset.origMaxWidth = parent.style.maxWidth;
    parent._childs = [svg, srcView];
    D.addClass(srcView, 'hidden');
    D.removeClass(svg, 'hidden');
    parent.addEventListener('click', f.parentClick, false);


    if(parent.classList.contains('source')){
      /* Start off in source-view mode via a very fake click event */
      f.parentClick.call(parent, {ctrlKey:true});
    }
  };
})(window.fossil);








>
|
>
>




>
>
>
>
>
>
>
>
|


<
<
<
<
<
<
<
<















|









>
>







34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59








60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92

     it is passed to this function multiple times. Each processed
     element gets a "data" attribute set to it to indicate that it was
     already dealt with.

     This code expects the following structure around the SVGs, and
     will not process any which don't match this:

     <DIV>
       <DIV><SVG.pikchr></SVG></DIV>
       <PRE.pikchr-src></PRE>
     </DIV>
  */
  P.addSrcView = function f(svg){
    if(!f.hasOwnProperty('parentClick')){
      f.parentClick = function(ev){
        if(ev.altKey || ev.metaKey || ev.ctrlKey
           /* Every combination of special key (alt, shift, ctrl,
              meta) is handled differently everywhere. Shift is used
              by the browser, Ctrl doesn't work on an iMac, and Alt is
              intercepted by most Linux window managers to control
              window movement! So...  we just listen for *any* of them
              (except Shift) and the user will need to find one which
              works on on their environment. */
           || this.classList.contains('toggle')){
          this._childs.forEach((e)=>e.classList.toggle('hidden'));
        }








      };
    };
    if(!svg) svg = 'svg.pikchr';
    if('string' === typeof svg){
      document.querySelectorAll(svg).forEach((e)=>f.call(this, e));
      return this;
    }else if(svg.forEach){
      svg.forEach((e)=>f.call(this, e));
      return this;
    }
    if(svg.dataset.pikchrProcessed){
      return this;
    }
    svg.dataset.pikchrProcessed = 1;
    const parent = svg.parentNode;
    const srcView = parent.nextElementSibling;
    if(!srcView || !srcView.classList.contains('pikchr-src')){
      /* Without this element, there's nothing for us to do here. */
      return this;
    }
    parent.dataset.origMaxWidth = parent.style.maxWidth;
    parent._childs = [svg, srcView];
    D.addClass(srcView, 'hidden');
    D.removeClass(svg, 'hidden');
    parent.addEventListener('click', f.parentClick, false);
    /* When the parent is hidden, it has 0 height so cannot be clicked, so... */
    srcView.addEventListener('click', (ev)=>f.parentClick.call(parent, ev), false);
    if(parent.classList.contains('source')){
      /* Start off in source-view mode via a very fake click event */
      f.parentClick.call(parent, {ctrlKey:true});
    }
  };
})(window.fossil);

Changes to src/pikchrshow.c.

︙︙
176
177
178
179
180
181
182
183
184
185
186
187
188
189



190
191
192
193
194
195
196

          }
          if(PIKCHR_PROCESS_DIV_TOGGLE & pikFlags){
            zClassToggle = " toggle";
          }
          if(PIKCHR_PROCESS_DIV_SOURCE & pikFlags){
            zClassSource = " source";
          }
          blob_appendf(pOut,"<div class=\"pikchr-svg%s%s\" "
                       "style=\"%b\">\n",
                       zClassToggle/*safe-for-%s*/,
                       zClassSource/*safe-for-%s*/, &css);
          blob_reset(&css);
        }
        blob_append(pOut, zOut, -1);



        if((PIKCHR_PROCESS_SRC & pikFlags)
           || (PIKCHR_PROCESS_SRC_HIDDEN & pikFlags)){
          blob_appendf(pOut, "<pre class='pikchr-src%s'>"
                       "%h</pre>\n",
                       (PIKCHR_PROCESS_SRC_HIDDEN & pikFlags)
                       ? " hidden" : "",
                       blob_str(&bIn));








|






>
>
>








176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199

          }
          if(PIKCHR_PROCESS_DIV_TOGGLE & pikFlags){
            zClassToggle = " toggle";
          }
          if(PIKCHR_PROCESS_DIV_SOURCE & pikFlags){
            zClassSource = " source";
          }
          blob_appendf(pOut,"<div><div class=\"pikchr-svg%s%s\" "
                       "style=\"%b\">\n",
                       zClassToggle/*safe-for-%s*/,
                       zClassSource/*safe-for-%s*/, &css);
          blob_reset(&css);
        }
        blob_append(pOut, zOut, -1);
        if(PIKCHR_PROCESS_DIV & pikFlags){
          blob_append(pOut, "</div>\n", 7);
        }
        if((PIKCHR_PROCESS_SRC & pikFlags)
           || (PIKCHR_PROCESS_SRC_HIDDEN & pikFlags)){
          blob_appendf(pOut, "<pre class='pikchr-src%s'>"
                       "%h</pre>\n",
                       (PIKCHR_PROCESS_SRC_HIDDEN & pikFlags)
                       ? " hidden" : "",
                       blob_str(&bIn));
︙︙