@sealcode/sealgen 0.8.10 → 0.8.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/@types/forms/controls/controls.d.ts +1 -0
- package/@types/forms/controls/file.d.ts +8 -7
- package/@types/forms/controls/photo.d.ts +20 -0
- package/lib/forms/controls/controls.js +1 -0
- package/lib/forms/controls/controls.js.map +1 -1
- package/lib/forms/controls/file.js +7 -4
- package/lib/forms/controls/file.js.map +1 -1
- package/lib/forms/controls/photo.js +56 -0
- package/lib/forms/controls/photo.js.map +1 -0
- package/lib/forms/controls/simple-input.js +3 -1
- package/lib/forms/controls/simple-input.js.map +1 -1
- package/lib/page/mountable-with-fields.js +0 -1
- package/lib/page/mountable-with-fields.js.map +1 -1
- package/package.json +2 -1
- package/src/forms/controls/controls.ts +1 -0
- package/src/forms/controls/file.ts +12 -6
- package/src/forms/controls/photo.ts +76 -0
- package/src/forms/controls/simple-input.ts +3 -1
- package/src/page/mountable-with-fields.ts +0 -1
|
@@ -1,14 +1,15 @@
|
|
|
1
|
+
/// <reference types="node" />
|
|
1
2
|
import { Context } from "koa";
|
|
3
|
+
import { FlatTemplatable } from "tempstream";
|
|
2
4
|
import { FileContainer } from "../fields/file";
|
|
3
5
|
import { FormDataValue } from "../form";
|
|
4
6
|
import { SimpleInput } from "./simple-input";
|
|
5
7
|
export declare class File extends SimpleInput<FileContainer> {
|
|
6
8
|
getType(): string;
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
}>;
|
|
9
|
+
renderFilePreview(ctx: Context, file_data: {
|
|
10
|
+
id?: string;
|
|
11
|
+
filename?: string;
|
|
12
|
+
}): Promise<FlatTemplatable>;
|
|
13
|
+
preInput(ctx: Context, data: Record<string, FormDataValue>): Promise<import("stream").Readable>;
|
|
14
|
+
getInputAttributes(ctx: Context, data: Record<string, FormDataValue>, field_prefix: string, form_id: string): Promise<Record<string, string | boolean>>;
|
|
14
15
|
}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { Context } from "koa";
|
|
2
|
+
import { FlatTemplatable } from "tempstream";
|
|
3
|
+
import { File } from "./file";
|
|
4
|
+
import { FileContainer, FormField } from "../fields/field";
|
|
5
|
+
import { SimpleInputOptions } from "./simple-input";
|
|
6
|
+
import KoaResponsiveImageRouter from "koa-responsive-image-router";
|
|
7
|
+
import { FormDataValue } from "../form";
|
|
8
|
+
export declare class Photo extends File {
|
|
9
|
+
field: FormField<boolean, FileContainer>;
|
|
10
|
+
imageRouter: KoaResponsiveImageRouter;
|
|
11
|
+
constructor(field: FormField<boolean, FileContainer>, imageRouter: KoaResponsiveImageRouter, options?: SimpleInputOptions);
|
|
12
|
+
getImgStyle(): Promise<string>;
|
|
13
|
+
renderFilePreview(ctx: Context, file_data: {
|
|
14
|
+
id?: string;
|
|
15
|
+
filename?: string;
|
|
16
|
+
}): Promise<FlatTemplatable>;
|
|
17
|
+
getInputAttributes(ctx: Context, data: Record<string, FormDataValue>, field_prefix: string, form_id: string): Promise<{
|
|
18
|
+
onchange: string;
|
|
19
|
+
}>;
|
|
20
|
+
}
|
|
@@ -47,6 +47,7 @@ __exportStar(require("./collapsible-field-group"), exports);
|
|
|
47
47
|
__exportStar(require("./collapsible-checkbox-group"), exports);
|
|
48
48
|
__exportStar(require("./autocomplete"), exports);
|
|
49
49
|
__exportStar(require("./file"), exports);
|
|
50
|
+
__exportStar(require("./photo"), exports);
|
|
50
51
|
__exportStar(require("./multiple-files"), exports);
|
|
51
52
|
__exportStar(require("./number"), exports);
|
|
52
53
|
//# sourceMappingURL=controls.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"controls.js","sourceRoot":"","sources":["../../../src/forms/controls/controls.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,+CAA6C;AAApC,2GAAA,WAAW,OAAA;AACpB,2DAAwD;AAA/C,sHAAA,gBAAgB,OAAA;AACzB,2EAAwE;AAA/D,sIAAA,wBAAwB,OAAA;AACjC,iCAAgC;AAAvB,8FAAA,KAAK,OAAA;AACd,iEAA8D;AAArD,4HAAA,mBAAmB,OAAA;AAC5B,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,+CAA6C;AAApC,2GAAA,WAAW,OAAA;AACpB,6CAA2C;AAAlC,yGAAA,UAAU,OAAA;AACnB,mDAAiD;AAAxC,+GAAA,aAAa,OAAA;AACtB,+BAA8B;AAArB,4FAAA,IAAI,OAAA;AACb,+CAA6C;AAApC,2GAAA,WAAW,OAAA;AACpB,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,6CAA2C;AAAlC,yGAAA,UAAU,OAAA;AACnB,4CAA0B;AAC1B,6CAA2B;AAC3B,6CAA2B;AAC3B,0CAAwB;AACxB,oDAAkC;AAClC,mDAAiC;AACjC,4DAA0C;AAC1C,+DAA6C;AAC7C,iDAA+B;AAC/B,yCAAuB;AACvB,mDAAiC;AACjC,2CAAyB"}
|
|
1
|
+
{"version":3,"file":"controls.js","sourceRoot":"","sources":["../../../src/forms/controls/controls.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,+CAA6C;AAApC,2GAAA,WAAW,OAAA;AACpB,2DAAwD;AAA/C,sHAAA,gBAAgB,OAAA;AACzB,2EAAwE;AAA/D,sIAAA,wBAAwB,OAAA;AACjC,iCAAgC;AAAvB,8FAAA,KAAK,OAAA;AACd,iEAA8D;AAArD,4HAAA,mBAAmB,OAAA;AAC5B,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,+CAA6C;AAApC,2GAAA,WAAW,OAAA;AACpB,6CAA2C;AAAlC,yGAAA,UAAU,OAAA;AACnB,mDAAiD;AAAxC,+GAAA,aAAa,OAAA;AACtB,+BAA8B;AAArB,4FAAA,IAAI,OAAA;AACb,+CAA6C;AAApC,2GAAA,WAAW,OAAA;AACpB,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,6CAA2C;AAAlC,yGAAA,UAAU,OAAA;AACnB,4CAA0B;AAC1B,6CAA2B;AAC3B,6CAA2B;AAC3B,0CAAwB;AACxB,oDAAkC;AAClC,mDAAiC;AACjC,4DAA0C;AAC1C,+DAA6C;AAC7C,iDAA+B;AAC/B,yCAAuB;AACvB,0CAAwB;AACxB,mDAAiC;AACjC,2CAAyB"}
|
|
@@ -1,14 +1,20 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.File = void 0;
|
|
4
|
+
const tempstream_1 = require("tempstream");
|
|
4
5
|
const simple_input_1 = require("./simple-input");
|
|
5
6
|
class File extends simple_input_1.SimpleInput {
|
|
6
7
|
getType() {
|
|
7
8
|
return "file";
|
|
8
9
|
}
|
|
10
|
+
async renderFilePreview(ctx, file_data) {
|
|
11
|
+
return file_data.filename || "";
|
|
12
|
+
}
|
|
9
13
|
async preInput(ctx, data) {
|
|
10
14
|
const { parsed } = await this.field.getValue(ctx, data);
|
|
11
|
-
return /* HTML */
|
|
15
|
+
return tempstream_1.tempstream /* HTML */ `${parsed.old
|
|
16
|
+
? this.renderFilePreview(ctx, parsed.old)
|
|
17
|
+
: ""}
|
|
12
18
|
<input
|
|
13
19
|
type="hidden"
|
|
14
20
|
name="${this.field.name}[old][id]"
|
|
@@ -28,9 +34,6 @@ class File extends simple_input_1.SimpleInput {
|
|
|
28
34
|
name: this.field.name + "[new]",
|
|
29
35
|
required: original.required && !parsed.old,
|
|
30
36
|
value: false,
|
|
31
|
-
onchange: (original.onchange || "") +
|
|
32
|
-
";" +
|
|
33
|
-
"filename = this.value.split('\\\\').slice(-1)[0]; this.parentElement.style.setProperty('--filename', '\\'Wybrany plik: ' + filename + '\\'')",
|
|
34
37
|
};
|
|
35
38
|
}
|
|
36
39
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file.js","sourceRoot":"","sources":["../../../src/forms/controls/file.ts"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"file.js","sourceRoot":"","sources":["../../../src/forms/controls/file.ts"],"names":[],"mappings":";;;AACA,2CAAyD;AAGzD,iDAA6C;AAE7C,MAAa,IAAK,SAAQ,0BAA0B;IACnD,OAAO;QACN,OAAO,MAAM,CAAC;IACf,CAAC;IAED,KAAK,CAAC,iBAAiB,CACtB,GAAY,EACZ,SAA6C;QAE7C,OAAO,SAAS,CAAC,QAAQ,IAAI,EAAE,CAAC;IACjC,CAAC;IAED,KAAK,CAAC,QAAQ,CAAC,GAAY,EAAE,IAAmC;QAC/D,MAAM,EAAE,MAAM,EAAE,GAAG,MAAM,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;QACxD,OAAO,uBAAU,CAAA,UAAU,CAAC,GAAG,MAAM,CAAC,GAAG;YACvC,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC,GAAG,EAAE,MAAM,CAAC,GAAG,CAAC;YACzC,CAAC,CAAC,EAAE;;;YAGI,IAAI,CAAC,KAAK,CAAC,IAAI;aACd,MAAM,CAAC,GAAG,EAAE,EAAE,IAAI,EAAE;;;;YAIrB,IAAI,CAAC,KAAK,CAAC,IAAI;aACd,MAAM,CAAC,GAAG,EAAE,QAAQ,IAAI,EAAE;MACjC,CAAC;IACN,CAAC;IAED,KAAK,CAAC,kBAAkB,CACvB,GAAY,EACZ,IAAmC,EACnC,YAAoB,EACpB,OAAe;QAEf,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,kBAAkB,CAC9C,GAAG,EACH,IAAI,EACJ,YAAY,EACZ,OAAO,CACP,CAAC;QACF,MAAM,EAAE,MAAM,EAAE,GAAG,MAAM,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;QACxD,OAAO;YACN,GAAG,QAAQ;YACX,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,OAAO;YAC/B,QAAQ,EAAE,QAAQ,CAAC,QAAQ,IAAI,CAAC,MAAM,CAAC,GAAG;YAC1C,KAAK,EAAE,KAAK;SACZ,CAAC;IACH,CAAC;CACD;AAjDD,oBAiDC"}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.Photo = void 0;
|
|
4
|
+
const tempstream_1 = require("tempstream");
|
|
5
|
+
const file_1 = require("./file");
|
|
6
|
+
const sealious_1 = require("sealious");
|
|
7
|
+
class Photo extends file_1.File {
|
|
8
|
+
constructor(field, imageRouter, options) {
|
|
9
|
+
super(field, options);
|
|
10
|
+
this.field = field;
|
|
11
|
+
this.imageRouter = imageRouter;
|
|
12
|
+
}
|
|
13
|
+
async getImgStyle() {
|
|
14
|
+
return "width: 100px; height: 100px; object-fit: contain";
|
|
15
|
+
}
|
|
16
|
+
async renderFilePreview(ctx, file_data) {
|
|
17
|
+
const { id, filename } = file_data;
|
|
18
|
+
const class_name = "file_preview";
|
|
19
|
+
if (!id) {
|
|
20
|
+
return `<div class="${class_name}"></div>`;
|
|
21
|
+
}
|
|
22
|
+
const file = await sealious_1.File.fromID(ctx.$app, id);
|
|
23
|
+
return tempstream_1.tempstream /* HTML */ `<div class="${class_name}">
|
|
24
|
+
${this.imageRouter.image({
|
|
25
|
+
resolutions: [100],
|
|
26
|
+
sizes_attr: "100px",
|
|
27
|
+
path: file.getDataPath(),
|
|
28
|
+
img_style: await this.getImgStyle(),
|
|
29
|
+
})}
|
|
30
|
+
</div>`;
|
|
31
|
+
}
|
|
32
|
+
async getInputAttributes(ctx, data, field_prefix, form_id) {
|
|
33
|
+
const original = (await super.getInputAttributes(ctx, data, field_prefix, form_id));
|
|
34
|
+
const { parsed } = await this.field.getValue(ctx, data);
|
|
35
|
+
return {
|
|
36
|
+
...original,
|
|
37
|
+
onchange: (original.onchange || "") +
|
|
38
|
+
";" +
|
|
39
|
+
`
|
|
40
|
+
const file = this.files[0];
|
|
41
|
+
const preview_container = this.parentElement.querySelector(".file_preview");
|
|
42
|
+
const target = this;
|
|
43
|
+
if (file) {
|
|
44
|
+
const fileReader = new FileReader();
|
|
45
|
+
fileReader.readAsDataURL(file);
|
|
46
|
+
fileReader.addEventListener("load", function () {
|
|
47
|
+
preview_container.innerHTML = \`<img src="\${this.result}" style="${await this.getImgStyle()}" />\`;
|
|
48
|
+
});
|
|
49
|
+
}`
|
|
50
|
+
.replaceAll("\n", " ")
|
|
51
|
+
.replaceAll(`"`, "'"),
|
|
52
|
+
};
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
exports.Photo = Photo;
|
|
56
|
+
//# sourceMappingURL=photo.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"photo.js","sourceRoot":"","sources":["../../../src/forms/controls/photo.ts"],"names":[],"mappings":";;;AACA,2CAAyD;AACzD,iCAA8B;AAC9B,uCAAgD;AAMhD,MAAa,KAAM,SAAQ,WAAI;IAC9B,YACQ,KAAwC,EACxC,WAAqC,EAC5C,OAA4B;QAE5B,KAAK,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;QAJf,UAAK,GAAL,KAAK,CAAmC;QACxC,gBAAW,GAAX,WAAW,CAA0B;IAI7C,CAAC;IAED,KAAK,CAAC,WAAW;QAChB,OAAO,kDAAkD,CAAC;IAC3D,CAAC;IAED,KAAK,CAAC,iBAAiB,CACtB,GAAY,EACZ,SAA6C;QAE7C,MAAM,EAAE,EAAE,EAAE,QAAQ,EAAE,GAAG,SAAS,CAAC;QACnC,MAAM,UAAU,GAAG,cAAc,CAAC;QAClC,IAAI,CAAC,EAAE,EAAE;YACR,OAAO,eAAe,UAAU,UAAU,CAAC;SAC3C;QACD,MAAM,IAAI,GAAG,MAAM,eAAY,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACrD,OAAO,uBAAU,CAAA,UAAU,CAAC,eAAe,UAAU;KAClD,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;YACxB,WAAW,EAAE,CAAC,GAAG,CAAC;YAClB,UAAU,EAAE,OAAO;YACnB,IAAI,EAAE,IAAI,CAAC,WAAW,EAAE;YACxB,SAAS,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE;SACnC,CAAC;SACI,CAAC;IACT,CAAC;IAED,KAAK,CAAC,kBAAkB,CACvB,GAAY,EACZ,IAAmC,EACnC,YAAoB,EACpB,OAAe;QAEf,MAAM,QAAQ,GAAG,CAAC,MAAM,KAAK,CAAC,kBAAkB,CAC/C,GAAG,EACH,IAAI,EACJ,YAAY,EACZ,OAAO,CACP,CAAqC,CAAC;QACvC,MAAM,EAAE,MAAM,EAAE,GAAG,MAAM,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;QACxD,OAAO;YACN,GAAG,QAAQ;YACX,QAAQ,EACP,CAAC,QAAQ,CAAC,QAAQ,IAAI,EAAE,CAAC;gBACzB,GAAG;gBACH;;;;;;;;4EAQwE,MAAM,IAAI,CAAC,WAAW,EAAE;;EAElG;qBACI,UAAU,CAAC,IAAI,EAAE,GAAG,CAAC;qBACrB,UAAU,CAAC,GAAG,EAAE,GAAG,CAAC;SACvB,CAAC;IACH,CAAC;CACD;AAlED,sBAkEC"}
|
|
@@ -26,7 +26,9 @@ class SimpleInput extends controls_1.FormFieldControl {
|
|
|
26
26
|
return this.options.id || this.field.name;
|
|
27
27
|
}
|
|
28
28
|
getPlaceholder() {
|
|
29
|
-
return this.options.placeholder
|
|
29
|
+
return this.options.placeholder === ""
|
|
30
|
+
? ""
|
|
31
|
+
: this.options.placeholder || this.getType();
|
|
30
32
|
}
|
|
31
33
|
async getInputAttributes(ctx, data, field_prefix, form_id) {
|
|
32
34
|
const readonly = this.options.readonly || false;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"simple-input.js","sourceRoot":"","sources":["../../../src/forms/controls/simple-input.ts"],"names":[],"mappings":";;;AACA,2CAAyD;AACzD,6CAA2C;AAC3C,6DAA2E;AAG3E,yCAA8C;AA2B9C,MAAa,WAGX,SAAQ,2BAAgB;IAEzB,YACQ,KAAsC,EAC7C,OAAiB;QAEjB,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;QAHR,UAAK,GAAL,KAAK,CAAiC;QAI7C,IAAI,CAAC,OAAO,GAAG,OAAO,IAAI,EAAE,CAAC;IAC9B,CAAC;IAED,KAAK,CAAC,QAAQ,CACb,IAAa,EACb,KAAoC;QAEpC,OAAO,EAAE,CAAC;IACX,CAAC;IAED,OAAO;QACN,OAAO,IAAI,CAAC,OAAO,CAAC,IAAI,IAAI,MAAM,CAAC;IACpC,CAAC;IAED,QAAQ;QACP,OAAO,IAAI,CAAC,OAAO,CAAC,KAAK,IAAI,SAAS;YACrC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK;YACpB,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;IACpB,CAAC;IAED,KAAK;QACJ,OAAO,IAAI,CAAC,OAAO,CAAC,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;IAC3C,CAAC;IAED,cAAc;QACb,OAAO,IAAI,CAAC,OAAO,CAAC,WAAW,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"simple-input.js","sourceRoot":"","sources":["../../../src/forms/controls/simple-input.ts"],"names":[],"mappings":"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"}
|
|
@@ -48,7 +48,6 @@ class MountableWithFields extends mountable_1.Mountable {
|
|
|
48
48
|
return { valid, field_errors, form_messages };
|
|
49
49
|
}
|
|
50
50
|
renderControls(ctx, data, validate) {
|
|
51
|
-
console.log("RENDER CONTROLS", data.raw_values);
|
|
52
51
|
return tempstream_1.tempstream /* HTML */ `${this.controls.map((control) => control.render(ctx, data.raw_values, data.messages, this.field_names_prefix, this.form_id, validate))}`;
|
|
53
52
|
}
|
|
54
53
|
async renderError(_, error) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mountable-with-fields.js","sourceRoot":"","sources":["../../src/page/mountable-with-fields.ts"],"names":[],"mappings":";;;AAEA,2CAAyD;AAIzD,2CAAwC;AAMxC,MAAsB,mBAEpB,SAAQ,qBAAS;IAMlB;QACC,KAAK,EAAE,CAAC;QALT,uBAAkB,GAAG,EAAE,CAAC,CAAC,2GAA2G;QACpI,YAAO,GAAG,EAAE,CAAC,CAAC,mEAAmE;QAKhF,IAAI,CAAC,IAAI,CAAC,MAAM;YAAE,IAAI,CAAC,MAAM,GAAG,EAAO,CAAC;IACzC,CAAC;IAED,IAAI;QACH,KAAK,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE;YACxD,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SACjB;IACF,CAAC;IAED,sCAAsC;IACtC,KAAK,CAAC,cAAc,CACnB,GAAY,EACZ,IAAmC;QAEnC,OAAO;YACN,KAAK,EAAE,IAAI;YACX,KAAK,EAAE,EAAE;SACT,CAAC;IACH,CAAC;IAED,KAAK,CAAC,QAAQ,CACb,GAAY,EACZ,MAAqC;QAMrC,MAAM,YAAY,GAAG,EAAkC,CAAC;QACxD,IAAI,KAAK,GAAG,IAAI,CAAC;QACjB,MAAM,aAAa,GAAG,EAAmB,CAAC;QAC1C,MAAM,OAAO,CAAC,GAAG,CAChB,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC;aACpB,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,EAAE,EAAE,CAAC,SAAS,IAAI,IAAI,CAAC,MAAM,CAAC;aACjD,GAAG,CAAC,KAAK,EAAE,CAAC,GAAG,CAA2B,EAAE,EAAE;YAC9C,MAAM,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;YAC/B,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,YAAY,EAAE,GACjD,MAAM,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC;YACnC,IAAI,CAAC,UAAU,EAAE;gBAChB,KAAK,GAAG,KAAK,CAAC;gBACd,YAAY,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,YAAY,CAAC;aACxC;QACF,CAAC,CAAC,CACH,CAAC;QACF,MAAM,oBAAoB,GAAG,MAAM,IAAI,CAAC,cAAc,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC;QACpE,IAAI,CAAC,oBAAoB,CAAC,KAAK,EAAE;YAChC,aAAa,CAAC,IAAI,CAAC;gBAClB,IAAI,EAAE,OAAO;gBACb,IAAI,EAAE,oBAAoB,CAAC,KAAK;aAChC,CAAC,CAAC;YACH,KAAK,GAAG,KAAK,CAAC;SACd;QACD,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,CAAC;IAC/C,CAAC;IAEM,cAAc,CACpB,GAAY,EACZ,IAA4B,EAC5B,QAAiB;QAEjB,OAAO,
|
|
1
|
+
{"version":3,"file":"mountable-with-fields.js","sourceRoot":"","sources":["../../src/page/mountable-with-fields.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sealcode/sealgen",
|
|
3
|
-
"version": "0.8.
|
|
3
|
+
"version": "0.8.13",
|
|
4
4
|
"description": "Module to automate adding routes and collections to a sealious application",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -52,6 +52,7 @@
|
|
|
52
52
|
"peerDependencies": {
|
|
53
53
|
"@koa/router": "^10.1.1",
|
|
54
54
|
"koa": "^2.13.0",
|
|
55
|
+
"koa-responsive-image-router": "^0.2.2",
|
|
55
56
|
"sealious": "^0.17.9"
|
|
56
57
|
}
|
|
57
58
|
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Context } from "koa";
|
|
2
|
+
import { FlatTemplatable, tempstream } from "tempstream";
|
|
2
3
|
import { FileContainer } from "../fields/file";
|
|
3
4
|
import { FormDataValue } from "../form";
|
|
4
5
|
import { SimpleInput } from "./simple-input";
|
|
@@ -8,9 +9,18 @@ export class File extends SimpleInput<FileContainer> {
|
|
|
8
9
|
return "file";
|
|
9
10
|
}
|
|
10
11
|
|
|
12
|
+
async renderFilePreview(
|
|
13
|
+
ctx: Context,
|
|
14
|
+
file_data: { id?: string; filename?: string }
|
|
15
|
+
): Promise<FlatTemplatable> {
|
|
16
|
+
return file_data.filename || "";
|
|
17
|
+
}
|
|
18
|
+
|
|
11
19
|
async preInput(ctx: Context, data: Record<string, FormDataValue>) {
|
|
12
20
|
const { parsed } = await this.field.getValue(ctx, data);
|
|
13
|
-
return /* HTML */
|
|
21
|
+
return tempstream/* HTML */ `${parsed.old
|
|
22
|
+
? this.renderFilePreview(ctx, parsed.old)
|
|
23
|
+
: ""}
|
|
14
24
|
<input
|
|
15
25
|
type="hidden"
|
|
16
26
|
name="${this.field.name}[old][id]"
|
|
@@ -28,7 +38,7 @@ export class File extends SimpleInput<FileContainer> {
|
|
|
28
38
|
data: Record<string, FormDataValue>,
|
|
29
39
|
field_prefix: string,
|
|
30
40
|
form_id: string
|
|
31
|
-
) {
|
|
41
|
+
): Promise<Record<string, string | boolean>> {
|
|
32
42
|
const original = await super.getInputAttributes(
|
|
33
43
|
ctx,
|
|
34
44
|
data,
|
|
@@ -41,10 +51,6 @@ export class File extends SimpleInput<FileContainer> {
|
|
|
41
51
|
name: this.field.name + "[new]",
|
|
42
52
|
required: original.required && !parsed.old,
|
|
43
53
|
value: false,
|
|
44
|
-
onchange:
|
|
45
|
-
(original.onchange || "") +
|
|
46
|
-
";" +
|
|
47
|
-
"filename = this.value.split('\\\\').slice(-1)[0]; this.parentElement.style.setProperty('--filename', '\\'Wybrany plik: ' + filename + '\\'')",
|
|
48
54
|
};
|
|
49
55
|
}
|
|
50
56
|
}
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
import { Context } from "koa";
|
|
2
|
+
import { FlatTemplatable, tempstream } from "tempstream";
|
|
3
|
+
import { File } from "./file";
|
|
4
|
+
import { File as SealiousFile } from "sealious";
|
|
5
|
+
import { FileContainer, FormField } from "../fields/field";
|
|
6
|
+
import { SimpleInputOptions } from "./simple-input";
|
|
7
|
+
import KoaResponsiveImageRouter from "koa-responsive-image-router";
|
|
8
|
+
import { FormDataValue } from "../form";
|
|
9
|
+
|
|
10
|
+
export class Photo extends File {
|
|
11
|
+
constructor(
|
|
12
|
+
public field: FormField<boolean, FileContainer>,
|
|
13
|
+
public imageRouter: KoaResponsiveImageRouter,
|
|
14
|
+
options?: SimpleInputOptions
|
|
15
|
+
) {
|
|
16
|
+
super(field, options);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
async getImgStyle() {
|
|
20
|
+
return "width: 100px; height: 100px; object-fit: contain";
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
async renderFilePreview(
|
|
24
|
+
ctx: Context,
|
|
25
|
+
file_data: { id?: string; filename?: string }
|
|
26
|
+
): Promise<FlatTemplatable> {
|
|
27
|
+
const { id, filename } = file_data;
|
|
28
|
+
const class_name = "file_preview";
|
|
29
|
+
if (!id) {
|
|
30
|
+
return `<div class="${class_name}"></div>`;
|
|
31
|
+
}
|
|
32
|
+
const file = await SealiousFile.fromID(ctx.$app, id);
|
|
33
|
+
return tempstream/* HTML */ `<div class="${class_name}">
|
|
34
|
+
${this.imageRouter.image({
|
|
35
|
+
resolutions: [100],
|
|
36
|
+
sizes_attr: "100px",
|
|
37
|
+
path: file.getDataPath(),
|
|
38
|
+
img_style: await this.getImgStyle(),
|
|
39
|
+
})}
|
|
40
|
+
</div>`;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
async getInputAttributes(
|
|
44
|
+
ctx: Context,
|
|
45
|
+
data: Record<string, FormDataValue>,
|
|
46
|
+
field_prefix: string,
|
|
47
|
+
form_id: string
|
|
48
|
+
) {
|
|
49
|
+
const original = (await super.getInputAttributes(
|
|
50
|
+
ctx,
|
|
51
|
+
data,
|
|
52
|
+
field_prefix,
|
|
53
|
+
form_id
|
|
54
|
+
)) as Record<string, string | boolean>;
|
|
55
|
+
const { parsed } = await this.field.getValue(ctx, data);
|
|
56
|
+
return {
|
|
57
|
+
...original,
|
|
58
|
+
onchange:
|
|
59
|
+
(original.onchange || "") +
|
|
60
|
+
";" +
|
|
61
|
+
`
|
|
62
|
+
const file = this.files[0];
|
|
63
|
+
const preview_container = this.parentElement.querySelector(".file_preview");
|
|
64
|
+
const target = this;
|
|
65
|
+
if (file) {
|
|
66
|
+
const fileReader = new FileReader();
|
|
67
|
+
fileReader.readAsDataURL(file);
|
|
68
|
+
fileReader.addEventListener("load", function () {
|
|
69
|
+
preview_container.innerHTML = \`<img src="\${this.result}" style="${await this.getImgStyle()}" />\`;
|
|
70
|
+
});
|
|
71
|
+
}`
|
|
72
|
+
.replaceAll("\n", " ")
|
|
73
|
+
.replaceAll(`"`, "'"),
|
|
74
|
+
};
|
|
75
|
+
}
|
|
76
|
+
}
|
|
@@ -80,7 +80,6 @@ export abstract class MountableWithFields<
|
|
|
80
80
|
data: FormData<keyof Fields>,
|
|
81
81
|
validate: boolean
|
|
82
82
|
): FlatTemplatable {
|
|
83
|
-
console.log("RENDER CONTROLS", data.raw_values);
|
|
84
83
|
return tempstream/* HTML */ `${this.controls.map((control) =>
|
|
85
84
|
control.render(
|
|
86
85
|
ctx,
|