From c0e2549ca44da5a876cd10b1ac948078e7fcfddd Mon Sep 17 00:00:00 2001 From: Maharshi Patel Date: Tue, 7 Jan 2025 12:08:55 +0530 Subject: [PATCH 1/3] chore: update README.md --- README.md | 144 ++++++++++++++++++++++++++---------------------------- 1 file changed, 68 insertions(+), 76 deletions(-) diff --git a/README.md b/README.md index ae24f37..0be09e2 100644 --- a/README.md +++ b/README.md @@ -1,109 +1,83 @@ -# Print Designer -
+
-![ Print Designer Logo ](print_designer/public/images/print-designer-logo.svg) + + Print Designer Logo + -
-
- -## Frappe app to design print formats using interactive UI. - -![](https://github.com/frappe/print_designer/assets/39730881/aa62d2e2-e25e-4803-afbc-d3eaf1e4840f) - -
- -## Features and How to Guides -
-

Create Print Format

 - -#### Using Awesomebar -https://github.com/frappe/print_designer/assets/39730881/913649cf-84f6-4284-b373-0997aaa3e356 +

Print Designer

-#### Using Print Page +**Frappe app to design print formats using interactive UI.** -https://github.com/frappe/print_designer/assets/39730881/502a3e29-8bb5-4ec7-bfda-eaa85505acec -
-
-

Static & Dynamic Image

 -#### Static Image +![GitHub release (latest by date)](https://img.shields.io/github/v/release/frappe/print_designer) -https://github.com/frappe/print_designer/assets/39730881/4d73d720-2de4-4d0a-9435-f924b8de3b7e +
+ + + Print Designer Screenshot + +
-#### Dynamic Image +[Website](https://frappe.io/print-designer) - [Documentation](https://docs.frappe.io/print-designer) +
-https://github.com/frappe/print_designer/assets/39730881/c22df30b-9e91-4e1c-9a73-51d85c149412 +## Print Designer - -
-

Static & Dynamic Text

 +Print Designer is an open-source designing tool that allows businesses to create dynamic and professional-looking print formats. If you are looking to design print formats that enhance your brand image and streamline operational efficiency, then give it a try. -#### Dynamic Text -https://github.com/frappe/print_designer/assets/39730881/e1c5a970-8df4-443d-828f-a5513fad41df +### The Story of Print Designer -#### Static Text +"Frappe Framework and ERPNext have everything included, meaning you have all you need, including print format builder. This is easy to use, and you can easily create basic formats. If you need more customisable formats with complex layouts and alignment, you must create a custom format with code, which can take days or weeks. -https://github.com/frappe/print_designer/assets/39730881/de629a8e-fbec-4449-8e03-f08346ffe460 +As everything at Frappe follows a UI-first approach, why not have a way to design complex formats from the UI without any coding? Having used Adobe Illustrator, Photoshop, XD, and Figma in the past, I wanted to create a tool that would allow users to have a very high level of freedom to customize it just the way they like it. It initially started as a side project. After gaining some initial traction, I started working on it full-time. Our vision is to enable users to create all kinds of complex print formats from invoices to product brochures If you are looking for a one-stop solution for this, we welcome you to try the Print Designer." -
-
-

Rectangle & Layouts

 +### Key Features -#### Rectangle +- ✨ **Intuitive Visual Designer:** Make formats with intuitive visual interface and get realtime feedback. +- 📱 **Dynamic Data Integration:** Add and automatically populate data to your print format from selected document and all of its linked documents. +- 🛠️ **Table Editor:** Easily create and modify your table designs with visual feedback. +- 🧑‍💻 **Scripting Capabilities:** Power users can add custom data or custom html elements. +- 📄 **Multi Page:** Design multiple pages and create even more complex designs. -https://github.com/frappe/print_designer/assets/39730881/cc3e64ce-285d-4a60-b249-a4b6dd4d2ce0 +### Under the Hood -
-
-

