cyrillbolliger / imagery

Webapp to create images in the corporate design of the GREENs of Switzerland. Just another school project πŸŽ’

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

ARCHIVED

Developement is now continued by gruene.ch on their own fork. See grueneschweiz/imagery.

Imagery

Easily generate images in the corporate design of the swiss GREENS.

What?

This tools aims to provide a simple way to generate images conforming the corporate design rules. It's designed to be so simple to use, that no further instructions are needed and no corporate design rules can be broken.

Why?

Not everybody has the software and skills to create corporate design images on his own. And it's not everybodys hobby to learn all the rules of the corporate design.

Single-Sign-On

Read the dedicated docs.

Contributing ...

... is cool, simple and helps to make the 🌍 a better place 🀩

Getting started

  1. Install docker and docker-compose.
  2. Clone this repo git clone https://github.com/cyrillbolliger/imagery
  3. cd into the folder containing the repo
  4. Execute bash install.sh and have a β˜•οΈ while it installs.
  5. Visit localhost:8000/
  6. Use superadmin@user.login and password to login.
  7. As the font used in the corporate design is proprietary, you'll need to get a licenced copy of the Sanuk font (fat and bold). Store it as follows:
    storage
      |-- app
          |-- fonts
              |-- SanukOT-Bold.otf
              |-- SanutOT-Fat.otf
    
  8. The indesign templates bundles for the logo suffer the limitations of the proprietary Sanuk font as well. If you've got a licenced copy of the Sanuk font, we can provide you the bundles. Store them as follows:
    storage
      |-- app
          |-- vector_logo_templates_indesign
              |-- gruene
                  |-- ...
              |-- gruene-les-vertes
                  |-- ...
              |-- les-vertes
                  |-- ...
    

The Stack

Using a Lamp stack on docker, the tool is built with Laravel. The frontend is built with VueJS and the image processing is done with the canvas element. It's all bundled by Webpack using Laravel Mix. Have a look at the package.json if you want to dig deeper.

Tooling

Docker Cheat Sheet

  • Start up: docker-compose up -d
  • Shut down: docker-compose stop
  • Execute CLI commands (enter container): docker exec -it imagery bash. Use exit to escape the container.

PHPUnit

All tests are based on PHPUnit. It may be used as follows:

  1. Make sure your containers are up and running.
  2. Run docker exec imagery vendor/bin/phpunit.

MySQL

Use the handy phpMyAdmin or access the mysql CLI using docker exec -it imagery_mysql bash -c 'mysql -u${MYSQL_USER} -p${MYSQL_PASSWORD} imagery'

Node / Yarn / Webpack

The node container is watching the js, css and scss files and building the assets.

  • Access the watching container using docker exec -it imagery_node bash.
  • Get the build output docker attach imagery_node.

Composer

The PHP Composer runs directly on the imagery container.

  • Access it using docker exec imagery composer YOUR_COMPOSER_SUBCOMMAND.

Mailhog

All mail you send out of the application will be caught by Mailhog. Access it on localhost:8020

Crowdin

All translation is done with crowdin. To translate in-context visit localhost:8000/?translate=true&lang=zu.

Logins

Logins created by the demo seeder:

  • superadmin@user.login:password
  • countryadmin@user.login:password
  • cantonadmin@user.login:password
  • localuser@user.login:password

Github Actions

We use actions to test the application (and maybe in the future to automate the crowdin workflow).

proprietary.tar.gz.enc

The tests rely on the proprietary fonts. Bundle them using the following command (executed in the project root):

tar -zcv \
    storage/app/fonts \ 
    storage/app/vector_logo_templates_indesign \
    | openssl enc \
      -e -aes256 \
      -md sha512 \
      -pbkdf2 -iter 100000 \
      -pass file:proprietary.key \
      -out proprietary.tar.gz.enc

The files will be automatically decrypted by the Add proprietary files step (cf. .github/workflows/tests.yml). The key is stored as a repository secret.

To decrypt and unpack the bundle manually:

openssl enc \
    -d -aes256 \
    -md sha512 \
    -pbkdf2 -iter 100000 \
    -pass file:proprietary.key \
    -in proprietary.tar.gz.enc \
    | tar -xzv

About

Webapp to create images in the corporate design of the GREENs of Switzerland. Just another school project πŸŽ’


Languages

Language:PHP 66.8%Language:Vue 30.2%Language:Blade 1.4%Language:Shell 1.4%Language:Dockerfile 0.3%