Test: Difference between revisions

From referenceTSS
Jump to: navigation, search
mNo edit summary
No edit summary
Line 1: Line 1:
{{DISPLAYTITLE:Id Search}}
    <div class="">
{{Special:IframePage/IdSearch}}
      <section class="py-5">
        <div class="container col-lg-8">
          <nav>
            <div class="nav nav-tabs" id="nav-tab" role="tablist">
              <button
                class="nav-link active"
                id="nav-human-tab"
                data-bs-toggle="tab"
                data-bs-target="#nav-human"
                type="button"
                role="tab"
                aria-controls="nav-human"
                aria-selected="true"
              >
                Human
              </button>
              <button
                class="nav-link"
                id="nav-mouse-tab"
                data-bs-toggle="tab"
                data-bs-target="#nav-mouse"
                type="button"
                role="tab"
                aria-controls="nav-mouse"
                aria-selected="false"
              >
                Mouse
              </button>
            </div>
          </nav>
          <div class="tab-content" id="nav-tabContent">
            <div
              class="tab-pane fade show active"
              id="nav-human"
              role="tabpanel"
              aria-labelledby="nav-human-tab"
              tabindex="0"
            >
              <div class="p-3 p-md-5 bg-light rounded">
                <div class="row align-items-start">
                  <div class="col-12 col-lg-2 mb-3 mb-lg-0">
                    <img
                      class="img-fluid"
                      src="landing-page/images/icon-human.svg"
                      alt=""
                      width="80px"
                    />
                  </div>
                  <div class="col-12 col-lg-8 mb-3 mb-lg-0">
                    <div>
                      <h3 class="fw-bold mb-3">Human</h3>
                      <div
                        class="nav nav-pills mb-3 btn-group"
                        id="pills-tab"
                        role="tablist"
                      >
                        <button
                          class="btn border border-primary nav-link active btn-sm"
                          id="pills-htss-tab"
                          data-bs-toggle="pill"
                          data-bs-target="#pills-htss"
                          type="button"
                          role="tab"
                          aria-controls="pills-htss"
                          aria-selected="true"
                        >
                          TSSs
                        </button>
 
                        <button
                          class="btn border border-primary nav-link btn-sm"
                          id="pills-hgene-tab"
                          data-bs-toggle="pill"
                          data-bs-target="#pills-hgene"
                          type="button"
                          role="tab"
                          aria-controls="pills-hgene"
                          aria-selected="false"
                        >
                          Gene
                        </button>
                      </div>
                      <div class="tab-content">
                        <div
                          class="tab-pane active"
                          id="pills-htss"
                          role="tabpanel"
                          aria-labelledby="pills-htss-tab"
                        >
                          <!-- Form TSSs -->
 
                          <form
                            id="hTsspfForm"
                            class="search-form"
                            name="createbox"
                            action="http://10.64.128.90/reftss/Special:RunQuery/TSSQueryFormHuman"
                            method="get"
                          >
                            <fieldset class="form-group">
                              <div class="d-flex row g-3">
                                <input
                                  type="hidden"
                                  value="Special:RunQuery/TSSQueryFormHuman"
                                  name="title"
                                />
                                <input
                                  type="hidden"
                                  value="TSSQueryFormHuman"
                                  name="pfRunQueryFormName"
                                />
                                <input
                                  type="hidden"
                                  value=""
                                  name="pf_free_text"
                                />
 
                                <div class="mb-3 col-md-12">
                                  <label for="hTssTSS" class="form-label"
                                    >TSS ID</label
                                  >
                                  <input
                                    class="form-control me-2"
                                    id="hTssTSS"
                                    name="TSS List Human[tss_id]"
                                  />
                                </div>
 
                                <div class="mb-3 col-md-6">
                                  <label for="hTssGene" class="form-label"
                                    >Gene Symbol</label
                                  >
                                  <input
                                    class="form-control me-2"
                                    id="hTssGene"
                                    name="TSS List Human[gene_symbol]"
                                  />
                                </div>
 
                                <div class="mb-3 col-md-6">
                                  <label for="hTssGeneName" class="form-label"
                                    >Gene Name</label
                                  >
                                  <input
                                    class="form-control me-2"
                                    id="hTssGeneName"
                                    name="TSS List Human[gene_name]"
                                  />
                                </div>
 
                                <div class="mb-3 col-12">
                                  <button
                                    class="search-button btn btn-primary"
                                    type="submit"
                                    title="Search"
                                    name="wpRunQuery"
                                    value=""
                                  >
                                    Search
                                  </button>
                                </div>
                              </div>
                            </fieldset>
                          </form>
                        </div>
                        <div
                          class="tab-pane"
                          id="pills-hgene"
                          role="tabpanel"
                          aria-labelledby="pills-hgene-tab"
                        >
                          <!-- Form Gene -->
 
                          <form
                            id="hGeneForm"
                            class="search-form"
                            name="createbox"
                            action="http://10.64.128.90/reftss/Special:RunQuery/EntrezGeneQueryFormHuman"
                            method="get"
                          >
                            <fieldset class="form-group">
                              <div class="d-flex row g-3">
                                <input
                                  type="hidden"
                                  value="Special:RunQuery/EntrezGeneQueryFormHuman"
                                  name="title"
                                />
                                <input
                                  type="hidden"
                                  value="EntrezGeneQueryFormHuman"
                                  name="pfRunQueryFormName"
                                />
                                <input
                                  type="hidden"
                                  value=""
                                  name="pf_free_text"
                                />
 
                                <div class="mb-3 col-md-6">
                                  <label for="hGeneGene" class="form-label"
                                    >Gene ID</label
                                  >
                                  <input
                                    class="form-control me-2"
                                    id="hGeneGene"
                                    name="EntrezGene List Human[gene_id]"
                                  />
                                </div>
 
                                <div class="mb-3 col-md-6">
                                  <label for="hGeneGeneName" class="form-label"
                                    >Gene Symbol</label
                                  >
                                  <input
                                    class="form-control me-2"
                                    id="hGeneGeneName"
                                    name="EntrezGene List Human[gene_symbol]"
                                  />
                                </div>
 
                                <div class="mb-3 col-12">
                                  <button
                                    class="search-button btn btn-primary"
                                    type="submit"
                                    title="Search"
                                    name="wpRunQuery"
                                    value=""
                                  >
                                    Search
                                  </button>
                                </div>
                              </div>
                            </fieldset>
                          </form>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div
              class="tab-pane fade show"
              id="nav-mouse"
              role="tabpanel"
              aria-labelledby="nav-mouse-tab"
              tabindex="0"
            >
              <div class="p-3 p-md-5 bg-light rounded">
                <div class="row align-items-start">
                  <div class="col-12 col-lg-2 mb-3 mb-lg-0">
                    <img
                      class="img-fluid"
                      src="landing-page/images/icon-mouse.svg"
                      alt=""
                      width="100px"
                    />
                  </div>
                  <div class="col-12 col-lg-8 mb-3 mb-lg-0">
                    <div>
                      <h3 class="fw-bold mb-3">Mouse</h3>
                      <div
                        class="nav nav-pills mb-3 btn-group"
                        id="pills-tab"
                        role="tablist"
                      >
                        <button
                          class="btn border border-primary nav-link active btn-sm"
                          id="pills-mtss-tab"
                          data-bs-toggle="pill"
                          data-bs-target="#pills-mtss"
                          type="button"
                          role="tab"
                          aria-controls="pills-mtss"
                          aria-selected="true"
                        >
                          TSSs
                        </button>
 
                        <button
                          class="btn border border-primary nav-link btn-sm"
                          id="pills-mgene-tab"
                          data-bs-toggle="pill"
                          data-bs-target="#pills-mgene"
                          type="button"
                          role="tab"
                          aria-controls="pills-mgene"
                          aria-selected="false"
                        >
                          Gene
                        </button>
                      </div>
                      <div class="tab-content">
                        <div
                          class="tab-pane active"
                          id="pills-mtss"
                          role="tabpanel"
                          aria-labelledby="pills-mtss-tab"
                        >
                          <!-- Form TSSs -->
 
                          <form
                            id="mTsspfForm"
                            name="createbox"
                            class="search-form"
                            action="http://10.64.128.90/reftss/Special:RunQuery/TSSQueryFormMouse"
                            method="get"
                          >
                            <fieldset class="form-group">
                              <div class="d-flex row g-3">
                                <input
                                  type="hidden"
                                  value="Special:RunQuery/TSSQueryFormMouse"
                                  name="title"
                                />
                                <input
                                  type="hidden"
                                  value="TSSQueryFormMouse"
                                  name="pfRunQueryFormName"
                                />
 
                                <input
                                  type="hidden"
                                  value=""
                                  name="pf_free_text"
                                />
 
                                <div class="mb-3 col-md-12">
                                  <label for="mTssTSS" class="form-label"
                                    >TSS ID</label
                                  >
                                  <input
                                    class="form-control me-2"
                                    id="mTssTSS"
                                    name="TSS List Mouse[tss_id]"
                                  />
                                </div>
 
                                <div class="mb-3 col-md-6">
                                  <label for="mTssGene" class="form-label"
                                    >Gene Symbol</label
                                  >
                                  <input
                                    class="form-control me-2"
                                    id="mTssGene"
                                    name="TSS List Mouse[gene_symbol]"
                                  />
                                </div>
 
                                <div class="mb-3 col-md-6">
                                  <label for="mTssGeneName" class="form-label"
                                    >Gene Name</label
                                  >
                                  <input
                                    class="form-control me-2"
                                    id="mTssGeneName"
                                    name="TSS List Mouse[gene_name]"
                                  />
                                </div>
 
                                <div class="mb-3 col-12">
                                  <button
                                    class="search-button btn btn-primary"
                                    type="submit"
                                    title="Search"
                                    name="wpRunQuery"
                                    value=""
                                  >
                                    Search
                                  </button>
                                </div>
                              </div>
                            </fieldset>
                          </form>
                        </div>
                        <div
                          class="tab-pane"
                          id="pills-mgene"
                          role="tabpanel"
                          aria-labelledby="pills-mgene-tab"
                        >
                          <!-- Form Gene -->
 
                          <form
                            id="mGeneForm"
                            class="search-form"
                            name="createbox"
                            action="http://10.64.128.90/reftss/Special:RunQuery/EntrezGeneQueryFormMouse"
                            method="get"
                          >
                            <fieldset class="form-group">
                              <div class="d-flex row g-3">
                                <input
                                  type="hidden"
                                  value="Special:RunQuery/EntrezGeneQueryFormMouse"
                                  name="title"
                                />
                                <input
                                  type="hidden"
                                  value="EntrezGeneQueryFormMouse"
                                  name="pfRunQueryFormName"
                                />
                                <input
                                  type="hidden"
                                  value=""
                                  name="pf_free_text"
                                />
 
                                <div class="mb-3 col-md-6">
                                  <label for="mGeneGene" class="form-label"
                                    >Gene ID</label
                                  >
                                  <input
                                    class="form-control me-2"
                                    id="mGeneGene"
                                    name="EntrezGene List Mouse[gene_id]"
                                  />
                                </div>
 
                                <div class="mb-3 col-md-6">
                                  <label for="mGeneGeneName" class="form-label"
                                    >Gene Symbol</label
                                  >
                                  <input
                                    class="form-control me-2"
                                    id="mGeneGeneName"
                                    name="EntrezGene List Mouse[gene_symbol]"
                                  />
                                </div>
 
                                <div class="mb-3 col-12">
                                  <button
                                    class="search-button btn btn-primary"
                                    type="submit"
                                    title="Search"
                                    name="wpRunQuery"
                                    value=""
                                  >
                                    Search
                                  </button>
                                </div>
                              </div>
                            </fieldset>
                          </form>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
 
      <section class="py-3">
        <div class="container">
          <div class="row">
            <div class="col-12 col-md-6 col-lg-4 mb-5">
              <div class="d-flex">
                <div>
                  <h4>About refTSS</h4>
                  <p class="text-muted">
                    The refTSS is an annotated reference dataset for
                    transcriptional start sites (TSS) in human and mouse. The
                    dataset is generated by collecting, reprocessing and
                    assembling various public resources.
                  </p>
                </div>
              </div>
            </div>
            <div class="col-12 col-md-6 col-lg-4 mb-5">
              <div class="d-flex">
                <div>
                  <h4 contenteditable="false">Data files</h4>
                  <p class="text-muted">
                    The raw refTSS data files are available at
                    <a
                      target="_blank"
                      rel="nofollow noreferrer noopener"
                      class="external text"
                      href="http://10.64.128.90/datafiles"
                      >the data download page</a
                    >.
                  </p>
                </div>
              </div>
            </div>
            <div class="col-12 col-md-6 col-lg-4 mb-5">
              <div class="d-flex">
                <div>
                  <h4>Track Hubs</h4>
                  <ul class="text-muted">
                    <li class="text-muted">
                      <a
                        target="_blank"
                        rel="nofollow noreferrer noopener"
                        class="external text"
                        href="http://genome.ucsc.edu/cgi-bin/hgHubConnect?hubSearchTerms=refTss"
                        >refTSS UCSC Genome Browser public track hub description
                        pages</a
                      >
                    </li>
                    <li class="text-muted">
                      <a
                        target="_blank"
                        rel="nofollow noreferrer noopener"
                        class="external text"
                        href="https://genome.ucsc.edu/cgi-bin/hgTracks?hubUrl=http://10.64.128.90/trackhub/hub.txt&amp;genome=hg38&amp;position=lastDbPos"
                        >Human refTSS track hub</a
                      >
                    </li>
                    <li class="text-muted">
                      <a
                        target="_blank"
                        rel="nofollow noreferrer noopener"
                        class="external text"
                        href="https://genome.ucsc.edu/cgi-bin/hgTracks?hubUrl=http://10.64.128.90/trackhub/hub.txt&amp;genome=mm10&amp;position=lastDbPos"
                        >Mouse refTSS track hub</a
                      >
                    </li>
                  </ul>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
 
      <section class="py-1">
        <div class="container">
          <div class="p-md-5 bg-light rounded p-3">
            <div class="row align-items-center">
              <div class="col-12 col-lg-12 mb-3 mb-lg-0">
                <div>
                  <h5 class="fw-bold text-muted">Cite refTSS as</h5>
                  <p class="small">
                    Abugessaisa, I., Noguchi S, Hasegawa A, Kondo A, Kawaji H,
                    Carninci P, Kasukawa T. (2019). "refTSS: A Reference Data
                    Set for Human and Mouse Transcription Start Sites." J Mol
                    Biol. DOI: 10.1016/j.jmb.2019.04.045.
                  </p>
                  <div class="d-flex flex-wrap">
                    <ul class="me-auto list-unstyled d-flex flex-wrap mt-1">
                      <li class="me-4">
                        <span><small>DOI: </small></span
                        ><a
                          class="link-primary"
                          target="_blank"
                          href="https://doi.org/10.1016/j.jmb.2019.04.045"
                        >
                          <span><small>10.1016/j.jmb.2019.04.045</small></span>
                        </a>
                      </li>
 
                      <li class="me-4">
                        <a
                          class="link-success"
                          target="_blank"
                          href="https://www.sciencedirect.com/science/article/pii/S0022283619302530/pdfft"
                        >
                          <span
                            ><img
                              class="inline-orcid"
                              style="border-width: 0"
                              width="16px"
                              height="16px"
                              src="landing-page/images/open-access.svg"
                            /><small>PDF</small></span
                          >
                        </a>
                      </li>
                      <li class="me-4">
                        <a
                          class="link-primary"
                          target="_blank"
                          href="https://pubmed.ncbi.nlm.nih.gov/31075273/"
                        >
                          <span><small>PubMed</small></span>
                        </a>
                      </li>
                      <li class="me-4">
                        <a class="link-primary" href="landing-page/citations.html">
                          <span><small>Citations</small></span>
                        </a>
                      </li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
 
      <section class="py-1">
        <div class="container">
          <div class="p-md-5 rounded p-3">
            <div class="row align-items-center">
              <div class="col-12 col-lg-12 mb-3 mb-lg-3">
                <div>
                  <h5 class="fw-bold text-muted">Papers citing refTSS</h5>
                  <div
                    id="citation-carousel"
                    class="mt-5 mb-3 carousel slide carousel-fad carousel-dark"
                    data-bs-ride="carousel"
                    data-bs-interval="5000"
                  >
                    <div id="citing-papers-slider" class="carousel-inner">
                      <div class="spinner-border" role="status">
                        <span class="visually-hidden">Loading...</span>
                      </div>
                    </div>
                    <button
                      class="carousel-control-prev"
                      type="button"
                      data-bs-target="#citation-carousel"
                      data-bs-slide="prev"
                    >
                      <span
                        class="carousel-control-prev-icon"
                        aria-hidden="true"
                      ></span>
                      <span class="visually-hidden">Previous</span>
                    </button>
                    <button
                      class="carousel-control-next"
                      type="button"
                      data-bs-target="#citation-carousel"
                      data-bs-slide="next"
                    >
                      <span
                        class="carousel-control-next-icon"
                        aria-hidden="true"
                      ></span>
                      <span class="visually-hidden">Next</span>
                    </button>
                  </div>
                  <div class="float-right">
                    <a
                      href="citations.html"
                      class="btn btn-outline-success btn-sm"
                      >View all citations</a
                    >
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
 
    </div>
    <script src="landing-page/js/bootstrap/bootstrap.bundle.min.js"></script>
    <script src="landing-page/js/nunjucks-slim.min.js"></script>
    <script src="landing-page/data/citation-slider.template.js"></script>
    <script type="text/javascript">
      // Function to show loading spinner on search buttons
      function showLoadingOnButtons(searchButton) {
        // Disable the seacrh button.
        searchButton.disabled = true;
        // Bootstrap spinner.
        const spinnerSpan = `<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>`;
        // Replace the search button with the spinner and Loading... text.
        searchButton.innerHTML = `${spinnerSpan} Loading...`;
      }
 
      // Function to reset the search button to the original state.
      function resetSearchButton(searchButton) {
        // Enable the search button.
        searchButton.disabled = false;
        // Replace the spinner with the search button text.
        searchButton.innerHTML = "Search";
      }
 
      // Reset the serch buttons and form-groups to their default state on page load, and brownser back button.
      window.onload = window.onpageshow = function () {
        document.querySelectorAll(".search-button").forEach((searchButton) => {
          resetSearchButton(searchButton);
        });
        document.querySelectorAll(".form-group").forEach((formGroup) => {
          formGroup
            .querySelectorAll("input, select, checkbox, textarea")
            .forEach((input) => {
              input.removeAttribute("readonly");
            });
        });
      };
 
      // Select all forms with the class "search-form" and attach a submit event listener to them.
      document.querySelectorAll(".search-form").forEach((form) => {
        form.addEventListener("submit", (event) => {
          // Disable serach button and show the loading spinner on it
          document
            .querySelectorAll(".search-button")
            .forEach((searchButton) => {
              showLoadingOnButtons(searchButton);
            });
          // Make all form inputs read-only, so that the user cannot modify the serach inputs.
          document.querySelectorAll(".form-group").forEach((formGroup) => {
            formGroup
              .querySelectorAll("input, select, checkbox, textarea")
              .forEach((input) => {
                input.setAttribute("readonly", true);
              });
          });
        });
      });
 
      // Alternative approach to the above, but this one is on button click events.
 
      // Selecting all serach buttons and attach a click event listener to them.
      /*  document.querySelectorAll(".search-button").forEach((submitButton) => {
        submitButton.addEventListener("click", showLoadingOnButtons);
      });  */
 
      function renderTemplate(template, data) {
        var renderedTemplate = nunjucks.render(template, data);
        document.getElementById("citing-papers-slider").innerHTML =
          renderedTemplate;
        var myCarousel = document.querySelector("#carouselSlidesOnly");
        var carousel = new bootstrap.Carousel(myCarousel, {
          interval: 5000,
          wrap: false,
        });
      }
      const requestAndRenderJson = async () => {
        const response = await fetch("landing-page/data/citations.json");
        const citationData = await response.json();
        renderTemplate("citation-slider.template.njk", citationData);
      };
      requestAndRenderJson();
    </script>

