# JSON Reader 1.0

Използвайки интегрираната среда за разработка Visual Studio и езика за програмиране C# ще разработим универсално приложение за изтегляне на вицове за Чък Норис във формат [JSON](https://www.json.org/).

{% hint style="info" %}
**Информация**

JSON или JavaScript Object Notation, е текстово базиран отворен стандарт създаден за човешки четим обмен на данни. Произлиза от скриптовия език JavaScript, за да представя прости структури от данни и асоциативни масиви, наречени обекти.

* Източник: [Wikipedia](https://en.wikipedia.org/wiki/JSON)
  {% endhint %}

## Start

1. Стартирайте интегрираната среда за разработка **Visual Studio**.
2. Създайте нов проект: **Visual C# > Windows Universal > Blank App (Universal Windows)**.
3. За име на проекта запишете: **JSON Reader 1.0**.

Добавете допълнителни пакети към проекта като инсталирате: **NewtownSoft.Json** и **AngleSharp**, от менюто: **Tools > NuGet Package Manager > Package Manager Console**, като изпълните следните команди в конзолата:

```
PM> Install-Package Newtonsoft.Json -Version 13.0.1
PM> Install-Package AngleSharp -Version 0.16.1
```

#### **Root.cs**

Добавете нов клас **Root.cs**, който ще служи за десериализиране на данните от консумираната услуга.

```csharp
public class Root
{
    public List<object> categories { get; set; }
    public string created_at { get; set; }
    public string icon_url { get; set; }
    public string id { get; set; }
    public string updated_at { get; set; }
    public string url { get; set; }
    public string value { get; set; }
}
```

> **Бележка**
>
> 1. Заредете и копирайте примерен JSON от: <https://api.chucknorris.io/jokes/random>
> 2. Генерирайте C# класа на избрания JSON от: <http://json2csharp.com/>

## MainPage.xaml

Файлът **MainPage.xaml** съдържа изходния код от дизайна на потребителския интерфейс на разработваното приложение и се пише на езика XAML. Копирайте (Ctrl+C) и поставете (Ctrl+V) програмният фрагмент даден по-долу във Вашето приложение.

```xml
<!-- User Interface (UI): JSON Reader 1.0 -->
<StackPanel Background="LightSalmon" Padding="30">
       
        <!-- Title -->
        <TextBlock Text="JSON Reader 1.0"  FontSize="40" Margin="10"/>
        
        <!-- Joke -->
        <TextBox Name="Joke" FontSize="20" TextWrapping="Wrap" Height="300" Margin="10" IsReadOnly="True" />
        
        <!-- Buttons -->
        <StackPanel Orientation="Horizontal">
            <Button Content="New joke" Width="120" FontSize="23" Padding="10" Margin="10" Click="Button_Get_Click"/>
            <Button Content="Tell joke" Width="120" FontSize="23" Padding="10" Margin="10" Click="Button_Tell_Click"/>
        </StackPanel>
        
</StackPanel>
```

Изглед от дизайна на потребителският интерфейс (XAML) в интегрираната среда за разработка Visual Studio по време на разработване на приложението:

![](/files/fCqIHOwz46RTA1jKzN8d)

*Фиг. 1.47. Изглед от дизайна на потребителският интерфейс*

## MainPage.xaml.cs

Файлът **MainPage.xaml.cs** съдържа изходния код от бизнес логиката на разработваното приложение и се пише на програмният език C#. Копирайте (Ctrl+C) и поставете (Ctrl+V) програмният фрагмент даден по-долу във Вашето приложение.

```csharp
// Business Logic (BL): JSON Reader 1.0
public sealed partial class MainPage : Page
{
        // Constructor
        public MainPage()
        {
            this.InitializeComponent();
        }

        // Button Get Joke Event Handler
        private async void Button_Get_Click(object sender, RoutedEventArgs e)
        {
            // Download JSON
            HttpClient client = new HttpClient();
            var json = await client.GetStringAsync(new Uri("https://api.chucknorris.io/jokes/random"));

            // Deserialize the JSON
            var joke = JsonConvert.DeserializeObject<Root>(json);

            // Parse the HTML
            var html = new HtmlParser().ParseDocument(joke.value);
            var text = html.Body.TextContent;

            // Tell the Joke
            Joke.Text = text;
        }

        // Button Tell Joke Event Handler
        private async void Button_Tell_Click(object sender, RoutedEventArgs e)
        {
            if (Joke.Text != "")
            {
                // The media object for controlling and playing audio.
                var mediaElement = new MediaElement();

                // The object for controlling the speech synthesis engine (voice).
                var synth = new SpeechSynthesizer();

                // Generate the audio stream from plain text.
                var stream = await synth.SynthesizeTextToStreamAsync(Joke.Text);

                // Send the stream to the media object.
                mediaElement.SetSource(stream, stream.ContentType);
                mediaElement.Play();
            }
        }
}
```

Изглед от бизнес логиката (C#) в интегрираната среда за разработка Visual Studio по време на разработване на приложението:

![](/files/KKedessAZlhztCqG7euK)

*Фиг. 1.48. Изглед от бизнес логиката на разработваното приложение*

## Demo

Стартирайте приложението от менюто: **Debug > Start Debugging** или като натиснете клавиш **F5**.

![](/files/N1FpVBFXu4pMCxyq6s1S)

*Фиг. 1.49 Универсално приложение за изтегляне на вицове за Чък Норис*


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://dimitar-minchev.gitbook.io/developing-cross-platform-apps/101_intorduction/109_applications/118_json_reader_1.0.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.