schplurtz / a2s Goto Github PK

Coming from Ditaa needed to change the corners from + to . or '

Test case:
Intermediate example --> not rendering but ok does not produce the Fatal Error

<a2s>
 .---------------------------.
 |                           |
 +---------------------------'
               |                
</a2s>

Problematic example -> not rendering and giving Fatal Error memory message at php level:

<a2s>
 .---------------------------.
 |                           |
 +-------------+-------------'
               |                
</a2s>

Error : Fatal error: Allowed memory size of 134217728 bytes exhausted (tried to allocate 262144 bytes) in \ASCIIToSVG.php on line 3635

Looking at the line of code and due to the incorrect +-sign an infinite loop is starting which will create objects ... until running out of memory.
Assigning more memory to th PHP will not help: Requested memory even stays the same.

Coming from Ditaa needed to change the corners from + to . or '
Test case:
Problematic example -> not rendering and giving Fatal Error memory message at php level:
--> look at the plus sign in the corner left under which should not be there:

<a2s>
 .---------------------------.
 |                           |
 +-------------+-------------'
               |                
</a2s>

Error : Fatal error: Allowed memory size of 134217728 bytes exhausted (tried to allocate 262144 bytes) in \ASCIIToSVG.php on line 3635

Intermediate example
Not rendering but does not produce the Fatal Error.
Removed the plus sign above the pipe sign at the bottom:

<a2s>
 .---------------------------.
 |                           |
 +---------------------------'
               |                
</a2s>

Hello!

As the mPDF won't support marker as they said at the mPDF Manual.
I'd like to do something like the codes below, to refuse the marker but use some more paths.

But, my php is only at a beginner level. And I am not very sure if there need four branch in each draw function.

Could you have a look at this and found some way to make the dw2pdf usefull?

--- ASCIIToSVG.php.orig 2020-04-21 11:45:31.105630518 +0800
+++ ASCIIToSVG.php      2020-04-21 16:34:30.261628449 +0800
@@ -2474,6 +2474,92 @@
     }
   }

+  public function drawIArrow($fx, $fy, $tx, $ty) {
+    $l = 8;
+    // <
+    if($fx < $tx) {
+      $ax0 = $fx - $l/2;
+      $ay0 = $fy;
+      $ax1 = $fx + $l;
+      $ay1 = $fy - $l;
+      $ax2 = $fx + $l;
+      $ay2 = $fy + $l;
+    }
+    // >
+    else if($fx > $tx) {
+      $ax0 = $fx + $l/2;
+      $ay0 = $fy;
+      $ax1 = $fx - $l;
+      $ay1 = $fy - $l;
+      $ax2 = $fx - $l;
+      $ay2 = $fy + $l;
+    }
+    // ^
+    if($fy < $ty) {
+      $ax0 = $fx;
+      $ay0 = $fy - $l/2;
+      $ax1 = $fx - $l;
+      $ay1 = $fy + $l;
+      $ax2 = $fx + $l;
+      $ay2 = $fy + $l;
+    }
+    // v
+    else if($fy > $ty) {
+      $ax0 = $fx;
+      $ay0 = $fy + $l/2;
+      $ax1 = $fx - $l;
+      $ay1 = $fy - $l;
+      $ax2 = $fx + $l;
+      $ay2 = $fy - $l;
+    }
+
+    //return "M {$ax0} {$ay0} L {$ax1} {$ay1} L {$ax2} {$ay2} Z ";
+    return "M {$ax0} {$ay0} L {$fx} {$fy} M {$ax0} {$ay0} L {$ax1} {$ay1} M {$ax0} {$ay0} {$ax2} {$ay2} ";
+  }
+
+  public function drawArrow($fx, $fy, $tx, $ty) {
+    $l = 8;
+    // <
+    if($fx > $tx) {
+      $ax0 = $tx - $l/2;
+      $ay0 = $ty;
+      $ax1 = $tx + $l;
+      $ay1 = $ty - $l;
+      $ax2 = $tx + $l;
+      $ay2 = $ty + $l;
+    }
+    // >
+    else if($fx < $tx) {
+      $ax0 = $tx + $l/2;
+      $ay0 = $ty;
+      $ax1 = $tx - $l;
+      $ay1 = $ty - $l;
+      $ax2 = $tx - $l;
+      $ay2 = $ty + $l;
+    }
+    // ^
+    if($fy > $ty) {
+      $ax0 = $tx;
+      $ay0 = $ty - $l/2;
+      $ax1 = $tx - $l;
+      $ay1 = $ty + $l;
+      $ax2 = $tx + $l;
+      $ay2 = $ty + $l;
+    }
+    // v
+    else if($fy < $ty) {
+      $ax0 = $tx;
+      $ay0 = $ty + $l/2;
+      $ax1 = $tx - $l;
+      $ay1 = $ty - $l;
+      $ax2 = $tx + $l;
+      $ay2 = $ty - $l;
+    }
+
+    // return "M {$ax0} {$ay0} L {$ax1} {$ay1} L {$ax2} {$ay2} Z ";
+    return "M {$ax0} {$ay0} L {$tx} {$ty} M {$ax0} {$ay0} L {$ax1} {$ay1} M {$ax0} {$ay0} {$ax2} {$ay2} ";
+  }
+
   public function render() {
     $startPoint = array_shift($this->points);
     $endPoint = $this->points[count($this->points) - 1];
@@ -2589,6 +2675,8 @@
       $path = "M {$startPoint->x} {$startPoint->y} ";
     }

