Work on columns, polish 3d pds

Author: blokhin

labs/pd3d/3d.html

@@ -38,7 +38,7 @@
 <div id="thumbs"></div>
 <div id="sim_thumbs"></div>
 <div id="legend">Known crystal structures are in red.</div>
-<div id="sim_legend">Hover the binary diagrams for more data or <a target="_parent" id="expander">expand view</a>.</div>
+<div id="sim_legend">Hover the binary diagrams for more data or <a target="_blank" id="expander">expand view</a>.</div>
 
 <!-- POSSIBILITY TO CLOSE FROM IFRAME -->
 <div id="cross" title="Close" class="uielem"></div>
@@ -77,7 +77,7 @@
     model_url = (debug ? 'http://localhost:8522' : 'https://labs.mpds.io/services') + '/model?els=' + target,
     meta_url = (debug ? 'http://localhost:8522' : 'https://labs.mpds.io/services') + '/modelmeta?els=' + target,
     data_server = (window.location.host.indexOf('localhost') === -1) ? 'https://api.mpds.io/v0/search/facet?q=' : 'http://localhost:7070/search/facet?q=',
-    gui_server = (window.location.host.indexOf('localhost') === -1) ? 'https://mpds.io/#entry/' : 'http://localhost:8070/#entry/',
+    //gui_server = (window.location.host.indexOf('localhost') === -1) ? 'https://mpds.io/#entry/' : 'http://localhost:8070/#entry/',
     req_cache = {}, // [els] => answer array
     scale_ratio = 340;
 
@@ -270,7 +270,7 @@
                 } catch (err){}
                 if (cur_entry){
                     document.getElementById('sim_legend').style.display = 'block';
-                    document.getElementById('expander').setAttribute('href', gui_server + cur_entry);
+                    document.getElementById('expander').setAttribute('href', '/#entry/' + cur_entry);
                 }
             }
             else if (xhr.status) console.error('HTTP error ' + xhr.status + ' received during retrieving data from the server');

src_js/markup.js

