Sequence検索

Gemfile

@@ -2,18 +2,27 @@ source 'https://rubygems.org'
 
 gem 'rails', '4.2.3'
 
+gem 'action_args'
+gem 'bio' # 'bio-gggenome' dependency gem
+gem 'bio-gggenome'
 gem 'coffee-rails', '~> 4.1.0'
+gem 'faraday'
 gem 'haml-rails'
+gem 'hashie'
 gem 'jbuilder', '~> 2.0'
-gem 'jquery-rails'
+gem 'react-rails'
 gem 'sass-rails', '~> 5.0'
 gem 'sdoc', '~> 0.4.0', group: :doc
 gem 'turbolinks'
 gem 'uglifier', '>= 1.3.0'
+gem 'unicorn'
 
 group :development, :test do
   gem 'byebug'
   gem 'spring'
   gem 'web-console', '~> 2.0'
 end
 
+source 'https://rails-assets.org' do
+  gem 'rails-assets-bootstrap', '~> 4.0.0.alpha'
+end

Gemfile.lock

@@ -1,6 +1,8 @@
 GEM
   remote: https://rubygems.org/
+  remote: https://rails-assets.org/
   specs:
+    action_args (1.5.4)
     actionmailer (4.2.3)
       actionpack (= 4.2.3)
       actionview (= 4.2.3)
@@ -37,8 +39,14 @@ GEM
       thread_safe (~> 0.3, >= 0.3.4)
       tzinfo (~> 1.1)
     arel (6.0.3)
+    babel-source (5.8.3)
+    babel-transpiler (0.7.0)
+      babel-source (>= 4.0, < 6)
+      execjs (~> 2.0)
     binding_of_caller (0.7.2)
       debug_inspector (>= 0.0.1)
+    bio (1.5.0)
+    bio-gggenome (0.2.0)
     builder (3.2.2)
     byebug (5.0.0)
       columnize (= 0.9.0)
@@ -50,9 +58,12 @@ GEM
       execjs
     coffee-script-source (1.9.1.1)
     columnize (0.9.0)
+    connection_pool (2.2.0)
     debug_inspector (0.0.2)
     erubis (2.7.0)
     execjs (2.5.2)
+    faraday (0.9.1)
+      multipart-post (>= 1.2, < 3)
     globalid (0.3.6)
       activesupport (>= 4.1.0)
     haml (4.0.6)
@@ -63,6 +74,8 @@ GEM
       haml (>= 4.0.6, < 5.0)
       html2haml (>= 1.0.1)
       railties (>= 4.0.1)
+    hashie (3.4.2)
+    hike (1.2.3)
     html2haml (2.0.0)
       erubis (~> 2.7.0)
       haml (~> 4.0.0)
@@ -72,19 +85,17 @@ GEM
     jbuilder (2.3.1)
       activesupport (>= 3.0.0, < 5)
       multi_json (~> 1.2)
-    jquery-rails (4.0.4)
-      rails-dom-testing (~> 1.0)
-      railties (>= 4.2.0)
-      thor (>= 0.14, < 2.0)
     json (1.8.3)
+    kgio (2.9.3)
     loofah (2.0.2)
       nokogiri (>= 1.5.9)
     mail (2.6.3)
       mime-types (>= 1.16, < 3)
     mime-types (2.6.1)
     mini_portile (0.6.2)
-    minitest (5.7.0)
+    minitest (5.8.0)
     multi_json (1.11.2)
+    multipart-post (2.0.0)
     nokogiri (1.6.6.2)
       mini_portile (~> 0.6.0)
     rack (1.6.4)
@@ -101,6 +112,9 @@ GEM
       bundler (>= 1.3.0, < 2.0)
       railties (= 4.2.3)
       sprockets-rails
+    rails-assets-bootstrap (4.0.0.alpha)
+      rails-assets-jquery (>= 1.9.1, < 3)
+    rails-assets-jquery (2.1.4)
     rails-deprecated_sanitizer (1.0.3)
       activesupport (>= 4.2.0.alpha)
     rails-dom-testing (1.0.6)
@@ -114,9 +128,17 @@ GEM
       activesupport (= 4.2.3)
       rake (>= 0.8.7)
       thor (>= 0.18.1, < 2.0)
