Work on smartboxpage

- adds files for account model and view model.
- adds files for contact model and view model.
- adds controls for the smartlist pan.
- adds some stub assets.

Change-Id: I7e5b0cc5d29ac777bce13d1b7db1b6b847513d62

Account.cpp

+/**************************************************************************
+* Copyright (C) 2016 by Savoir-faire Linux                                *
+* Author: Jäger Nicolas <nicolas.jager@savoirfairelinux.com>              *
+*                                                                         *
+* This program is free software; you can redistribute it and/or modify    *
+* it under the terms of the GNU General Public License as published by    *
+* the Free Software Foundation; either version 3 of the License, or       *
+* (at your option) any later version.                                     *
+*                                                                         *
+* This program is distributed in the hope that it will be useful,         *
+* but WITHOUT ANY WARRANTY; without even the implied warranty of          *
+* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the           *
+* GNU General Public License for more details.                            *
+*                                                                         *
+* You should have received a copy of the GNU General Public License       *
+* along with this program.  If not, see <http://www.gnu.org/licenses/>.   *
+**************************************************************************/
+#include "pch.h"
+
+#include "Account.h"
+
+using namespace Windows::ApplicationModel::Core;
+using namespace Platform;
+using namespace Windows::UI::Core;
+
+using namespace RingClientUWP;
+
+Account::Account(String^ name,
+                 String^ ringID)
+{
+    name_ = name;
+    ringID_ = ringID;
+}
+
+void
+Account::NotifyPropertyChanged(String^ propertyName)
+{
+    CoreApplicationView^ view = CoreApplication::MainView;
+    view->CoreWindow->Dispatcher->RunAsync(
+        CoreDispatcherPriority::Normal,
+        ref new DispatchedHandler([this, propertyName]()
+    {
+        PropertyChanged(this, ref new PropertyChangedEventArgs(propertyName));
+
+    }));
+}
\ No newline at end of file

Account.h

+#pragma once
+/**************************************************************************
+* Copyright (C) 2016 by Savoir-faire Linux                                *
+* Author: Jäger Nicolas <nicolas.jager@savoirfairelinux.com>              *
+*                                                                         *
+* This program is free software; you can redistribute it and/or modify    *
+* it under the terms of the GNU General Public License as published by    *
+* the Free Software Foundation; either version 3 of the License, or       *
+* (at your option) any later version.                                     *
+*                                                                         *
+* This program is distributed in the hope that it will be useful,         *
+* but WITHOUT ANY WARRANTY; without even the implied warranty of          *
+* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the           *
+* GNU General Public License for more details.                            *
+*                                                                         *
+* You should have received a copy of the GNU General Public License       *
+* along with this program.  If not, see <http://www.gnu.org/licenses/>.   *
+**************************************************************************/
+using namespace Platform;
+using namespace Windows::UI::Xaml::Data;
+
+namespace RingClientUWP
+{
+public ref class Account sealed : public INotifyPropertyChanged
+{
+public:
+    Account(String^ name, String^ ringID);
+
+
+    virtual event PropertyChangedEventHandler^ PropertyChanged;
+
+    property String^ name_;
+    property String^ ringID_;
+
+protected:
+    void NotifyPropertyChanged(String^ propertyName);
+
+
+};
+}
+

AccountsViewModel.cpp

+/***************************************************************************
+* Copyright (C) 2016 by Savoir-faire Linux                                *
+* Author: Jger Nicolas <nicolas.jager@savoirfairelinux.com>              *
+*                                                                         *
+* This program is free software; you can redistribute it and/or modify    *
+* it under the terms of the GNU General Public License as published by    *
+* the Free Software Foundation; either version 3 of the License, or       *
+* (at your option) any later version.                                     *
+*                                                                         *
+* This program is distributed in the hope that it will be useful,         *
+* but WITHOUT ANY WARRANTY; without even the implied warranty of          *
+* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the           *
+* GNU General Public License for more details.                            *
+*                                                                         *
+* You should have received a copy of the GNU General Public License       *
+* along with this program.  If not, see <http://www.gnu.org/licenses/>.   *
+**************************************************************************/
+#include "pch.h"
+#include "AccountsViewModel.h"
+
+using namespace RingClientUWP;
+using namespace ViewModel;
+
+AccountsViewModel::AccountsViewModel()
+{
+    /* accountList_ should be filled with accounts saved on the disk */
+    accountsList_ = ref new Vector<Account^>();
+
+    accountsList_->Append(ref new Account("Moi","jfdhfshfhsk"));
+    accountsList_->Append(ref new Account("SuperMan", "jfdhfshfhsk"));
+    accountsList_->Append(ref new Account("Travail", "jfdhfshfhsk"));
+}
\ No newline at end of file

AccountsViewModel.h

+#pragma once
+/**************************************************************************
+* Copyright (C) 2016 by Savoir-faire Linux                                *
+* Author: Jger Nicolas <nicolas.jager@savoirfairelinux.com>              *
+*                                                                         *
+* This program is free software; you can redistribute it and/or modify    *
+* it under the terms of the GNU General Public License as published by    *
+* the Free Software Foundation; either version 3 of the License, or       *
+* (at your option) any later version.                                     *
+*                                                                         *
+* This program is distributed in the hope that it will be useful,         *
+* but WITHOUT ANY WARRANTY; without even the implied warranty of          *
+* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the           *
+* GNU General Public License for more details.                            *
+*                                                                         *
+* You should have received a copy of the GNU General Public License       *
+* along with this program.  If not, see <http://www.gnu.org/licenses/>.   *
+**************************************************************************/
+using namespace Platform::Collections;
+
+namespace RingClientUWP
+{
+
+namespace ViewModel {
+public ref class AccountsViewModel sealed
+{
+internal:
+    /* singleton */
+    static property AccountsViewModel^ instance
+    {
+        AccountsViewModel^ get()
+        {
+            static AccountsViewModel^ instance_ = ref new AccountsViewModel();
+            return instance_;
+        }
+    }
+
+    /* functions */
+
+    /* properties */
+    property Vector<Account^>^ accountsList
+    {
+        Vector<Account^>^ get()
+        {
+            return accountsList_;
+        }
+    }
+
+    /* events */
+
+private:
+    AccountsViewModel(); // singleton
+    Vector<Account^>^ accountsList_;
+};
+}
+}

Contact.cpp

