Skip to content

Commit

Permalink
v1 release
Browse files Browse the repository at this point in the history
  • Loading branch information
lokmanm committed Oct 13, 2023
0 parents commit 303bbe6
Show file tree
Hide file tree
Showing 131 changed files with 4,500 additions and 0 deletions.
66 changes: 66 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
# Formatic
Formatic is more than just a form builder. It's a powerful self-hosted solution designed specifically as a Statamic Starter Kit. With Formatic, you have all the tools you need to create outstanding forms that meet your unique design needs.

Our user-friendly interface and multiple design options make it easy for you to customize your forms to perfection. Whether you want to create a full-page form, a form split by sections with cards, or a multi-step form, Formatic has got you covered.

Formatic is a truly versatile tool that supports traditional text, responsive images, embedding videos, and even YouTube links. This flexibility allows you to create dynamic and engaging forms for any project.
It empowers you to own your data, host anywhere, and integrate with virtually anything. With a one-click install, you have a full-fledged form builder at your fingertips.

But it doesn't stop there. Formatic seamlessly integrates with Zapier and Pipedream, opening up a world of possibilities for integration with a wide range of applications. We've also included password protection features, so you can control access to your forms and ensure they are only used by authorized parties.

One of the standout features of Formatic is its ability to seamlessly integrate with your existing Statamic website. Even if your website is built using different technologies, you can easily incorporate Formatic into a new Statamic project and achieve a cohesive blend with your existing website design.

## Features
Here are just a few key features that make Formatic a game-changer:

- Light/Dark Mode: Cater to user preferences with an easy toggle between light and dark themes.
- 12 Predefined themes: Customize the look of your form with our predefined themes, or create your own with CSS variables and Tailwind CSS.
- 15 Designed Components: Each component is designed with accessibility in mind and fully customizable to suit your needs.
- 3 Form design options: Choose between Full Page, Split by Sections with Cards, and Multi Step form.
- Live validation: Leverage Laravel and Alpine.js for real-time form validation.
- Password Protected: Secure your forms with password protection.
- Prebuilt UI kit: Use our UI kit with Blade Components that are easy to customize and extend.
- Email Templates: Easily communicate with users using our email templates.

## Your Self-Hosted Alternative to Typeform and Google Forms

Tired of feeling tethered to major form builders like Typeform and Google Forms? Welcome to the liberating world of self-hosting with Formatic. We're not just another cog in the wheel of form builders. Formatic is your passport to data sovereignty, your gateway to GDPR conformity, and your ticket to a more secure digital atmosphere. Our tool guarantees that all your data remains securely stowed on your own servers without any extraneous tracking. In essence, you’re not simply acquiring a form builder, you’re investing in tranquility – the assurance that you're adhering to the stringent data protection norms that many of our esteemed clients prize. With Formatic, you're not merely creating forms, you're cultivating confidence.

The best part? You won't be sacrificing any functionality. Quite the contrary. You'll be harnessing a robust, feature-packed tool that can stand shoulder-to-shoulder with any leading form builder on the market. We like to think of it as savoring the best of both worlds. So, if you're prepared to shake off the shackles of mainstream form builders and seize control of your data, it's high time you experienced Formatic. You just got Lucky.