+    raindrops (0.15.0)
     rake (10.4.2)
     rdoc (4.2.0)
-    ruby_parser (3.7.0)
+    react-rails (1.1.0)
+      babel-transpiler (>= 0.7.0)
+      coffee-script-source (~> 1.8)
+      connection_pool
+      execjs
+      rails (>= 3.2)
+      tilt
+    ruby_parser (3.7.1)
       sexp_processor (~> 4.1)
     sass (3.4.16)
     sass-rails (5.0.3)
@@ -130,8 +152,11 @@ GEM
       rdoc (~> 4.0)
     sexp_processor (4.6.0)
     spring (1.3.6)
-    sprockets (3.2.0)
+    sprockets (2.12.4)
+      hike (~> 1.2)
+      multi_json (~> 1.0)
       rack (~> 1.0)
+      tilt (~> 1.1, != 1.3.0)
     sprockets-rails (2.3.2)
       actionpack (>= 3.0)
       activesupport (>= 3.0)
@@ -146,6 +171,10 @@ GEM
     uglifier (2.7.1)
       execjs (>= 0.3.0)
       json (>= 1.8.0)
+    unicorn (4.9.0)
+      kgio (~> 2.6)
+      rack
+      raindrops (~> 0.7)
     web-console (2.2.1)
       activemodel (>= 4.0)
       binding_of_caller (>= 0.7.2)
@@ -156,17 +185,24 @@ PLATFORMS
   ruby
 
 DEPENDENCIES
+  action_args
+  bio
+  bio-gggenome
   byebug
   coffee-rails (~> 4.1.0)
+  faraday
   haml-rails
+  hashie
   jbuilder (~> 2.0)
-  jquery-rails
   rails (= 4.2.3)
+  rails-assets-bootstrap (~> 4.0.0.alpha)!
+  react-rails
   sass-rails (~> 5.0)
   sdoc (~> 0.4.0)
   spring
   turbolinks
   uglifier (>= 1.3.0)
+  unicorn
   web-console (~> 2.0)
 
 BUNDLED WITH

app/assets/javascripts/application.js

@@ -11,6 +11,9 @@
 // about supported directives.
 //
 //= require jquery
-//= require jquery_ujs
+//= require bootstrap
 //= require turbolinks
+//= require react
+//= require react_ujs
+//= require components
 //= require_tree .

app/assets/javascripts/components.js

@@ -0,0 +1 @@
+//= require_tree ./components

app/assets/javascripts/components/converter_page.js.jsx

@@ -0,0 +1,6 @@
+var ConverterPage = React.createClass({
+
+  render: function() {
+    return <div />;
+  }
+});

app/assets/javascripts/components/facet_page.js.jsx

@@ -0,0 +1,7 @@
+var FacetPage = React.createClass({
+
+  render: function() {
+    return <div >Facet page</div>;
+  }
+});
+

app/assets/javascripts/components/resolver_page.js.jsx

@@ -0,0 +1,6 @@
+var ResolverPage = React.createClass({
+
+  render: function() {
+    return <div />;
+  }
+});

app/assets/javascripts/components/sequence_page.js.jsx

