function Riddle(title, body, tag, imageUrl){
  this.title = title;
  this.body = body;
  this.tag = tag;
  this.imageUrl = imageUrl;
}

var riddle = new Riddle('Triangle Missing a Piece', '\n<p>\n  Look at the two images.  They are composed of the exact same pieces (as shown by the colors),\n  and yet somehow the second one is missing an entire piece in the middle.  How is this possible?\n</p>\n', 'triangle-missing-a-piece', 'triangle-missing-a-piece.jpg');

function showRiddle(curRiddle){
  var elem = document.getElementById('riddle_body');
  elem.innerHTML = curRiddle.body;
  var elem = document.getElementById('riddle_title');
  elem.innerHTML = curRiddle.title;
  var elem = document.getElementById('riddle_image');
  if ((curRiddle.imageUrl == null) || (curRiddle.imageUrl == '')){
    elem.innerHTML = '';
  }else{
    elem.innerHTML = '<img style="width:50px;" src="http://www.bigriddles.com/images/riddles/' + curRiddle.imageUrl + '"/>';  
  }
  
  var elem = document.getElementById('riddle_solution');
  elem.innerHTML = '<a href="http://www.bigriddles.com/riddle/' + curRiddle.tag + '">Click here to see the solution.</a>';
}

document.write('&lt;style&gt;\r\n.bigriddles_widget{\r\n  position: relative;\r\n  width:325px;\r\n  padding: 3px 0px 5px 0px;\r\n  border:2px solid #003399;\r\n  color:black;\r\n  background-color:white;\r\n  text-align:right;\r\n}\r\n.bigriddles_widget #riddle_title{\r\n  font-size:130%;\r\n  font-weight:bold;\r\n  padding:1px 5px 1px 5px;\r\n  text-align: left;\r\n}\r\n.bigriddles_widget #riddle_section{\r\n  padding:5px;\r\n  height: 175px;\r\n  overflow: auto;\r\n  text-align: left;\r\n}\r\n.bigriddles_widget #riddle_solution{\r\n  font-weight:bold;\r\n  margin-top:10px;\r\n}\r\n.bigriddles_widget #riddle_nav{\r\n  padding:3px 5px 3px 5px;\r\n  text-align:center;\r\n}\r\n.bigriddles_widget .riddles_signoff{\r\n  font-size:80%;\r\n}\r\n.bigriddles_widget .horiz_sep{\r\n  width:100%;\r\n  height:1px;\r\n  padding:0px;\r\n  margin:0px;\r\n  border-top:1px solid #003399;\r\n}\r\n.bigriddles_widget .smaller{\r\n  font-size:80%;\r\n}\r\n.bigriddles_widget a{\r\n  color: #003399;\r\n  text-decoration: none;\r\n}\r\n.bigriddles_widget a:visited{\r\n  color: #003399;\r\n  text-decoration: none;\r\n}\r\n.bigriddles_widget td{\r\n  color: black;\r\n}\r\n.bigriddles_widget li{\r\n  color: black;\r\n}\r\n&lt;/style&gt;\r\n\r\n&lt;div class=&#34;smaller&#34; style=&#34;float:left;padding:0px 0px 1px 3px;&#34;&gt;\r\n  &lt;a href=&#34;http://www.bigriddles.com&#34;&gt;\r\n    &lt;img src=&#34;http://www.bigriddles.com/images/icon1.png&#34; style=&#34;border:none;&#34; /&gt;\r\n  &lt;/a&gt;\r\n&lt;/div&gt;\r\n&lt;div class=&#34;smaller&#34; style=&#34;float:left;padding-left:3px;&#34;&gt;\r\n  &lt;a href=&#34;http://www.bigriddles.com&#34;&gt;BigRiddles.com&lt;/a&gt;\r\n&lt;/div&gt;\r\n&lt;div class=&#34;smaller&#34; style=&#34;float:right;padding-right:3px;font-weight:bold;&#34;&gt;\r\n  Riddle of the Day\r\n&lt;/div&gt;\r\n&lt;div style=&#34;clear:both;&#34;&gt;&lt;/div&gt;\r\n\r\n&lt;div class=&#34;horiz_sep&#34;&gt;&lt;/div&gt;\r\n&lt;div id=&#34;riddle_title&#34;&gt;&lt;/div&gt;\r\n\r\n&lt;div id=&#34;riddle_section&#34;&gt;\r\n  &lt;div id=&#34;riddle_image&#34; style=&#34;float:right;&#34;&gt;&lt;/div&gt;\r\n  &lt;div id=&#34;riddle_body&#34;&gt;&lt;/div&gt;\r\n  &lt;div id=&#34;riddle_solution&#34;&gt;&lt;/div&gt;\r\n  &lt;div style=&#34;clear:both;&#34;&gt;&lt;/div&gt;\r\n&lt;/div&gt;\r\n     \r\n&lt;div class=&#34;horiz_sep&#34;&gt;&lt;/div&gt;\r\n\r\n&lt;span class=&#34;smaller&#34;&gt;\r\n  &amp;nbsp;&lt;a href=&#34;http://www.bigriddles.com/widgets&#34;&gt;Get this widget&lt;/a&gt; |\r\n&lt;/span&gt;\r\n  \r\n');
showRiddle(riddle);