Google Sites Gadget with Javascript - google-sites

Question

I created a simple slideshow script to include on a Google Site for Google+ albums (it uses a library found at: https://sites.google.com/site/scriptsexamples/new-connectors-to-google-services/picasa-services). The test version worked except for the fact that if publish for anonymous access, it displays that aweful "This application was not created by Google" nonsense at the top. As this is a slideshow, I tried finding a way to avoid this. Thus I decided to try my hand at a Gadget. I opted to use Google Gadget Editor and combed through the internet to see how to do this (I am a complete noob with regards to gadgets, so excuse my ignorance...)
In the end I came up with this: http://hosting.gmodules.com/ig/gadgets/file/117039901033759910299/google-plus-slider.xml
Once I insert the gadget, I do not get any error messages and the frame does display on my google site (without the warning message, as far as I can tell), but nothing else happens. And I have no idea why.
Some notes:
the javascript works when it is a google apps script, published and then inserted in my site (but the warning message is ugly)
I have no idea whether it is even possible to call typical GAS calls such as Ui.App in XML gadget - if not, then I will have to learn, but don't know where.
Obviously the library that I am using needs to be loaded - I researched as much as I could but cannot find any way to load the library. The only option I could find was to include specific predefined libraries with the Required tag.
I hope you have all the info and that someone can help! Thanks in advance.

Answer 1

Do you get any Cross-Domain warnings in your console?
I would try and include the external library in your gadget-name.xml file. You're free to include (mostly) whatever JS you like under
<?xml version="1.0" encoding="UTF-8" ?>
<Module>
<ModulePrefs
title="Slider"
height="50"
width="200"
border="none"
/>
<Content type="html">
<![CDATA[
<script type="text/javascript">
function my-slide-show(){
//Dump your lib JS here
}
</script>
<div class="slideshowHtml"></div>
]]>
</Content>
</Module>
This will at least avoid any scoping / Cross origin worries you might be having