mirror of
https://github.com/seanmorley15/AdventureLog.git
synced 2025-07-22 14:29:36 +02:00
remove image
This commit is contained in:
Sean Morley
parent
6b9cd48603
commit
b9ebbafd76
2 changed files with 409 additions and 422 deletions
|
|
@ -184,222 +184,221 @@
|
|||
<dialog id="my_modal_1" class="modal">
|
||||
<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
|
||||
<!-- svelte-ignore a11y-no-noninteractive-element-interactions -->
|
||||
<div class="modal-box w-11/12 max-w-6xl" role="dialog" on:keydown={handleKeydown} tabindex="0">
|
||||
<div class="modal-box w-11/12 max-w-2xl" role="dialog" on:keydown={handleKeydown} tabindex="0">
|
||||
<h3 class="font-bold text-lg">Edit {adventureToEdit.type} Adventure</h3>
|
||||
{#if adventureToEdit.id === '' || isDetails}
|
||||
<div class="modal-action items-center">
|
||||
<form method="post" style="width: 100%;" on:submit={handleSubmit}>
|
||||
<!-- Grid layout for form fields -->
|
||||
<h2 class="text-2xl font-semibold mb-2">Basic Information</h2>
|
||||
<div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-3">
|
||||
<div>
|
||||
<label for="name">Name</label><br />
|
||||
<input
|
||||
type="text"
|
||||
id="name"
|
||||
name="name"
|
||||
bind:value={adventureToEdit.name}
|
||||
class="input input-bordered w-full"
|
||||
required
|
||||
/>
|
||||
<!-- <div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-3"> -->
|
||||
<div>
|
||||
<label for="name">Name</label><br />
|
||||
<input
|
||||
type="text"
|
||||
id="name"
|
||||
name="name"
|
||||
bind:value={adventureToEdit.name}
|
||||
class="input input-bordered w-full"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<div class="form-control">
|
||||
<label class="label cursor-pointer">
|
||||
<span class="label-text">Visited</span>
|
||||
<input
|
||||
type="radio"
|
||||
name="radio-10"
|
||||
class="radio checked:bg-red-500"
|
||||
on:click={() => (adventureToEdit.type = 'visited')}
|
||||
checked={adventureToEdit.type == 'visited'}
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
<div>
|
||||
<div class="form-control">
|
||||
<label class="label cursor-pointer">
|
||||
<span class="label-text">Visited</span>
|
||||
<input
|
||||
type="radio"
|
||||
name="radio-10"
|
||||
class="radio checked:bg-red-500"
|
||||
on:click={() => (adventureToEdit.type = 'visited')}
|
||||
checked={adventureToEdit.type == 'visited'}
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-control">
|
||||
<label class="label cursor-pointer">
|
||||
<span class="label-text">Planned</span>
|
||||
<input
|
||||
type="radio"
|
||||
name="radio-10"
|
||||
class="radio checked:bg-blue-500"
|
||||
on:click={() => (adventureToEdit.type = 'planned')}
|
||||
checked={adventureToEdit.type == 'planned'}
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-control">
|
||||
<label class="label cursor-pointer">
|
||||
<span class="label-text">Planned</span>
|
||||
<input
|
||||
type="radio"
|
||||
name="radio-10"
|
||||
class="radio checked:bg-blue-500"
|
||||
on:click={() => (adventureToEdit.type = 'planned')}
|
||||
checked={adventureToEdit.type == 'planned'}
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="date">Date</label><br />
|
||||
<input
|
||||
type="date"
|
||||
id="date"
|
||||
name="date"
|
||||
min={startDate || ''}
|
||||
max={endDate || ''}
|
||||
bind:value={adventureToEdit.date}
|
||||
class="input input-bordered w-full"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<!-- link -->
|
||||
<div>
|
||||
<label for="date">Date</label><br />
|
||||
<input
|
||||
type="date"
|
||||
id="date"
|
||||
name="date"
|
||||
min={startDate || ''}
|
||||
max={endDate || ''}
|
||||
bind:value={adventureToEdit.date}
|
||||
class="input input-bordered w-full"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<!-- link -->
|
||||
<div>
|
||||
<label for="link">Link</label><br />
|
||||
<input
|
||||
type="text"
|
||||
id="link"
|
||||
name="link"
|
||||
bind:value={adventureToEdit.link}
|
||||
class="input input-bordered w-full"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label for="description">Description</label><br />
|
||||
<textarea
|
||||
id="description"
|
||||
name="description"
|
||||
bind:value={adventureToEdit.description}
|
||||
class="textarea textarea-bordered w-full h-32"
|
||||
></textarea>
|
||||
</div>
|
||||
<div>
|
||||
<label for="activity_types">Activity Types</label><br />
|
||||
<label for="link">Link</label><br />
|
||||
<input
|
||||
type="text"
|
||||
id="activity_types"
|
||||
name="activity_types"
|
||||
hidden
|
||||
bind:value={adventureToEdit.activity_types}
|
||||
id="link"
|
||||
name="link"
|
||||
bind:value={adventureToEdit.link}
|
||||
class="input input-bordered w-full"
|
||||
/>
|
||||
<ActivityComplete bind:activities={adventureToEdit.activity_types} />
|
||||
</div>
|
||||
<div>
|
||||
<label for="rating"
|
||||
>Rating <iconify-icon icon="mdi:star" class="text-xl -mb-1"></iconify-icon></label
|
||||
><br />
|
||||
</div>
|
||||
<div>
|
||||
<label for="description">Description</label><br />
|
||||
<textarea
|
||||
id="description"
|
||||
name="description"
|
||||
bind:value={adventureToEdit.description}
|
||||
class="textarea textarea-bordered w-full h-32"
|
||||
></textarea>
|
||||
</div>
|
||||
<div>
|
||||
<label for="activity_types">Activity Types</label><br />
|
||||
<input
|
||||
type="text"
|
||||
id="activity_types"
|
||||
name="activity_types"
|
||||
hidden
|
||||
bind:value={adventureToEdit.activity_types}
|
||||
class="input input-bordered w-full"
|
||||
/>
|
||||
<ActivityComplete bind:activities={adventureToEdit.activity_types} />
|
||||
</div>
|
||||
<div>
|
||||
<label for="rating"
|
||||
>Rating <iconify-icon icon="mdi:star" class="text-xl -mb-1"></iconify-icon></label
|
||||
><br />
|
||||
<input
|
||||
type="number"
|
||||
min="0"
|
||||
max="5"
|
||||
hidden
|
||||
bind:value={adventureToEdit.rating}
|
||||
id="rating"
|
||||
name="rating"
|
||||
class="input input-bordered w-full max-w-xs mt-1"
|
||||
/>
|
||||
<div class="rating -ml-3 mt-1">
|
||||
<input
|
||||
type="number"
|
||||
min="0"
|
||||
max="5"
|
||||
hidden
|
||||
bind:value={adventureToEdit.rating}
|
||||
id="rating"
|
||||
name="rating"
|
||||
class="input input-bordered w-full max-w-xs mt-1"
|
||||
type="radio"
|
||||
name="rating-2"
|
||||
class="rating-hidden"
|
||||
checked={Number.isNaN(adventureToEdit.rating)}
|
||||
/>
|
||||
<div class="rating -ml-3 mt-1">
|
||||
<input
|
||||
type="radio"
|
||||
name="rating-2"
|
||||
class="rating-hidden"
|
||||
checked={Number.isNaN(adventureToEdit.rating)}
|
||||
/>
|
||||
<input
|
||||
type="radio"
|
||||
name="rating-2"
|
||||
class="mask mask-star-2 bg-orange-400"
|
||||
on:click={() => (adventureToEdit.rating = 1)}
|
||||
checked={adventureToEdit.rating === 1}
|
||||
/>
|
||||
<input
|
||||
type="radio"
|
||||
name="rating-2"
|
||||
class="mask mask-star-2 bg-orange-400"
|
||||
on:click={() => (adventureToEdit.rating = 2)}
|
||||
checked={adventureToEdit.rating === 2}
|
||||
/>
|
||||
<input
|
||||
type="radio"
|
||||
name="rating-2"
|
||||
class="mask mask-star-2 bg-orange-400"
|
||||
on:click={() => (adventureToEdit.rating = 3)}
|
||||
checked={adventureToEdit.rating === 3}
|
||||
/>
|
||||
<input
|
||||
type="radio"
|
||||
name="rating-2"
|
||||
class="mask mask-star-2 bg-orange-400"
|
||||
on:click={() => (adventureToEdit.rating = 4)}
|
||||
checked={adventureToEdit.rating === 4}
|
||||
/>
|
||||
<input
|
||||
type="radio"
|
||||
name="rating-2"
|
||||
class="mask mask-star-2 bg-orange-400"
|
||||
on:click={() => (adventureToEdit.rating = 5)}
|
||||
checked={adventureToEdit.rating === 5}
|
||||
/>
|
||||
{#if adventureToEdit.rating}
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm btn-error ml-2"
|
||||
on:click={() => (adventureToEdit.rating = NaN)}
|
||||
>
|
||||
Remove
|
||||
</button>
|
||||
{/if}
|
||||
</div>
|
||||
<input
|
||||
type="radio"
|
||||
name="rating-2"
|
||||
class="mask mask-star-2 bg-orange-400"
|
||||
on:click={() => (adventureToEdit.rating = 1)}
|
||||
checked={adventureToEdit.rating === 1}
|
||||
/>
|
||||
<input
|
||||
type="radio"
|
||||
name="rating-2"
|
||||
class="mask mask-star-2 bg-orange-400"
|
||||
on:click={() => (adventureToEdit.rating = 2)}
|
||||
checked={adventureToEdit.rating === 2}
|
||||
/>
|
||||
<input
|
||||
type="radio"
|
||||
name="rating-2"
|
||||
class="mask mask-star-2 bg-orange-400"
|
||||
on:click={() => (adventureToEdit.rating = 3)}
|
||||
checked={adventureToEdit.rating === 3}
|
||||
/>
|
||||
<input
|
||||
type="radio"
|
||||
name="rating-2"
|
||||
class="mask mask-star-2 bg-orange-400"
|
||||
on:click={() => (adventureToEdit.rating = 4)}
|
||||
checked={adventureToEdit.rating === 4}
|
||||
/>
|
||||
<input
|
||||
type="radio"
|
||||
name="rating-2"
|
||||
class="mask mask-star-2 bg-orange-400"
|
||||
on:click={() => (adventureToEdit.rating = 5)}
|
||||
checked={adventureToEdit.rating === 5}
|
||||
/>
|
||||
{#if adventureToEdit.rating}
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm btn-error ml-2"
|
||||
on:click={() => (adventureToEdit.rating = NaN)}
|
||||
>
|
||||
Remove
|
||||
</button>
|
||||
{/if}
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
<div class="divider"></div>
|
||||
<h2 class="text-2xl font-semibold mb-2 mt-4">Location Information</h2>
|
||||
<div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3">
|
||||
<div>
|
||||
<label for="latitude">Location</label><br />
|
||||
<!-- <div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3"> -->
|
||||
<div>
|
||||
<label for="latitude">Location</label><br />
|
||||
<input
|
||||
type="text"
|
||||
id="location"
|
||||
name="location"
|
||||
bind:value={adventureToEdit.location}
|
||||
class="input input-bordered w-full"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<form on:submit={geocode} class="mt-2">
|
||||
<input
|
||||
type="text"
|
||||
id="location"
|
||||
name="location"
|
||||
bind:value={adventureToEdit.location}
|
||||
class="input input-bordered w-full"
|
||||
placeholder="Seach for a location"
|
||||
class="input input-bordered w-full max-w-xs"
|
||||
id="search"
|
||||
name="search"
|
||||
bind:value={query}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<form on:submit={geocode}>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Seach for a location"
|
||||
class="input input-bordered w-full max-w-xs"
|
||||
id="search"
|
||||
name="search"
|
||||
bind:value={query}
|
||||
/>
|
||||
<button type="submit">Search</button>
|
||||
</form>
|
||||
{#if places.length > 0}
|
||||
<div class="mt-4">
|
||||
<h3 class="font-bold text-lg mb-4">Search Results</h3>
|
||||
<ul>
|
||||
{#each places as place}
|
||||
<li>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-neutral mb-2"
|
||||
on:click={() => {
|
||||
markers = [
|
||||
{
|
||||
lngLat: { lng: Number(place.lon), lat: Number(place.lat) },
|
||||
location: place.display_name,
|
||||
name: place.name,
|
||||
activity_type: place.type
|
||||
}
|
||||
];
|
||||
}}
|
||||
>
|
||||
{place.display_name}
|
||||
</button>
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
</div>
|
||||
{:else}
|
||||
<p class="text-error text-lg">No results found</p>
|
||||
{/if}
|
||||
</div>
|
||||
<button class="btn btn-neutral -mt-1" type="submit">Search</button>
|
||||
</form>
|
||||
</div>
|
||||
{#if places.length > 0}
|
||||
<div class="mt-4 max-w-full">
|
||||
<h3 class="font-bold text-lg mb-4">Search Results</h3>
|
||||
|
||||
<div class="flex flex-wrap">
|
||||
{#each places as place}
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-neutral mb-2 mr-2 max-w-full break-words whitespace-normal text-left"
|
||||
on:click={() => {
|
||||
markers = [
|
||||
{
|
||||
lngLat: { lng: Number(place.lon), lat: Number(place.lat) },
|
||||
location: place.display_name,
|
||||
name: place.name,
|
||||
activity_type: place.type
|
||||
}
|
||||
];
|
||||
}}
|
||||
>
|
||||
{place.display_name}
|
||||
</button>
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
{:else}
|
||||
<p class="text-error text-lg">No results found</p>
|
||||
{/if}
|
||||
<!-- </div> -->
|
||||
<div>
|
||||
<MapLibre
|
||||
style="https://basemaps.cartocdn.com/gl/positron-gl-style/style.json"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue