Learning lessons for Sitecore, C#, .NET, SQL Server

Tuesday, August 27, 2013

How to Show YouTube videos on ASP.NET webpage

Now a days integration of SNS - Social Networking Sites links and feeds to our site is common requirement in almost all web application development.

This article helps how to display Youtube videos on webpage in ASP.NET.

If you are interested in showing Facebook feeds on ASP.NET page then read my article “How to show Facebook feeds on ASP.NET webpage”.

If you are interested in showing Twitter Tweets on ASP.NET page then read my article “How to get Twitter tweets on ASP.NET webpage”.

By searching any keyword in Youtube , Youtube shows all relevant videos in thumbnail with their description.

We need to create similar functianlity in asp.net page.

For this functionality we have to include this javascript in aspx page http://www.yvoschaap.com/ytpage/ytembed.js

We need to call function ytEmbed.init() which is in ytembed.js file.

ytEmbed.init({ 'block': 'youtubeDiv', 'type': 'search', 'q': 'baby laughing', 'results': '4', 'order': 'new_first' });

This function expect JSON string where its different parameter details with values are

· block - obligated ID of the html element (<div id='this_is_the_block_id'>) where you want the results thumbnails to appear.

· type - obligated setting that provides the function you want to execute:

o search - YouTube searches for a video with the string set by 'q'.

o playlist - results of a YouTube playlist set by playlist id in 'q'.

o user - results of a YouTube user videos set by user name in 'q'.

· q - obligated string to identify your results, see 'type' above.

· results - the number of results you want to show.

· order - what comes first:

o new_first - newest videos published on top

o highest_rating - highest rated videos on top

o most_relevance - most relevant videos on top

· player - decide if you want to play the video on youtube.com or embed on your page:

o embed - plays the video on your page.

o link - plays the video on youtube.com

· display_first - display the player and queu first video results (needs player set to embed)

o true

· width: embed player width

· height: embed player height

· layout - how do you want the results to appear:

o thumbnails - only a list of thumbnails as result.

o full - list of results with thumbnail, description, rating and user

Ok OK Ok. Now stop theory , show us code [ Afterall we all are developer who only and mostly intersted in code J]

Get searched keyword from user , query string etc.

I am hard coding here. Lets find all videos on Youtube of great great man Steve Jobs.

protected void Page_Load(object sender, EventArgs e)

{

YoutubeKeyword.Value = "Steve Jobs";

}

Use below ASPX page for displaying Youtube videos in thumbnail

<title>Show Youtube Videos</title>

$(document).ready(function() {

YouTubeFeeds($("#YoutubeKeyword").val());

});

</script>

</head>

<body>

<div>

Youtube Videos</h1>

</div>

<div>

function YouTubeFeeds(YoutubeKeyword) {

ytEmbed.init({ 'block': 'snsYouTube', 'q': YoutubeKeyword, 'type': 'user', 'results': 7, 'order': 'most_relevance', 'player': 'embed', 'layout': 'full' });

}

</script>

</div>

<asp:HiddenField ID="YoutubeKeyword" runat="server"></asp:HiddenField>

</form>

</body>

</html>

Reference :- Most of the stuff are referred from http://www.yvoschaap.com/youtube.html

Please leave your comments or share this tip if it’s useful for you.

Monday, August 26, 2013

Unterminated string constant

I was working today to display message in javascript alert() function.

I was passing message from C# code to javascript function as

protected void btnShow_Click(object sender, EventArgs e)

{

StringBuilder strMsg = new StringBuilder();

strMsg.AppendLine("Product ID: 101");

strMsg.AppendLine("This product is not available.");

strMsg.AppendLine("Please select another product.");

string strMessage = strMsg.ToString();

ScriptManager.RegisterClientScriptBlock(this, typeof(Button), "ShowMessage", "AlertInfo('" + strMessage + "');", true);

}

My Javascript looks like this

function AlertInfo(msg) {

alert(msg);

}

</script>

When I run the code and click on my Show button, browser welcomes me by displaying javascript error as “Unterminated string constant”.

When I investigated it, I come to know that I was using AppendLine method which introduced \r\n newline characters in string message. So my final message looks something like this

Product ID: 101\r\nThis product is not available.\r\nPlease select another product.\r\n

Then I replacess all occureneces of \r\n by space as below

string strMessage = strMsg.ToString();

strMessage = strMessage.Replace("\r\n", " ");

ScriptManager.RegisterClientScriptBlock(this, typeof(Button), "ShowMessage", "AlertInfo('" + strMessage + "');", true);

By replacing \r\n message with space solve my problem

strMessage = strMessage.Replace("\r\n", " ");

So never pass \r\n to javascript variables, parameters, functions.

Please leave your comments or share this tip if it’s useful for you.

Friday, August 23, 2013

How to get Twitter tweets on ASP.NET webpage

Now a days integration of SNS - Social Networking Sites links and feeds to our site is common requirement in almost all web application development.

This article helps how to display Twitter tweets on webpage in ASP.NET.

If you are interested into show Facebook feeds on ASP.NET page then read my article “How to show Facebook feeds on ASP.NET webpage”

Twitter provides API calls to get feeds using Twitter data widget id and twitter link like https://twitter.com/YourTwitterAccountLink

Storing widget id in web.config, database is good place.

protected void Page_Load(object sender, EventArgs e)

{

TwitterID.Value = ConfigurationManager.AppSettings["TwitterID"];

}

Use below ASPX page for displaying Twitter tweets

<title>Show Twitter Tweets</title>

$(document).ready(function() {

$("#TwitterLink").attr("href", "https://twitter.com/YOURTWITTERNAME");

$("#TwitterLink").attr("data-widget-id", $("#TwitterID").val());

TwitterFeeds(document, "script", "twitter-wjs");

});

</script>

</head>

<body>

<div>

Twitter Tweets</h1>

</div>

<div>

<a id="TwitterLink" border="0px" data-border-color="white">Tweets by @XYZ</a>

function TwitterFeeds(d, s, id) {

var js, fjs = d.getElementsByTagName(s)[0];

if (!d.getElementById(id)) {

js = d.createElement(s);

js.id = id;

js.src = "//platform.twitter.com/widgets.js";

fjs.parentNode.insertBefore(js, fjs);

}

</script>

</div>

</div>

<asp:HiddenField ID="TwitterID" runat="server"></asp:HiddenField>

</form>

</body>

</html>

Please leave your comments or share this tip if it’s useful for you.

Thursday, August 22, 2013

How to show Facebook feeds on ASP.NET webpage

Now a days intergation of SNS - Social Networking Sites links and feeds to web site is common requirement in almost all web application development.

This article helps how to display facebook feeds on webpage in ASP.NET.

Facebook provides API calls to get feeds using TOKEN.

Storing token in web.config, database is good place.

protected void Page_Load(object sender, EventArgs e)

{

FacebookToken.Value=ConfigurationManager.AppSettings["FacebookToken"];

}

Use below ASPX page for displaying Facebook feeds

<title>Show Facebook Tags</title>

$(document).ready(function() {

$("#FacebookFeeds").attr("data-href", "http://www.facebook.com/" + $("#FacebookToken").val());

FacebookFeeds(document, 'script', 'facebook-jssdk');

});

</script>

</head>

<body>

<div>

Facebook Feeds</h1>

</div>

<div>

</div>

function FacebookFeeds(d, s, id) {

var js, fjs = d.getElementsByTagName(s)[0];

if (d.getElementById(id)) return;

js = d.createElement(s); js.id = id;

js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";

fjs.parentNode.insertBefore(js, fjs);

}

</script>

<div id="FacebookFeeds" class="fb-like-box" data-width="400" data-height="600" data-border-color="white"

data-show-faces="false" data-stream="true" data-header="false">

</div>

<!—Code Ends Here//-->

</div>

<asp:HiddenField ID="FacebookToken" runat="server"></asp:HiddenField>

</form>

</body>

</html>

Please leave your comments or share this tip if it’s useful for you.

Tuesday, August 20, 2013

How to migrate or upgrade VB project to VB.NET Project

Before .NET, VB was primary language for application development on Windows platform.

Several applications are still running in VB worldwide. End users are habitual with these VB application and don’t want to stop these.

But there are need to change those VB applications to .NET.

However end user / client can’t wait, invest to rewrite all these VB applications to .NET.

So what’s the middle and safe way?

Migration or Upgradation is the only answer. It saves time, money and efforts of both clients as well as developers.

How to migrate or upgrade VB code to VB.NET?

It’s a 5 steps process.

Open VB project file [extension is .VBP] in Visual Studio from either File -> Open -> Project / Solution… or Press Ctrl + Shift + O or click on Open: Project… link on Start Page as below

1. First screen is welcome screen. Just click on Next > button as below

2. This screen asks which type of project you want. Here you have two option – either select .EXE or DLL as per your VB project

3. Specify location of new migrated project

4. At this point, all required information is available to Visual Studio for migration. Click on Next > button as below

5. Last wizard shows you progress of migration.

Build the migrated project.

After migration, visual studio creates Upgrade report with name “_UpgradeReport.htm” in project itself. This is very useful report. One should have to check it as it includes all passed and failed coding area which finally helps to fix migrated errors.

Please leave your comments or share this tip if it’s useful for you.

Learning lessons for Sitecore, C#, .NET, SQL Server

Surendra Sharma

Search This Blog

Tuesday, August 27, 2013

How to Show YouTube videos on ASP.NET webpage

Monday, August 26, 2013

Unterminated string constant

Friday, August 23, 2013

How to get Twitter tweets on ASP.NET webpage

Thursday, August 22, 2013

How to show Facebook feeds on ASP.NET webpage

Tuesday, August 20, 2013

How to migrate or upgrade VB project to VB.NET Project

ebook : SharePoint to Sitecore: Strategy and Implementation