## Installation
Installing Formatic is a breeze. Simply follow the [Installing a starter kit](https://statamic.dev/starter-kits/installing-a-starter-kit) guide from Statamic. Please note that you will need to be running **Statamic 4.x**.

### Installing into an existing site
```bash
php please starter-kit:install lucky-media/formatic
```

### Installing via the Statamic CLI Tool
If you prefer using the [Statamic’s CLI Tool](https://github.com/statamic/cli), you can create a new Statamic installation with Formatic in just one line of code:
```bash
statamic new my-site lucky-media/formatic
```

## Styling
When it comes to styling, Formatic makes it easy for you to tailor the design to your preferences. We use TailwindCSS, so you can simply edit the `tailwind.config.js` file to customize the colors and design elements of your form.

## Compiling Assets
To compile all the assets, we use Vite with [Laravel](https://laravel.com/docs/9.x/vite). After installing the starter kit, make sure to run the following commands:
- `npm install` - to install all the required dependencies.
- `npm run dev` - to run in development mode.
- `npm run build` - to compile assets for production.

## Commercial addon
Please note that Formatic is a commercial starter kit. To use it in your project, you must purchase a license via the [Statamic Marketplace](https://statamic.com/starter-kits/your-company-name/formatic).

## 🐞 Bugs and 💡 Feature Requests
If you have any bugs to report or feature requests, please visit the issues tab in our repository.

## Credits
Formatic is proudly brought to you by the talented team at [Lucky Media](https://www.luckymedia.dev/). We are passionate about leveraging technology to create high-performing websites and applications that live up to the hype. If you have any projects in mind, feel free to contact us.

We are grateful to the creators and contributors of the following packages that have made Formatic a reality:
- Statamic
- Tailwind CSS
- Alpine.js
100 changes: 100 additions & 0 deletions app/Http/Controllers/FormValidationController.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,100 @@
<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Statamic\Forms\Exceptions\FileContentTypeRequiredException;
use Illuminate\Support\MessageBag;
use Statamic\Support\Str;
use Statamic\Facades\Site;
use Illuminate\Support\Facades\URL;
use Illuminate\Validation\ValidationException;
use Statamic\Support\Arr;

class FormValidationController extends Controller
{
/**
* Handle the incoming request.
*/
public function __invoke(Request $request, $form)
{
$fields = $form->blueprint()->fields();
$this->validateContentType($request, $form);
$values = array_merge($request->all(), $assets = $this->normalizeAssetsValues($fields, $request));
$params = collect($request->all())->filter(function ($value, $key) {
return Str::startsWith($key, '_');
})->all();

$fields = $fields->addValues($values);

$submission = $form->makeSubmission();

try {
$fields->validate($this->extraRules($fields));

$values = array_merge($values, $submission->uploadFiles($assets));

$submission->data(
$fields->addValues($values)->process()->values()
);
} catch (ValidationException $e) {
return $this->formFailure($params, $e->errors(), $form->handle());
}

return response([
'success' => true
]);
}

private function formFailure($params, $errors, $form)
{
if (request()->ajax()) {
return response([
'errors' => (new MessageBag($errors))->all(),
'error' => collect($errors)->map(function ($errors, $field) {
return $errors[0];
})->all(),
], 400);
}

$redirect = Arr::get($params, '_error_redirect');

$response = $redirect ? redirect($redirect) : back();

return $response->withInput()->withErrors($errors, 'form.'.$form);
}

private function validateContentType($request, $form)
{
$type = Str::before($request->headers->get('CONTENT_TYPE'), ';');

if ($type !== 'multipart/form-data' && $form->hasFiles()) {
throw new FileContentTypeRequiredException;
}
}

protected function normalizeAssetsValues($fields, $request)
{
// The assets fieldtype is expecting an array, even for `max_files: 1`, but we don't want to force that on the front end.
return $fields->all()
->filter(function ($field) {
return $field->fieldtype()->handle() === 'assets' && request()->hasFile($field->handle());
})
->map(function ($field) use ($request) {
return Arr::wrap($request->file($field->handle()));
})
->all();
}

protected function extraRules($fields)
{
return $fields->all()
->filter(function ($field) {
return $field->fieldtype()->handle() === 'assets';
})
->mapWithKeys(function ($field) {
return [$field->handle().'.*' => 'file'];
})
->all();
}
}
55 changes: 55 additions & 0 deletions app/Providers/AppServiceProvider.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
<?php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use Statamic\Statamic;

class AppServiceProvider extends ServiceProvider
{
/**
* Register any application services.
*/
public function register(): void
{
//
}

/**
* Bootstrap any application services.
*/
public function boot(): void
{
\Statamic\Fieldtypes\Section::makeSelectableInForms();
\Statamic\Fieldtypes\ButtonGroup::makeSelectableInForms();
\Statamic\Fieldtypes\Date::makeSelectableInForms();
\Statamic\Fieldtypes\Range::makeSelectableInForms();
\Statamic\Fieldtypes\Lists::makeSelectableInForms();


\Statamic\Fieldtypes\Checkboxes::appendConfigField('grid_options', [
'type' => 'button_group',
'options' => [
'column' => 'One Column Grid',
'grid-2' => 'Two Column Grid',
'grid-3' => 'Three Column Grid',
'grid-4' => 'Four Column Grid',
],
'default' => 'grid-2',
'display' => 'Display Options',
'instructions' => 'How should the checkboxes be displayed?',
'icon' => 'button_group',
'listable' => 'hidden',
'instructions_position' => 'above',
'visibility' => 'visible',
'hide_display' => false,
'unless' => [
'inline' => true,
],
]);
// Statamic::vite('app', [
// 'resources/js/cp.js',
// 'resources/css/cp.css',
// ]);
}
}
32 changes: 32 additions & 0 deletions app/Services/RetrieveUserPassword.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
<?php

namespace App\Services;

use Symfony\Component\Yaml\Yaml;


class RetrieveUserPassword
{
public static function retrieve(): array|null
{
$default = [
'secret'
];

$file = file_get_contents(base_path('content/globals/formatic.yaml'));

if (! $file) {
return $default;
}

$attributes = Yaml::parse($file);

$passwords = data_get($attributes, 'data.allowed_passwords');

if (is_null($passwords)) {
return $default;
}

return $passwords;
}
}
39 changes: 39 additions & 0 deletions app/Tags/SectionFormatter.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
<?php

namespace App\Tags;

use Statamic\Statamic;
use Statamic\Tags\Tags;

class SectionFormatter extends Tags
{
/**
* The {{ section_formatter }} tag.
*
* */
public function index()
{
$items = collect($this->params->get('items'))
->transform(function ($item, $index) {
$step = $index + 1;
return collect($item['fields'])->transform(function ($field) {
if (! array_key_exists('validate', $field)) {
return false;
}

if (
in_array('required', $field['validate']) ||
str($field['validate'][0])->startsWith('required_if') ||
str($field['validate'][0])->startsWith('required_unless') ||
str($field['validate'][0])->startsWith('required_with')
) {
return $field['handle'];
}

return false;
})->filter()->toArray();
})->toArray();

return json_encode($items);
}
}
9 changes: 9 additions & 0 deletions composer.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
{
"name": "lucky-media/formatic",
"extra": {
"statamic": {
"name": "Formatic",
"description": "Formatic starter kit"
}
}
}
Loading

0 comments on commit 303bbe6

Please sign in to comment.