Merge pull request #2 from Sakshisrivastava413/master

developed expression heatmaps based on dataset

.babelrc

@@ -0,0 +1,3 @@
+{
+  "presets": ["@babel/preset-env", "@babel/preset-react"]
+}

.eslintignore

@@ -0,0 +1,4 @@
+node_modules/*
+dist/*
+dev/*
+webpack.config.js

.eslintrc

@@ -0,0 +1,36 @@
+{
+	"env": {
+		"browser": true,
+    "es6": true,
+    "jquery": true,
+    "node": true,
+    "jest": true
+	},
+	"extends": [
+    "eslint:recommended",
+		"plugin:react/recommended",
+    "prettier"
+  ],
+  "plugins": [
+    "import",
+    "prettier"
+  ],
+  "parserOptions": {
+    "sourceType": "module",
+    "ecmaFeatures": {
+      "experimentalObjectRestSpread": true
+    }
+  },
+	"rules": {
+    "indent": ["error", "tab"],
+		"linebreak-style": ["error", "unix"],
+		"quotes": ["error", "single"],
+		"semi": ["error", "always"],
+    "prettier/prettier": "error",
+    "comma-dangle": ["error", "never"],
+		"react/prop-types": 0
+  },
+  "globals": {
+    "imjs": true
+  }
+}

.gitignore

@@ -1,104 +1,2 @@
-# Logs
-logs
-*.log
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-lerna-debug.log*
-
-# Diagnostic reports (https://nodejs.org/api/report.html)
-report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
-
-# Runtime data
-pids
-*.pid
-*.seed
-*.pid.lock
-
-# Directory for instrumented libs generated by jscoverage/JSCover
-lib-cov
-
-# Coverage directory used by tools like istanbul
-coverage
-*.lcov
-
-# nyc test coverage
-.nyc_output
-
-# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
-.grunt
-
-# Bower dependency directory (https://bower.io/)
-bower_components
-
-# node-waf configuration
-.lock-wscript
-
-# Compiled binary addons (https://nodejs.org/api/addons.html)
-build/Release
-
-# Dependency directories
+# NPM publish messes with `.gitignore`, therefore we have to call this file `gitignore`.
 node_modules/
-jspm_packages/
-
-# TypeScript v1 declaration files
-typings/
-
-# TypeScript cache
-*.tsbuildinfo
-
-# Optional npm cache directory
-.npm
-
-# Optional eslint cache
-.eslintcache
-
-# Microbundle cache
-.rpt2_cache/
-.rts2_cache_cjs/
-.rts2_cache_es/
-.rts2_cache_umd/
-
-# Optional REPL history
-.node_repl_history
-
-# Output of 'npm pack'
-*.tgz
-
-# Yarn Integrity file
-.yarn-integrity
-
-# dotenv environment variables file
-.env
-.env.test
-
-# parcel-bundler cache (https://parceljs.org/)
-.cache
-
-# Next.js build output
-.next
-
-# Nuxt.js build / generate output
-.nuxt
-dist
-
-# Gatsby files
-.cache/
-# Comment in the public line in if your project uses Gatsby and *not* Next.js
-# https://nextjs.org/blog/next-9-1#public-directory-support
-# public
-
-# vuepress build output
-.vuepress/dist
-
-# Serverless directories
-.serverless/
-
-# FuseBox cache
-.fusebox/
-
-# DynamoDB Local files
-.dynamodb/
-
-# TernJS port file
-.tern-port

.prettierrc

@@ -0,0 +1,4 @@
+{
+  "singleQuote": true,
+  "useTabs": true
+}

LICENSE

@@ -1,6 +1,6 @@
-MIT License
+The MIT License (MIT)
 
-Copyright (c) 2020 InterMine
+Copyright (c) 2020 Sakshi Srivastava <sakshisrivastava413@gmail.com>
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
@@ -9,13 +9,13 @@ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 copies of the Software, and to permit persons to whom the Software is
 furnished to do so, subject to the following conditions:
 
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
 
 THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

README.md

@@ -1 +1,48 @@
-# bluegenes-human-tissue-expression-visualizer
+#  Bluegenes Human Tissue Expression Visualizer
+
+Bluegenes Human Tissue Expression Visualizer is a tool made for [BlueGenes](http://bluegenes.apps.intermine.org) following BlueGenes Tool API.
+Add more description of your tool here! :)
+
+## Licence
+
+
+### To set up locally for development
+
+1. Clone the repo
+2. `cd bluegenes-human-tissue-expression-visualizer` and then `npm install` to install dependencies.
+
+All of the editable source files for css and js are in `src`. To bundle for prod, run the following commands:
+
+#### CSS
+
+Assuming [less](http://lesscss.org/) is installed globally:
+
+```
+npm run less
+```
+
+#### JS
+
+Assuming [webpack](https://webpack.js.org/) is installed globally:
+
+##### Single build:
+```
+npm run build
+```
+
+
+##### Applied Coding practices / ESLint Rules:
+- _indent_: use __tab (2 space tab)__ instead of spaces to not get an error.
+- _linebreak-style_: use __\n__ for a newline, if you're on windows, configure it in your editor settings.
+- _quotes_: use __single quote__ instead of double quote.
+- _semi_: use _semi colon_ at end of each statement / expression / function definition.
+- _comma-dangle_: do not use dangling commas i.e. extra comma at the end of object values, function args, etc.). More about this [here](https://eslint.org/docs/rules/comma-dangle).
+- More pre-configured rules from __eslint:recommended__ you must follow to not get errors [here](https://eslint.org/docs/rules/).
+
+##### Developing:
+To serve your code at [localhost:3456](http://localhost:3456) and rebuild it every time it changes, run:
+
+
+```bash
+npm run dev
+```

TODO.md

@@ -0,0 +1,16 @@
+# Project todos
+
+This project was generated with the [BlueGenes Tool Generator](https://github.com/intermine/generator-bluegenes-tool), which has
+produced the basic files needed for your tool. You'll still need to handle the implementation details, though.
+
+## Todos before this is release-ready:
+
+- [] edit [src/index.js](src/index.js) and add code to initialise your tool
+- [] update demo.html to show a demo of your tool
+- [] add `preview.png` to the root directory of this repo. This image will be used to preview your tool.
+- [] update your tool's description in [README.md](README.md)
+- [] edit package.json and point to your github repository, something like ```  "repository": {
+    "type": "git",
+    "url": "git@github.com:intermine/someRepo.git"
+  },```
+- [] add any css styles to [src/style.less](src/style.less)

config.json

@@ -0,0 +1,21 @@
+{
+  "accepts": ["id","ids"],
+  "classes": ["Gene"],
+  "columnMapping": {
+    "Gene": {
+      "id": "primaryIdentifier"
+    },
+    "Protein": {
+      "id": "primaryAccession"
+    }
+  },
+  "files" : {
+    "css" : "dist/style.css",
+    "js" : "dist/bundle.js"
+  },
+  "toolName" : {
+    "human" :"Bluegenes Human Tissue Expression Visualizer",
+    "cljs" :"bluegenesHumanTissueExpressionVisualizer"    
+  },
+  "version": 2
+}

demo.html

@@ -0,0 +1,88 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <title>
+    Bluegenes Human Tissue Expression Visualizer
+  </title>
+
+  <!-- You can assume imjs is on the window.  -->
+  <script src="node_modules/imjs/dist/im.min.js"></script>
+  <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
+
+
+  <script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
+  <script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
+
+
+  <!-- These are styles that will be inherited from bluegenes -->
+  <link rel="stylesheet" href="css/site.css">
+
+
+  <!-- These are the styles YOU implement in src/style.less -->
+  <link rel="stylesheet" href="dist/style.css">
+	<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js"></script>
+	<script>
+		var socket = io("http://localhost:3457");
+    socket.on('reload', function(){
+			document.location.reload();
+    });
+	</script>
+</head>
+
+<body>
+  <div class="bluegenesHumanTissueExpressionVisualizer" id='yourDiv' />
+  <script>
+    window.onload = function() {
+	    //The element to attach the viewer to. Must be an existing DOM element
+    	var elem = document.getElementById('yourDiv'),
+    		//InterMine service, including URL and token.
+    		imURL = {
+    			root: 'https://www.humanmine.org/humanmine',
+    			//could include token here too if we had one
+    		},
+    		//this is an example of data that could be passed to this tool be BlueGenes
+    		//in reality (outside the demo) this would be dynamic and not hard-coded
+    		// to an ID.
+    		dataToInitialiseToolWith = {
+          Gene: {
+            class: 'Gene',
+            format: 'ids',
+            // right now this id corresponds to Human GATA1
+            // this is a bit fragile since IDs change with every build
+            // but we don't want to make the code more complicated than
+            // needed for the demo.
+            value: [1016209, 1263106, 1047948, 1215734, 1161508, 1020855, 1205381, 1183373, 1067416, 1010852, 1110017, 1144839, 1202463, 1117907, 1086537, 1163220, 1216153, 1038163, 1172531, 1151310, 1218598, 1004746, 1204975]
+          }
+    		},
+    		toolState = {}, //to be confirmed how we use this.
+        navigate = function(type, data, mine) {
+          // Helpful console message when calling navigate function.
+          var someMine = mine ? "on ".concat(mine) : null;
+          var msg = ["Navigating to", type, someMine, "with data:"]
+            .filter(function(e) { return e }) // remove falsy elements
+            .join(" ");
+          console.log(msg, data);
+        };
+    	// THIS LINE IS THE IMPORTANT BIT. YOU SHOULDN'T NEED TO EDIT IT
+    	// the method signature should match the signature in src/index.js
+    	$.ajax('config.json').then(function(config) {
+    		bluegenesHumanTissueExpressionVisualizer.main(
+    			elem,
+          imURL,
+          dataToInitialiseToolWith,
+          toolState,
+          config,
+          navigate
+        );
+    	});
+    };
+  </script>
+  <script src="dist/bundle.js"></script>
+
+</body>
+
+</html>