@@ -0,0 +1,140 @@
+var SequenceSearchForm = React.createClass({
+  handleSubmit(e) {
+    e.preventDefault();
+    var fragment = React.findDOMNode(this.refs.fragment).value.trim();
+    if (!fragment) {
+      return;
+    }
+    this.props.onSearchSubmit({fragment: fragment});
+  },
+  render() {
+    return (
+      <div>
+        <form className="form-inline" method="get" onSubmit={this.handleSubmit}>
+          <fieldset className="form-group">
+            <input className="form-control" id="fragment" name="fragment" type="text" ref='fragment' />
+            <button className="btn" type="submit">Search</button>
+          </fieldset>
+        </form>
+        <small className='text-muted'>
+          Search genomic sequences by an arbitrary sub-string of any DNA sequence fragments (e.g., "TGGAATTGTGAGCGGATAACAATT" for <i>lac</i> operator reported by <a href="http://www.ncbi.nlm.nih.gov/pubmed/4587255" target="_blank">Gilbert W and Maxam A, 1973</a>)
+        </small>
+      </div>
+    );
+  }
+});
+
+var LocusTagListItem = React.createClass({
+  render() {
+    var url = "/gene/" + this.props.taxonomy + ":" +this.props.locus_tag;
+    return (
+      <li><a href={url} target="_blank">{this.props.locus_tag}</a></li>
+    );
+  }
+})
+
+var ProductListItem = React.createClass({
+  render() {
+    return (
+      <li>{this.props.product}</li>
+    );
+  }
+})
+
+var SequenceOntologyListItem = React.createClass({
+  render() {
+    var {name, uri} = this.props.ontology;
+    return (
+      <li><a href={uri} target="_blank">{name}</a></li>
+    );
+  }
+})
+
+var SequenceSearchResultRaw = React.createClass({
+  _highlightQuery(text, index) {
+    return text.slice(0, index) + "<mark>" + text.slice(index, -index) + "</mark>" + text.slice(-index);
+  },
+  render() {
+    var {name, taxonomy, position, position_end, snippet, metadescription_size} = this.props.gene;
+    var locusTagList = this.props.gene.locus_tags.map(function(locus_tag, index) {
+      return (
+        <LocusTagListItem taxonomy={taxonomy} locus_tag={locus_tag} key={index} />
+      );
+    });
+    var productList = this.props.gene.products.map(function(product, index) {
+      return (
+        <ProductListItem product={product} key={index} />
+      );
+    });
+    var sequenceOntologyList = this.props.gene.sequence_ontologies.map(function(ontology, index) {
+      return (
+        <SequenceOntologyListItem ontology={ontology} key={index} />
+      );
+    });
+
+    return (
+      <tr>
+        <td>{name}</td>
+        <td><ul>{locusTagList}</ul></td>
+        <td><ul>{productList}</ul></td>
+        <td><ul>{sequenceOntologyList}</ul></td>
+        <td>{position}</td>
+        <td>{position_end}</td>
+        <td><span dangerouslySetInnerHTML={{__html: this._highlightQuery(snippet, metadescription_size)}} /></td>
+      </tr>
+    );
+  }
+})
+
+var SequenceSearchResultTable = React.createClass({
+  render() {
+    var sequenceSearchResultRaws = this.props.data.map(function(gene, index) {
+      return (
+        <SequenceSearchResultRaw gene={gene} key={index} />
+      );
+    });
+    return (
+      <table className='table table-striped table-bordered table-hover'>
+        <thead className='thead-inverse'>
+          <tr>
+            <th>Sequence name</th>
+            <th>Locus tag</th>
+            <th>Product</th>
+            <th>Sequence ontology</th>
+            <th>Position begin</th>
+            <th>Position end</th>
+            <th>Sequence</th>
+          </tr>
+        </thead>
+        <tbody>
+          {sequenceSearchResultRaws}
+        </tbody>
+      </table>
+    );
+  }
+});
+
+var SequencePage = React.createClass({
+  handleSearchSubmit(fragment) {
+    $.get(
+      '/api/sequence/search.json',
+      fragment
+    ).done(
+      function(genes) {
+        this.setState({data: genes});
+      }.bind(this)
+    )
+  },
+  getInitialState() {
+    return {data: []};
+  },
+  render() {
+    var sequenceSearchResult = (this.state.data.length === 0) ? "" : <SequenceSearchResultTable data={this.state.data} />;
+    return (
+      <div>
+        <SequenceSearchForm onSearchSubmit={this.handleSearchSubmit} />
+        {sequenceSearchResult}
+      </div>
+    );
+  }
+});

app/assets/stylesheets/application.css.scss

@@ -0,0 +1 @@
+@import 'bootstrap';

app/controllers/api/application_controller.rb

@@ -0,0 +1,2 @@
+class Api::ApplicationController < ActionController::Base
+end

app/controllers/api/sequence_controller.rb

@@ -0,0 +1,7 @@
+class Api::SequenceController < Api::ApplicationController
+  def search(fragment)
+    sequences = SequenceSearch::Sequence.search(fragment)
+
+    render json: sequences
+  end
+end

app/controllers/root_controller.rb

@@ -0,0 +1,4 @@
+class RootController < ApplicationController
+  def show
+  end
+end