From 1bb992facc81f46881bcb419a21c213eeb0fab95 Mon Sep 17 00:00:00 2001 From: jorg-vr Date: Thu, 1 Jun 2023 14:30:01 +0200 Subject: [PATCH 01/21] Inline saved title form --- .../components/annotations/annotation_form.ts | 130 ++++++++++-------- .../saved_annotation_input.ts | 3 - 2 files changed, 75 insertions(+), 58 deletions(-) diff --git a/app/assets/javascripts/components/annotations/annotation_form.ts b/app/assets/javascripts/components/annotations/annotation_form.ts index 9c22e808c8..d56b507129 100644 --- a/app/assets/javascripts/components/annotations/annotation_form.ts +++ b/app/assets/javascripts/components/annotations/annotation_form.ts @@ -43,10 +43,18 @@ export class AnnotationForm extends watchMixin(ShadowlessLitElement) { @property({ state: true }) _savedAnnotationId = ""; @property({ state: true }) - savedAnnotationTitle: string; + _savedAnnotationTitle: string; @property({ state: true }) saveAnnotation = false; + get savedAnnotationTitle(): string { + return this._savedAnnotationTitle || this._annotationText.split(/\s+/).slice(0, 5).join(" ").slice(0, 40); + } + + set savedAnnotationTitle(title: string) { + this._savedAnnotationTitle = title; + } + inputRef: Ref = createRef(); titleRef: Ref = createRef(); @@ -132,16 +140,40 @@ export class AnnotationForm extends watchMixin(ShadowlessLitElement) { toggleSaveAnnotation(): void { this.saveAnnotation = !this.saveAnnotation; - if (this.saveAnnotation && !this.savedAnnotationTitle) { - // Take the first five words, with a max of 40 chars as default title - this.savedAnnotationTitle = this._annotationText.split(/\s+/).slice(0, 5).join(" ").slice(0, 40); - } } render(): TemplateResult { + console.log(this._savedAnnotationId); return html`
- ${annotationState.isQuestionMode || /* REMOVE AFTER CLOSED BETA */ !isBetaCourse() ? "" : html` +
+
+
+ +
+ ${unsafeHTML(I18n.t("js.user_annotation.help"))} + ${annotationState.isQuestionMode ? html` + ${unsafeHTML(I18n.t("js.user_annotation.help_student"))} + ` : ""} + + ${I18n.formatNumber(this._annotationText.length)} / ${I18n.formatNumber(maxLength)} + +
+
+
+ ${annotationState.isQuestionMode || /* REMOVE AFTER CLOSED BETA */ !isBetaCourse() ? "" : html` +
- `} -
- ${annotationState.isQuestionMode || /* REMOVE AFTER CLOSED BETA */ !isBetaCourse() ? "" : html` - - `} - -
- ${unsafeHTML(I18n.t("js.user_annotation.help"))} - ${annotationState.isQuestionMode ? html` - ${unsafeHTML(I18n.t("js.user_annotation.help_student"))} - ` : ""} - - ${I18n.formatNumber(this._annotationText.length)} / ${I18n.formatNumber(maxLength)} -
+ `}
${annotationState.isQuestionMode || /* REMOVE AFTER CLOSED BETA */ !isBetaCourse() ? "" : html` -
-
- - +
+
+
+
+ + +
+
+ ${!this.saveAnnotation ? "" : html` +
+
+ +
+ this.handleUpdateTitle()} + value=${this.savedAnnotationTitle} + id="saved-annotation-title" + > +
+
+
+ `}
- ${ this.saveAnnotation ? html` -
- - this.handleUpdateTitle()} - value=${this.savedAnnotationTitle} - id="saved-annotation-title" - > -
- ` : html``} `}
${annotationState.isQuestionMode || /* REMOVE AFTER CLOSED BETA */ !isBetaCourse() ? "" : html` -
- -
+
+ ${this.saveAnnotation ? html` + + this.handleUpdateTitle()} + value=${this.savedAnnotationTitle} + id="saved-annotation-title" + > + ` : html` + + `} +
`}
${annotationState.isQuestionMode || /* REMOVE AFTER CLOSED BETA */ !isBetaCourse() ? "" : html` @@ -248,26 +263,6 @@ export class AnnotationForm extends watchMixin(ShadowlessLitElement) {
- ${!this.saveAnnotation ? "" : html` -
-
- -
- this.handleUpdateTitle()} - value=${this.savedAnnotationTitle} - id="saved-annotation-title" - > -
-
-
- `} `}
From 02dd3ef05df129c36d7944e8fd719b367c6b51a7 Mon Sep 17 00:00:00 2001 From: jorg-vr Date: Thu, 3 Aug 2023 15:21:23 +0200 Subject: [PATCH 03/21] Aling save checkbox with the buttons --- .../components/annotations/annotation_form.ts | 44 +++++++++---------- .../components/code_listing.css.scss | 22 ---------- 2 files changed, 22 insertions(+), 44 deletions(-) diff --git a/app/assets/javascripts/components/annotations/annotation_form.ts b/app/assets/javascripts/components/annotations/annotation_form.ts index 09087fcb86..838fd31bcf 100644 --- a/app/assets/javascripts/components/annotations/annotation_form.ts +++ b/app/assets/javascripts/components/annotations/annotation_form.ts @@ -245,10 +245,10 @@ export class AnnotationForm extends watchMixin(ShadowlessLitElement) {
`} - ${annotationState.isQuestionMode || /* REMOVE AFTER CLOSED BETA */ !isBetaCourse() ? "" : html` -
-
-
+
+
+ ${annotationState.isQuestionMode || /* REMOVE AFTER CLOSED BETA */ !isBetaCourse() ? "" : html` +
-
-
+ `} +
+
+ +
- `} -
- -
`; diff --git a/app/assets/stylesheets/components/code_listing.css.scss b/app/assets/stylesheets/components/code_listing.css.scss index 775b0fb58b..c648772e08 100644 --- a/app/assets/stylesheets/components/code_listing.css.scss +++ b/app/assets/stylesheets/components/code_listing.css.scss @@ -478,28 +478,6 @@ .annotation-submission { padding: 5px; - .annotation-controls-block { - display: flex; - justify-content: space-between; - align-items: center; - } - - .annotation-submission-button-container { - margin-top: 12px; - margin-bottom: 12px; - text-align: right; - - .annotation-control-button, - .question-control-button { - margin-left: 3px; - } - - .annotation-submission-error-list { - margin-top: 3px; - margin-bottom: 3px; - } - } - .annotation-submission-input { border-radius: 0; resize: vertical; From d78e69379bb95a58ceffbef4c44304d32507b17b Mon Sep 17 00:00:00 2001 From: jorg-vr Date: Thu, 3 Aug 2023 15:26:47 +0200 Subject: [PATCH 04/21] Fix non beta courses --- .../components/annotations/annotation_form.ts | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/app/assets/javascripts/components/annotations/annotation_form.ts b/app/assets/javascripts/components/annotations/annotation_form.ts index 838fd31bcf..b88e835dde 100644 --- a/app/assets/javascripts/components/annotations/annotation_form.ts +++ b/app/assets/javascripts/components/annotations/annotation_form.ts @@ -188,12 +188,16 @@ export class AnnotationForm extends watchMixin(ShadowlessLitElement) { this.saveAnnotation = !this.saveAnnotation; } + get canSaveAnnotation(): boolean { + return !annotationState.isQuestionMode && /* REMOVE AFTER CLOSED BETA */ isBetaCourse(); + } + render(): TemplateResult { console.log(this._savedAnnotationId); return html`
-
+