<?php $__env->startSection('content'); ?>
<div class="master-main mainContent mobile maincontent-design2 middlebackground background-design5">
    <div class="container">
        <div class="row multi">
            <div class="hidden"></div>
            
            <div class="col-xs-12 col-single tabbed main-content">
                <div class="content-inner-container memo-compose-content">
                    
                    <h2 class="main-content-page-title">Memo</h2>
                    
                    
                    <?php if(session('success')): ?>
                        <div class="alert alert-success"><?php echo e(session('success')); ?></div>
                    <?php endif; ?>
                    <?php if($errors->any()): ?>
                        <div class="alert alert-danger">
                            <ul style="margin: 0; padding-left: 15px;">
                                <?php $__currentLoopData = $errors->all(); $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $err): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?> <li><?php echo e($err); ?></li> <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                            </ul>
                        </div>
                    <?php endif; ?>

                    <div class="well">
                        
                        
                        <div class="btn-group-md" style="text-align: left; margin-bottom: 15px;">
                            <button type="button" class="btn btn-default alignbtn" onclick="clickTab('<?php echo e(url('/mobile/account/memo')); ?>')">INBOX</button>
                            <button type="button" class="btn btn-default alignbtn active">COMPOSE</button>
                            <button type="button" class="btn btn-default alignbtn" onclick="clickTab('<?php echo e(url('/mobile/account/memo?sent=1')); ?>')">SEND</button>
                        </div>
                        
                        <div id="PanelCompose">
                            <div class="well" style="background: #1a1a1a; border: 1px solid #333;">
                                
                                
                                <form action="<?php echo e(route('account.memo.send', ['device' => $device ?? 'mobile'])); ?>" method="POST" enctype="multipart/form-data" class="form-horizontal" onsubmit="return CheckRepeat();">
                                    <?php echo csrf_field(); ?>
                                    
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">Subject <span class="asterisk">*</span></label>
                                        <div class="col-sm-6" style="margin-bottom: 10px;">
                                            <input name="judul" type="text" id="inputTitle" class="form-control" placeholder="Title / Judul" required />
                                        </div>
                                        <div class="col-sm-4 subject-dropdown">
                                            <select name="kategori" id="kategori" class="dropdown-control form-control" required>
                                                <option value="1">Masalah Umum</option>
                                                <option value="2">Masalah Teknis</option>
                                                <option value="3">Masalah Keuangan</option>
                                                <option value="4">Others..</option>
                                            </select>
                                        </div>
                                    </div>
                                    
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">To</label>
                                        <div class="col-sm-10">
                                            <input type="text" class="form-control" value="Support Operator" readonly />
                                        </div>
                                    </div>
                                    
                                    
                                    <div class="form-group" style="margin-bottom: 0px;">
                                        <div class="col-sm-10 col-sm-offset-2">
                                            <div style="display: flex; flex-wrap: wrap; gap: 5px;">
                                                <button type="button" class="btn btn-default btn-sm alignbtn" onmouseover="helpline('b')" onclick="addTag('<b>','</b>')" style="font-weight: bold;">B</button>
                                                <button type="button" class="btn btn-default btn-sm alignbtn" onmouseover="helpline('i')" onclick="addTag('<i>','</i>')" style="font-style: italic;">i</button>
                                                <button type="button" class="btn btn-default btn-sm alignbtn" onmouseover="helpline('u')" onclick="addTag('<u>','</u>')" style="text-decoration: underline;">u</button>
                                                <button type="button" class="btn btn-default btn-sm alignbtn" onmouseover="helpline('q')" onclick="addTag('<quote>','</quote>')">Quote</button>
                                                <button type="button" class="btn btn-default btn-sm alignbtn" onmouseover="helpline('c')" onclick="addTag('<code>','</code>')">Code</button>
                                                <button type="button" class="btn btn-default btn-sm alignbtn" onmouseover="helpline('l')" onclick="addTag('<list>','</list>')">List</button>
                                                <button type="button" class="btn btn-default btn-sm alignbtn" onmouseover="helpline('p')" onclick="addTag('<img>','</img>')">Img</button>
                                                <button type="button" class="btn btn-default btn-sm alignbtn" onmouseover="helpline('w')" onclick="addTag('<url>','</url>')" style="text-decoration: underline;">URL</button>
                                                <button type="button" class="btn btn-default btn-sm alignbtn" onmouseover="helpline('br')" onclick="addTag('','\n')">Next Line</button>
                                            </div>
                                        </div>
                                    </div>
                                    
                                    <div class="form-group">
                                        <div class="col-sm-10 col-sm-offset-2">
                                            <div style="display: inline-block; margin-top: 10px; margin-right: 15px; width: 45%;">
                                                <span style="font-size: 12px;">Font Color</span>
                                                <select class="dropdown-control form-control input-sm" onchange="addFontstyle($(this))" onmouseover="helpline('s')">
                                                    <option style="color: black;" value="default">DEFAULT</option>
                                                    <option style="color: red;" value="red">RED</option>
                                                    <option style="color: orange;" value="orange">ORANGE</option>
                                                    <option style="color: yellow;" value="yellow">YELLOW</option>
                                                    <option style="color: green;" value="green">GREEN</option>
                                                    <option style="color: blue;" value="blue">BLUE</option>
                                                    <option style="color: white;" value="white">WHITE</option>
                                                </select>
                                            </div>
                                            <div style="display: inline-block; margin-top: 10px; width: 45%;">
                                                <span style="font-size: 12px;">Font Size</span>
                                                <select class="dropdown-control form-control input-sm" onchange="addFontsize($(this))" onmouseover="helpline('f')">
                                                    <option value="9">SMALL</option>
                                                    <option value="12" selected="selected">NORMAL</option>
                                                    <option value="18">LARGE</option>
                                                    <option value="24">HUGE</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    
                                    <div class="form-group">
                                        <div class="col-sm-10 col-sm-offset-2">
                                            <input type="text" class="form-control input-sm" id="inputhelpline" placeholder="Arahkan ke tombol untuk bantuan tags" readonly style="background: #222; color:#0f0; border:none; font-size:11px;" />
                                        </div>
                                    </div>
                                    
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">Emoticons</label>
                                        <div class="col-sm-10" style="padding-top: 7px;">
                                            <a href="javascript:emoticon(':D')"><img src='/assets/images/smiles/icon_biggrin.gif' width='15' height='15' border='0' alt='Very Happy' /></a>&nbsp;&nbsp;
                                            <a href="javascript:emoticon(':)')"><img src='/assets/images/smiles/icon_smile.gif' width='15' height='15' border='0' alt='Smile' /></a>&nbsp;&nbsp;
                                            <a href="javascript:emoticon(':s')"><img src='/assets/images/smiles/icon_sad.gif' width='15' height='15' border='0' alt='Sad' /></a>&nbsp;&nbsp;
                                            <a href="javascript:emoticon(':o')"><img src='/assets/images/smiles/icon_surprised.gif' width='15' height='15' border='0' alt='Surprised' /></a>&nbsp;&nbsp;
                                            <a href="javascript:emoticon(':c')"><img src='/assets/images/smiles/icon_confused.gif' width='15' height='15' border='0' alt='Confused' /></a>&nbsp;&nbsp;
                                            <a href="javascript:emoticon(':l')"><img src='/assets/images/smiles/icon_cool.gif' width='15' height='15' border='0' alt='Cool' /></a>&nbsp;&nbsp;
                                            <a href="javascript:emoticon(':h:')"><img src='/assets/images/smiles/icon_lol.gif' width='15' height='15' border='0' alt='Laughing' /></a>&nbsp;&nbsp;
                                        </div>
                                    </div>
                                    
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">Upload File</label>
                                        <div class="col-sm-10">
                                            <input type="file" name="gambar" id="fileupload" accept="image/*" onchange="CheckFileSize()" class="form-control" style="font-size: 12px; padding: 5px;" />
                                            <small class="text-muted">*Maksimal 2MB (Opsional)</small>
                                        </div>
                                    </div>
                                    
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">Komentar <span class="asterisk">*</span></label>
                                        <div class="col-sm-10">
                                            <textarea name="pesan" id="inputmsg" class="form-control" rows="8" maxlength="2000" required></textarea>
                                        </div>
                                    </div>

                                    <div class="form-group" style="margin-top: 15px; margin-bottom: 0;">
                                        <div class="col-xs-12 text-right">
                                            <button type="submit" id="btnSubmit" class="btn btn-theme" style="width: 100%;">SEND / KIRIM</button>
                                        </div>
                                    </div>
                                    
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('script'); ?>
<script>
    var isClickTab = false;
    function clickTab(tab) {
        if (isClickTab) return;
        isClickTab = true;
        location.href = tab;
    }

    var submit = 0;
    function CheckRepeat() {
        if (++submit > 1) {
            return false;
        }
        return true;
    }

    function CheckFileSize() {
        var file = $('#fileupload');
        if (file.length > 0 && file[0].files.length > 0) {
            if (file[0].files[0].size > 2097152) { // 2MB in bytes
                alert("*Ukuran file melebihi batas yang diizinkan (Maksimal 2MB).");
                file.val(''); // Mengosongkan input file agar tidak ikut terkirim
            }
        }
    }