+/**************************************************************************
+* Copyright (C) 2016 by Savoir-faire Linux                                *
+* Author: Jäger Nicolas <nicolas.jager@savoirfairelinux.com>              *
+*                                                                         *
+* This program is free software; you can redistribute it and/or modify    *
+* it under the terms of the GNU General Public License as published by    *
+* the Free Software Foundation; either version 3 of the License, or       *
+* (at your option) any later version.                                     *
+*                                                                         *
+* This program is distributed in the hope that it will be useful,         *
+* but WITHOUT ANY WARRANTY; without even the implied warranty of          *
+* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the           *
+* GNU General Public License for more details.                            *
+*                                                                         *
+* You should have received a copy of the GNU General Public License       *
+* along with this program.  If not, see <http://www.gnu.org/licenses/>.   *
+**************************************************************************/
+#include "pch.h"
+
+#include "Contact.h"
+
+using namespace Windows::ApplicationModel::Core;
+using namespace Platform;
+using namespace Windows::UI::Core;
+
+using namespace RingClientUWP;
+
+Contact::Contact(String^ name,
+                 String^ ringID)
+{
+    name_ = name;
+    ringID_ = ringID;
+}
+
+void
+Contact::NotifyPropertyChanged(String^ propertyName)
+{
+    CoreApplicationView^ view = CoreApplication::MainView;
+    view->CoreWindow->Dispatcher->RunAsync(
+        CoreDispatcherPriority::Normal,
+        ref new DispatchedHandler([this, propertyName]()
+    {
+        PropertyChanged(this, ref new PropertyChangedEventArgs(propertyName));
+
+    }));
+}
\ No newline at end of file

Contact.h

+#pragma once
+/**************************************************************************
+* Copyright (C) 2016 by Savoir-faire Linux                                *
+* Author: Jäger Nicolas <nicolas.jager@savoirfairelinux.com>              *
+*                                                                         *
+* This program is free software; you can redistribute it and/or modify    *
+* it under the terms of the GNU General Public License as published by    *
+* the Free Software Foundation; either version 3 of the License, or       *
+* (at your option) any later version.                                     *
+*                                                                         *
+* This program is distributed in the hope that it will be useful,         *
+* but WITHOUT ANY WARRANTY; without even the implied warranty of          *
+* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the           *
+* GNU General Public License for more details.                            *
+*                                                                         *
+* You should have received a copy of the GNU General Public License       *
+* along with this program.  If not, see <http://www.gnu.org/licenses/>.   *
+**************************************************************************/
+using namespace Platform;
+using namespace Windows::UI::Xaml::Data;
+
+namespace RingClientUWP
+{
+public ref class Contact sealed : public INotifyPropertyChanged
+{
+public:
+    Contact(String^ name, String^ ringID);
+
+
+    virtual event PropertyChangedEventHandler^ PropertyChanged;
+
+    property String^ name_;
+    property String^ ringID_;
+
+protected:
+    void NotifyPropertyChanged(String^ propertyName);
+
+
+};
+}
+

ContactsViewModel.cpp

+/***************************************************************************
+* Copyright (C) 2016 by Savoir-faire Linux                                *
+* Author: Jger Nicolas <nicolas.jager@savoirfairelinux.com>              *
+*                                                                         *
+* This program is free software; you can redistribute it and/or modify    *
+* it under the terms of the GNU General Public License as published by    *
+* the Free Software Foundation; either version 3 of the License, or       *
+* (at your option) any later version.                                     *
+*                                                                         *
+* This program is distributed in the hope that it will be useful,         *
+* but WITHOUT ANY WARRANTY; without even the implied warranty of          *
+* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the           *
+* GNU General Public License for more details.                            *
+*                                                                         *
+* You should have received a copy of the GNU General Public License       *
+* along with this program.  If not, see <http://www.gnu.org/licenses/>.   *
+**************************************************************************/
+#include "pch.h"
+#include "ContactsViewModel.h"
+
+using namespace RingClientUWP;
+using namespace ViewModel;
+
+ContactsViewModel::ContactsViewModel()
+{
+    contactsList_ = ref new Vector<Contact^>();
+
+    contactsList_->Append(ref new Contact("Homer Simpson", "356373d4fh3d2032d2961f4cbd4e1b46"));
+    contactsList_->Append(ref new Contact("Marge Simpson", "b430222a5219a4cb119607f1cdae900e"));
+    contactsList_->Append(ref new Contact("Marilyn Manson", "9f9a25b6925b1244f863966f4e33798f"));
+    contactsList_->Append(ref new Contact("Jesus Christ", "d1da438329d38517d85d5a523b82ffa8"));
+    contactsList_->Append(ref new Contact("Vladimir Lenin", "e38943ae33c7c9cbd8c6512476927ba7"));
+    contactsList_->Append(ref new Contact("(de)-crypt master", "45527ef8d4d7b0ba2c3b66342ea0279a"));
+    contactsList_->Append(ref new Contact("some people",  "784fe73c815b58233ba020e7ee766911"));
+    contactsList_->Append(ref new Contact("some people with a very very very very long name",  "356373d4f63d2032d2961f4cbd4e1b46"));
+    contactsList_->Append(ref new Contact("some people",  ""));
+    contactsList_->Append(ref new Contact("some people",  ""));
+    contactsList_->Append(ref new Contact("some people",  ""));
+    contactsList_->Append(ref new Contact("some people",  ""));
+    contactsList_->Append(ref new Contact("some people",  ""));
+    contactsList_->Append(ref new Contact("some people",  ""));
+    contactsList_->Append(ref new Contact("some people",  ""));
+    contactsList_->Append(ref new Contact("some people",  ""));
+    contactsList_->Append(ref new Contact("some people",  ""));
+    contactsList_->Append(ref new Contact("some people",  ""));
+    contactsList_->Append(ref new Contact("some people",  ""));
+    contactsList_->Append(ref new Contact("some people",  ""));
+    contactsList_->Append(ref new Contact("some people",  ""));
+    contactsList_->Append(ref new Contact("some people",  ""));
+}
+
+Contact^
+RingClientUWP::ViewModel::ContactsViewModel::findContactByName(String ^ name)
+{
+    for each (Contact^ contact in contactsList_)
+        if (contact->name_ == name)
+            return contact;
+
+    return nullptr;
+}
+
+Contact^
+RingClientUWP::ViewModel::ContactsViewModel::addNewContact(String^ name, String^ ringId)
+{
+    if (contactsList_ && !findContactByName(name)) {
+        Contact^ contact = ref new Contact(name, ringId);
+        contactsList_->Append(contact);
+        return contact;
+    }
+
+    return nullptr;
+}

