<div class="sendWrapper">
    <div class="card-panel">
        <form class="col s12">
            <div class="row">
                <div class="input-field col s6">
                    <select id="sendFromAddress">
                        <option value="" disabled selected>Choose your address</option>
                        {{#addressData}}
                            <option value="{{address}}">{{name}} - {{address}}</option>
                        {{/addressData}}
                    </select>
                    <label for="sendFromAddress">From address:</label>
                </div>
                <div class="input-field col s6 addressInputWrapper">
                    <input id="sendToAddress" placeholder="recipient address" type="text">
                    <label for="sendToAddress" class="active">To address:</label>
                    <button type="button" class="btn btn-etho btnSendToolButton" id="btnAddToAddressBook"><i class="fas fa-plus"></i></button>
                    <button type="button" class="btn btn-etho btnSendToolButton" id="btnLookForToAddress"><i class="fas fa-search"></i></button>
                </div>
            </div>
            <div class="row">
                <div class="input-field col s6">
                    <input id="sendAmmount" placeholder="0" type="number" value="0">
                    <label for="sendAmmount" class="active">Amount:</label>
                </div>
                <div class="input-field col s6">
                    <div class="input-field col s12">
                        <span id="sendMaxAmmount">0</span><span>ETHO</span>
                        <button type="button" class="btn btn-etho" id="btnSendAll">ALL</button>   
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="input-field col s12">
                    <button type="button" class="btn btn-etho" id="btnSendTransaction">Send</button>    
                </div>
            </div>
        </form>
    </div>
    <div id="cardTransactionsForAddress" class="card-panel" style="display: none;">
        <table id="tableTransactionsForAddress" class="display" style="width:100%">
            <thead>
                <tr>
                    <th>Block</th>
                    <th>Timestamp</th>
                    <th>To</th>
                    <th>Value</th>
                </tr>
            </thead>
            <tfoot>
                <tr>
                    <th>Block</th>
                    <th>Timestamp</th>
                    <th>To</th>
                    <th>Value</th>
                </tr>
            </tfoot>
        </table>            
    </div>
</div>

<!-- The modal for wallet password -->
<div id="dlgSendWalletPassword" class="modalDialog" data-iziModal-title="Wallet Password" data-iziModal-subtitle="To send from this wallet, please enter the wallet password" data-iziModal-icon="icon-home">
    <div class="modalBody">
        <div class="form-group sendTXInfo">
            <i class="fas fa-wallet"></i>
            <label>From address:</label><label id="fromAddressInfo"></label>
        </div>
        <div class="form-group sendTXInfo">
            <i class="fas fa-wallet"></i>
            <label>To address:</label><label id="toAddressInfo"></label>
        </div>
        <div class="form-group sendTXInfo">
            <i class="fas fa-dollar-sign"></i>
            <label>Value to send:</label><label id="valueToSendInfo"></label><label class="currencyTicker">ETHO</label>
        </div>
        <div class="form-group sendTXInfo">
            <i class="fas fa-dollar-sign"></i>
            <label>Fee to pay:</label><label id="feeToPayInfo"></label><label class="currencyTicker">ETHO</label>
        </div>       
        <hr class="sendTXdivider">             
        <div class="form-group sendTXPass">
            <label for="usr">Type Password:</label>
            <input type="password" class="form-control" id="walletPassword">
        </div>
        <button type="button" class="btn btn-etho btn-dialog-confirm" id="btnSendWalletPasswordConfirm">Confirm</button>
    </div>
</div>

<!-- The modal for address list -->
<div id="dlgAddressList" class="modalDialog" data-iziModal-title="AddressList" data-iziModal-subtitle="Please select an address from the list" data-iziModal-icon="icon-home">
    <div class="modalBody" id="dlgAddressListBody"> 
    </div>
</div>

<!-- The modal to add address to address book -->
<div id="dlgAddAddressToBook" class="modalDialog" data-iziModal-title="Address Name" data-iziModal-subtitle="Enter the name for this address" data-iziModal-icon="icon-home">
    <div class="modalBody">
        <div class="form-group">
            <label for="usr">Address Name:</label>
            <input type="text" class="form-control" id="inputAddressName">
        </div>
        <button type="button" class="btn btn-etho btn-dialog-confirm" id="btnAddAddressToBookConfirm">Confirm</button>
    </div>
</div>
      