Improve the styles.

open-prophetdb · Apr 7, 2024 · 21b663f · 21b663f
1 parent 46a586e
commit 21b663f
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 8 deletions.
diff --git a/src/proxy/website.rs b/src/proxy/website.rs
@@ -49,7 +49,9 @@ fn get_protein_atlas_redirect_url(
     upstream_host: &str,
 ) -> String {
     let host = Url::parse(upstream_host).unwrap();
-    let raw_redirect_url = host.join(&format!("{}/protein_atlas", PROXY_DATA_PREFIX)).unwrap();
+    let raw_redirect_url = host
+        .join(&format!("{}/protein_atlas", PROXY_DATA_PREFIX))
+        .unwrap();
 
     // We want to open the link same as the proxy link, not a proxy-data link. So we can load it in the same iframe.
     // Such as <a href="/ENSG00000130234-ACE2/tissue" title="Tissue - Enhanced">
@@ -105,10 +107,10 @@ lazy_static::lazy_static! {
             name: "protein_atlas",
             base_url: "https://www.proteinatlas.org",
             get_redirect_url: get_protein_atlas_redirect_url,
-            which_tags: vec!["a", "link", "script", "img", "li[style]", "a[style]", "object[data]"],
-            additional_css: Some(".tabrow { padding-inline-start: unset !important; width: revert !important; } .page_header { visibility: hidden; display: none; } div.atlas_header, div.atlas_border { top: 0px !important; } table.main_table { top: 0px !important; margin: 0 0px 0 200px !important; }div.celltype_detail { width: unset !important; } table.menu_margin, div.menu_margin { margin: 0 !important; } div.page_footer { display: none; } div#cookie_statement { display: none; } div.atlas_header div.atlas_nav.show_small { top: 0px !important; } div.menu { top: 100px !important; left: 0px !important }"),
+            which_tags: vec!["a", "link", "script", "img", "li[style]", "a[style]", "object[data]", "iframe"],
+            additional_css: Some(".tabrow { padding-inline-start: unset !important; width: revert !important; } .page_header { visibility: hidden; display: none; } div.atlas_header, div.atlas_border { top: 0px !important; } table.main_table { top: 0px !important; margin: 0 0px 0 200px !important; }div.celltype_detail { width: unset !important; } table.menu_margin, div.menu_margin { margin: 0 !important; } div.page_footer { display: none; } div#cookie_statement { display: none; } div.atlas_header div.atlas_nav.show_small { top: 0px !important; } div.menu { top: 100px !important; left: 0px !important } div.atlas_header div.gene_name, div.page_header div.gene_name { left: -180px !important; width: 80px !important; } div.atlas_header div.atlas_nav { left: 180px !important; width: 1000px !important; margin: unset !important; padding-top: 0px !important; top: 0px !important; } #NGLViewer { display: none !important; } table.main_table td { padding: 5px !important; }"),
             additional_js: None,
-            enable_redirect: vec!["a[href]", "img[src]", "link[src]", "li[style]", "a[style]", "object[data]"],
+            enable_redirect: vec!["a[href]", "img[src]", "link[src]", "li[style]", "a[style]", "object[data]", "iframe"],
             open_at_new_tab: false,
         });
 
@@ -241,6 +243,21 @@ impl Website {
                         Ok(())
                     }));
                 }
+                "iframe" => {
+                    handlers.push(element!("iframe", |el| {
+                        let src = el
+                            .get_attribute("src")
+                            .ok_or_else(|| anyhow::Error::msg("Missing src attribute"))?;
+                        let modified_url = (self.get_redirect_url)(
+                            &src,
+                            website_baseurl,
+                            self.enable_redirect.contains(&"iframe"),
+                            upstream_host,
+                        );
+                        el.set_attribute("src", &modified_url)?;
+                        Ok(())
+                    }));
+                }
                 "object[data]" => {
                     handlers.push(element!("object[data]", |el| {
                         let object = el

diff --git a/studio/src/NodeInfoPanel/Components/ProteinAtlas/index.tsx b/studio/src/NodeInfoPanel/Components/ProteinAtlas/index.tsx
@@ -36,12 +36,12 @@ const ProteinAtlas: React.FC<ProteinAtlasProps> = (props) => {
   return (
     <div id="iframe-container" style={{ position: 'relative', width: '100%', height: '100%' }}>
       <iframe id={rootId} title="Protein Atlas" src={src}
-        style={{ width: '100%', height: '100%', border: 'none', minHeight: '1000px' }} onLoad={() => {
+        style={{ width: '100%', border: 'none', height: 'calc(100vh - 120px)' }} onLoad={() => {
           setLoading(false)
         }} ref={ref} />
       {
         loading ? <Spin spinning={loading} style={{
-          position: 'absolute', top: 0, left: 0, width: '100%', height: '100%', minHeight: '1000px'
+          position: 'absolute', top: 0, left: 0, width: '100%', height: 'calc(100vh - 120px)', minHeight: '1000px'
         }}></Spin> : null
       }
     </div>

diff --git a/studio/src/NodeInfoPanel/index.tsx b/studio/src/NodeInfoPanel/index.tsx
@@ -131,7 +131,7 @@ const NodeInfoPanel: React.FC<{ node?: GraphNode, hiddenItems?: string[] }> = ({
       //   children: <ExpressionAtlas geneSymbol={geneSymbol} />
       // },
       {
-        label: "Mutation (Cosmic)",
+        label: "Mutation - SangerCosmic",
         key: "mutation",
         children: <SangerCosmic geneSymbol={geneSymbol} />
         // children: <Empty description="Comming soon..." />

diff --git a/studio/src/components/Header/index.tsx b/studio/src/components/Header/index.tsx
@@ -91,7 +91,7 @@ const GlobalHeaderRight: React.FC<GlobalHeaderRightProps> = (props) => {
     //   icon: <UserOutlined />,
     // },
     {
-      label: 'v0.3.1',
+      label: 'v20240406',
       key: 'version',
       icon: <FieldTimeOutlined />
     },