Revision as of 14:00, 28 March 2023

     


         <nav>

         </nav>

About refTSS

The refTSS is an annotated reference dataset for transcriptional start sites (TSS) in human and mouse. The dataset is generated by collecting, reprocessing and assembling various public resources.

Data files

The raw refTSS data files are available at <a target="_blank" rel="nofollow noreferrer noopener" class="external text" href="http://10.64.128.90/datafiles" >the data download page</a >.

Track Hubs
Cite refTSS as

Abugessaisa, I., Noguchi S, Hasegawa A, Kondo A, Kawaji H, Carninci P, Kasukawa T. (2019). "refTSS: A Reference Data Set for Human and Mouse Transcription Start Sites." J Mol Biol. DOI: 10.1016/j.jmb.2019.04.045.
Papers citing refTSS
                   <a
                     href="citations.html"
                     class="btn btn-outline-success btn-sm"
                     >View all citations</a
                   >

     

   <script src="landing-page/js/bootstrap/bootstrap.bundle.min.js"></script>
   <script src="landing-page/js/nunjucks-slim.min.js"></script>
   <script src="landing-page/data/citation-slider.template.js"></script>
   <script type="text/javascript">
     // Function to show loading spinner on search buttons
     function showLoadingOnButtons(searchButton) {
       // Disable the seacrh button.
       searchButton.disabled = true;
       // Bootstrap spinner.
       const spinnerSpan = ``;
       // Replace the search button with the spinner and Loading... text.
       searchButton.innerHTML = `${spinnerSpan} Loading...`;
     }

     // Function to reset the search button to the original state.
     function resetSearchButton(searchButton) {
       // Enable the search button.
       searchButton.disabled = false;
       // Replace the spinner with the search button text.
       searchButton.innerHTML = "Search";
     }

     // Reset the serch buttons and form-groups to their default state on page load, and brownser back button.
     window.onload = window.onpageshow = function () {
       document.querySelectorAll(".search-button").forEach((searchButton) => {
         resetSearchButton(searchButton);
       });
       document.querySelectorAll(".form-group").forEach((formGroup) => {
         formGroup
           .querySelectorAll("input, select, checkbox, textarea")
           .forEach((input) => {
             input.removeAttribute("readonly");
           });
       });
     };

     // Select all forms with the class "search-form" and attach a submit event listener to them.
     document.querySelectorAll(".search-form").forEach((form) => {
       form.addEventListener("submit", (event) => {
         // Disable serach button and show the loading spinner on it
         document
           .querySelectorAll(".search-button")
           .forEach((searchButton) => {
             showLoadingOnButtons(searchButton);
           });
         // Make all form inputs read-only, so that the user cannot modify the serach inputs.
         document.querySelectorAll(".form-group").forEach((formGroup) => {
           formGroup
             .querySelectorAll("input, select, checkbox, textarea")
             .forEach((input) => {
               input.setAttribute("readonly", true);
             });
         });
       });
     });

     // Alternative approach to the above, but this one is on button click events.

     // Selecting all serach buttons and attach a click event listener to them.
     /*  document.querySelectorAll(".search-button").forEach((submitButton) => {
       submitButton.addEventListener("click", showLoadingOnButtons);
     });  */

     function renderTemplate(template, data) {
       var renderedTemplate = nunjucks.render(template, data);
       document.getElementById("citing-papers-slider").innerHTML =
         renderedTemplate;
       var myCarousel = document.querySelector("#carouselSlidesOnly");
       var carousel = new bootstrap.Carousel(myCarousel, {
         interval: 5000,
         wrap: false,
       });
     }
     const requestAndRenderJson = async () => {
       const response = await fetch("landing-page/data/citations.json");
       const citationData = await response.json();
       renderTemplate("citation-slider.template.njk", citationData);
     };
     requestAndRenderJson();
   </script>
Retrieved from "https://reftss.riken.jp/reftss/index.php?title=Test&oldid=2328844"