import json import os local_url = "http://localhost:8888/frontend/" remote_url = "https://cdn.jsdelivr.net/gh/duerrsimon/vue_3dmol_gradio@v.02/" if os.environ.get("GRADIO_LOCAL") is not None: url = local_url else: url = remote_url def viewer_html(path_to_file, name="input", selectionStyle={"color": "greenCarbon", "representation": "cartoon", "multiple": True}, representations={}): ext = path_to_file.split(".")[-1] with open(path_to_file, "r") as f: data = f.read() moldata = {"moldata": [{"data": data, "name": name, "selectionStyle": selectionStyle,"format": ext, "selectable": True, "asFrames":False, "clickable": False}] } # dict to json moldata = json.dumps(moldata) representations = json.dumps(representations) return """ Molecule View
Resampling the whole PDB file, select residues in the sequence view to resample only parts of the structure Resampling the selected residues
 Very high ({{confidenceLabel}} > 90)
 Confident (90 > {{confidenceLabel}} > 70)
 Low (70 > {{confidenceLabel}} > 50)
 Very low ({{confidenceLabel}} < 50)
{{aa.resn}}
Settings
{{config[setting]}}
Representations
Expand selection
Å
Full residue
Only sidechain
""" import os import subprocess import shlex def get_color(i): colors= ["orange", "cyan", "blue", "yellow", "magenta"] return colors[i % len(colors)]+"Carbon" def output_html(path_to_file,path_to_designs,metrics, resample_idx="",mode="unconditional", selectionStyle={"color": "greenCarbon", "representation": "cartoon", "multiple": True}): if mode=="conditional": ext = path_to_file.split(".")[-1] with open(path_to_file, "r") as f: data = f.read() moldata = [{"data": data, "name": os.path.basename(path_to_file), "selectionStyle": selectionStyle, "format": ext, "selectable": True, "asFrames":False, "clickable": False}] representations = [{ "model": 0, "chain": "", "resname": "", "style": "cartoon", "color": "whiteCarbon", "residue_range": "", "around": 0, "byres": False, "visible": False, }] if resample_idx!="": representations.append({ "model": 0, "chain": "", "resname": "", "style": "cartoon", "color": "greenCarbon", "residue_range": resample_idx[1:-1], #remove leading and trailing quotes "around": 0, "byres": False, "visible": False, }) # move file from temp to save dir subprocess.run(shlex.split(f"cp {path_to_file} {os.path.dirname(path_to_designs[0])}/template.pdb")) path_to_file = f"{os.path.dirname(path_to_designs[0])}/template.pdb" designs = [{ "model":0, "name":"template.pdb", "fullpath": path_to_file, "len":76, "metric":{ "resample idx": resample_idx[1:-1], }, "visible":True, "color":"gray" }] add_index = 1 else: designs = [] moldata = [] representations = [] add_index = 0 for i,d in enumerate(path_to_designs): ext = d.split(".")[-1] with open(d, "r") as f: data = f.read() moldata.append({"data": data, "name": os.path.basename(d), "selectionStyle": selectionStyle, "format": ext, "selectable": True, "asFrames":False, "clickable": False}) representations.append({ "model": i+add_index, "chain": "", "resname": "", "style": "cartoon", "color": get_color(i), "residue_range": "", "around": 0, "byres": False, "visible": False, }) designs.append({ "model":i+add_index, "fullpath": d, "name":os.path.basename(d), "metric":metrics[i], "visible":True, "color":"" }) # dict to json moldata = json.dumps(moldata) representations = json.dumps(representations) designs = json.dumps(designs) return """ Molecule View
 Very high ({{confidenceLabel}} > 90)
 Confident (90 > {{confidenceLabel}} > 70)
 Low (70 > {{confidenceLabel}} > 50)
 Very low ({{confidenceLabel}} < 50)
{{aa.resn}}
Settings
{{config[setting]}}
Representations
Expand selection
Å
Full residue
Only sidechain
{{d.model}}{{d.name}} {{k}}: {{v}}
""" load_js = """ async () => { // create empty textarea with id selectedAtoms that is hidden // and append it to the body var selectedAtoms = document.createElement("textarea"); selectedAtoms.id = "selectedAtoms"; selectedAtoms.style.display = "none"; document.body.appendChild(selectedAtoms); window.onmessage = function(e) { selectedAtoms.value = JSON.stringify(e.data); }; } """ get_js = """ async (resample_idxs) => { var selectedAtoms = document.getElementById("selectedAtoms"); var selectedAtomsValue = selectedAtoms.value; var hasNumber = /\d/; if (hasNumber.test(selectedAtomsValue)==false) { selectedAtomsValue = resample_idxs.replace(/.$/,' "') } return selectedAtomsValue; } """