diff --git a/.ipynb_checkpoints/band_structure_visualization-Copy1-checkpoint.ipynb b/.ipynb_checkpoints/band_structure_visualization-Copy1-checkpoint.ipynb index ae802f47de3dca31c7508a4235089d6b4bb680f0..26e85a7844124f497c189e944383f990c5d55038 100644 --- a/.ipynb_checkpoints/band_structure_visualization-Copy1-checkpoint.ipynb +++ b/.ipynb_checkpoints/band_structure_visualization-Copy1-checkpoint.ipynb @@ -906,7 +906,7 @@ }, { "cell_type": "code", - "execution_count": 131, + "execution_count": 16, "metadata": { "tags": [ "process_band_dos_data" @@ -1749,7 +1749,7 @@ }, { "cell_type": "code", - "execution_count": 132, + "execution_count": 17, "metadata": { "scrolled": false, "tags": [ @@ -3331,7 +3331,7 @@ }, { "cell_type": "code", - "execution_count": 173, + "execution_count": 24, "metadata": { "tags": [ "plot_band" @@ -3660,7 +3660,7 @@ }, { "cell_type": "code", - "execution_count": 174, + "execution_count": 25, "metadata": { "tags": [ "plot_dos" @@ -3929,7 +3929,7 @@ }, { "cell_type": "code", - "execution_count": 167, + "execution_count": 18, "metadata": { "tags": [ "init_jquery" @@ -3956,7 +3956,7 @@ }, { "cell_type": "code", - "execution_count": 168, + "execution_count": 19, "metadata": { "tags": [ "init_flot" @@ -3983,7 +3983,7 @@ }, { "cell_type": "code", - "execution_count": 169, + "execution_count": 20, "metadata": { "tags": [ "init_flot_axislabels" @@ -4010,7 +4010,7 @@ }, { "cell_type": "code", - "execution_count": 170, + "execution_count": 21, "metadata": { "tags": [ "init_flot_navigate" @@ -4064,7 +4064,7 @@ }, { "cell_type": "code", - "execution_count": 149, + "execution_count": 28, "metadata": { "tags": [ "js_query_beforeafter" @@ -4079,9 +4079,19 @@ "},i);return this.each(function(){var i=e(this),a=i.find(\"img\"),n=a.data(\"aftersrc\"),s=i.width(),d=0;a.after('<div class=\"g-img-after\"><img style=\"width: '+s+'px;\" src=\"'+n+'\"></div>'),\n", "a.addClass(\"g-img-before\").width(s),i.append('<div class=\"g-img-divider\"><span>'+t.message+\"</span></div>\"),d=i.height(),t.split_horizontal||i.addClass(\"g-vertical\"),\n", "i.on(\"mouseenter touchstart\",function(e){var t=i.data(\"reset-timer\");t&&(window.clearTimeout(t),i.data(\"reset-timer\",!1))}).on(\"mousemove touchmove\",function(a){\n", - "var n=0,o=0,r=i.find(\".g-img-divider span\");if(t.drag_horizontal)n=a.pageX-i.offset().left,o=n/s*100;else{var f=i.offset().top-e(window).scrollTop();n=a.clientY/f,\n", - "o=(a.clientY-f)/d*100}if(t.touch&&\"undefined\"!=typeof a.originalEvent.touches){var g=a.originalEvent.touches[0];o=t.drag_horizontal?(g.pageX-i.offset().left)/s*100:(g.pageY-i.offset().top)/d*100;\n", - "}t.split_horizontal?(i.find(\".g-img-after\").css(\"left\",o+\"%\"),i.find(\".g-img-divider\").css(\"left\",o+\"%\")):(i.find(\".g-img-after\").css(\"top\",o+\"%\"),i.find(\".g-img-divider\").css(\"top\",o+\"%\")),\n", + "var n=0,o=0,r=i.find(\".g-img-divider span\");\n", + " if(t.drag_horizontal)n=a.pageX-i.offset().left,o=n/s*100;\n", + " else{\n", + " var f=i.offset().top-e(window).scrollTop();\n", + " n=a.clientY/f,\n", + " o=(a.clientY-f)/d*100\n", + " }\n", + " if(t.touch&&\"undefined\"!=typeof a.originalEvent.touches)\n", + " {\n", + " var g=a.originalEvent.touches[0];\n", + " o=t.drag_horizontal?(g.pageX-i.offset().left)/s*100:(g.pageY-i.offset().top)/d*100;\n", + " }\n", + " t.split_horizontal?(i.find(\".g-img-after\").css(\"left\",o+\"%\"),i.find(\".g-img-divider\").css(\"left\",o+\"%\")):(i.find(\".g-img-after\").css(\"top\",o+\"%\"),i.find(\".g-img-divider\").css(\"top\",o+\"%\")),\n", "t.hide_message&&r.is(\":visible\")&&r.fadeOut()}).on(\"mouseleave touchend touchcancel\",function(e){var a=i.data(\"reset-timer\"),n=i.find(\".g-img-divider span\");\n", "t.reset&&(a||(a=window.setTimeout(function(){t.split_horizontal?(i.find(\".g-img-after\").animate({left:\"50%\"},500),i.find(\".g-img-divider\").animate({left:\"50%\"\n", "},500,function(){n.fadeIn()})):(i.find(\".g-img-after\").animate({top:\"50%\"},500),i.find(\".g-img-divider\").animate({top:\"50%\"},500,function(){n.fadeIn()})),\n", @@ -4102,9 +4112,19 @@ "},i);return this.each(function(){var i=e(this),a=i.find(\"img\"),n=a.data(\"aftersrc\"),s=i.width(),d=0;a.after('<div class=\"g-img-after\"><img style=\"width: '+s+'px;\" src=\"'+n+'\"></div>'),\n", "a.addClass(\"g-img-before\").width(s),i.append('<div class=\"g-img-divider\"><span>'+t.message+\"</span></div>\"),d=i.height(),t.split_horizontal||i.addClass(\"g-vertical\"),\n", "i.on(\"mouseenter touchstart\",function(e){var t=i.data(\"reset-timer\");t&&(window.clearTimeout(t),i.data(\"reset-timer\",!1))}).on(\"mousemove touchmove\",function(a){\n", - "var n=0,o=0,r=i.find(\".g-img-divider span\");if(t.drag_horizontal)n=a.pageX-i.offset().left,o=n/s*100;else{var f=i.offset().top-e(window).scrollTop();n=a.clientY/f,\n", - "o=(a.clientY-f)/d*100}if(t.touch&&\"undefined\"!=typeof a.originalEvent.touches){var g=a.originalEvent.touches[0];o=t.drag_horizontal?(g.pageX-i.offset().left)/s*100:(g.pageY-i.offset().top)/d*100;\n", - "}t.split_horizontal?(i.find(\".g-img-after\").css(\"left\",o+\"%\"),i.find(\".g-img-divider\").css(\"left\",o+\"%\")):(i.find(\".g-img-after\").css(\"top\",o+\"%\"),i.find(\".g-img-divider\").css(\"top\",o+\"%\")),\n", + "var n=0,o=0,r=i.find(\".g-img-divider span\");\n", + " if(t.drag_horizontal)n=a.pageX-i.offset().left,o=n/s*100;\n", + " else{\n", + " var f=i.offset().top-e(window).scrollTop();\n", + " n=a.clientY/f,\n", + " o=(a.clientY-f)/d*100\n", + " }\n", + " if(t.touch&&\"undefined\"!=typeof a.originalEvent.touches)\n", + " {\n", + " var g=a.originalEvent.touches[0];\n", + " o=t.drag_horizontal?(g.pageX-i.offset().left)/s*100:(g.pageY-i.offset().top)/d*100;\n", + " }\n", + " t.split_horizontal?(i.find(\".g-img-after\").css(\"left\",o+\"%\"),i.find(\".g-img-divider\").css(\"left\",o+\"%\")):(i.find(\".g-img-after\").css(\"top\",o+\"%\"),i.find(\".g-img-divider\").css(\"top\",o+\"%\")),\n", "t.hide_message&&r.is(\":visible\")&&r.fadeOut()}).on(\"mouseleave touchend touchcancel\",function(e){var a=i.data(\"reset-timer\"),n=i.find(\".g-img-divider span\");\n", "t.reset&&(a||(a=window.setTimeout(function(){t.split_horizontal?(i.find(\".g-img-after\").animate({left:\"50%\"},500),i.find(\".g-img-divider\").animate({left:\"50%\"\n", "},500,function(){n.fadeIn()})):(i.find(\".g-img-after\").animate({top:\"50%\"},500),i.find(\".g-img-divider\").animate({top:\"50%\"},500,function(){n.fadeIn()})),\n", @@ -4113,7 +4133,7 @@ }, { "cell_type": "code", - "execution_count": 150, + "execution_count": 29, "metadata": { "tags": [ "js_compare_slide" @@ -4123,6 +4143,20 @@ { "data": { "application/javascript": [ + "\n", + "\n", + " !function(e){e.fn.beforeafter=function(i){var t=e.extend({touch:!0,message:\"Slide\",hide_message:!0,reset:!0,reset_delay:3e3,drag_horizontal:!0,split_horizontal:!0\n", + "},i);return this.each(function(){var i=e(this),a=i.find(\"img\"),n=a.data(\"aftersrc\"),s=i.width(),d=0;a.after('<div class=\"g-img-after\"><img style=\"width: '+s+'px;\" src=\"'+n+'\"></div>'),\n", + "a.addClass(\"g-img-before\").width(s),i.append('<div class=\"g-img-divider\"><span>'+t.message+\"</span></div>\"),d=i.height(),t.split_horizontal||i.addClass(\"g-vertical\"),\n", + "i.on(\"mouseenter touchstart\",function(e){var t=i.data(\"reset-timer\");t&&(window.clearTimeout(t),i.data(\"reset-timer\",!1))}).on(\"mousemove touchmove\",function(a){\n", + "var n=0,o=0,r=i.find(\".g-img-divider span\");if(t.drag_horizontal)n=a.pageX-i.offset().left,o=n/s*100;else{var f=i.offset().top-e(window).scrollTop();n=a.clientY/f,\n", + "o=(a.clientY-f)/d*100}if(t.touch&&\"undefined\"!=typeof a.originalEvent.touches){var g=a.originalEvent.touches[0];o=t.drag_horizontal?(g.pageX-i.offset().left)/s*100:(g.pageY-i.offset().top)/d*100;\n", + "}t.split_horizontal?(i.find(\".g-img-after\").css(\"left\",o+\"%\"),i.find(\".g-img-divider\").css(\"left\",o+\"%\")):(i.find(\".g-img-after\").css(\"top\",o+\"%\"),i.find(\".g-img-divider\").css(\"top\",o+\"%\")),\n", + "t.hide_message&&r.is(\":visible\")&&r.fadeOut()}).on(\"mouseleave touchend touchcancel\",function(e){var a=i.data(\"reset-timer\"),n=i.find(\".g-img-divider span\");\n", + "t.reset&&(a||(a=window.setTimeout(function(){t.split_horizontal?(i.find(\".g-img-after\").animate({left:\"50%\"},500),i.find(\".g-img-divider\").animate({left:\"50%\"\n", + "},500,function(){n.fadeIn()})):(i.find(\".g-img-after\").animate({top:\"50%\"},500),i.find(\".g-img-divider\").animate({top:\"50%\"},500,function(){n.fadeIn()})),\n", + "i.data(\"reset-timer\",!1)},t.reset_delay),i.data(\"reset-timer\",a)))})}),this}}(jQuery);\n", + "\n", "var div_str = '';\n", "//div_str = '<style> .g-before-after{position:relative;overflow:hidden}.g-before-after img{display:block}.g-before-after .g-img-before{float:left}.g-before-after .g-img-after,.g-before-after.g-vertical .g-img-after{position:absolute;top:0;right:0;left:50%;bottom:0;overflow:hidden}.g-before-after .g-img-after img{position:absolute;right:0;top:0}.g-before-after .g-img-divider{position:absolute;left:50%;top:0;bottom:0;width:0;border-left:1px solid #fff;border-right:1px solid #fff}.g-before-after .g-img-divider>span{position:absolute;top:50%;display:block;background-color:#fff;padding:5px 10px;line-height:1;text-align:center;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.g-before-after.g-vertical .g-img-after{top:50%;left:0}.g-before-after.g-vertical .g-img-after img{position:absolute;right:auto;top:auto;left:0;bottom:0}.g-before-after.g-vertical .g-img-divider{position:absolute;left:0;top:50%;bottom:auto;right:0;height:0;width:100%;border-top:1px solid #fff;border-bottom:1px solid #fff;border-left:0 none;border-right:0 none}.g-before-after.g-vertical .g-img-divider>span{top:50%;left:50%} </style>'\n", "//div_str += '<script>$(\\'#div_compare_containerx\\').beforeafter(); </script>';\n", @@ -4157,6 +4191,20 @@ ], "source": [ "%%javascript\n", + "\n", + "\n", + " !function(e){e.fn.beforeafter=function(i){var t=e.extend({touch:!0,message:\"Slide\",hide_message:!0,reset:!0,reset_delay:3e3,drag_horizontal:!0,split_horizontal:!0\n", + "},i);return this.each(function(){var i=e(this),a=i.find(\"img\"),n=a.data(\"aftersrc\"),s=i.width(),d=0;a.after('<div class=\"g-img-after\"><img style=\"width: '+s+'px;\" src=\"'+n+'\"></div>'),\n", + "a.addClass(\"g-img-before\").width(s),i.append('<div class=\"g-img-divider\"><span>'+t.message+\"</span></div>\"),d=i.height(),t.split_horizontal||i.addClass(\"g-vertical\"),\n", + "i.on(\"mouseenter touchstart\",function(e){var t=i.data(\"reset-timer\");t&&(window.clearTimeout(t),i.data(\"reset-timer\",!1))}).on(\"mousemove touchmove\",function(a){\n", + "var n=0,o=0,r=i.find(\".g-img-divider span\");if(t.drag_horizontal)n=a.pageX-i.offset().left,o=n/s*100;else{var f=i.offset().top-e(window).scrollTop();n=a.clientY/f,\n", + "o=(a.clientY-f)/d*100}if(t.touch&&\"undefined\"!=typeof a.originalEvent.touches){var g=a.originalEvent.touches[0];o=t.drag_horizontal?(g.pageX-i.offset().left)/s*100:(g.pageY-i.offset().top)/d*100;\n", + "}t.split_horizontal?(i.find(\".g-img-after\").css(\"left\",o+\"%\"),i.find(\".g-img-divider\").css(\"left\",o+\"%\")):(i.find(\".g-img-after\").css(\"top\",o+\"%\"),i.find(\".g-img-divider\").css(\"top\",o+\"%\")),\n", + "t.hide_message&&r.is(\":visible\")&&r.fadeOut()}).on(\"mouseleave touchend touchcancel\",function(e){var a=i.data(\"reset-timer\"),n=i.find(\".g-img-divider span\");\n", + "t.reset&&(a||(a=window.setTimeout(function(){t.split_horizontal?(i.find(\".g-img-after\").animate({left:\"50%\"},500),i.find(\".g-img-divider\").animate({left:\"50%\"\n", + "},500,function(){n.fadeIn()})):(i.find(\".g-img-after\").animate({top:\"50%\"},500),i.find(\".g-img-divider\").animate({top:\"50%\"},500,function(){n.fadeIn()})),\n", + "i.data(\"reset-timer\",!1)},t.reset_delay),i.data(\"reset-timer\",a)))})}),this}}(jQuery);\n", + "\n", "var div_str = '';\n", "//div_str = '<style> .g-before-after{position:relative;overflow:hidden}.g-before-after img{display:block}.g-before-after .g-img-before{float:left}.g-before-after .g-img-after,.g-before-after.g-vertical .g-img-after{position:absolute;top:0;right:0;left:50%;bottom:0;overflow:hidden}.g-before-after .g-img-after img{position:absolute;right:0;top:0}.g-before-after .g-img-divider{position:absolute;left:50%;top:0;bottom:0;width:0;border-left:1px solid #fff;border-right:1px solid #fff}.g-before-after .g-img-divider>span{position:absolute;top:50%;display:block;background-color:#fff;padding:5px 10px;line-height:1;text-align:center;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.g-before-after.g-vertical .g-img-after{top:50%;left:0}.g-before-after.g-vertical .g-img-after img{position:absolute;right:auto;top:auto;left:0;bottom:0}.g-before-after.g-vertical .g-img-divider{position:absolute;left:0;top:50%;bottom:auto;right:0;height:0;width:100%;border-top:1px solid #fff;border-bottom:1px solid #fff;border-left:0 none;border-right:0 none}.g-before-after.g-vertical .g-img-divider>span{top:50%;left:50%} </style>'\n", "//div_str += '<script>$(\\'#div_compare_containerx\\').beforeafter(); </script>';\n", @@ -4947,7 +4995,7 @@ "name": "python", "nbconvert_exporter": "python", "pygments_lexer": "ipython3", - "version": "3.6.7" + "version": "3.7.3" }, "toc": { "base_numbering": 1, diff --git a/band_structure_visualization.ipynb b/band_structure_visualization.ipynb index c78ff91f874a77ef49c5feed6f698083e86cfc78..ed030659ac79ccca86c83b2d5368ec3be6deeb33 100644 --- a/band_structure_visualization.ipynb +++ b/band_structure_visualization.ipynb @@ -829,7 +829,7 @@ " {\n", " for(var system in result_json[i_key])\n", " {\n", - " //Get the path to the data files (json): https://labdev-nomad.esc.rzg.mpg.de/fairdi/nomad/migration/api/archive/upload_id/calc_id \n", + " //Get the path to the data files (json): https://labdev-nomad.esc.rzg.mpg.de/fairdi/nomad/migration/api/archive/upload_id/calc_id \n", " path = \"https://labdev-nomad.esc.rzg.mpg.de/fairdi/nomad/migration/api/archive/\" + result_json[i_key][system][\"upload_id\"] + \"/\" + result_json[i_key][system][\"calc_id\"]\n", " paths.push(path);\n", " \n", @@ -906,7 +906,7 @@ }, { "cell_type": "code", - "execution_count": 131, + "execution_count": 1, "metadata": { "tags": [ "process_band_dos_data" @@ -1749,7 +1749,7 @@ }, { "cell_type": "code", - "execution_count": 132, + "execution_count": 2, "metadata": { "scrolled": false, "tags": [ @@ -2107,12 +2107,24 @@ "\n", " var compare_list = [];\n", " compare_list = make_compare_list();\n", - " //[i_material_1, i_material_2] = make_compare_list();\n", " i_material_1 = compare_list[0];\n", " i_material_2 = compare_list[1];\n", - " //document.getElementById(\"demo\").innerHTML = \"In add info compare:\" + i_material_1.toString() + i_material_2.toString();\n", - " compare_figures(i_material_1, i_material_2); \n", + " if((i_material_1 == -1) || (i_material_2 == -1))\n", + " {\n", + " var str = '<b><font size = \"5pt\" color=\"#940000\">Error: Please select two materials before comparison.</font></b><br>';\n", + " document.getElementById(\"div_compare_errormsg\").innerHTML = str;\n", + " document.getElementById(\"div_compare_containerx1\").innerHTML = \"\";\n", + " document.getElementById(\"div_compare_containerx2\").innerHTML = \"\";\n", + " document.getElementById(\"div_compare_info1\").innerHTML = \"\";\n", + " document.getElementById(\"div_compare_info2\").innerHTML = \"\"; \n", + " str = \"\";\n", + " return;\n", + " \n", + " }\n", + " document.getElementById(\"div_compare_errormsg\").innerHTML = \"\";\n", + " compare_figures(i_material_1, i_material_2); \n", " }\n", + "\n", " function make_compare_list()\n", " {\n", " //get the links to the images\n", @@ -2134,8 +2146,8 @@ " //str += beakerx.image_band_links[i];\n", " }\n", " }\n", - " var i_material_1 = 0;\n", - " var i_material_2 = 0;\n", + " var i_material_1 = -1;\n", + " var i_material_2 = -1;\n", " //document.getElementById(\"demo\").innerHTML = 'In making comare list';\n", " image_band_links_selected = images_selected_links;\n", " //document.getElementById(\"demo\").innerHTML = 'In making comare list: next';\n", @@ -2168,11 +2180,20 @@ "\n", " function compare_figures(i_material_1, i_material_2)\n", " {\n", + " \n", + " var promise = Promise.resolve();\n", + " promise\n", + " .then(Jupyter.notebook.execute_cells(window.findCellIndicesByTag('js_compare_slide')))\n", + " .then(add_info_compare(i_material_1, i_material_2))\n", + " .then(document.getElementById(\"div_compare_container\").scrollIntoView({ behavior: 'smooth' }))\n", + " .then(document.getElementById(\"div_compare_container\").scrollTop += 50);\n", + " /*\n", " Jupyter.notebook.execute_cells(window.findCellIndicesByTag('js_query_beforeafter'));\n", " Jupyter.notebook.execute_cells(window.findCellIndicesByTag('js_compare_slide'));\n", " add_info_compare(i_material_1, i_material_2);\n", " document.getElementById(\"div_compare_container\").scrollIntoView({ behavior: 'smooth' }); \n", " document.getElementById(\"div_compare_container\").scrollTop += 50;\n", + " */\n", "\n", " }\n", "\n", @@ -2216,19 +2237,17 @@ " function add_info_compare(i,j)\n", " {\n", "\n", - " div_info_id = \"div_compare_info\";\n", + " \n", " var str = '';\n", "\n", " if_same_scale = check_compare_scale(i_material_1, i_material_2);\n", " if(if_same_scale == -1)\n", " {\n", - " str = '<b><font size = \"15pt\" color=\"#940000\">Error: Different lower/upper limits.</font></b><br>';\n", - " document.getElementById(\"div_compare_container\").innerHTML = str;\n", - " document.getElementById(div_info_id).innerHTML = '';\n", - " return;\n", + " str = '<b><font size = \"5pt\" color=\"#940000\">Warning: Different lower/upper limits.</font></b><br>';\n", + " document.getElementById(\"div_compare_errormsg\").innerHTML = str;\n", " }\n", - "\n", - " str += \"<br><b><font-size:15pt>Information of the first calculation (left):</font></b> <br>\";\n", + " \n", + " document.getElementById(\"div_compare_errormsg\").innerHTML = \"\";\n", " str += \"<br> <b>Atom labels:</b>     \" + info_obj_all[i][\"atom_labels\"];\n", " //str += \"<br> <b>Space group:</b>     \" + info_obj_all[i][\"space_group_symbol\"];\n", " //str += \"<br> <b>Lattice constants (in Ang):</b>     \" + info_obj_all[i][\"lattice_constant\"];\n", @@ -2236,15 +2255,17 @@ " str += \"<br> <b>Basis set type:</b>    \" + info_obj_all[i][\"program_basis_set_type\"];\n", " str += \"<br> <b>Functional:</b>    \" + info_obj_all[i][\"XC_functional_name\"];\n", " str += \"<br> <b>Number of <i>k</i> points per inverse distance:</b>    \" + band_obj_all[j][\"average_N_k_points_per_inverse_distance\"].toFixed(3);\n", - " str += \"<br><br><br><b><font-size:15pt>Information of the second calculation (right):</font></b><br>\";\n", - " str += \"<br> <b>Atom labels:</b>     \" + info_obj_all[j][\"atom_labels\"];\n", + " document.getElementById(\"div_compare_info1\").innerHTML = str;// + origData[\"atom_labels\"];\n", + " \n", + " str = \"<br> <b>Atom labels:</b>     \" + info_obj_all[j][\"atom_labels\"];\n", " //str += \"<br> <b>Space group:</b>     \" + info_obj_all[j][\"space_group_symbol\"];\n", " //str += \"<br> <b>Lattice constants (in Ang):</b>     \" + info_obj_all[j][\"lattice_constant\"];\n", " str += \"<br> <b>Program name:</b>    \" + info_obj_all[j][\"program_name\"].toUpperCase();\n", " str += \"<br> <b>Basis set type:</b>    \" + info_obj_all[j][\"program_basis_set_type\"]; \n", " str += \"<br> <b>Functional:</b>    \" + info_obj_all[j][\"XC_functional_name\"];\n", " str += \"<br> <b>Number of <i>k</i> points per inverse distance:</b>    \" + band_obj_all[j][\"average_N_k_points_per_inverse_distance\"].toFixed(3);\n", - " document.getElementById(div_info_id).innerHTML = str;// + origData[\"atom_labels\"];\n", + " \n", + " document.getElementById(\"div_compare_info2\").innerHTML = str;// + origData[\"atom_labels\"];\n", " }\n", "\n", "\n", @@ -2325,8 +2346,10 @@ "\n", " upperlim_id = \"upperlimit\" + i_material;\n", " document.getElementById(upperlim_id).innerHTML =\"10.0\";\n", + " upperlim = document.getElementById(upperlim_id).value = 10.0;\n", " lowerlim_id = \"lowerlimit\" + i_material;\n", " document.getElementById(lowerlim_id).innerHTML =\"-10.0\";\n", + " upperlim = document.getElementById(lowerlim_id).value = -10.0;\n", "\n", "\n", " //document.getElementById(\"demoa\").innerHTML =i_material;\n", @@ -2349,8 +2372,10 @@ "\n", " upperlim_id = \"upperlimit\" + i_material;\n", " document.getElementById(upperlim_id).innerHTML =\"100.0\";\n", + " upperlim = document.getElementById(upperlim_id).value = 100.0;\n", " lowerlim_id = \"lowerlimit\" + i_material;\n", " document.getElementById(lowerlim_id).innerHTML =\"-100.0\";\n", + " upperlim = document.getElementById(lowerlim_id).value = -100.0;\n", "\n", " //document.getElementById(\"demoa\").innerHTML =i_material;\n", " var checkbox_VBM_id = \"checkbox_VBM\" + i.toString();\n", @@ -2506,7 +2531,7 @@ " <p style=\"color: #20335d;font-weight: 100; font-size: 18pt;\"> Select two materials in the checkbox on the right for comparison:</p>\n", " <p style=\"color: #000;font-weight: 1000; font-size: 8pt;\"></p>\n", " <button class = \"button\" onclick = \"clean_compare_list()\"> Clean selections </button> \n", - " <button class = \"button\" onclick = \"compare();compare()\" title = \"Select 2 materials in the checkbox below and compare: please make sure that the upper/lower limits are the same (using Rescale/Autoscale buttons).\" > Compare</button>\n", + " <button class = \"button\" onclick = \"compare()\" title = \"Select 2 materials in the checkbox below and compare: please make sure that the upper/lower limits are the same (using Rescale/Autoscale buttons).\" > Compare</button>\n", "</div>\n", "\n", "\n", @@ -2524,9 +2549,26 @@ "<div id = \"div_compare\" style = \"position: fixed; top: 20%; left: 10%; width: 1200px; height: 600px; z-index: 999999; border: 1px solid #555; background-color: #fff; display: none\" onclick = \"$(this).fadeOut(500)\"> \n", " \n", " <div style = \"float: right; width: 80px; height: 25px; margin-top: 10px; margin-right: 10px; z-index: 1000000; border: 1px solid #555; text-align: center; vertical-align: middle; background-color: #f9f9f9; font-size:12pt; font-color: #000; cursor:pointer;\" > CLOSE </div> <!--button to close the div-->\n", - " <div id = \"div_compare_info\" style = \" width: 350px; height: 500px; float: right; margin-top: 50px; margin-right: 10px; z-index: 10000000;\"></div>\n", - " <div id = \"div_compare_container\" style = \"margin-top: 50px; margin-left: 100px; width: 600px; height: 300px;\">\n", - " <div class=\"g-before-after\" id = \"div_compare_containerx\"></div>\n", + " <div id = \"div_compare_container\" style = \"margin-top: 50px; margin-left: 100px; width: 1200px; height: 600px;\">\n", + " <div id = \"div_compare_errormsg\"></div>\n", + " <table>\n", + " <tr>\n", + " <td>\n", + " <div id = \"div_compare_containerx1\"></div> \n", + " </td>\n", + " <td>\n", + " <div id = \"div_compare_containerx2\"></div> \n", + " </td>\n", + " </tr>\n", + " <tr>\n", + " <td>\n", + " <div id = \"div_compare_info1\" style = \"z-index: 10000000;\"></div>\n", + " </td>\n", + " <td>\n", + " <div id = \"div_compare_info2\" style = \"z-index: 10000000;\"></div> \n", + " </td>\n", + " </tr>\n", + " </table>\n", " </div>\n", "</div>\n", "\n", @@ -2896,12 +2938,24 @@ "\n", " var compare_list = [];\n", " compare_list = make_compare_list();\n", - " //[i_material_1, i_material_2] = make_compare_list();\n", " i_material_1 = compare_list[0];\n", " i_material_2 = compare_list[1];\n", - " //document.getElementById(\"demo\").innerHTML = \"In add info compare:\" + i_material_1.toString() + i_material_2.toString();\n", - " compare_figures(i_material_1, i_material_2); \n", + " if((i_material_1 == -1) || (i_material_2 == -1))\n", + " {\n", + " var str = '<b><font size = \"5pt\" color=\"#940000\">Error: Please select two materials before comparison.</font></b><br>';\n", + " document.getElementById(\"div_compare_errormsg\").innerHTML = str;\n", + " document.getElementById(\"div_compare_containerx1\").innerHTML = \"\";\n", + " document.getElementById(\"div_compare_containerx2\").innerHTML = \"\";\n", + " document.getElementById(\"div_compare_info1\").innerHTML = \"\";\n", + " document.getElementById(\"div_compare_info2\").innerHTML = \"\"; \n", + " str = \"\";\n", + " return;\n", + " \n", + " }\n", + " document.getElementById(\"div_compare_errormsg\").innerHTML = \"\";\n", + " compare_figures(i_material_1, i_material_2); \n", " }\n", + "\n", " function make_compare_list()\n", " {\n", " //get the links to the images\n", @@ -2923,8 +2977,8 @@ " //str += beakerx.image_band_links[i];\n", " }\n", " }\n", - " var i_material_1 = 0;\n", - " var i_material_2 = 0;\n", + " var i_material_1 = -1;\n", + " var i_material_2 = -1;\n", " //document.getElementById(\"demo\").innerHTML = 'In making comare list';\n", " image_band_links_selected = images_selected_links;\n", " //document.getElementById(\"demo\").innerHTML = 'In making comare list: next';\n", @@ -2957,11 +3011,20 @@ "\n", " function compare_figures(i_material_1, i_material_2)\n", " {\n", + " \n", + " var promise = Promise.resolve();\n", + " promise\n", + " .then(Jupyter.notebook.execute_cells(window.findCellIndicesByTag('js_compare_slide')))\n", + " .then(add_info_compare(i_material_1, i_material_2))\n", + " .then(document.getElementById(\"div_compare_container\").scrollIntoView({ behavior: 'smooth' }))\n", + " .then(document.getElementById(\"div_compare_container\").scrollTop += 50);\n", + " /*\n", " Jupyter.notebook.execute_cells(window.findCellIndicesByTag('js_query_beforeafter'));\n", " Jupyter.notebook.execute_cells(window.findCellIndicesByTag('js_compare_slide'));\n", " add_info_compare(i_material_1, i_material_2);\n", " document.getElementById(\"div_compare_container\").scrollIntoView({ behavior: 'smooth' }); \n", " document.getElementById(\"div_compare_container\").scrollTop += 50;\n", + " */\n", "\n", " }\n", "\n", @@ -3005,19 +3068,17 @@ " function add_info_compare(i,j)\n", " {\n", "\n", - " div_info_id = \"div_compare_info\";\n", + " \n", " var str = '';\n", "\n", " if_same_scale = check_compare_scale(i_material_1, i_material_2);\n", " if(if_same_scale == -1)\n", " {\n", - " str = '<b><font size = \"15pt\" color=\"#940000\">Error: Different lower/upper limits.</font></b><br>';\n", - " document.getElementById(\"div_compare_container\").innerHTML = str;\n", - " document.getElementById(div_info_id).innerHTML = '';\n", - " return;\n", + " str = '<b><font size = \"5pt\" color=\"#940000\">Warning: Different lower/upper limits.</font></b><br>';\n", + " document.getElementById(\"div_compare_errormsg\").innerHTML = str;\n", " }\n", - "\n", - " str += \"<br><b><font-size:15pt>Information of the first calculation (left):</font></b> <br>\";\n", + " \n", + " document.getElementById(\"div_compare_errormsg\").innerHTML = \"\";\n", " str += \"<br> <b>Atom labels:</b>     \" + info_obj_all[i][\"atom_labels\"];\n", " //str += \"<br> <b>Space group:</b>     \" + info_obj_all[i][\"space_group_symbol\"];\n", " //str += \"<br> <b>Lattice constants (in Ang):</b>     \" + info_obj_all[i][\"lattice_constant\"];\n", @@ -3025,15 +3086,17 @@ " str += \"<br> <b>Basis set type:</b>    \" + info_obj_all[i][\"program_basis_set_type\"];\n", " str += \"<br> <b>Functional:</b>    \" + info_obj_all[i][\"XC_functional_name\"];\n", " str += \"<br> <b>Number of <i>k</i> points per inverse distance:</b>    \" + band_obj_all[j][\"average_N_k_points_per_inverse_distance\"].toFixed(3);\n", - " str += \"<br><br><br><b><font-size:15pt>Information of the second calculation (right):</font></b><br>\";\n", - " str += \"<br> <b>Atom labels:</b>     \" + info_obj_all[j][\"atom_labels\"];\n", + " document.getElementById(\"div_compare_info1\").innerHTML = str;// + origData[\"atom_labels\"];\n", + " \n", + " str = \"<br> <b>Atom labels:</b>     \" + info_obj_all[j][\"atom_labels\"];\n", " //str += \"<br> <b>Space group:</b>     \" + info_obj_all[j][\"space_group_symbol\"];\n", " //str += \"<br> <b>Lattice constants (in Ang):</b>     \" + info_obj_all[j][\"lattice_constant\"];\n", " str += \"<br> <b>Program name:</b>    \" + info_obj_all[j][\"program_name\"].toUpperCase();\n", " str += \"<br> <b>Basis set type:</b>    \" + info_obj_all[j][\"program_basis_set_type\"]; \n", " str += \"<br> <b>Functional:</b>    \" + info_obj_all[j][\"XC_functional_name\"];\n", " str += \"<br> <b>Number of <i>k</i> points per inverse distance:</b>    \" + band_obj_all[j][\"average_N_k_points_per_inverse_distance\"].toFixed(3);\n", - " document.getElementById(div_info_id).innerHTML = str;// + origData[\"atom_labels\"];\n", + " \n", + " document.getElementById(\"div_compare_info2\").innerHTML = str;// + origData[\"atom_labels\"];\n", " }\n", "\n", "\n", @@ -3114,8 +3177,10 @@ "\n", " upperlim_id = \"upperlimit\" + i_material;\n", " document.getElementById(upperlim_id).innerHTML =\"10.0\";\n", + " upperlim = document.getElementById(upperlim_id).value = 10.0;\n", " lowerlim_id = \"lowerlimit\" + i_material;\n", " document.getElementById(lowerlim_id).innerHTML =\"-10.0\";\n", + " upperlim = document.getElementById(lowerlim_id).value = -10.0;\n", "\n", "\n", " //document.getElementById(\"demoa\").innerHTML =i_material;\n", @@ -3138,8 +3203,10 @@ "\n", " upperlim_id = \"upperlimit\" + i_material;\n", " document.getElementById(upperlim_id).innerHTML =\"100.0\";\n", + " upperlim = document.getElementById(upperlim_id).value = 100.0;\n", " lowerlim_id = \"lowerlimit\" + i_material;\n", " document.getElementById(lowerlim_id).innerHTML =\"-100.0\";\n", + " upperlim = document.getElementById(lowerlim_id).value = -100.0;\n", "\n", " //document.getElementById(\"demoa\").innerHTML =i_material;\n", " var checkbox_VBM_id = \"checkbox_VBM\" + i.toString();\n", @@ -3295,7 +3362,7 @@ " <p style=\"color: #20335d;font-weight: 100; font-size: 18pt;\"> Select two materials in the checkbox on the right for comparison:</p>\n", " <p style=\"color: #000;font-weight: 1000; font-size: 8pt;\"></p>\n", " <button class = \"button\" onclick = \"clean_compare_list()\"> Clean selections </button> \n", - " <button class = \"button\" onclick = \"compare();compare()\" title = \"Select 2 materials in the checkbox below and compare: please make sure that the upper/lower limits are the same (using Rescale/Autoscale buttons).\" > Compare</button>\n", + " <button class = \"button\" onclick = \"compare()\" title = \"Select 2 materials in the checkbox below and compare: please make sure that the upper/lower limits are the same (using Rescale/Autoscale buttons).\" > Compare</button>\n", "</div>\n", "\n", "\n", @@ -3313,9 +3380,26 @@ "<div id = \"div_compare\" style = \"position: fixed; top: 20%; left: 10%; width: 1200px; height: 600px; z-index: 999999; border: 1px solid #555; background-color: #fff; display: none\" onclick = \"$(this).fadeOut(500)\"> \n", " \n", " <div style = \"float: right; width: 80px; height: 25px; margin-top: 10px; margin-right: 10px; z-index: 1000000; border: 1px solid #555; text-align: center; vertical-align: middle; background-color: #f9f9f9; font-size:12pt; font-color: #000; cursor:pointer;\" > CLOSE </div> <!--button to close the div-->\n", - " <div id = \"div_compare_info\" style = \" width: 350px; height: 500px; float: right; margin-top: 50px; margin-right: 10px; z-index: 10000000;\"></div>\n", - " <div id = \"div_compare_container\" style = \"margin-top: 50px; margin-left: 100px; width: 600px; height: 300px;\">\n", - " <div class=\"g-before-after\" id = \"div_compare_containerx\"></div>\n", + " <div id = \"div_compare_container\" style = \"margin-top: 50px; margin-left: 100px; width: 1200px; height: 600px;\">\n", + " <div id = \"div_compare_errormsg\"></div>\n", + " <table>\n", + " <tr>\n", + " <td>\n", + " <div id = \"div_compare_containerx1\"></div> \n", + " </td>\n", + " <td>\n", + " <div id = \"div_compare_containerx2\"></div> \n", + " </td>\n", + " </tr>\n", + " <tr>\n", + " <td>\n", + " <div id = \"div_compare_info1\" style = \"z-index: 10000000;\"></div>\n", + " </td>\n", + " <td>\n", + " <div id = \"div_compare_info2\" style = \"z-index: 10000000;\"></div> \n", + " </td>\n", + " </tr>\n", + " </table>\n", " </div>\n", "</div>\n", "\n", @@ -3331,7 +3415,14 @@ }, { "cell_type": "code", - "execution_count": 173, + "execution_count": null, + "metadata": {}, + "outputs": [], + "source": [] + }, + { + "cell_type": "code", + "execution_count": 21, "metadata": { "tags": [ "plot_band" @@ -3660,7 +3751,7 @@ }, { "cell_type": "code", - "execution_count": 174, + "execution_count": 22, "metadata": { "tags": [ "plot_dos" @@ -3929,7 +4020,7 @@ }, { "cell_type": "code", - "execution_count": 167, + "execution_count": 3, "metadata": { "tags": [ "init_jquery" @@ -3956,7 +4047,7 @@ }, { "cell_type": "code", - "execution_count": 168, + "execution_count": 4, "metadata": { "tags": [ "init_flot" @@ -3983,7 +4074,7 @@ }, { "cell_type": "code", - "execution_count": 169, + "execution_count": 5, "metadata": { "tags": [ "init_flot_axislabels" @@ -4010,7 +4101,7 @@ }, { "cell_type": "code", - "execution_count": 170, + "execution_count": 6, "metadata": { "tags": [ "init_flot_navigate" @@ -4064,7 +4155,7 @@ }, { "cell_type": "code", - "execution_count": 149, + "execution_count": 603, "metadata": { "tags": [ "js_query_beforeafter" @@ -4113,7 +4204,7 @@ }, { "cell_type": "code", - "execution_count": 150, + "execution_count": 23, "metadata": { "tags": [ "js_compare_slide" @@ -4124,27 +4215,22 @@ "data": { "application/javascript": [ "var div_str = '';\n", - "//div_str = '<style> .g-before-after{position:relative;overflow:hidden}.g-before-after img{display:block}.g-before-after .g-img-before{float:left}.g-before-after .g-img-after,.g-before-after.g-vertical .g-img-after{position:absolute;top:0;right:0;left:50%;bottom:0;overflow:hidden}.g-before-after .g-img-after img{position:absolute;right:0;top:0}.g-before-after .g-img-divider{position:absolute;left:50%;top:0;bottom:0;width:0;border-left:1px solid #fff;border-right:1px solid #fff}.g-before-after .g-img-divider>span{position:absolute;top:50%;display:block;background-color:#fff;padding:5px 10px;line-height:1;text-align:center;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.g-before-after.g-vertical .g-img-after{top:50%;left:0}.g-before-after.g-vertical .g-img-after img{position:absolute;right:auto;top:auto;left:0;bottom:0}.g-before-after.g-vertical .g-img-divider{position:absolute;left:0;top:50%;bottom:auto;right:0;height:0;width:100%;border-top:1px solid #fff;border-bottom:1px solid #fff;border-left:0 none;border-right:0 none}.g-before-after.g-vertical .g-img-divider>span{top:50%;left:50%} </style>'\n", - "//div_str += '<script>$(\\'#div_compare_containerx\\').beforeafter(); </script>';\n", - "//div_str +='<script type=\\\"text/javascript\\\" src=\\\"https://github.com/jquery/jquery/blob/master/src/jquery.js\\\"></script> '\n", - "//div_str += '<div class=\\\"g-before-after\\\" id=\\\"div_compare_containerx\\\">';\n", "div_str +='<img src = \\\"'\n", "\n", "var src1 = image_band_links_selected[0];\n", "var src2 = image_band_links_selected[1];\n", - "var tmp_src1 = src1;\n", - "var tmp_src2 = src2;\n", - "//src1 = \"https://images4.alphacoders.com/640/640956.jpg\";\n", - "//src2 = \"http://imgmr.com/wp-content/uploads/2016/06/SAO-anime.jpg\";\n", + "\n", "div_str +=src1;\n", - "div_str += '\\\" data-aftersrc=\\\"'\n", + "div_str += '\\\" height=\\\"600\\\" width=\\\"400\\\" >';\n", + "document.getElementById(\"div_compare_containerx1\").innerHTML = div_str;\n", + "div_str ='<img src= \\\"'\n", "div_str +=src2;\n", "//div_str += '\\\"></div>';\n", - "div_str += '\\\"/>';\n", + "div_str += '\\\" height=\\\"600\\\" width=\\\"400\\\">';\n", "//#div_compare_containerx\n", - "document.getElementById(\"div_compare_containerx\").innerHTML = div_str;\n", - "$('#div_compare_containerx').beforeafter({drag_horizontal: false, split_horizontal: false});\n", - "$('#div_compare_containerx').beforeafter({drag_horizontal: false, split_horizontal: false});\n", + "document.getElementById(\"div_compare_containerx2\").innerHTML = div_str;\n", + "//$('#div_compare_containerx').beforeafter({drag_horizontal: false, split_horizontal: false});\n", + "//$('#div_compare_containerx').beforeafter({drag_horizontal: false, split_horizontal: false});\n", "//beakerx.image_band_links[i]\n" ], "text/plain": [ @@ -4158,27 +4244,22 @@ "source": [ "%%javascript\n", "var div_str = '';\n", - "//div_str = '<style> .g-before-after{position:relative;overflow:hidden}.g-before-after img{display:block}.g-before-after .g-img-before{float:left}.g-before-after .g-img-after,.g-before-after.g-vertical .g-img-after{position:absolute;top:0;right:0;left:50%;bottom:0;overflow:hidden}.g-before-after .g-img-after img{position:absolute;right:0;top:0}.g-before-after .g-img-divider{position:absolute;left:50%;top:0;bottom:0;width:0;border-left:1px solid #fff;border-right:1px solid #fff}.g-before-after .g-img-divider>span{position:absolute;top:50%;display:block;background-color:#fff;padding:5px 10px;line-height:1;text-align:center;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.g-before-after.g-vertical .g-img-after{top:50%;left:0}.g-before-after.g-vertical .g-img-after img{position:absolute;right:auto;top:auto;left:0;bottom:0}.g-before-after.g-vertical .g-img-divider{position:absolute;left:0;top:50%;bottom:auto;right:0;height:0;width:100%;border-top:1px solid #fff;border-bottom:1px solid #fff;border-left:0 none;border-right:0 none}.g-before-after.g-vertical .g-img-divider>span{top:50%;left:50%} </style>'\n", - "//div_str += '<script>$(\\'#div_compare_containerx\\').beforeafter(); </script>';\n", - "//div_str +='<script type=\\\"text/javascript\\\" src=\\\"https://github.com/jquery/jquery/blob/master/src/jquery.js\\\"></script> '\n", - "//div_str += '<div class=\\\"g-before-after\\\" id=\\\"div_compare_containerx\\\">';\n", "div_str +='<img src = \\\"'\n", "\n", "var src1 = image_band_links_selected[0];\n", "var src2 = image_band_links_selected[1];\n", - "var tmp_src1 = src1;\n", - "var tmp_src2 = src2;\n", - "//src1 = \"https://images4.alphacoders.com/640/640956.jpg\";\n", - "//src2 = \"http://imgmr.com/wp-content/uploads/2016/06/SAO-anime.jpg\";\n", + "\n", "div_str +=src1;\n", - "div_str += '\\\" data-aftersrc=\\\"'\n", + "div_str += '\\\" height=\\\"600\\\" width=\\\"400\\\" >';\n", + "document.getElementById(\"div_compare_containerx1\").innerHTML = div_str;\n", + "div_str ='<img src= \\\"'\n", "div_str +=src2;\n", "//div_str += '\\\"></div>';\n", - "div_str += '\\\"/>';\n", + "div_str += '\\\" height=\\\"600\\\" width=\\\"400\\\">';\n", "//#div_compare_containerx\n", - "document.getElementById(\"div_compare_containerx\").innerHTML = div_str;\n", - "$('#div_compare_containerx').beforeafter({drag_horizontal: false, split_horizontal: false});\n", - "$('#div_compare_containerx').beforeafter({drag_horizontal: false, split_horizontal: false});\n", + "document.getElementById(\"div_compare_containerx2\").innerHTML = div_str;\n", + "//$('#div_compare_containerx').beforeafter({drag_horizontal: false, split_horizontal: false});\n", + "//$('#div_compare_containerx').beforeafter({drag_horizontal: false, split_horizontal: false});\n", "//beakerx.image_band_links[i]" ] }, @@ -4708,7 +4789,7 @@ " //alert(\"band_obj_all got!\")\n", " var N_bands = Object.size(band_obj_all[i][\"band_y_axis\"]);\n", " var N_k_coors = Object.size(band_obj_all[i][\"band_x_axis\"]);\n", - " alert(band_obj_all[i][\"band_y_axis\"])\n", + " //alert(band_obj_all[i][\"band_y_axis\"])\n", " band_plotdata = [];\n", "\n", " for(var i_band =0; i_band < N_bands; i_band++)\n",