diff options
author | prashantsinalkar | 2019-06-28 21:44:43 +0530 |
---|---|---|
committer | prashantsinalkar | 2019-06-28 21:44:43 +0530 |
commit | 1473227a75101f5b76d6b522da5737df2f5eb058 (patch) | |
tree | dab59c0b7970a0b059d4eeb84aafd54e14ed47e9 /static/website/templates/index.html | |
parent | 459d1aec769f62570af51a3a53ebe0bce4a6754c (diff) | |
download | R_on_Cloud_Web_Interface-1473227a75101f5b76d6b522da5737df2f5eb058.tar.gz R_on_Cloud_Web_Interface-1473227a75101f5b76d6b522da5737df2f5eb058.tar.bz2 R_on_Cloud_Web_Interface-1473227a75101f5b76d6b522da5737df2f5eb058.zip |
added basic interface for development
Diffstat (limited to 'static/website/templates/index.html')
-rw-r--r-- | static/website/templates/index.html | 594 |
1 files changed, 594 insertions, 0 deletions
diff --git a/static/website/templates/index.html b/static/website/templates/index.html new file mode 100644 index 0000000..6653442 --- /dev/null +++ b/static/website/templates/index.html @@ -0,0 +1,594 @@ +{% load static %} +<!DOCTYPE html> +<html lang="en"> + +<head> + <title>Beta R on cloud</title> + <meta charset="utf-8"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> + <link rel="stylesheet" href="{% static 'website/bootstrap-4.1.0/css/bootstrap.min.css' %}"> + <link rel="stylesheet" href="{% static 'website/bootstrap-css/custom.css' %}"> + <link href="{% static 'website/css/codemirror.css' %}" rel="stylesheet" /> + <link href="{% static 'website/css/fullscreen.css'%}" rel="stylesheet" /> + <link href="{% static 'website/css/monokai.css' %}" rel="stylesheet" /> + <link rel="shortcut icon" type="image/png" href="{% static 'website/images/favicon.ico' %}" /> + <meta name="title" content="R computational resource, R high performance computing on demand"> + <meta name="description" content="R on Cloud facilitates execution of the codes for particular example(s) online. The results can then be verified with the solved example(s) from the textbook. It is also possible to change the values of the variables and in fact, the code itself, and execute it. In addition to the given examples, one can also copy and paste (or) write a new code in the input box provided and execute the same."> + <meta name="keywords" content="R on cloud,R online execute,R online compiler,R computation,calcul scientifique,numerical computation,R computing online,R calculator"> + <script> + if('{{ err_msg }}'){ + alert('{{ err_msg }}'); + } + </script> +</head> + +<body> + <nav class="navbar navbar-expand-md bg-dark navbar-dark"> + <img class="navbar-brand" src="{% static 'website/images/home-logo.png' %}" alt="logo" style="height:40px;width:30px"> + <a class="navbar-brand" href="#">R on cloud <sup><i>Beta</i></sup></a> + <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar"> + <span class="navbar-toggler-icon"></span> + </button> + <div class="collapse navbar-collapse" id="collapsibleNavbar"> + <ul class="navbar-nav ml-auto"> + {% if user and not user.is_anonymous %} {% if not user.is_staff %} + <!--> <li class="nav-item"> + <a class="nav-link" href="" id="search_book" data-toggle="modal" data-target="#search_wrapper">Search Book</a> + </li> --> + <li class="nav-item"> + <a class="nav-link" href="" id="about-us" data-toggle="modal" data-target="#about_wrapper">About</a> + </li> + <li class="nav-item"> + <a class="nav-link" href="" id="invitation" data-toggle="modal" data-target="#invitation_wrapper">Invitation</a> + </li> + <li class="nav-item"> + <a class="nav-link" href="" id="contact" data-toggle="modal" data-target="#contact_wrapper">Contact Us</a> + </li> + {% else %} + <li class="nav-item"> + <a class="nav-link" href="/review" id="contact" data-toggle="modal" data-target="#review-interface">Review Interface</a> + </li> + {% endif %} + <li class="nav-item"> + <a data-key="logout" href="/logout">Log out</a> + </li> + <li class="nav-item"> + <a style="color:red">Hello, {{ user.get_full_name }}!</a> + </li> + {% else %} + <!-- > <li class="nav-item"> + <a class="nav-link" href="" id="search_book" data-toggle="modal" data-target="#search_wrapper">Search Book</a> + </li> --> + <li class="nav-item"> + <a class="nav-link" href="" id="about-us" data-toggle="modal" data-target="#about_wrapper">About</a> + </li> + <li class="nav-item"> + <a class="nav-link" href="" id="invitation" data-toggle="modal" data-target="#invitation_wrapper">Invitation</a> + </li> + <li class="nav-item"> + <a class="nav-link" href="" id="contact" data-toggle="modal" data-target="#contact_wrapper">Contact Us</a> + </li> + {% endif %} + <li class="nav-item"> + <a href="https://r.fossee.in" target="_blank"> + <img class="navbar-brand" src="{% static 'website/images/r-logo.png' %}" alt="logo" style="width:100px"> + </a> + </li> + </ul> + </div> + </nav> + <br> + <div class="container small"> + <!-- <form class="col-12"> + <div id="main-category-wrapper" class="form-row form-group"> + <label class="col-sm-2 col-form-label font-weight-bold">Main Category :</label> + <select id="main_categories" class="form-control-sm col-sm-10"> + <option value="0">Select Main Category</option> + {% for category in catg %} {% if maincat_id == category.category_id %} + <option value="{{ category.category_id }}" selected>{{ forloop.counter }} - {{ category.maincategory }}</option> + {% else %} + <option value="{{ category.category_id }}">{{ forloop.counter }} - {{ category.maincategory }}</option> + {% endif %} {% endfor %} + </select> + </div> + + <div id="category-wrapper" class="form-row form-group"> + <label for="disabledInput" class="col-sm-2 col-form-label font-weight-bold">Sub Category :</label> + <select id="categories" class="form-control-sm col-sm-8"> + <option value="0">Select Subcategory</option> + {% for category in subcatg %} {% if subcategory_id == category.subcategory_id %} + <option value="{{ category.subcategory_id }}" selected>{{ forloop.counter }} - {{ category.subcategory }}</option> + {% else %} + <option value="{{ category.subcategory_id }}">{{ forloop.counter }} - {{ category.subcategory }}</option> + {% endif %} {% endfor %} + </select> + <a href="#" class="extra-link col-sm-2" id="contributor">+Contributor</a> + </div> + <div id="books-wrapper" class="form-row form-group"> + <label for="disabledInput" class="col-sm-2 col-form-label font-weight-bold">Book :</label> + <select id="books" class="form-control-sm col-sm-8"> + <option value="0">Select Book </option> + {% for book in books %} {% if book_id == book.id %} + <option value="{{ book.id }}" selected>{{ forloop.counter }} - {{ book.book }} (by {{ book.author }})</option> + {% else %} + <option value="{{ book.id }}">{{ forloop.counter }} - {{ book.book }} (by {{ book.author }})</option> + {% endif %} {% endfor %} + </select> + <a href="#" class="extra-link col-sm-2" id="download-book">Download Book</a> + </div> + <div id="chapters-wrapper" class="form-row form-group"> + <label for="disabledInput" class="col-sm-2 col-form-label font-weight-bold">Chapter :</label> + <select id="chapters" class="form-control-sm col-sm-8"> + <option value="0">Select Chapter</option> + {% for chapter in chapters %} {% if chapter_id == chapter.id %} + <option value="{{ chapter.id }}" selected>{{ chapter.number }} - {{ chapter.name }}</option> + {% else %} + <option value="{{ chapter.id }}">{{ chapter.number }} - {{ chapter.name }}</option> + {% endif %} {% endfor %} + </select> + <a href="#" class="extra-link col-sm-2" id="download-chapter">Download Chapter</a> + </div> + <div id="examples-wrapper" class="form-row form-group"> + + <label for="disabledInput" class="col-sm-2 col-form-label font-weight-bold">Example :</label> + <select id="examples" class="form-control-sm col-sm-8"> + <option value="0">Select Example</option> + {% for example in examples %} {% if eid == example.id %} + <option value="{{ example.id }}" selected>{{ example.number }} - {{ example.caption }}</option> + {% else %} + <option value="{{ example.id }}">{{ example.number }} - {{ example.caption }}</option> + {% endif %} {% endfor %} + </select> + <a href="#" class="extra-link col-sm-2" id="download-example">Download Example</a> + </div> + <div id="revisions-wrapper" class="form-row form-group"> + <label for="disabledInput" class="col-sm-2 col-form-label font-weight-bold">Revision: </label> + <select id="revisions" class="form-control-sm col-sm-3"> + <option value="">Select a revision</option> + {% for key, value in revisions %} {% if value == commit_sha %} + <option value="{{ value }}" selected>{{ forloop.counter }} - {{key }}</option> + {% else %} + <option value="{{ revision.value }}"> + {{ forloop.counter }} - {{ key }} + </option> + {% endif %} {% endfor %} + </select> + <label for="disabledInput" class="col-sm-1 col-form-label font-weight-bold">Diff with: </label> + <select id="revisions-diff" class="form-control-sm col-sm-3"> + <option value="">Select a revision</option> + {% for key, value in revisions %} + <option value="{{ revision.valuea }}"> + {{ forloop.counter }} - {{ key }} + </option> + {% endfor %} + </select> + </div> + </form> + --> + <!-- -------------------------------------------------------------------------------------- --> + </div> + <!---------- container----------------- --> + <div class="container-fluid text-dark" style="background: #eeeeee;"> + <div class="row"> + <div class="col-sm-6"> + <div class="form-group"> + <div class="row"> + <div class="col-4"> + <label for="code">R code:</label> + </div> + <div class="col-2 float-left"> + {% if ex_views_count == NULL %} + <i class="views-count fa fa-eye" id="example_views_count" aria-hidden="true"> + </i> {% else %} + <i class="views-count fa fa-eye" id="example_views_count" aria-hidden="true"> + {{ ex_views_count }} + </i> {% endif %} + </div> + <div class="col-2"></div> + <div class="col-2 text-primary"> + <span id="review-link"> + {% if review %} + <a href="{{ review_url}}" id="review" target="_blank">{{ review }} Review + </a> + {% else %} + <a href="#" id="review" target="_blank"></a> + {% endif %} + </span> + </div> + <div class="col-1"> + <div class="float-right"> + <a href="#" id="toggle-code"> + <img src="{% static 'website/images/icon-toggle.png'%}"> + </a> + </div> + </div> + <div class="col-1"> + <div class="float-right"> + <a href="#" id="fullscreen-code"> + <img src="{% static 'website/images/icon-fullscreen.png'%}"> + </a> + </div> + </div> + </div> + <textarea id="code" class="form-control" rows="5" placeholder="Write a new code or select existing from above category..." wrap="hard">{{ code }}</textarea> + <br> + <a id="execute" class="btn btn-dark text-white"><span id="execute-inner">Execute</span></a> + + </div> + </div> + <div class="col-sm-6"> + <div class="form-group"> + <div class="row"> + <div class="col-10"> + <label for="result">Result:</label> + </div> + <div class="col-1"> + <div class="float-right"> + <a href="#" id="toggle-result"> + <img src="{% static 'website/images/icon-toggle.png'%}"> + </a> + </div> + </div> + <div class="col-1"> + <div class="float-right"> + <a href="#" id="fullscreen-result"> + <img src="{% static 'website/images/icon-fullscreen.png'%}"> + </a> + </div> + </div> + </div> + <textarea id="result" class="form-control" rows="5"></textarea> + <br> + <a id="bug" href="" class="btn btn-dark text-white float-right" data-toggle="modal" data-target="#bug_form_wrapper">Report bug / Give Feedback</a> + </div> + </div> + </div> + </div> + <!-- -------------------------------- --> + <!---------- container----------------- --> + <div class="container-fluid bg-dark text-light"> + <br> + <div class="row"> + + <div class="col-4"> + <a href="https://fossee.in" target="_blank"><img class="bg-white img-responsive" src="{% static 'website/images/fossee-logo.png' %}" alt="logo" style="width:100px;height: 45px;"></a> + </div> + {% if garuda_server == 1 %} + <div class="col-4"> + <a href="http://garudaindia.in" target="_blank"><img class="bg-white img-responsive mx-auto d-block" src="{% static 'website/images/garuda_logo.png' %}" alt="logo" style="width:100px;height: 45px;"></a> + </div> + {% else %} + <div class="col-4"> + <center> + <a rel="funded_by" href="http://www.sakshat.ac.in/" target="_blank"><img alt="NMEICT" style="border-width:0;width:30%;background:#ffffff;" src="{% static 'website/images/NMEICT.png' %}" /></span></a> + </center> + </div> + {% endif %} + <div class="col-4"> + <a href="https://iitb.ac.in" target="_blank" class="float-right"><img class="bg-white img-responsive" src="{% static 'website/images/iitb-logo.png' %}" alt="logo" style="width:50px;height: 45px;"></a> + </div> + + </div> + <div class="row small"> + <div class="col"> + <p class="text-center">TBD</p> + </div> + </div> + <div class="row"> + <div class="col-2"> + <p class="float-left"><a href="#" id="disclaimer" data-toggle="modal" data-target="#disclaimer-text">Disclaimer</a></p> + </div> + <div class="col-8"> + <center><p> + <a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/" target="_blank"><img alt="Creative Commons License" style="border-width:0" src="{% static 'website/images/88x31.png' %}" /></a> + <br />This work is licensed under a <a id="cc" rel="license" class="text-white bg-dark" href="http://creativecommons.org/licenses/by-sa/4.0/" target="_blank">Creative Commons Attribution-ShareAlike 4.0 International License</a>.</p></center> + </div> + <div class="col-2"> + <a href="https://stats-a.fossee.in/cgi-bin/awstats.pl?config=r.fossee.in" class="float-right" target="_blank">View Stats <i class="fa fa-bar-chart text-danger"></i></a> + </div> + </div> + </div> + <!-- -------------------------------- --> + <!-- disclaimer modal --> + <div class="modal" id="disclaimer-text"> + <div class="modal-dialog"> + <div class="modal-content"> + + <!-- Modal Header --> + <div class="modal-header"> + <h4 class="modal-title text-primary">Disclaimer</h4> + <button type="button" class="close" data-dismiss="modal">×</button> + </div> + + <!-- Modal body --> + <div class="modal-body"> + <p class="text-justify">Every effort is made to make all the codes to run smoothly. However, R Cloud takes no responsibility for, and will not be liable for, the website being temporarily unavailable due to technical issues and code not producing accurate outputs due to any toolboxes. + </p> + </div> + + <!-- Modal footer --> + <div class="modal-footer"> + <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button> + </div> + + </div> + </div> + </div> + <!-- -------------disclaimer modal end------------------- --> + <!-- about us --> + <div class="modal" id="about_wrapper"> + <div class="modal-dialog"> + <div class="modal-content"> + + <!-- Modal Header --> + <div class="modal-header"> + <h4 class="modal-title text-primary">About R on GARUDA Cloud.</h4> + <button type="button" class="close" data-dismiss="modal">×</button> + </div> + + <!-- Modal body --> + <div class="modal-body"> + <p class="text-justify"> + R on Cloud facilitates execution of the codes for particular example(s) online. The results can then be verified with the solved example(s) from the textbook. It is also possible to change the values of the variables and in fact, the code itself, and execute it. In addition to the given examples, one can also copy and paste (or) write a new code in the input box provided and execute the same. <a href="http://r.fossee.in" target="_blank">Read more..</a> + </p> + </div> + + <!-- Modal footer --> + <div class="modal-footer"> + <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button> + </div> + + </div> + </div> + </div> + <!-- --------------------about us modal ends------------------ --> + <!-- contributor --> + <div class="modal" id="contributor_wrapper"> + <div class="modal-dialog"> + <div class="modal-content"> + + <!-- Modal Header --> + <div class="modal-header"> + <h6 class="modal-title text-primary"><u>Contributor details</u></h6> + <button type="button" class="close" data-dismiss="modal">×</button> + </div> + + <!-- Modal body --> + <div class="modal-body"> + <table class="table table-striped"> + <tbody> + <tr> + <td>Contributor name</td> + <td><span id="full_name"></span></td> + </tr> + <tr> + <td>Mentor</td> + <td><span id="faculty"></span></td> + </tr> + <tr> + <td>Book Reviewer</td> + <td><span id="reviewer"></span></td> + </tr> + <tr> + <td>College</td> + <td><span id="university"></span></td> + </tr> + <tr> + <td>Funded By</td> + <td><span id="funded_by"><a rel="funded_by" href="http://www.sakshat.ac.in/"><img alt="NMEICT" style="border-width:0;width:50%;" src="{% static 'website/images/NMEICT.png' %}" /></span></a> + </td> + </tr> + <tr> + <td>License</td> + <td><span id="license"><a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/"><img alt="Creative Commons License" style="border-width:0" src="{% static 'website/images/88x31.png' %}" /></a><br />This work is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/">Creative Commons Attribution-ShareAlike 4.0 International License</a>.</span></td> + </tr> + </tbody> + </table> + </div> + + <!-- Modal footer --> + <div class="modal-footer"> + <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button> + </div> + + </div> + </div> + </div> + <!-- --------------------contributor modal ends------------------ --> + + <!-- invitation --> + <div class="modal" id="invitation_wrapper"> + <div class="modal-dialog"> + <div class="modal-content"> + + <!-- Modal Header --> + <div class="modal-header"> + <h5 class="modal-title text-primary">Contribute to R Textbook Companion Project.</h5> + <button type="button" class="close" data-dismiss="modal">×</button> + </div> + + <!-- Modal body --> + <div class="modal-body"> + <p class="text-justify"> + The FOSSEE team has created a submission portal that allows the code for each example to be uploaded individually. The Textbook Companion Project aims to port solved examples from standard textbooks using an open source software system, such as R. + <a href="http://R.in/Textbook_Companion_Project" target="_blank">Read more..</a> + </p> + </div> + + <!-- Modal footer --> + <div class="modal-footer"> + <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button> + </div> + + </div> + </div> + </div> + <!-- --------------------contact us modal ends------------------ --> + <!-- invitation --> + <div class="modal" id="contact_wrapper"> + <div class="modal-dialog"> + <div class="modal-content"> + + <!-- Modal Header --> + <div class="modal-header"> + <h5 class="modal-title text-primary">Send us your valuable suggestions and feedback that shall enable us to enhance our work.</h5> + <button type="button" class="close" data-dismiss="modal">×</button> + </div> + + <!-- Modal body --> + <div class="modal-body"> + <p class="text-justify"> + If you wish to contribute to our activities such as <b>Lab Migration, Textbook + Companion,</b> please write to + <a href="mailto: contact-r@fossee.in">contact-r[at]fossee[dot]in</a> for feedback on Lab Migration (or) Textbook Companion. + </p> + </div> + + <!-- Modal footer --> + <div class="modal-footer"> + <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button> + </div> + + </div> + </div> + </div> + <!-- --------------------invitation modal ends------------------ --> + <!-- Search Modal --> + + <div class="modal" id="search_wrapper"> + <div class="modal-dialog"> + <div class="modal-content"> + + <!-- Modal Header --> + <div class="modal-header"> + <h4 class="modal-title">Search book</h4> + <button type="button" class="close" data-dismiss="modal">×</button> + </div> + + <!-- Modal body --> + <div class="modal-body"> + <div class="input-group"> + <input id="search-input" type="text" class="form-control" placeholder="Enter book or author name"> + <span class="input-group-btn"> + <button id="search" class="btn btn-info" type="button">Search</button> + </span> + </div> + </div> + <div class="container"> + <div class="row"> + <div id="relevant" class="col-4 small"> + </div> + <div id="popular" class="col-4 small bg-light text-primary" style="word-wrap: break-word;overflow:auto;"> + </div> + <div id="recent" class="col-4 small bg-light text-primary" style="word-wrap: break-word;overflow:auto;"> + </div> + </div> + </div> + <!-- Modal footer --> + <div class="modal-footer"> + <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button> + </div> + + </div> + </div> + </div> + <!-- ---------- search modal end ----------------- --> + <div class="modal" id="bug_form_wrapper"> + {% include "bug-form.html" %} + </div> + <!-- -plotbox wrapper ---------------------------------- --> + <div class="modal" id="plotbox_wrapper"> + <div class="modal-dialog"> + <div class="modal-content" style="width: auto;"> + + <!-- Modal Header --> + <div class="modal-header"> + <h5 class="modal-title text-primary"></h5> + <button type="button" class="close" data-dismiss="modal">×</button> + </div> + + <!-- Modal body --> + <div id="plotbox" class="modal-body"> + + </div> + + <!-- Modal footer --> + <div class="modal-footer"> + <a href="" class="btn btn-info float-left" role="button" id="plot_download">Download</a> + <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button> + </div> + + </div> + </div> + </div> + <!-- -- plotbox wrapper ends---------------------------------- --> + <!-- diff modal --> + <div class="modal" id="diff_wrapper"> + <div class="modal-dialog"> + <div class="modal-content"> + + <!-- Modal Header --> + <div class="modal-header"> + <h4 class="modal-title"> Diff between [1] + <strong> + <span id="diff-first"> + </span> + </strong> + and [2] + <strong> + <span id="diff-second"> + </span> + </strong> + </h4> + <button type="button" class="close" data-dismiss="modal">×</button> + </div> + + <!-- Modal body --> + <div class="modal-body"> + + <hr> + + <div> + <span class="bg-success text-white">Green text</span> -> exist in [2] but not in [1] + <br> + <span class="bg-danger text-white">Red text</span> -> exist in [1] but not in [2] + </div> + + <hr> + + <div id="diff-area" style="word-wrap: break-word;"> + </div> + </div> + + <!-- Modal footer --> + <div class="modal-footer"> + <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button> + </div> + + </div> + </div> + </div> + <!-- Global site tag (gtag.js) - Google Analytics --> + <script async src="https://www.googletagmanager.com/gtag/js?id=UA-82999923-4"></script> + <script> + window.dataLayer = window.dataLayer || []; + function gtag(){dataLayer.push(arguments);} + gtag('js', new Date()); + + gtag('config', 'UA-82999923-4'); + </script> + <!-- -- diff wrapper ends---------------------------------- --> + <script src="{% static 'website/bootstrap-4.1.0/js/jquery.min.js' %}"></script> + <script src="{% static 'website/bootstrap-4.1.0/js/popper.min.js' %}"></script> + <script src="{% static 'website/bootstrap-4.1.0/js/bootstrap.min.js' %}"></script> + <script src="{% static 'website/js/codemirror.js'%}"></script> + <script src="{% static 'website/js/javascript.js'%}"></script> + <script src="{% static 'website/js/fullscreen.js'%}"></script> + <script src="{% static 'website/js/placeholder.js'%}"></script> + <script src="{% static 'website/js/cloud.js' %}"></script> + <script src="{% static 'website/js/jsdiff.js'%}"></script> + {% csrf_token %} +</body> + +</html> |