Create C# Wrapper for Javascript Library - c#

I'm looking for an automated way to create a simple C# wrapper for an existing JavaScript library. I want to create a string of JavaScript using a C# class on the server, then send the JavaScript to the client.
Example:
I’m creating charts using the KendoUI JavaScript library. I’m creating the JavaScript to render the charts server side because a single page can render infinitely many charts based on how the user chooses to configure the chart.
The JavaScript string that is being generated server side looks like this (greatly simplified for example):
function createChart() {
$("#chart").kendoChart({
title: {
text: "Chart Title",
},
series: [{
field: "Cost"
}],
categoryAxis: {
field: "StartDate",
}
});
}
Right now my C# code is simply building a string to create the JavaScript string (greatly simplified for example):
private string CreateChartJS(string ChartTitle, string SeriesField, string CategoryField)
{
return "function createChart() { $(\"#chart\").kendoChart({ title: { text: \""+ChartTitle+"\", }, series: [{ field: \""+SeriesField+"\" }], categoryAxis: { field: \""+CategoryField+"\", } }); } ";
}
What I'm looking for is some type of converter/generator tool that can automatically create a simple C# wrapper class from the JavaScript library source code that I'm using. I am well aware of the fact that Telerik already makes a version of their charts for ASP.NET that includes custom made server side wrappers, this is not what I'm looking for as I'm just using the KendoUI as an example.
In the Chrome web developer tools console I can examine the created KendoUI Chart and view all of its properties:
The tool I'm looking for should be able to create a simple C# class out of the properties that are exposed in the screenshot above (in this case, the group of properties I'm looking to configure are the child items of the 'Options' object).
Example of what the generated C# class might look like (greatly simplified for example):
public class KendoChartWrapper
{
public class options
{
public bool autoBind { get; set; }
public class axisDefaults { }
public class categoryAxies { }
public class chartArea { }
public class dataSource { }
public class legend { }
public string name { get; set; }
public class navigator { }
public class plotArea { }
public string prefix { get; set; }
public string renderAs { get; set; }
}
}
This would allow me to create my chart JavaScript by creating an instance of the class in C# and serializing the result. What I'm looking for should be able to create these simple C# classes given the source code of any javascript library (examples: jQuery, jQuery UI, etc...).
I'm guessing that there is already an existing tool that can do this, I just don't know what it is called. I'm hoping someone can point me in the right direction.

Is it just the options you want as a JavaScript object? If it is just the options you want then on the server you can serialize the object to a JSON using:
string json = Newtonsoft.Json.JsonConvert.Serialize(YourObject)
Then when you receive this at the Javascript end you can turn this into a JavaScript object and use it for your chart options using:
var options = JSON.parse(json);
$("#chart").kendoChart(options);
Available on modern browsers and you can get a fallback for older browsers

I found exactly what I was looking for: http://jsonclassgenerator.codeplex.com/

Related

Convert json to C# classes with generic property

I have json data as below:
{
status: "success",
data: {
custid1: 723,
custid2: 670,
custid3: 430
}
}
As per https://json2csharp.com/, C# classes should be like below:
// Root myDeserializedClass = JsonConvert.DeserializeObject<Root>(myJsonResponse);
public class Data {
public int custid1 { get; set; }
public int custid2 { get; set; }
public int custid3 { get; set; }
}
public class Root {
public string status { get; set; }
public Data data { get; set; }
}
But I dont like Data class above, it has custid1, custid2 as hard coded. I know here json data is like that so classes are generated accordingly but can we make some generic design which can parse below line?
var result = JsonConvert.DeserializeObject<Root>(json);
I feel that tools like Json2CSharp.com are only intended for scaffolding and prototyping rather than for directly-usable C# code. So go ahead and use it to quickly create initial code for your project, but you likely will need to tweak it for production use - in this case one of those tweaks you need to make is to change data: entry in the Root DTO class from having its own class Data to being a Dictionary<String,Int32> instead so that it can accommodate the dynamic nature of the data: property in production JSON data.
Side-note: You should use PascalCase for all class properties in your C# code - but you can configure your JSON serializer to automatically map the camelCase properties in the JSON.
If you're using Newtonsoft.Json then use CamelCaseNamingStrategy or set an explicit [JsonProperty( "camelCaseName" )]. You don't even have to do this manually because JSON2CSharp.com can do it automatically for you:
It's in the Options menu next to the Convert button:

How to bind and call method of c# obejct in React component class

