Skip to content

Commit 9750a88

Browse files
fquirinfquirin
committed
improved teachUI commands overview + added search field
1 parent 037a4aa commit 9750a88

File tree

4 files changed

+130
-88
lines changed

4 files changed

+130
-88
lines changed

‎www/css/sepiaFW-teachUI.css‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -130,11 +130,25 @@
130130
display: none;
131131
}
132132

133+
#sepiaFW-teachUI-manager #sepiaFW-teachUI-cmd-search {
134+
flex: 1 1 auto;
135+
height: 40px;
136+
}
137+
#sepiaFW-teachUI-manager #sepiaFW-teachUI-cmd-search-btn {
138+
margin: 0;
139+
flex: 0 0 52px;
140+
height: 40px;
141+
border-left: 2px solid #5f5f5f;
142+
}
143+
133144
#sepiaFW-teachUI-manager .sepiaFW-command-cards-container {
134145
display: flex;
135146
flex-direction: column;
136147
padding: 0 4px;
137148
}
149+
#sepiaFW-teachUI-manager .sepiaFW-command-cards-container h3 {
150+
margin: 12px 6px;
151+
}
138152
#sepiaFW-teachUI-manager .sepiaFW-command-card {
139153
flex: 1 1 auto;
140154
min-height: 40px;

‎www/scripts/sepiaFW.teach.js‎

Lines changed: 103 additions & 80 deletions
Original file line numberDiff line numberDiff line change
@@ -228,7 +228,7 @@ function sepiaFW_build_teach(sepiaSessionId){
228228
//manager active
229229
if (isFirstManagerLoad){
230230
isFirstManagerLoad = false;
231-
$('#sepiaFW-teachUI-load-commands').trigger('click');
231+
loadRecentCommands();
232232
}
233233
}else if (currentPane == 0){
234234
//editor active
@@ -311,34 +311,85 @@ function sepiaFW_build_teach(sepiaSessionId){
311311
SepiaFW.ui.hidePopup();
312312
});
313313
});
314+
315+
//-SEARCH commands
316+
var $cmdSearchInput = $('#sepiaFW-teachUI-cmd-search');
317+
function searchCommands(){
318+
var searchText = $cmdSearchInput.val();
319+
if (searchText){
320+
Teach.searchPersonalCommands(SepiaFW.account.getKey(sepiaSessionId), searchText, function(data){
321+
//success
322+
$cmdSearchInput.val("");
323+
buildPersonalCommandsResult(data.result, true, "Search Results:");
324+
//console.log(JSON.stringify(data));
325+
$('#sepiaFW-teachUI-load-more-commands').fadeIn(300);
326+
327+
}, function(msg){
328+
//error
329+
SepiaFW.ui.showPopup(msg);
330+
}, '');
331+
}
332+
}
333+
$cmdSearchInput.keypress(function(event){
334+
if (event.key === "Enter"){
335+
searchCommands();
336+
}
337+
});
338+
$('#sepiaFW-teachUI-cmd-search-btn').on('click', function(){
339+
searchCommands();
340+
});
314341

