SymphonyElectron/demo/search.html

210 lines
7.0 KiB
HTML
Raw Normal View History

2017-07-25 10:28:38 -05:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Search</title>
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
padding: 5px;
text-align: center;
}
2017-07-27 00:18:11 -05:00
2017-07-25 10:28:38 -05:00
.hidden {
display: none;
}
2017-07-27 00:18:11 -05:00
2017-07-25 10:28:38 -05:00
input {
padding: 5px;
margin: 2px 0;
border: 1px solid #ccc;
}
2017-07-27 00:18:11 -05:00
2017-07-25 10:28:38 -05:00
label {
padding-right: 10px;
}
button {
padding: 10px;
2017-07-27 00:18:11 -05:00
background-color: rgba(0, 64, 98, 0.7);
2017-07-25 10:28:38 -05:00
color: white;
}
</style>
</head>
<body>
<div style="padding: 20px;">
2017-07-27 09:50:26 -05:00
<h1>Symphony Electron Search API Demo</h1>
2017-07-25 10:28:38 -05:00
<div>
<p>Search</p>
</div>
<div>
<label for="query">Query:</label><input id="query" size=60>
</div>
<br>
<div>
<label for="offset">Offset:</label><input id="offset" type="number" value="0" size=5>
<label for="limit">Limit:</label><input id="limit" type="number" value="25" size=5>
2017-07-25 10:28:38 -05:00
</div>
<br>
<div>
<label for="start">Start:</label><input id="start" type="date">
<label for="end">End:</label><input id="end" type="date">
2017-07-25 10:28:38 -05:00
</div>
<br>
<div>
<label for="senderId">SenderId:</label><input id="senderId" placeholder='["abc", "123"]'>
2017-07-25 10:28:38 -05:00
</div>
<br>
<div>
<label for="threadId">ThreadId:</label><input id="threadId" placeholder='["abc", "123"]'>
2017-07-25 10:28:38 -05:00
</div>
<br>
<div>
<button id='search'>Search</button>
</div>
<br>
<div>
<label for="var1">var1:</label><input id="var1" type="number" value="0" size=5>
2017-07-25 10:28:38 -05:00
</div>
<br>
2017-07-27 09:50:26 -05:00
<div>
<label for="realTimeIndexing">Real Time Indexing:</label><input placeholder="Pass array of messages:"
id="realTimeIndexing">
2017-07-27 09:50:26 -05:00
<button id='sendMessage'>Send</button>
</div>
2017-07-25 10:28:38 -05:00
<br>
<div>
2017-07-27 09:50:26 -05:00
<label for="batchNumber">Batch Number: </label><input placeholder="Ex: batch1, batch2" id="batchNumber">
<button id='index'>Index Messages</button>
2017-07-25 10:28:38 -05:00
<button id='merge'>Merge</button>
</div>
<br>
<div>
<label for="batchNumber">Get Latest Message Timestamp</label>
<button id='getLatestMessageTimestamp'>Click</button>
<div>
<p>Results:</p>
<p id="results"></p>
<table id="table" class="hidden" style="width:100%">
<tr>
<th>ThreadId</th>
<th>SenderId</th>
<th>Text</th>
</tr>
</table>
<br>
</div>
2017-07-25 10:28:38 -05:00
</div>
</div>
2017-07-25 10:28:38 -05:00
<script>
var search = new ssf.Search("user_data");
2017-07-25 10:28:38 -05:00
var buttonEl = document.getElementById('search');
var merge = document.getElementById('merge');
var buttonIndex = document.getElementById('index');
2017-07-25 10:28:38 -05:00
var queryEl = document.getElementById('query');
var offsetEl = document.getElementById('offset');
var limitEl = document.getElementById('limit');
var startEl = document.getElementById('start');
var endEl = document.getElementById('end');
var resultsEl = document.getElementById('results');
var senderIdEl = document.getElementById('senderId');
var threadIdEl = document.getElementById('threadId');
var var1El = document.getElementById('var1');
var table = document.getElementById('table');
2017-07-27 09:50:26 -05:00
var sendMessage = document.getElementById('sendMessage');
var realTimeIndexing = document.getElementById('realTimeIndexing');
var batchNumber = document.getElementById('batchNumber');
var timestamp = document.getElementById('getLatestMessageTimestamp');
2017-07-25 10:28:38 -05:00
buttonIndex.addEventListener('click', function () {
2017-07-27 09:50:26 -05:00
let batchIndex = batchNumber.value;
search.readJson(batchIndex).then(function (res) {
2017-07-25 10:28:38 -05:00
search.indexBatch(res).then(function () {
resultsEl.innerHTML = "Index created";
});
}).catch(function (err) {
console.log(err);
});
});
buttonEl.addEventListener('click', function () {
if (!search.isLibInit()) {
search.init();
}
2017-07-25 10:28:38 -05:00
let out;
table.innerHTML = '';
table.classList.remove('hidden');
2017-08-02 06:48:49 -05:00
let startDate = new Date(startEl.value);
let endDate = new Date(endEl.value);
let threadIdObj, senderIdObj;
if (senderIdEl.value && senderIdEl.value !== "" && senderIdEl.value.replace(/ /g, "").length > 0) {
senderIdObj = JSON.parse(senderIdEl.value);
}
if (threadIdEl.value && threadIdEl.value !== "" && threadIdEl.value.replace(/ /g, "").length > 0) {
threadIdObj = JSON.parse(threadIdEl.value);
}
search.searchQuery(queryEl.value, senderIdObj, threadIdObj, null, startDate, endDate, limitEl.value, offsetEl.value, 0).then(function (result) {
if (result.messages.length < 1) {
resultsEl.innerHTML = "No results found"
}
if (result.messages.length > 0) {
out = result;
var th = document.createElement('tr');
var th1 = document.createElement('td');
th1.innerText = "ThreadId";
var th2 = document.createElement('td');
th2.innerText = 'SenderId';
var th3 = document.createElement('td');
th3.innerText = 'Text';
th.appendChild(th1);
th.appendChild(th2);
th.appendChild(th3);
table.appendChild(th);
out.messages.forEach(function (msg) {
var tr = document.createElement('tr');
var t1 = document.createElement('td');
t1.innerText = msg.threadId;
var t2 = document.createElement('td');
t2.innerText = msg.senderId;
var t3 = document.createElement('td');
t3.innerText = msg.text;
tr.appendChild(t1);
tr.appendChild(t2);
tr.appendChild(t3);
table.appendChild(tr);
});
}
}).catch(function (err) {
resultsEl.innerHTML = 'Error: ' + err;
2017-07-25 10:28:38 -05:00
});
2017-07-25 10:28:38 -05:00
});
2017-07-27 09:50:26 -05:00
sendMessage.addEventListener('click', function () {
if (realTimeIndexing.value !== "") {
let message = JSON.parse(realTimeIndexing.value);
resultsEl.innerHTML = search.realTimeIndexing(message);
} else {
resultsEl.innerHTML = "Please check the entered value"
}
2017-07-27 09:50:26 -05:00
});
2017-07-25 10:28:38 -05:00
merge.addEventListener('click', function () {
search.mergeIndexBatches();
resultsEl.innerHTML = 'Merged';
});
timestamp.addEventListener('click', function () {
search.getLatestMessageTimestamp().then(function (res) {
resultsEl.innerHTML = res;
}).catch(function (err) {
resultsEl.innerHTML = 'Error: ' + err;
});
});
2017-07-25 10:28:38 -05:00
</script>
</body>
</html>