Changeset 1342

Show
Ignore:
Timestamp:
06-01-11 23:46:13 (3 years ago)
Author:
work@…
Message:

- updated documentation

Files:
1 modified

Legend:

Unmodified
Added
Removed
  • trunk/web-app/js/ontology-chooser.js

    r1184 r1342  
    11/** 
    22 * Ontology chooser JavaScript class 
    3  * 
    4  * NCBO wrote it's own cross-site form completion utility 
    5  * utilizing it's json webservice. However, the service is 
    6  * no proper json service as it does not return proper json 
    7  * objects (just a self designed string using | for value 
    8  * breaks and ~!~ for line breaks. Also, their implementation 
    9  * conflicts with the table editor. Therefore, I wrote this 
    10  * cleaner implementation using jquery-ui's autocomplete 
    11  * functionality. 
     3 * Copyright (C) 2010 Jeroen Wesbeek 
     4 * 
     5 * Licensed under the Apache License, Version 2.0 (the "License"); 
     6 * you may not use this file except in compliance with the License. 
     7 * You may obtain a copy of the License at 
     8 * 
     9 * http://www.apache.org/licenses/LICENSE-2.0 
     10 * 
     11 * Unless required by applicable law or agreed to in writing, software 
     12 * distributed under the License is distributed on an "AS IS" BASIS, 
     13 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 
     14 * See the License for the specific language governing permissions and 
     15 * limitations under the License. 
     16 * 
     17 * Description: 
     18 * ------------ 
     19 * NCBO wrote a javascript library to search for terms in one 
     20 * or more ontologies. However, this 'widget' contained it's 
     21 * own autocomplete implementation, and it was conflicting with 
     22 * other JavaScript libraries in our project (mainly the table 
     23 * editor). 
     24 * 
     25 * This Ontology Chooser aims at 
     26 * - utilizing the autocomplete functionality provided by the 
     27 *   jquery-ui library to create a common look and feel 
     28 *   throughout the application 
     29 * - using a 'rel' attribute instead of a 'class' attribute as 
     30 *   the latter might conflict with style elements 
     31 * - dynamically creating or updating hidden fields with 
     32 *   relevant ontology and term data 
     33 * - to be as unobtrusive as possible 
     34 * - add additional functionality to: 
     35 *              *) show / hide DOM elements based if a term was 
     36 *                 selected or not (generally a form button) 
     37 *              *) providing copy / paste functionality for 
     38 *                 ontology fields where hidden fields are 
     39 *                 transparently copied and pasted between 
     40 *                 input fields that accept the same ontology 
     41 * 
     42 * The original NCBO implementation can be found here: 
     43 * http://www.bioontology.org/wiki/index.php/Ontology_Widgets#Term-selection_field_on_a_form 
    1244 * 
    1345 * Usage: 
     
    2052 * identify ontology fields. 
    2153 * 
     54 * To intitialize these fields the following JavaScript should 
     55 * be used, where 'div#button' is shown when a term was selected 
     56 * or hidden when a term was not selected / found: 
     57 *      $(document).ready(function() { 
     58 *              // initialize the ontology chooser 
     59 *              new OntologyChooser().init({ 
     60 *                      showHide: $('div#button'), 
     61 *                      spinner: "http://www.ajaxload.info/images/exemples/2.gif" 
     62 *              }); 
     63 * }); 
     64 * 
    2265 * N.B. In order to show the labels of the terms correctly (i.e. 
    2366 * no ugly HTML tags, you also have to include jquery.ui.autocomplete.html.js 
    2467 * in your page! 
    2568 * 
     69 * Documentation: 
     70 * -------------- 
     71 * https://wiki.nbic.nl/index.php/DbNP_Technical_Documentation#Ontology_Chooser 
     72 * 
     73 * Live (Continuous Integration) example: 
     74 * -------------------------------------- 
     75 * http://ci.nmcdsp.org/termEditor?ontologies=1132 
     76 * 
    2677 * @author              Jeroen Wesbeek 
    2778 * @since               20100312 
    2879 * @package             wizard 
    29  * @requires    jquery, jquery-ui 
     80 * @requires    jquery, jquery-ui, jquery.ui.autocomplete.html.js 
     81 * @see                 http://jquery.com 
     82 * @see                 http://jqueryui.com 
     83 * @see                 http://github.com/scottgonzalez/jquery-ui-extensions 
    3084 * @see                 http://bioportal.bioontology.org/ontologies/ 
    3185 * @see                 http://bioportal.bioontology.org/search/json_search/?q=musculus 
     
    90144                } 
    91145 
    92                 // handle ctrl or apple keys (to find ctrl-escape / ctrl-paste) 
     146                // handle ctrl or apple keys (to find ctrl-copy / ctrl-paste) 
    93147                inputElement.bind('keydown', function(e) { 
    94148                        // check if ctrl-key or apple cmd key is pressed 
     
    118172                }); 
    119173 
    120                 // http://bioportal.bioontology.org/search/json_search/?q=musculus 
     174                // initialize a jquery-ui autocomplete 
    121175                inputElement.autocomplete({ 
    122176                        minLength: that.options.minLength, 
     
    255309         * Parse the result data 
    256310         * 
    257          * Data is in the following format: 
     311         * Contrary to what 'json_search' might suggest, the webservice 
     312         * does not return json objects, but some text format that we 
     313         * need to parse ourselves. In this format | codes for a column 
     314         * break, and ~!~ for a line break 
     315         * 
     316         * Example data: 
    258317         * Mus musculus musculus|birnlex_161|preferred name|29684|http://bioontology.org/projects/ontologies/birnlex#birnlex_161|Mus musculus musculus|Mus musculus musculus|BIRNLex~!~ 
    259          * 
    260          * Where | codes for a column break, and ~!~ for 
    261          * a line break 
    262318         * 
    263319         * @param data