Creating a widget - c#

Hi i want to create a widget which can be embedded on other websites similar to the twitter profile widget, an example is here;
http://twitter.com/about/resources/widgets/widget_profile
The way i would approach this is to return the data in json format via my wcf, the problem is looking at the twitter example there seems to be some javascript and i am not to clued up on the purpose. My question to the more experienced devlopers is am i on the right track and what else will i need to do. Thanks alot

The purpose of the javascript would be to actually call your wcf service to retrieve data and write the html results to the screen. In the twitter example, many options are set inside a javascript object that is used to manage the configuration (background color, username, etc). You can return json, and then take the values from json and plug them into an html template on the client side. If you want this to be used on other sites however, I would probably avoid the use of jquery as you can't be sure the user has included it, and so you would need to include it. And then you have versioning issues if you use an older version, and the website your widget is on wants to use a newer version.

There is an interesting blog post that explains how to create a widget, loading jquery and css safely, making JSONP calls and more:
How to build a web widget (using jQuery)

Related

jQuery.load() with sitefinity

I'm going to develop a website which uses ajax to load pages. The cms behind it, is going to be Sitefinity. The problem is I don't know if it's possible to load the pages of sitefinity with jQuery.Load() or any other ajax technique.
Problems with sitefinity:
- I'm able to get the page object of sitefinity, but i need the rendered HTML.
- I'm going to make the pages in the CMS and each page will have a html, header, body tag etc. And I just need the main content of the page, so i'll have to strip the html aswell!
I've been searching alot, but haven't encountered a solution. If someone could give me tips where to search, or how to do it, I'll appreciate it alot!
A more efficient way to pull the pages in would be to connect to the Sitefinity WCF service with jQuery. You will receive JSON page data via AJAX that you can use to compose your page.
Your project's /Sitefinity/services/ folder is filled with .svc service files that you can query to get various items such as pages (/Sitefinity/services/pages/PagesService.svc/), images, blog posts, etc.
The documentation for using those services from jQuery is a little sparse at this point, but they are actively being improved.
See: Sitefinity Documentation Calling Sitefinity RESTful WCF services from Client Side
And this is a good example (non specific to Sitefinity) on how to call WCF services from jQuery.
One note: Sitefinity is very modular and serves pages and content items separately, you may need to query for a page first to find out what content items need to be queried.
Ask on the SiteFinity support forums. The devs are pretty good about answering questions on there.
Yes, it's possible to retrieve content from Sitefinity via .load(). You can use only a portion of the returned document by doing something like the example below.
$('#empty-container').load('sitefinity-page #main-content');

Creating a Chatbox with AJAX, HTML and C#?

I am using the Nancy Web Framework in my C# Console Application to basically create a Web Administration panel for my software. I have opted to use the Spark View Engine, as it is basically just HTML. I basically want to create a chatbox, except pull the data written to my application's console every X seconds and display it in a box instead.
I have very little experience with JQuery and AJAX, but they aren't overly complicated from the examples I have seen. The issue I am running into is that ALL of the chatbox and shoutbox examples use PHP.
I basically just need something like this...
The only difference is I need to pull the information from my application instead. I can use basic C# methods inside of the HTML (and probably inside of javascript but I haven't tried this). What would be the best way to do this, and are there any examples floating around that don't use PHP?
This was completed using AJAX and JSON.
Well, to use HTML for styling inside some PC program is just not wise. It has much better UI engines, though. But for your information here is nice jQuery shoutbox tutorial, but well, you only need to handle data input and output with C#, so actually I see no problems. The engine which you are using should have some kind of data stream, or requests handler (bla://program/???)

Implementing UpdatePanel manually

I was reading an article that shows how bad CodePlex uses UpdatePanels and how nice is StackOverflow on this matter when, for example, a user upvotes an answer/question.
I wonder if someone can point a tutorial on how to do such action.
I know some points:
Create a Web Service that gets the action value and ouputs a JSON string
Build the javascript inside <ajax:ScripManager> control to replace the correct value on the page with the new value
But, even in the first I have difficulties, I can send a JSON string, but it will always be surrounded with XML information!
Can anyone (or maybe Jeff) point to a nice "how-to" since scratch? Thank you.
Well, I doubt StackOverflow uses UpdatePanel - more likely it uses jQuery / load to simply update a div, using ASP.NET MVC as the source (rather than ASP.NET vanilla, which has a more complex page cycle).
With this approach, it is trivial... the jQuery examples tab largely says it all.
Re returning the Json - that is simply return Json(obj); from the controller in ASP.NET MVC - but personally I'd return the html (simpler).
Before you dismiss the UpdatePanel I suggest you have a read of this post I did - http://www.aaron-powell.com/blog/august-2008/optimising-updatepanels.aspx. It looks at how to optimise UpdatePanels and it can lead to some performance increases if done well.
I also did a post - http://www.aaron-powell.com/blog/august-2008/paging-data-client-side.aspx which looks at doing client-side templating with jQuery and MS AJAX. I look at how to read a web service with JavaScript and if you download the sample you'll see how to send data client-side to a web service.
But this video cast on the ASP.NET website may also be of use - http://www.asp.net/learn/ajax-videos/video-82.aspx. It's on how to extend web services for script service capabilities.

