Changeset 1342


Ignore:
Timestamp:
Jan 6, 2011, 11:46:13 PM (6 years ago)
Author:
work@…
Message:
  • updated documentation
File:
1 edited

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
Note: See TracChangeset for help on using the changeset viewer.