convert html code into xaml for RichTextBox in Windows Phone - c#

how can I format this html code:
<p>For the iPhone do the following:
<ul>
<li>Go to AppStore</li>
<li>Search by M&#229lApp</li>
<li>Download</li></ul>
</p><p>
Android To do this:
<ul>
<li>Go to the Market</li>
<li>Search by M&#229lApp</li>
<li>Download</li>
</ul>
</p>
into XAML for RichTextBox in Windows Phone?
Update
so in result it should be:
For the iPhone do the following:
Go to AppStore
Search by M&#229lApp
Download
Android To do this:
Go to the Market
Search by M&#229lApp
Download

In your code you can Replace < li > tags with & # 8226 ;
See http://www.fileformat.info/info/unicode/char/2022/index.htm

The basic approach is to verify the html as valid and then walk the content converting to the XAML equivalent.
There are lots of examples of attempting this online
It is far more performant to do such a conversion on a server and pull the formatted version to the phone and then display with XamlReader.Load.
Update
For each element in the HTML you'll just be adding a new TextBlock to a container (probably a StackPanel) and for the <li> items you'll just want to prefix with a symbol to represent the bullet and adjust the left margin appropriately. You'll probably benefit from defining appropriate styles and then just applying the appropriate style for the element you're converting.

Related

Export contenteditable div data to Word causes blank line

I have a contenteditable div the user enter data. When they enter line break, each browser stores the data differently. When I export this data to Word using HtmlToOpenXml it adds a blank line for the content and I want to avoid that so the html page and word doc look the same.
One option for me is to replace the tags <br>, <div>, <p> with blank and then replace the </div> and </p> with <br/> in the C# code using RegEx. But I do not know what all formatting is used for contenteditable div by different browsers and this implementation may not help.
I would like to know what is the best way to address this or is there any open source tool/dll that helps me with this issue?
e.g. ContentEditable div actual data in browsers looks like below
Chrome -
line1<div>line2</div><div>line3</div>
IE Edge-
<div>line1</div><div>line22</div><div>line3<br></div>
FireFox - I read it uses <p> </p> instead of <div> </div>
Safari - ????
A Solution I found:
You could use RegEx, which I highly recommend in C# for parsing information.
Then effectively based on the formatting you could narrow down what browser it is and then move on towards parsing it's output and what its XML means universally. This will not be easy but no cross-platform ever truly is. I would give a example of how this could be done, but RegEx in all honesty takes a good amount of work and it would be quite a bit of code to make a example that could show you how to parse it and find out what the browser is.

How to display HTML article in app? WinRT

I'm creating client-side WP 8.1(appx) app for one website.
Well, let's say that I got html code of some article(with images, lists etc), only article(without site's header etc).
I want to display that article in my WP 8.1 app with article's formatting and images.
How can I do that?
I tried using WebView but it's not what I need, because text in WebView is really small and needs zooming and so on.
* for Tamás Deme *
<RichTextBlock>
<common:Properties.Html>
<![CDATA[ <img width="100" height = "100" src="https://www.google.com/images/srpr/logo11w.png"/> ]]>
</common:Properties.Html>
</RichTextBlock>
It displays p, b tags properly, the only problem is images.
* for Tamás Deme *
You could use the HtmlAgilityPack to parse the page, and then rerender the article's contents in a RichTextBlock.
To do the conversion these two links I found might help: http://blogs.msdn.com/b/tess/archive/2013/05/13/displaying-html-content-in-a-richtextblock.aspx and https://github.com/MacawNL/WinRT-RichTextBlock.Html2Xaml
have you tried the JavaScript Windows Store App templates (available in VS2013)?
you can find some good tutorials here: https://msdn.microsoft.com/en-us/library/windows/apps/br211385.aspx?f=255&MSPPError=-2147217396

Referencing Stylesheet when sending email in C#