@@ -292,7 +292,7 @@ function register_html(){
 
 <!-- PERIODIC TABLE DATATYPES CONTROL -->
 <div id="ptable_dtypes_box">
-    <span><span>&#9432;</span> Show chemical elements as: </span>
+    <span>Show periodic table as: </span>
     <div>
         <input type="radio" name="ptable_dtypes" id="ptable_dtypes_1" value="1" checked /><label for="ptable_dtypes_1"> phase diagrams</label><br />
         <input type="radio" name="ptable_dtypes" id="ptable_dtypes_2" value="2" /><label for="ptable_dtypes_2"> crystal structure counts</label><br />
@@ -680,7 +680,7 @@ function register_html(){
         <li rev="usr_tab_account" class="working">account</li>
         <li rev="usr_tab_perms">data access</li>
         <li rev="usr_tab_api_key" class="only_regular">API key</li>
-        <li rev="usr_tab_columns">tables</li>
+        <!-- li rev="usr_tab_clmns">entries table</li -->
         <li rev="usr_tab_absolidix" class="only_regular only_mpds">my data</li>
         <li rev="usr_tab_ctrl" style="display:none;" class="admin">management</li>
     </ul>
@@ -739,23 +739,26 @@ function register_html(){
         </div>
     </div>
 
-    <div id="usr_tab_columns" class="menu_tabs" style="display:none;">
+    <!-- div id="usr_tab_clmns" class="menu_tabs" style="display:none;">
         <div class="cross close_user_dialogue" style="margin-top:25px;"></div>
         <div style="clear:both;"></div>
         <div class="divider"></div>
 
-        <div class="columns"><input type="checkbox" checked />&nbsp;<label>Formula</label></div>
-        <div class="columns"><input type="checkbox" />&nbsp;<label>Anonymous formula</label></div>
-        <div class="columns"><input type="checkbox" />&nbsp;<label>Prototype</label></div>
-        <div class="columns"><input type="checkbox" />&nbsp;<label>Distinct phase</label></div>
-        <div class="columns"><input type="checkbox" checked />&nbsp;<label>Property</label></div>
-        <div class="columns"><input type="checkbox" />&nbsp;<label>Temperature</label></div>
-        <div class="columns"><input type="checkbox" />&nbsp;<label>Space group</label></div>
-        <div class="columns"><input type="checkbox" />&nbsp;<label>Conditions</label></div>
-        <div class="columns"><input type="checkbox" checked />&nbsp;<label>J. code</label></div>
-        <div class="columns"><input type="checkbox" checked />&nbsp;<label>Year</label></div>
-        <div class="columns"><input type="checkbox" checked />&nbsp;<label>Ref.</label></div>
-    </div>
+        <div class="clmns"><input type="checkbox" id="clmns_entry" />&nbsp;<label for="clmns_entry">ID</label></div>
+        <div class="clmns"><input type="checkbox" id="clmns_formula" />&nbsp;<label for="clmns_formula">Formula</label></div>
+        <div class="clmns"><input type="checkbox" id="clmns_anon" />&nbsp;<label for="clmns_anon">Anonymous formula</label></div>
+        <div class="clmns"><input type="checkbox" id="clmns_proto" />&nbsp;<label for="clmns_proto">Prototype</label></div>
+        <div class="clmns"><input type="checkbox" id="clmns_phase" />&nbsp;<label for="clmns_phase">Distinct phase</label></div>
+        <div class="clmns"><input type="checkbox" id="clmns_prop" />&nbsp;<label for="clmns_prop">Property</label></div>
+        <div class="clmns"><input type="checkbox" id="clmns_value" />&nbsp;<label for="clmns_value">Value</label></div>
+        <div class="clmns"><input type="checkbox" id="clmns_t" />&nbsp;<label for="clmns_t">Temperature</label></div>
+        <div class="clmns"><input type="checkbox" id="clmns_spg" />&nbsp;<label for="clmns_spg">Space group</label></div>
+        <div class="clmns"><input type="checkbox" id="clmns_cond" />&nbsp;<label for="clmns_cond">Conditions</label></div>
+        <div class="clmns"><input type="checkbox" id="clmns_rank" />&nbsp;<label for="clmns_rank">Entry rank</label></div>
+        <div class="clmns"><input type="checkbox" id="clmns_coden" />&nbsp;<label for="clmns_coden">J. code</label></div>
+        <div class="clmns"><input type="checkbox" id="clmns_year" />&nbsp;<label for="clmns_year">Year</label></div>
+        <div class="clmns"><input type="checkbox" id="clmns_bid" />&nbsp;<label for="clmns_bid">Ref.</label></div>
+    </div -->
 
     <div id="usr_tab_absolidix" class="menu_tabs" style="display:none;">
         <br /><br /><br /><br />Redirecting...<br /><br /><br /><br />

src_js/ptable.js

@@ -1,5 +1,7 @@
 "use strict";
 
+var wmgui = window.wmgui || {};
+
 wmgui.ptable = {};
 wmgui.ptable.update_selectize = false;
 wmgui.ptable.active_ajax = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");

src_js/wmsettings.js

@@ -111,6 +111,7 @@ wmgui.numerics = {
 wmgui.gui_host = window.location.protocol + '//' + window.location.host;
 wmgui.api_host =          wmgui.prod ? 'https://api.mpds.io/v0' : 'http://localhost:7070';
 wmgui.static_host =       'https://mpds.io';
+//wmgui.static_host =       'http://localhost:8070';
 
 // below are the main MPDS API endpoints
 wmgui.login_endpoint =    wmgui.api_host + '/users/login';

webassets/ermac.css

@@ -227,9 +227,9 @@ div.opened div.gallery_img:after{content:"";position:absolute;top:0;right:0;bott
 
 div.col_title{width:100%;height:40px;font-size:0.9em;letter-spacing:1.5px;text-align:center;line-height:40px;margin-bottom:6px;color:#333;background:#fafafa;overflow:hidden;text-transform:uppercase;}
 div.col_title a{text-decoration:none;color:#000;border-bottom:1px solid #000;}
-div.columns{height:46px;text-align:left;}
-div.columns > input{display:inline-block;width:40px !important;vertical-align:top;}
-div.columns > label{display:inline-block;vertical-align:top;margin-top:4px;}
+div.clmns{height:42px;text-align:left;}
+div.clmns > input{display:inline-block;width:40px !important;vertical-align:top;}
+div.clmns > label{display:inline-block;vertical-align:top;margin-top:4px;}
 
 #ctx_col{display:none;position:fixed;top:62px;left:0;width:13.5%;height:90%;z-index:56;background:#fff;border-top:1px solid #888;}
 #ctx_col > ul{margin:0;padding:0;}
@@ -353,9 +353,9 @@ span.href, div.notice > a{cursor:pointer;text-decoration:none;color:#3e3f95;bord
 #account_pass_hint{width:90%;height:auto;position:relative;margin:2vh auto;font-size:0.95em;line-height:2.5vh;background:#ffd;padding:15px;}
 #account_pass_hint:after{content:'';position:absolute;bottom:0;left:50%;width:0;height:0;border:22px solid transparent;border-top-color:#ffc;border-bottom:0;margin-left:-22px;margin-bottom:-22px;}
 
-#tab_links{color:#333;margin:-55px 0 0 0;padding:0;}
+#tab_links{color:#333;margin:-56px 0 0 0;padding:0;}
 #tab_links:after{display:block;clear:both;content:'';}
-#tab_links li{margin:0 2px;cursor:pointer;user-select:none;float:left;padding:5px 8px;list-style:none;line-height:20px;font-size:0.9em;background:#ddd;border-radius:4px 4px 0 0;border-top:1px solid #999;border-right:1px solid #999;border-left:1px solid #999;}
+#tab_links li{margin:2px 2px 0;cursor:pointer;user-select:none;float:left;padding:5px 8px;list-style:none;line-height:20px;font-size:0.9em;background:#ddd;border-radius:4px 4px 0 0;border-top:1px solid #999;border-right:1px solid #999;border-left:1px solid #999;}
 #tab_links li:hover{background:#fff;}
 #tab_links li.working{background:#fff;}
 
@@ -528,7 +528,6 @@ div.sops_col{letter-spacing:1px;}
 #ptable_dtypes_box{display:none;position:fixed;z-index:2;width:460px;height:auto;top:294px;left:50%;margin-left:-297px;color:#333;letter-spacing:0.3px;user-select:none;}
 #ptable_dtypes_box.resulted{display:block;top:94px;}
 #ptable_dtypes_box > span{display:inline-block;font-size:0.9em;background:#fbfbfb;vertical-align:top;line-height:32px;}
-#ptable_dtypes_box > span > span{font-size:26px;color:#ccc;}
 #ptable_dtypes_box > div{display:inline-block;padding-top:3px;line-height:32px;}
 #ptable_dtypes_box > div > label{font-size:0.9em;background:#fbfbfb;}