ContactsViewModel.h

+#pragma once
+/**************************************************************************
+* Copyright (C) 2016 by Savoir-faire Linux                                *
+* Author: Jger Nicolas <nicolas.jager@savoirfairelinux.com>              *
+*                                                                         *
+* This program is free software; you can redistribute it and/or modify    *
+* it under the terms of the GNU General Public License as published by    *
+* the Free Software Foundation; either version 3 of the License, or       *
+* (at your option) any later version.                                     *
+*                                                                         *
+* This program is distributed in the hope that it will be useful,         *
+* but WITHOUT ANY WARRANTY; without even the implied warranty of          *
+* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the           *
+* GNU General Public License for more details.                            *
+*                                                                         *
+* You should have received a copy of the GNU General Public License       *
+* along with this program.  If not, see <http://www.gnu.org/licenses/>.   *
+**************************************************************************/
+using namespace Platform::Collections;
+
+namespace RingClientUWP
+{
+
+delegate void NewContactSelected(Contact^ contact);
+delegate void NoContactSelected();
+
+namespace ViewModel {
+public ref class ContactsViewModel sealed
+{
+internal:
+    /* singleton */
+    static property ContactsViewModel^ instance
+    {
+        ContactsViewModel^ get()
+        {
+            static ContactsViewModel^ instance_ = ref new ContactsViewModel();
+            return instance_;
+        }
+    }
+
+    /* functions */
+    Contact^ findContactByName(String^ name);
+
+    Contact^ addNewContact(String^ name, String^ ringId);
+
+    /* properties */
+    property Contact^ selectedContact
+    {
+        Contact^ get()
+        {
+            return currentItem_;
+        }
+        void set(Contact^ value)
+        {
+            oldItem_ = currentItem_;
+            currentItem_ = value;
+            if (value)
+                newContactSelected(currentItem_);
+            else
+                noContactSelected();
+        }
+    }
+
+    property Vector<Contact^>^ contactsList
+    {
+        Vector<Contact^>^ get()
+        {
+            return contactsList_;
+        }
+    }
+
+    /* events */
+    event NewContactSelected^ newContactSelected;
+    event NoContactSelected^ noContactSelected;
+
+private:
+    ContactsViewModel(); // singleton
+    Vector<Contact^>^ contactsList_;
+    Contact^ currentItem_;
+    Contact^ oldItem_;
+
+};
+}
+}

MainPage.xaml

@@ -55,7 +55,8 @@
         </SplitView.Pane>
         <SplitView.Content>
             <SplitView x:Name="_innerSplitView_"
-                       IsPaneOpen="False"
+                       IsPaneOpen="True"
+                       CompactPaneLength="60"
                        DisplayMode="CompactInline">
                 <SplitView.Pane>
                     <Frame x:Name="_smartPanel_"/>

SmartPanel.xaml

@@ -23,7 +23,338 @@
       xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
       mc:Ignorable="d">
 
+    <Page.Resources>
+        <!-- template for contacts. -->
+        <DataTemplate x:Key="ContactTemplate"
+                      x:DataType="local:Contact">
             <Grid>
