Website:View

From WormBaseWiki
Jump to: navigation, search
  • Things to document: evidence handling, linking entities, external URLs, searches

Directory Layout

Templates are located at root/templates.


   boilerplate/      // boilerplate elements (to be deprecated)
   classes/          // class-specific templates
          gene/           // widget templates specific for the gene class
   config/           // template tooljit configuration files
      external_urls  // a data structure of external URLs
      main           // primary view-level configuration (macros, variables, etc)
   debug/            // debugging templates
   footer/
      default.tt2    // the default footer
   header/
      default.tt2    // the default header
      classic.tt2    // the classic header
   help/      
   index.tt2         // the default index page
   layout/           // templates that establish the page loyout (columnar, two-panel selector, etc)
   nav/              // navigation elements
   shared/           // shared fields and widgets and page elements
   status/           // 300, 301, 400, 404, 500 status pages
   wrapper.tt2       // Master wrapper template

General Page Structure

Pages are comprised of widgets. Available widgets for a given page are specific in the application-level configuration file, wormbase.conf. In turn, each widget is comprised of fields. Available widgets (and their component fields) are specified in the application-level configuration file,wormbase.conf.

     <pages>
        <gene>
           <widgets>
               <widget&t;
  	          name    [symbolic name of the widget]
                  title   [display name of the widget]
                  tooltip [brief description shown as a tooltip/balloon]
                  fields  [ordered list of fields; field1]
	          fields  [second field, and so on]
               </widget>

           </widgets>
        </gene>
     </pages>


Most widgets utilize custom templates that correspond to the name of the widget. For example, the Gene:Overview widget is handled by the gene/overview.tt2 template.

Here is a prototypical widget in its entirety. This widget contains two fields and no sub fields.


      [% WRAPPER $field_block title="Name"-%]
           [% tag2link(fields.common_name.data) %]
      [% END %]

      [% WRAPPER $field_block title="WormBase Referential ID"-%] 
           [% tag2link(fields.name.data,fields.name.data.id) %]
      [% END %]
   

Notes:

  • Each field is wrapped by a macro, called $field_block.
  • $field_block is a dynamically set global template variable that specifies which macro will be used to wrap fields.
  • Widget wrapping occurs outside of the widget template, including widget titles.
  • There is *very* little CSS markup (in fact, none).

Shared Page Elements

Widgets

There are several widgets shared across classes.

  ls -1 root/templates/shared/widgets
  references.tt2

To include one of these widgets in a page, simply add it as an available widget in the wormbase.conf file. That's it! No changes are required to the API.


Fields

Like widgets, there are many shared fields across classes. Reusing the markup for these fields makes the API cleaner, and template markup easier to update.

  ls -1 root/templates/shared/fields
  genetic_position.tt2
  genomic_position.tt2
  interpolated_position.tt2
  name.tt2
  remarks.tt2
  species.tt2

To use one of these shared fields in your template

  1. 1. Add the appropriate field to the list of available fields in wormbase.conf:
  2. 2. Add a process statement to your widget template: [% PROCESS "shared/fields/species.tt2" %]

Elements

The file page_elements.tt2 contains a number of useful reusable page elements:

 field_block  // used for wrapping fields. Usage: %5B% WRAPPER field_block title="field title %]
 object_list  // a list of objects
 widget_block // used for wrapping widgets. Usage: %5B% WRAPPER widget_block title="widget title" %]
 google_analytics // add in analytics tracking code
  • Genus Species / Taxonomy
  [% PROCESS "common_fields/species.tt2" %]
  • Outgoing links
  [% external_link(‘OMIM’, ‘OMIM:604297’, ‘604297’) %]

The macro used: (/root/templates/config/main)

# Use to create outgoing links from the site
# params: link          - the ID for the link found in root/templates/config/external_urls
#         text          - text displayed in the link
#         id (optional) - the unique id needed in the url.  If not provided, base url is used.
# ret: formatted html to link using url and description from config.  
#      Has google analytics code to record clicks and opens new window

MACRO external_link(link, text, id) BLOCK;


Javascript

Javascript use and maintenance