"Conversion Box With Notification"
Bootstrap 4.0.0 Snippet by agiltriono

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet'/> <link href='https://fonts.googleapis.com/css?family=Open+Sans:300,400,700' rel='stylesheet'/> <div id="wrapper"> <div class="container"> <div class='pesan-komentar'> <h5>Note ! You can use To Parse Html code</h5> <ul> For Example ! <li>To write letters <b>bold</b> please use <code>[strong]CONTENT[/strong]</code> or <code>[b]CONTENT[/b]</code>.</li> <li>To write letters <i>italic</i> please use <code>[em]CONTENT[/em]</code> or <code>[i]CONTENT[/i]</code>.</li> <li>To write letters <u>underline</u> please use <code>[u]CONTENT[/u]</code>.</li> <li>To write letters <span class='strike'>strikethrought</span> please use <code>[strike]CONTENT[/strike]</code>.</li> <li>To write HTML code please use <code>[code]CONTENT[/code]</code> or <code>[pre]CONTENT[/pre]</code> or <code>[pre][code]CONTENT[/code][/pre]</code>, and please <b>parse</b> first the code on the parser box below.</li> </ul> <div class='convertone'> <span class='small-button'> <span id='show-konversi'><a class='konversi-button' href='javascript:void(0)' onclick='document.getElementById(&apos;konversi-box&apos;).style.display=&apos;inline-block&apos;;document.getElementById(&apos;hide-konversi&apos;).style.display=&apos;inline-block&apos;;document.getElementById(&apos;show-konversi&apos;).style.display=&apos;none&apos;' title='Show Conversion Box'>Show Conversion Box</a></span><span id='hide-konversi'><a class='konversi-button' href='javascript:void(0)' onclick='document.getElementById(&apos;hide-konversi&apos;).style.display=&apos;none&apos;;document.getElementById(&apos;show-konversi&apos;).style.display=&apos;inline-block&apos;' title='Hide Konversi Kode'>Hide Konversi Kode</a></span> </span></div> <div id='bka-konversi' style='display:none'> <div class='control-group' id='konversi-box'> <textarea id='codes' placeholder='Write &apos;Or&apos; Paste Your Code Here' spellcheck='false'></textarea> <label class='control control--checkbox'>Convert<code>&</code>   <input checked='true' id='opt1' type='checkbox'/> <div class='control__indicator'> </div> </label> <label class='control control--checkbox'>Convert<code>'</code>   <input checked='true' id='opt2' type='checkbox'/> <div class='control__indicator'> </div> </label> <label class='control control--checkbox'>Convert<code>"</code>   <input checked='true' id='opt3' type='checkbox'/> <div class='control__indicator'> </div> </label> <label class='control control--checkbox'>Convert<code><</code>   <input checked='true' id='opt4' type='checkbox'/> <div class='control__indicator'> </div> </label> <label class='control control--checkbox'>Convert<code>></code>   <input checked='true' id='opt5' type='checkbox'/> <div class='control__indicator'> </div> </label> <label class='control control--checkbox'>Convert<code>strong</code>   <input checked='' id='opt6' type='checkbox'/> <div class='control__indicator'> </div> </label> <label class='control control--checkbox'>Convert<code>em</code>   <input checked='' id='opt7' type='checkbox'/> <div class='control__indicator'> </div> </label> <label class='control control--checkbox'>Convert<code>u</code>   <input checked='' id='opt8' type='checkbox'/> <div class='control__indicator'> </div> </label> <label class='control control--checkbox'>Convert<code>strike</code>   <input checked='' id='opt9' type='checkbox'/> <div class='control__indicator'> </div> </label> <label class='control control--checkbox'>Convert<code>pre</code>   <input checked='' id='opt10' type='checkbox'/> <div class='control__indicator'> </div> </label> <label class='control control--checkbox'>Convert<code>code</code>   <input checked='' id='opt11' type='checkbox'/> <div class='control__indicator'> </div> </label> <label class='control control--checkbox'>Convert<code>pre code</code>   <input checked='' id='opt12' type='checkbox'/> <div class='control__indicator'> </div> </label> <div class='konversi-button-group'> <button class='btn-danger btn-sm' id='cvrt3' onclick='strongConvert();this.disabled = false;'>strong</button> <button class='btn-danger btn-sm' id='cvrt4' onclick='emConvert();this.disabled = false;'>em</button> <button class='btn-danger btn-sm' id='cvrt5' onclick='uConvert();this.disabled = false;'>u</button> <button class='btn-danger btn-sm' id='cvrt6' onclick='strikeConvert();this.disabled = false;'>strike</button> <button class='btn-danger btn-sm' id='cvrt7' onclick='preConvert();this.disabled = false;'>pre</button> <button class='btn-danger btn-sm' id='cvrt8' onclick='codeConvert();this.disabled = false;'>code</button> <button class='btn-danger btn-sm' id='cvrt9' onclick='precodeConvert();this.disabled = false;'>pre code</button> <button class='btn-success btn-sm copyedall' data-clipboard-action='cut' data-clipboard-target='#codes' id='cvrt' onclick='cdConvert();'>Copy</button><button class='btn-warning btn-sm' id='cvrt0' onclick='cdClear();'>Clear</button> </div> </div> </div> </div> </div> </div> <script type="text/javascript"> //<![CDATA[ $(document).ready(function(){$("#hide-konversi").click(function(){$("#bka-konversi").slideUp();});$("#show-konversi").click(function(){$("#bka-konversi").slideDown();});}); //]]> </script>
/* * Icons (base 64) */ #notify-holster { position: fixed; top: 15px; right: 15px; width: 100%; max-width: 350px; z-index: 99999998; } #notify-holster { font-family: 'Open Sans', sans-serif; } .notify { position: relative; right: -360px; top: 15px; margin-bottom: 20px; width: 100%; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.25); opacity: 0; z-index: 99999999; border: 1px solid; /* * Success styles */ /** * Error styles */ /** * Info styles */ } .notify:last-child { margin-bottom: 0; } .notify.notify-default { background-color: #f0f0f0; border: 1px solid #e3e3e3; } .notify #notify-wrapper { position: relative; } .notify.notify-with-icon .notify-body .notify-body-text { padding-left: 74px; } .notify .notify-body { padding: 15px; font-size: 13px; min-height: 54px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .notify .notify-body .notification-body-icon { float: left; width: 64px; height: 54px; margin-right: 10px; vertical-align: middle; display: inline-block; position: relative; text-align: center; font-size: 32px; } .notify .notify-body .notification-body-icon i { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .notify .notify-body .notify-body-title { display: block; font-weight: 700; } .notify .notify-action-buttons { width: 16px; display: inline-block; position: absolute; top: 2px; right: 2px; } .notify .notify-action-buttons .notify-square-button { background-position: center; background-size: 8px; background-repeat: no-repeat; display: block; height: 16px; width: 16px; } .notify .notify-action-buttons .notify-square-button.notify-close-button { display: block; width: 16px; height: 16px; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTZweCIgaGVpZ2h0PSIxNnB4IiB2aWV3Qm94PSIwIDAgMTYgMTYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDE2IDE2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGQ9Ik0xMC4xMTksOGw0LjU5Ny00LjU5N2MwLjU4Ni0wLjU4NSwwLjU4NS0xLjUzNCwwLTIuMTE5cy0xLjUzMy0wLjU4NS0yLjExOSwwTDgsNS44ODFMMy40MDMsMS4yODQNCgljLTAuNTg1LTAuNTg1LTEuNTM0LTAuNTg1LTIuMTE5LDBjLTAuNTg1LDAuNTg1LTAuNTg1LDEuNTMzLDAsMi4xMTlMNS44ODEsOGwtNC41OTgsNC41OThjLTAuNTg1LDAuNTg1LTAuNTg1LDEuNTMzLDAsMi4xMTkNCgljMC41ODUsMC41ODQsMS41MzMsMC41ODQsMi4xMTgsMEw4LDEwLjExOGw0LjU5OCw0LjU5OGMwLjU4NSwwLjU4NSwxLjUzMywwLjU4NSwyLjExOSwwYzAuNTg0LTAuNTg1LDAuNTg0LTEuNTMzLDAtMi4xMThMMTAuMTE5LDh6DQoJIi8+DQo8L3N2Zz4NCg=="); } .notify.notify-success { background-color: #77DD77; border-color: #63d863; } .notify.notify-success .notify-body, .notify.notify-success .notify-body * { color: white; } .notify.notify-success .notify-action-buttons .notify-square-button.notify-close-button { background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTZweCIgaGVpZ2h0PSIxNnB4IiB2aWV3Qm94PSIwIDAgMTYgMTYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDE2IDE2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0xMC4xMTksOGw0LjU5Ny00LjU5N2MwLjU4Ni0wLjU4NSwwLjU4NS0xLjUzNCwwLTIuMTE5cy0xLjUzMy0wLjU4NS0yLjExOSwwTDgsNS44ODFMMy40MDMsMS4yODQNCgljLTAuNTg1LTAuNTg1LTEuNTM0LTAuNTg1LTIuMTE5LDBjLTAuNTg1LDAuNTg1LTAuNTg1LDEuNTMzLDAsMi4xMTlMNS44ODEsOGwtNC41OTgsNC41OThjLTAuNTg1LDAuNTg1LTAuNTg1LDEuNTMzLDAsMi4xMTkNCgljMC41ODUsMC41ODQsMS41MzMsMC41ODQsMi4xMTgsMEw4LDEwLjExOGw0LjU5OCw0LjU5OGMwLjU4NSwwLjU4NSwxLjUzMywwLjU4NSwyLjExOSwwYzAuNTg0LTAuNTg1LDAuNTg0LTEuNTMzLDAtMi4xMThMMTAuMTE5LDh6DQoJIi8+DQo8L3N2Zz4NCg=="); } .notify.notify-error { background-color: #FF6961; border-color: #ff5148; } .notify.notify-error .notify-body, .notify.notify-error .notify-body * { color: white; } .notify.notify-error .notify-action-buttons .notify-square-button.notify-close-button { background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTZweCIgaGVpZ2h0PSIxNnB4IiB2aWV3Qm94PSIwIDAgMTYgMTYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDE2IDE2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0xMC4xMTksOGw0LjU5Ny00LjU5N2MwLjU4Ni0wLjU4NSwwLjU4NS0xLjUzNCwwLTIuMTE5cy0xLjUzMy0wLjU4NS0yLjExOSwwTDgsNS44ODFMMy40MDMsMS4yODQNCgljLTAuNTg1LTAuNTg1LTEuNTM0LTAuNTg1LTIuMTE5LDBjLTAuNTg1LDAuNTg1LTAuNTg1LDEuNTMzLDAsMi4xMTlMNS44ODEsOGwtNC41OTgsNC41OThjLTAuNTg1LDAuNTg1LTAuNTg1LDEuNTMzLDAsMi4xMTkNCgljMC41ODUsMC41ODQsMS41MzMsMC41ODQsMi4xMTgsMEw4LDEwLjExOGw0LjU5OCw0LjU5OGMwLjU4NSwwLjU4NSwxLjUzMywwLjU4NSwyLjExOSwwYzAuNTg0LTAuNTg1LDAuNTg0LTEuNTMzLDAtMi4xMThMMTAuMTE5LDh6DQoJIi8+DQo8L3N2Zz4NCg=="); } .notify.notify-info { background-color: #89abd2; border-color: #779ECB; } .notify.notify-info .notify-body, .notify.notify-info .notify-body * { color: white; } .notify.notify-info .notify-action-buttons .notify-square-button.notify-close-button { background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTZweCIgaGVpZ2h0PSIxNnB4IiB2aWV3Qm94PSIwIDAgMTYgMTYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDE2IDE2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0xMC4xMTksOGw0LjU5Ny00LjU5N2MwLjU4Ni0wLjU4NSwwLjU4NS0xLjUzNCwwLTIuMTE5cy0xLjUzMy0wLjU4NS0yLjExOSwwTDgsNS44ODFMMy40MDMsMS4yODQNCgljLTAuNTg1LTAuNTg1LTEuNTM0LTAuNTg1LTIuMTE5LDBjLTAuNTg1LDAuNTg1LTAuNTg1LDEuNTMzLDAsMi4xMTlMNS44ODEsOGwtNC41OTgsNC41OThjLTAuNTg1LDAuNTg1LTAuNTg1LDEuNTMzLDAsMi4xMTkNCgljMC41ODUsMC41ODQsMS41MzMsMC41ODQsMi4xMTgsMEw4LDEwLjExOGw0LjU5OCw0LjU5OGMwLjU4NSwwLjU4NSwxLjUzMywwLjU4NSwyLjExOSwwYzAuNTg0LTAuNTg1LDAuNTg0LTEuNTMzLDAtMi4xMThMMTAuMTE5LDh6DQoJIi8+DQo8L3N2Zz4NCg=="); } #wrapper{background:#F0F1F5;margin:0 auto;padding:0;font-style:normal;max-width:996px;height:100%;} .container{width:100%;height:100%;display:block!important;padding:20px;} /* konversi box */ .konversi-button-group{text-align:center} #hide-konversi {display:none} #konversi-box {width:100%;color:#000;background:none;line-height:1.6em;margin-bottom:20px;padding:0;text-align:left;} #codes{border:1px solid #e9e9e9;resize:none;overflow:unset;width:100%;height:200px;display:block;background-color:#424d52;color:#999 !important;font:normal 12px 'Courier New',Monospace;margin:7px 0 10px;padding:5px;transition:all 0.5s linear;max-width:100%} #codes:focus{background-color:#222;color:#666;border:1px solid #ddd;outline:none;transition:all 0.3s linear;} .control{display:none !important} .control-group{display:flex;text-align:center} .control{font-size:18px;position:relative;display:inline-block;margin-bottom:15px;padding-left:30px;cursor:pointer} .control input{position:absolute;z-index:-1;opacity:0} .control__indicator{position:absolute;top:2px;left:0;width:20px;height:20px;background:#e6e6e6} .control--radio .control__indicator{border-radius:50%} /* Hover and focus states */ .control:hover input ~ .control__indicator,.control input:focus ~ .control__indicator{background:#ccc} /* Checked state */ .control input:checked ~ .control__indicator{background:#2aa1c0} /* Hover state whilst checked */ .control:hover input:not([disabled]):checked ~ .control__indicator,.control input:checked:focus ~ .control__indicator{background:#0e647d} /* Disabled state */ .control input:disabled ~ .control__indicator{pointer-events:none;opacity:.6;background:#e6e6e6} /* Check mark */ .control__indicator:after{position:absolute;display:none;content:''} /* Show check mark */ .control input:checked ~ .control__indicator:after{display:block} /* Checkbox tick */ .control--checkbox .control__indicator:after{top:4px;left:8px;width:3px;height:8px;transform:rotate(45deg);border:solid #fff;border-width:0 2px 2px 0} /* Disabled tick colour */ .control--checkbox input:disabled ~ .control__indicator:after{border-color:#7b7b7b} /* Radio button inner circle */ .control--radio .control__indicator:after{top:7px;left:7px;width:6px;height:6px;border-radius:50%;background:#fff} /* Disabled circle colour */ .control--radio input:disabled ~ .control__indicator:after{background:#7b7b7b} /* CSS Posted */ h3, h4, h5, h6{padding:12px 50px!important;display:block!important;margin:10px 0;color:rgb(52,52,52);border-radius:4px 4px 0 0;position:relative;text-align:left;font-weight:bold;font-size:inherit;text-transform:uppercase;text-shadow:0 1px 0 rgb(204,204,204);box-shadow:0 0 3px 1px rgb(198,198,198) inset;overflow:hidden;word-wrap:break-word;word-break:break-word;width:100%} h3:before {content: '\f005';color:#FFFFFF;border-radius:2px;left:0;position:absolute;font-family:fontAwesome;font-size:initial;background:#6C7A89;padding:11px;top:0;bottom:0;display:inline-block;overflow:hidden} h4:before {content: '\f085';color:#FFFFFF;border-radius:2px;left:0;position:absolute;font-family:fontAwesome;font-size:initial;background:#6C7A89;padding:11px;top:0;bottom:0;display:inline-block;overflow:hidden} h5:before {content: '\f071';color:#FFFFFF;border-radius:2px;left:0;position:absolute;font-family:fontAwesome;font-size:initial;background:#6C7A89;padding:11px;top:0;bottom:0;display:inline-block;overflow:hidden} h6:before {content: '\f0a1';color:#FFFFFF;border-radius:2px;left:0;position:absolute;font-family:fontAwesome;font-size:initial;background:#6C7A89;padding:11px;top:0;bottom:0;display:inline-block;overflow:hidden} button{cursor:pointer!important;} a.emo-button:before{content: '\f118';font-family:fontawesome;letter-spacing:2px} a.konversi-button:before{content: '\f121';font-family:fontawesome;letter-spacing:2px} a.off-topic-button:before{content: '\f0f4';font-family:fontawesome;letter-spacing:2px} .paging-control-container a{text-align:center;margin:0 auto;background:#ccc;border:1px solid #e1e1e1;padding:3px 10px} .button-group{float:right;text-align:left;margin:0 auto} button,button[disabled]:active{border:none;font-size:12px;font-weight:normal;border-radius:1px;padding:4px 10px;text-decoration:none;background:#b6c472;color:#fff;display:inline-block;transition:all 0.5s linear;cursor:pointer} button:hover{background:#a0ad64;color:#fff;transition:all 0.2s linear} button:active{background:#a0ad64;color:#fff} button[disabled],button[disabled]:active{background:#a0ad64;border-bottom:2px solid #8b9656;color:#fff;cursor:default} .small-button a,.small-button1 a{background:#f84141;color:#fff;font-size:13px;cursor:pointer;margin:15px 5px 5px 0;text-decoration:none;text-transform:none;text-shadow:none;border-radius:3px;display:inline-block;padding:5px 10px;box-shadow:0 1px 2px rgba(0,0,0,0.1)} .small-button:hover a,.small-button1:hover a{background:#e73636;} .convertone{width:100%;margin:0 auto;display:block;text-align:center;background:#fd5052;height:54px} .pesan-komentar span.strike{text-decoration: line-through;}
// konversi function cdConvert(){var e=document.getElementById("codes"),t=e.value,c=document.getElementById("opt1"),d=document.getElementById("opt2"),o=document.getElementById("opt3"),l=document.getElementById("opt4"),n=document.getElementById("opt5");t=t.replace(/\t/g," "),c.checked&&(t=t.replace(/&/g,"&")),d.checked&&(t=t.replace(/'/g,"'")),o.checked&&(t=t.replace(/"/g,""")),l.checked&&(t=t.replace(/</g,"<")),n.checked&&(t=t.replace(/>/g,">")),e.value=t,e.focus(),e.select()}function cdClear(){var e=document.getElementById("codes");e.value="",e.focus();for(var t=document.querySelectorAll("#cvrt3, #cvrt4, #cvrt5, #cvrt6, #cvrt7, #cvrt8, #cvrt9, #cvrt10, #cvrt11"),c=0;c<t.length;c++)t[c].disabled=!1}function preConvert(){var e=document.getElementById("codes"),t=e.value,c=document.getElementById("opt1"),d=document.getElementById("opt2"),o=document.getElementById("opt3"),l=document.getElementById("opt4"),n=document.getElementById("opt5"),r=document.getElementById("opt10");t=t.replace(/\t/g," "),r.checked&&(c.checked&&(t=t.replace(/&/g,"&")),d.checked&&(t=t.replace(/'/g,"'")),o.checked&&(t=t.replace(/"/g,""")),l.checked&&(t=t.replace(/</g,"<")),n.checked&&(t=t.replace(/>/g,">")),t=t.replace(/^/,"[pre]"),t=t.replace(/$/,"[/pre]"),e.value=t,e.focus(),e.select())}function codeConvert(){var e=document.getElementById("codes"),t=e.value,c=document.getElementById("opt1"),d=document.getElementById("opt2"),o=document.getElementById("opt3"),l=document.getElementById("opt4"),n=document.getElementById("opt5"),r=document.getElementById("opt11");t=t.replace(/\t/g," "),r.checked&&(c.checked&&(t=t.replace(/&/g,"&")),d.checked&&(t=t.replace(/'/g,"'")),o.checked&&(t=t.replace(/"/g,""")),l.checked&&(t=t.replace(/</g,"<")),n.checked&&(t=t.replace(/>/g,">")),t=t.replace(/^/,"[code]"),t=t.replace(/$/,"[/code]"),e.value=t,e.focus(),e.select())}function precodeConvert(){var e=document.getElementById("codes"),t=e.value,c=document.getElementById("opt1"),d=document.getElementById("opt2"),o=document.getElementById("opt3"),l=document.getElementById("opt4"),n=document.getElementById("opt5"),r=document.getElementById("opt12");t=t.replace(/\t/g," "),r.checked&&(c.checked&&(t=t.replace(/&/g,"&")),d.checked&&(t=t.replace(/'/g,"'")),o.checked&&(t=t.replace(/"/g,""")),l.checked&&(t=t.replace(/</g,"<")),n.checked&&(t=t.replace(/>/g,">")),t=t.replace(/^/,"[pre][code]"),t=t.replace(/$/,"[/code][/pre]"),e.value=t,e.focus(),e.select())}function strongConvert(){var e=document.getElementById("codes"),t=e.value,c=document.getElementById("opt6");t=t.replace(/\t/g," "),c.checked&&(t=t.replace(/^/,"[strong]"),t=t.replace(/$/,"[/strong]"),e.value=t,e.focus(),e.select())}function emConvert(){var e=document.getElementById("codes"),t=e.value,c=document.getElementById("opt7");t=t.replace(/\t/g," "),c.checked&&(t=t.replace(/^/,"[em]"),t=t.replace(/$/,"[/em]"),e.value=t,e.focus(),e.select())}function uConvert(){var e=document.getElementById("codes"),t=e.value,c=document.getElementById("opt8");t=t.replace(/\t/g," "),c.checked&&(t=t.replace(/^/,"[u]"),t=t.replace(/$/,"[/u]"),e.value=t,e.focus(),e.select())}function strikeConvert(){var e=document.getElementById("codes"),t=e.value,c=document.getElementById("opt9");t=t.replace(/\t/g," "),c.checked&&(t=t.replace(/^/,"[strike]"),t=t.replace(/$/,"[/strike]"),e.value=t,e.focus(),e.select())} $.getScript("https://cdn.rawgit.com/agiltriono/agiel-for-js/master/jsnotify/dist/js/notify.js").done(function(script){var options1={'title':'Success','style':'success','message':'Your Code Has Been Copied To Clipboard','icon':'check','timeout':'2000'};var options2={'title':'Removed','style':'error','message':'Your Code Has Been Remove','icon':'warning','timeout':'2000'};var options3={'title':'Success','style':'info','message':'Your Code Has Been Converted','icon':'info','timeout':'2000'};var n1=new notify(options1);var n2=new notify(options2);var n3=new notify(options3);$("#cvrt").click(function(){n1.show()});$("#cvrt0").click(function(){n2.show()});$("#cvrt3,#cvrt4,#cvrt5,#cvrt6,#cvrt7,#cvrt8,#cvrt9").click(function(){n3.show()})}) $.getScript("https://rawgit.com/agiltriono/agiel-for-js/master/clipboard/dist/clipboard.min.js").done(function(script){var clipboard=new Clipboard(".copyedall"),copyCode=new Clipboard(".copyedall",{target:function(a){return a.previousElementSibling}});clipboard.on("success",function(a){console.log(a)}),clipboard.on("error",function(a){console.log(a)}),copyCode.on("success",function(a){a.clearSelection(),a.trigger.textContent="Copied",window.setTimeout(function(){a.trigger.textContent="Copy"},2e3)});})

Related: See More


Questions / Comments: