Please find below the javascript that I´m using to generate post summaries (excerpts) on my blogger's blog. Can someone help me add extra code to it, to avoid including the image captation on the summary/excerpt? I didn´t find solutions on the web for BLOGGER...
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID, pURL, pTITLE){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span class="posts-thumb" style="float:left; margin-right: 10px;"><img src="'+img[0].src+'" class="pbtthumbimg"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
Related
I'm new to both Progress and JavaScript. I'm getting elements from a temp-table in Progress using json. I'll show part of my code.
$.post({
url: gWS + "/bass/bass054.p",
data: {
"process": "<?php echo $process; ?>"
},
success: function(data){
var table = document.getElementById("table");
var j = 0;
var dataProc = "";
var qtProc = 0;
var item = "";
var sumQt = 0;
var qt_total = 0;
var idGrp = "";
for (var i = 0; i < data["tt-base"].length; i++) {
var row = table.insertRow(j+2);
if (data["tt-base"][i]["cod_id_bloco_edi"] != idGrp && i>=2) {
if (sumQt == qt_total) {
row.style.background = "green";
} else {
row.style.background = "#ff0000";
}
row.insertCell(0).innerHTML = "<b>QT TOTAL:</b>";
row.insertCell(1).innerHTML = "<b>" + item + "</b>";
row.insertCell(2).innerHTML = "<b>" + sumQt + "</b>";
row.insertCell(3).colSpan = "2";
row.insertCell(4).innerHTML = "<b>" + qt_total + "</b>";
sumQt = 0;
j++;
row = table.insertRow(j+2);
}
if (data["tt-base"][i]["cdn_segment_edi"] == 44) {
row.style.background = "#00ff00";
dataProc = data["tt-base"][i]["dsl_dados_entr_edi"].substring(7,9) + "/" + data["tt-base"][i]["dsl_dados_entr_edi"].substring(5,7) + "/20" + data["tt-base"][i]["dsl_dados_entr_edi"].substring(3,5) + "</div>";
qtProc = parseInt(data["tt-base"][i]["dsl_dados_entr_edi"].substring(11,20), 10) + "</div>";
row.insertCell(0).innerHTML = dataProc;
row.insertCell(1).innerHTML = qtProc;
row.insertCell(2).innerHTML = " ";
row.insertCell(3).colSpan = "2";
row.insertCell(4).innerHTML = "<div class='p6'> </div>";
j++;
sumQt = parseInt(sumQt,10) + parseInt(qtProc,10);
} else if (data["tt-base"][i]["cdn_segment_edi"] == 446) {
if (data["tt-base"][i]["dsl_dados_entr_edi"].indexOf("PRE") == 10) {
document.getElementById("table").deleteRow(j+1);
j--;
row = table.insertRow(j+2);
row.style.background = "#0099CC";
row.insertCell(0).innerHTML = dataProc;
row.insertCell(1).innerHTML = qtProc;
row.insertCell(2).innerHTML = "PREVIS";
row.insertCell(3).colSpan = "2";
row.insertCell(4).innerHTML = "<div class='p6'> </div>";
dataProc = '';
qtProc = 0;
j++;
} else if (data["tt-base"][i]["dsl_dados_entr_edi"].indexOf("FIR") == 10) {
document.getElementById("table").deleteRow(j+1);
j--;
row = table.insertRow(j+2);
row.style.background = "#00ff00";
row.insertCell(0).innerHTML = dataProc;
row.insertCell(1).innerHTML = qtProc;
row.insertCell(2).innerHTML = "FIRM";
row.insertCell(3).colSpan = "2";
row.insertCell(4).innerHTML = "<div class='p6'> </div>";
dataProc = '';
qtProc = 0;
j++;
}
}
idGrp = data["tt-base"][i]["cod_id_bloco_edi"];
}
}
}).fail(function() {
alert("Not Possible.");
})
So, instead of deleting the row as I'm doing it now I'd like to replace the previous only the cells with the FIRM and PREVIS. I tried using only row.insertCell(2).innerHTML = "PREVIS"; but it didn't work correctly.
Is there any suggestion as to how can I do it? Sorry if I'm not clear enough as i'm new to all this. Thanks for your time.
I managed to do what I wanted after tweaking for hours, lol.
Instead of using insertRow or insertCell, I just used the following
table.rows[j+2].style.background = "#0099CC";
table.rows[j+2].cells[2].innerHTML = "PREVIS";
This way, I was able to replace the content of what I wanted. I still have to change some other details, but the most difficult part is finally gone. Sorry if I wasted your time, but writing here has helped me to see the code in a different angle. I hope my code can help other people.
I have used following code to develop sentence grammar practice. When I click button then order should to maintained. I want it when button clicked then it should hide but after click on top button again show up.
Move sentence to left if there is blank. Also show button again if words clicked again.
Should using only buttons for showing at top also at bottom?
<html>
<head>
<title>
</title>
</head>
<body>
<div id="sen">I am learning JavaScript by developing a simple project.</div>
<br>
<div id="dash"></div>
<br>
<div id="container"></div>
<div id="val"></div>
<script>
var sen = document.getElementById("sen").innerHTML;
var senTrim = sen.trim();
var senArr = senTrim.split(/\s+/);
var dashElement = "";
for(i=0;i<senArr.length;i++)
{
//alert(senArr[i]);
dashElement += "<div onclick='funDiv(this.id);' style='display: inline'" + "id = dashid" + i + ">" + '__ ' + '</div>';
}
var dash = document.getElementById("dash");
dash.innerHTML = dashElement;
//var dashID = document.getElementById("dashid0").innerHTML;
//var dash1 = document.getElementById("val");
//dash1.innerHTML= dashID;
var htmlElements = "";
for (var i = 0; i < senArr.length; i++) {
htmlElements += "<button onclick='fun(this.id);' id = 'btn" + i + "'>" + senArr[i] + '</button>';
}
var container = document.getElementById("container");
container.innerHTML = htmlElements;
var ii = 0;
function funDiv(clicked){
//alert(clicked);
var inText = document.getElementById(clicked).innerHTML;
document.getElementById(clicked).innerHTML = " __ " ;
ii--;
}
function fun(clicked){
//alert(clicked);
document.getElementById(clicked).style.display = "none";
document.getElementById("dashid" + ii).innerHTML = document.getElementById(clicked).innerHTML + " ";
//document.getElementById(clicked).remove();
ii++;
}
</script>
</script>
</body>
</html>
How about something like this?
<html>
<body>
<div id="sen">I am learning JavaScript by developing a simple project.</div>
<br>
<div id="dash"></div>
<br>
<div id="container"></div>
<div id="val"></div>
<script>
var sen = document.getElementById("sen").innerHTML;
var senTrim = sen.trim();
var senArr = senTrim.split(/\s+/);
var dashElement = "";
for (var i = 0; i < senArr.length; i++) {
dashElement += `<div onclick='dashClick(this.id);' style='display: inline' id=dash${i}> __ </div>`;
}
var dash = document.getElementById("dash");
dash.innerHTML = dashElement;
var htmlElements = "";
for (var i = 0; i < senArr.length; i++) {
htmlElements += "<button onclick='btnClick(this.id);' id = 'btn" + i + "'>" + senArr[i] + '</button>';
}
var container = document.getElementById("container");
container.innerHTML = htmlElements;
var picked = 0;
function dashClick(clicked) {
const dash = document.getElementById(clicked);
dash.innerHTML = " __ ";
const btn = document.getElementById(`btn${dash.btnId}`);
btn.style.display = "inline";
picked--;
}
function btnClick(clicked) {
var btnId = clicked.replace('btn', '');
document.getElementById(clicked).style.display = "none";
const dash = document.getElementById("dash" + picked)
dash.innerHTML = document.getElementById(clicked).innerHTML + " ";
dash.btnId = btnId;
picked++;
}
</script>
</body>
</html>
I have implemented it using appendChild and remove functions of JavaScript.
<html>
<body>
<div id="sen">I am learning JavaScript by developing a simple project.</div>
<br>
<div id="dash"></div>
<br>
<div id="container"></div>
<script>
var sen = document.getElementById("sen").innerHTML;
var senTrim = sen.trim();
var senArr = senTrim.split(/\s+/);
var dashElement = "";
var btnElements = "";
for (var i = 0; i < senArr.length; i++) {
btnElements += "<button onclick='btnClick(this.id);' id = 'btn" + i + "'> " + senArr[i] + ' </button>';
}
var container = document.getElementById("container");
container.innerHTML = btnElements;
var picked = 0;
function dashClick(clicked) {
//console.log(clicked);
var buttons = document.getElementsByTagName('button');
var dash = document.getElementById("dash");
dashChild = dash.childNodes;
console.log(document.getElementById(clicked).innerText);
for(i=0;i<senArr.length;i++){
if(document.getElementById(clicked).innerText.trim() == buttons[i].innerText.trim()){
//console.log("Match");
buttons[i].style.opacity = "1";
buttons[i].style.pointerEvents = "auto";
}
}
document.getElementById(clicked).remove(); // remove clicked text
}
// Button click
function btnClick(clicked) {
var dashElement = document.createElement("div");
var text = document.getElementById(clicked).innerText;
dashElement.style.display = "inline";
dashElement.innerHTML = "<div style='display: inline' onclick='dashClick(this.id);' id=" + picked +"> " + text + " </div>"; // add text at top of button
document.getElementById("dash").appendChild(dashElement);
picked++;
document.getElementById(clicked).style.opacity = "0"; //hide button that has been clicked
document.getElementById(clicked).style.pointerEvents = "none";
}
</script>
</body>
</html>
I am using this code on my blogger blog.This is the javascript-
<script type='text/javascript'>
var thumbnail_mode = & quot;
yes & quot;; //yes -with thumbnail, no -no thumbnail
summary_noimg = 430; //summary length when no image
summary_img = 340; //summary length when with image
img_thumb_height = 200;
img_thumb_width = 200;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx, chop) {
if (strx.indexOf("<") != -1) {
var s = strx.split("<");
for (var i = 0; i < s.length; i++) {
if (s[i].indexOf(">") != -1) {
s[i] = s[i].substring(s[i].indexOf(">") + 1, s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length - 1) ? chop : strx.length - 2;
while (strx.charAt(chop - 1) != ' ' && strx.indexOf(' ', chop) != -1) chop++;
strx = strx.substring(0, chop - 1);
return strx + '...';
}
function createSummaryAndThumb(pID) {
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if (thumbnail_mode == "yes") {
if (img.length >= 1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;">
<img src="' + img[0].src + '" width="' + img_thumb_width + 'px" height="' + img_thumb_height + 'px"/>
</span>';
summ = summary_img;
}
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML, summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>
And this is the code i am using in div of post element
<div expr:id='"summary" + data:post.id'>
<data:post.body/>
</div>
<a class='more' expr:href='data:post.url'> read more </a>
<script type='text/javascript'>
createSummaryAndThumb( & quot; summary < data: post.id / > & quot;);
</script>
This is the result:
Twitter is the second most popular social networking site. It is used by celebrities all around world. It is also called a microblogging website... read more
I want read more link just after ' ...' for example-
It is also called a microblogging website... read more
How can i do it, please help me.
Just one solution of many, but give your div prior to the anchor a display:inline; css styling and the anchor will fall to the right of the div content. Either in another included css file, in a style tag, or within the div tag place a style="display:inline".
I have a Site that was built with some scripts from codelifter.com it is a very old site and I need to make one little edit. I did not create the site i am just wondering why the JavaScript popup wont close. If you click on CA you get a coming soon but if you click on TX it opens a popup that will not close.
My question is what line of code do i need to change to get that to close?
Is the issue with the below code?
Thanks
var strGoToUrl = "";
function ShowPopup(strUrl) {
var str = '<table cellspacing="1" cellpadding="2" style="background:black"><tr>';
str += '<td style="background:#ffeccc" width="460">';
str += '<table cellspacing="0" cellpadding="2" width="100%"><tr>';
str += '<td align="right">Close</td>';
str += '</tr><tr>';
str += '<td align="center">';
str += 'TODAY- ASA members can get medical insurance quotes and buy quality, affordable ';
str += 'medical insurance group plans through Benefit Consultants Northwest (BCNW).<br/><br/>';
str += 'Click here for Quotes, Medical plan information and plan selections.<br/>';
str += '<img src="images/bcnw_logo3.gif" width="186" height="60" border="0" /><br/>';
str += 'Automotive Industry Health Insurance Trust (A-HIT) association medical plans ';
str += 'are not currently available in this state.<br/><br/>';
str += '</td></tr></table></td></tr></table>';
strGoToUrl = strUrl;
alert(strGoToUrl);
if (document.getElementById) {
var elem = document.getElementById("popupDiv");
elem.innerHTML = str;
elem.style.display = "block";
ShowRectangularDynamicDropShadow(elem, "#333333", 5);
}
}
function GoToUrl() {
alert(strGoToUrl);
window.location = strGoToUrl;
}
function HidePopup() {
if (document.getElementById) {
var elem = document.getElementById("popupDiv");
HideRectangularDynamicDropShadow(elem);
elem.style.display = "none";
elem.innerhtml = "";
}
}
Try this... Not tested but should work...
<div id="popupDiv">
//Rest of the code
<div id="shadow"></div>
</div>
function ShowPopup(strUrl) {
//rest of the code
shadowDiv = document.getElementById("shadow").style.display = 'block';
ShowRectangularDynamicDropShadow(shadowDiv, "#333333", 5);
//rest of the code
}
function HidePopup() {
if (document.getElementById) {
var elem = document.getElementById("popupDiv");
shadowDiv = document.getElementById("shadow");
HideRectangularDynamicDropShadow(shadowDiv);
elem.style.display = "none";
shadowDiv.style.display = "none";
elem.innerhtml = "";
}
}
On clicking the td class="bgimg", I'm calling another function. How do I add a class to the td which I clicked?
/*This function creates a list of tabs*/
BCL.onSearchResponse = function(jsonData) {
BCL.jsonData = jsonData;
var str = "<table id=\"playlistTable\" cellspacing=\"1\"><tbody><tr>";
var html = "";
for (var i = 0; i < jsonData["items"].length; i++) {
var playlist = jsonData["items"][i];
html = "<td class=\"bgimg\" onclick=\"BCL.onPlaylistSelect(" + i +")\">{{name}}</td>";
str += BCL.markup(html,playlist);
}
str += "</tr></tbody></table>";
//console.log(str);
document.getElementById("results").innerHTML = str;
// load the first playlist
BCL.onPlaylistSelect(0);
}
function hasClass(element,clss) {
return element.className.match(new RegExp('(\\s|^)'+clss+'(\\s|$)'));
}
function addClass(element,clss) {
if (!this.hasClass(element,clss)) element.className += " "+clss;
}
BCL.onPlaylistSelect = function(something, element) {
element.addClass("myClass");
//do stuff
};
BCL.onSearchResponse = function(jsonData) {
BCL.jsonData = jsonData;
var str = "<table id=\"playlistTable\" cellspacing=\"1\"><tbody><tr>";
var html = "";
for (var i = 0; i < jsonData["items"].length; i++) {
var playlist = jsonData["items"][i];
html = "<td class=\"bgimg\" onclick=\"BCL.onPlaylistSelect(" + i +", this)\">{{name}}</td>";
str += BCL.markup(html,playlist);
}
str += "</tr></tbody></table>";
//console.log(str);
document.getElementById("results").innerHTML = str;
// load the first playlist
BCL.onPlaylistSelect(0);
};