0210395
/
time1


			
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357
							<!doctype html>
<html class="no-js" lang="">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>time1 documentation</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <link rel="icon" type="image/x-icon" href="../images/favicon.ico">
	   <link rel="stylesheet" href="../styles/style.css">
        <link rel="stylesheet" href="../styles/dark.css">
    </head>
    <body>
          <script>
               // Blocking script to avoid flickering dark mode
               // Dark mode toggle button
               var useDark = window.matchMedia('(prefers-color-scheme: dark)');
               var darkModeState = useDark.matches;
               var $darkModeToggleSwitchers = document.querySelectorAll('.dark-mode-switch input');
               var $darkModeToggles = document.querySelectorAll('.dark-mode-switch');
               var darkModeStateLocal = localStorage.getItem('compodoc_darkmode-state');

               function checkToggle(check) {
                    for (var i = 0; i < $darkModeToggleSwitchers.length; i++) {
                         $darkModeToggleSwitchers[i].checked = check;
                    }
               }

               function toggleDarkMode(state) {
                    if (window.localStorage) {
                         localStorage.setItem('compodoc_darkmode-state', state);
                    }

                    checkToggle(state);

                    const hasClass = document.body.classList.contains('dark');

                    if (state) {
                         for (var i = 0; i < $darkModeToggles.length; i++) {
                              $darkModeToggles[i].classList.add('dark');
                         }
                         if (!hasClass) {
                              document.body.classList.add('dark');
                         }
                    } else {
                         for (var i = 0; i < $darkModeToggles.length; i++) {
                              $darkModeToggles[i].classList.remove('dark');
                         }
                         if (hasClass) {
                              document.body.classList.remove('dark');
                         }
                    }
               }

               useDark.addEventListener('change', function (evt) {
                    toggleDarkMode(evt.matches);
               });
               if (darkModeStateLocal) {
                    darkModeState = darkModeStateLocal === 'true';
               }
               toggleDarkMode(darkModeState);
          </script>

        <div class="navbar navbar-default navbar-fixed-top d-md-none p-0">
               <div class="d-flex">
                    <a href="../" class="navbar-brand">time1 documentation</a>
                    <button type="button" class="btn btn-default btn-menu ion-ios-menu" id="btn-menu"></button>
               </div>
        </div>

        <div class="xs-menu menu" id="mobile-menu">
                <div id="book-search-input" role="search"><input type="text" placeholder="Type to search"></div>            <compodoc-menu></compodoc-menu>
        </div>

        <div class="container-fluid main">
           <div class="row main">
               <div class="d-none d-md-block menu">
                   <compodoc-menu mode="normal"></compodoc-menu>
               </div>
               <!-- START CONTENT -->
               <div class="content component">
                   <div class="content-data">


<ol class="breadcrumb">
  <li class="breadcrumb-item">Components</li>
  <li class="breadcrumb-item"
  >
  TasksPage</li>
</ol>

<ul class="nav nav-tabs" role="tablist">
        <li class="nav-item">
            <a href="#info" class="nav-link active"
                role="tab" id="info-tab" data-bs-toggle="tab" data-link="info">Info</a>
        </li>
        <li class="nav-item">
            <a href="#source" class="nav-link"
                role="tab" id="source-tab" data-bs-toggle="tab" data-link="source">Source</a>
        </li>
        <li class="nav-item">
            <a href="#templateData" class="nav-link"
                role="tab" id="templateData-tab" data-bs-toggle="tab" data-link="template">Template</a>
        </li>
        <li class="nav-item">
            <a href="#styleData" class="nav-link"
                role="tab" id="styleData-tab" data-bs-toggle="tab" data-link="style">Styles</a>
        </li>
        <li class="nav-item">
            <a href="#tree" class="nav-link"
                role="tab" id="tree-tab" data-bs-toggle="tab" data-link="dom-tree">DOM Tree</a>
        </li>
</ul>

<div class="tab-content">
    <div class="tab-pane fade active in" id="info"><p class="comment">
    <h3>File</h3>
</p>
<p class="comment">
    <code>src/app/tasks/tasks.page.ts</code>
</p>


<section data-compodoc="block-metadata">
    <h3>Metadata</h3>
    <table class="table table-sm table-hover metadata">
        <tbody>


            <tr>
                <td class="col-md-3">selector</td>
                <td class="col-md-9"><code>app-tasks</code></td>
            </tr>


            <tr>
                <td class="col-md-3">styleUrls</td>
                <td class="col-md-9"><code>./tasks.page.scss</code></td>
            </tr>


            <tr>
                <td class="col-md-3">templateUrl</td>
                <td class="col-md-9"><code>./tasks.page.html</code></td>
            </tr>


        </tbody>
    </table>
