Show Google Doc in a custom panel if it has been linked to a work item

Hi Alan,

Yes you can, here's an example: https://app2.clarizen.com/Clarizen/View/Default.aspx?id=1py0yvxp4bqpn65j9r7kzittg61&type=Published+Application&ver=v6

This app shows the file details page, so you'll have to use Javascript to hide the other page elements (masthead etc.)

Good luck!

Tamir

Hmmm, very close -- but I'm hoping to actually show the file viewer in the custom panel, not just a link to it.

never mind, I was looking at the wrong thing. Thank you! Awesome!

Okay, I'm stuck again -- I can't use javascript when injecting a URL into the custom panel, only if I'm injecting HTML. Any way around that?

Hi Alan,

Yes - just put the URL in an iframe and then try to inject the JS.

Good luck!

Tamir

I actually tried that but it wraps it in a nested iframe, so the javascript doesn't apply to the correct page. I also tried injecting the page using:

html: <div id="content"></div>
script:jQuery(document).ready(function(){
jQuery("#content").load("src","{GetObjectUrl(fileToView)}")
});

but I got an error:

Oops, an unexpected error occurred.<br /> The error was logged and will be examined.<br />The <b>error id</b> is: 3bVibFCGSELPrerluA5LJA

Hi Alan,

I'm not JS expert but I would try something like put the URL in and iFrame (e.g. ID=file1),

and then use a script to fix the styles.

function fixStyles()
{
if (this && this.contentDocument)
{
var header = this.contentDocument.getElementById("HeaderWrapper"),
siteWrapper = this.contentDocument.getElementById("siteWrapper"),
contentWrapper = this.contentDocument.getElementById("contentWrapper");
if (header)
header.style.display = "none";
if (siteWrapper)
siteWrapper.style.background = "none";
if (contentWrapper)
contentWrapper.style.top = "30px";
}
}
frames["file1"].onload = fixStyles;

Please let me know if that worked.

Good luck!

Tamir

Thanks Tamir, that got me on the right track. I ended up using the following:

function fixStyles() {
var inDoc = document.getElementById('injectedFrame').contentWindow.document;
var el = window.frames["injectedFrame"].document.getElementById("siteWrapper");
el.style.left = "0";
var hideTheseIDs = [ "ObjectProperties", "ObjectProperties_content", "dockedRelationsPanel", "extended-relation-inline-RLTDENTSCA", "extended-relation-inline-Followers", "extended-relation-inline-RLTDENTRGE", "ObjectDetailsLayout_AddButton" ];
for ( i=0; i < hideTheseIDs.length; i++ ) {
window.frames["injectedFrame"].document.getElementById(hideTheseIDs[i]).style.display = 'none';
}
return false;
};

jQuery(document).ready(function(){
jQuery("iframe").load(function() {
fixStyles();
});
});

That's great Alan!