Introducing VSV = Versatile Separated Values. Simple, elegant format usable for lists, tables, object notation, subtitles, playlists.

Main Menu

Show posts

This section allows you to view all posts made by this member. Note that you can only see posts made in areas you currently have access to.

Show posts Menu

Messages - Den

Games General / KARA 5 KANVAS
2022-Nov-26 13:46
Just trying some simple HTML Canvas stuff. You can admire KARA princesses at this URL:

Many of these games use my specially created deck of cards hugely inspired by KARA5. Has 5 suits and 12 ranks, using KARA5 idols as suits.

 KARA 5 ClockA clock using base 12 numeral system.
 KARA SlideshowBackground and icons rotate every few seconds.
 KARA 5 Poker5-card draw using KARA5 deck.
 Concentrate on KARAMatch all the pairs of icons in the shortest time.
 KARA 5 Krushmatch 3.
 KARA 5 SlotsSlots with 5 rows and 5 columns. Win all ways.
 KARA-TRISlike Tetris.
 KARA 5 Green Queenlike Black Jack. Get close to 25, but not over. Uses KARA5 deck.
 KARA 5 Lupinlike Euchre / Bridge. Uses KARA5 deck.
 KARA 5 ElementsSolitaire using KARA5 deck.
 Karot ReadingFortune telling. Uses KARA5 and MBS decks combined.
 Idol Battle"Fight" between KARA and Family Outing cast.

(Project started circa May 2011.)
Act 1 completed. see first post link to blog post.
  • Onset: Male student is good friends with another boy and two girls. School bell rings. Afterschool something happens.
  • Chapter 1: Party practices in park. Intruders disturb their peace. Party defends.
  • Chapter 2: Find new base. Puzzle solving.
  • Chapter 3: Settling in. Unsettling monsters.
  • Chapter 4: First great villain. Dormant deep in base.
 Guyver Ironwood M Mankin Scholar M Innocent Data
 Hansy'Dol F Mutant Haemi S Ruler Group
 Tiffa Steelchest F Memech Juggernaut B Warrior Metal
 Almega M Mythic Demigod MBS Sage Time
 Cherriot M Milform Tank MB Explorer Space
 Wan Tor-Tor F Monster Bird SM Rebel Air
 Vivikei F Mythic Chimera BS Companion Life
 Pallas Aspis F Mankin Soldier BS Caregiver Electromagnet
 Gerhard Comandy M Memech Cyborg SM Jester Change
 Hellina'Fyr F Mutant Dworc MB Creator Atom
 Lai Lyun-Hai M Monster Dragon MBS Magician Art
 Mikomiu F Milform Plane MBS Lover Emotion
 Sabra Warsong F Memech Mecha MBS Sage Logic
 Robin Mancock M Mankin Polymath MBS Explorer Man
 Taavi'Arth M Mutant Elf SM Ruler Morality
 Xabara F Mythic Undead B Creator Matter

{{Karas Portraits}}
 name  Guyver Ironwood
 sex  M
 age  16
 h  5'4
 w  120 lbs.
 race  GT Mankin
 class  Scholar
 energy  M
 archetype  Innocent
 domain  Data
 skills  alter stats , alter max life , buff , debuff , confuse , collect & analyze data , clues , research , classify , high IQ , solve puzzles , math , absorb info , good memory ,
 personality  INTP Architect, reticent , skeptic , procrastinate , overthink , non gambling , averse to risk , inert , slow reaction , non talkative , conservative , passive , sarcastic

 name  Hansy'Dol
 sex  F
 age  16
 h  5'1
 w  100 lbs.
 race  FG Mutant
 class  Haemi
 energy  S
 archetype  Ruler
 domain  Group
 skills  drain life , give life , shout orders , oration , boost morale , charm , persuade , negotiate ,
 personality  ESFJ Provider, protective , dedicated , loyal , diligent , pro-family , sincere , justice , crisis management , decisive , orator , articulate , organized , responsible , community , noble , elegant

 name  Tiffa Steelchest
 sex  F
 age  16
 h  6'0 to 8'0
 w  140 lbs. to 1 ton
 race  HF Memech
 class  Juggernaut
 energy  B
 archetype  Warrior
 domain  Metal
 skills  strong punch , kick , enlarge , toughen up , metal armor , endure , break stuff , knock back , toss , pin down ,
 personality  ENFP Champion, enraged , temperamental , brash , loyal , fraternal , sassy , wild , flamboyant , accessories , helpful , vigilante justice , brawn over brain , protect weak , enthusiasm , passionate ,

 name  Almega
 sex  M
 age  1000
 h  6'4
 w  180 lbs.
 race  FT Mythic
 class  Demigod
 energy  MBS
 archetype  Sage
 domain  Time
 skills  slow time , hasten , omniscient , see past present future, time travel? , alter time lines , change age , long life , immortal ,
 personality  ISTJ Inspector , patient , timely , punctual , theoretical , insightful , orderly , systematic , organized , holistic , wisdom , curious

{{Heros Born}}

Read at my blog:

  • Premise: A novel about an adventure party, with sprinkles of romance.
  • RPG races : Mankin, Memech, Milform, Monster, Mutant, Mythic. Trinity stats. Motifs. Classes. Domains.
  • Main kara is male. Bands with another male and two female. These four cover the major trinity classes: M, B, S, and MBS hybrid.
  • Later more people join group. Cover other hybrid classes, races, and domains.
  • Also consider the 12 archetypes:
    • M = [Innocent, Jester, Magician, Sage]
    • B = [Warrior, Explorer, Caregiver, Creator]
    • S = [Companion, Rebel, Lover, Ruler].
  • Combat formation: 2x2 , plus reserves