</section>

    <section data-compodoc="block-index">
    <h3 id="index">Index</h3>
    <table class="table table-sm table-bordered index-table">
        <tbody>
                <tr>
                    <td class="col-md-4">
                        <h6><b>Properties</b></h6>
                    </td>
                </tr>
                <tr>
                    <td class="col-md-4">
                        <ul class="index-list">
                            <li>
                                <a href="#tasks" >tasks</a>
                            </li>
                        </ul>
                    </td>
                </tr>

                <tr>
                    <td class="col-md-4">
                        <h6><b>Methods</b></h6>
                    </td>
                </tr>
                <tr>
                    <td class="col-md-4">
                        <ul class="index-list">
                            <li>
                                <a href="#addTask" >addTask</a>
                            </li>
                            <li>
                                <a href="#clearTime" >clearTime</a>
                            </li>
                            <li>
                                <a href="#deleteTask" >deleteTask</a>
                            </li>
                            <li>
                                <a href="#editTask" >editTask</a>
                            </li>
                            <li>
                                <a href="#formatHour" >formatHour</a>
                            </li>
                            <li>
                                <a href="#formatMinute" >formatMinute</a>
                            </li>
                            <li>
                                <a href="#isValidTime" >isValidTime</a>
                            </li>
                            <li>
                                <a href="#padZero" >padZero</a>
                            </li>
                            <li>
                                    <span class="modifier">Async</span>
                                <a href="#saveTask" >saveTask</a>
                            </li>
                            <li>
                                <a href="#sortTasks" >sortTasks</a>
                            </li>
                        </ul>
                    </td>
                </tr>


        </tbody>
    </table>
</section>

    <section data-compodoc="block-constructor">
    <h3 id="constructor">Constructor</h3>
        <table class="table table-sm table-bordered">
            <tbody>
                <tr>
                    <td class="col-md-4">
<code>constructor(alertController: AlertController)</code>
                    </td>
                </tr>
                        <tr>
                            <td class="col-md-4">
                                <div class="io-line">Defined in <a href="" data-line="15" class="link-to-prism">src/app/tasks/tasks.page.ts:15</a></div>
                            </td>
                        </tr>

                <tr>
                    <td class="col-md-4">
                            <div>
                                    <b>Parameters :</b>
                                    <table class="params">
                                        <thead>
                                            <tr>
                                                <td>Name</td>
                                                    <td>Type</td>
                                                <td>Optional</td>
                                            </tr>
                                        </thead>
                                        <tbody>
                                                <tr>
                                                        <td>alertController</td>
                                                  
                                                        <td>
                                                                    <code>AlertController</code>
                                                        </td>
                                                  
                                                    <td>
                                                            No
                                                    </td>
                                                    
                                                </tr>
                                        </tbody>
                                    </table>
                            </div>
                    </td>
                </tr>
            </tbody>
        </table>
</section>


    <section data-compodoc="block-methods">
    
    <h3 id="methods">
        Methods
    </h3>
    <table class="table table-sm table-bordered">
        <tbody>
            <tr>
                <td class="col-md-4">
                    <a name="addTask"></a>
                    <span class="name">
                        <span ><b>addTask</b></span>
                        <a href="#addTask"><span class="icon ion-ios-link"></span></a>
                    </span>
                </td>
            </tr>
            <tr>
                <td class="col-md-4">
<code>addTask()</code>
                </td>
            </tr>


                    <tr>
                        <td class="col-md-4">
                            <div class="io-line">Defined in <a href="" data-line="40"
                                    class="link-to-prism">src/app/tasks/tasks.page.ts:40</a></div>
                        </td>
                    </tr>


            <tr>
                <td class="col-md-4">

                        <div class="io-description">
                            <b>Returns : </b>        <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>

                        </div>
                </td>
            </tr>
        </tbody>
    </table>
    <table class="table table-sm table-bordered">
        <tbody>
            <tr>
                <td class="col-md-4">
                    <a name="clearTime"></a>
                    <span class="name">
                        <span ><b>clearTime</b></span>
                        <a href="#clearTime"><span class="icon ion-ios-link"></span></a>
                    </span>
                </td>
            </tr>
            <tr>
                <td class="col-md-4">
<code>clearTime(task: literal type, type: "start" | "end")</code>
                </td>
            </tr>


                    <tr>
                        <td class="col-md-4">
                            <div class="io-line">Defined in <a href="" data-line="48"
                                    class="link-to-prism">src/app/tasks/tasks.page.ts:48</a></div>
                        </td>
                    </tr>


            <tr>
                <td class="col-md-4">

                            <div class="io-description">
                                <b>Parameters :</b>
                                
                                <table class="params">
                                    <thead>
                                        <tr>
                                            <td>Name</td>
                                                <td>Type</td>
                                            <td>Optional</td>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                                <td>task</td>
                                            <td>
                                                        <code>literal type</code>
                                            </td>

                                            <td>
                                                    No
                                            </td>


                                        </tr>
                                        <tr>
                                                <td>type</td>
                                            <td>
                                                        <code>&quot;start&quot; | &quot;end&quot;</code>
                                            </td>

                                            <td>
                                                    No
                                            </td>


                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        <div class="io-description">
                            <b>Returns : </b>        <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>

                        </div>
                            <div class="io-description">
                                
                            </div>
                </td>
            </tr>
        </tbody>
    </table>
    <table class="table table-sm table-bordered">
        <tbody>
            <tr>
                <td class="col-md-4">
                    <a name="deleteTask"></a>
                    <span class="name">
                        <span ><b>deleteTask</b></span>
                        <a href="#deleteTask"><span class="icon ion-ios-link"></span></a>
                    </span>
                </td>
            </tr>
            <tr>
                <td class="col-md-4">
