More improvements for IDAA BB

This commit is contained in:
Scott Idem
2025-07-07 18:01:57 -04:00
parent 2eb4ddf1eb
commit b028bd7b32
3 changed files with 49 additions and 37 deletions

View File

@@ -172,7 +172,7 @@ onDestroy(() => {
spellcheck="false" spellcheck="false"
class="tiptap overflow-auto relative"> class="tiptap overflow-auto relative">
<span <span
class="placeholder text-sm text-gray-400 italic absolute p-3" class="placeholder text-sm text-gray-400 italic absolute p-3 w-full"
contenteditable="false" contenteditable="false"
hidden={editor?.getHTML() !== '<p></p>'} hidden={editor?.getHTML() !== '<p></p>'}
>{placeholder}</span> >{placeholder}</span>

View File

@@ -430,18 +430,22 @@ $effect(() => {
<div> <div>
<label for="title" class="w-full"> <label for="title" class="w-full">
<span class="text-sm text-gray-600 dark:text-gray-400"> <span class="text-sm font-semibold text-surface-600-400">
Title of BB post: Title of BB post:
</span> </span>
<input <input
type="text" id="title" name="title" required max="200" bind:value={$idaa_slct.post_obj.title} placeholder="Title of Post" autocomplete="off" type="text" id="title" name="title" required max="200" bind:value={$idaa_slct.post_obj.title} placeholder="Title of Post" autocomplete="off"
class="input w-full form-control" class="
input w-full
preset-tonal-surface hover:preset-filled-surface-100-900
form-control
"
/> />
</label> </label>
</div> </div>
<label for="content" class="ae_label post__content w-full"> <label for="content" class="ae_label post__content w-full">
<span class="legend text-sm font-semibold text-gray-600 dark:text-gray-400"> <span class="legend text-sm font-semibold text-surface-600-400">
Content (post body): Content (post body):
</span> </span>
<!-- <textarea name="content" id="content" class="ae_value post__content tinymce_editor editor_basic textarea" rows="5" cols="70" bind:value={$idaa_slct.post_obj.content} ></textarea> --> <!-- <textarea name="content" id="content" class="ae_value post__content tinymce_editor editor_basic textarea" rows="5" cols="70" bind:value={$idaa_slct.post_obj.content} ></textarea> -->
@@ -459,7 +463,7 @@ $effect(() => {
}} }}
bind:new_html={content_new_html} bind:new_html={content_new_html}
bind:changed={content_changed} bind:changed={content_changed}
classes="bg-gray-100 dark:bg-gray-800" classes="preset-tonal-surface hover:preset-filled-surface-100-900"
placeholder="Your post content here..." placeholder="Your post content here..."
/> />
{:else} {:else}
@@ -475,7 +479,7 @@ $effect(() => {
}} }}
bind:new_html={content_new_html} bind:new_html={content_new_html}
bind:changed={content_changed} bind:changed={content_changed}
classes="bg-gray-100 dark:bg-gray-800" classes="preset-tonal-surface hover:preset-filled-surface-100-900"
placeholder="Your post content here..." placeholder="Your post content here..."
/> />
{/if} {/if}
@@ -524,7 +528,7 @@ $effect(() => {
<span class="fas fa-upload"></span> <span class="fas fa-upload"></span>
<strong class="bg-green-100 p-1">Upload post files</strong> <strong class="bg-green-100 p-1">Upload post files</strong>
</div> </div>
<span class="text-sm text-gray-600 dark:text-gray-400 italic"> <span class="text-sm text-surface-600-400 italic">
<!-- <strong>Aether hosted files only</strong><br> --> <!-- <strong>Aether hosted files only</strong><br> -->
Recommended: documents (PDF) and images (png, webp, jpg) Recommended: documents (PDF) and images (png, webp, jpg)
<!-- , audio (mp3, m4a), and video (mp4, mkv) --> <!-- , audio (mp3, m4a), and video (mp4, mkv) -->
@@ -540,7 +544,7 @@ $effect(() => {
{#if $idaa_slct.post_obj?.linked_li_json && $idaa_slct.post_obj.linked_li_json.length} {#if $idaa_slct.post_obj?.linked_li_json && $idaa_slct.post_obj.linked_li_json.length}
<div class="ae_section flex flex-row flex-wrap gap-1 items-center justify-center"> <div class="ae_section flex flex-row flex-wrap gap-1 items-center justify-center">
<span class="fas fa-paperclip"></span> <span class="fas fa-paperclip"></span>
<span class="text-sm text-gray-600 dark:text-gray-400 italic">Linked files:</span> <span class="text-sm text-surface-600-400 italic">Linked files:</span>
{#each $idaa_slct.post_obj.linked_li_json as linked_obj, index} {#each $idaa_slct.post_obj.linked_li_json as linked_obj, index}
<span> <span>
<!-- <a <!-- <a
@@ -665,13 +669,14 @@ $effect(() => {
<div> <div>
<label class="form-group w-100"> <label class="form-group w-100">
<span class="text-sm text-gray-600 dark:text-gray-400"> <span class="text-sm font-semibold text-surface-600-400">
BB post topic: BB post topic:
</span> </span>
<select <select
name="topic_id" name="topic_id"
class=" class="
select w-96 preset-outline-secondary-500 select w-96 px-1
preset-tonal-surface hover:preset-filled-surface-100-900
form-control col-sm-12 form-control col-sm-12
" "
bind:value={$idaa_slct.post_obj.topic_id} bind:value={$idaa_slct.post_obj.topic_id}
@@ -689,30 +694,30 @@ $effect(() => {
</div> </div>
<h3 class="h3">Poster's Information</h3> <h3 class="h3 text-base font-bold text-surface-800-200">Poster's Information</h3>
<fieldset class="form-group"> <fieldset class="form-group">
<legend class="text-sm text-gray-600 dark:text-gray-400">Post as "Anonymous"?</legend> <legend class="legend text-sm font-semibold text-surface-600-400">Post as "Anonymous"?</legend>
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2 preset-tonal-surface hover:preset-filled-surface-100-900">
<input <input
type="radio" type="radio"
id="anonymous_no" id="anonymous_no"
name="anonymous" name="anonymous"
value={false} value={false}
bind:group={$idaa_slct.post_obj.anonymous} bind:group={$idaa_slct.post_obj.anonymous}
class="radio" class="radio form-check-input"
> >
<label for="anonymous_no"><strong>No</strong>, include my name and email address</label> <label for="anonymous_no" class="form-check-label"><strong>No</strong>, include my name and email address</label>
</div> </div>
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2 preset-tonal-surface hover:preset-filled-surface-100-900">
<input <input
type="radio" type="radio"
id="anonymous_yes" id="anonymous_yes"
name="anonymous" name="anonymous"
value={true} value={true}
bind:group={$idaa_slct.post_obj.anonymous} bind:group={$idaa_slct.post_obj.anonymous}
class="radio" class="radio form-check-input"
> >
<label for="anonymous_yes"><strong>Yes</strong>, the post will be listed as <strong>"Anonymous"</strong></label> <label for="anonymous_yes" class="form-check-label"><strong>Yes</strong>, the post will be listed as <strong>"Anonymous"</strong></label>
</div> </div>
</fieldset> </fieldset>
@@ -721,7 +726,7 @@ $effect(() => {
for="external_person_id" for="external_person_id"
class="block form-group d-block w-100" class="block form-group d-block w-100"
> >
<span class="text-sm text-gray-600 dark:text-gray-400"> <span class="text-sm font-semibold text-surface-600-400">
<span class="fas fa-link"></span> Linked with Novi ID <span class="fas fa-link"></span> Linked with Novi ID
</span> </span>
{#if !$ae_loc.trusted_access} {#if !$ae_loc.trusted_access}
@@ -732,7 +737,7 @@ $effect(() => {
name="external_person_id" name="external_person_id"
value={($idaa_slct.post_obj.external_person_id ? $idaa_slct.post_obj.external_person_id : $idaa_loc.novi_uuid)} value={($idaa_slct.post_obj.external_person_id ? $idaa_slct.post_obj.external_person_id : $idaa_loc.novi_uuid)}
readonly={true} readonly={true}
class="input w-96 form-control" class="input w-96 preset-tonal-surface hover:preset-filled-surface-100-900 form-control"
> >
{:else} {:else}
<div class="ae_highlight text-sm bg-yellow-100 p-2"> <div class="ae_highlight text-sm bg-yellow-100 p-2">
@@ -746,7 +751,7 @@ $effect(() => {
value={($idaa_slct.post_obj?.external_person_id ? $idaa_slct.post_obj value={($idaa_slct.post_obj?.external_person_id ? $idaa_slct.post_obj
?.external_person_id : '')} ?.external_person_id : '')}
readonly={!$ae_loc.administrator_access} readonly={!$ae_loc.administrator_access}
class="input w-96 form-control" class="input w-96 preset-tonal-surface hover:preset-filled-surface-100-900 form-control"
> >
{/if} {/if}
</label> </label>
@@ -754,7 +759,7 @@ $effect(() => {
<div> <div>
<label for="full_name" class="block form-group d-block w-75"> <label for="full_name" class="block form-group d-block w-75">
<span class="text-sm text-gray-600 dark:text-gray-400"> <span class="text-sm font-semibold text-surface-600-400">
Name Name
{#if !$ae_loc.trusted_access} {#if !$ae_loc.trusted_access}
<span class="fas fa-lock m-1" title="Field is locked"></span> <span class="fas fa-lock m-1" title="Field is locked"></span>
@@ -768,7 +773,7 @@ $effect(() => {
name="full_name" name="full_name"
value={($idaa_slct.post_obj?.full_name ? $idaa_slct?.post_obj.full_name : $idaa_loc.novi_full_name)} value={($idaa_slct.post_obj?.full_name ? $idaa_slct?.post_obj.full_name : $idaa_loc.novi_full_name)}
readonly={!$ae_loc.trusted_access} readonly={!$ae_loc.trusted_access}
class="input w-96 form-control" class="input w-96 preset-tonal-surface hover:preset-filled-surface-100-900 form-control"
> >
</label> </label>
</div> </div>
@@ -776,7 +781,7 @@ $effect(() => {
{#if $ae_loc.trusted_access} {#if $ae_loc.trusted_access}
<div> <div>
<label for="email" class="block form-group d-block w-75"> <label for="email" class="block form-group d-block w-75">
<span class="text-sm text-gray-600 dark:text-gray-400"> <span class="text-sm font-semibold text-surface-600-400">
Email Email
</span> </span>
{#if !$ae_loc.trusted_access} {#if !$ae_loc.trusted_access}
@@ -789,9 +794,9 @@ $effect(() => {
name="email" name="email"
value={($idaa_slct.post_obj?.email ? $idaa_slct.post_obj?.email : $idaa_loc.novi_email ?? '')} value={($idaa_slct.post_obj?.email ? $idaa_slct.post_obj?.email : $idaa_loc.novi_email ?? '')}
readonly={!$ae_loc.trusted_access} readonly={!$ae_loc.trusted_access}
class="input w-96 form-control" class="input w-96 preset-tonal-surface hover:preset-filled-surface-100-900 form-control"
> >
<span class="text-xs text-gray-600 dark:text-gray-400 italic"> <span class="text-xs text-surface-600-400 italic">
Secondary link using the Novi email address Secondary link using the Novi email address
</span> </span>
</label> </label>
@@ -801,29 +806,29 @@ $effect(() => {
{/if} {/if}
<!-- A yes/no radio button group to determine if they want to be notified of comments on this post. --> <!-- A yes/no radio button group to determine if they want to be notified of comments on this post. -->
<fieldset class=""> <fieldset class="form-group">
<legend class="legend text-sm text-gray-600 dark:text-gray-400"> <legend class="legend text-sm font-semibold text-surface-600-400">
Notify me of comments? Notify me of comments?
</legend> </legend>
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2 preset-tonal-surface hover:preset-filled-surface-100-900">
<input <input
type="radio" type="radio"
id="notify_no" id="notify_no"
name="notify" name="notify"
value={false} value={false}
bind:group={$idaa_slct.post_obj.notify} bind:group={$idaa_slct.post_obj.notify}
class="radio" class="radio form-check-input"
> >
<label for="notify_no"><strong>No</strong>, do not notify me of comments</label> <label for="notify_no"><strong>No</strong>, do not notify me of comments</label>
</div> </div>
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2 preset-tonal-surface hover:preset-filled-surface-100-900">
<input <input
type="radio" type="radio"
id="notify_yes" id="notify_yes"
name="notify" name="notify"
value={true} value={true}
bind:group={$idaa_slct.post_obj.notify} bind:group={$idaa_slct.post_obj.notify}
class="radio" class="radio form-check-input"
> >
<label for="notify_yes"><strong>Yes</strong>, notify me of comments</label> <label for="notify_yes"><strong>Yes</strong>, notify me of comments</label>
</div> </div>
@@ -979,7 +984,7 @@ $effect(() => {
for="notes" for="notes"
class="ae_label post__notes w-full" class="ae_label post__notes w-full"
> >
<span class="legend text-sm font-semibold text-gray-600 dark:text-gray-400">Internal Staff Notes</span> <span class="legend text-sm font-semibold text-surface-600-400">Internal Staff Notes</span>
<Tiptap_editor <Tiptap_editor
default_minimal={true} default_minimal={true}
html_text={$idaa_slct.post_obj.notes} html_text={$idaa_slct.post_obj.notes}
@@ -1010,7 +1015,7 @@ $effect(() => {
{#if $idaa_slct.post_id} {#if $idaa_slct.post_id}
<button <button
type="submit" type="submit"
disabled={!(disable_submit_btn || !obj_changed)} disabled={(disable_submit_btn || !obj_changed)}
class=" class="
novi_btn btn-warning novi_btn btn-warning
btn preset-tonal-success btn preset-tonal-success

View File

@@ -31,17 +31,23 @@ if (log_lvl) console.log('** Component Loaded: ** Post Options');
class="flex flex-row gap-1 items-center justify-around" class="flex flex-row gap-1 items-center justify-around"
> >
<label <label
class="text-sm w-32 text-right" class="text-sm w-32 md:w-42 form-group"
for="qry_limit__posts"> for="qry_limit__posts">
Max posts: Max posts:
</label>
<select <select
id="qry_limit__posts" id="qry_limit__posts"
bind:value={$idaa_loc.bb.qry__limit} bind:value={$idaa_loc.bb.qry__limit}
on:change={() => { on:change={() => {
$idaa_trig.post_li = true; $idaa_trig.post_li = true;
}} }}
class="select w-20 text-sm" class="
select w-20 text-sm inline-block
px-1
preset-tonal-tertiary
preset-outline-tertiary-200-800
form-control col-sm-12
"
> >
<option value={10}>10</option> <option value={10}>10</option>
<option value={25}>25</option> <option value={25}>25</option>
@@ -51,6 +57,7 @@ if (log_lvl) console.log('** Component Loaded: ** Post Options');
<option value={200} class:hidden={!$ae_loc.trusted_access}>200</option> <option value={200} class:hidden={!$ae_loc.trusted_access}>200</option>
<option value={500} class:hidden={!$ae_loc.trusted_access}>500</option> <option value={500} class:hidden={!$ae_loc.trusted_access}>500</option>
</select> </select>
</label>
</span> </span>
{#if $ae_loc.trusted_access && (!$idaa_loc.bb.qry__hidden || $idaa_loc.bb.qry__hidden == 'not_hidden')} {#if $ae_loc.trusted_access && (!$idaa_loc.bb.qry__hidden || $idaa_loc.bb.qry__hidden == 'not_hidden')}