</script>

<script>
    // ==========================================
    // SCRIPT TEXT EDITOR CUSTOM
    // ==========================================
    var br_help = 'Next Lines (enter)';
    var b_help = 'Bold text: <b>text</b>';
    var i_help = 'Italic text: <i>text</i>';
    var u_help = 'Underline text: <u>text</u>';
    var q_help = 'Quote text: <quote>text</quote>';
    var c_help = 'Code display: <code>code</code>';
    var l_help = 'List: <list>text</list>';
    var o_help = 'Ordered list: <list>text</list>';
    var p_help = 'Insert image: <img>http://image_url</img>';
    var w_help = 'Insert URL: <url>http://url</url>';
    var s_help = 'Font color: <font color=red>text</font>';
    var f_help = 'Font size: <font size=12>text</font>';

    function helpline(help) {
        // Menggunakan bracket notation (window[]) jauh lebih aman dari eval()
        $("#inputhelpline").val(window[help + "_help"]);
    }

    function addFontstyle(obj) {
        var colorName = obj.val();
        if (colorName != "default") {
            addTag('<font color="' + colorName + '">', '</font>');
        }
        obj.val("default");
    }

    function addFontsize(obj) {
        addTag('<font size="' + obj.val() + '">', '</font>');
    }

    function addTag(openTag, closeTag) {
        var el = document.getElementById("inputmsg");
        el.focus();
        
        // Memakai Vanilla JS untuk mengatasi masalah browser mobile & jQuery lawas
        var start = el.selectionStart;
        var end = el.selectionEnd;
        var text = el.value;

        if (openTag !== "") {
            var before = text.substring(0, start);
            var selected = text.substring(start, end);
            var after = text.substring(end, text.length);
            
            el.value = before + openTag + selected + closeTag + after;
            // Kembalikan kursor ke tengah tag
            el.selectionStart = el.selectionEnd = start + openTag.length + selected.length + closeTag.length;
        } else {
            // Emoticon atau Next Line
            var before = text.substring(0, end);
            var after = text.substring(end, text.length);
            
            el.value = before + closeTag + after;
            el.selectionStart = el.selectionEnd = end + closeTag.length;
        }
    }

    function emoticon(txt) {
        addTag('', ' ' + txt + ' ');
    }
</script>
<?php $__env->stopPush(); ?>
<?php echo $__env->make('frontend.mobile.pages.account.layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /www/wwwroot/website/sewa/dragon158/resources/views/frontend/mobile/pages/account/pages/memocompose.blade.php ENDPATH**/ ?>