I am having a Cefsharp container in which I am loading a react app hosted on my local node server. I have regeisterd a c# object in my .net project as shown below:-
browser.JavascriptObjectRepository.Register("bound", new Client(), isAsync: true, options: BindingOptions.DefaultBinder);
now in one of my react component class I want to refer a method of that C# object. What I am doing is I am trying to access that using
componentWillMount() {
this.invoke();
}
async invoke() {
const message = await window.bound.message();
this.setState({selectedItem: message});
}
And here is my C# object:-
public class Client
{
public string Id { get; set; }
public string Name { get; set; }
public string Message()
{
return "ClientABCD";
}
}
But this is not working. I am getting "bound is not defined error". I have gone through dozens of articles but most of them are referring to CefSharp library in their HTML file which is part of their .Net project. But in my case I don't have any HTML file nor I have any CefSharp library at react side. Does 'bound' gets bind with window object in javascript? Please suggest.

Converting JSON data into an object

I am very new to this.Pardon me if I make any mistakes.
I have data in JSON form.Can I read this data directly and use it in C# code ?
From what I understood from reading up on the internet,I think I have to convert it into an object form to use the data.Am I right ?
If yes,Then I saw this method to convert as below :
string data = JsonConvert.DeserializeObject<string>(getmyissue());
getmyissue is the function which returns a string which has data in json format.
This gives me an exception saying
"Error reading string.Unexpected Token."
Can someone guide me where am I going wrong ?
EDIT
MyIssue.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
namespace Example
{
public class MyIssue
{
public string name{get;set;}
public string description { get; set; }
public string created { get;set; }
public string updated{get;set;}
public string displayName { get; set; }
}
}
Program.cs
MyIssue obj=null;
try
{
obj = JsonConvert.DeserializeObject<MyIssue>(manager.getmyissue());
}
catch(Exception e)
{
Console.WriteLine(e.Message);
}
Console.WriteLine("Name: "+obj.name);
The easiest way to de-serialize Json in a C#/.NET program is to use the brilliant NewtonSoft JSON library.
There are numerous ways to do it, but I have to admit that the NS libs just get on with the task (and no I'm not a member of the team etc, just an Avid User :-) ).
To do what you want for example, if you had:
{'Name': 'A person', 'AllowAccess': true,'Areas': ['Sales','Admin']}
You would first build an object to represent it as follows:
public MyObject
{
public string Name { get; set; }
public bool AllowAccess { get; set; }
public List<string> Areas { get; set; }
}
Once you've done this, it's a simple case of just doing the following:
string jsonString = "// Your json formated string data goes here";
MyObject myObject = JsonConvert.DeserializeObject<MyObject>(jsonString);
The properties in your object should at that point, reflect the properties in the JSON data you sent to it.
You will of course need to add the NS JSON Libs to your project, either via NuGet or Manually, which ever is easier for you, everything you need to know about that is here:
How to install JSON.NET using NuGet?
The really good thing about NS JSON however is not the ease of use, but the fact that it can also do dynamic de-serialization.
This comes in handy if you've no idea what to expect in the JSON you receive, and so don't know ahead of time how to construct an object to hold the results.
Rather than repeat what others have said however, you can find more information of doing things dynamically in this stack overflow post:
Deserializing JSON using JSon.NET with dynamic data
Update
Looking at your JSON data you have way more fields/properties in there than your trying to parse, and none of the libraries in common use (To the best of my knowledge) will pick and choose the fields to copy, you either have an object that represents them all, or not at all, the later of which I believe is the problem your facing.
I have a rather neat "JSON" plug in for chrome, than when given a chunk of JSON data formats the output for me nicely and makes it easy to read, it also helps massively when defining objects, allowing you to see the full nested structure of your data, here are a series of images showing your JSON data formatted using this plugin:
I'm not going to paste anymore images in, but that goes on for another 4 pages!!
Now, some extra information that may help you.
I know from experience (I had to write a parser in PHP for these Jira webhooks) that within the Jira control panel, you can configure your webhooks to ONLY return the information your interested in.
Right now, it looks like you've just told the system to dump everything, for every event that you've hooked too (Which looks like - all of them), it's been a while since I did any work with these, but as well as a global webhook, you also have individual webhooks, which only fire on specific events and produce JSON data that's very much smaller than what your dealing with here.
I'd therefore advise you, to take a look in your Jira control panel (Or ask your Admin/Lead Dev/etc to take a look) and seriously trim down as much of that data as you can.
Further more, if memory serves me right, you can also make various web API calls to the Jira service to get this info too, and in that case you can tell the API exactly what your interested in, meaning it will only return the fields you need.
Right now, your main problem is the sheer volume of data your trying to deal with, if you tackle that problem, you'll find the issues surrounding the code your trying to get working will be very much easier to deal with.
Update 2
Just to make it clearer what I mean by using a "dynamic" type to get at your data, you would use something like the following code:
string jsonString = "// Your json formated string data goes here";
var result = JsonConvert.DeserializeObject<dynamic>(jsonString);
The difference here is that your using the C# dynamic type rather than a strongly typed object of your own design.
"dynamic" is useful, because it's kind of like having an empty object, and then having the properties added for you, without you having to define it.
What this essentially means is that, if you pass in the following JSON:
{'Name': 'A person', 'AllowAccess': true,'Areas': ['Sales','Admin']}
You'll end up with a dynamic object that looks like:
result = dynamic
{
public string Name { get; set; }
public bool AllowAccess { get; set; }
public List<string> Areas { get; set; }
}
thus:
result.Name
will get you access to the contents of the Name field and so on.
If your JSON was then changed to become:
{'Name': 'A person', 'AllowAccess': true,'Areas': ['Sales','Admin'], 'Location': 'The World' }
Your object would magically have a property called 'Location' containing the value 'The World' which you could access using:
result.Location
In your case, this would allow you to define your concrete object EG:
public MyObject
{
public string Name { get; set; }
public string Email { get; set; }
}
and then do something like the following (Assuming that your inbound JSON had properties in called Name & Email):
string jsonString = "// Your json formated string data goes here";
var result = JsonConvert.DeserializeObject<dynamic>(jsonString);
MyObject myObject = new MyObject
{
Name = result.Name,
Email = result.Email
}
You'd then discard the dynamic object as you'd not need it anymore.
The BIG problem your going to have with this approach is maintaining your models. Manual property assignment is all fine and dandy for a small handful of properties and objects, but it soon becomes a huge maintenance nightmare as your software grows.
I'm sure it doesn't take much to imagine what kind of task you'd be facing if you had to do this for 100 different JSON requests and 50 different types of objects.
For this reason, using this approach you should really consider using some kind of mapping technology such as "AutoMapper", however for now I'm going to advise you leave that until later before you start researching it, as it'll not help you to be clear about dealing with this dynamic approach.
The JSON you get is already a string, so converting it to string doesn't make much sense. You need to create classes that reflect the structure represented by the JSON string.
For example to convert the following JSON into objects, you'd have to create a class for the users:
{"user":{"name":"asdf","teamname":"b","email":"c","players":["1","2"]}}
public class User
{
public string name { get; set; }
public string teamname { get; set; }
public string email { get; set; }
public Array players { get; set; }
}
Then you should be able to use this:
JavaScriptSerializer jss= new JavaScriptSerializer();
List<User> users = jss.Deserialize<List<User>>(jsonResponse);

C# - snippet or template to assign all fields/properties quickly?

Quick points for someone who might know the answer - is there a snippet or tool that can quickly generate template code to assign all public fields and/or properties of an object?
Example:
public class SomeBloatedClass
{
public string SomeField1 { get; set; }
public int SomeField2 { get; set; }
// etc...
public string SomeField99 { get; set; }
}
public class TestHarness
{
public SomeBloatedClass CreateTestObject()
{
// Is there a snippet/macro/template that can generate the code to assign
// all public fields/properties so they can be manually assigned quickly?
// Something like this...?
// *Begin auto-generated code
SomeBloatedClass s = new SomeBloatedClass();
s.SomeField1 = ;
s.SomeField2 = ;
// etc..
s.SomeField99 = ;
// *End auto-generated code
return s;
}
}
Third-party tools are fine as long as they integrate into Visual Studio.
Edit: I'm just looking to have the tool create empty assignment statements that I could quickly hand-edit with the appropriate values. Ideally, the solution would use the built-in snippet mechanism to navigate from statement to statement via the TAB key - I couldn't represent that clearly using StackOverflow's editor, but if you've used snippets you should know what I mean).
There is small snippet or tool that can quickly generate template code to assign all public fields and/or properties of an object?
c# property assigner tool.
and behalf of it we can also generate properties of c# ex.( get set )
c# property generator

