Changeset 33095

Show
Ignore:
Timestamp:
17.05.2019 18:19:41 (5 weeks ago)
Author:
wy59
Message:

First phase of autocomplete list for map shape descriptions/labels. This commit associates an autocomplete list per map, not per whole page. But it does create the autocomplete Labels List from saved shape descriptions (on LOADing from archives) and then expands that list dynamically further with any labels entered (for a map) by the user, which last happens onblur of the description input field. The autocomplete Labels List does not allow duplicates, though this is not yet at its most efficient. At the moment the list is not expanded alphabetically yet, though this was an option we considered and will be using hereafter. Rather at present the list expands with new items added to the head first, with unshift.

Location:
main/trunk/greenstone3/web/interfaces/default
Files:
2 modified

Legend:

Unmodified
Added
Removed
  • main/trunk/greenstone3/web/interfaces/default/js/map-scripts-editor.js

    r33088 r33095  
    3737    this.resizable = false; 
    3838    this.dontResize = false; 
     39    this.autocompleteLabelsList = []; 
    3940 
    4041    this.shapeOptions = { 
     
    124125        that.shapeOptions.description = description;         
    125126        that.setSelectedDescription(that.shapeOptions.description);         
     127    } 
     128 
     129    // Also add a COMPLETED description (i.e. when description input box loses focus) 
     130    // to the autocomplete list of descriptions/labels 
     131    descriptionInput.onblur = function () { 
     132        var description = this.value; 
     133        that.addToAutocompleteLabelsList(description) 
    126134    } 
    127135     
     
    170178         
    171179    } 
     180 
     181    $(function () { 
     182        // Overrides the default autocomplete filter function to 
     183        // search only from the beginning of the string 
     184        //resource: https://miroslavpopovic.com/posts/2012/06/jqueryui-autocomplete-filter-words-starting-with-term 
     185        $.ui.autocomplete.filter = function (array, term) { 
     186            var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex(term), "i"); 
     187            return $.grep(array, function (value) { 
     188                return matcher.test(value.label || value.value || value); 
     189            }); 
     190        }; 
     191 
     192        $(".description").autocomplete({ 
     193            source: that.autocompleteLabelsList 
     194        }); 
     195    }); 
     196} 
     197 
     198 
     199// Ensure only unique labels are added to our autocomplete list 
     200MapEditor.prototype.addToAutocompleteLabelsList = function (newLabel) { 
     201     
     202    if (!this.autocompleteLabelsList.includes(newLabel)) { 
     203        // TODO: add to end with push, add to start with unshift or sort alphabetically? 
     204        this.autocompleteLabelsList.unshift(newLabel); 
     205    } 
    172206} 
    173207 
     
    785819     
    786820    for (var i=0; i<map_editor.overlays.length; i++) { 
    787         var shape = map_editor.overlays[i]; 
     821        var shape = map_editor.overlays[i]; 
     822 
     823        // set up the autocomplete list using saved labels/descriptions 
     824        map_editor.addToAutocompleteLabelsList(shape.description); 
     825 
    788826        // make the shapes selectable on load: 
    789827        if (ShapesUtil.overlayItemIsShape(shape)) { 
  • main/trunk/greenstone3/web/interfaces/default/transform/pages/document.xsl

    r33088 r33095  
    277277                        <div id = "FourthRow"> 
    278278                            <p>Label Text: 
    279                                 <input type="text" id="description-{@nodeID}" value="" />    
     279                                <input type="text" class="description" id="description-{@nodeID}" value="" />               
    280280                            </p> 
    281281                        </div>