Child Table

 +- [Frappe Framework](https://github.com/frappe/frappe): A full-stack web application framework. -https://github.com/frappe/print_designer/assets/39730881/b9cb5db7-1336-475c-9d82-d20c3a6a903e -
+## Getting Started (Production) -## Installation > **Warning** > > Please note that print designer is only compatible with develop and V15 version of frappe framework. -### Local -To setup the repository locally follow the steps mentioned below: +### Managed Hosting -1. Install bench and setup a `frappe-bench` directory by following the [Installation Steps](https://frappeframework.com/docs/user/en/installation) -2. Start the server by running -``` -bench start -``` -3. In a separate terminal window, create a new site by running -``` -bench new-site print-designer.test -``` -4. Map your site to localhost with the command -``` -bench --site print-designer.test add-to-hosts -``` -5. Get the Print Designer app -``` -bench get-app https://github.com/frappe/print_designer -``` -6. Install the app on the site. -``` -bench --site print-designer.test install-app print_designer -``` -7. Open [http://print-designer.test:8000/](http://print-designer.test:8000/) in your browser and go through the setup wizard. +Get started with your personal or business site with a few clicks on Frappe Cloud - our official hosting service. +
+ + + + Try on Frappe Cloud + + +
-8. After the setup is complete now open [http://print-designer.test:8000/app/print-designer/](http://print-designer.test:8000/app/print-designer/) ---- -## Contributions and Community +## Getting Started (Development) -There are many ways you can contribute even if you don't code: +### Local Setup -1. You can start by giving a star to this repository! -1. If you find any issues, even if it is a typo, you can [raise an issue](https://github.com/frappe/print_designer/issues/new) to inform us. +1. [Setup Bench](https://docs.frappe.io/framework/user/en/installation). +1. In the frappe-bench directory, run `bench start` and keep it running. +1. Open a new terminal session and cd into `frappe-bench` directory and run following commands: +```bash +bench get-app print_designer +bench new-site print-designer.localhost --install-app print_designer +bench browse print-designer.localhost --user Administrator +``` +1. Access the print designer page at `print-designer.localhost:8000/app/print-designer` in your web browser. ---- ## FAQ 1. Incorrect PDF Page Size @@ -128,6 +102,24 @@ There are many ways you can contribute even if you don't code: - If error has `node-pre-gyp WARN Pre-built binaries not installable for canvas@x.x.x and node@x.x.x` it means that there aren't any pre-built binaries for your system so it will try to compile them - In order to do that you need `sudo apt-get update && sudo apt-get install build-essential libcairo2-dev libpango1.0-dev libjpeg-dev libgif-dev librsvg2-dev` +
+ +## Links + +- [Telegram Public Group](https://t.me/+beFRbDSDEgtjYmY9) +- [Discuss Forum](https://discuss.frappe.io/c/print-designer/84) +- [Documentation](https://docs.frappe.io/print_designer) + ## License [GNU Affero General Public License v3.0](license.txt) + +
+
+ + + + Frappe Technologies + + +
From af2c84581479e4e019bb22f0f1b6209e91342377 Mon Sep 17 00:00:00 2001 From: Maharshi Patel Date: Tue, 7 Jan 2025 12:25:17 +0530 Subject: [PATCH 2/3] chore: added docker configuration added docker configuration for local and production setup and updated README.md --- .github/workflows/docker-image.yml | 60 ++++++++++++++++++++++++++++++ README.md | 55 +++++++++++++++++++++++++++ docker/docker-compose.yml | 32 ++++++++++++++++ docker/init.sh | 41 ++++++++++++++++++++ 4 files changed, 188 insertions(+) create mode 100644 .github/workflows/docker-image.yml create mode 100644 docker/docker-compose.yml create mode 100644 docker/init.sh diff --git a/.github/workflows/docker-image.yml b/.github/workflows/docker-image.yml new file mode 100644 index 0000000..3c69b7a --- /dev/null +++ b/.github/workflows/docker-image.yml @@ -0,0 +1,60 @@ +name: Build Container Image +on: + workflow_dispatch: + push: + branches: + - main + - develop + tags: + - "*" + +jobs: + build: + name: Build + + runs-on: ubuntu-latest + + steps: + - name: Checkout Entire Repository + uses: actions/checkout@v4 + + - name: Set up QEMU + uses: docker/setup-qemu-action@v3 + + - name: Set up Docker Buildx + uses: docker/setup-buildx-action@v3 + with: + platforms: linux/amd64 + + - name: Login to GitHub Container Registry + uses: docker/login-action@v2 + with: + registry: ghcr.io + username: ${{ github.actor }} + password: ${{ secrets.GITHUB_TOKEN }} + + - name: Set Branch + run: | + export APPS_JSON='[{"url": "https://github.com/frappe/print_designer","branch": "${{ github.ref_name }}"}{"url": "https://github.com/frappe/erpnext","branch": "${{ github.ref_type == 'tag' || github.ref_name == 'main' && 'version-15' || 'develop' }}"}]' + echo "APPS_JSON_BASE64=$(echo $APPS_JSON | base64 -w 0)" >> $GITHUB_ENV + echo "FRAPPE_BRANCH=${{ github.ref_type == 'tag' || github.ref_name == 'main' && 'version-15' || 'develop' }}" >> $GITHUB_ENV + - name: Set Image Tag + run: | + echo "IMAGE_TAG=${{ github.ref_name == 'develop' && 'develop' || 'stable' }}" >> $GITHUB_ENV + - uses: actions/checkout@v4 + with: + repository: frappe/frappe_docker + path: builds + + - name: Build and push + uses: docker/build-push-action@v6 + with: + push: true + context: builds + file: builds/images/layered/Containerfile + tags: > + ghcr.io/${{ github.repository }}:${{ github.ref_name }}, + ghcr.io/${{ github.repository }}:${{ env.IMAGE_TAG }} + build-args: | + "FRAPPE_BRANCH=${{ env.FRAPPE_BRANCH }}" + "APPS_JSON_BASE64=${{ env.APPS_JSON_BASE64 }}" \ No newline at end of file diff --git a/README.md b/README.md index 0be09e2..a91e7e8 100644 --- a/README.md +++ b/README.md @@ -64,6 +64,61 @@ Get started with your personal or business site with a few clicks on Frappe Clou + +### Self Hosting + +Follow these steps to set up Print Designer in production: + +**Step 1**: Download the easy install script + +```bash +wget https://frappe.io/easy-install.py +``` + +**Step 2**: Run the deployment command + +```bash +python3 ./easy-install.py deploy \ + --project=pd_prod_setup \ + --email=email@example.com \ + --image=ghcr.io/frappe/print_designer \ + --version=stable \ + --app=print_designer \ + --sitename subdomain.domain.tld +``` + +Replace the following parameters with your values: +- `email@example.com`: Your email address +- `subdomain.domain.tld`: Your domain name where print designer will be hosted + +The script will set up a production-ready instance of Print Designer with all the necessary configurations in about 5 minutes. + +## Getting Started (Development) + +### Docker + +You need Docker, docker-compose and git setup on your machine. Refer [Docker documentation](https://docs.docker.com/). After that, run following command: + +**Step 1**: Setup folder and download the required files + +```bash +mkdir frappe-pd && cd frappe-pd +wget -O docker-compose.yml https://raw.githubusercontent.com/frappe/print_designer/develop/docker/docker-compose.yml +wget -O init.sh https://raw.githubusercontent.com/frappe/print_designer/develop/docker/init.sh +``` + +**Step 2**: Run the container + +```bash +docker compose up +``` + +Wait until the setup script creates a site and you see `Current Site set to print-designer.localhost` in the terminal. Once done, the site [http://print-designer.localhost:8000](http://print-designer.localhost:8000) should now be available. + +**Credentials:** +Username: `Administrator` +Password: `admin` + ## Getting Started (Development) ### Local Setup diff --git a/docker/docker-compose.yml b/docker/docker-compose.yml new file mode 100644 index 0000000..c890f91 --- /dev/null +++ b/docker/docker-compose.yml @@ -0,0 +1,32 @@ +version: "3.7" +services: + mariadb: + image: mariadb:10.8 + command: + - --character-set-server=utf8mb4 + - --collation-server=utf8mb4_unicode_ci + - --skip-character-set-client-handshake + - --skip-innodb-read-only-compressed # Temporary fix for MariaDB 10.6 + environment: + MYSQL_ROOT_PASSWORD: 123 + volumes: + - mariadb-data:/var/lib/mysql + + redis: + image: redis:alpine + + frappe: + image: frappe/bench:latest + command: bash /workspace/init.sh + environment: + - SHELL=/bin/bash + working_dir: /home/frappe + volumes: + - .:/workspace + ports: + - 8000:8000 + - 9000:9000 + - 8080:8080 + +volumes: + mariadb-data: \ No newline at end of file diff --git a/docker/init.sh b/docker/init.sh new file mode 100644 index 0000000..a448f1f --- /dev/null +++ b/docker/init.sh @@ -0,0 +1,41 @@ +#!bin/bash + +if [ -d "/home/frappe/frappe-bench/apps/frappe" ]; then + echo "Bench already exists, skipping init" + cd frappe-bench + bench start +else + echo "Creating new bench..." +fi + +bench init --skip-redis-config-generation frappe-bench --version version-15 + +cd frappe-bench + +# Use containers instead of localhost +bench set-mariadb-host mariadb +bench set-redis-cache-host redis:6379 +bench set-redis-queue-host redis:6379 +bench set-redis-socketio-host redis:6379 + +# Remove redis, watch from Procfile +sed -i '/redis/d' ./Procfile +sed -i '/watch/d' ./Procfile + +bench get-app erpnext --branch develop +bench get-app print_designer --branch develop + +bench new-site print-designer.localhost \ +--force \ +--mariadb-root-password 123 \ +--admin-password admin \ +--no-mariadb-socket + +bench --site print-designer.localhost install-app erpnext +bench --site print-designer.localhost install-app print_designer +bench --site print-designer.localhost set-config developer_mode 1 +bench --site print-designer.localhost clear-cache +bench --site print-designer.localhost set-config mute_emails 1 +bench use print-designer.localhost + +bench start \ No newline at end of file From 67410800aee41555241e0e2b9f17d78197e6a6a7 Mon Sep 17 00:00:00 2001 From: Maharshi Patel Date: Fri, 10 Jan 2025 13:40:07 +0530 Subject: [PATCH 3/3] chore: updated readme, logo and screenshot updated readme, logo and screenshot as per the feedback. --- README.md | 13 +++++-------- .../public/images/print-designer-logo.svg | 4 ++-- 2 files changed, 7 insertions(+), 10 deletions(-) diff --git a/README.md b/README.md index a91e7e8..e0169ae 100644 --- a/README.md +++ b/README.md @@ -14,8 +14,8 @@
- - Print Designer Screenshot + + Print Designer Screenshot
@@ -27,11 +27,11 @@ Print Designer is an open-source designing tool that allows businesses to create dynamic and professional-looking print formats. If you are looking to design print formats that enhance your brand image and streamline operational efficiency, then give it a try. -### The Story of Print Designer +### Motivation -"Frappe Framework and ERPNext have everything included, meaning you have all you need, including print format builder. This is easy to use, and you can easily create basic formats. If you need more customisable formats with complex layouts and alignment, you must create a custom format with code, which can take days or weeks. +Frappe Framework and ERPNext have everything included, meaning you have all you need, including print format builder. This is easy to use, and you can easily create basic formats. If you need more customisable formats with complex layouts and alignment, you must create a custom format with code, which can take days or weeks. -As everything at Frappe follows a UI-first approach, why not have a way to design complex formats from the UI without any coding? Having used Adobe Illustrator, Photoshop, XD, and Figma in the past, I wanted to create a tool that would allow users to have a very high level of freedom to customize it just the way they like it. It initially started as a side project. After gaining some initial traction, I started working on it full-time. Our vision is to enable users to create all kinds of complex print formats from invoices to product brochures If you are looking for a one-stop solution for this, we welcome you to try the Print Designer." +As everything at Frappe follows a UI-first approach, why not have a way to design complex formats from the UI without any coding? Having used Adobe Illustrator, Photoshop, XD, and Figma in the past, I wanted to create a tool that would allow users to have a very high level of freedom to customize it just the way they like it. It initially started as a side project. After gaining some initial traction, I started working on it full-time. Our vision is to enable users to create all kinds of complex print formats from invoices to product brochures If you are looking for a one-stop solution for this, we welcome you to try the Print Designer. ### Key Features @@ -165,9 +165,6 @@ bench browse print-designer.localhost --user Administrator - [Discuss Forum](https://discuss.frappe.io/c/print-designer/84) - [Documentation](https://docs.frappe.io/print_designer) -## License - -[GNU Affero General Public License v3.0](license.txt)
diff --git a/print_designer/public/images/print-designer-logo.svg b/print_designer/public/images/print-designer-logo.svg index ee3f5ce..fed04ff 100644 --- a/print_designer/public/images/print-designer-logo.svg +++ b/print_designer/public/images/print-designer-logo.svg @@ -8,8 +8,8 @@ - - + +