Xibo

Twitter Widget

Asked by aidan calder

Has anyone been able to embed the twitter widget on there Xibo page. I have cut and pasted the html code from the twitter widget setup wizzard .

<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 4,
  interval: 30000,
  width: 'auto',
  height: 300,
  theme: {
    shell: {
      background: '#333333',
      color: '#ffffff'
    },
    tweets: {
      background: '#000000',
      color: '#ffffff',
      links: '#4aed05'
    }
  },
  features: {
    scrollbar: false,
    loop: false,
    live: false,
    behavior: 'all'
  }
}).render().setUser('aldingbourne_t').start();
</script>

I have pasted this into the html box and left the script box as defult.
You will have to excuse my ignorance but have only just started playing around with HTML code (Because of xibo) and realise this may be a really simple fix.

When the page loads in the clinet the region blinks white for a secound then dissapears.

I know we can do an RSS feed but the widget just looks so much better.

We are on the most receant release of xibo server and all machines are running XP

Many thanks for your help

Question information

Language:
English Edit question
Status:
Answered
For:
Xibo Edit question
Assignee:
No assignee Edit question
Last query:
Last reply:
Revision history for this message
Dan Garner (dangarner) said : 		#1

The problem is actually with the widget code... difficult to see how we might be able to fix that inside Xibo. Basically when it returns its HTML for the widget it references everything as //domain/filename, which would work fine in a web browser... but not on Xibo, where it is a local file.

It really needs to return http://domain/filename

I did have an idea that might work out for you....

Put a " " in the html window and all of this code in the script window:

<script type="text/javascript">
function EmbedInit()
{
 // Init will be called when this page is loaded in the client.
 setTimeout(changeUrls, 2000);
 setTimeout(changeImages, 5000);
 return;
}

function changeUrls() {
 $("link").each(function(){ var href = $(this).attr("href"); $(this).attr("href", "http:" + href) });
}

function changeImages() {
 $("img").each(function(){
  var href = $(this).attr("src");

  if (href.indexOf("http:") == -1)
   $(this).attr("src", "http:" + href)
 });
}
</script>
<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 4,
  interval: 30000,
  width: 'auto',
  height: 300,
  theme: {
    shell: {
      background: '#333333',
      color: '#ffffff'
    },
    tweets: {
      background: '#000000',
      color: '#ffffff',
      links: '#4aed05'
    }
  },
  features: {
    scrollbar: false,
    loop: false,
    live: false,
    behavior: 'all'
  }
}).render().setUser('aldingbourne_t').start();
</script>

Revision history for this message
aidan calder (aidanc) said : 		#2

Thanks for the suggestion Dan. I really do appreciate it but unfortunatly the region still flashes white for a secound the displays

" "

at the top of the region.

Looks like the RSS feed will have to do

Revision history for this message
Dan Garner (dangarner) said : 		#3

Yeah, the white flash is the twitter widget pulling in the extra information after the client thinks the entire page has rendered....

I don't know if this is possible, but the Python Client has a Microblog module which looks much nicer than using standard RSS - if you can get this working then it might be a nice thing to try.

Failing that I guess you will have to wait until we have implemented the Microblog into the Window Client (which isn't a priority at the moment unless a sponsor comes forward particularly wanting it).

Can you help with this problem?

Provide an answer of your own, or ask aidan calder for more information if necessary.

To post a message you must log in.