javascript Highcharts object as a C# class

I've been working with javascript Highcharts and I made a basic 'Chart Builder' app. One of my goals is to have the user create and modify as many options as they like and save those to the db. The main problem I'm having is trying to convert the Highcharts object to a c# class. I've been building it slowly(ie manually) with the parts I need, as I need them, but to eventually get the whole thing converted will take a long time.
Ideally, I'd like to create and setup the whole highcharts options object server side and just send it 100% complete to highcharts
Is there any easy way to do this? Has anyone already done this?
Here is the Highcharts reference page: http://www.highcharts.com/ref/
and this is what I've done so far.
public class Highchart
{
public title title { get; set; }
public plotOptions plotOptions { get; set; }
}
public class title
{
public string text { get; set; }
}
public class plotOptions
{
public series series { get; set; }
}
public class series
{
public string stacking { get; set; }
public string borderColor { get; set; }
public bool shadow { get; set; }
public int borderWidth { get; set; }
}
As you can see, I just started ^_^
Update : The Highcharts .Net library has been updated in December, and is nearly feature complete as per V2.1.9 of the Javascript library.
The .Net library currently has support for multiple axes, point objects, viewstate management after postbacks, click events for points, series etc, and a built in implementation of an AJAX datasource ;) You don't need to write a single line of JS code unless you want to handle click events; you simply code in C#, and the appropriate JS is rendered automatically for you..
Click here to view the Live Demo

Categories

Resources