Google Maps - Easy way in ASP.Net?

I'm wanting to use google maps and see a million ways to do it on the web. Some are javascript methods and some are asp.net server components with which I have hit and miss luck. What's the easiest and most reliable way using c# and asp.net?
I have my location data including geocodes in a database. I want to provide users a method to do a lookup for certain locations. From there, my code will provide a table of geocodes to google maps with markers on the map corresponding to the found entries. Users can see each entry and need to be able to tell which is which if multiple rows are returned.
Is there a good way to do this?
The Google Maps API is accessed via JavaScript (any server controls are just abstracting this away from you). In the case you described, you would need to dynamically output the required JavaScript to tell the maps API what to display.
See http://dotnet.sys-con.com/node/171162
There are a few server controls to do it, like this, but you have to learn how to do things in one way (server control) or another (Javascript Google API).
I recommend using the Google API, since it has more samples all over the web, and you can use new features implemented by Google right after they release them and don't have to wait for the server control developer to do it.
I would recommend using direct JavaScript to create the Google Maps. It's fairly straight forward and then you will be able to understand what's going on behind the scenes.
Google has some pretty good tutorials and documentation to get you up and running quick. Once you add one to your site, it will become very easy to setup the rest of the customization that you need.
Take a look at this site for examples.
http://code.google.com/apis/maps/documentation/examples/
As usual I point to ComponentOne who has a nice SilverLight control for this that can use google-maps or Microsofts Live Maps, it uses Silverlight Deep Zoom to handle it nicely:
http://www.componentone.com/SuperProducts/MapsSilverlight/
Live example:
http://demo.componentone.com/Silverlight/Factories/
(I'm not from ComponentOne, just a satisfied customer) ;)
I know you can do it yourself with scripts and other ways, but its just so much more fun to use code allreade written. ;)
Best .NET Wrapper for Google Maps or Yahoo Maps?
BTW: I found a great post here that has an example on how to do a store lookup. Works really well. I recommend!!
http://blog.donnfelker.com/post/HOWTO-Build-a-Store-Locator-in-ASPNET.aspx
Check out this example: Data driven Google Maps in ASP.Net
I used ASP.Net Ajax to create a web-service that is callable from JavaScript.
The web-service talks to the database and fills a very basic object. ASP.Net Ajax, then makes the object available to my client javascript. The rest is easy: In the client, you call the webservice from Javascript, read the data returned and populate Google Maps, using simple Google Maps API calls.
Check out the site at link text
Please, try my GoogleMaps control for ASP.NET

Silverlight and a form application

I wondering if a can make a form with silverlight like an HTML form and submit its data to a server to store them on a database.
Can I do that?
Thanks!
You can definately do this. But you cannot talk to a server directly via Silverlight like you can with ASP.Net. You have to use web services to achieve this.
There are a number of ways to do this:
1. Use Web Services (Old ASMX; This has security issues)
2. Use WCF (For complex systems)
3. Use ADO.Net Data Services (This is probably the easiest and fastest way to achieve this) using ADO.Net Entity Framework.
4. Use RIA Services (In CTP now for Silverlight 3)
Just take a look at some videos over here:
http://silverlight.net/learn/videocat.aspx?cat=2#HDI2WebServices
basically, you build your data model with Linq (or some other orm), expose that data through Select/Update/Delete/... methods with web service (new WCF or old one, ASMX), and consume that in silverlight. Silverlight automatically make proxy classes for communication. In Silverlight, you can use it's rich databinding capabilities, so you do not need to worry about how data are transferred, serialized, read from UI and similar.
Video tutorials on silverlight.net web explains most of stuff regarding programming SL2 really good.
You can always host the sliverlight app in a web page which the forms app loads.
It may be possible to directly intergrate WPF and forms as well.
Or you aren't running ASP.NET on the server like everybody always seems to assume you are and therefore don't use all these darned "Web Service" things, you can just use WebClient and make your POST that way.
...I dont know why everybody thinks there is a need to layer on so many heaps of acronym goo between you and your webserver. Your old javascript code wasn't interfacing with your backend using WCF, SOAP or whatever, why should Silverlight? Keep it simple! Silverlight is more than happy to make regular, old-fashioned, time-tested HTTP POST's.
And not to be shameless, I've been working on a library I use in my projects to make it easier to call your backend like you would have if you were using javascript: WebBuddy.
Actually there is an easy way to do make an html page in silverlight and fill it with data and post it to the server. it will use Silverlight browser interop to programmatically create an HTML and set elements to it.
//Creates a blank html document
var htmldoc = System.Windows.Browser.HtmlPage.Document;
// Returns a Reference type to the body of html page
var body = htmldoc.Body;
// Create a <form> element and add it to the body
var newForm = htmldoc.CreateElement("form");
newForm.SetAttribute("action", targetUrl);
newForm.SetAttribute("method", "post");
body.AppendChild(newForm);
//Add your elements to your form
HtmlElement input1 = htmldoc.CreateElement("input");
input1.SetAttribute("type", "hidden");
input1.SetAttribute("name", "someName");
input1.SetAttribute("value", "someValue");
newForm.AppendChild(input1);
//submit your form
newForm.Invoke("submit");
That Simple!
original Answer: This Answer

Categories

Resources