315-
//-LOAD commands
316-
$('#sepiaFW-teachUI-load-commands').on('click', function(){
342+
//-LOAD commands (recent)
343+
function loadRecentCommands(){
317344
var startingFrom = 0;
318-
nextStartingFrom = 10;
319-
Teach.loadPersonalCommands(SepiaFW.account.getKey(sepiaSessionId), startingFrom, loadAtOnce, function(data){
345+
nextStartingFrom = 8; //reset
346+
var loadMax = 8;
347+
Teach.loadPersonalCommands(SepiaFW.account.getKey(sepiaSessionId), startingFrom, loadMax, function(data){
320348
//success
321-
buildPersonalCommandsResult(data.result, true);
349+
buildPersonalCommandsResult(data.result, true, "Recent:");
322350
//console.log(JSON.stringify(data));
351+
$('#sepiaFW-teachUI-load-more-commands').fadeIn(300);
323352

324353
}, function(msg){
325354
//error
326355
SepiaFW.ui.showPopup(msg);
327-
}, '');
356+
}, '', {
357+
sortByDate: true
358+
});
359+
}
360+
$('#sepiaFW-teachUI-load-commands').on('click', function(){
361+
loadRecentCommands();
328362
});
329363
//-LOAD more commands
330-
$('#sepiaFW-teachUI-load-more-commands').on('click', function(){
364+
function loadMoreCommands(){
331365
var startingFrom = nextStartingFrom;
332-
nextStartingFrom += 10;
366+
nextStartingFrom += loadAtOnce;
333367
Teach.loadPersonalCommands(SepiaFW.account.getKey(sepiaSessionId), startingFrom, loadAtOnce, function(data){
334368
//success
335-
buildPersonalCommandsResult(data.result, false);
369+
var resultComment;
370+
var startN = (startingFrom + 1);
371+
var endN = (data.result && data.result.length)? (startingFrom + data.result.length) : 0;
372+
//show more?
373+
if (data.result && data.result.length < loadAtOnce){
374+
resultComment = (startN != endN)? ("Last " + startN + "-" + endN) : "Last";
375+
$('#sepiaFW-teachUI-load-more-commands').fadeOut(300);
376+
}else if (endN){
377+
resultComment = "Next " + startN + "-" + endN;
378+
}else{
379+
resultComment = "Done";
380+
}
381+
buildPersonalCommandsResult(data.result, startingFrom == 0, resultComment);
336382
//console.log(JSON.stringify(data));
337383

338384
}, function(msg){
339385
//error
340386
SepiaFW.ui.showPopup(msg);
341-
}, '');
387+
}, '', {
388+
sortByDate: true
389+
});
390+
}
391+
$('#sepiaFW-teachUI-load-more-commands').on('click', function(){
392+
loadMoreCommands();
342393
});
343394

344395
if (finishCallback) finishCallback();
@@ -591,11 +642,16 @@ function sepiaFW_build_teach(sepiaSessionId){
591642
}
592643

593644
//build result for command manager page
594-
function buildPersonalCommandsResult(data, clearBox){
645+
function buildPersonalCommandsResult(data, clearBox, headerTitle){
595646
var cmdCardsBox = $('#sepiaFW-teachUI-manager').find('.sepiaFW-command-cards-container');
596647
if (clearBox){
597648
cmdCardsBox.html('');
598649
}
650+
if (headerTitle){
651+
var ht = document.createElement("h3");
652+
ht.textContent = headerTitle;
653+
cmdCardsBox.append(ht);
654+
}
599655
$.each(data, function(index, obj){
600656
var sentence = obj.sentence[0];
601657
var id = obj.id;
@@ -627,12 +683,6 @@ function sepiaFW_build_teach(sepiaSessionId){
627683
})(newCmdCard);
628684
}
629685
});
630-
//show more?
631-
if (data && data.length>=10){
632-
$('#sepiaFW-teachUI-manager-bottom-buttons').fadeIn(300);
633-
}else if (data){
634-
$('#sepiaFW-teachUI-manager-bottom-buttons').fadeOut(300);
635-
}
636686
}
637687
function makeCmdCard(sentence, cmdId){
638688
var newCard = document.createElement('DIV');
@@ -835,91 +885,63 @@ function sepiaFW_build_teach(sepiaSessionId){
835885
}
836886

837887
//load personal and custom assistant commands
838-
Teach.loadPersonalCommands = function(key, startingFrom, loadSize, successCallback, errorCallback, debugCallback, with_button_only){
839-
loadPersonalOrCustomAssistantCommands("getAllPersonalCommands", key, startingFrom, loadSize,
840-
successCallback, errorCallback, debugCallback, with_button_only);
888+
Teach.loadPersonalCommands = function(key, startingFrom, loadSize, successCallback, errorCallback, debugCallback, options){
889+
loadPersonalOrCustomAssistantCommands("getAllPersonalCommands", key, startingFrom, loadSize,
890+
successCallback, errorCallback, debugCallback, options);
841891
}
842-
Teach.loadCustomAssistantCommands = function(key, startingFrom, loadSize, successCallback, errorCallback, debugCallback, with_button_only){
892+
Teach.loadCustomAssistantCommands = function(key, startingFrom, loadSize, successCallback, errorCallback, debugCallback, options){
843893
loadPersonalOrCustomAssistantCommands("getAllCustomAssistantCommands", key, startingFrom, loadSize,
844-
successCallback, errorCallback, debugCallback, with_button_only);
894+
successCallback, errorCallback, debugCallback, options);
845895
}
846-
function loadPersonalOrCustomAssistantCommands(endpoint, key, startingFrom, loadSize, successCallback, errorCallback, debugCallback, with_button_only){
896+
function loadPersonalOrCustomAssistantCommands(endpoint, key, startingFrom, loadSize, successCallback, errorCallback, debugCallback, options){
897+
if (!options) options = {};
847898
SepiaFW.ui.showLoader();
848899
var apiUrl = SepiaFW.config.teachAPI + endpoint;
849900
var submitData = new Object();
850-
submitData.KEY = key;
851-
submitData.client = SepiaFW.config.getClientDeviceInfo(); //SepiaFW.config.clientInfo;
852901
submitData.from = startingFrom;
853902
submitData.size = loadSize;
854-
if (with_button_only){
903+
if (options.withButtonOnly){
855904
submitData.button = true;
856905
}
857-
$.ajax({
858-
url: apiUrl,
859-
timeout: 10000,
860-
type: "POST",
861-
data: submitData,
862-
headers: {
863-
"content-type": "application/x-www-form-urlencoded"
864-
},
865-
success: function(data) {
866-
SepiaFW.ui.hideLoader();
867-
if (debugCallback) debugCallback(data);
868-
if (data.result && data.result === "fail"){
869-
if (errorCallback) errorCallback('Sorry, but something went wrong while loading personal commands! :-(');
870-
return;
871-
}
872-
//--callback--
873-
if (successCallback) successCallback(data);
874-
},
875-
error: function(data) {
876-
SepiaFW.ui.hideLoader();
877-
if (errorCallback) errorCallback('Sorry, but I could not connect to API :-( Please wait a bit and then try again.');
878-
if (debugCallback) debugCallback(data);
879-
}
880-
});
906+
if (options.sortByDate){
907+
submitData.sortByDate = true;
908+
}
909+
sendTeachApiRequest(apiUrl, key, submitData, successCallback, errorCallback, debugCallback,
910+
'Sorry, but something went wrong while loading personal commands! :-(');
881911
}
882912
Teach.loadPersonalCommandsWithIds = function(key, ids, successCallback, errorCallback, debugCallback){
883913
SepiaFW.ui.showLoader();
884914
var apiUrl = SepiaFW.config.teachAPI + "getPersonalCommandsByIds";
885915
var submitData = new Object();
886-
submitData.KEY = key;
887-
submitData.client = SepiaFW.config.getClientDeviceInfo(); //SepiaFW.config.clientInfo;
888916
submitData.ids = JSON.stringify(ids);
889-
$.ajax({
890-
url: apiUrl,
891-
timeout: 10000,
892-
type: "POST",
893-
data: submitData,
894-
headers: {
895-
"content-type": "application/x-www-form-urlencoded"
896-
},
897-
success: function(data) {
898-
SepiaFW.ui.hideLoader();
899-
if (debugCallback) debugCallback(data);
900-
if (data.result && data.result === "fail"){
901-
if (errorCallback) errorCallback('Sorry, but something went wrong while loading personal commands! :-(');
902-
return;
903-
}
904-
//--callback--
905-
if (successCallback) successCallback(data);
906-
},
907-
error: function(data) {
908-
SepiaFW.ui.hideLoader();
909-
if (errorCallback) errorCallback('Sorry, but I could not connect to API :-( Please wait a bit and then try again.');
910-
if (debugCallback) debugCallback(data);
911-
}
912-
});
917+
sendTeachApiRequest(apiUrl, key, submitData, successCallback, errorCallback, debugCallback,
918+
'Sorry, but something went wrong while loading personal commands! :-(');
913919
}
914-
920+
Teach.searchPersonalCommands = function(key, searchText, successCallback, errorCallback, debugCallback){
921+
SepiaFW.ui.showLoader();
922+
var apiUrl = SepiaFW.config.teachAPI + "getPersonalCommands";
923+
var state = SepiaFW.assistant.getState();
924+
var submitData = new Object();
925+
submitData.language = state.lang;
926+
submitData.searchText = searchText;
927+
sendTeachApiRequest(apiUrl, key, submitData, successCallback, errorCallback, debugCallback,
928+
'Sorry, but something went wrong while loading personal commands! :-(');
929+
}
930+
915931
//remove personal command
916932
Teach.removePersonalCommand = function(key, cmdId, successCallback, errorCallback, debugCallback){
917933
SepiaFW.ui.showLoader();
918934
var apiUrl = SepiaFW.config.teachAPI + "deletePersonalCommand";
919935
var submitData = new Object();
936+
submitData.id = cmdId;
937+
sendTeachApiRequest(apiUrl, key, submitData, successCallback, errorCallback, debugCallback,
938+
'Sorry, but something went wrong while trying to delete the command! Maybe invalid id?');
939+
}
940+
941+
//basic request method
942+
function sendTeachApiRequest(apiUrl, key, submitData, successCallback, errorCallback, debugCallback, resultFailErrorMsg){
920943
submitData.KEY = key;
921944
submitData.client = SepiaFW.config.getClientDeviceInfo(); //SepiaFW.config.clientInfo;
922-
submitData.id = cmdId;
923945
$.ajax({
924946
url: apiUrl,
925947
timeout: 10000,
@@ -932,7 +954,8 @@ function sepiaFW_build_teach(sepiaSessionId){
932954
SepiaFW.ui.hideLoader();
933955
if (debugCallback) debugCallback(data);
934956
if (data.result && data.result === "fail"){
935-
if (errorCallback) errorCallback('Sorry, but something went wrong while trying to delete the command! Maybe invalid id?');
957+
if (errorCallback) errorCallback(resultFailErrorMsg ||
958+
'Sorry, but something went wrong during personal commands request! :-(');
936959
return;
937960
}
938961
//--callback--

‎www/scripts/sepiaFW.ui.customButtons.js‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,10 @@ function sepiaFW_build_ui_custom_buttons(sepiaSessionId){
9999
SepiaFW.debug.err(msg);
100100
if (errorCallback) errorCallback();
101101

102-
}, '', withButtonOnly);
102+
}, '', {
103+
//options
104+
withButtonOnly: withButtonOnly
105+
});
103106
}
104107

105108
//Load some offline demo buttons

‎www/teach.html‎

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -34,8 +34,8 @@ <h3>Custom button</h3>
3434
</ul>
3535
</div>
3636
<div class="sepiaFW-teachUI-menu-group center">
37-
<button id="sepiaFW-teachUI-show-optionals" style="display:none;">MORE OPTIONS</button>
38-
<button id="sepiaFW-teachUI-submit" style="display:none;">TEACH</button>
37+
<button id="sepiaFW-teachUI-show-optionals" style="display:none;">More Options</button>
38+
<button id="sepiaFW-teachUI-submit" style="display:none;">Teach!</button>
3939
</div>
4040
</div>
4141

@@ -44,14 +44,16 @@ <h3>Custom button</h3>
4444
<div class="sepiaFW-teachUI-menu-group center">
4545
<h2>Your personal commands</h2>
4646
</div>
47+
<div class="sepiaFW-teachUI-menu-group" style="display: flex; align-items: center;">
48+
<input id="sepiaFW-teachUI-cmd-search" placeholder="Search commands...">
49+
<button id="sepiaFW-teachUI-cmd-search-btn"><i class="material-icons md-btn2">search</i></button>
50+
</div>
4751
<div class="sepiaFW-command-cards-container">
4852
<!-- dynamic content -->
4953
</div>
50-
<div class="sepiaFW-teachUI-menu-group center">
51-
<button id="sepiaFW-teachUI-load-commands">RELOAD</button>
52-
</div>
53-
<div id="sepiaFW-teachUI-manager-bottom-buttons" class="sepiaFW-teachUI-menu-group center" style="display:none;">
54-
<button id="sepiaFW-teachUI-load-more-commands">LOAD MORE</button>
54+
<div id="sepiaFW-teachUI-manager-bottom-buttons" class="sepiaFW-teachUI-menu-group center">
55+
<button id="sepiaFW-teachUI-load-commands">Load Recent</button>
56+
<button id="sepiaFW-teachUI-load-more-commands" style="display:none;">Load More</button>
5557
</div>
5658
</div>
5759
</div>

0 commit comments

Comments
 (0)