Games General / Re: [CCG] MBS RPG CCG
2022-Nov-15 10:36
Energy, Motif, Races, Classes



 Mankin Scholar Warrior Doctor Magician Soldier Priest Polymath
 Memech Techie Juggernaut Racer Bionic Powersuit Cyborg Mecha
 Milform Tower Artillery Car Ship Tank Train Plane
 Monster Mollusk Fish Insect Mammal Reptile Bird Dragon
 Mutant Gnome Giant Haemi Dworc Troll Elf Plasmata
 Mythic Fay Undead Spirit Shapeshifter Chimera Elemental Demigod

Lessons , ordered by letter frequency. Words 2 to 7 letters long. Words generated by my Word Finder.

 eatn  [eatn]![eatn]!&s=2-6&o=random
 eatnis (eatn)*[is]2-*[is]2-&s=5&o=random
 eatnisor (eatnis)*[ro]2-*[ro]2-&o=random
 eatnisorhldc (eatnisor)*[hldc]4*[hldc]4&s=6&o=random
 eatnisorhldcumfg (eatnisorhldc)*[umfg]4-*[umfg]4-&s=-6&o=random
 eatnisorhldcumfgpwyb (eatnisorhldcumfg)*[pwyb]4-*[pwyb]4-&s=-7&o=random
 eatnisorhldcumfgpwybvkxjzq (eatnisorhldcumfgpwyb)*[vkxjzq]2-*[vkxjzq]2-&s=4&o=random

Plug words list into typing program. Such as Amphetype.
An API and form to help find words from dictionary, given set of letters, word sizes, and sort order.

Useful for ...
 anagrams typing lessons
 word games research

 git repo

lletters to seekletters with wildcardssee wildcards below
ssize of wordsmin-max2-5
osort orderaz | za | size | ezis | randomaz

WildcardsAmount or Function
 wildcard  put after letter or closing bracket
 no wildcard  0 or 1
 *  0 or more
 !  1 or more
 number  exactly N times
 number-  N or more times
 -number  up to M times
 number-number  N to M times
 bracket  put around letters
 ()  set of letters
 ()wildcard  wildcard is applied to each letter in set
 []  group of letters
 []wildcard  wildcard is applied to whole group


EATR 0 to 1

ATR 0 to 1
E 0 or more*atr

ATR 0 to 1
E 1 or more!atr

ATR 0 to 1
E 2

ATR 0 to 1
E 2 or more

ATR 0 to 1
E 0 to 2

EATR 0 to 1

EATR 1 or more!

SIZE 2 or more

ATR 0 to 2

ETR 2 to 3
SIZE 2 or more

TION 0 to 3
SIZE 2 to 6

EA 0 to 1
TR group 0 to 1[tr]

EA 0 to 1
TR group 1 to 3[tr]1-3

all words
SIZE 0 to 4

home keys 0 or more
SIZE 1 or more*&s=-

ORDER by alphabet

ORDER by alphabet reversed

ORDER by size

ORDER by size reversed

ORDER by random
Magic: the Gathering / PlayKards
2022-Nov-03 01:00
PlayKards is hybrid of playing cards and CCG.

The card's edge is symmetric when rotated 180'. Includes name, manacost, typeicon, seticon, and p/t.

Use manacost to denote rank and suit. Don't forget to use custom mana to retrieve suitable suit symbols.

The center sits the art. Above the art are the card's types and extra. Below are the rulestext and watermark. (No room for flavor text.)

; rules text ; variable width tables

format is :
<<#comma-separated values|
Where values are relative sizes for each column.  Sizes of 0 zeros are ignored. so ex. 3,1,3 will have left and right columns that are 3 times wider than central column.

previous methods of creating tables, namely <<<< and <<|number| , still create equal-width columns.

all methods still allow pipes | , to advance columns.

Ex. These three lines of codes produce identical tables of two columns of equal widths



Ex. column ratios 5-1-4
<<#5,1,4|Lengthy header|number|lengthy notes

Ex. column percentages 50-10-40
<<#50,10,40|Lengthy header|number|lengthy notes

Ex. stats sheet


