<%@ Page Title="Notes" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="notes.aspx.cs" Inherits="Notes" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <link href="Styles/notes.css" rel="stylesheet" />
    <script src="Scripts/notes.js"></script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="FolderContent" runat="Server">
    <nav:FolderNavigationControl runat="server" ID="FolderNavigationControl" Category="Notes" />
    <nav:MobileNavigation runat="server" ID="MobileNavigation" Category="Notes" BreadCrumbText="Categories"></nav:MobileNavigation>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="MainContent" runat="Server">

    <telerik:RadClientDataSource runat="server" ID="rcdsNotes">
        <ClientEvents OnDataParse="notes.DataParse" />
        <DataSource>
            <WebServiceDataSourceSettings BaseUrl="api/">
                <Select Url="notes" RequestType="Get" DataType="JSON" />
            </WebServiceDataSourceSettings>
        </DataSource>
    </telerik:RadClientDataSource>

    <telerik:RadNavigation runat="server" ID="notesNavigation" Skin="BlackMetroTouch" CssClass="secondaryMenu" OnClientNodeClicked="notes.nodeClicked">
        <Nodes>
            <telerik:NavigationNode Text="New" SpriteCssClass="icon icon-Add-Circle" NavigateUrl="new-note.aspx"></telerik:NavigationNode>
            <telerik:NavigationNode Text="Delete"></telerik:NavigationNode>
            <telerik:NavigationNode CssClass="rightScndNav">
                <NodeTemplate>
                    <telerik:RadSearchBox runat="server" Skin="BlackMetroTouch" Width="340px" ID="mainSearch" OnClientSearch="notes.search"
                        CssClass="hidden" ShowLoadingIcon="false" MaxResultCount="10">
                        <WebServiceSettings Path="api/notes" Method="search" UseHttpGet="false" />
                    </telerik:RadSearchBox>
                    <span class="button searchBtn">
                        <span class="icon icon-Search"></span>
                    </span>
                </NodeTemplate>
            </telerik:NavigationNode>
        </Nodes>
    </telerik:RadNavigation>

    <div class="scroller">
        <telerik:RadGrid runat="server" ID="rgNotes" ClientDataSourceID="rcdsNotes" AllowMultiRowSelection="true" RenderMode="Mobile">
            <ClientSettings EnableRowHoverStyle="true">
                <Selecting AllowRowSelect="true" />
                <ClientEvents OnRowContextMenu="notes.contextMenu" />
                <Selecting AllowRowSelect="true" />
            </ClientSettings>
            <MasterTableView ClientDataKeyNames="Id,CategoryId">
                <Columns>
                    <telerik:GridClientSelectColumn HeaderText="Select"></telerik:GridClientSelectColumn>
                    <telerik:GridBoundColumn DataField="Subject" HeaderText="Subject"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="DateCreated" HeaderText="Created On" DataFormatString="{0:d/M/yyyy HH:mm:ss}"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="Name" HeaderText="Category"></telerik:GridBoundColumn>
                </Columns>
            </MasterTableView>
        </telerik:RadGrid>
    </div>

    <input type="hidden" id="clickedRowNoteId" />
    <input type="hidden" id="clickedRowCategoryId" />

    <telerik:RadContextMenu runat="server" ID="notesContextMenu" OnClientItemClicked="notes.contextMenuItemClicked" ClientIDMode="Static">
        <Items>
            <telerik:RadMenuItem Text="Open"></telerik:RadMenuItem>
            <telerik:RadMenuItem Text="Move">
                <Items>
                    <telerik:RadMenuItem Text="All"></telerik:RadMenuItem>
                    <telerik:RadMenuItem Text="Personal"></telerik:RadMenuItem>
                    <telerik:RadMenuItem Text="Work"></telerik:RadMenuItem>
                </Items>
            </telerik:RadMenuItem>
            <telerik:RadMenuItem Text="Delete"></telerik:RadMenuItem>
        </Items>
    </telerik:RadContextMenu>

    <telerik:RadWindow runat="server" ID="rwNotesPreview" Behaviors="Close,Move,Resize" Width="700" Height="650" VisibleStatusbar="false">
        <ContentTemplate>
            <telerik:RadEditor runat="server" ID="NoteContent" ContentAreaCssFile="Styles/editor.css" Height="520" MaxTextLength="500" 
                MaxHtmlLength="500" EditModes="Design" EmptyMessage="Your Text ...">
                <Tools>
                    <telerik:EditorToolGroup>
                        <telerik:EditorTool Name="Bold" />
                        <telerik:EditorTool Name="Italic" />
                        <telerik:EditorTool Name="Underline" />
                        <telerik:EditorTool Name="StrikeThrough" />
                        <telerik:EditorTool Name="JustifyLeft" />
                        <telerik:EditorTool Name="JustifyCenter" />
                        <telerik:EditorTool Name="JustifyRight" />
                        <telerik:EditorTool Name="JustifyFull" />
                        <telerik:EditorTool Name="JustifyNone" />
                        <telerik:EditorTool Name="Indent" />
                        <telerik:EditorTool Name="Outdent" />
                        <telerik:EditorTool Name="InsertOrderedList" />
                        <telerik:EditorTool Name="InsertUnorderedList" />
                        <telerik:EditorTool Name="ForeColor" />
                        <telerik:EditorTool Name="BackColor" />
                        <telerik:EditorTool Name="ConvertToLower" />
                        <telerik:EditorTool Name="ConvertToUpper" />
                        <telerik:EditorTool Name="AjaxSpellCheck" />
                    </telerik:EditorToolGroup>
                </Tools>
            </telerik:RadEditor>
            <div>
                <telerik:RadButton ID="rbUpdate" runat="server" Text="Update" AutoPostBack="false" OnClientClicked="notes.updateNoteClick"></telerik:RadButton>
                <telerik:RadButton ID="rbCancel" runat="server" Text="Cancel" AutoPostBack="false" OnClientClicked="notes.cancelEditClick"></telerik:RadButton>
            </div>
        </ContentTemplate>
    </telerik:RadWindow>
</asp:Content>

