Skip to content

Commit cfa1d7e

Browse files
riasvdvriasvdv
committed
Update split workflow
1 parent 2127af6 commit cfa1d7e

File tree

12 files changed

+197
-339
lines changed

12 files changed

+197
-339
lines changed

‎composer.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,10 @@
1717
"minimum-stability": "dev",
1818
"prefer-stable": true,
1919
"require": {
20-
"php": "^8.0",
20+
"php": "^8.1",
2121
"ext-json": "*",
2222
"illuminate/support": "^9.0",
23-
"spatie/laravel-mailcoach": "^5.2"
23+
"spatie/laravel-mailcoach": "^6.0"
2424
},
2525
"require-dev": {
2626
"orchestra/testbench": "^7.0",

‎database/migrations/create_mailcoach_unlayer_tables.php.stub

Lines changed: 0 additions & 16 deletions
This file was deleted.

‎resources/lang/en.json

Lines changed: 0 additions & 6 deletions
This file was deleted.

‎resources/views/unlayer.blade.php

Lines changed: 141 additions & 144 deletions
Original file line numberDiff line numberDiff line change
@@ -1,170 +1,167 @@
11
@push('endHead')
2-
<script id="unlayer" src="https://editor.unlayer.com/embed.js" defer></script>
3-
@endpush
2+
<style>
3+
#unlayer-wrapper {
4+
margin-top: -1.5rem;
5+
margin-right: -0.75rem;
6+
}
47
5-
<script>
6-
window.unlayerInitialized = false;
7-
8-
document.getElementById('unlayer').addEventListener('load', initUnlayer);
9-
10-
document.addEventListener('turbo:before-visit', confirmBeforeLeaveAndDestroyUnlayer);
11-
document.addEventListener("turbo:load", initUnlayer);
12-
window.addEventListener('beforeunload', confirmBeforeLeaveAndDestroyUnlayer);
13-
14-
function loadTemplate() {
15-
document.getElementById('unlayer_template_error').classList.add('hidden');
16-
const slug = document.getElementById('unlayer_template').value;
17-
18-
fetch('https://api.graphql.unlayer.com/graphql', {
19-
method: 'POST',
20-
headers: {
21-
'Content-Type': 'application/json',
22-
},
23-
body: JSON.stringify({
24-
query: `
25-
query StockTemplateLoad($slug: String!) {
26-
StockTemplate(slug: $slug) {
27-
StockTemplatePages {
28-
design
29-
}
30-
}
31-
}
32-
`,
33-
variables: {
34-
slug: slug,
8+
@media (min-width: 768px) {
9+
#unlayer-wrapper {
10+
margin-top: -2.55rem;
11+
margin-right: -0.5rem;
12+
}
13+
}
14+
</style>
15+
@endpush
16+
<div id="unlayer-wrapper">
17+
<script>
18+
function loadTemplate() {
19+
document.getElementById('unlayer_template_error').classList.add('hidden');
20+
let slug = document.getElementById('unlayer_template').value;
21+
slug = slug.split('/').slice(-1)[0];
22+
23+
fetch('https://api.graphql.unlayer.com/graphql', {
24+
method: 'POST',
25+
headers: {
26+
'Content-Type': 'application/json',
3527
},
36-
}),
37-
})
38-
.then((res) => res.json())
39-
.then((result) => {
40-
if (! result.data.StockTemplate) {
41-
42-
@if (config('mailcoach.unlayer.options.projectId'))
28+
body: JSON.stringify({
29+
query: `
30+
query StockTemplateLoad($slug: String!) {
31+
StockTemplate(slug: $slug) {
32+
StockTemplatePages {
33+
design
34+
}
35+
}
36+
}
37+
`,
38+
variables: {
39+
slug: slug,
40+
},
41+
}),
42+
})
43+
.then((res) => res.json())
44+
.then((result) => {
45+
if (! result.data.StockTemplate) {
46+
@if (config('mailcoach.unlayer.options.projectId'))
4347
unlayer.loadTemplate(slug);
44-
document.querySelector('[data-modal="load-unlayer-template"]').dispatchEvent(new Event('dismiss'));
45-
@else
46-
document.getElementById('unlayer_template_error').innerHTML = '{{ __('mailcoach - Template not found.') }}';
48+
Alpine.store('modals').close('load-unlayer-template');
49+
@else
50+
document.getElementById('unlayer_template_error').innerHTML = '{{ __mc('Template not found.') }}';
4751
document.getElementById('unlayer_template_error').classList.remove('hidden');
48-
@endif
49-
return;
50-
}
51-
52-
unlayer.loadDesign(result.data.StockTemplate.StockTemplatePages[0].design);
53-
document.querySelector('[data-modal="load-unlayer-template"]').dispatchEvent(new Event('dismiss'));
54-
});
55-
}
52+
@endif
5653
57-
function initUnlayer() {
58-
document.getElementById('load-template').addEventListener('click', loadTemplate);
54+
return;
55+
}
5956
60-
if (window.unlayerInitialized || unlayer.init === undefined) {
61-
return;
57+
unlayer.loadDesign(result.data.StockTemplate.StockTemplatePages[0].design);
58+
Alpine.store('modals').close('load-unlayer-template');
59+
});
6260
}
6361
64-
unlayer.init(@json($options));
65-
66-
window.unlayerInitialized = true;
67-
68-
unlayer.loadDesign({!! $structuredHtml !!});
69-
70-
unlayer.registerCallback('image', (file, done) => {
71-
let data = new FormData();
72-
data.append('file', file.attachments[0]);
62+
window.init = function() {
63+
document.getElementById('load-template').addEventListener('click', loadTemplate);
64+
65+
unlayer.init(@json($options));
66+
67+
unlayer.loadDesign(JSON.parse(JSON.stringify(this.json)));
68+
69+
if (! this.json) {
70+
unlayer.loadBlank({
71+
backgroundColor: '#ffffff'
72+
});
73+
}
74+
75+
unlayer.registerCallback('image', (file, done) => {
76+
let data = new FormData();
77+
data.append('file', file.attachments[0]);
78+
79+
fetch('{{ action(\Spatie\Mailcoach\Http\Api\Controllers\UploadsController::class) }}', {
80+
method: 'POST',
81+
headers: {
82+
'Accept': 'application/json',
83+
'X-CSRF-TOKEN': '{{ csrf_token() }}',
84+
},
85+
body: data
86+
})
87+
.then(response => {
88+
// Make sure the response was valid
89+
if (response.status >= 200 && response.status < 300) {
90+
return response.json()
91+
}
7392
74-
fetch('{{ route('mailcoach-unlayer.upload') }}', {
75-
method: 'POST',
76-
headers: {
77-
'Accept': 'application/json',
78-
'X-CSRF-TOKEN': '{{ csrf_token() }}',
79-
},
80-
body: data
81-
}).then(response => {
82-
// Make sure the response was valid
83-
if (response.status >= 200 && response.status < 300) {
84-
return response.json()
85-
}
86-
87-
let error = new Error(response.statusText);
88-
error.response = response;
89-
throw error
90-
}).then(data => done({ progress: 100, url: data.url }))
91-
});
92-
93-
const mergeTags = {};
94-
@foreach ($replacers as $replacerName => $replacerDescription)
95-
mergeTags["{{ $replacerName }}"] = {
96-
name: "{{ $replacerName }}",
97-
value: "::{{ $replacerName }}::"
98-
};
99-
@endforeach
100-
101-
unlayer.setMergeTags(mergeTags);
102-
103-
document.getElementById('save').addEventListener('click', event => {
104-
event.preventDefault();
105-
106-
unlayer.exportHtml(function(data) {
107-
document.getElementById('html').value = data.html;
108-
document.getElementById('structured_html').value = JSON.stringify(data.design);
109-
document.getElementById('html').dataset.dirty = "";
110-
document.querySelector('main form').submit();
93+
let error = new Error(response.statusText);
94+
error.response = response;
95+
throw error
96+
}).then(data => done({ progress: 100, url: data.file.url }))
11197
});
112-
});
11398
114-
unlayer.addEventListener('design:updated', function(data) {
115-
document.getElementById('html').dataset.dirty = "dirty";
116-
});
117-
}
99+
const mergeTags = {};
100+
@foreach ($replacers as $replacerName => $replacerDescription)
101+
mergeTags["{{ $replacerName }}"] = {
102+
name: "{{ $replacerName }}",
103+
value: "::{{ $replacerName }}::"
104+
};
105+
@endforeach
106+
107+
unlayer.setMergeTags(mergeTags);
108+
109+
const component = this;
110+
unlayer.addEventListener('design:updated', () => {
111+
unlayer.exportHtml(function(data) {
112+
component.html = data.html;
113+
component.json = data.design;
114+
document.getElementById('editor').dirty = true;
115+
});
116+
});
118117
119-
function confirmBeforeLeaveAndDestroyUnlayer(event) {
120-
if (document.getElementById('html').dataset.dirty === "dirty" && ! confirm('Are you sure you want to leave this page? Any unsaved changes will be lost.')) {
121-
event.preventDefault();
122-
return;
118+
unlayer.addEventListener('design:loaded', function(data) {
119+
unlayer.exportHtml(function(data) {
120+
component.html = data.html;
121+
component.json = data.design;
122+
});
123+
});
123124
}
125+
</script>
126+
127+
<div class="max-w-full flex flex-col">
128+
<div wire:ignore x-data="{
129+
html: @entangle('templateFieldValues.html'),
130+
json: @entangle('templateFieldValues.json'),
131+
init: init,
132+
}" class="overflow-hidden -mx-10 flex-1 h-full mb-6">
133+
<div id="editor" class="h-full -ml-2 pr-3 py-1" style="min-height: 75vh; height: 75vh" data-dirty-check></div>
134+
</div>
124135

125-
window.unlayerInitialized = false;
126-
127-
document.removeEventListener('turbo:before-visit', confirmBeforeLeaveAndDestroyUnlayer);
128-
document.removeEventListener("turbo:load", initUnlayer);
129-
window.removeEventListener('beforeunload', confirmBeforeLeaveAndDestroyUnlayer);
130-
document.getElementById('load-template').removeEventListener('click', loadTemplate);
131-
}
136+
<x-mailcoach::replacer-help-texts :model="$model" />
132137

133-
</script>
134-
<div class="h-full">
135-
<div class="form-row max-w-full h-full">
136-
<label class="label" for="html">{{ __('Body') }}</label>
137-
@isset($errors)
138-
@error('html')
138+
<x-mailcoach::editor-buttons :preview-html="$fullHtml" :model="$model">
139+
@isset($errors)
140+
@error('html')
139141
<p class="form-error" role="alert">{{ $message }}</p>
140-
@enderror
141-
@endisset
142-
<div class="overflow-hidden -mx-10 h-full">
143-
<div id="editor" class="h-full -ml-2 pr-3 py-1" style="min-height: 75vh"></div>
144-
</div>
145-
<input type="hidden" name="html" id="html" value="{{ $html }}">
146-
<input type="hidden" name="structured_html" id="structured_html" value="{{ json_encode($structuredHtml) }}">
147-
</div>
148-
</div>
142+
@enderror
143+
@endisset
149144

150-
<div class="form-buttons">
151-
<x-mailcoach::button id="save" :label="__('Save content')"/>
152-
@if ($showTestButton)
153-
<x-mailcoach::button-secondary data-modal-trigger="send-test" :label="__('Send Test')"/>
154-
@endif
155-
<x-mailcoach::button-secondary data-modal-trigger="load-unlayer-template" :label="__('mailcoach - Load Unlayer template')"/>
145+
<x-mailcoach::button-secondary x-on:click.prevent="$store.modals.open('load-unlayer-template')" :label="__mc('Load Unlayer template')"/>
146+
</x-mailcoach::editor-buttons>
147+
</div>
156148
</div>
157149

158150
@push('modals')
159-
<x-mailcoach::modal :title="__('mailcoach - Load Unlayer template')" name="load-unlayer-template">
160-
<p class="mb-4">{!! __('mailcoach - You can load an <a class="text-blue-500" href="https://unlayer.com/templates" target="_blank">Unlayer template</a> by entering the slug or the id when you have a projectId set.') !!}</p>
161-
162-
<x-mailcoach::text-field label="Unlayer template" name="unlayer_template" />
163-
<p id="unlayer_template_error" class="form-error hidden mt-1" role="alert"></p>
151+
<x-mailcoach::modal :title="__mc('Load Unlayer template')" name="load-unlayer-template">
152+
<p>{!! __mc('You can load an <a class="text-blue-500" href="https://unlayer.com/templates" target="_blank">Unlayer template</a> by entering the URL') !!}</p>
153+
@if(config('mailcoach.unlayer.options.projectId'))
154+
<p>{{ __mc('A template id from your Unlayer project also works') }}</p>
155+
@endif
156+
157+
<div>
158+
<x-mailcoach::text-field label="Unlayer template" name="unlayer_template" :placeholder="config('mailcoach.unlayer.options.projectId') ? __mc('URL or template id') : __mc('https://unlayer.com/templates/<template>')" />
159+
<p id="unlayer_template_error" class="form-error hidden mt-1" role="alert"></p>
160+
</div>
164161

165162
<div class="form-buttons">
166-
<x-mailcoach::button class="mt-auto ml-2" id="load-template" label="Load" type="button" />
167-
<x-mailcoach::button-cancel :label=" __('mailcoach - Cancel')" />
163+
<x-mailcoach::button class="mt-auto" id="load-template" label="Load" type="button" />
164+
<x-mailcoach::button-cancel x-on:click.prevent="$store.modals.close('load-unlayer-template')" :label=" __mc('Cancel')" />
168165
</div>
169166
</x-mailcoach::modal>
170167
@endpush

‎routes/api.php

Lines changed: 0 additions & 5 deletions
This file was deleted.

‎src/Http/Controllers/UploadController.php

Lines changed: 0 additions & 24 deletions
This file was deleted.

‎src/Http/Requests/UploadRequest.php

Lines changed: 0 additions & 15 deletions
This file was deleted.

0 commit comments

Comments
 (0)