+                <Grid.RowDefinitions>
+                    <RowDefinition Height="60"/>
+                    <!-- use the height of _contactBar_ to make it visible or collapsed. -->
+                    <RowDefinition x:Name="_contactBar_"
+                                   Height="0"/>
+                </Grid.RowDefinitions>
+                <Grid Grid.Row="0">
+                    <Grid.ColumnDefinitions>
+                        <ColumnDefinition Width="60"/>
+                        <ColumnDefinition Width="*"
+                                          MinWidth="200"/>
+                    </Grid.ColumnDefinitions>
+                    <Image x:Name="_contactAvatar_"
+                           VerticalAlignment="Center"
+                           HorizontalAlignment="Center"
+                           Grid.Column="0"
+                           Width="55"
+                           Height="55"
+                           Source="Assets\TESTS\contactAvatar.png"/>
+                    <!-- visual notifications. -->
+                    <Border x:Name="_visualNotificationVideoChat_"
+                            Visibility="Collapsed"
+                            Style="{StaticResource BorderStyle1}">
+                        <TextBlock Text="&#xE8AA;"
+                                   Style="{StaticResource TextSegoeStyle1}"/>
+                        <Border.RenderTransform>
+                            <TranslateTransform X="17" Y="-14"/>
+                        </Border.RenderTransform>
+                    </Border>
+                    <Border x:Name="_visualNotificationNewMessage_"
+                            Visibility="Collapsed"
+                            Style="{StaticResource BorderStyle2}">
+                        <TextBlock Text="0"
+                                   Style="{StaticResource TextStyle3}"/>
+                        <Border.RenderTransform>
+                            <TranslateTransform X="-17" Y="-14"/>
+                        </Border.RenderTransform>
+                    </Border>
+                    <!-- name of the contact. -->
+                    <TextBlock x:Name="_contactName_"
+                               Grid.Column="1"
+                               FontSize="20"
+                               Text="{x:Bind name_}">
+                        <TextBlock.RenderTransform>
+                            <TranslateTransform X="8" Y="3"/>
+                        </TextBlock.RenderTransform>
+                    </TextBlock>
+                </Grid>
+                <!-- button bar for accept/reject or cancel call. -->
+                <!-- nb : dont use Visibility with the grid, use the height of the hosting row (_contactBar_). -->
+                <Grid Width="320"
+                      HorizontalAlignment="Left"
+                      Grid.Row="1"
+                      Background="DarkGray">
+                    <StackPanel Orientation="Horizontal"
+                                HorizontalAlignment="Center">
+                        <Button x:Name="_acceptIncomingCallBtn_"
+                            VerticalAlignment="Center"
+                            HorizontalAlignment="Center"
+                            Style="{StaticResource ButtonStyle2}"
+                            Content="&#xE10B;"/>
+                        <Button x:Name="_rejectIncomingCallBtn_"
+                            VerticalAlignment="Center"
+                            HorizontalAlignment="Center"
+                            Style="{StaticResource ButtonStyle2}"
+                            Content="&#xE106;"/>
+                    </StackPanel>
+                    <TextBlock x:Name="_contactCallStatus_"
+                               Foreground="DarkGray"
+                               Text="Incoming call"
+                               HorizontalAlignment="Center">
+                        <TextBlock.RenderTransform>
+                            <TranslateTransform Y="-30"/>
+                        </TextBlock.RenderTransform>
+                    </TextBlock>
+                </Grid>
+            </Grid>
+        </DataTemplate>
+        <!-- template for accounts. -->
+        <DataTemplate x:Key="AccountTemplate"
+                      x:DataType="local:Account">
+            <Grid>
+                <Grid.ColumnDefinitions>
+                    <ColumnDefinition Width="60"/>
+                    <ColumnDefinition Width="*"/>
+                </Grid.ColumnDefinitions>
+                <Image x:Name="_accountAvatar_"
+                       VerticalAlignment="Center"
+                       HorizontalAlignment="Center"
+                       Grid.Column="0"
+                       Width="55"
+                       Height="55"
+                       Source="Assets\TESTS\contactAvatar.png"/>
+                <TextBlock x:Name="_accountName_"
+                           Grid.Column="1"
+                           Text="{x:Bind name_}"/>
+            </Grid>
+        </DataTemplate>
+    </Page.Resources>
+
+    <Grid>
+        <Grid.RowDefinitions>
+            <!-- where accounts and share menu drop down are. -->
+            <RowDefinition Height="auto"/>
+            <!-- where contacts and settings are. -->
+            <RowDefinition Height="*"/>
+        </Grid.RowDefinitions>
+        <!-- drop down menus. -->
+        <Grid Background="LightBlue">
+            <Grid.RowDefinitions>
+                <!-- where the selected account is shown. -->
+                <RowDefinition x:Name="_selectedAccountRow_"
+                               Height="90"/>
+                <!-- where the drop down menus are shown. -->
+                <RowDefinition Height="auto"/>
+            </Grid.RowDefinitions>
+            <!-- selected account. -->
+            <Grid Grid.Row="0">
+                <Grid.ColumnDefinitions>
+                    <ColumnDefinition x:Name="_selectedAccountAvatarColumn_"
+                                      Width="90"/>
+                    <ColumnDefinition Width="*"/>
+                    <ColumnDefinition Width="50"/>
+                </Grid.ColumnDefinitions>
+                <Image x:Name="_selectedAccountAvatar_"
+                       Source="Assets\TESTS\contactAvatar.png"
+                       Width="80"
+                       Margin="5"
+                       Grid.Column="0"
+                       Height="80"/>
+                <StackPanel Grid.Column="1"
+                            VerticalAlignment="Bottom">
+                    <TextBlock Text="TOT fdsfds fdsO"
+                               Margin="10"
+                               Style="{StaticResource TextStyle2}"/>
+                    <StackPanel Orientation="Horizontal">
+                        <!--Content="&#xE0A1;-->
+                        <ToggleButton x:Name="_accountsMenuButton_"
+                                      VerticalAlignment="Bottom"
+                                      Content="&#xE168;"
+                                      Checked="_accountsMenuButton__Checked"
+                                      Unchecked="_accountsMenuButton__Unchecked"
+                                      Style="{StaticResource ToggleButtonStyle1}"/>
+                        <ToggleButton x:Name="_shareMenuButton_"
+                                      VerticalAlignment="Bottom"
+                                      Content="&#xE72D;"
+                                      Checked="_shareMenuButton__Checked"
+                                      Unchecked="_shareMenuButton__Unchecked"
+                                      Style="{StaticResource ToggleButtonStyle1}"/>
+                    </StackPanel>
+                </StackPanel>
+                <ToggleButton x:Name="_settingsTBtn_"
+                              Grid.Column="2"
+                              VerticalAlignment="Bottom"
+                              Content="&#xE115;"
+                              Checked="_settings__Checked"
+                              Unchecked="_settings__Unchecked"
+                              Style="{StaticResource ToggleButtonStyle1}"/>
+            </Grid>
+
+            <!--sub menus like the accounts list or the share menu are just below, technicaly they are nested inside the
+            same row. To sumon them we use the visibility of their own grid, by linking it to a toggle button-->
+
+            <!-- accounts menu. -->
+            <Grid x:Name="_accountsMenuGrid_"
+                  MaxHeight="350"
+                  Grid.Row="1"
+                  Visibility="Collapsed"
+                  Background="LightBlue">
+                <Grid.RowDefinitions>
+                    <RowDefinition Height="*"/>
+                    <RowDefinition Height="30"/>
+                </Grid.RowDefinitions>
+                <ListBox x:Name="_accountsList_"
+                         Grid.Row="0"
+                         ScrollViewer.HorizontalScrollBarVisibility="Auto"
+                         ScrollViewer.HorizontalScrollMode="Enabled"
+                         Width="320"
+                         ItemContainerStyle="{StaticResource contactsListBoxStyle}"
+                         Background="#FFE4F1F9"
+                         ItemTemplate="{StaticResource AccountTemplate}"/>
+                <Button x:Name="_addAccountBtn_"
+                        Grid.Row="1"
+                        VerticalAlignment="Center"
+                        HorizontalAlignment="Center"
+                        Content="&#xE948;"
+                        Click="_addAccountBtn__Click"
+                        Style="{StaticResource ButtonStyle2}"/>
+            </Grid>
+            <!-- account creation menu. -->
+            <Grid x:Name="_accountCreationMenuGrid_"
+                  Grid.Row="2"
+                  Visibility="Collapsed"
+                  Background="LightBlue">
+                <Grid.RowDefinitions>
+                    <RowDefinition Height="*"/>
+                    <RowDefinition Height="30"/>
+                </Grid.RowDefinitions>
+                <StackPanel Orientation="Vertical"
+                            Grid.Row="0"
+                            Background="#FFE4F1F9">
+                    <StackPanel Orientation="Horizontal">
+                        <TextBlock VerticalAlignment="Center"
+                                   Text="Account type : "
+                                   Margin="10,10,0,10"/>
+                        <ComboBox SelectedIndex="0"
+                                  Margin="10"
+                                  VerticalAlignment="Center"
+                                  Width="195">
+                            <ComboBoxItem Content="Ring"/>
+                            <ComboBoxItem Content="Sip"/>
+                        </ComboBox>
+                    </StackPanel>
+                    <Button  x:Name="_avatarWebcamCaptureBtn_"
+                             VerticalAlignment="Center"
+                             Content="&#xE8B8;"
+                             Style="{StaticResource ButtonStyle3}"
+                             Click="_avatarWebcamCaptureBtn__Click"
+                             HorizontalAlignment="Center"/>
+                    <!-- RING account. -->
+                    <StackPanel x:Name="_ringAccountCreationStack_"
+                                Visibility="Visible">
+                        <TextBox  Margin="10"
+                                  PlaceholderText="Enter your username"/>
+                        <PasswordBox Margin="10"
+                                     PlaceholderText="Enter your password"/>
+                        <PasswordBox  Margin="10"
+                                      PlaceholderText="Repeat your Password"/>
+                    </StackPanel>
+                    <!-- SIP account. -->
+                    <StackPanel x:Name="_sipAccountCreationStack_"
+                                Visibility="Collapsed">
+                        <TextBox Margin="10"
+                                 PlaceholderText="Enter hostname"/>
+                        <TextBox Margin="10"
+                                 PlaceholderText="Enter your username"/>
+                        <PasswordBox Margin="10"
+                                     PlaceholderText="Enter your password"/>
+                        <PasswordBox Margin="10"
+                                     PlaceholderText="Repeat your Password"/>
+                    </StackPanel>
+                </StackPanel>
+                <!-- buttons yes/no to create the new account. -->
+                <Grid Grid.Row="1">
+                    <StackPanel Orientation="Horizontal"
+                                HorizontalAlignment="Center">
+                        <Button x:Name="_createAccountYes_"
+                                Grid.Row="1"
+                                VerticalAlignment="Center"
+                                HorizontalAlignment="Center"
+                                Content="&#xE081;"
+                                Click="_createAccountYes__Click"
+                                Style="{StaticResource ButtonStyle2}"/>
+                        <Button x:Name="_createAccountNo_"
+                                Grid.Row="1"
+                                VerticalAlignment="Center"
+                                HorizontalAlignment="Center"
+                                Content="&#xE106;"
+                                Click="_createAccountNo__Click"
+                                Style="{StaticResource ButtonStyle2}"/>
+                    </StackPanel>
+                </Grid>
+            </Grid>
+            <!-- share menu. -->
+            <Grid x:Name="_shareMenuGrid_"
+                  Grid.Row="2"
+                  Visibility="Collapsed"
+                  Background="LightBlue">
+                <Grid.RowDefinitions>
+                    <RowDefinition Height="*"/>
+                    <RowDefinition Height="30"/>
+                </Grid.RowDefinitions>
+                <Grid Background="#FFE4F1F9">
+                    <Grid.RowDefinitions>
+                        <RowDefinition Height="*"/>
+                        <RowDefinition Height="auto"/>
+                        <RowDefinition Height="auto"/>
+                    </Grid.RowDefinitions>
+                    <Image x:Name="_selectedAccountQrCode_"
+                           Source="Assets\TESTS\qrcode.png"
+                           Width="200"
+                           Margin="5"
+                           Grid.Row="0"
+                           Height="200"/>
+                    <TextBlock Text="RingId:"
+                               Grid.Row="1"
+                               HorizontalAlignment="Center"/>
+                    <TextBox Style="{StaticResource TextBoxStyle2}"
+                             HorizontalAlignment="Center"
+                             Text="c4fc649aed8b2497a5e98fd2d856222f07020044"
+                             Grid.Row="2"/>
+                </Grid>
+            </Grid>
+        </Grid>
+        <!-- contact list and settings. -->
+        <Grid Grid.Row="1">
+            <!-- contacts list. -->
+            <Grid x:Name="_smartGrid_"
+                  Grid.Row="0">
+                <Grid.RowDefinitions>
+                    <RowDefinition x:Name="_rowRingTxtBx_"
+                                   Height="40"/>
+                    <RowDefinition Height="*"/>
+                </Grid.RowDefinitions>
+                <TextBox x:Name="_ringTxtBx_"
+					     HorizontalAlignment="Center"
+                         VerticalAlignment="Center"
+                         Width="320"
+					     TextWrapping="Wrap"
+                         Style="{StaticResource TextBoxStyle1}"
+					     Text=""/>
+                <ListBox x:Name="_smartList_"
+                         Grid.Row="1"
+                         Margin="0"
+                         Padding="0"
+				         ScrollViewer.HorizontalScrollBarVisibility="Auto"
+				         ScrollViewer.HorizontalScrollMode="Enabled"
+                         ItemContainerStyle="{StaticResource contactsListBoxStyle}"
+                         ItemTemplate="{StaticResource ContactTemplate}"/>
+            </Grid>
+            <!-- settings. -->
+            <Grid x:Name="_settings_"
+                  Grid.Row="0"
+                  Visibility="Collapsed">
+                <TextBlock>some settings</TextBlock>
+            </Grid>
+        </Grid>
     </Grid>
 
 </Page>

