function makeSlide(slide_num, slide_entry) {
    
    //alert(slide_entry.title);

    var my_Slide = '';
    var my_Pic = extractPicture(slide_entry.body);
    //alert(my_Pic);

    if (slide_num == 0) {
        my_Slide = my_Slide + '<div class="' + 'item active' + '">';
        my_Slide = my_Slide + '<a href="#concept_' + slide_num + '">';
        my_Slide = my_Slide + '<img class="bs-image-base-carousel grayscale" src="' + my_Pic + '" alt="' + slide_entry.title + '">';
        my_Slide = my_Slide + '</a>';
        my_Slide = my_Slide + '<div class="carousel-caption">';
        my_Slide = my_Slide + '<h3 class="text-left">' + slide_entry.title + '</h3>';
        my_Slide = my_Slide + '<p class="text-left">' + slide_entry.description + '</p>';
        my_Slide = my_Slide + '</div>';
        my_Slide = my_Slide + '</div>';
    } else {
        my_Slide = my_Slide + '<div class="' + 'item' + '">';
        my_Slide = my_Slide + '<a href="#concept_' + slide_num + '">';
        my_Slide = my_Slide + '<img class="bs-image-base-carousel grayscale" src="' + my_Pic + '" alt="' + slide_entry.title + '">';
        my_Slide = my_Slide + '</a>';
        my_Slide = my_Slide + '<div class="carousel-caption">';
        my_Slide = my_Slide + '<h3 class="text-left">' + slide_entry.title + '</h3>';
        my_Slide = my_Slide + '<p class="text-left">' + slide_entry.description + '</p>';
        my_Slide = my_Slide + '</div>';
        my_Slide = my_Slide + '</div>';
    }
    //alert(my_Slide);
    return my_Slide;
    
}

function makeIcon(slide_num, slide_entry) {
    
    var my_Icon = '';
    //alert("Icon");
    my_Icon = my_Icon + '<div class="col-xs-1"></div>';
    my_Icon = my_Icon + '<div class="col-xs-2">';
    my_Icon = my_Icon + '<a href="#concept_' + slide_num + '">';
    my_Icon = my_Icon + '<img src="' + slide_entry.image_url + '" class="img-responsive invert" alt="Deposit Data" onmouseover="iconChange(this,0)" onmouseout="iconChange(this, 1)" title="' + slide_entry.title + '">';
    my_Icon = my_Icon + '</a>';
    my_Icon = my_Icon + '</div>';
    my_Icon = my_Icon + '<div class="col-xs-1"></div>';

    return my_Icon;
}

