ui tool implementation

nomad-nmr-old · Mar 28, 2018 · fe1d67f · fe1d67f
1 parent 1668f88
commit fe1d67f
Show file tree

Hide file tree

Showing 30 changed files with 1,122 additions and 117 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,6 +1,7 @@
 .DS_Store
 
 .idea
+*.iml
 venv
 *.pyc
 

diff --git a/nmr-spectrum/main.py b/nmr-spectrum/main.py
@@ -1,9 +1,10 @@
 #!/usr/bin/python
 
 import os
+from bokeh.io import curdoc
+
 from logger import *
 from plot import Plot
-from bokeh.io import curdoc
 
 def readCompound(spectrum):
     with open("data/compounds/{}.svg".format(spectrum)) as f:

diff --git a/peaks/peaks.iml b/peaks/peaks.iml
@@ -34,6 +34,7 @@
     <orderEntry type="library" name="Maven: ch.qos.logback:logback-core:1.1.11" level="project" />
     <orderEntry type="library" name="Maven: org.slf4j:jul-to-slf4j:1.7.25" level="project" />
     <orderEntry type="library" name="Maven: org.slf4j:log4j-over-slf4j:1.7.25" level="project" />
+    <orderEntry type="library" name="Maven: org.springframework:spring-core:4.3.14.RELEASE" level="project" />
     <orderEntry type="library" scope="RUNTIME" name="Maven: org.yaml:snakeyaml:1.17" level="project" />
     <orderEntry type="library" name="Maven: org.springframework.boot:spring-boot-starter-web:1.5.10.RELEASE" level="project" />
     <orderEntry type="library" name="Maven: org.springframework.boot:spring-boot-starter-tomcat:1.5.10.RELEASE" level="project" />
@@ -49,6 +50,7 @@
     <orderEntry type="library" name="Maven: com.fasterxml.jackson.core:jackson-core:2.8.10" level="project" />
     <orderEntry type="library" name="Maven: org.springframework:spring-web:4.3.14.RELEASE" level="project" />
     <orderEntry type="library" name="Maven: org.springframework:spring-webmvc:4.3.14.RELEASE" level="project" />
+    <orderEntry type="library" name="Maven: org.springframework:spring-expression:4.3.14.RELEASE" level="project" />
     <orderEntry type="library" name="Maven: org.thymeleaf:thymeleaf-spring4:2.1.6.RELEASE" level="project" />
     <orderEntry type="library" name="Maven: org.thymeleaf:thymeleaf:2.1.6.RELEASE" level="project" />
     <orderEntry type="library" name="Maven: ognl:ognl:3.0.8" level="project" />
@@ -77,14 +79,11 @@
     <orderEntry type="library" name="Maven: org.springframework.data:spring-data-jpa:1.11.10.RELEASE" level="project" />
     <orderEntry type="library" name="Maven: org.springframework.data:spring-data-commons:1.13.10.RELEASE" level="project" />
     <orderEntry type="library" name="Maven: org.springframework:spring-orm:4.3.14.RELEASE" level="project" />
+    <orderEntry type="library" name="Maven: org.springframework:spring-context:4.3.14.RELEASE" level="project" />
     <orderEntry type="library" name="Maven: org.springframework:spring-tx:4.3.14.RELEASE" level="project" />
+    <orderEntry type="library" name="Maven: org.springframework:spring-beans:4.3.14.RELEASE" level="project" />
     <orderEntry type="library" name="Maven: org.slf4j:jcl-over-slf4j:1.7.25" level="project" />
     <orderEntry type="library" name="Maven: org.springframework:spring-aspects:4.3.14.RELEASE" level="project" />
-    <orderEntry type="library" name="Maven: org.springframework:spring-context-support:4.3.14.RELEASE" level="project" />
-    <orderEntry type="library" name="Maven: org.springframework:spring-beans:4.3.14.RELEASE" level="project" />
-    <orderEntry type="library" name="Maven: org.springframework:spring-context:4.3.14.RELEASE" level="project" />
-    <orderEntry type="library" name="Maven: org.springframework:spring-expression:4.3.14.RELEASE" level="project" />
-    <orderEntry type="library" name="Maven: org.springframework:spring-core:4.3.14.RELEASE" level="project" />
     <orderEntry type="library" name="Maven: org.springframework.boot:spring-boot-devtools:1.5.10.RELEASE" level="project" />
     <orderEntry type="library" name="Maven: org.springframework.boot:spring-boot:1.5.10.RELEASE" level="project" />
     <orderEntry type="library" name="Maven: org.springframework.boot:spring-boot-autoconfigure:1.5.10.RELEASE" level="project" />

diff --git a/peaks/pom.xml b/peaks/pom.xml
@@ -34,10 +34,6 @@
             <groupId>org.springframework.boot</groupId>
             <artifactId>spring-boot-starter-data-jpa</artifactId>
         </dependency>