SmartPanel.xaml.cpp

-/**************************************************************************
+/**************************************************************************
  * Copyright (C) 2016 by Savoir-faire Linux                                *
  * Author: Jäger Nicolas <nicolas.jager@savoirfairelinux.com>              *
  *                                                                         *
@@ -19,11 +19,130 @@
 
 #include "SmartPanel.xaml.h"
 
+using namespace Platform;
+
 using namespace RingClientUWP;
 using namespace RingClientUWP::Views;
+using namespace RingClientUWP::ViewModel;
+using namespace Windows::Media::Capture;
+using namespace Windows::UI::Xaml;
+using namespace Windows::Storage;
+using namespace Windows::UI::Xaml::Media::Imaging;
+using namespace Windows::UI::Xaml::Shapes;
+using namespace Windows::UI::Xaml::Media;
+using namespace Concurrency;
+using namespace Windows::Foundation;
 
 SmartPanel::SmartPanel()
 {
     InitializeComponent();
+
+    _accountsList_->ItemsSource = AccountsViewModel::instance->accountsList;
+    _smartList_->ItemsSource = ContactsViewModel::instance->contactsList;
+}
+
+void RingClientUWP::Views::SmartPanel::_accountsMenuButton__Checked(Object^ sender, RoutedEventArgs^ e)
+{
+    _shareMenuButton_->IsChecked = false;
+    _accountsMenuGrid_->Visibility = Windows::UI::Xaml::Visibility::Visible;
+    _accountCreationMenuGrid_->Visibility = Windows::UI::Xaml::Visibility::Collapsed;
+}
+
+void RingClientUWP::Views::SmartPanel::_accountsMenuButton__Unchecked(Object^ sender, RoutedEventArgs^ e)
+{
+    _accountsMenuGrid_->Visibility = Windows::UI::Xaml::Visibility::Collapsed;
+    _accountCreationMenuGrid_->Visibility = Windows::UI::Xaml::Visibility::Collapsed;
+}
+
+void RingClientUWP::Views::SmartPanel::_settings__Checked(Object^ sender, RoutedEventArgs^ e)
+{
+    _smartGrid_->Visibility = Windows::UI::Xaml::Visibility::Collapsed;
+    _settings_->Visibility = Windows::UI::Xaml::Visibility::Visible;
+}
+
+void RingClientUWP::Views::SmartPanel::_settings__Unchecked(Object^ sender, RoutedEventArgs^ e)
+{
+    _settings_->Visibility = Windows::UI::Xaml::Visibility::Collapsed;
+    _smartGrid_->Visibility = Windows::UI::Xaml::Visibility::Visible;
+}
+
+void RingClientUWP::Views::SmartPanel::setMode(RingClientUWP::Views::SmartPanel::Mode mode)
+{
+    if (mode == RingClientUWP::Views::SmartPanel::Mode::Normal) {
+        _rowRingTxtBx_->Height = 40;
+        _selectedAccountAvatar_->Height = 80;
+        _selectedAccountAvatarColumn_->Width = 90;
+        _selectedAccountRow_->Height = 90;
+    }
+    else {
+        _rowRingTxtBx_->Height = 0;
+        _selectedAccountAvatar_->Height = 50;
+        _selectedAccountAvatarColumn_->Width = 60;
+        _selectedAccountRow_->Height = 60;
+    }
+
+    _selectedAccountAvatar_->Width = _selectedAccountAvatar_->Height;
+    _settingsTBtn_->IsChecked = false;
+    _accountsMenuButton_->IsChecked = false;
+    _shareMenuButton_->IsChecked = false;
+}
+
+void RingClientUWP::Views::SmartPanel::_shareMenuButton__Checked(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e)
+{
+    _shareMenuGrid_->Visibility = Windows::UI::Xaml::Visibility::Visible;
+    _accountsMenuButton_->IsChecked = false;
+}
+
+void RingClientUWP::Views::SmartPanel::_shareMenuButton__Unchecked(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e)
+{
+    _shareMenuGrid_->Visibility = Windows::UI::Xaml::Visibility::Collapsed;
 }
 
+
+void RingClientUWP::Views::SmartPanel::_addAccountBtn__Click(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e)
+{
+    _accountsMenuGrid_->Visibility = Windows::UI::Xaml::Visibility::Collapsed;
+    _accountCreationMenuGrid_->Visibility = Windows::UI::Xaml::Visibility::Visible;
+}
+
+
+void RingClientUWP::Views::SmartPanel::_createAccountYes__Click(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e)
+{
+
+}
+
+
+void RingClientUWP::Views::SmartPanel::_createAccountNo__Click(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e)
+{
+
+}
+
+
+void RingClientUWP::Views::SmartPanel::_avatarWebcamCaptureBtn__Click(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e)
+{
+    CameraCaptureUI^ cameraCaptureUI = ref new CameraCaptureUI();
+    cameraCaptureUI->PhotoSettings->Format = CameraCaptureUIPhotoFormat::Png;
+    cameraCaptureUI->PhotoSettings->CroppedSizeInPixels = Size(100, 100);
+
+
+    create_task(cameraCaptureUI->CaptureFileAsync(CameraCaptureUIMode::Photo)).then([this](StorageFile^ photo)
+    {
+        if (photo != nullptr) {
+            // maybe it would be possible to move some logics to the style sheet
+            auto brush = ref new ImageBrush();
+
+            auto circle = ref new Ellipse();
+            circle->Height = 80; // TODO : use some global constant when ready
+            circle->Width = 80;
+            auto path = photo->Path;
+            auto uri = ref new Windows::Foundation::Uri(path);
+            auto bitmapImage = ref new Windows::UI::Xaml::Media::Imaging::BitmapImage();
+            bitmapImage->UriSource = uri;
+
+            brush->ImageSource = bitmapImage;
+            circle->Fill = brush;
+            _avatarWebcamCaptureBtn_->Content = circle;
+        }
+    });
+
+}

SmartPanel.xaml.h

@@ -20,12 +20,36 @@
 
 namespace RingClientUWP
 {
+
+delegate void ToggleSmartPan();
+delegate void SumonMessageTextPage();
+delegate void SumonVideoPage();
+
 namespace Views
 {
 public ref class SmartPanel sealed
 {
 public:
     SmartPanel();
+
+internal:
+    enum class Mode { Minimized, Normal };
+    event ToggleSmartPan^ toggleSmartPan;
+    event SumonMessageTextPage^ sumonMessageTextPage;
+    event SumonVideoPage^ sumonVideoPage;
+    void setMode(RingClientUWP::Views::SmartPanel::Mode mode);
+
+private:
+    void _accountsMenuButton__Checked(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
+    void _accountsMenuButton__Unchecked(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
+    void _settings__Checked(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
+    void _settings__Unchecked(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
+    void _shareMenuButton__Checked(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
+    void _shareMenuButton__Unchecked(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
+    void _addAccountBtn__Click(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
+    void _createAccountYes__Click(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
+    void _createAccountNo__Click(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
+    void _avatarWebcamCaptureBtn__Click(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
 };
 }
 }
\ No newline at end of file

Styles.xaml

@@ -19,7 +19,15 @@
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
 
-<!-- general styles section -->
+    <!-- general -->
+    <Style x:Key="GridLightBlue" TargetType="Grid">
+        <Setter Property="Background"
+                Value="#FFE4F1F9"/>
+    </Style>
+    <Style x:Key="StackLightBlue" TargetType="StackPanel">
+        <Setter Property="Background"
+                Value="#FFE4F1F9"/>
+    </Style>
     <Style x:Key="TextStyle1"
            TargetType="TextBlock">
         <Setter Property="FontSize"
@@ -27,6 +35,39 @@
         <Setter Property="Foreground"
                 Value="Black"/>
     </Style>
+    <Style x:Key="TextStyle2"
+           TargetType="TextBlock">
+        <Setter Property="FontSize"
+                Value="20"/>
+        <Setter Property="VerticalAlignment"
+                Value="Center"/>
+        <Setter Property="Foreground"
+                Value="White"/>
+    </Style>
+    <Style x:Key="TextStyle3"
+           TargetType="TextBlock">
+        <Setter Property="FontSize"
+                Value="15"/>
+        <Setter Property="HorizontalAlignment"
+                Value="Center"/>
+        <Setter Property="VerticalAlignment"
+                Value="Center"/>
+        <Setter Property="Foreground"
+                Value="White"/>
+    </Style>
+    <Style x:Key="TextSegoeStyle1"
+           TargetType="TextBlock">
+        <Setter Property="FontFamily"
+                Value="Segoe MDL2 Assets"/>
+        <Setter Property="FontSize"
+                Value="15"/>
+        <Setter Property="HorizontalAlignment"
+                Value="Center"/>
+        <Setter Property="VerticalAlignment"
+                Value="Center"/>
+        <Setter Property="Foreground"
+                Value="White"/>
+    </Style>
     <Style x:Key="ButtonStyle1"
            TargetType="Button">
         <Setter Property="Width"
@@ -51,7 +92,130 @@
         <Setter Property="Background"
             Value="Transparent"/>
     </Style>
-<!-- styles for the console -->
+    <Style x:Key="ButtonStyle3"
+           TargetType="Button">
+        <Setter Property="Foreground"
+                Value="Black"/>
+        <Setter Property="Background"
+                Value="Transparent"/>
+        <Setter Property="FontFamily"
+                Value="Segoe MDL2 Assets"/>
+        <Setter Property="Width"
+                Value="80"/>
+        <Setter Property="Width"
+                Value="120"/>
+        <Setter Property="FontSize"
+                Value="70"/>
+    </Style>
+    <Style x:Key="ToggleButtonStyle1"
+           TargetType="ToggleButton">
+        <Setter Property="Width"
+                Value="50"/>
+        <Setter Property="Height"
+                Value="30"/>
+        <Setter Property="FontFamily"
+                Value="Segoe MDL2 Assets"/>
+        <Setter Property="Foreground"
+                Value="White"/>
+        <Setter Property="Background"
+                Value="Transparent"/>
+    </Style>
+    <Style x:Key="TextBoxStyle1"
+           TargetType="TextBox">
+        <Setter Property="MinWidth" Value="{ThemeResource TextControlThemeMinWidth}"/>
+        <Setter Property="MinHeight" Value="{ThemeResource TextControlThemeMinHeight}"/>
+        <Setter Property="Foreground" Value="Black"/>
+        <Setter Property="Background" Value="white"/>
+        <Setter Property="BorderBrush" Value="Red"/>
+        <Setter Property="BorderThickness" Value="0"/>
+        <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}"/>
+        <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}"/>
+        <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Auto"/>
+        <Setter Property="ScrollViewer.VerticalScrollMode" Value="Auto"/>
+        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden"/>
+        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden"/>
+        <Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False"/>
+        <Setter Property="Padding" Value="4,4"/>
+        <Setter Property="Template">
+            <Setter.Value>
+                <ControlTemplate TargetType="TextBox">
+                    <Grid>
+                        <Grid.Resources>
+                            <Style x:Name="DeleteButtonStyle" TargetType="Button">
+                                <Setter Property="Template">
+                                    <Setter.Value>
+                                        <ControlTemplate TargetType="Button">
+                                            <Grid x:Name="ButtonLayoutGrid"
+                                                  BorderThickness="5"
+                                                  Background="Yellow">
+                                            </Grid>
+                                        </ControlTemplate>
+                                    </Setter.Value>
+                                </Setter>
+                            </Style>
+                        </Grid.Resources>
+                        <Grid.ColumnDefinitions>
+                            <ColumnDefinition Width="*"/>
+                            <ColumnDefinition Width="Auto"/>
+                        </Grid.ColumnDefinitions>
+                        <Grid.RowDefinitions>
+                            <RowDefinition Height="Auto"/>
+                            <RowDefinition Height="*"/>
+                        </Grid.RowDefinitions>
+                        <Border x:Name="BackgroundElement"
+                                    Grid.Row="1"
+                                    Background="{TemplateBinding Background}"
+                                    Margin="5"
+                                    Opacity="1"
+                                    Grid.ColumnSpan="2"
+                                    Grid.RowSpan="1"/>
+                        <ScrollViewer x:Name="ContentElement"
+                      Grid.Row="1"
+                      HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
+                      HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
+                      VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
+                      VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
+                      IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}"
+                      IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}"
+                      IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}"
+                      Margin="5"
+                      Padding="{TemplateBinding Padding}"
+                      IsTabStop="False"
+                      AutomationProperties.AccessibilityView="Raw"
+                      ZoomMode="Disabled"/>
+
+                        <Button x:Name="DeleteButton"
+                                    Background="Transparent"
+                                    Grid.Row="1"
+                                    FontFamily="Segoe MDL2 Assets"
+                                    Foreground="LightBlue"
+                                    Content="&#xE102;"
+                                    BorderThickness="{TemplateBinding BorderThickness}"
+                                    Margin="{ThemeResource HelperButtonThemePadding}"
+                                    IsTabStop="False"
+                                    Grid.Column="1"
+                                    Visibility="Visible"
+                                    FontSize="{TemplateBinding FontSize}"
+                                    MinWidth="34"
+                                    VerticalAlignment="Stretch"/>
+                    </Grid>
+                </ControlTemplate>
+            </Setter.Value>
+        </Setter>
+    </Style>
+    <Style x:Key="TextBoxStyle2"
+           TargetType="TextBox">
+        <Setter Property="IsReadOnly" Value="True"/>
+        <Setter Property="FontWeight" Value="Bold"/>
+        <Setter Property="Foreground" Value="Black"/>
+        <Setter Property="Background" Value="Transparent"/>
+        <Setter Property="BorderBrush" Value="Transparent"/>
+        <Setter Property="BorderThickness" Value="0"/>
+        <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}"/>
+        <Setter Property="FontSize" Value="12"/>
+    </Style>
+
+    <!-- console -->
     <Style x:Key="ConsoleScrollViewerStyle"
            TargetType="ScrollViewer">
         <Setter Property="Background"
@@ -87,4 +251,59 @@
                 Value="30"/>
     </Style>
 
+    <!-- smartlist -->
+    <Style x:Key="contactsListBoxStyle" TargetType="ListBoxItem">
+        <Setter Property="MinWidth" Value="{StaticResource SplitViewCompactPaneThemeLength}"/>
+        <Setter Property="Height" Value="auto"/>
+        <Setter Property="Padding" Value="0"/>
+    </Style>
+
+    <Style x:Key ="greenRoundedButtonStyle1" TargetType ="Button">
+        <Setter Property="Height" Value="50"/>
+        <Setter Property="FontSize" Value="30"/>
+
+        <Setter Property ="Template">
+            <Setter.Value>
+                <ControlTemplate TargetType ="Button">
+                    <Grid>
+                        <Ellipse Name ="OuterRing" Width ="50" Height ="50" Fill ="LightGreen"/>
+                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="White"/>
+                    </Grid>
+                </ControlTemplate>
+            </Setter.Value>
+        </Setter>
+    </Style>
+    <Style x:Key ="redRoundedButtonStyle1" TargetType ="Button">
+        <Setter Property ="Foreground" Value ="Black"/>
+        <Setter Property ="FontWeight" Value ="Bold"/>
+        <Setter Property ="Template">
+            <Setter.Value>
+                <ControlTemplate TargetType ="Button">
+                    <Grid>
+                        <Ellipse Name ="OuterRing" Width ="50" Height ="50" Fill ="LightCoral"/>
+                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="White"/>
+                    </Grid>
+                </ControlTemplate>
+            </Setter.Value>
+        </Setter>
+    </Style>
+
+    <Style x:Key="BorderStyle1"
+           TargetType="Border">
+        <Setter Property="Background" Value="LightBlue"/>
+        <Setter Property="CornerRadius" Value="6"/>
+        <Setter Property="Width" Value="25"/>
+        <Setter Property="Height" Value="23"/>
+        <Setter Property="Padding" Value="4"/>
+    </Style>
+    <Style x:Key="BorderStyle2"
+           TargetType="Border">
+        <Setter Property="Background" Value="Red"/>
+        <Setter Property="CornerRadius" Value="6"/>
+        <Setter Property="Width" Value="25"/>
+        <Setter Property="Height" Value="23"/>
+        <Setter Property="Padding" Value="4"/>
+    </Style>
+
+
 </ResourceDictionary>

pch.h

@@ -17,4 +17,12 @@
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.   *
 **************************************************************************/
 