<code>deleteTask(index: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/number" target="_blank">number</a>)</code>
                </td>
            </tr>


                    <tr>
                        <td class="col-md-4">
                            <div class="io-line">Defined in <a href="" data-line="44"
                                    class="link-to-prism">src/app/tasks/tasks.page.ts:44</a></div>
                        </td>
                    </tr>


            <tr>
                <td class="col-md-4">

                            <div class="io-description">
                                <b>Parameters :</b>
                                
                                <table class="params">
                                    <thead>
                                        <tr>
                                            <td>Name</td>
                                                <td>Type</td>
                                            <td>Optional</td>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                                <td>index</td>
                                            <td>
                                                            <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/number" target="_blank" >number</a></code>
                                            </td>

                                            <td>
                                                    No
                                            </td>


                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        <div class="io-description">
                            <b>Returns : </b>        <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>

                        </div>
                            <div class="io-description">
                                
                            </div>
                </td>
            </tr>
        </tbody>
    </table>
    <table class="table table-sm table-bordered">
        <tbody>
            <tr>
                <td class="col-md-4">
                    <a name="editTask"></a>
                    <span class="name">
                        <span ><b>editTask</b></span>
                        <a href="#editTask"><span class="icon ion-ios-link"></span></a>
                    </span>
                </td>
            </tr>
            <tr>
                <td class="col-md-4">
<code>editTask(index: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/number" target="_blank">number</a>)</code>
                </td>
            </tr>


                    <tr>
                        <td class="col-md-4">
                            <div class="io-line">Defined in <a href="" data-line="19"
                                    class="link-to-prism">src/app/tasks/tasks.page.ts:19</a></div>
                        </td>
                    </tr>


            <tr>
                <td class="col-md-4">

                            <div class="io-description">
                                <b>Parameters :</b>
                                
                                <table class="params">
                                    <thead>
                                        <tr>
                                            <td>Name</td>
                                                <td>Type</td>
                                            <td>Optional</td>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                                <td>index</td>
                                            <td>
                                                            <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/number" target="_blank" >number</a></code>
                                            </td>

                                            <td>
                                                    No
                                            </td>


                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        <div class="io-description">
                            <b>Returns : </b>        <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>

                        </div>
                            <div class="io-description">
                                
                            </div>
                </td>
            </tr>
        </tbody>
    </table>
    <table class="table table-sm table-bordered">
        <tbody>
            <tr>
                <td class="col-md-4">
                    <a name="formatHour"></a>
                    <span class="name">
                        <span ><b>formatHour</b></span>
                        <a href="#formatHour"><span class="icon ion-ios-link"></span></a>
                    </span>
                </td>
            </tr>
            <tr>
                <td class="col-md-4">
<code>formatHour(task: literal type, type: "start" | "end")</code>
                </td>
            </tr>


                    <tr>
                        <td class="col-md-4">
                            <div class="io-line">Defined in <a href="" data-line="58"
                                    class="link-to-prism">src/app/tasks/tasks.page.ts:58</a></div>
                        </td>
                    </tr>


            <tr>
                <td class="col-md-4">

                            <div class="io-description">
                                <b>Parameters :</b>
                                
                                <table class="params">
                                    <thead>
                                        <tr>
                                            <td>Name</td>
                                                <td>Type</td>
                                            <td>Optional</td>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                                <td>task</td>
                                            <td>
                                                        <code>literal type</code>
                                            </td>

                                            <td>
                                                    No
                                            </td>


                                        </tr>
                                        <tr>
                                                <td>type</td>
                                            <td>
                                                        <code>&quot;start&quot; | &quot;end&quot;</code>
                                            </td>

                                            <td>
                                                    No
                                            </td>


                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        <div class="io-description">
                            <b>Returns : </b>        <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>

                        </div>
                            <div class="io-description">
                                
                            </div>
                </td>
            </tr>
        </tbody>
    </table>
    <table class="table table-sm table-bordered">
        <tbody>
            <tr>
                <td class="col-md-4">
                    <a name="formatMinute"></a>
                    <span class="name">
                        <span ><b>formatMinute</b></span>
                        <a href="#formatMinute"><span class="icon ion-ios-link"></span></a>
                    </span>
                </td>
            </tr>
            <tr>
                <td class="col-md-4">
<code>formatMinute(task: literal type, type: "start" | "end")</code>
                </td>
            </tr>


                    <tr>
                        <td class="col-md-4">
                            <div class="io-line">Defined in <a href="" data-line="66"
                                    class="link-to-prism">src/app/tasks/tasks.page.ts:66</a></div>
                        </td>
                    </tr>


            <tr>
                <td class="col-md-4">

                            <div class="io-description">
                                <b>Parameters :</b>
                                
                                <table class="params">
                                    <thead>
                                        <tr>
                                            <td>Name</td>
                                                <td>Type</td>
                                            <td>Optional</td>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                                <td>task</td>
                                            <td>
                                                        <code>literal type</code>
                                            </td>

                                            <td>
                                                    No
                                            </td>


                                        </tr>
                                        <tr>
                                                <td>type</td>
                                            <td>
                                                        <code>&quot;start&quot; | &quot;end&quot;</code>
                                            </td>

                                            <td>
                                                    No
                                            </td>


                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        <div class="io-description">
                            <b>Returns : </b>        <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>

                        </div>
                            <div class="io-description">
                                
                            </div>
                </td>
            </tr>
        </tbody>
    </table>
    <table class="table table-sm table-bordered">
        <tbody>
            <tr>
                <td class="col-md-4">
                    <a name="isValidTime"></a>
                    <span class="name">
                        <span ><b>isValidTime</b></span>
                        <a href="#isValidTime"><span class="icon ion-ios-link"></span></a>
                    </span>
                </td>
            </tr>
            <tr>
                <td class="col-md-4">
<code>isValidTime(hour: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank">string</a>, minute: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank">string</a>)</code>
                </td>
            </tr>


                    <tr>
                        <td class="col-md-4">
                            <div class="io-line">Defined in <a href="" data-line="78"
                                    class="link-to-prism">src/app/tasks/tasks.page.ts:78</a></div>
                        </td>
                    </tr>


            <tr>
                <td class="col-md-4">

                            <div class="io-description">
                                <b>Parameters :</b>
                                
                                <table class="params">
                                    <thead>
                                        <tr>
                                            <td>Name</td>
                                                <td>Type</td>
                                            <td>Optional</td>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                                <td>hour</td>
                                            <td>
                                                            <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
                                            </td>

                                            <td>
                                                    No
                                            </td>


                                        </tr>
                                        <tr>
                                                <td>minute</td>
                                            <td>
                                                            <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
                                            </td>

                                            <td>
                                                    No
                                            </td>


                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        <div class="io-description">
                            <b>Returns : </b>        <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/boolean" target="_blank" >boolean</a></code>

                        </div>
                            <div class="io-description">
                                
                            </div>
                </td>
            </tr>
        </tbody>
    </table>
    <table class="table table-sm table-bordered">
        <tbody>
            <tr>
                <td class="col-md-4">
                    <a name="padZero"></a>
                    <span class="name">
                        <span ><b>padZero</b></span>
                        <a href="#padZero"><span class="icon ion-ios-link"></span></a>
                    </span>
                </td>
            </tr>
            <tr>
                <td class="col-md-4">
<code>padZero(num: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank">string</a>)</code>
                </td>
            </tr>


                    <tr>
                        <td class="col-md-4">
                            <div class="io-line">Defined in <a href="" data-line="74"
                                    class="link-to-prism">src/app/tasks/tasks.page.ts:74</a></div>
                        </td>
                    </tr>


            <tr>
                <td class="col-md-4">

                            <div class="io-description">
                                <b>Parameters :</b>
                                
                                <table class="params">
                                    <thead>
                                        <tr>
                                            <td>Name</td>
                                                <td>Type</td>
                                            <td>Optional</td>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                                <td>num</td>
                                            <td>
                                                            <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
                                            </td>

                                            <td>
                                                    No
                                            </td>


                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        <div class="io-description">
                            <b>Returns : </b>        <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>

                        </div>
                            <div class="io-description">
                                
                            </div>
                </td>
            </tr>
        </tbody>
    </table>
    <table class="table table-sm table-bordered">
        <tbody>
            <tr>
                <td class="col-md-4">
                    <a name="saveTask"></a>
                    <span class="name">
                            <span class="modifier">Async</span>
                        <span ><b>saveTask</b></span>
                        <a href="#saveTask"><span class="icon ion-ios-link"></span></a>
                    </span>
                </td>
            </tr>
            <tr>
                <td class="col-md-4">
                        <span class="modifier-icon icon ion-ios-reset"></span>
                    <code>saveTask(index: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/number" target="_blank">number</a>)</code>
                </td>
            </tr>


                    <tr>
                        <td class="col-md-4">
                            <div class="io-line">Defined in <a href="" data-line="23"
                                    class="link-to-prism">src/app/tasks/tasks.page.ts:23</a></div>
                        </td>
                    </tr>


            <tr>
                <td class="col-md-4">

                            <div class="io-description">
                                <b>Parameters :</b>
                                
                                <table class="params">
                                    <thead>
                                        <tr>
                                            <td>Name</td>
                                                <td>Type</td>
                                            <td>Optional</td>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                                <td>index</td>
                                            <td>
                                                            <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/number" target="_blank" >number</a></code>
                                            </td>

                                            <td>
                                                    No
                                            </td>


                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        <div class="io-description">
                            <b>Returns : </b>        <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >any</a></code>

                        </div>
                            <div class="io-description">
                                
                            </div>
                </td>
            </tr>
        </tbody>
    </table>
    <table class="table table-sm table-bordered">
        <tbody>
            <tr>
                <td class="col-md-4">
                    <a name="sortTasks"></a>
                    <span class="name">
                        <span ><b>sortTasks</b></span>
                        <a href="#sortTasks"><span class="icon ion-ios-link"></span></a>
                    </span>
                </td>
            </tr>
            <tr>
                <td class="col-md-4">
<code>sortTasks()</code>
                </td>
            </tr>


                    <tr>
                        <td class="col-md-4">
                            <div class="io-line">Defined in <a href="" data-line="84"
                                    class="link-to-prism">src/app/tasks/tasks.page.ts:84</a></div>
                        </td>
                    </tr>


            <tr>
                <td class="col-md-4">

                        <div class="io-description">
                            <b>Returns : </b>        <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>

                        </div>
                </td>
            </tr>
        </tbody>
    </table>
</section>
    <section data-compodoc="block-properties">
    
    <h3 id="inputs">
        Properties
    </h3>
    <table class="table table-sm table-bordered">
        <tbody>
            <tr>
                <td class="col-md-4">
                    <a name="tasks"></a>
                    <span class="name">
                        <span ><b>tasks</b></span>
                        <a href="#tasks"><span class="icon ion-ios-link"></span></a>
                    </span>
                </td>
            </tr>
                <tr>
                    <td class="col-md-4">
                        <i>Type : </i>    <code>literal type[]</code>

                    </td>
                </tr>
                <tr>
                    <td class="col-md-4">
                        <i>Default value : </i><code>[
    { startTime: &#x27;08:00&#x27;, endTime: &#x27;11:30&#x27;, content: &#x27;早间任务&#x27;, editing: false, startHour: &#x27;08&#x27;, startMinute: &#x27;00&#x27;, endHour: &#x27;11&#x27;, endMinute: &#x27;30&#x27; },
    { startTime: &#x27;12:00&#x27;, endTime: &#x27;17:30&#x27;, content: &#x27;中间任务&#x27;, editing: false, startHour: &#x27;12&#x27;, startMinute: &#x27;00&#x27;, endHour: &#x27;17&#x27;, endMinute: &#x27;30&#x27; },
    { startTime: &#x27;18:00&#x27;, endTime: &#x27;21:30&#x27;, content: &#x27;晚间任务&#x27;, editing: false, startHour: &#x27;18&#x27;, startMinute: &#x27;00&#x27;, endHour: &#x27;21&#x27;, endMinute: &#x27;30&#x27; },
    // Add more tasks as needed
  ]</code>
                    </td>
                </tr>
                    <tr>
                        <td class="col-md-4">
                                <div class="io-line">Defined in <a href="" data-line="10" class="link-to-prism">src/app/tasks/tasks.page.ts:10</a></div>
                        </td>
                    </tr>


        </tbody>
    </table>
</section>

</div>


    <div class="tab-pane fade  tab-source-code" id="source">
        <pre class="line-numbers compodoc-sourcecode"><code class="language-typescript">import { Component } from &#x27;@angular/core&#x27;;
import { AlertController } from &#x27;@ionic/angular&#x27;;

@Component({
  selector: &#x27;app-tasks&#x27;,
  templateUrl: &#x27;./tasks.page.html&#x27;,
  styleUrls: [&#x27;./tasks.page.scss&#x27;],
})
export class TasksPage {
  tasks: { startTime: string; endTime: string; content: string; editing: boolean; startHour: string; startMinute: string; endHour: string; endMinute: string; }[] &#x3D; [
    { startTime: &#x27;08:00&#x27;, endTime: &#x27;11:30&#x27;, content: &#x27;早间任务&#x27;, editing: false, startHour: &#x27;08&#x27;, startMinute: &#x27;00&#x27;, endHour: &#x27;11&#x27;, endMinute: &#x27;30&#x27; },
    { startTime: &#x27;12:00&#x27;, endTime: &#x27;17:30&#x27;, content: &#x27;中间任务&#x27;, editing: false, startHour: &#x27;12&#x27;, startMinute: &#x27;00&#x27;, endHour: &#x27;17&#x27;, endMinute: &#x27;30&#x27; },
    { startTime: &#x27;18:00&#x27;, endTime: &#x27;21:30&#x27;, content: &#x27;晚间任务&#x27;, editing: false, startHour: &#x27;18&#x27;, startMinute: &#x27;00&#x27;, endHour: &#x27;21&#x27;, endMinute: &#x27;30&#x27; },
    // Add more tasks as needed
  ];

  constructor(private alertController: AlertController) {}

  editTask(index: number) {
    this.tasks[index].editing &#x3D; true;
  }

  async saveTask(index: number) {
    const task &#x3D; this.tasks[index];
    if (this.isValidTime(task.startHour, task.startMinute) &amp;&amp; this.isValidTime(task.endHour, task.endMinute)) {
      task.startTime &#x3D; &#x60;${this.padZero(task.startHour)}:${this.padZero(task.startMinute)}&#x60;;
      task.endTime &#x3D; &#x60;${this.padZero(task.endHour)}:${this.padZero(task.endMinute)}&#x60;;
      task.editing &#x3D; false;
      this.sortTasks();
    } else {
      const alert &#x3D; await this.alertController.create({
        header: &#x27;时间错误&#x27;,
        message: &#x27;小时不能超过24，分钟不能超过60。&#x27;,
        buttons: [&#x27;确定&#x27;]
      });
      await alert.present();
    }
  }

  addTask() {
    this.tasks.push({ startTime: &#x27;00:00&#x27;, endTime: &#x27;00:00&#x27;, content: &#x27;新任务&#x27;, editing: true, startHour: &#x27;00&#x27;, startMinute: &#x27;00&#x27;, endHour: &#x27;00&#x27;, endMinute: &#x27;00&#x27; });
  }

  deleteTask(index: number) {
    this.tasks.splice(index, 1);
  }

  clearTime(task: { startHour: string; startMinute: string; endHour: string; endMinute: string; }, type: &#x27;start&#x27; | &#x27;end&#x27;) {
    if (type &#x3D;&#x3D;&#x3D; &#x27;start&#x27;) {
      task.startHour &#x3D; &#x27;&#x27;;
      task.startMinute &#x3D; &#x27;&#x27;;
    } else {
      task.endHour &#x3D; &#x27;&#x27;;
      task.endMinute &#x3D; &#x27;&#x27;;
    }
  }

  formatHour(task: { startHour: string; endHour: string; }, type: &#x27;start&#x27; | &#x27;end&#x27;) {
    if (type &#x3D;&#x3D;&#x3D; &#x27;start&#x27; &amp;&amp; task.startHour) {
      task.startHour &#x3D; this.padZero(task.startHour);
    } else if (type &#x3D;&#x3D;&#x3D; &#x27;end&#x27; &amp;&amp; task.endHour) {
      task.endHour &#x3D; this.padZero(task.endHour);
    }
  }

  formatMinute(task: { startMinute: string; endMinute: string; }, type: &#x27;start&#x27; | &#x27;end&#x27;) {
    if (type &#x3D;&#x3D;&#x3D; &#x27;start&#x27; &amp;&amp; task.startMinute) {
      task.startMinute &#x3D; this.padZero(task.startMinute);
    } else if (type &#x3D;&#x3D;&#x3D; &#x27;end&#x27; &amp;&amp; task.endMinute) {
      task.endMinute &#x3D; this.padZero(task.endMinute);
    }
  }

  padZero(num: string): string {
    return num.length &lt; 2 ? &#x27;0&#x27; + num : num;
  }

  isValidTime(hour: string, minute: string): boolean {
    const h &#x3D; parseInt(hour, 10);
    const m &#x3D; parseInt(minute, 10);
    return h &gt;&#x3D; 0 &amp;&amp; h &lt; 24 &amp;&amp; m &gt;&#x3D; 0 &amp;&amp; m &lt; 60;
  }

  sortTasks() {
    this.tasks.sort((a, b) &#x3D;&gt; {
      const aStart &#x3D; parseInt(a.startHour) * 60 + parseInt(a.startMinute);
      const bStart &#x3D; parseInt(b.startHour) * 60 + parseInt(b.startMinute);
      return aStart - bStart;
    });
  }
}
</code></pre>
    </div>

    <div class="tab-pane fade " id="templateData">
        <pre class="line-numbers"><code class="language-html">&lt;ion-header&gt;
  &lt;ion-toolbar&gt;
    &lt;ion-title&gt;任务管理&lt;/ion-title&gt;
  &lt;/ion-toolbar&gt;
&lt;/ion-header&gt;

&lt;ion-content&gt;
  &lt;div *ngIf&#x3D;&quot;tasks.length &#x3D;&#x3D;&#x3D; 0&quot; class&#x3D;&quot;empty-tasks&quot;&gt;
    &lt;ion-text color&#x3D;&quot;medium&quot;&gt;
      &lt;h2&gt;您的任务空空如也，来添加一些任务吧！&lt;/h2&gt;
    &lt;/ion-text&gt;
  &lt;/div&gt;

  &lt;ion-list *ngIf&#x3D;&quot;tasks.length &gt; 0&quot;&gt;
    &lt;ion-item-sliding *ngFor&#x3D;&quot;let task of tasks; let i &#x3D; index&quot;&gt;
      &lt;ion-item&gt;
        &lt;ion-button fill&#x3D;&quot;outline&quot; (click)&#x3D;&quot;editTask(i)&quot; slot&#x3D;&quot;start&quot; class&#x3D;&quot;edit-button&quot;&gt;
          &lt;ion-icon name&#x3D;&quot;create-outline&quot;&gt;&lt;/ion-icon&gt;
        &lt;/ion-button&gt;
        &lt;ion-label *ngIf&#x3D;&quot;!task.editing&quot; class&#x3D;&quot;time-label&quot;&gt;{{task.startTime}} - {{task.endTime}}&lt;/ion-label&gt;
        &lt;div *ngIf&#x3D;&quot;task.editing&quot; class&#x3D;&quot;time-edit&quot;&gt;
          &lt;ion-input [(ngModel)]&#x3D;&quot;task.startHour&quot; (ionBlur)&#x3D;&quot;formatHour(task, &#x27;start&#x27;)&quot; placeholder&#x3D;&quot;时&quot; type&#x3D;&quot;text&quot; inputmode&#x3D;&quot;numeric&quot; maxlength&#x3D;&quot;2&quot; class&#x3D;&quot;time-input&quot;&gt;&lt;/ion-input&gt;
          &lt;span&gt;:&lt;/span&gt;
          &lt;ion-input [(ngModel)]&#x3D;&quot;task.startMinute&quot; (ionBlur)&#x3D;&quot;formatMinute(task, &#x27;start&#x27;)&quot; placeholder&#x3D;&quot;分&quot; type&#x3D;&quot;text&quot; inputmode&#x3D;&quot;numeric&quot; maxlength&#x3D;&quot;2&quot; class&#x3D;&quot;time-input&quot;&gt;&lt;/ion-input&gt;
          &lt;span&gt; - &lt;/span&gt;
          &lt;ion-input [(ngModel)]&#x3D;&quot;task.endHour&quot; (ionBlur)&#x3D;&quot;formatHour(task, &#x27;end&#x27;)&quot; placeholder&#x3D;&quot;时&quot; type&#x3D;&quot;text&quot; inputmode&#x3D;&quot;numeric&quot; maxlength&#x3D;&quot;2&quot; class&#x3D;&quot;time-input&quot;&gt;&lt;/ion-input&gt;
          &lt;span&gt;:&lt;/span&gt;
          &lt;ion-input [(ngModel)]&#x3D;&quot;task.endMinute&quot; (ionBlur)&#x3D;&quot;formatMinute(task, &#x27;end&#x27;)&quot; placeholder&#x3D;&quot;分&quot; type&#x3D;&quot;text&quot; inputmode&#x3D;&quot;numeric&quot; maxlength&#x3D;&quot;2&quot; class&#x3D;&quot;time-input&quot;&gt;&lt;/ion-input&gt;
        &lt;/div&gt;
        &lt;ion-label *ngIf&#x3D;&quot;!task.editing&quot; class&#x3D;&quot;content-label&quot;&gt;{{task.content}}&lt;/ion-label&gt;
        &lt;ion-input *ngIf&#x3D;&quot;task.editing&quot; [(ngModel)]&#x3D;&quot;task.content&quot; class&#x3D;&quot;content-input&quot;&gt;&lt;/ion-input&gt;
        &lt;ion-button *ngIf&#x3D;&quot;task.editing&quot; (click)&#x3D;&quot;saveTask(i)&quot; slot&#x3D;&quot;end&quot; class&#x3D;&quot;save-button&quot;&gt;
          &lt;ion-icon name&#x3D;&quot;checkmark-outline&quot;&gt;&lt;/ion-icon&gt;
        &lt;/ion-button&gt;
      &lt;/ion-item&gt;
      &lt;ion-item-options side&#x3D;&quot;end&quot;&gt;
        &lt;ion-item-option color&#x3D;&quot;danger&quot; (click)&#x3D;&quot;deleteTask(i)&quot; class&#x3D;&quot;delete-button&quot;&gt;删除&lt;/ion-item-option&gt;
      &lt;/ion-item-options&gt;
    &lt;/ion-item-sliding&gt;
  &lt;/ion-list&gt;

  &lt;ion-fab vertical&#x3D;&quot;bottom&quot; horizontal&#x3D;&quot;center&quot; slot&#x3D;&quot;fixed&quot;&gt;
    &lt;ion-fab-button (click)&#x3D;&quot;addTask()&quot;&gt;
      &lt;ion-icon name&#x3D;&quot;add-outline&quot;&gt;&lt;/ion-icon&gt;
    &lt;/ion-fab-button&gt;
  &lt;/ion-fab&gt;
&lt;/ion-content&gt;
</code></pre>
    </div>

    <div class="tab-pane fade " id="styleData">
                <p class="comment">
                    <code>./tasks.page.scss</code>
                </p>
                <pre class="line-numbers"><code class="language-scss">ion-content {
  --background: #f0f0f5;

  .empty-tasks {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    text-align: center;
  }

  ion-list {
    margin: 20px;

    ion-item {
      --background: #ffffff;
      --border-radius: 8px;
      margin-bottom: 15px;
      box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
      height: 100px; /* Increased height for better touch area */
      align-items: center; /* Center content vertically */
      display: flex; /* Use flexbox for vertical alignment */
      font-size: 18px;

      .edit-button, .save-button {
        font-size: 24px;
      }

      .time-label, .content-label, .content-input, .time-input {
        flex: 1; /* Ensure content takes up available space */
        text-align: center; /* Center text horizontally */
      }

      .time-edit {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 1; /* Ensure the time-edit div takes up available space */
        font-size: 18px;

        ion-input {
          max-width: 50px;
          margin: 0 5px;
          text-align: center;
          --padding-start: 0;
          --padding-end: 0;
          --border: none; /* Remove underline */
        }

        span {
          margin: 0 5px;
        }
      }
    }
  }

  .delete-button {
    width: 100px; /* Increased width for better touch area */
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%; /* Ensure button height matches item height */
  }

  ion-fab {
    margin-bottom: 20px;

    ion-fab-button {
      --background: #3880ff;
      --color: white;
    }
  }
}
</code></pre>
    </div>

    <div class="tab-pane fade " id="tree">
        <div id="tree-container"></div>
        <div class="tree-legend">
            <div class="title">
                <b>Legend</b>
            </div>
            <div>
                <div class="color htmlelement"></div><span>Html element</span>
            </div>
            <div>
                <div class="color component"></div><span>Component</span>
            </div>
            <div>
                <div class="color directive"></div><span>Html element with directive</span>
            </div>
        </div>
    </div>

    
</div>

<script src="../js/libs/vis.min.js"></script>
<script src="../js/libs/htmlparser.js"></script>
<script src="../js/libs/deep-iterator.js"></script>
<script>
        var COMPONENT_TEMPLATE = '<div><ion-header>  <ion-toolbar>    <ion-title>任务管理</ion-title>  </ion-toolbar></ion-header><ion-content>  <div *ngIf="tasks.length === 0" class="empty-tasks">    <ion-text color="medium">      <h2>您的任务空空如也，来添加一些任务吧！</h2>    </ion-text>  </div>  <ion-list *ngIf="tasks.length > 0">    <ion-item-sliding *ngFor="let task of tasks; let i = index">      <ion-item>        <ion-button fill="outline" (click)="editTask(i)" slot="start" class="edit-button">          <ion-icon name="create-outline"></ion-icon>        </ion-button>        <ion-label *ngIf="!task.editing" class="time-label">{{task.startTime}} - {{task.endTime}}</ion-label>        <div *ngIf="task.editing" class="time-edit">          <ion-input [(ngModel)]="task.startHour" (ionBlur)="formatHour(task, \'start\')" placeholder="时" type="text" inputmode="numeric" maxlength="2" class="time-input"></ion-input>          <span>:</span>          <ion-input [(ngModel)]="task.startMinute" (ionBlur)="formatMinute(task, \'start\')" placeholder="分" type="text" inputmode="numeric" maxlength="2" class="time-input"></ion-input>          <span> - </span>          <ion-input [(ngModel)]="task.endHour" (ionBlur)="formatHour(task, \'end\')" placeholder="时" type="text" inputmode="numeric" maxlength="2" class="time-input"></ion-input>          <span>:</span>          <ion-input [(ngModel)]="task.endMinute" (ionBlur)="formatMinute(task, \'end\')" placeholder="分" type="text" inputmode="numeric" maxlength="2" class="time-input"></ion-input>        </div>        <ion-label *ngIf="!task.editing" class="content-label">{{task.content}}</ion-label>        <ion-input *ngIf="task.editing" [(ngModel)]="task.content" class="content-input"></ion-input>        <ion-button *ngIf="task.editing" (click)="saveTask(i)" slot="end" class="save-button">          <ion-icon name="checkmark-outline"></ion-icon>        </ion-button>      </ion-item>      <ion-item-options side="end">        <ion-item-option color="danger" (click)="deleteTask(i)" class="delete-button">删除</ion-item-option>      </ion-item-options>    </ion-item-sliding>  </ion-list>  <ion-fab vertical="bottom" horizontal="center" slot="fixed">    <ion-fab-button (click)="addTask()">      <ion-icon name="add-outline"></ion-icon>    </ion-fab-button>  </ion-fab></ion-content></div>'
    var COMPONENTS = [{'name': 'AppComponent', 'selector': 'app-root'},{'name': 'ExploreContainerComponent', 'selector': 'app-explore-container'},{'name': 'HomePage', 'selector': 'app-home'},{'name': 'ProfilePage', 'selector': 'app-profile'},{'name': 'ServicesPage', 'selector': 'app-services'},{'name': 'TabsPage', 'selector': 'app-tabs'},{'name': 'TasksPage', 'selector': 'app-tasks'}];
    var DIRECTIVES = [];
    var ACTUAL_COMPONENT = {'name': 'TasksPage'};
</script>
<script src="../js/tree.js"></script>


                   </div><div class="search-results">
    <div class="has-results">
        <h1 class="search-results-title"><span class='search-results-count'></span> results matching "<span class='search-query'></span>"</h1>
        <ul class="search-results-list"></ul>
    </div>
    <div class="no-results">
        <h1 class="search-results-title">No results matching "<span class='search-query'></span>"</h1>
    </div>
</div>
</div>
               <!-- END CONTENT -->
           </div>
       </div>

          <label class="dark-mode-switch">
               <input type="checkbox">
               <span class="slider">
                    <svg class="slider-icon" viewBox="0 0 24 24" fill="none" height="20" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" width="20" xmlns="http://www.w3.org/2000/svg">
                    <path d="M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z"></path>
                    </svg>
               </span>
          </label>

       <script>
            var COMPODOC_CURRENT_PAGE_DEPTH = 1;
            var COMPODOC_CURRENT_PAGE_CONTEXT = 'component';
            var COMPODOC_CURRENT_PAGE_URL = 'TasksPage.html';
            var MAX_SEARCH_RESULTS = 15;
       </script>

       <script>
               $darkModeToggleSwitchers = document.querySelectorAll('.dark-mode-switch input');
               checkToggle(darkModeState);
               if ($darkModeToggleSwitchers.length > 0) {
                    for (var i = 0; i < $darkModeToggleSwitchers.length; i++) {
                         $darkModeToggleSwitchers[i].addEventListener('change', function (event) {
                              darkModeState = !darkModeState;
                              toggleDarkMode(darkModeState);
                         });
                    }
               }
          </script>

       <script src="../js/libs/custom-elements.min.js"></script>
       <script src="../js/libs/lit-html.js"></script>

       <script src="../js/menu-wc.js" defer></script>
       <script nomodule src="../js/menu-wc_es5.js" defer></script>

       <script src="../js/libs/bootstrap-native.js"></script>

       <script src="../js/libs/es6-shim.min.js"></script>
       <script src="../js/libs/EventDispatcher.js"></script>
       <script src="../js/libs/promise.min.js"></script>
       <script src="../js/libs/zepto.min.js"></script>

       <script src="../js/compodoc.js"></script>

       <script src="../js/tabs.js"></script>
       <script src="../js/menu.js"></script>
       <script src="../js/libs/clipboard.min.js"></script>
       <script src="../js/libs/prism.js"></script>
       <script src="../js/sourceCode.js"></script>
          <script src="../js/search/search.js"></script>
          <script src="../js/search/lunr.min.js"></script>
          <script src="../js/search/search-lunr.js"></script>
          <script src="../js/search/search_index.js"></script>
       <script src="../js/lazy-load-graphs.js"></script>


    </body>
</html>