diff --git a/src/Squidex/app/features/schemas/pages/schema/field.component.html b/src/Squidex/app/features/schemas/pages/schema/field.component.html
index 20b8b8ee8..1e5307adf 100644
--- a/src/Squidex/app/features/schemas/pages/schema/field.component.html
+++ b/src/Squidex/app/features/schemas/pages/schema/field.component.html
@@ -38,7 +38,7 @@
Show
-
+
Delete
diff --git a/src/Squidex/app/framework/angular/date-time-editor.component.html b/src/Squidex/app/framework/angular/date-time-editor.component.html
index 9b29ddf05..2bc487744 100644
--- a/src/Squidex/app/framework/angular/date-time-editor.component.html
+++ b/src/Squidex/app/framework/angular/date-time-editor.component.html
@@ -7,7 +7,7 @@
-
+
diff --git a/src/Squidex/app/framework/angular/date-time-editor.component.ts b/src/Squidex/app/framework/angular/date-time-editor.component.ts
index 232fa1b37..755bd2f1e 100644
--- a/src/Squidex/app/framework/angular/date-time-editor.component.ts
+++ b/src/Squidex/app/framework/angular/date-time-editor.component.ts
@@ -52,6 +52,8 @@ export class DateTimeEditorComponent implements ControlValueAccessor, OnInit, Af
@ViewChild('dateInput')
public dateInput: ElementRef;
+ public isDisabled = false;
+
public ngOnInit() {
this.timeControl.valueChanges.subscribe(value => {
if (!value || value.length === 0) {
@@ -92,6 +94,8 @@ export class DateTimeEditorComponent implements ControlValueAccessor, OnInit, Af
}
public setDisabledState(isDisabled: boolean): void {
+ this.isDisabled = isDisabled;
+
if (isDisabled) {
this.dateControl.disable({ emitEvent: false });
this.timeControl.disable({ emitEvent: false });
diff --git a/src/Squidex/app/framework/angular/geolocation-editor.component.html b/src/Squidex/app/framework/angular/geolocation-editor.component.html
index 720f0c22c..fd3392b28 100644
--- a/src/Squidex/app/framework/angular/geolocation-editor.component.html
+++ b/src/Squidex/app/framework/angular/geolocation-editor.component.html
@@ -10,7 +10,7 @@
-
+
diff --git a/src/Squidex/app/framework/angular/geolocation-editor.component.ts b/src/Squidex/app/framework/angular/geolocation-editor.component.ts
index c5db722aa..c14e9a36e 100644
--- a/src/Squidex/app/framework/angular/geolocation-editor.component.ts
+++ b/src/Squidex/app/framework/angular/geolocation-editor.component.ts
@@ -48,11 +48,11 @@ export class GeolocationEditorComponent implements ControlValueAccessor, AfterVi
]]
});
- public isDisabled = false;
-
@ViewChild('editor')
public editor: ElementRef;
+ public isDisabled = false;
+
constructor(
private readonly resourceLoader: ResourceLoaderService,
private readonly formBuilder: FormBuilder
@@ -69,6 +69,34 @@ export class GeolocationEditorComponent implements ControlValueAccessor, AfterVi
public setDisabledState(isDisabled: boolean): void {
this.isDisabled = isDisabled;
+
+ if (isDisabled) {
+ if (this.map) {
+ this.map.zoomControl.disable();
+ this.map._handlers.forEach((handler: any) => {
+ handler.disable();
+ });
+ }
+
+ if (this.marker) {
+ this.marker.dragging.disable();
+ }
+
+ this.geolocationForm.disable();
+ } else {
+ if (this.map) {
+ this.map.zoomControl.enable();
+ this.map._handlers.forEach((handler: any) => {
+ handler.enable();
+ });
+ }
+
+ if (this.marker) {
+ this.marker.dragging.enable();
+ }
+
+ this.geolocationForm.enable();
+ }
}
public registerOnChange(fn: any) {
@@ -101,12 +129,21 @@ export class GeolocationEditorComponent implements ControlValueAccessor, AfterVi
}).addTo(this.map);
this.map.on('click', (event: any) => {
- this.value = { latitude: event.latlng.lat, longitude: event.latlng.lng };
+ if (!this.marker) {
+ this.value = { latitude: event.latlng.lat, longitude: event.latlng.lng };
- this.updateMarker(false, true);
+ this.updateMarker(false, true);
+ }
});
this.updateMarker(true, false);
+
+ if (this.isDisabled) {
+ this.map.zoomControl.disable();
+ this.map._handlers.forEach((handler: any) => {
+ handler.disable();
+ });
+ }
});
}
@@ -128,6 +165,10 @@ export class GeolocationEditorComponent implements ControlValueAccessor, AfterVi
this.marker.on('dragend', (event: any) => {
this.updateMarker(false, true);
});
+
+ if (this.isDisabled) {
+ this.marker.dragging.disable();
+ }
}
const latLng = L.latLng(this.value.latitude, this.value.longitude);
diff --git a/src/Squidex/app/framework/angular/markdown-editor.component.ts b/src/Squidex/app/framework/angular/markdown-editor.component.ts
index a5f9de910..e194e015c 100644
--- a/src/Squidex/app/framework/angular/markdown-editor.component.ts
+++ b/src/Squidex/app/framework/angular/markdown-editor.component.ts
@@ -76,6 +76,7 @@ export class MarkdownEditorComponent implements ControlValueAccessor, AfterViewI
this.resourceLoader.loadScript('https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.js').then(() => {
this.simplemde = new SimpleMDE({ element: this.editor.nativeElement });
this.simplemde.value(this.value || '');
+ this.simplemde.codemirror.setOption('readOnly', this.isDisabled);
this.simplemde.codemirror.on('change', () => {
const value = this.simplemde.value();
diff --git a/src/Squidex/app/framework/angular/rich-editor.component.ts b/src/Squidex/app/framework/angular/rich-editor.component.ts
index a0f1da652..90ad46f85 100644
--- a/src/Squidex/app/framework/angular/rich-editor.component.ts
+++ b/src/Squidex/app/framework/angular/rich-editor.component.ts
@@ -70,6 +70,7 @@ export class RichEditorComponent implements ControlValueAccessor, AfterViewInit,
tinymce.init({
setup: (editor: any) => {
self.tinyEditor = editor;
+ self.tinyEditor.setMode(this.isDisabled ? 'readonly' : 'design');
self.tinyEditor.on('change', () => {
const value = editor.getContent();
diff --git a/src/Squidex/app/theme/_bootstrap.scss b/src/Squidex/app/theme/_bootstrap.scss
index c44b29862..6f97e0b5e 100644
--- a/src/Squidex/app/theme/_bootstrap.scss
+++ b/src/Squidex/app/theme/_bootstrap.scss
@@ -56,6 +56,11 @@ body {
&:active {
background: $color-theme-error-dark;
border: 0;
+ }
+ }
+
+ &.dropdown-item {
+ &:active {
color: $color-accent-dark;
}
}