ExMods
/
html-site

<!DOCTYPE html>

<html lang="en">
  <head>
    <meta name="theme-color" content="#fdce72" />
    <meta name="author" content="NGnius" />
    <meta name="keywords" content="pixi,exmods,gamecraft,modding,mod" />
    <meta name="og:type" content="website" />
    <meta name="og:title" content="Pixi" />
    <meta name="og:description" content="Pixi mod for Gamecraft" />
    <meta name="description" content="Pixi mod for Gamecraft" />
    <meta name="og:image" content="../../mods/Pixi/pixi-logo.png" />
    <meta name="og:url" content="https://www.exmods.org/mods/Pixi" />
    <meta charset="UTF-8" />
    <link rel="icon" href="../../mods/Pixi/pixi-logo.png" type="image/x-icon"/>
    <link rel="shortcut icon" href="../../mods/Pixi/pixi-logo.png" type="image/x-icon"/>
    <!--<link rel="stylesheet" href="../../mods/Pixi/style.css" type="text/css" />-->
    <style type="text/css" style="display: none;" rel="stylesheet">
    body {text-align: left; background-color: #8a704e; animation-name: background-fade-in; animation-duration: 3s;}
    footer {text-align: right; width: clamp(100px, 96%, 1600px); border: 4px; border-style: solid; border-color: #d98c61; margin: auto; background-color: #ffd072; animation-name: foreground-fade-in; animation-duration: 3s;}
    .content-wrapper {width: clamp(100px, 96%, 1600px); padding: 0; margin: auto; border:0px; border-left: 4px; border-right: 4px; border-style: solid; border-color: #d98c61; background-color: #ffd072; animation-name: foreground-fade-in; animation-duration: 3s;}
    .content-title {text-align: center; font-size: 400%; font-weight: bold; padding-top: 1%;}
    .content-subtitle {text-align: center; font-size: 150%; vertical-align: middle;}
    .content-header {text-align: left; padding: 1%; padding-left: 12%; padding-top: 2%; font-size: 250%; vertical-align: middle; font-weight: bold; background-image: linear-gradient(to right, #d98c61FF, #ffd07200, #ffd07200);}
    .content-img-header {text-align: left; padding-left: 12%; padding-bottom: 1%; margin-top: -5%; font-size: 250%; vertical-align: middle; font-weight: bold;}
    .content-text {padding: 1%; line-height: 142%;}
    .tab { margin-left: 40px; }
    /* I feel like such a kid messing around with animations */
    @keyframes background-fade-in { from {background-color: #ffd072;} to {background-color: #8a704e;}}
    @keyframes foreground-fade-in { from {border-color: #8a704e;} to {border-color: #d98c61;}}
    @keyframes swoop { from {bottom: -50%;} to {bottom: 110%;}}
    </style>
    <title>Pixi</title>
  </head>
  <body>
    <div class="content-wrapper">
        <div style="width: 100%; background-image: linear-gradient( #FFFFFF00, #FFFFFF00, #ffd072FF ), url('../../mods/Pixi/pixi-world1-1-banner.png'); background-size: 100%; background-position: bottom; background-repeat: no-repeat;">
        <img src="../../mods/Pixi/pixi-world1-1-banner.png" width="40%" style="visibility: hidden;" />
        <div class="content-title" id="pixi-title">
            <div style="text-align: center;">
                <img src="../../mods/Pixi/pixi-logo.png" width="8%" style="vertical-align: middle;" />
                <span style="vertical-align: middle;">Pixi</span>
                <img src="../../mods/Pixi/pixi-logo.png" width="8%" style="vertical-align: middle; -webkit-transform: scaleX(-1); transform: scaleX(-1);" />
            </div>
        </div>
        <div class="content-subtitle">
            <span>Convert images, Robocraft bots and more into Gamecraft blocks.</span>
        </div>
        </div>
        <div class="content-text" id="pixi-intro-p">
            <p><span class="tab"></span>
            Pixi adds two new commands,
            <i><b>Pixi</b></i> and <i><b>Pixi2</b></i>,
            to Gamecraft's command line to import images, and other stuff, into a game.
            Since Pixi places vanilla Gamecraft blocks, imported files should be visible without Pixi installed.
            See the background image above this?
            That's a picture of Super Mario Bros World 1-1 in Gamecraft using the <i>Pixi</i> command for image importing.
            </p>
        </div>
        <div class="content-header" id="pixi-installation">
            <img src="../../mods/Pixi/pixi-logo.png" width="4%" style="vertical-align: middle;" />
            <span style="vertical-align: middle;">Installation</span>
        </div>
        <div class="content-text" id="pixi-installation-p">
            <p><span class="tab"></span>
            Download and run <a href="https://git.exmods.org/NorbiPeti/GCMM/releases">GCMM</a>, then select and install Pixi from the menu.
            </p>
            <p><span class="tab"></span>
            ADVANCED USERS (old way): Before installing Pixi, please patch Gamecraft with
            <a href="https://git.exmods.org/modtainers/GCIPA/releases">GCIPA</a> and install the latest version of
            <a href="https://git.exmods.org/modtainers/GamecraftModdingAPI/releases">GamecraftModdingAPI</a>.
            
            Once that's done, download <a href="https://git.exmods.org/NGnius/Pixi/releases">Pixi's latest release</a>
            and then copy <i>Pixi.dll</i> into the Plugins folder in Gamecraft's main folder.
            Alternately, follow the <a href="https://www.exmods.org/guides/install.html" title="link to installation guide">install guide</a>
            (ignore the part about a zip file -- move <i>Pixi.dll</i> into the Plugins folder instead).
            </p>
        </div>
        <div style="width: 100%; background-image: url('../../mods/Pixi/rc-pixi-gc2.png'); background-size: 100%; background-position: bottom; background-repeat: no-repeat;">
        <img src="../../mods/Pixi/rc-pixi-gc2.png" width="100%" style="visibility: hidden; vertical-align: middle;" />
        <div class="content-img-header" id="pixi-robots">
            <img src="../../mods/Pixi/pixi-logo.png" width="4%" style="vertical-align: middle;" />
            <span style="vertical-align: middle;">Robot Importing</span>
        </div>
        </div>
        <div class="content-text" id="pixi-robots-p">
            <p>
            <i><b>Pixi "[bot search text]"</b></i> downloads the first search result from Robocraft's community Factory and places it beside you.
            <br/><br/>
            <i><b>Pixi2 "robot" "[bot search text]"</b></i> is the more verbose equivalent.
            </p>
            <p><span class="tab"></span>
            In the previous commands, anything between (and including) <i><b>[</b></i> and <i><b>]</b></i> is a command argument that you must replace.
            Do not remove the quotation marks -- those are required for the command to work.
            These commands also have a hidden scaling property which is set to 3 by default.
            Changing the scaling will disable conversion for all Robocraft blocks except simple blocks.
            </p>
            <p><span class="tab"></span>
            For example, if you want to import a robot from the CRF called Pixi Art, execute the command <span style="display:inline-block;"><i><b>Pixi "Pixi Art"</b></i></span> to load the robot into your Gamecraft game world.
            </p>
            <p><span class="tab"></span>
            Under the hood, robot importing reads the Robocraft robot save format from the <a href="https://factory.robocraftgame.com/">CRF</a> and places the equivalent Gamecraft blocks.
            For blocks which are in Gamecraft and Robocraft (full cubes, prisms, etc.), direct conversion occurs.
            If a block does not have a single-block equivalent in Gamecraft, the conversion algorithm will attempt to substitute in an existing blueprint for the block.
            Failing that, a text block with the name of the Robocraft block will be placed in its place.
            Currently Pixi comes with blueprints for struts, rods and wheels, but support for more blocks is ongoing.
            If you'd like a certain block blueprint to be added to Pixi, please contact NGnius on the <a href="https://discord.exmods.org">Exmods Discord server</a>.
            </p>
        </div>
        <div style="background-image: url('../../mods/Pixi/img-pixi-gc2.png'); background-size: 100%; background-position: bottom; background-repeat: no-repeat;">
        <img src="../../mods/Pixi/img-pixi-gc2.png" width="100%" style="visibility: hidden; vertical-align: middle;" />
        <div class="content-img-header" id="pixi-images">
            <img src="../../mods/Pixi/pixi-logo.png" width="4%" style="vertical-align: middle;" />
            <span style="vertical-align: middle;">Image Importing</span>
        </div>
        </div>
        <div class="content-text" id="pixi-images-p">
            <p>
            <i><b>Pixi "[image filename]"</b></i> and equivalently <i><b>Pixi2 "canvas" "[image filename]"</b></i> convert an image to coloured blocks and places it beside you.
            High-opacity (>75%) pixels are converted to the block you're holding, medium-opacity (>50%) pixels are converted to glass and low-opacity (<50%) pixels are skipped.
            <br/><br/>
            <i><b>Pixi2 "text" "[image filename]"</b></i> converts an image to text and places a text block with that text beside you.
            <br/><br/>
            <i><b>Pixi2 "console" "[image filename]"</b></i> converts an image to text and places a console block beside you which changes the specified text block.
            </p>
            <p><span class="tab"></span>
            In the previous commands, anything between (and including) <i><b>[</b></i> and <i><b>]</b></i> is a command argument that you must replace.
            Do not remove the quotation marks -- those are required for the command to work.
            These commands assume that the specified image is in the same folder as Gamecraft.
            If your image is in a different folder, please provide the full filepath (eg C:\path\to\image\my_image.png) and put a @ before the quotation marks.
            The <i><b>Pixi</b></i> coloured block feature also has a hidden rotation property.
            By default, the image will be placed along the xy-plane (rotation 0,0,0).
            </p>
            <p><span class="tab"></span>
            For example, if you want to import an image called <i>pixi_art.png</i> that's stored in Gamecraft's installation directory, execute the command <span style="display:inline-block;"><i><b>Pixi "pixi_art.png"</b></i></span> to load the image as blocks.
            It's important to include the file extension, since Pixi isn't capable of black magic.
            </p>
            <p><span class="tab"></span>
            Image to blocks conversion with <i><b>Pixi</b></i> or <i><b>Pixi2 "canvas"</b></i> read a file in PNG or JPG format and converts every pixel to the nearest Gamecraft block colour.
            Adjacent blocks with the same colour are converted into a single scaled block to reduce the performance impact from larger images.
            The combination of colour quantization and optimisation usually results in a 50-75% reduction in block count for an image (compared to 1 block per pixel).
            </p>
            <p><span class="tab"></span>
            Image to text conversion with <i><b>Pixi2 "text"</b></i> and <i><b>Pixi2 "console"</b></i> converts every pixel from a PNG or JPG image file into a coloured square text character.
            This process does not optimise for similar adjacent pixels, so images will become more than 10x larger when converted to text.
            As a result, images larger than 64x64 pixels are very likely to cause issues with Gamecraft performance and stability.
            To ensure that everyone can enjoy your game, and to avoid save corruption, use Pixi's image to text commands sparingly and only for small images.
            </p>
        </div>
        <div class="content-header" id="pixi-commands">
            <img src="../../mods/Pixi/pixi-logo.png" width="4%" style="vertical-align: middle;" />
            <span style="vertical-align: middle;">Pixi vs Pixi2</span>
        </div>
        <div class="content-text" id="pixi-commands-p">
            <p><span class="tab"></span>
            To make your life easier, <i><b>Pixi</b></i> and <i><b>Pixi2</b></i> guess what you want to do so you don't have to memorise niche incantations.
            To accomplish this, <i><b>Pixi "[thing]"</b></i> uses the thing to guess what to do.
            In the background, Pixi uses sneaky info like the file extension (or lack thereof) to guess correctly.
            Similarly, <i><b>Pixi2 "[spell]" "[thing]"</b></i> uses the spell to guess what to do.
            Behind the scenes, every importer has a name which Pixi uses to match the spell to a caster.
            </p>
        </div>
        <div class="content-header" id="pixi-dev">
            <img src="../../mods/Pixi/pixi-logo.png" width="4%" style="vertical-align: middle;" />
            <span style="vertical-align: middle;">Development</span>
        </div>
        <div class="content-text" id="pixi-dev-p">
            <p><span class="tab"></span>
            You don't have to be a developer to help out! Please read the <a href="https://git.exmods.org/NGnius/Pixi#user-content-development">Development section</a> of Pixi's README if you're interested in contributing to Pixi.
            </p>
        </div>
        <div class="content-header" id="pixi-ack">
            <img src="../../mods/Pixi/pixi-logo.png" width="4%" style="vertical-align: middle;" />
            <span style="vertical-align: middle;">Acknowledgements</span>
        </div>
        <div class="content-text" id="pixi-ack-p">
            <p><span class="tab"></span>
            PixiBot uses the Factory to download robots, which involves a partial re-implementation of
            <a href="https://github.com/NGnius/rcbup">rcbup</a>.
            Robot parsing uses information from
            <a href="https://github.com/dddontshoot/RoboCraftAssembler">RobocraftAssembler</a>.
            </p>
            <p><span class="tab"></span>
            Gamecraft interactions use the <a href="https://git.exmods.org/modtainers/GamecraftModdingAPI">GamecraftModdingAPI</a>.
            </p>
            <p><span class="tab"></span>
            Thanks to <b>TheGreenGoblin</b>, who created the Python app for converting images to coloured square characters which inspired the <i><b>Pixi2 "console"</b></i> and <i><b>Pixi2 "text"</b></i> commands.
            </p>
            <p><span class="tab"></span>
            Thanks to <b>Mr. Rotor</b> for all of the Robocraft blocks used in the <i><b>Pixi2 "robot"</b></i> command.
            </p>
        </div>
        <div class="content-header" id="pixi-disclaimer">
            <img src="../../mods/Pixi/pixi-logo.png" width="4%" style="vertical-align: middle;" />
            <span style="vertical-align: middle;">Disclaimer</span>
        </div>
        <div class="content-text" id="pixi-disclaimer-p">
            <p><span class="tab"></span>
            Pixi, Exmods and NGnius are not endorsed or supported by Gamecraft or FreeJam. Modify Gamecraft at your own risk.
            Read the <a href="https://git.exmods.org/NGnius/Pixi/src/branch/master/LICENSE">LICENSE</a> file for licensing information.
            Please don't sue this project or its contributors (that's what all disclaimers boil down to, right?).
            <br />
            For more information, refer to Pixi's source repository: <a href="https://git.exmods.org/NGnius/Pixi">https://git.exmods.org/NGnius/Pixi</a>
            <br /><br />
            Pixi is not magic and is actually just sufficiently advanced technology that's indistinguishable from magic.
            </p>
        </div>
    </div>
    <footer>
        <div style="padding: 0.5%; padding-left: 1%; padding-right: 1%;">
        Pixi is developed by <a href="https://twitter.com/NGniusness">NGnius</a>|hosted on exmods.org|<a href="https://git.exmods.org/ExMods/html-site">Site Repository</a>|<a href="https://exmods.org">Home</a>|<a href="https://discord.gg/2CtWzZT">Discord</a>|<a href="https://twitter.com/GamecraftMods">Twitter</a>
        </div>
    </footer>
    <!-- Ssshhhh! Sneaky stuff -->
    <div id="pixi-flight" style="position: relative; animation-name: swoop; animation-duration: 0.75s; bottom: 500%; text-align: center;">
     <img src="../../mods/Pixi/pixi-double.png" width="33%" />
     <script>var pfa = document.getElementById("pixi-flight"); pfa.addEventListener("webkitAnimationEnd", () => {pfa.style.display = "none"}); pfa.addEventListener("animationend", () => {pfa.style.display = "none"});</script>
    </div>
  </body>
</html>