+/* standard system include files. */
+#include <ppltasks.h>
+
+/* required by generated headers. */
 #include "App.xaml.h"
+#include "Account.h"
+#include "AccountsViewModel.h"
+#include "Contact.h"
+#include "ContactsViewModel.h"

ring-client-uwp.vcxproj

@@ -158,6 +158,10 @@
     </Link>
   </ItemDefinitionGroup>
   <ItemGroup>
+    <ClInclude Include="Account.h" />
+    <ClInclude Include="AccountsViewModel.h" />
+    <ClInclude Include="Contact.h" />
+    <ClInclude Include="ContactsViewModel.h" />
     <ClInclude Include="pch.h" />
     <ClInclude Include="App.xaml.h">
       <DependentUpon>App.xaml</DependentUpon>
@@ -226,10 +230,14 @@
     <Image Include="Assets\Wide310x150Logo.scale-200.png" />
   </ItemGroup>
   <ItemGroup>
+    <ClCompile Include="Account.cpp" />
+    <ClCompile Include="AccountsViewModel.cpp" />
     <ClCompile Include="App.xaml.cpp">
       <DependentUpon>App.xaml</DependentUpon>
       <AdditionalIncludeDirectories Condition="'$(Configuration)|$(Platform)'=='Release|x64'">..\ring-daemon\MSVC;..\ring-daemon\src\media;..\ring-daemon\src;..\ring-daemon\src\dring;..\ring-daemon\contrib\include;..\ring-daemon\contrib\include\pjlib;..\ring-daemon\contrib\pjproject\third_party\speex\include;%(AdditionalIncludeDirectories)</AdditionalIncludeDirectories>
     </ClCompile>
+    <ClCompile Include="Contact.cpp" />
+    <ClCompile Include="ContactsViewModel.cpp" />
     <ClCompile Include="MainPage.xaml.cpp">
       <DependentUpon>MainPage.xaml</DependentUpon>
     </ClCompile>

ring-client-uwp.vcxproj.filters

@@ -29,6 +29,12 @@
     <Filter Include="Assets\TESTS">
       <UniqueIdentifier>{758258ab-8169-4388-a89d-a834cebce79a}</UniqueIdentifier>
     </Filter>
+    <Filter Include="ModelViews">
+      <UniqueIdentifier>{c9f1f5bd-c315-4f6f-a91b-bc67fe27e0b9}</UniqueIdentifier>
+    </Filter>
+    <Filter Include="Model">
+      <UniqueIdentifier>{8ea3251c-a70e-4de5-9f26-8db3df45c2c4}</UniqueIdentifier>
+    </Filter>
   </ItemGroup>
   <ItemGroup>
     <ApplicationDefinition Include="App.xaml" />
@@ -40,6 +46,18 @@
     <ClCompile Include="WelcomePage.xaml.cpp" />
     <ClCompile Include="SmartPanel.xaml.cpp" />
     <ClCompile Include="RingConsolePanel.xaml.cpp" />