function makeDetail(slide_num, slide_entry, hasmenu) {
    
    //alert("makeDetail");
    
    var myDetail = '';
    var myPic = extractPicture(slide_entry.body);
    
    var myMode = slide_num % 3;
    switch (myMode) {
    case 0:
        {
        myDetail = myDetail + '<div class="row bs-grid-base-color1">';
        break;
            }
    case 1:
        {
        myDetail = myDetail + '<div class="row bs-grid-base-color2">';
        break;
            }
    case 2:
        {
        myDetail = myDetail + '<div class="row bs-grid-base-color3">';
        break;
            }
    }
    
    myDetail = myDetail + '<div class="col-xs-1"></div>';
    myDetail = myDetail + '<div class="col-xs-10" id="concept_' + slide_num + '">';
    myDetail = myDetail + '<h3 class="text-right">' + slide_entry.title + '</h3>';
    myDetail = myDetail + '</div>';
    myDetail = myDetail + '<div class="col-xs-1">';
    myDetail = myDetail + '<a href="#top">';
    if (hasmenu) {
        myDetail = myDetail + '<span class="glyphicon glyphicon-triangle-top" aria-hidden="true"></span>';
        myDetail = myDetail + '<p>Top</p></a>';
        }    
    myDetail = myDetail + '</div>';
    myDetail = myDetail + '</div>';
    //<!-- image -->        
    myDetail = myDetail + '<div class="row">';
    myDetail = myDetail + '<div class="col-xs-1"></div>';
    myDetail = myDetail + '<div class="col-xs-2">';
    myDetail = myDetail + '<a href="' + slide_entry.link + '" title="Read Even More:' + slide_entry.title + '">';
    myDetail = myDetail + '<img src="' + slide_entry.image_url + '" class="img-responsive " title="Read Even More: ' + slide_entry.title + '"></a>';
    myDetail = myDetail + '</div>';
    myDetail = myDetail + '<div class="col-xs-8">';
    myDetail = myDetail + '<blockquote class="blockquote-reverse">';
    myDetail = myDetail + '<p>' + slide_entry.description + '</p>';
    myDetail = myDetail + '</blockquote>';
    myDetail = myDetail + '</div>';
    myDetail = myDetail + '<div class="col-xs-1">';
    if (hasmenu) {
        myDetail = myDetail + '<span class="glyphicon glyphicon-menu-hamburger bs-glyphicon_font" onclick="detailMenu(' + slide_num + ');"></span>';
            }
    myDetail = myDetail + '</div>';
    myDetail = myDetail + '</div>';
    //<!-- main body text-->
    myDetail = myDetail + '<div class="row">';
    myDetail = myDetail + '<div class="col-xs-1"></div>';
    myDetail = myDetail + '<div class="col-xs-10"><div class="panel panel-default"><div class="panel-body text-left">' + slide_entry.body + '</div></div></div>';
    myDetail = myDetail + '<div class="col-xs-1"></div>';
    myDetail = myDetail + '</div>';
    myDetail = myDetail + '<div class="row">';
    myDetail = myDetail + '<div class="col-xs-12"><div class="bs-grid-base-footer"></div>';
    myDetail = myDetail + '</div>';
    myDetail = myDetail + '</div>';
    
    //alert(myDetail);
    
    return myDetail;
    
}

function makeLinkView(myLink, myTitle) {
    
    var myView = '';
    
    //alert(myLink);
    
    myView = myView + '<div class="col-xs-1"></div>';
    myView = myView + '<div class="col-xs-10">';
    myView = myView + '<div class="panel panel-default">';
    myView = myView + '<div class="panel-heading text-left">';
    myView = myView + '<button type="button" class="btn btn-default btn-sm" >';
    myView = myView + '<a href="' + myLink + '" target="_blank" title="Open in a new window">'
    myView = myView + '<span class="glyphicon glyphicon-new-window" aria-hidden="true"></span> Open</button></a>';
    myView = myView + '&nbsp; Detailed document: ' + myTitle;
    myView = myView + '</div>';
    myView = myView + '<div class="panel-body text-left">';
    myView = myView + '<iframe class="bs-grid-frame-content" src="' + myLink + '"></iframe>';
    myView = myView + '</div>';
    myView = myView + '</div>';
    myView = myView + '</div>';
    myView = myView + '<div class="col-xs-1"></div>';
    
    //remember
    //<i class="fa fa-spinner fa-spin"></i>'
    //alert(myView);
    
    return myView;
}

/*function newWindow(){
    
    alert(entry.link);
    //window.open(entry.link, "_blank");
}*/

function detailMenu(unum) {

    //alert(entries[unum].link);
    var target = 'template_onepage.htm?PAGE=' + unum;
    window.open(target, "_blank");
    
}

function extractPicture(picBody) {
    
    var myPic = '';
    var mySrc = 0;
    var myQuote = 0;
    
    mySrc = picBody.indexOf('src=') + 5;
    myPic = picBody.slice(mySrc);
    //alert(myPic);
    myQuote = myPic.indexOf('"');
    myPic = myPic.slice(0, myQuote);
    //alert(myPic);
    return myPic;
    
}

function iconChange(iconitem, flag) {
      
    //alert(iconitem);
    //alert(flag);
    //var iconimg = document.getElementById(iconitem);
    var iconimg = iconitem;
    
    if (flag == 0) {
        //alert("here");
        iconimg.className = "img-responsive huerotate sepia";
    } else {
        iconimg.className = "img-responsive invert";
    }
}