-        <dependency>
-            <groupId>org.springframework</groupId>
-            <artifactId>spring-context-support</artifactId>
-        </dependency>
 
         <!-- hot swapping, disable cache for template, enable live reload -->
         <dependency>

diff --git a/peaks/src/main/java/com/mp236/controllers/SearchEngineController.java b/peaks/src/main/java/com/mp236/controllers/SearchEngineController.java
@@ -6,6 +6,7 @@
 import java.nio.file.Paths;
 import java.util.*;
 import java.util.stream.Collectors;
+import java.util.stream.IntStream;
 
 import com.mp236.entities.Peak;
 import com.mp236.entities.PeakRepository;
@@ -30,26 +31,29 @@ public class SearchEngineController {
 
     @RequestMapping("/")
     public String welcome(
-            @RequestParam(value = "shift[]", defaultValue = "") double[] shifts,
-            @RequestParam(value = "multiplicity[]", defaultValue = "") String[] multiplicities,
-            @RequestParam(value = "deviation[]", defaultValue = "") double[] deviations,
+            @RequestParam(value = "shift[]", defaultValue = "") ArrayList<Double> shifts,
+            @RequestParam(value = "multiplicity[]", defaultValue = "") ArrayList<String> multiplicities,
+            @RequestParam(value = "deviation[]", defaultValue = "") ArrayList<Double> deviations,
+            @RequestParam(value = "style", defaultValue = "old") String style,
             Map<String, Object> model
     ) {
 
         List<Spectrum> spectrums = new ArrayList<>();
 
-        for (int i=0;i<shifts.length;i++) {
-            List<Double> peaks = peakRepository.findInRange(shifts[i] - deviations[i], shifts[i] + deviations[i])
+        for (int i=0;i<shifts.size();i++) {
+            List<Double> peaks = peakRepository.findInRange(shifts.get(i) - deviations.get(i), shifts.get(i) + deviations.get(i))
                     .stream()
                     .map(Peak::getPeak)
                     .collect(Collectors.toList());
 
-            List<Spectrum> tmp = spectrumRepository.findInPeakList(peaks);
+            if (!peaks.isEmpty()) {
+                List<Spectrum> tmp = spectrumRepository.findInPeakList(peaks);
 
-            if(i == 0) {
-                spectrums.addAll(tmp);
-            } else {
-                spectrums.retainAll(tmp);
+                if(i == 0) {
+                    spectrums.addAll(tmp);
+                } else {
+                    spectrums.retainAll(tmp);
+                }
             }
         }
 
@@ -64,39 +68,22 @@ public String welcome(
                     return compound;
                 }).collect(Collectors.toList());
 
+        StringJoiner stringJoiner = new StringJoiner("&");
+        IntStream.range(0, shifts.size())
+                .forEach(i -> stringJoiner
+                        .add("shift%5B%5D="+shifts.get(i))
+                        .add("multiplicity%5B%5D="+multiplicities.get(i))
+                        .add("deviation%5B%5D="+deviations.get(i)));
+        String query = stringJoiner.toString();
+
         model.put("compounds", compounds);
         model.put("spectrums", spectrums);
 
-//        Map<Spectrum, Integer> spectrumHash = new HashMap<>();
-//        for(int i=0;i<shifts.length;i++) {
-//            List<Double> peaks = peakRepository.findInRange(shifts[i] - deviations[i], shifts[i] + deviations[i])
-//                    .stream()
-//                    .map(Peak::getPeak)
-//                    .collect(Collectors.toList());
-//            List<Spectrum> spectrums = spectrumRepository.findInPeakList(peaks);
-//
-//            for(Spectrum s: spectrums) {
-//                int times = 0;
-//                if(spectrumHash.containsKey(s)) {
-//                    times = spectrumHash.get(s);
-//                }
-//                spectrumHash.put(s, times + 1);
-//            }
-//        }
-//
-//        Map<Integer, List<Spectrum>> spectrumMap = new TreeMap<>((o1, o2) -> o2 - o1);
-//        spectrumHash.forEach((spectrum, times) -> {
-//            if(!spectrumMap.containsKey(times)) {
-//                spectrumMap.put(times, new ArrayList<>());
-//            }
-//            spectrumMap.get(times).add(spectrum);
-//        });
-//
-//        List<List<Spectrum>> spectrums = new ArrayList<>(spectrumMap.values());
-
         model.put("shifts", shifts);
         model.put("multiplicities", multiplicities);
         model.put("deviations", deviations);
+        model.put("style", style);
+        model.put("query", query);
 
         return "welcome";
     }

diff --git a/peaks/src/main/java/com/mp236/entities/Peak.java b/peaks/src/main/java/com/mp236/entities/Peak.java
@@ -13,6 +13,9 @@ public class Peak {
     @Column(name = "peak")
     private Double peak;
 
+    @Column(name = "class")
+    private String multiplicity;
+
     @Column(name = "spectrum_id")
     private Integer spectrumId;
 
@@ -40,9 +43,16 @@ public void setSpectrumId(Integer spectrumId) {
         this.spectrumId = spectrumId;
     }
 
+    public String getMultiplicity() {
+        return multiplicity;
+    }
+
+    public void setMultiplicity(String multiplicity) {
+        this.multiplicity = multiplicity;
+    }
+
     @Override
     public String toString() {
         return Double.toString(peak);
     }
-
 }
diff --git a/peaks/src/main/resources/application.properties b/peaks/src/main/resources/application.properties
@@ -1,4 +1,4 @@
 spring.jpa.hibernate.ddl-auto=none
 spring.datasource.url=jdbc:mysql://localhost:3306/mp236_sh
 spring.datasource.username=root
-spring.datasource.password=password
+spring.datasource.password=password
diff --git a/peaks/src/main/resources/static/css/main.css b/peaks/src/main/resources/static/css/main.css
@@ -0,0 +1,5 @@
+iframe {
+    padding: 0;
+    margin: 0;
+    overflow: hidden;
+}
diff --git a/peaks/src/main/resources/templates/welcome.html b/peaks/src/main/resources/templates/welcome.html
@@ -14,56 +14,77 @@
 
 <div class="container">
     <h2 class="page-header"><strong>Chemical Shifts</strong></h2>
-    <form th:action="@{/}" target="_self" method="get">
-        <div class="row">
-            <div class="col-md-offset-1 col-md-10">
-                <table class="table table-striped table-condensed">
-                    <thead>
-                    <tr>
-                        <th class="col-md-1 text-center"><strong>Line number</strong></th>
-                        <th class="col-md-3 text-center"><strong>Chemical Shift (ppm)</strong></th>
-                        <th class="col-md-4 text-center"><strong>Multiplicity</strong></th>
-                        <th class="col-md-3 text-center"><strong>Deviation (ppm)</strong></th>
-                        <th class="col-md-1 text-center"><strong>Remove</strong></th>
-                    </tr>
-                    </thead>
-                    <tbody id="tableBody">
-                        <tr th:each="shift,iter: ${shifts}">
-                            <td class="text-center"><p class="text-center form-control-static" th:text="${iter.index + 1}"></p></td>
-                            <td class="text-center"><input class="form-control" type="number" name="shift[]" step="0.01" th:value="${shift}"/></td>
-                            <td class="text-center">
-                                <select class="selectpicker" name="multiplicity[]">
-                                    <option value="m">m</option>
-                                    <option value="s">s</option>
-                                    <option value="d">d</option>
-                                    <option value="t">t</option>
-                                    <option value="q">q</option>
-                                    <option value="p">p</option>
-                                    <option value="h">h</option>
-                                    <option value="hept">hept</option>
-                                    <option value="dd">dd</option>
-                                    <option value="td">td</option>
-                                    <option value="ddt">ddt</option>
-                                    <option value="ddd">ddd</option>
-                                </select>
-                            </td>
-                            <td class="text-center"><input class="form-control" type="number" name="deviation[]" step="0.01" th:value="${deviations[iter.index]}"/></td>
-                            <td class="text-center"><button type="button" class="btn btn-danger btn-sm" onclick="remove(this)"><span class="fa fa-times"></span></button></td>
-                        </tr>
-                    </tbody>
-                </table>
-            </div>
-            <div class="col-md-offset-4 col-md-4">
-                <button type="button" class="btn btn-success btn-block" onclick="add()">Add Chemical Shift</button>
-            </div>
+
+    <ul class="nav nav-tabs">
+        <li th:class="${style=='old'} ? 'active' : ''"><a data-toggle="tab" href="#old">List</a></li>
+        <li th:class="${style=='plot'} ? 'active' : ''"><a data-toggle="tab" href="#plot">Plot</a></li>
+    </ul>
+
+    <div class="tab-content">
+        <div id="old" class="tab-pane fade" th:classappend="${style=='old'} ? 'in active' : '' ">
+            <form th:action="@{/}" target="_self" method="get">
+                <div class="row">
+                    <div class="col-md-offset-1 col-md-10">
+                        <input name="style" value="old" hidden="hidden"/>
+                        <table class="table table-striped table-condensed">
+                            <thead>
+                            <tr>
+                                <th class="col-md-1 text-center"><strong>Line number</strong></th>
+                                <th class="col-md-3 text-center"><strong>Chemical Shift (ppm)</strong></th>
+                                <th class="col-md-4 text-center"><strong>Multiplicity</strong></th>
+                                <th class="col-md-3 text-center"><strong>Deviation (ppm)</strong></th>
+                                <th class="col-md-1 text-center"><strong>Remove</strong></th>
+                            </tr>
+                            </thead>
+                            <tbody id="tableBody">
+                            <tr th:each="shift,iter: ${shifts}">
+                                <td class="text-center"><p class="text-center form-control-static" th:text="${iter.index + 1}"></p></td>
+                                <td class="text-center"><input class="form-control" type="number" name="shift[]" step="0.01" th:value="${shift}"/></td>
+                                <td class="text-center">
+                                    <select class="selectpicker" name="multiplicity[]">
+                                        <option value="m">m</option>
+                                        <option value="s">s</option>
+                                        <option value="d">d</option>
+                                        <option value="t">t</option>
+                                        <option value="q">q</option>
+                                        <option value="p">p</option>
+                                        <option value="h">h</option>
+                                        <option value="hept">hept</option>
+                                        <option value="dd">dd</option>
+                                        <option value="td">td</option>
+                                        <option value="ddt">ddt</option>
+                                        <option value="ddd">ddd</option>
+                                    </select>
+                                </td>
+                                <td class="text-center"><input class="form-control" type="number" name="deviation[]" step="0.01" th:value="${deviations[iter.index]}"/></td>
+                                <td class="text-center"><button type="button" class="btn btn-danger btn-sm" onclick="remove(this)"><span class="fa fa-times"></span></button></td>
+                            </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                    <div class="col-md-offset-4 col-md-4">
+                        <button type="button" class="btn btn-success btn-block" onclick="add()">Add Chemical Shift</button>
+                    </div>
+                </div>
+                <div class="help-block"></div>
+                <div class="row">
+                    <div class="text-center col-md-offset-1 col-md-10">
+                        <button type="submit" class="btn btn-success">Submit</button>
+                    </div>
+                </div>
+            </form>
         </div>
-        <div class="help-block"></div>
-        <div class="row">
-            <div class="text-center col-md-offset-1 col-md-10">
-                <button type="submit" class="btn btn-success">Submit</button>
+        <div id="plot" class="tab-pane fade" th:classappend="${style=='plot'} ? 'in active' : '' ">
+            <div class="row">
+                <div class="col-md-12">
+                    <div class="text-center">
+                        <!-- ?bokeh-session-id='+${bokehSessionID} -->
+                        <iframe th:src="'http://localhost:5006/ui-tool?'+${query}" width="810" height="610" frameBorder="0"></iframe>
+                    </div>
+                </div>
             </div>
         </div>
-    </form>
+    </div>
 
     <div th:unless="${#lists.isEmpty(compounds)}">
         <br/>
@@ -77,27 +98,6 @@ <h2 class="page-header"><strong>Chemical Shifts</strong></h2>
         </th:block>
     </div>
 
-    <!--<div th:unless="${#lists.isEmpty(spectrums)}">-->
-        <!--<br/>-->
-        <!--<div class="table-responsive">-->
-            <!--<table class="table table-hover table-condensed table-striped">-->
-                <!--<thead>-->
-                <!--<tr>-->
-                    <!--<th class="col-md-9 text-center">Peaks</th>-->
-                    <!--<th class="col-md-2 text-center">Last Updated</th>-->
-                    <!--<th class="col-md-1 text-center">Options</th>-->
-                <!--</tr>-->
-                <!--</thead>-->
-                <!--<tbody>-->
-                <!--<tr th:each="spectrum: ${spectrums}">-->
-                    <!--<td th:text="${{spectrum.getPeaks()}}">Peaks</td>-->
-                    <!--<td class="text-center" th:text="${#dates.format(spectrum.getDate(), 'dd-MM-yyyy hh:mm:ss')}">Date</td>-->
-                    <!--<td class="text-center"></td>-->
-                <!--</tr>-->
-                <!--</tbody>-->
-            <!--</table>-->
-        <!--</div>-->
-    <!--</div>-->
 </div>
 
 <script type="text/javascript" src="webjars/jquery/3.3.1/jquery.min.js"></script>

diff --git a/ui-tool/layouts/__init__.py b/ui-tool/layouts/__init__.py
diff --git a/ui-tool/layouts/customRow.py b/ui-tool/layouts/customRow.py
@@ -0,0 +1,8 @@
+from bokeh.core.properties import Bool
+from bokeh.models.layouts import Box
+
+class CustomRow(Box):
+
+    __implementation__ = "customRow.ts"
+
+    hide = Bool(False)
-Original file line number
+Diff line change
@@ -1,6 +1,7 @@
     .DS_Store
     .idea
+    *.iml
     venv
     *.pyc
@@ Expand Down @@