added cache for task and wiki page markdown editor, reverted previous attempt
Signed-off-by: Stephan Richter <s.richter@srsoftware.de>
This commit is contained in:
@@ -6,9 +6,9 @@
|
||||
let {
|
||||
editable = true,
|
||||
onclick = evt => {},
|
||||
onRender = src => {},
|
||||
onSet = newVal => {return true;},
|
||||
simple = false,
|
||||
store_id = null,
|
||||
type = 'div',
|
||||
value = $bindable({source:null,rendered:null})
|
||||
} = $props();
|
||||
@@ -16,6 +16,7 @@
|
||||
let editing = $state(false);
|
||||
let editValue = $state({source:value.source,rendered:value.rendered});
|
||||
let start = 0;
|
||||
let stored_source = $state(store_id ? localStorage.getItem(store_id) : null);
|
||||
let timer = null;
|
||||
|
||||
async function applyEdit(){
|
||||
@@ -28,6 +29,7 @@
|
||||
}
|
||||
|
||||
function doSave(){
|
||||
if (store_id) localStorage.removeItem(store_id);
|
||||
if (simple){
|
||||
onSet(editValue.source);
|
||||
} else applyEdit();
|
||||
@@ -51,7 +53,7 @@
|
||||
body : editValue.source
|
||||
});
|
||||
editValue.rendered = await resp.text();
|
||||
onRender(editValue.source);
|
||||
if (store_id) localStorage.setItem(store_id,editValue.source);
|
||||
}
|
||||
|
||||
function typed(ev){
|
||||
@@ -102,13 +104,37 @@
|
||||
measured(evt, evt.timeStamp - start);
|
||||
}
|
||||
|
||||
function restore(ev){
|
||||
editValue.source = stored_source;
|
||||
stored_source = null;
|
||||
render();
|
||||
}
|
||||
|
||||
activeField.subscribe((val) => resetEdit());
|
||||
if (simple) startEdit();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.markdown{
|
||||
position: relative;
|
||||
}
|
||||
#restore_markdown{
|
||||
position: absolute;
|
||||
right: 50%;
|
||||
top: -10px;
|
||||
background: orange;
|
||||
color: black;
|
||||
padding: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="markdown {editing?'editing':''}">
|
||||
{#if editing}
|
||||
<span class="hint">{@html t('markdown_supported')}</span>
|
||||
{#if stored_source}
|
||||
<span id="restore_markdown" onclick={restore} class="hint">{t('unsaved_content')}</span>
|
||||
{/if}
|
||||
<textarea bind:value={editValue.source} onkeyup={typed} autofocus={!simple}></textarea>
|
||||
<div class="preview">{@html target(editValue.rendered)}</div>
|
||||
{#if !simple}
|
||||
|
||||
@@ -16,8 +16,8 @@
|
||||
let extendedSettings = $state(false);
|
||||
let parent_task = $state(null);
|
||||
let task = $state({
|
||||
name : localStorage.getItem('task.name'),
|
||||
description : { source : localStorage.getItem('task.markdown'), rendered : '' },
|
||||
name : '',
|
||||
description : { source:'',rendered:''},
|
||||
due_date : null,
|
||||
est_time : null,
|
||||
members : {},
|
||||
@@ -110,8 +110,7 @@
|
||||
body : JSON.stringify(task)
|
||||
});
|
||||
if (resp.ok) {
|
||||
localStorage.removeItem('task.markdown');
|
||||
localStorage.removeItem('task.name');
|
||||
localStorage.removeItem(`task/${task.id}/description`);
|
||||
if (!assignee) { // if assignee is set, this form was opened within an external context. hence we don`t want to navigate somewhere else!
|
||||
task = await resp.json();
|
||||
if (task.parent_task_id){
|
||||
@@ -124,12 +123,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
function storeSource(markdown){
|
||||
if (markdown) localStorage.setItem('task.markdown',markdown);
|
||||
localStorage.setItem('task.name',task.name);
|
||||
}
|
||||
|
||||
|
||||
function toggleSettings(){
|
||||
extendedSettings = !extendedSettings;
|
||||
}
|
||||
@@ -143,120 +136,74 @@
|
||||
|
||||
<fieldset>
|
||||
<legend>{t('add_object',{object:t('task')})}</legend>
|
||||
<table {onkeydown}>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>
|
||||
{t('name')}
|
||||
</th>
|
||||
<td>
|
||||
<input bind:value={task.name} autofocus>
|
||||
</td>
|
||||
</tr>
|
||||
{#if project}
|
||||
<tr>
|
||||
<th>
|
||||
{t('project')}
|
||||
</th>
|
||||
<td>
|
||||
{project.name}
|
||||
</td>
|
||||
</tr>
|
||||
{/if}
|
||||
{#if parent_task}
|
||||
<tr>
|
||||
<th>
|
||||
{t('parent_task')}
|
||||
</th>
|
||||
<td>
|
||||
{parent_task.name}
|
||||
</td>
|
||||
</tr>
|
||||
{/if}
|
||||
<div class="task grid2">
|
||||
<div>{t('name')}</div>
|
||||
<div>
|
||||
<input bind:value={task.name} autofocus>
|
||||
</div>
|
||||
|
||||
<tr>
|
||||
<th>
|
||||
{t('description')}
|
||||
</th>
|
||||
<td>
|
||||
<MarkdownEditor bind:value={task.description} onRender={storeSource} simple={true} />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>
|
||||
{t('tags')}
|
||||
</th>
|
||||
<td>
|
||||
<Tags module="task" bind:tags={task.tags} />
|
||||
</td>
|
||||
</tr>
|
||||
{#if extendedSettings}
|
||||
<tr>
|
||||
<th>
|
||||
{t('members')}
|
||||
</th>
|
||||
<td>
|
||||
<PermissionEditor members={task.members} {addMember} {dropMember} {getCandidates} />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>
|
||||
{t('estimated_time')}
|
||||
</th>
|
||||
<td>
|
||||
<input type="number" bind:value={task.est_time} /> {t('hours')}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>
|
||||
{t('start_date')}
|
||||
</th>
|
||||
<td>
|
||||
<input type="date" bind:value={task.start_date} />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>
|
||||
{t('due_date')}
|
||||
</th>
|
||||
<td>
|
||||
<input type="date" bind:value={task.due_date} />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>
|
||||
{t('subtasks')}
|
||||
</th>
|
||||
<td>
|
||||
<label>
|
||||
<input type="checkbox" bind:checked={task.show_closed} >
|
||||
{t('display_closed_tasks')}
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>
|
||||
{t('index_page')}
|
||||
</th>
|
||||
<td>
|
||||
<label>
|
||||
<input type="checkbox" bind:checked={task.no_index} >
|
||||
{t('hide_on_index_page')}
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
{:else}
|
||||
<tr>
|
||||
<th>
|
||||
{t('extended_settings')}
|
||||
</th>
|
||||
<td>
|
||||
<button onclick={toggleSettings}>{t('show')}</button>
|
||||
</td>
|
||||
</tr>
|
||||
{/if}
|
||||
</tbody>
|
||||
</table>
|
||||
{#if project}
|
||||
<div>{t('project')}</div>
|
||||
<a href="/project/{project.id}/view">{project.name}</a>
|
||||
{/if}
|
||||
|
||||
{#if parent_task}
|
||||
<div>{t('parent_task')}</div>
|
||||
<div>{parent_task.name}</div>
|
||||
{/if}
|
||||
|
||||
<div>{t('description')}</div>
|
||||
<div>
|
||||
<MarkdownEditor bind:value={task.description} simple={true} store_id="task/add_to/{project_id}"/>
|
||||
</div>
|
||||
<div>{t('tags')}</div>
|
||||
<div>
|
||||
<Tags module="task" bind:tags={task.tags} />
|
||||
</div>
|
||||
|
||||
{#if extendedSettings}
|
||||
<div>{t('members')}</div>
|
||||
<div>
|
||||
<PermissionEditor members={task.members} {addMember} {dropMember} {getCandidates} />
|
||||
</div>
|
||||
|
||||
<div>{t('estimated_time')}</div>
|
||||
<div>
|
||||
<input type="number" bind:value={task.est_time} /> {t('hours')}
|
||||
</div>
|
||||
|
||||
<div>{t('start_date')}</div>
|
||||
<div>
|
||||
<input type="date" bind:value={task.start_date} />
|
||||
</div>
|
||||
|
||||
<div>{t('due_date')}</div>
|
||||
<div>
|
||||
<input type="date" bind:value={task.due_date} />
|
||||
</div>
|
||||
|
||||
<div>{t('subtasks')}</div>
|
||||
<div>
|
||||
<label>
|
||||
<input type="checkbox" bind:checked={task.show_closed} >
|
||||
{t('display_closed_tasks')}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
{t('index_page')}
|
||||
</div>
|
||||
<label>
|
||||
<input type="checkbox" bind:checked={task.no_index} >
|
||||
{t('hide_on_index_page')}
|
||||
</label>
|
||||
{:else}
|
||||
<div>{t('extended_settings')}</div>
|
||||
<div>
|
||||
<button onclick={toggleSettings}>{t('show')}</button>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
<button onclick={saveTask}>{t('save_object',{object:t('task')})}</button>
|
||||
{#if on_abort}
|
||||
<button onclick={on_abort}>{t('abort')}</button>
|
||||
|
||||
@@ -241,7 +241,7 @@
|
||||
</div>
|
||||
{#if task.description}
|
||||
<div>{t('description')}</div>
|
||||
<MarkdownEditor bind:value={task.description} editable={true} onSet={val => update({description:val})} />
|
||||
<MarkdownEditor store_id="task/{task.id}/description" bind:value={task.description} editable={true} onSet={val => update({description:val})} />
|
||||
{/if}
|
||||
{#if !showSettings && task.start_date}
|
||||
<div>{t('start_date')}</div>
|
||||
|
||||
@@ -22,6 +22,7 @@
|
||||
});
|
||||
if (res.ok){
|
||||
yikes();
|
||||
localStorage.removeItem('wiki/new/content');
|
||||
router.navigate(`/wiki/${title}/view`);
|
||||
} else {
|
||||
error(res);
|
||||
@@ -60,7 +61,7 @@
|
||||
</label>
|
||||
<label>
|
||||
{t('content')}
|
||||
<Markdown bind:value={content} simple={true} />
|
||||
<Markdown bind:value={content} simple={true} store_id="wiki/new/content" />
|
||||
<button type="submit">{t('save')}</button>
|
||||
</label>
|
||||
</form>
|
||||
@@ -188,7 +188,7 @@
|
||||
</table>
|
||||
{/if}
|
||||
{/if}
|
||||
<MarkdownEditor {editable} value={page.content} onSet={s => patch({content:s})} />
|
||||
<MarkdownEditor {editable} value={page.content} onSet={s => patch({content:s})} store_id="wiki/{page.id}/description" />
|
||||
<TagList module="wiki" id={page.id} user_list={Object.keys(page.members).map(id => +id)} />
|
||||
<div class="notes">
|
||||
<h3>{t('notes')}</h3>
|
||||
|
||||
@@ -399,6 +399,7 @@
|
||||
"unit_price": "Preis/Einheit",
|
||||
"unknown_item_location": "Artikel {0} von {1} {2} ist verknüpft mit unbekanntem Lagerort {3}!",
|
||||
"unlink": "Trennen",
|
||||
"unsaved_content": "Hier klicken, um ungespeicherte Änderungen zu laden",
|
||||
"update": "aktualisieren",
|
||||
"UPDATE_USERS" : "Nutzer aktualisieren",
|
||||
"upload_file": "Datei hochladen",
|
||||
|
||||
@@ -399,6 +399,7 @@
|
||||
"unit_price": "price/unit",
|
||||
"unknown_item_location": "Item {0} of {1} {2} refers to location {3}, which is unknown!",
|
||||
"unlink": "unlink",
|
||||
"unsaved_content": "Click here to load unsaved changes",
|
||||
"update": "update",
|
||||
"UPDATE_USERS" : "update users",
|
||||
"upload_file": "upload file",
|
||||
|
||||
Reference in New Issue
Block a user