+    <ClCompile Include="Account.cpp">
+      <Filter>Model</Filter>
+    </ClCompile>
+    <ClCompile Include="Contact.cpp">
+      <Filter>Model</Filter>
+    </ClCompile>
+    <ClCompile Include="AccountsViewModel.cpp">
+      <Filter>ModelViews</Filter>
+    </ClCompile>
+    <ClCompile Include="ContactsViewModel.cpp">
+      <Filter>ModelViews</Filter>
+    </ClCompile>
   </ItemGroup>
   <ItemGroup>
     <ClInclude Include="pch.h" />
@@ -48,6 +66,18 @@
     <ClInclude Include="WelcomePage.xaml.h" />
     <ClInclude Include="SmartPanel.xaml.h" />
     <ClInclude Include="RingConsolePanel.xaml.h" />
+    <ClInclude Include="Account.h">
+      <Filter>Model</Filter>
+    </ClInclude>
+    <ClInclude Include="Contact.h">
+      <Filter>Model</Filter>
+    </ClInclude>
+    <ClInclude Include="AccountsViewModel.h">
+      <Filter>ModelViews</Filter>
+    </ClInclude>
+    <ClInclude Include="ContactsViewModel.h">
+      <Filter>ModelViews</Filter>
+    </ClInclude>
   </ItemGroup>
   <ItemGroup>
     <Image Include="Assets\LockScreenLogo.scale-200.png">