1
0
Fork 0

contacts: Add vcard import to interface.html

master
Erik Andresen 2023-11-09 21:41:23 +01:00
parent 0963409da1
commit 21e9cd0298
2 changed files with 38 additions and 17 deletions

View File

@ -7,6 +7,10 @@
<link rel="stylesheet" href="../../css/spectre-icons.min.css">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A==" crossorigin="anonymous">
<link rel="stylesheet" href="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.css">
<script type="module">
import vcf from 'https://cdn.jsdelivr.net/npm/vcf@2.1.1/+esm'
window.vcf = vcf;
</script>
<style type="text/css">
html, body { height: 100% }
@ -36,16 +40,6 @@
<span id="status"></span>
<span id="routestatus"></span>
</div>
<div>
<ul class="tab tab-block">
<li class="tab-item active" id="tabitem-map">
<a href="#">Map</a>
</li>
<li class="tab-item" id="tabitem-list">
<a href="#">List</a>
</li>
</ul>
</div>
<div style="flex: 1">
<div id="tab-list">
<table class="table">
@ -75,6 +69,17 @@
</div>
</div>
</form>
<div class="divider"></div>
<div class="form-horizontal">
<div class="form-group">
<div class="col-5 col-xs-12">
<label class="form-label" for="fileinput">Add from vCard file</label>
</div>
<div class="col-7 col-xs-12">
<input id="fileinput" class="form-input" type="file" onchange="readFile(this)" accept=".vcf" multiple/>
</div>
</div>
</div>
</div>
</div>
</div>
@ -99,12 +104,6 @@
/*** contacts ***/
function addContact(arr, lat, lon, name) {
arr.push({number:lat, name:name});
renderAllContacts();
dirty();
}
function deleteContact(arr, i) {
arr.splice(i, 1);
renderAllContacts();
@ -201,6 +200,28 @@
renderContactsList();
}
function readFile(input) {
for(let i=0; i<input.files.length; i++) {
const reader = new FileReader();
reader.addEventListener("load", () => {
const vcards = vcf.parse(reader.result);
vcards.forEach(vcard => {
const name = vcard.get('fn')?.valueOf() || vcard.get('n')?.valueOf();
const tels = Array.isArray(vcard.get('tel')) ? vcard.get('tel') : [vcard.get('tel')];
tels.forEach(tel => {
if (tel) {
const number = tel.valueOf();
contacts.push({name: name, number: number});
}
});
});
renderAllContacts();
dirty();
}, false);
reader.readAsText(input.files[i], "UTF-8");
}
}
// ========================================================================== UPLOAD/DOWNLOAD
function downloadJSONfile(fileid, callback) {

View File

@ -1,5 +1,5 @@
{ "id": "contacts",
"name": "contacts",
"name": "Contacts",
"version":"0.01",
"description": "Provides means of storing user contacts, viewing/editing them on device and from the App loader",
"icon": "app.png",