I am dealing with a situation where I should change the font of a HTML body in C sharp using a stylesheet.
I have added a stylesheet to my project with name Stylesheet1.css which contains the code to change the font of a HTML body.
body {
font-size: 10px;
}
I need to reference this stylesheet in source code, where I am processing the HTML body.
I am processing the HTML body as follows.
if(some condition)
{
mail.HTMLBody= ? ? ? ? ;
}
I need to reference the stylesheet in this part. How can I do this?
I would not use external stylesheets for emails. As alot of email clients do not support it.
See http://groundwire.org/support/articles/css-and-email-newsletters
and
http://www.alistapart.com/articles/cssemail/
As some clients like hotmail remove the 'body' tag all togeather so your example in your question will not work. So you can instead wrap your email in a DIV and use inline styles so you get best support for all email clients.
A list of what is supported by which client is here http://css-discuss.incutio.com/wiki/Style_In_Email
Edit
You should be able to set the font-size like this
<div style="font-size:10px;">
your email content here
<p style="font-size:14px;">
some bigger text
</p>
</div>
I agree with Daveo's answer - you are best off embedding styles directly rather than linking out to an external CSS
There is a very, very extensive matrix of styles & features that are and aren't supported by the popular email apps (outlook/gmail/yahoo mail/etc) at http://www.campaignmonitor.com/css/
http://htmlemailboilerplate.com/ is a really good starting point for getting html and css right in emails.

C# - How can I cut a string at its end to fit in a div?

I'm making a list of recent news. So, it will show something like this:
- Take a look at the new Volks...
- John Doe is looking for a jo...
- Microsoft is launching the n...
So, the list above only shows me the title of the news and the length of each news is limited in 25 characters. But, this is not working well... for example, if you type 25 M's, it will explode my div.
I've been told that there is a way to calculate the length of the string and make it fit in a div automatically.
Does anyone know how to do it?
thanks!!
"text-overflow: ellipsis" is what you want but not everybody supports it. More info here...
I think you talking about is using the System.Drawing.Gaphics class's MeasureString() method.
However, this requires making a Graphics object which matches the font characteristics of your web page. But, your server process shouldn't know anything about the style elements of the web page, which should be handled by the CSS sheet.
I think you want to use css for this.
word-wrap:break-word;
should do it
One very simple way to prevent "exploding the div" is to use a css style to set the overflow of the div to scroll or hide the extra text instead of stretching to accomodate it.
I don't think there is an easy way to do this that works with all browsers and fonts.
The best way is just making sure your layout don't break if someone enters 25*m.
An useful thing to do is to split words that are more than X letter.
I the word-wrap css don't work that well on all browers.
This is not really a server-side problem, as the server shouldn't know what fonts people are using. You can do it using Ajax - post the font to the server, calculate the width (as James Curran mentioned), and return the right strings. However, the server may ont have the same fonts installed, and you have to calculate padding and margins on the server side.
I can think of several options on the client side:
Wrap every line with a span. A span would expand automatically to the width of the line. Using jQuery or your favorite javascript you can remove characters until the width is ok. (you can do a sort of binary search, where at every stage you add the ellipsis and checks the width)
Easy - Wrap every line with a fixed-width div and set it overflow:hidden, and add the ellipsis after the div. This will cut through letters though, and when you get a short text it'll still show the ellipsis.
Too easy - Use a fixed width font (they're mostly ugly).
As others have mentioned you can measure strings in thick client applications using System.Drawing.Graphics.MeasureString, but since you mention you want to fit it in an HTML div tag it would be perferable to let the browser handle the user interface using CSS.
<html>
<head>
<title>C# - How can I cut a string at its end to fit in a div? </title>
<style type="text/css">
.ellipsis li
{
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 166px;
}
</style>
</head>
<body>
<ul class="ellipsis">
<li>Take a look at the new Volksxxxxx</li>
<li>John Doe is looking for a joxxxxx</li>
<li>Microsoft is launching the nxxxxx</li>
</ul>
</body>
</html>
I used the unordered list tag (UL) instead of div since your sample list begins with a bullet character. Similar CSS would apply to DIV tags. And although all browser can be made to clip the content, not all browsers support the non-standard text-overflow: ellipsis style.

Wiki rendering engine for C#? like redcloth, bluecloth, or something decent

We have used the redcloth and bluecloth wiki renderer's with Ruby, basically you can do something like this...
html = RedCloth.to_html(wiki_content)
and poof, you get back HTML.
Is there something out there for C#/.NET ?
try http://wikiplex.codeplex.com/
There are some wiki rendering engines but the names escape me right now. Perhaps check out some of these open-source options? I've previously reviewed MindTouch from that list for an application and it was quite rich, but it did much more than I needed to do.
If you just need something to turn text into HTMLcontent, I use Halide which lets people type in a textarea then it'll HTML-ify links, remove dangerous content, add <p></p> and <br />, etc. Very simple but no built-in formatting options.
SO uses a custom version of Markdown for their text editor and HTML content rendering. Search google for Markdown.NET for a number of ports.

Categories

Resources