mirror of https://github.com/4xmen/xshop.git
added live edit setting
parent
600273e0f6
commit
1d300cd039
@ -0,0 +1,48 @@
|
||||
var onEdit = '';
|
||||
document.querySelector('#do-edit')?.addEventListener('click', function () {
|
||||
this.style.display = 'none';
|
||||
let editable = document.createElement('div');
|
||||
editable.setAttribute('id', 'customizable');
|
||||
editable.innerHTML = '<i class="ri-edit-2-line"></i> <b></b>';
|
||||
document.body.appendChild(editable);
|
||||
document.querySelectorAll('.live-setting')?.forEach(function (el) {
|
||||
el.addEventListener('mouseenter', function () {
|
||||
|
||||
setTimeout(() => {
|
||||
let rect = el.getBoundingClientRect();
|
||||
onEdit = this.getAttribute('data-live');
|
||||
document.querySelector('#customizable b').innerText = onEdit;
|
||||
document.querySelector('#customizable').style.top = (window.scrollY + rect.top + 5) + 'px';
|
||||
}, 50);
|
||||
});
|
||||
el.addEventListener('mouseleave', function () {
|
||||
|
||||
console.log(this.getAttribute('data-live'));
|
||||
});
|
||||
});
|
||||
editable.addEventListener('click', function () {
|
||||
if (document.querySelector('#customize-modal') == null) {
|
||||
|
||||
let custModal = document.createElement('div');
|
||||
custModal.setAttribute('id', 'customize-modal');
|
||||
custModal.innerHTML = '<iframe></iframe>';
|
||||
document.body.appendChild(custModal);
|
||||
custModal.addEventListener('click', function (e) {
|
||||
if (e.target == this) {
|
||||
window.location.reload();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
document.querySelector('#customize-modal').style.display = 'block';
|
||||
}
|
||||
|
||||
document.addEventListener('keyup',function (e) {
|
||||
if (e.code == 'Escape'){
|
||||
window.location.reload();
|
||||
}
|
||||
});
|
||||
|
||||
document.querySelector('#customize-modal iframe').setAttribute('src', document.querySelector('#live-url').value + onEdit);
|
||||
|
||||
});
|
||||
});
|
||||
@ -1,45 +1,51 @@
|
||||
import ContentSEOAnalyzer from './seo-analyzer.js'
|
||||
|
||||
let timeOut = null;
|
||||
window.addEventListener('load', function () {
|
||||
|
||||
let keywordInput = document.querySelector('#keyword') ;
|
||||
let dirx = document.querySelector('#panel-dir').value;
|
||||
let editors = {};
|
||||
document.querySelectorAll('.ckeditorx')?.forEach(function (el) {
|
||||
|
||||
const currentDir = el.getAttribute('dir');
|
||||
let finalDir = dirx;
|
||||
if (currentDir != null){
|
||||
finalDir = currentDir;
|
||||
}
|
||||
editors[el.getAttribute('name')] = CKEDITOR.replace(el.getAttribute('name'), {
|
||||
filebrowserUploadUrl: xupload,
|
||||
filebrowserUploadMethod: 'form',
|
||||
contentsLangDirection: finalDir,
|
||||
skin: 'moono-dark',
|
||||
});
|
||||
|
||||
try {
|
||||
|
||||
CKEDITOR.addCss('.cke_editable { background-color: ' + website_bg + '; color: ' + website_text_color + ' ; font-family: ' + website_font + ' }');
|
||||
editors[el.getAttribute('name')].on('change', function (evt) {
|
||||
const content = evt.editor.getData();
|
||||
el.value = content;
|
||||
if (el.classList.contains('seo-analyze')){
|
||||
let keyword = keywordInput?.value;
|
||||
let keywordInput = document.querySelector('#keyword');
|
||||
let dirx = document.querySelector('#panel-dir').value;
|
||||
let editors = {};
|
||||
document.querySelectorAll('.ckeditorx')?.forEach(function (el) {
|
||||
|
||||
const analyzer = new ContentSEOAnalyzer(content, keyword);
|
||||
const report = analyzer.generateReport();
|
||||
analyzer.displaySEOReport(report,'seo-hint')
|
||||
const currentDir = el.getAttribute('dir');
|
||||
let finalDir = dirx;
|
||||
if (currentDir != null) {
|
||||
finalDir = currentDir;
|
||||
}
|
||||
});
|
||||
editors[el.getAttribute('name')] = CKEDITOR.replace(el.getAttribute('name'), {
|
||||
filebrowserUploadUrl: xupload,
|
||||
filebrowserUploadMethod: 'form',
|
||||
contentsLangDirection: finalDir,
|
||||
skin: 'moono-dark',
|
||||
});
|
||||
|
||||
|
||||
if (el.classList.contains('seo-analyze')){
|
||||
editors[el.getAttribute('name')].fire('change');
|
||||
keywordInput?.addEventListener('input',function () {
|
||||
editors[el.getAttribute('name')].fire('change');
|
||||
CKEDITOR.addCss('.cke_editable { background-color: ' + website_bg + '; color: ' + website_text_color + ' ; font-family: ' + website_font + ' }');
|
||||
editors[el.getAttribute('name')].on('change', function (evt) {
|
||||
const content = evt.editor.getData();
|
||||
el.value = content;
|
||||
if (el.classList.contains('seo-analyze')) {
|
||||
let keyword = keywordInput?.value;
|
||||
|
||||
const analyzer = new ContentSEOAnalyzer(content, keyword);
|
||||
const report = analyzer.generateReport();
|
||||
analyzer.displaySEOReport(report, 'seo-hint')
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
if (el.classList.contains('seo-analyze')) {
|
||||
editors[el.getAttribute('name')].fire('change');
|
||||
keywordInput?.addEventListener('input', function () {
|
||||
editors[el.getAttribute('name')].fire('change');
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
} catch {
|
||||
}
|
||||
});
|
||||
|
||||
@ -0,0 +1,49 @@
|
||||
@include('components.panel-header')
|
||||
<div id="panel-preloader">
|
||||
<div class="loader"></div>
|
||||
</div>
|
||||
<input type="hidden" id="panel-dir" @if(langIsRTL(config('app.locale'))) value="rtl" @else value="ltr" @endif>
|
||||
<form action="{{route('admin.setting.update')}}" method="post" enctype="multipart/form-data">
|
||||
@csrf
|
||||
<div class="container pt-3" id="app">
|
||||
|
||||
@include('components.err')
|
||||
@if(count($settings) == 0)
|
||||
<h3 class="text-center pt-2">
|
||||
{{__("There is nothing to show!")}}
|
||||
</h3>
|
||||
@else
|
||||
<div class="row">
|
||||
@foreach($settings as $setting)
|
||||
@include('components.setting-field')
|
||||
@endforeach
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
<button class="action-btn circle-btn"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-placement="top"
|
||||
data-bs-custom-class="custom-tooltip"
|
||||
data-bs-title="{{__("Save all settings")}}"
|
||||
>
|
||||
<i class="ri-save-2-line"></i>
|
||||
</button>
|
||||
|
||||
|
||||
@if(config('app.env') == 'production')
|
||||
<button
|
||||
href="{{getRoute('sort')}}"
|
||||
class="action-btn circle-btn"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-placement="top"
|
||||
data-bs-custom-class="custom-tooltip"
|
||||
data-bs-title="{{__("Save and build")}}"
|
||||
name="build"
|
||||
value="1"
|
||||
style="inset-inline-end: 1.2rem;inset-inline-start: auto;"
|
||||
>
|
||||
<i class="ri-hammer-line"></i>
|
||||
</button>
|
||||
@endif
|
||||
</form>
|
||||
@include('components.panel-footer')
|
||||
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 139 KiB |
@ -1,3 +1,3 @@
|
||||
<section class='GisooVideo'>
|
||||
<section class='GisooVideo live-setting' data-live="{{$data->area_name.'_'.$data->part}}" >
|
||||
<video src="{{asset('upload/media/'.$data->area_name.'.'.$data->part.'.mp4')}}" autoplay muted ></video>
|
||||
</section>
|
||||
|
||||
@ -1,3 +1,3 @@
|
||||
<section class='SpliterText'>
|
||||
<section class='SpliterText live-setting' data-live="{{$data->area_name.'_'.$data->part}}">
|
||||
{!! getSetting($data->area_name.'_'.$data->part.'_text') !!}
|
||||
</section>
|
||||
|
||||
Loading…
Reference in New Issue