Replacing embedded Silverlight UserControl

[bmcguire]

Hello.

I am wondering if it is possible to add an XAML User Control to an existing aspx project, rather than creating a seperate project specifically for the CSHTML5 User Control?

For background, I have been tasked with replacing an existing Silverlight User Control that is embedded in an aspx page as an object (shown below

Code: Select all

<object
    id="objImageViewer"
    data="data:application/x-silverlight-2,"
    type="application/x-silverlight-2"
    width="100%"
    height="524px">


If it is possible, which References to I need to include.

Thanks,

Bruce.

[JS-Support @Userware]

Dear Bruce,

The CSHTML5 project structure works very similar as the Silverlight project structure:
• In Silverlight, you need a separate Silverlight project to build the XAP file that you will then embedded into your ASPX page.
• In CSHTML5 it is the same: you need a separate CSHTML5 project to build the HTML/JS files that you will then embed into your ASPX page.

To do so, that is, to embed the output of your CSHTML5 project into your ASPX file, do the following:
1. Copy the files that are in the bin/Debug/Output subfolder of your CSHTML5 project folder => into a new folder inside the project that contains your ASPX file.
2. Then, in your ASPX file, create a new <iframe> that points to the files that you copied (more specifically, to the "index.html" file that you copied).

Please feel free to let me know if something is not very clear.

Regards,
JS-Support

[bmcguire]

Good afternoon.

Thanks very much for the information.

Is there a recommended method for passing information into the generated HTML5 frame?

HttpContext.Current.Session was the method I was using previously, but I am not sure if the iframe will be able to get the same session objects.

Thanks,

Bruce.

[JS-Support @Userware]

Dear Bruce,

It is not specific to CSHTML5. You can pass simple values by adding them to the URL of the frame (in the "query string"), and then read them with the following code inside your CSHTML5 project:

Code: Select all

string url = Interop.ExecuteJavaScript("window.location.href");

Alternatively, the content of the iFrame can call methods defined in the host page in order to retrieve information. To do so, use the "window.parent" JavaScript code which gives you access to the "window" object of the host page, as shown here:

Code: Select all

Interop.ExecuteJavaScript("window.parent.MyMethodDefinedInTheParentWindowObject()");

where you must replace "MyMethodDefinedInTheParentWindowObject" with a method you define in the host page.

Regards
JS-Support

[ToddG]

I want to create a new ASP.NET Core Website site that uses a CSHTML style single page application. I see that CSHTML5 creates a sample INDEX.HTML page that I can use as a template, but is there better way to do this? Are there plans to make a CSHTML5 v2 project template that is similar to the ASP.NET Core Website but that references the output of my CSHTML5 Empty Application? Silverlight had this feature for the older aspx projects.

ProjectTemplate.png (94.52 KiB) Viewed 21553 times

I am using version 2 (alpha), and the problem I see is that there are many files in the projects output directory. Some files are clearly from my project file and libraries but others are part of the Bridge framework, and others are part of the CSHTML5 framework. They are all intermingled, rather than being in separate directories.

Am I totally on the wrong track? How should I be doing this?

[JS-Support @Userware]

Hi,

What we usually recommend to do is to add a "Post Build event" on the CSHTML5 project that copies the files that you are interested in from the "bin/Debug/Output" directory of the CSHTML5 project into a directory inside your ASPX project. If you want to use the same naming as in Silverlight, you can create a folder named "ClientBin" inside your ASPX project, and copy all the generated html/js files there.

Here is an example of "Post Build event" that you can add to a CSHTML5 project named "MyCshtml5Project", assuming that your ASPX project is named "MyCshtml5Project.Web":

Code: Select all

xcopy /s /y "$(ProjectDir)$(OutDir)Output\*.*" "$(SolutionDir)\MyCshtml5Project.Web\ClientBin"

You may also be interested to know that you can disable the automatic generation of the file "index.html" by modifying the configuration file named "bridge.json" located in your CSHTML5 project.

Thanks.
Regards

[ToddG]

As long as we are still experiencing a slew of issues where CSHTML5 runs in the simulator but not in the browser, I'm liking the the ability to generate the index.html file so I can debug

I'm going to try this approach - in which I copy all the files into the .Web project's ClientBin directory and then delete the index.html and related files:

Code: Select all


  xcopy /s /y "$(ProjectDir)$(OutDir)Output\*.*" "$(SolutionDir)\MyCshtml5Project.Web\ClientBin"

  del $(SolutionDir)\MyCshtml5Project.Web\ClientBin\index.html"

  del $(SolutionDir)\MyCshtml5Project.Web\ClientBin\index.min.html"



[JS-Support @Userware]

Nice. Thanks a lot for sharing this.