1
0
Fork 0
timelinize/frontend/pages/import.html
Matthew Holt ae3dde3e4c
Minor tweaks to the import page
- The return of the accordion button chevrons!
- Hid the Interactive option since it's not yet finished
- Moved a couple options into the advanced settings dialog
2025-09-23 21:47:18 -06:00

620 lines
No EOL
26 KiB
HTML

<title>Import Data</title>
<link rel="stylesheet" href="/resources/css/import.css">
<div class="page-header d-print-none">
<div class="container-xl">
<div class="row g-2 align-items-center">
<div class="col">
<h1>
Import data
</h1>
</div>
</div>
</div>
</div>
<div class="page-body">
<div class="container-xl">
<div class="row g-4">
<div class="col-md-9">
<div class="row mb-4">
<div class="col">
<button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#modal-file-picker">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-file-plus">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M14 3v4a1 1 0 0 0 1 1h4" />
<path d="M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z" />
<path d="M12 11l0 6" />
<path d="M9 14l6 0" />
</svg>
Add files...
</button>
</div>
<div class="col-auto ms-auto">
<a id="expand-all-dsgroup" class="btn btn-ghost-info me-2 disabled">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-viewport-tall">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M12 10v-7l3 3" />
<path d="M9 6l3 -3" />
<path d="M12 14v7l3 -3" />
<path d="M9 18l3 3" />
<path d="M18 3h1a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-1" />
<path d="M6 3h-1a2 2 0 0 0 -2 2v14a2 2 0 0 0 2 2h1" />
</svg>
Expand all
</a>
<a id="collapse-all-dsgroup" class="btn btn-ghost-info disabled">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-viewport-short">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M12 3v7l3 -3" />
<path d="M9 7l3 3" />
<path d="M12 21v-7l3 3" />
<path d="M9 17l3 -3" />
<path d="M18 9h1a2 2 0 0 1 2 2v2a2 2 0 0 1 -2 2h-1" />
<path d="M6 9h-1a2 2 0 0 0 -2 2v2a2 2 0 0 0 2 2h1" />
</svg>
Collapse all
</a>
</div>
</div>
<div class="row row-cards">
<div class="space-y" id="file-imports-container">
</div>
</div>
</div>
<div class="col-md-3">
<div class="sticky-top">
<!-- <div class="form-label">Interactive</div>
<div class="mb-4">
<label class="form-check form-switch">
<input id="interactive" class="form-check-input" type="checkbox">
<span class="form-check-label form-check-label-on">Yes</span>
<span class="form-check-label form-check-label-off">No</span>
</label>
<div class="small text-secondary">Manually review and edit each incoming item one by one.</div>
</div> -->
<div class="form-label">Infer time zones</div>
<div class="mb-4">
<label class="form-check form-switch">
<input id="infer-time-zones" class="form-check-input" type="checkbox" checked>
<span class="form-check-label form-check-label-on">Yes</span>
<span class="form-check-label form-check-label-off">No</span>
</label>
<div class="small text-secondary">If timestamp lacks time zone, use geocoordinate, if available, to infer local time offset.</div>
</div>
<div class="form-label">Estimate total</div>
<div class="mb-4">
<label class="form-check form-switch">
<input id="estimate-total" class="form-check-input" type="checkbox">
<span class="form-check-label form-check-label-on">Yes</span>
<span class="form-check-label form-check-label-off">No</span>
</label>
<div class="small text-secondary">Take extra time up front to estimate total size of the import, solely for progress updates.</div>
</div>
<div class="form-label">Thumbnail generation</div>
<div class="mb-4">
<label class="form-check form-switch">
<input id="generate-thumbnails" class="form-check-input" type="checkbox">
<span class="form-check-label form-check-label-off">After import</span>
<span class="form-check-label form-check-label-on">During import</span>
</label>
<div class="small text-secondary">During import is slower and uses more RAM, but media items can be browsed immediately.</div>
</div>
<div class="form-label">Timeframe</div>
<div class="mb-4">
<div id="timeframe"></div>
<div class="small text-secondary">Only import items if their timestamp is within this interval.</div>
</div>
<div class="col-auto ms-auto d-print-none">
<button id="advanced-settings" class="btn" data-bs-target="#modal-advanced-settings" data-bs-toggle="modal">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-settings">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path
d="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z" />
<path d="M9 12a3 3 0 1 0 6 0a3 3 0 0 0 -6 0" />
</svg>
More settings...
</button>
<button id="start-import" class="btn btn-primary mt-4 disabled">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-player-play">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M7 4v16l13 -8z" />
</svg>
Start import
</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="modal-file-picker" class="modal modal-lg modal-blur fade" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-dialog-scrollable" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Choose a file or folder to import from</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
<a class="btn btn-link link-secondary" data-bs-dismiss="modal">
Cancel
</a>
<label class="form-check ms-auto me-3" title="Scan subfolders for recognized files (including hidden folders if shown)">
<input type="checkbox" id="recursive" class="form-check-input" checked>
<span class="form-check-label">Recursive</span>
</label>
<label class="form-check me-3" title="Scan within archive files (zip, tar, compressed tar, rar, etc.) for recognized files; this takes longer. Note that this is not required when the entire archive itself is recognized by a data source, only when files/folders within the archive need to be found.">
<input type="checkbox" id="traverse-archives" class="form-check-input">
<span class="form-check-label">Traverse archives (slower)</span>
</label>
<a id="select-file-picker" class="btn btn-primary disabled" data-bs-target="#modal-plan-loading" data-bs-toggle="modal">
Select
</a>
</div>
</div>
</div>
</div>
<div id="modal-plan-loading" class="modal modal-blur fade" data-bs-backdrop="static" id="modal-small" tabindex="-1" aria-modal="true" role="dialog">
<div class="modal-dialog modal-sm modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-body">
<div class="slow-loader"></div>
<div class="modal-title text-center">Planning import...</div>
<div>Timelinize is scanning for data it recognizes. This may take some time. When complete, you will be able to adjust settings before starting the import.</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-danger" data-bs-target="#modal-file-picker" data-bs-toggle="modal">Cancel</button>
</div>
</div>
</div>
</div>
<div id="modal-advanced-settings" class="modal modal-blur fade" data-bs-backdrop="static" tabindex="-1" aria-modal="true" role="dialog">
<div class="modal-dialog modal-lg modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title">Advanced import settings</h3>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<label class="form-label">Unique constraints</label>
<div class="form-hint mb-3">Select which properties of an item must be the same as an existing item for it to be considered a duplicate:</div>
<div class="row g3">
<div class="col-6">
<label class="form-check">
<input class="form-check-input" type="checkbox" id="unique-data-source">
<span class="form-check-label">Data source</span>
<span class="form-check-description">Items must be from the same data source.</span>
</label>
</div>
<div class="col-6">
<label class="form-check">
<input class="form-check-input" type="checkbox" id="unique-original-location">
<span class="form-check-label">Original location</span>
<span class="form-check-description">Items must have same place/file of origin.</span>
</label>
</div>
<div class="col-6">
<label class="form-check">
<input class="form-check-input" type="checkbox" id="unique-filename" checked>
<span class="form-check-label">Filename</span>
<span class="form-check-description">Items must have the same filename.</span>
</label>
</div>
<div class="col-6">
<label class="form-check">
<input class="form-check-input" type="checkbox" id="unique-timestamp" checked>
<span class="form-check-label">Timestamp</span>
<span class="form-check-description">Items must have originated at the same time.</span>
</label>
</div>
<div class="col-6">
<label class="form-check">
<input class="form-check-input" type="checkbox" id="unique-latlon" checked>
<span class="form-check-label">Coordinates</span>
<span class="form-check-description">Items must be at approximately equal latitude and longitude (precision truncated to ~1 meter).</span>
</label>
</div>
<div class="col-6">
<label class="form-check">
<input class="form-check-input" type="checkbox" id="unique-altitude">
<span class="form-check-label">Altitude</span>
<span class="form-check-description">Only helpful if sensor is accurate. Requires coordinates.</span>
</label>
</div>
<div class="col-6">
<label class="form-check">
<input class="form-check-input" type="checkbox" id="unique-classification" checked>
<span class="form-check-label">Classification</span>
<span class="form-check-description">Items must be the same type of thing.</span>
</label>
</div>
<div class="col-6">
<label class="form-check">
<input class="form-check-input" type="checkbox" id="unique-data" checked>
<span class="form-check-label">Content</span>
<span class="form-check-description">Item must have exact same data (text or file; does not include
coordinates or metadata).</span>
</label>
</div>
</div>
</div>
<div class="modal-body">
<label class="form-label">Rules for updating items</label>
<div class="form-hint mb-3">Configure how duplicate items will be used to update existing items:</div>
<div class="table-vcenter mb-3">
<table class="table mb-0" id="update-prefs-table">
<thead>
<tr>
<th>What to update</th>
<th>Which to keep</th>
<th class="text-center" data-bs-toggle="tooltip"
data-bs-original-title="Allow an empty value to overwrite a non-empty value">
Deletions
</th>
<th></th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<div class="row align-items-center my-3 mx-1" id="no-rules">
<div class="col-auto">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-cancel">
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path>
<path d="M18.364 5.636l-12.728 12.728"></path>
</svg>
</div>
<div class="col">
<div class="font-weight-medium">No update rules</div>
<div class="text-secondary">Duplicate items will be skipped</div>
</div>
</div>
</div>
<div class="row mb-3 align-items-end">
<div class="col-auto">
<div class="btn" id="add-update-prefs-row">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-1">
<path d="M12 5l0 14"></path>
<path d="M5 12l14 0"></path>
</svg>
Add rule
</div>
</div>
</div>
</div>
<div class="modal-body">
<div class="row">
<div class="col">
<div class="form-label">Integrity checks</div>
<div class="mb-4">
<label class="form-check form-switch">
<input id="integrity-checks" class="form-check-input" type="checkbox">
<span class="form-check-label form-check-label-on">On</span>
<span class="form-check-label form-check-label-off">Off</span>
</label>
<div class="small text-secondary">Items already in the timeline will be re-imported if their checksums no longer match. Slower.</div>
</div>
</div>
<div class="col">
<div class="form-label">Overwrite manual changes</div>
<div class="mb-4">
<label class="form-check form-switch">
<input id="overwrite-local-changes" class="form-check-input" type="checkbox">
<span class="form-check-label form-check-label-on">Yes</span>
<span class="form-check-label form-check-label-off">No</span>
</label>
<div class="small text-secondary">Items modified manually after being imported will be updated to conform to the data in this import.</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn me-auto" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary" data-bs-dismiss="modal" id="save-settings">Save settings</button>
</div>
</div>
</div>
</div>
<div id="modal-error" class="modal modal-blur fade" data-bs-backdrop="static" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-sm modal-dialog-centered" role="document">
<div class="modal-content">
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
<div class="modal-status bg-danger"></div>
<div class="modal-body text-center py-4">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon mb-2 text-danger icon-lg">
<path d="M12 9v4"></path>
<path
d="M10.363 3.591l-8.106 13.534a1.914 1.914 0 0 0 1.636 2.871h16.214a1.914 1.914 0 0 0 1.636 -2.87l-8.106 -13.536a1.914 1.914 0 0 0 -3.274 0z">
</path>
<path d="M12 16h.01"></path>
</svg>
<h3 class="modal-error-title">
</h3>
<div class="text-secondary modal-error-message">
</div>
</div>
<div class="modal-footer">
<a class="btn w-100 modal-error-dismiss" data-bs-dismiss="modal">OK</a>
</div>
</div>
</div>
</div>
<template id="tpl-file-import-plan-dsgroup">
<div class="card accordion file-import-plan-dsgroup">
<div class="row g-0 align-items-center accordion-button" data-bs-toggle="collapse">
<div class="col-auto">
<div class="card-body">
<div class="avatar avatar-lg dsgroup-icon">
</div>
</div>
</div>
<div class="col">
<div class="card-body p-0">
<div class="row align-items-center">
<div class="col">
<h2 class="mb-0 dsgroup-name"></h2>
</div>
<div class="col-auto ms-auto">
<div class="list-inline list-inline-dots text-secondary fw-normal">
<div class="list-inline-item" title="Files">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-file">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M14 3v4a1 1 0 0 0 1 1h4" />
<path d="M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z" />
</svg>
<span class="dsgroup-file-count"></span>
</div>
<div class="list-inline-item" title="Directories">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-folder">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2" />
</svg>
<span class="dsgroup-dir-count"></span>
</div>
<div class="list-inline-item" title="Archives or files in archives">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-file-zip">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M6 20.735a2 2 0 0 1 -1 -1.735v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2h-1" />
<path d="M11 17a2 2 0 0 1 2 2v2a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1v-2a2 2 0 0 1 2 -2z" />
<path d="M11 5l-1 0" />
<path d="M13 7l-1 0" />
<path d="M11 9l-1 0" />
<path d="M13 11l-1 0" />
<path d="M11 13l-1 0" />
<path d="M13 15l-1 0" />
</svg>
<span class="dsgroup-archive-count"></span>
</div>
</div>
</div>
<div class="col-auto d-flex align-items-center">
<div class="btn-list">
<!-- I set the data-bs-* attributes this way to disable button from acting for the accordion; see https://stackoverflow.com/a/70664716/1048862 -->
<button class="btn import-dsgroup-opt-button" data-bs-toggle="collapse" data-bs-target>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-settings">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path
d="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z" />
<path d="M9 12a3 3 0 1 0 6 0a3 3 0 0 0 -6 0" />
</svg>
Options
</button>
<button class="btn import-dsgroup-remove-button btn-outline-danger" data-bs-toggle="collapse" data-bs-target>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-copy-x">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path stroke="none" d="M0 0h24v24H0z" />
<path
d="M7 9.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667z" />
<path d="M4.012 16.737a2 2 0 0 1 -1.012 -1.737v-10c0 -1.1 .9 -2 2 -2h10c.75 0 1.158 .385 1.5 1" />
<path d="M11.5 11.5l4.9 5" />
<path d="M16.5 11.5l-5.1 5" />
</svg>
Remove all
</button>
</div>
<div class="ms-3 accordion-button-toggle">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-1">
<path d="M6 9l6 6l6 -6"></path>
</svg>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row g-0 collapse show import-dsgroup-files">
<div class="table-responsive">
<table class="table table-vcenter dsgroup-file-list">
<thead>
<tr>
<th><button class="table-sort" data-sort="sort-type">Type</button></th>
<th><button class="table-sort" data-sort="sort-filename">Filename</button></th>
<th><button class="table-sort" data-sort="sort-confidence">Confidence</button></th>
<th></th>
</tr>
</thead>
<tbody class="table-tbody">
</tbody>
</table>
</div>
</div>
</div>
</template>
<template id="tpl-file-import-dsgroup-row">
<tr>
<td class="sort-type">
<div class="avatar avatar-sm">
</div>
</td>
<td class="sort-filename"></td>
<td class="sort-confidence text-secondary small"></td>
<td class="text-center">
<a class="btn-action dsgroup-remove-row" title="Remove">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-x">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M18 6l-12 12" />
<path d="M6 6l12 12" />
</svg>
</a>
</td>
</tr>
</template>
<template id="tpl-item-update-prefs-row">
<tr>
<td>
<select class="form-select field-name">
<option></option>
<option value="data">Content</option>
<option value="attribute_id">Owner</option>
<option value="metadata">Metadata</option>
<option value="data_source_name">Data source</option>
<option value="classification_id">Class</option>
<option value="filename">Filename</option>
<option value="timestamp">Timestamp</option>
<option value="latlon">Coordinates</option>
<option value="altitude">Altitude</option>
<option value="original_location">Original location</option>
<option value="intermediate_location">Intermediate location</option>
</select>
</td>
<td class="field-update-priorities">
</td>
<td class="text-center">
<div class="form-switch">
<input class="form-check-input field-update-deletes" type="checkbox">
</div>
</td>
<td>
<a class="btn-action delete-rule" title="Delete rule">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-trash">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M4 7l16 0" />
<path d="M10 11l0 6" />
<path d="M14 11l0 6" />
<path d="M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12" />
<path d="M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3" />
</svg>
</a>
</td>
</tr>
</template>
<template id="tpl-field-update-pref-priority">
<div class="row g-2 py-1 field-update-pref-priority">
<div class="col">
<select class="form-select priority-property">
<option value="incoming">Incoming</option>
<option value="existing">Existing</option>
<option value="data_source">Data source is ...</option>
<option value="media_type">Content type is ...</option>
<option value="size_larger">Larger content size</option>
<option value="size_smaller">Smaller content size</option>
<option value="ts_earlier">Earlier timestamp</option>
<option value="ts_later">Later timestamp</option>
</select>
<div class="priority-value-input-container">
</div>
</div>
<div class="col-auto align-self-center">
<a class="btn-action delete-priority d-none" title="Delete priority">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-trash">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M4 7l16 0" />
<path d="M10 11l0 6" />
<path d="M14 11l0 6" />
<path d="M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12" />
<path d="M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3" />
</svg>
</a>
<a class="btn-action add-priority d-none" title="Add priority">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="icon icon-1">
<path d="M12 5l0 14"></path>
<path d="M5 12l14 0"></path>
</svg>
</a>
</div>
</div>
</template>