From f58a2cb5d22c5931581274db1f0ec85ac903b747 Mon Sep 17 00:00:00 2001
From: Hans Hagen <pragma@wxs.nl>
Date: Mon, 28 Oct 2019 20:03:50 +0100
Subject: 2019-10-28 18:22:00

---
 .../general/manuals/svg/svg-lmtx-mozilla.lua       | 354 +++++++++++++++++++++
 1 file changed, 354 insertions(+)
 create mode 100644 doc/context/sources/general/manuals/svg/svg-lmtx-mozilla.lua

(limited to 'doc/context/sources/general/manuals/svg/svg-lmtx-mozilla.lua')

diff --git a/doc/context/sources/general/manuals/svg/svg-lmtx-mozilla.lua b/doc/context/sources/general/manuals/svg/svg-lmtx-mozilla.lua
new file mode 100644
index 000000000..0797f6406
--- /dev/null
+++ b/doc/context/sources/general/manuals/svg/svg-lmtx-mozilla.lua
@@ -0,0 +1,354 @@
+return {
+    [[
+        <svg width="160" height="140" xmlns="http://www.w3.org/2000/svg" version="1.1">
+            <rect x="10" y="10" width="100" height="100" stroke="blue" fill="purple" fill-opacity="0.5" stroke-opacity="0.8"/>
+        </svg>
+    ]],
+    [[
+        <svg width="160" height="140" xmlns="http://www.w3.org/2000/svg" version="1.1">
+          <line x1="40" x2="120" y1="20"  y2="20"  stroke="black" stroke-width="20" stroke-linecap="butt"/>
+          <line x1="40" x2="120" y1="60"  y2="60"  stroke="black" stroke-width="20" stroke-linecap="square"/>
+          <line x1="40" x2="120" y1="100" y2="100" stroke="black" stroke-width="20" stroke-linecap="round"/>
+        </svg>
+    ]],
+    [[
+        <svg width="160" height="280" xmlns="http://www.w3.org/2000/svg" version="1.1">
+          <polyline points="40  60 80  20 120  60" stroke="black" stroke-width="20" stroke-linecap="butt"   fill="none" stroke-linejoin="miter"/>
+          <polyline points="40 140 80 100 120 140" stroke="black" stroke-width="20" stroke-linecap="round"  fill="none" stroke-linejoin="round"/>
+          <polyline points="40 220 80 180 120 220" stroke="black" stroke-width="20" stroke-linecap="square" fill="none" stroke-linejoin="bevel"/>
+        </svg>
+    ]],
+    [[
+        <svg width="200" height="150" xmlns="http://www.w3.org/2000/svg" version="1.1">
+            <path d="M 10 75 Q 50 10 100 75 T 190 75" stroke="black" stroke-linecap="round"                  stroke-dasharray="5,10,5" fill="none"/>
+            <path d="M 10 75 L 190 75"                stroke="red"   stroke-linecap="round" stroke-width="1" stroke-dasharray="5,5"    fill="none"/>
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 30 10" xmlns="http://www.w3.org/2000/svg">
+          <circle cx="5"  cy="5" r="3" stroke="green" />
+          <circle cx="15" cy="5" r="3" stroke="green" stroke-width="3" />
+          <circle cx="25" cy="5" r="3" stroke="green" stroke-width="2%" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 38 30" xmlns="http://www.w3.org/2000/svg">
+          <path stroke="black" fill="none" stroke-linejoin="miter" id="p1"
+                d="M1,9 l7   ,-3 l7   ,3
+                   m2,0 l3.5 ,-3 l3.5 ,3
+                   m2,0 l2   ,-3 l2   ,3
+                   m2,0 l0.75,-3 l0.75,3
+                   m2,0 l0.5 ,-3 l0.5 ,3" />
+          <path stroke="black" fill="none" stroke-linejoin="miter" stroke-miterlimit="1" id="p2"
+                d="M1,19 l7   ,-3 l7   ,3
+                   m2, 0 l3.5 ,-3 l3.5 ,3
+                   m2, 0 l2   ,-3 l2   ,3
+                   m2, 0 l0.75,-3 l0.75,3
+                   m2, 0 l0.5 ,-3 l0.5 ,3" />
+          <path stroke="black" fill="none" stroke-linejoin="miter" stroke-miterlimit="8" id="p3"
+                d="M1,29 l7   ,-3 l7   ,3
+                   m2, 0 l3.5 ,-3 l3.5 ,3
+                   m2, 0 l2   ,-3 l2   ,3
+                   m2, 0 l0.75,-3 l0.75,3
+                   m2, 0 l0.5 ,-3 l0.5 ,3" />
+          <path stroke="pink" fill="none" stroke-width="0.05"
+                d="M1, 9 l7,-3 l7,3 m2,0 l3.5,-3 l3.5,3 m2,0 l2,-3 l2,3 m2,0 l0.75,-3 l0.75,3 m2,0 l0.5,-3 l0.5,3
+                   M1,19 l7,-3 l7,3 m2,0 l3.5,-3 l3.5,3 m2,0 l2,-3 l2,3 m2,0 l0.75,-3 l0.75,3 m2,0 l0.5,-3 l0.5,3
+                   M1,29 l7,-3 l7,3 m2,0 l3.5,-3 l3.5,3 m2,0 l2,-3 l2,3 m2,0 l0.75,-3 l0.75,3 m2,0 l0.5,-3 l0.5,3" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="-3 0 33 10" xmlns="http://www.w3.org/2000/svg">
+          <line x1="0" y1="1" x2="30" y2="1" stroke="black" />
+          <line x1="0" y1="3" x2="30" y2="3" stroke="black" stroke-dasharray="3 1" />
+          <line x1="0" y1="5" x2="30" y2="5" stroke="black" stroke-dasharray="3 1" stroke-dashoffset="3" />
+          <line x1="0" y1="7" x2="30" y2="7" stroke="black" stroke-dasharray="3 1" stroke-dashoffset="-3" />
+          <line x1="0" y1="9" x2="30" y2="9" stroke="black" stroke-dasharray="3 1" stroke-dashoffset="1" />
+          <path d="M0,5 h-3 M0,7 h3 M0,9 h-1" stroke="rgba(255,0,0,.5)" />
+        </svg>
+    ]],
+    [[
+        <svg width="200" height="150" xmlns="http://www.w3.org/2000/svg" version="1.1">
+          <path d="M 10 75 Q 50 10 100 75 T 190 75" stroke="black" stroke-linecap="round" stroke-dasharray="5,10,5" fill="none"/>
+          <path d="M 10 75 L 190 75"                stroke="red"   stroke-linecap="round" stroke-dasharray="5,5"    fill="none" stroke-width="1"/>
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+          <path fill="none" stroke="red"
+            d="M 10,10 h 10
+               m  0,10 h 10
+               m  0,10 h 10
+               M 40,20 h 10
+               m  0,10 h 10
+               m  0,10 h 10
+               m  0,10 h 10
+               M 50,50 h 10
+               m-20,10 h 10
+               m-20,10 h 10
+               m-20,10 h 10" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg">
+          <path fill="none" stroke="red" d="M 10,10 L 90,90 V 10 H 50" />
+          <path fill="none" stroke="red" d="M 110,10 l 80,80 v -80 h -40" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+          <path fill="none" stroke="red" d="M 10,90 C 30,90 25,10 50,10 S 70,90 90,90" />
+          <path fill="none" stroke="red" d="M 110,90 c 20,0 15,-80 40,-80 s 20,80 40,80" />
+          <g id="ControlPoints">
+            <line x1="10" y1="90" x2="30" y2="90" stroke="lightgrey" />
+            <circle cx="30" cy="90" r="1.5"/>
+            <line x1="50" y1="10" x2="25" y2="10" stroke="lightgrey" />
+            <circle cx="25" cy="10" r="1.5"/>
+            <line x1="50" y1="10" x2="75" y2="10" stroke="lightgrey" stroke-dasharray="2" />
+            <circle cx="75" cy="10" r="1.5" fill="lightgrey"/>
+            <line x1="90" y1="90" x2="70" y2="90" stroke="lightgrey" />
+            <circle cx="70" cy="90" r="1.5"/>
+            <circle cx="10" cy="90" r="1.5"/>
+            <circle cx="50" cy="10" r="1.5"/>
+            <circle cx="90" cy="90" r="1.5"/>
+          </g>
+          <use xlink:href="#ControlPoints" x="100" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+          <path fill="none" stroke="red" d="M 10,50 Q 25,25 40,50 t 30,0 30,0 30,0 30,0 30,0" />
+          <g>
+            <polyline points="10,50 25,25 40,50" stroke="rgba(0,0,0,.2)" fill="none" />
+            <circle cx="25" cy="25" r="1.5" />
+            <circle cx="10" cy="50" r="1.5"/>
+            <circle cx="40" cy="50" r="1.5"/>
+            <g id="SmoothQuadraticDown">
+              <polyline points="40,50 55,75 70,50" stroke="rgba(0,0,0,.2)" stroke-dasharray="2" fill="none" />
+              <circle cx="55" cy="75" r="1.5" fill="lightgrey" />
+              <circle cx="70" cy="50" r="1.5" />
+            </g>
+            <g id="SmoothQuadraticUp">
+              <polyline points="70,50 85,25 100,50" stroke="rgba(0,0,0,.2)" stroke-dasharray="2" fill="none" />
+              <circle cx="85" cy="25" r="1.5" fill="lightgrey" />
+              <circle cx="100" cy="50" r="1.5" />
+            </g>
+            <use xlink:href="#SmoothQuadraticDown" x="60" />
+            <use xlink:href="#SmoothQuadraticUp"   x="60" />
+            <use xlink:href="#SmoothQuadraticDown" x="120" />
+          </g>
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+          <path fill="none" stroke="red"    d="M 6,10 A 6 4 10 1 0 14,10" />
+          <path fill="none" stroke="lime"   d="M 6,10 A 6 4 10 1 1 14,10" />
+          <path fill="none" stroke="purple" d="M 6,10 A 6 4 10 0 1 14,10" />
+          <path fill="none" stroke="pink"   d="M 6,10 A 6 4 10 0 0 14,10" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 -1 30 11" xmlns="http://www.w3.org/2000/svg">
+          <path stroke="red" d="M  5,1 l -4,8 8,0" />
+          <path stroke="red" d="M 15,1 l -4,8 8,0 -4,-8" />
+          <path stroke="red" d="M 25,1 l -4,8 8,0 z" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg">
+          <ellipse cx="100" cy="50" rx="100" ry="50" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+            <line x1="0" y1="80" x2="100" y2="20" stroke="black" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg">
+            <polygon points="0,100 50,25 50,75 100,0" />
+            <polygon points="100,100 150,25 150,75 200,0" fill="none" stroke="black" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg">
+            <polyline points="0,100 50,25 50,75 100,0" />
+            <polyline points="100,100 150,25 150,75 200,0" fill="none" stroke="black" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 220 100" xmlns="http://www.w3.org/2000/svg">
+          <rect width="100" height="100" />
+          <rect x="120" width="100" height="100" rx="15" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+          <path fill="none" stroke="red"
+            d="M 10,30
+               A 20,20 0,0,1 50,30
+               A 20,20 0,0,1 90,30
+               Q 90,60 50,90
+               Q 10,60 10,30 z" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="-10 -10 220 120" xmlns="http://www.w3.org/2000/svg">
+          <polygon fill-rule="nonzero" stroke="red" points="50,0 21,90 98,35 2,35 79,90"/>
+          <polygon fill-rule="evenodd" stroke="red" points="150,0 121,90 198,35 102,35 179,90"/>
+        </svg>
+    ]],
+    [[
+        <svg x="0" width="10" height="10" clip="auto">
+            <circle cx="5" cy="5" r="4" stroke="green" />
+        </svg>
+    ]],
+    [[
+        <svg x="10" width="10" height="10" clip="rect(1, 9, 8, 2)">
+            <circle cx="5" cy="5" r="4" stroke="green" />
+          </svg>
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+          <rect x="0" y="0" width="100%" height="100%" fill="red"/>
+          <circle cx="50%" cy="50%" r="4" fill="yellow"/>
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg">
+          <rect x="0" y="0" width="100%" height="100%" fill="green"/>
+          <circle cx="50%" cy="50%" r="4" fill="yellow"/>
+        </svg>
+    ]],
+    [[
+        <svg viewBox="-5 -5 10 10" xmlns="http://www.w3.org/2000/svg">
+          <rect x="0" y="0" width="100%" height="100%" fill="blue"/>
+          <circle cx="50%" cy="50%" r="4" fill="yellow"/>
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
+          <rect x="10" y="10" width="30" height="20" fill="green" />
+          <rect x="10" y="10" width="30" height="20" fill="red" transform="matrix(3 1 -1 3 30 40)" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+          <rect x="5" y="5" width="40" height="40" fill="green" />
+          <rect x="5" y="5" width="40" height="40" fill="blue" transform="translate(50)" />
+          <rect x="5" y="5" width="40" height="40" fill="red" transform="translate(0 50)" />
+          <rect x="5" y="5" width="40" height="40" fill="yellow" transform="translate(50,50)" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="-50 -50 100 100" xmlns="http://www.w3.org/2000/svg">
+          <circle cx="0" cy="0" r="10" fill="red" transform="scale(4)" />
+          <circle cx="0" cy="0" r="10" fill="yellow" transform="scale(1,4)" />
+          <circle cx="0" cy="0" r="10" fill="pink" transform="scale(4,1)" />
+          <circle cx="0" cy="0" r="10" fill="black" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="-12 -2 34 14" xmlns="http://www.w3.org/2000/svg">
+          <rect x="0" y="0" width="10" height="10" />
+          <rect x="0" y="0" width="10" height="10" fill="red" transform="rotate(100)" />
+          <rect x="0" y="0" width="10" height="10" fill="green" transform="rotate(100,10,10)" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="-5 -5 10 10" xmlns="http://www.w3.org/2000/svg">
+          <rect x="-3" y="-3" width="6" height="6" />
+          <rect x="-3" y="-3" width="6" height="6" fill="red" transform="skewX(30)" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="-5 -5 10 10" xmlns="http://www.w3.org/2000/svg">
+          <rect x="-3" y="-3" width="6" height="6" />
+          <rect x="-3" y="-3" width="6" height="6" fill="red" transform="skewY(30)" />
+        </svg>
+    ]],
+    [[
+        <svg width="100" viewBox="0 0 100 90" xmlns="http://www.w3.org/2000/svg" version="1.1">
+          <defs>
+            <path d="M50,0 21,90 98,35 2,35 79,90z" id="star" />
+          </defs>
+          <clipPath id="emptyStar">
+            <use xlink:href="#star" clip-rule="evenodd" />
+          </clipPath>
+          <rect clip-path="url(#emptyStar)" width="50" height="90" fill="blue" />
+          <clipPath id="filledStar">
+            <use xlink:href="#star" clip-rule="nonzero" />
+          </clipPath>
+          <rect clip-path="url(#filledStar)" width="50" height="90" x="50" fill="red" />
+        </svg>
+    ]],
+--     [[
+--         <svg viewBox="0 0 240 80" xmlns="http://www.w3.org/2000/svg">
+--           <style>
+--             .small { font: italic 13px sans-serif; }
+--             .heavy { font: bold 30px sans-serif; }
+--             .Rrrrr { font: italic 40px serif; fill: red; }
+--           </style>
+--           <text x="20" y="35" class="small">My</text>
+--           <text x="40" y="35" class="heavy">cat</text>
+--           <text x="55" y="55" class="small">is</text>
+--           <text x="65" y="55" class="Rrrrr">Grumpy!</text>
+--         </svg>
+--     ]],
+    [[
+        <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+          <defs>
+            <marker id="arrow" viewBox="0 0 10 10" refX="5" refY="5" markerWidth="6" markerHeight="6" orient="auto-start-reverse">
+              <path d="M 0 0 L 10 5 L 0 10 z" />
+            </marker>
+            <marker id="dot" viewBox="0 0 10 10" refX="5" refY="5" markerWidth="5" markerHeight="5">
+              <circle cx="5" cy="5" r="5" fill="red" />
+            </marker>
+          </defs>
+          <polyline points="10,10 10,90 90,90" fill="none" stroke="black" marker-start="url(#arrow)" marker-end="url(#arrow)"  />
+          <polyline points="15,80 29,50 43,60 57,30 71,40 85,15" fill="none" stroke="grey" marker-start="url(#dot)" marker-mid="url(#dot)"  marker-end="url(#dot)" />
+        </svg>
+    ]],
+    -- from the attributes section
+    [[
+        <svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg">
+          <defs>
+            <linearGradient id="gradient" x1="0%" y1="0%" x2="0" y2="100%">
+              <stop offset="0%" style="stop-color:skyblue;" />
+              <stop offset="100%" style="stop-color:seagreen;" />
+            </linearGradient>
+          </defs>
+          <rect x="0" y="0" width="100%" height="100%" fill="url(#gradient)" />
+          <circle cx="50" cy="50" r="40" fill="black" />
+          <circle cx="150" cy="50" r="40" fill="black" opacity="0.3" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 400 100" xmlns="http://www.w3.org/2000/svg">
+          <circle cx="50" cy="50" r="40" />
+          <circle cx="150" cy="50" r="40" fill-opacity="0.7" />
+          <circle cx="250" cy="50" r="40" fill-opacity="50%" />
+          <circle cx="350" cy="50" r="40" style="fill-opacity: .25;" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="0 0 30 10" xmlns="http://www.w3.org/2000/svg">
+          <line x1="0" y1="1" x2="30" y2="1" stroke="black" />
+          <line x1="0" y1="3" x2="30" y2="3" stroke="black" stroke-dasharray="4" />
+          <line x1="0" y1="5" x2="30" y2="5" stroke="black" stroke-dasharray="4 1" />
+          <line x1="0" y1="7" x2="30" y2="7" stroke="black" stroke-dasharray="4 1 2" />
+          <line x1="0" y1="9" x2="30" y2="9" stroke="black" stroke-dasharray="4 1 2 3" />
+        </svg>
+    ]],
+    [[
+        <svg viewBox="-3 0 33 10" xmlns="http://www.w3.org/2000/svg">
+          <line x1="0" y1="1" x2="30" y2="1" stroke="black" />
+          <line x1="0" y1="3" x2="30" y2="3" stroke="black" stroke-dasharray="3 1" />
+          <line x1="0" y1="5" x2="30" y2="5" stroke="black" stroke-dasharray="3 1" stroke-dashoffset="3" />
+          <line x1="0" y1="7" x2="30" y2="7" stroke="black" stroke-dasharray="3 1" stroke-dashoffset="-3" />
+          <line x1="0" y1="9" x2="30" y2="9" stroke="black" stroke-dasharray="3 1" stroke-dashoffset="1" />
+          <path d="M0,5 h-3 M0,7 h3 M0,9 h-1" stroke="rgba(255,0,0,.5)" />
+        </svg>
+    ]],
+}
-- 
cgit v1.2.3