; allow text outlines ; outlinecolor, outlineratio
; allow shadow width multiplier ; shadowratio
; allow turn text into all upper- or lower-case ; allupper, alllower

  • outlinecolor is HTML hex code (Ex. #00FF00)
  • outlineratio is multiplied by font size to create outline width. Default is 0.01
  • shadowratio is multiplied by font size to create shadow width. Default is 0.075
  • allupper is true or false. Default false.
  • alllower is true or false. Default false.
  • allupper has precedence over alllower

Ex. in custom frames


; frame_custom ; sections may "split"

Some sections may have an array called "split" that splits a section into several parts, delimited in its "*url" or "*text" fields by double semicolons ;;. Additional options can alter the parameters for each part. Such as placing them at different locations, or alignments, or angle. (Split doesn't cut an image into smaller parts. Rather, you can provide several URLs delimited by ;; and they will be all drawn on the card.)

"split" array holds more "options" objects. Options after the first one only need to specify the parameters that differ from the previous. All parameters will carry to subsequent parts unless altered again. If no parameters differ, provide an empty object, to denote an extra part exists.

The first options object can be outside or inside the split array. If outside, it must still be called "options". But objects inside the array do not and should not be named.

Ex. first options inside split. total 4 parts, all inside.
Where manacost field contains four parts, like "g;;w;;u;;b"

Ex. first options outside split. total 3 parts: 1 outside, 2 inside.
Where powertoughness field contains three parts, like "1/1;;2/2;;4/4"

Sample VON files
Quote from: Den on 2022-Oct-15 01:47VON will be used to define custom frames in Shena'Fu's Card Creator


My decision to use VON for creating custom frames, I needed a way to implement conditionals (boolean logic) and results thereof. It just dawned on me, that this resembles functional programming languages, like LISP, etc.

This raises the question: can VON be suitable for full-fledged functional programming? It worked well for custom frames. Since the VSV/VON syntax and philosophy is very simple, clean, regular, and well-defined.


It's amazing how far we've gone from the original purpose of VSV, to branching into possibly full programming languages. All derived from two simple core concepts: rows and delimiters.
Consider some keys may be pressed by different fingers at different times. For instance to turn same finger combos into rolls instead. A thorough analyzer should allow such flexible finger assignments, in order to derive the optimal path and effort, and to support unconventional typing methods.

; frame_custom ; rulespw, ruleslevel, textlevel

Use section type "rulespw" and "ruleslevel" to print rules for Planeswalkers and Levelers, respectively. They act like rules section, but also take extra pertinent options.

Behoove to use conditions to make such sections only appear for relevant cards.

"rulespw" has extra options to customize the loyalty costs and lines that divide the abilities.

         (( is planeswalker



"ruleslevel" has extra options to customize the level information and lines that divide the abilities.

         (( is leveler, pt has ;;



Use section "textlevel" to split the text across several parts. The text box will be divided evenly by the number of parts created by double semicolons ;;. Text will appear on the same row.

Extra options include "strokew" to define the width of the dividing lines, and "addflavor" which adds another part if flavor text is provided by the card. This latter is particularly useful if this text is placed alongside the rules box, and has an angle of 90 or 270 (which rotates the text clockwise by that many degrees).

         (( is leveler, pt has ;;

; frame_custom ; save image temporarily

Can save current image temporarily, that can be redrawn later. Use section "saveimage" to save. Then in an image-drawing section (art, watermark, seticon, typeicon, overlay), put its URL as "<-savedimage->". You can also apply image manipulation commands.


; frame_custom ; conditions to match before drawing section

A section may have an optional array named "if". The section will only be drawn and appear on the card, if the "if" conditions are met. Each condition is represented by an array.

The root "if" is a nested array of any depth. Two basic types of condition arrays: boolean logic operators; and special functions to test the card's properties.

(In these examples, lines that begin with double parentheses (( , act as comments, and are allowed within VON files.)

      (( is planeswalker

Possible boolean operators are (at the time of this writing): AND, OR, NOT.

AND takes any number of conditions. All conditions must be met for this AND to return true.

Note the root "if" is essentially an AND condition. In this case, you must NOT prefix it with an AND declaration.

Ex. if card is artifact and creature:

Ex. root if

OR takes any number of conditions. One or more conditions must be met for this OR to return true.

Ex. if card is historic (legendary, artifact, and/or Saga):

NOT returns the opposite boolean value of the first given condition.

Ex. not a creature:

Ex. nesting boolean conditions

   (( if enchantment creature and/or a God

   (( neither artifact nor creature

Other condition arrays are functions to test a card's property or other logic. These arrays have the following basic layout:

array[0] = the function's name
array[1] = the desired result, in boolean. See table below for valid boolean values.
array[...] = the remaining elements are parameters passed to the function, if necessary

List of Booleans

The following functions are valid (at the time of this writing).

"iscardtype" takes an integer that corresponds to the card's type. This value can be found in the same order as the form in the card creator's page. Start counting from 0. (0 = tribal)

Ex. is a land

Ex. NOT a land

"issupertype" takes an integer that corresponds to the card's supertype. This value can be found in the same order as the form in the card creator's page. Start counting from 0. (0 = legendary)

Ex. is basic

Ex. NOT basic

"isintext" matches a pattern within a card's property.

List of Properties

Patterns must be enclosed in identical delimiters. Legal delimiters are symbols such as "/|~#

Patterns may have modifiers after the second delimiter. A common one is "i" modifier, that matches both upper and lower case (makes the pattern case insensitive.)

List of Modifiers
iCase insensitive

Ex. "Circle" in card name

Ex. Warrior is NOT in subtype

Ex. Matches "fish" but case doesn't matter

Ex. extra field is not empty
2022/10/15 - 17

; frame_vogonhd, vogonvt ; bigger mana cost symbols
; cardfuncs ; multi-column tables ; using <<|C|, where C = number of columns ; subsequent pipes | will advance to next column ; pipes will create new rows when it reaches last column

Behavior for <<<< and >>>> are unchanged. These will create exactly two-column tables. Except pipes can also be used to advance these columns, and new rows if necessary.

All columns on the same row will have equal width.


(Empty square brackets [] is used facilitate indentation.)

Column of digits:
<<|4|[]     9|[]     9|[]     9|[]     9
|[]     8|[]     8|[]     8|[]     8
|[]     7|[]     7|[]     7|[]     7
|[]     6|[]     6|[]     6|[]     6
|[]     5|[]     5|[]     5|[]     5
|[]     4|[]     4|[]     4|[]     4
|[]     3|[]     3|[]     3|[]     3
|[]     2|[]     2|[]     2|[]     2
|[]     1|[]     1|[]     1|[]     1
|[]     0|[]     0|[]     0|[]     0

<<|1|[]  2022                    October
<<|7|[]    M|[]    T|[]    W|[]    T|[]    F|[]    S|[]    S
|[]     |[]     |[]     |[]     |[]     |[]    1|[]    2
|[]    3|[]    4|[]    5|[]    6|[]    7|[]    8|[]    9
|[]   10|[]   11|[]   12|[]   13|[]   14|[]   15|[]   16
|[]   17|[]   18|[]   19|[]   20|[]   21|[]   22|[]   23
|[]   24|[]   25|[]   26|[]   27|[]   28|[]   29|[]   30

; allow custom frames ; provide URL to .von or .json file

Design your own frames. Arrange elements anywhere on the card as you please. Customize font sizes, arrange texts, resize art elements, select background images.

Choose "Custom" from the "Frame" drop down menu. Then, in the "Custom Frame" input field, provide a URL to a .von or .json file, that defines your custom frame.

sample files

Also see attached sample images resulting from these custom frames.

Basic layout of the frame definition files is an array composed of sections (which are objects or hashes). The sections are drawn and painted on the card in the same order in the root array. So rearrange, add, or remove sections as you please.

Each section must state a section type. Each type has their own options parameters. Use "cf-0.von" as template; it contains most common options you may need for every section. Eventually I would write more detailed instructions in a dedicated help page.

Section types may be repeated. For instance, a text section to print the card name, and another text section to print card type. (Warning: Meta section should not be repeated. This creates a new image and undoes all previous sections. )

Text section prints everything on a single line. Rules section prints across multiple lines, and allows bold and italic and other advanced formatting.

For text and rules types, the "text" option may contain special code to insert strings from other fields. Such as inserting card name, card type, etc. Enclose them inside angled brackets and dash <- ->.
`text`Illus. by <-artist->
`text`<-supertype-> <-cardtype->

For text, rules, and cost types, can also set the font types. Text and cost has only the "font" option. Rules has four options: textfont, boldfont, italicfont, and bolditalicfont. Omitting them will use default fonts.

Fonts are limited to my webhost server. Below are the fonts available. May add more upon request. Use exact spelling, including capitalization, and extension.

  • albertus_medium-regular.ttf
  • Amita-Bold.ttf
  • Amita-Regular.ttf
  • boecklinsuniverse-regular.ttf
  • CaviarDreams.ttf
  • CaviarDreams_Bold.ttf
  • CaviarDreams_BoldItalic.ttf
  • CaviarDreams_Italic.ttf
  • crimson-bold.ttf
  • crimson-bolditalic.ttf
  • crimson-italic.ttf
  • crimson-regular.ttf
  • FhaNicholson-Regular.ttf
  • fondamento-italic.ttf
  • fondamento-regular.ttf
  • Hack-Bold.ttf
  • Hack-BoldItalic.ttf
  • Hack-Italic.ttf
  • Hack-Regular.ttf
  • itim-regular.ttf
  • kelvinch-bold.ttf
  • kelvinch-regular.ttf
  • Molengo-Regular.ttf
  • SourceCodePro-Bold.ttf
  • SourceCodePro-It.ttf
  • SourceCodePro-Regular.ttf
  • ubuntu-bold.ttf
  • ubuntu-bolditalic.ttf
  • ubuntu-italic.ttf
  • ubuntu-medium-regular.ttf
  • ubuntu-regular.ttf
  • ubuntumono-regular.ttf


You can also paint static images using the image-drawing sections (art, watermark, seticon, typeicon, overlay.) Their options are respectively: arturl, wmurl, seticonurl, typeiconurl, overlayurl. You can also apply image manipulation commands after the URL.


Note that different section types have nuances. for instance, watermark is always centered around given x,y options. seticon replaces magenta #FF00FF with rarity colors.

  • TODO
  • art mask, bevel
  • drawing lines , shapes

  • Custom frame ideas
  • life counter
  • checklist
  • other CCG
  • movie poster
  • PSA (public service announcement)
  • token
  • game tips
  • business card
  • ID
  • sports card
  • statistics (for games, account, etc.)
  • memes
  • calendar
  • flash cards
Scryer: if no exact cardname found, now prints all cards that may match via autocomplete.

2022/04/04 - 2022/04/17
 update hints
 image commands  raise to 9
 ccimg  allow query string options for w=, h=
 cclist, ccrand  resize images to h=523
 cclist, ccrand  open cards in new tabs where target=cardname or creator or _blank
 seticon  fix crash if invalid URL
 ##pad  allow transparent background
 PW or Leveler  fix crash if ability is blank
 vogon frames  darken seams on green frames
 playing card  art is see-through where rules texts are
 playing card  text is white if background is black
 blending  option for custom, premade blend masks

First enable CSS modifications at vivaldi://experiments

Then go to Vivaldi settings and choose a folder to store your custom css files. Create a .css file with the following code:

/* find bar */
.active.visible.webpageview .find-in-page {position:absolute; bottom:-1px; z-index:1; margin: 0 auto; left:0; right:0; max-width: fit-content; border-radius: calc(var(--radius) * 1.3); padding-left: 6px;}
.find-in-page .fip-input-label {display:none;}
.find-in-page > label:not(:hover) .fip-checkbox-label {font-size:0; padding:.5px; }
.find-in-page .fip-checkbox-label {font-size: 80%; transition: font-size .15s !important;}
.find-in-page > .toolbar.toolbar-group button svg {transform:rotate(90deg);}
.find-in-page > .button-toolbar button {fill:crimson;}
.find-in-page > .button-toolbar button:hover {fill:beige; background:crimson; box-shadow: 0 0 0 1.5px beige inset;}
/* compact mode */
.active.visible.webpageview .find-in-page:not(:focus-within):not(:hover) {opacity: .5; visibility:hidden;}
.active.visible.webpageview .find-in-page :is(input[type="search"], .fip-results) {visibility:visible;}
/* nomatch alert */
.find-in-page.fip-nomatches:focus-within input[type="search"] {color:maroon; background:pink; transition: 0s .15s !important;}
.find-in-page.fip-nomatches:focus-within {animation: jump 1.3s steps(2) .15s 4 !important;}
@keyframes jump {8% {transform:translateY(0);} 1%, 5% {transform:translateY(5px);} 3% {transform:translateY(-4px);}}


Successfully sent VSV block via Node.js via Pug.

First, each HTML page must include vsv.js in the head, in order to transform VSV into DOM in the client browser.

VSV block should be sent inside a script element. This script will call VSV.mapTo.autoScript(). This function will automatically determine the VSV type (is it table, list, VML?), then insert it into the DOM before the current script element.

The custom filter for Pug looks like this. But first clean up the text so it escapes the brackets that are critical to VSV as the text is passed through the network. Backticks in javascript maintain the multiline text; so they should also be escaped.

VSV.pugFilters = {
'vsv':function (text, options) {
return "<script>VSV.mapTo.autoScript(`" + text.replace(/([`{[(<])/g, '\\$1') + "`);</script>";

Simply pass this filter to render:

res.render(myDoc, {filters: VSV.pugFilters});

Inside a pug file, include with vsv filter, like so:

include:vsv /public/atable.vsv
include:vsv /public/alist.vsv
include:vsv /public/mydoc.vml

Inline VSV block can be created like so, with indentation:

,cream pie

The client browser will receieve a script element with the above inner text from our filter. Upon reception, the script will execute, thus adding our VSV into the DOM.

; new image manipulation command ; ##transparent,color,alpha
; color is HTML format: 6-hex-digits with leading hash #
; alpha is float between 0.0 and 1.0

Ex. turn cyan invisible

; allow multiple images per field ; all image URLs ; delimiter double dollars $$

All image fields (seticon, typeicon, watermark, overlay, art) may accept multiple images. At the end of the URL, append $$ double dollars for each extra image. Each image can also have their own image manipulation commands. These commands go before the $$.

Not to be confused with double semicolons ;; that separates each half of a split card. $$ and ;; can work together to provide multiple images to one or both halves.

Ex. two images on top of each other$$

Ex. two guild symbols side by side,r,205##alpha,0.1618$$,l,205##alpha,0.1618

Here we pad images to "push" them to left or right. Then alpha the images.

Ex. each half of a split card gets two different watermarks (total 4 different watermarks),r,205##alpha,0.1618$$,l,205##alpha,0.1618;;,r,205##alpha,0.1618$$,l,205##alpha,0.1618

Possible to allow custom or user defined frames ?

  • Reasons
    • any possible frame may be created by anyone
    • l can't do them all myself
    • won't have to include into crowded drop down
  • Concerns
    • Security
    • Methodology
    • Ease of use
    • Resources locations
    • Undiscovered additional rendering or other code
    • Special frames, i.e. split cards, flip, levelers, planeswalkers
  • Ideas
    • VSV / JSON file includes
      • URLs to
        • frame images
        • masks
        • fonts
        • custom mana
      • PHP class ?
      • options parameters to pass to functions
    • API
      • drawing functions
      • rules box

Any comments and suggestions welcome.
Integrated Content Management and Propagation System

Requisite: An integrated, comprehensive web software system, with single control panel, to manage and propagate new posts, blogs, microblogs, images, files, etc. Connected to Fediverse, where other registered or anonymous users, may converse.


For easier administration, a single system that connects new website content, including posts, images, links. Such that updating new content automatically shares with rest of Internet or Fediverse.

For easier propagation of ideas and content to maximum netizens, using simple, consistent interface.


; Hubzilla ; Drupal (with addons for ActivityPub) 


; new frames ; Vogon Deco ; Art Deco style, including fonts

In Vogon Deco, the P/T now also acts like Mana Cost. Use Mana Cost and P/T to display symbols in fixed positions on the card. Use space in Mana Cost or P/T to levae a position blank and advance to the next position. Mana Cost surrounds the art; P/T surrounds the rules.

Recommend you utilize Custom Mana to use your own symbols.

The symbols appear quite large, like some other CCGs. Vogon Deco is great frame if your CCG or card uses a lot of symbols. You can put even more (smaller) icons in the extra bar (which behaves like rules, so use rules syntax.)

Even for Magic, you can use icons for evergreen keywords, like flying, haste, trample, etc.


; flavor text ; allow bold text with <>


; use Stored Procedures


; tribrid mana ; i/n/f = infinite ; c/h/a = chaos (planeswalk)
One idea for pseudo-simple tables. Beforehand, user must define the number of columns they want in the table. Default is 2, if not set by user. Then every data provided just fills cell by cell, row by row. When the amount of data in a row matches the column count, then move on to next row. Until all the data is incorporated. Of course, you can make a cell empty by writing empty strings or null values.

Also must declare how many header rows. Default is 0. Likewise, if enabled, data values become header cells, filling up to the column and header row limits. (in HTML, these are TH tags.) Then the rest is normal data, filled accordingly. (in HTML, these are TD tags.) Can use empty headers.

This way, data can be as simple or complex as you want. Series of simple data can be written as a simple list of values. Complex data can be child items, declared as sub-elements.

Called ftable for fill table. Fully functional in editor.


,Header 1,Header 2
  ,complex Header3
,first column
,second column
  ,complex third column is anchor element

Ex. try messing around with this ftable in the editor. modify the attributes settings. alter the data. create simple and complex data, and empty data.

,new paragraph
,this is a span
,new link

ftable will also accept vsvtable-style header rows and captions. Note only simple headers can created this way. Header rows created this way will not count against headerRows attribute. They will append a new row of headers, but will not interrupt the filling of the cells. They could also be used to create new header rows in the middle of a table.

In fact this may be the only way to create captions for ftables.


((Header1)) ((Header2))
((Header3)) ((Header4))

Heck, try ftable or vsvtable within ftable.


,new paragraph
,this is a span
,new link
,new paragraph
,this is a span
,new link

[[Name]] {{Age}} ((Gender))
((each row of data can have different delimiter, no problem
,Hammie, 20.5, F
-Chow, Vivian-40-F
*Shena'Fu *18+5/12 *F
|Grndr-1245|21 months||

Fairy Nuff 14 K N/A
((``Guess these names :)``b))


,outside parag



; custom type icon URL

Some frames automatically display a type icon that represents the card's type. Usually shown in the top left corner of the card.

Now you can use your own type icon by providing a URL to the image. It works for all frames (except CBG Horizontal).


- lesson -
- day / night (use ##crop command to get the correct half) -

Split cards can use one or two URLS, which may be different images. Two URLS are separated by double semicolons ;; . If only one URL is given and no double semicolons, both halves get same icon.

Ex. same icons for both halves

Ex. different icons

Ex. only left half gets icon

Ex. only right half gets icon
VML now accepts VSV-style tables and lists (as opposed to complex, hierarchal). Their element tags are vsvtable and vsvlist. Basically VSV-formatted elements will begin with 'vsv' in order for libraries to recognize and treat them specially. (Otherwise, complex tables and list can be created in hierachically through the VON, like HTML tables and lists. Although maybe there could be middle ground, half-simple / complex. )

Ex. vsvlist

, ,
,hazelnut creamer
,<a href="">Sliced bread</a>
, ,

Ex. vsvtable

((``My VSV Table``r))
<<Name>> <<Sex>> <<Age>>

Ex. complex list and table in spoiler:



Created online editor to play and test VSV. Even the editor page itself was created in VML.

Obviously there's more to do to improve the editor. For one, differentiate the type of VSV content by opening header.



To make the editor page work required enhancing the code for VON function containers. Hence even scripting works inside VML.


            `var datext = document.getElementById("datext");
            `var value = datext.value;
            `var vml = VSV.mapTo.vml(value);
            `var results = document.getElementById("results");
            `results.innerHTML = "";
            `return false;

Then when we submit the form, call the function we just created:

            ,onSubmit,return onSubmit();

Therefore the editor page works purely from VML, instead of HTML.

See attached for the VML code of the editor page.
VML successfully derived from VON. First convert VSV file text into VON, then run it through VML recursive function to process it into whatever output, such as DOM. Conversion should be automatic, behind the scenes, without user interaction.

Ex. user converts VML to DOM:

myDocument = VSV.mapTo.vml(vsvText);

Example VML code in spoiler:

(( VML (VSV markup language)
(( for displaying pages, including webpages, documents, printed paper
(( use leading spaces for indentation
(( use [ ] to create and close elements
(( use < > to start and end attributes definitions

      $ To: Tove
      $ From: Jani
      $ Reminder
      $ Meeting this weekend!
         $ Don't forget!
      $ Or your ass is mine!
      $ -J

Noticeably, the elements of the documents are declared as arrays, and their tags are declared right after the opening square bracket.

The reason to use arrays is to allow unnamed text fragments to append easily. Object containers would not work, as they demand named keys. Keys with identical names would overwrite one another; thus losing data. Or have the user keep track of key names to ensure they don't repeat; however that is just not feasible expectation.

Previously, array under array did not save their key name. That is, something like

the p would just be ignored and lost forever. Fortunately, now the p is saved under key 'tag' in the object that represents and encapsulates the array. Remember, instead of straight array, we used an object to represent the array, and saved its children under object.tots. Well now, we can also save the lost key into something like object.tag. That way we can reference the key or tag later. BTW the tag should be saved in the child array's representative object.

Next to do is special handling of tables and list. To read the simple format of those data. Special tags: vsvTable, vsvList. But also allow more complex tables, list? How to mix simple and complex?
Re: VON attributes and children

VON containers (objects, arrays, functions) can have both attributes and children items. Thus they must be differentiated at the programming level. However this does not affect or change how VON is written. (Similar to how HTML is converted to DOM, doesn't change the rules of HTML.)

One way to differentiate attributes (atts) and children (tots) is for a parent container to have two implicit subcontainers, called tots and atts. (Sounds funny, but serious.) That will provide direct, unambiguous access to either when needed.

Apparently atts is an object that holds all the attributes. While tots, being the same container type as the parent container, holds all the children items. 

If parent container is array, then index 0 holds atts, and index 1 holds tots. Thus array[0] = {}, and array[1] = [].

If parent container is object, then keys "tots" and "atts" will hold respective data. Thus object.atts = {}, and object.tots = {}.

If parent container is function, atts are the arguments, and tots are the code block. Thus function(atts) {tots}.

A better way to represent arrays programmatically is actually as an object. It has atts as an object, and tots as an array. Nevertheless, the underlying code doesn't alter the VON definition of array.

So to quickly differentiate between arrays and objects in code, we also predefine a key called "vontype", which can be consulted as need. That is, a new array child may be defined in the code as { atts:{}, tots:[], vontype:"array"}; while a new object child may be defined in the code as { atts:{}, tots:{}, vontype:"object"}

Slight difference, but will be easier to manipulate the arrays and objects.

Also consider creating classes for atts and tots, to help navigate and find the individual items or attributes (for languages that support classes). Or create such static helper functions.

If necessary, parent objects and arrays may (in the future) contain other items besides atts and tots, especially at the programming level. For instance, maintaining a value of how deep into the hierarchy, to do stuff like indentation. Thus atts and tots would be safe from future expansion.
How to approach a VSV-style markup languauge? So many out there: HTML/DOM, PDF/PS, TeX, Markdown, Wiki, OpenDocument .odf, etc.

  • simple, yet extensible
  • allow styling and scripting
  • headers, footers, titles, lists, tables, paragraphs, pages
  • fonts
  • embedded, media, images, video, audio, other documents
  • hyperlink
  • table of contents, annotations, bookmarks, etc.
  • printing
  • math, scientific
  • viewable from browser, like HTML, including plugin, library
    • probably just convert to DOM
  • compressable? archived?
  • metadata, title, author, language, encoding, doctype, copyright
  • variables, labels, references, functions
  • input mode, document, table, list

More sensible idea: use VON instead? In fact, many markup languages actually resemble hierarchical nature, with attributes and children items -- including XML (.odf, .html, ebooks), TeX, PS, etc. See also next post on how to handle tots and atts.

Under VON, the only thing that matters is giving the elements explicit names. For instance, paragraphs in HTML are <p></p>, but TeX uses \par

Now VSV tables can have captions. Captions for a VSV table can be created in header fields when preceded by double ticks ``. A second double-ticks will signify the position of the caption. Use 'lcr' to align the caption left, center, or right, respectively. Use 'tb' to place the caption above or below the table, respectively. The default is 'ct'. A table may have more than one caption.

((``Demo Caption``r)

will align the caption to the right.
Official VSV webpage @
VSV as PHP library

vsv class in PHP
 mapToArray  each row is saved in array. mainly helper function for other map functions
 mapToHash  each data row is saved as key => value
 mapToAtomic  each data value is saved in linear array
 mapFromVon  convert to PHP object

PHP handles arrays, stacks weirdly. Solution: recursively create objects and arrays.


// beforehand, use curl or file_get_contents to retrieve text
$text = @curl_exec($ch);
$vsv = new vsv($text);
$output = $vsv->mapToHash();


; new frame ; Vogon Biz ; make your own business cards

Vogon Biz card options:
FieldOutputNote or example


; custom mana ; now accepts URL to file ; VSV or JSON

* In VSV, each data row holds exactly two values. The first value is the mana code. The second value is the URL to the image.

* In JSON, each key is the mana code, and each value is the URL to the image.



VON now allows inline objects.

What are objects? Objects contain pairs of data such that a key is associated with a value.

Some objects do not contain children objects or arrays. Thus one should be able to write simple objects in a very simple manner. Hence inline objects.

So we devise several ways to write inline objects in VON:

1. Inline objects with no children that are arrays or objects, and whose parent is an array.

All key=value pairs are written on one line, in between curly braces {}. A second delimiter must be introduced inside these braces, and separate each item. Note the second delimiter must come after the opening brace, but precede the first item. Space cannot be delimiter.


In this example, the comma is used as the second delimiter. In JSON this is equivalent to:

      "key1": "value1",
      "key2": "value2"

2. Inline object with no children that are arrays or objects, and whose parent is an object.

These are the same as inline object described above in part 1. Except the first item becomes a key for the parent object, and is excluded from the rest.


In this example, the new object is referenced via "inlineobject" from its parent. In JSON this is equivalent to:

   "inlineobject": {
      "under": "object",
      "key2": "value2"

VON now allows inline arrays.

What are arrays? Arrays are lists with indexes that are automatically incremented by one for each item in the list.

Unlike objects, these indexes do not have to be predefined. Therefore, one should be able to write lists in a very simple manner. Hence inline arrays.

However some arrays may cantain children that are themselves arrays or objects. These cannot be written as simple inline arrays.

So we devise several ways to write arrays in VON:

1. Inline array with no children that are arrays or objects, and whose parent is an array.

All list items are written on one line, in between square brackets []. A second delimiter must be introduced inside these brackets, and separate each item. Note the second delimiter must come after the opening bracket, but precede the first item. Space cannot be delimiter.

Ex. [parent

In this example, the comma is used as the second delimiter.

2. Inline array with no children that are arrays or objects, and whose parent is an object.

These are the same as inline array described above in part 1. Except the first item becomes a key for the parent object, and is excluded from the list.

Ex. {parent

In this example, the array is referenced via "key" from its parent. In JSON this is equivalent to:

   "key": [item1, item2, item3]

3. General array that can cover all cases, whether children are arrays or objects or neither.

Children that are arrays or objects are declared as you would normally, using the appropriate brackets.

Children that are neither are put in rows with delimiters except brackets. One or more items can be put in the same row.

Inline arrays can also be put on their own rows.

Ex. Array with mixed children


Note the difference between the last two lines. The line ",more,data,in,this,row" creates a new index for each item separated by delimiter. But the next line "[,inline,array]" creates a single item child that is a subarray.

An output to debug this array may look something like this:

0  [0,5,2]
1  { "hp": 51, "str": 43}
2  loner
3  more
4  data
5  in
6  this
7  row
8  [inline,array]


; new mana symbols ; hybrid Phyrexian ; tribrid
; new mana format ; A/B/C

* type hybrid Phyrexian and tribrid symbols in any order:

p/b/r = r/b/p = b/p/r , etc.

u/b/r = r/b/u = b/u/r , etc.


; hybrid colorless + colored mana ; {c/d}

ex. {c/w} and {w/c} are equivalent. this creates a mana cost that can be paid with colorless mana or white mana

What is the relationship between typing effort and speed?

Consider typing speed is measured in karas per second, notated as K/T. So how does effort figure into this?

Consider when comparing keyboard layouts, ideally a typist can achieve higher speeds with lower effort. Therefore effort is inversely proportional to speed.

So E = T / K. Alternatively, T = E * K, and K = T / E.

When comparing different layouts or speed typing challenges, K is kept as a constant to remain fair between layout or typist. Hence we are only interested in the first two equations.

Then effort can be converted into time, and vice versa.

Most layout comparisons mainly measure the efficiency or ergonomics of a layout, finalized into a single value as effort. They believe that layouts that are more ergonomic would expend less effort from the typist. Therefore, a lower effort value means a better, more efficient layout.

If we agree to that principle, then we can use the results of layout comparisons to arrive at a time value. Since T = E * K, and we assume K is constant, then we can derive and compare the time spent by the layouts in a hypothetical typing test based on the results of their effort values.

This contrived time value can be converted back into typing speed, K/T, for each layout. Since the typing speed is more pertinent when typists do speed typing tests.

Now let's extrapolate what this time measurement means for typists. For one, it means that typists can type the same corpus in less time under more efficient, less effortless layouts.

Secondly, typists can learn a better layout in shorter time, theoretically. They may also achieve higher typing speeds in shorter time needed to learn and practice the more effortless layouts.

Created Gab account and group to showcase cards created with Shena'Fu's online card creator.

"ShenaFusCardCreator" is user account:

"Custom Card Creations" is group name:
* Group is not restricted to this specific card creator. Anyone may showcase cards created from any online or offline card creator.
2020/05 - 2021/12

; legendary names ; text color enhanced
; new color option ; Blend ; for 2 or 3 colors
; hybrid mana 2/c
; playing card ; color = background color
; card importer ;
; replace CARDNAME with card's name
; ccrand ; allow creator field
; vogongc ; blend left half too
; flavor text ; regular font inside brackets []
; playing frames ; extra becomes title
; Overlay URL to image
; alias ; retain cursor position
; seticon ; new options ; keep ratio ; align right
; cardfuncs ; `` backticks = store and restore blocks of text, card traits
; leveler ; print flavortext
; split cards ; each half watermark, overlay
; PW rules text proportional to num abilities
; shade rules box partitions ; pw, levelers
; card type ; Avatar
; escape kara '\'
; card list ; form to input creator
; VOGON Split ; add flavor text, extras ; frame color from extra 2nd, 3rd text split
; custom mana ;
; over 146,000 cards created


; added new frame ; Vogon VT ; for vertical art, like Saga

Saga syntax like Levelers. Use double semicolon ;; to create subsections, inside P/T and rules text.


; new image manipulation command ; ##pad,direction,amount,color
; new image manipulation command ; ##tint,color
VPL now calculates equations. Enclose equal sign = and the equation in double brackets.

for instance, to shift or adjust discrepancy between file ID and episode number.

(( Example:
(( Recommended method below, using variables to store equations
`tAll`Girls High School Mystery Class`{{{{:newid}}}}
Some new thoughts (also posted on GameFAQs):

[[Meat drop from bosses]]

Another idea just came up. What if world bosses dropped meat? Mutants may learn one of the boss's skill, and monsters may get strong DS upgrade. (Perhaps another DS B meat? From Apollo or Minion.) Actually this only works safely for bosses who don't use weapons and armors, namely Ashura, Venus, Minion, and Apollo. (Unless I filter out weapons before granting to Mutants. Actually, does that sound neat, for Mutants to pick up items this way?)

Quote[[Human bonus]]

Then how to make Humans stand out? I could grant bonuses for certain weapon types, like Robots with guns. (But this requires more space in the code, which is already very crowded.) Specifically bonus to melee weapons (cf. ranged weapons for Robots). Either better hit chance or more damage or both. For daggers, bonus chance for extra hits.

Quote[[Monster starters]]

Are you satisfied with the starter monsters? Originally Slime, Baby-D, Imp. Now in v 6.0alpha, Snapper (Tortoise) and Imp (Fiend). Where Snapper is physical bruiser and imp magical damage and ailment. Should they be replaced?

I'm thinking of changing it up. In addition that one class B and one class C, would hint or foreshadow as the same family of monsters that are also excellent choices in the end game. With the following criteria to balance both starters:

(1) Magical support. Has Cure and damaging spell.

(2) Physical bruiser. Has strong single attack and self-defense.

#1 is very apparently a mini-Sprite (call it "Pixie"). class C. Gets Gust, Cure, O-Float.

#2 would then be class B. Several candidates families:

- Woodman - "Golem" - Strike, Blow Up
- WereRat - "Kitsune" - Strike, Recover
- Rhino - "Armodilo" - Strike, Defend
- Zombie - "Corpse" - Bash, PoiSkin

I'd probably replace Snapper & Imp with ... Pixie & Kitsune. Great survival in the now-harsher First World.

Does this change sound good?

Quote[[Monster difficulty]]

Difficulty is proportionate in this game. Players want their own monsters to be stronger. But that means enemies also get stronger. Since they are one and the same.

So the spike of difficulty in the First World is a natural consequence of boosting early monsters for your own party's usage.

Another line of thinking is whether early monsters should get attacks that target group, sweep, or all enemies. On one hand it will benefit your own monsters to kill easier and faster when enemies arrive in hordes. On the other hand, enemy monsters could also kill your party faster, too, as they deal damage to multiple party members simultaneously.

Although as you hinted, we could raise the monsters' prowess as above, meanwhile reduce the sizes of enemy groups per encounter. Theoretically aggregate power of enemy encounters remains the same, but individual monsters (that is for your party) get relatively higher value. Since the difference in army size between your party versus the enemies narrows. (Because it can seem unfair, if like ten enemies get to go first before one of your party member does.)

Quote[[Magi reimagined]]

Do magi need to be reviewed and enhanced?

- Additional utilities? along the lines of Warning, Surprise, Recover ...
- More elements? This would dilute the existing elemental Magi ...
- Unless one magi holds two different elements. so 4 magi covers all 8 elements ... (because not enough room in database for new items?)
- Remember magi enhances elemental spell damage and defense against that element, and grants ailment immunity associated with that element

- possible pairings by theme. Preferably rename them with single words, preceded by Magi icon -- here denoted by parentheses ():

((in-game hex code matches))
= ()Soil = Bio/Qua = 0x11
= ()Torrent = Sto/Wea = 0x22
= ()Stasis = Ice/Pet = 0x44
= ()Temper = Fir/Psy = 0x88

((ailment immunity))
= ()Inferno = Fir/Sto = weak, blnd = reduces stats
= ()Death = Pet/Wea = petr, stun = instant death
= ()Paralyz = Ice/Psy = froz, slep = can't move
= ()Soil = Bio/Qua = pois, conf = other

((element opposition))
= ()Heat = Fir/Ice = hot/cold
= ()Gravity = Sto/Qua = air/ground
= ()Force = Wea/Psy = physical/mental
= ()Matter = Pet/Bio = stone/life

Which group do you prefer? Opposite elements is most intuitive. Ailment immunity is easier to use defensively. Hex code is easier to code, and somewhat "random".

Quote[[Targeting Icons]]

Should make new icons to denote the targeting type, that would aid players' decisions:
= single = dot
= sweep = arrows left-right
= group = arrows up-down
= all = arrows 4-directions

Image gallery service (Piwigo) installed on this webhost. For private and shared images. Registered users can create albums, tags and edit images, etc. Granular security and permission levels for each album and image. Admins can set various sizes, and visitors can download images at given sizes. Visitors can comment and rate images.

Instructions: Set up Piwigo on your own webhost server. Softaculous should have this software, for easy installation. Hundreds of plugins to extend functionality.

View Vogon Gallery