+
+
     $prevP = $startPoint;
     $bound = count($this->points);
     for ($i = 0; $i < $bound; $i++) {
@@ -2666,15 +2754,26 @@

     /* Add markers if necessary. */
     if ($startPoint->flags & Point::SMARKER) {
-      $this->options["marker-start"] = "url(#Pointer)";
+      //$this->options["marker-start"] = "url(#Pointer)";
+      $path .= $this->drawArrow($startPoint->x, $startPoint->y, $this->points[0]->x, $this->points[0]->y);
     } elseif ($startPoint->flags & Point::IMARKER) {
-      $this->options["marker-start"] = "url(#iPointer)";
+      //$this->options["marker-start"] = "url(#iPointer)";
+      $path .= $this->drawIArrow($startPoint->x, $startPoint->y, $this->points[0]->x, $this->points[0]->y);
     }

     if ($endPoint->flags & Point::SMARKER) {
-      $this->options["marker-end"] = "url(#Pointer)";
+      //$this->options["marker-end"] = "url(#Pointer)";
+      if($bound == 1) {
+        $path .= $this->drawArrow($startPoint->x, $startPoint->y, $endPoint->x, $endPoint->y);
+      }
+      else {
+        $j = count($this->points) - 2;
+        $path .= $this->drawArrow($this->points[$j]->x, $this->points[$j]->y, $endPoint->x, $endPoint->y);
+      }
     } elseif ($endPoint->flags & Point::IMARKER) {
-      $this->options["marker-end"] = "url(#iPointer)";
+      //$this->options["marker-end"] = "url(#iPointer)";
+      $j = count($this->points) - 2;
+      $path .= $this->drawIArrow($endPoint->x, $endPoint->y, $this->points[$j]->x, $this->points[$j]->y);
     }

     /*

I tested this with the codes below, seems it work.

<a2s>
--->  <---   |      ^
             |      |
  |  ^       +--> --+
  |  |
  v  |       +-- |<--+
             |   |   |
===> <===    v       |
            ---     ---
  :  ^       |       ^
  :  :       |   |   |
  v  :       +-->| --+
</a2s>

Ref : splitbrain/dokuwiki-plugin-dw2pdf#396

Hi!

Nice plugin!
Thank you for your work.

Are there any ability to put clickable links into a diagram?
F.ex.:

#----------------.
|[grbx]          |        .------.
| a kinda of box +=======>|outbox|
|                |        '------'
'----------------#

[grbx]: {"fill":"#009900","a2s:delref":true,"url":"http://www.mysite.net"} 

Thank you very much for the a2s plugin!! It is brilliant!!

I use it for process design in an intranet environment, where IE11 is mandatory for easy and save file access on our intranet server. But, unfortunately, there is an old and well known issue with zoom and scaling of inline svg in IE11.
Since a2s plugin dynamically inserts svg of varying sizes into the DOM, this scaling problem in IE11 can be very frustrating for intranet users like me, because, apparently, there exists no easy fix with CSS alone.

I found the idea for the <canvas> workaround here: https://www.mediaevent.de/tutorial/svg-responsive.html !
All it does, is, wrapping the svg.a2s with a <div> element, and placing inside the <div> element, side by side with the svg.a2s, a dummie <canvas> element, and applying some simple CSS for styling. The <canvas> element ensures proper zoom and scaling in IE11. Therefore, it needs to be fitted with the width and height of the svg.a2s, accordingly.
Here is the implementation for javascript / jQuery. It can be copied to dokuwiki/conf/userscript.js.

JS:

   jQuery(function(){
      if( jQuery( "svg.a2s" ).length > 0 ) {
         var $svg_a2s = jQuery( "svg.a2s" );
         for (var i=0; i<$svg_a2s.length; i++) {
            // ----- viewBox calculation -----
            var $svg_viewBox = jQuery($svg_a2s[i]).attr('viewBox');
            $svg_viewBox = $svg_viewBox.replace(/\s\s+/g, ' ');
            var $svg_width = $svg_viewBox.split(' ')[2];
            var $svg_height = $svg_viewBox.split(' ')[3];
            // ----- HTML - canvas fix -----
            jQuery($svg_a2s[i]).wrap("<div class='svg_fix'></div>");
            jQuery($svg_a2s[i]).parent().append("<canvas class='svg_fix' width='" + $svg_width + "' height='" + $svg_height + "'></canvas>");
            jQuery($svg_a2s[i]).attr('width', '100%').attr('height', '100%');
         }
      }
   });

CSS:

   svg.a2s {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
   }
   div.svg_fix {
      position:relative;
      margin-left:auto; 
      margin-right: auto;
   }
   canvas.svg_fix {
      display: block;
      width: 100%;
      visibility: hidden;
   }

This fix works with multiple svg.a2s per page. Now, sizing of SVGs on the page can easily be achieved by changing the width of the canvas element. The same could probably be incorporated into the syntax.php and the style.css of the a2s plugin.

for example, a line with a X, with means this line is disabled.

such like :

-----X

Hi,

Is it possible to escape special characters, e.g. "o", as they can interact with box characters. In this excerpt (from a closed box):
| | |
--+----+----+---
| fox |
-+-----------+---
| |

The "o" in fox becomes a line connector because of the + above it?
A workaround might be using another "o" from unicode, but that may be against the ascii-art ethos :)

Hi,
I use the a2s a lot in dokuwiki but frequently get some issues:

                                                                           #------------------#
                                                                   #-------+  Echo 1          |
                                                                   |       #------------------#
                                                                   |
          #-------------#                #------------------#      |       #------------------#
          |     Hello   +----------------+     World        +------+-------#  Echo 2          |
          #-------------#                #------------------#      |       #------------------#
                                                                   |       
                                                                   |       #------------------#
                                                                   +-------+  Echo 3          |
                                                                           #------------------#
                                                                           
     |
     |
 ----#-----
     |
     |
     |  
                                                                              
     |
     |
 ----+-----
     |
     |
     | 
     
     |
     |
 ----o-----
     |
     |
     |           
</a2s>

Surprisingly the upper and lower crossings are displayed differently. Any idea wha?
Best reagrds
Martin

If using php 8.1, a2s and odt plugin, it is not possible to export a page with an a2s diagram to odt.

I don't know yet if the issue comes from a2s or if this is an odt problem. See this question lpaulsen93/dokuwiki-plugin-odt#274.

Today = 2018-05-03

From https://www.dokuwiki.org/plugin:a2s: Last updated on 2018-05-26

-> Wrong date set for "Last update"

after installing a2s, openlayersmap plugin will not draw POI anymore.