Difference between revisions of "Design Specs: GBrowse Integration"

From WormBaseWiki
Jump to navigationJump to search
Line 13: Line 13:
 
}
 
}
 
  </pre>
 
  </pre>
 +
 +
2. copy over the head header footer stanza in conf/gbrowse.conf/GBrowse.conf
 +
<pre>
 +
        # HTML to insert inside the <head></head> section
 +
  head = 
 +
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
 +
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js" type="text/javascript"></script> 
 +
    <script>
 +
      var $jq=  jQuery.noConflict();
 +
    </script>
 +
    <script type="text/javascript" src="/js/raphael-min.js"></script>
 +
    <script type="text/javascript" src="/js/layout.js" ></script> 
 +
    <script type="text/javascript" src="/js/jquery/plugins/openid-selector-1.0/js/openid-jquery.js"></script>
 +
    <link type="text/css" rel="stylesheet" href="/js/jquery/plugins/openid-selector-1.0/css/openid.css"/>
 +
    <link media="screen" rel="stylesheet" href="/js/jquery/plugins/colorbox/example4/colorbox.css" />
 +
    <script type="text/javascript" src="/js/jquery/plugins/colorbox/colorbox/jquery.colorbox-min.js"></script>
 +
    <link type="text/css" href="/js/jquery/current-theme/development-bundle/themes/theme/jquery.ui.all.css" rel="stylesheet" />
 +
    <link href="/css/main.css" rel="stylesheet" type="text/css" /> 
 +
    <link href="/css/home.css" rel="stylesheet" type="text/css" />
 +
    <link type="text/css" href="/css/icons.css" rel="stylesheet" />
 +
 +
  # At the top of the HTML...
 +
  header =  <div class="header"> </div>
 +
  <script type="text/javascript">
 +
      $jq(".header").load("/header",function() {
 +
  $jq.getScript('/js/ajax.js');
 +
  $jq.getScript('/js/nav.js');
 +
  $jq.getScript('/js/search.js');
 +
      });   
 +
  </script>
 +
 +
  # At the footer
 +
  footer = <div class='footer'></div> 
 +
<script type='text/javascript'>
 +
    $jq(".footer").load('/footer', function() {
 +
  $jq.getScript('/js/effect.js');
 +
      });   
 +
</script>
 +
 +
</pre>
 +
3. add stylesheet  = /css/wormbase-gbrowse.css

Revision as of 17:57, 27 January 2011

1. use the front proxy (nginx) to pass requests from /gb2 to the gbrowse server. On dev, I have

  	        location /gb2 {
			proxy_pass http://localhost:9005;
		}	
		location /gbrowse2/i/ {
			alias /usr/local/wormbase/website/staging/extlib/gbrowse2/current/tmp/images/; 
		}
		
		location /gbrowse2/ {
			alias /usr/local/wormbase/website/staging/extlib/gbrowse2/current/html/; 
		}
 

2. copy over the head header footer stanza in conf/gbrowse.conf/GBrowse.conf

        # HTML to insert inside the <head></head> section
  head =  
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js" type="text/javascript"></script>   
    <script>
      var $jq=  jQuery.noConflict();
    </script>
    <script type="text/javascript" src="/js/raphael-min.js"></script>
    <script type="text/javascript" src="/js/layout.js" ></script>  
    <script type="text/javascript" src="/js/jquery/plugins/openid-selector-1.0/js/openid-jquery.js"></script>
    <link type="text/css" rel="stylesheet" href="/js/jquery/plugins/openid-selector-1.0/css/openid.css"/>
    <link media="screen" rel="stylesheet" href="/js/jquery/plugins/colorbox/example4/colorbox.css" />
    <script type="text/javascript" src="/js/jquery/plugins/colorbox/colorbox/jquery.colorbox-min.js"></script>
    <link type="text/css" href="/js/jquery/current-theme/development-bundle/themes/theme/jquery.ui.all.css" rel="stylesheet" />
    <link href="/css/main.css" rel="stylesheet" type="text/css" />  
    <link href="/css/home.css" rel="stylesheet" type="text/css" />
    <link type="text/css" href="/css/icons.css" rel="stylesheet" />

  # At the top of the HTML...
  header =  <div class="header"> </div>
	  <script type="text/javascript">
	      $jq(".header").load("/header",function() {
		  $jq.getScript('/js/ajax.js');
		  $jq.getScript('/js/nav.js');
		  $jq.getScript('/js/search.js');
	      });    
	  </script>
	 
  # At the footer
  footer = <div class='footer'></div>   
	 <script type='text/javascript'> 
	    $jq(".footer").load('/footer', function() {
		  $jq.getScript('/js/effect.js');
	      });    
	 </script> 

3. add stylesheet = /css/wormbase-gbrowse.css