TicketDescriptionTemplates版本 9版本 10 间的差异


忽略:
时间戳:
2020-03-23T15:58:48+08:00 (5年 前)
作者:
huxy
评论:

增加插入代码块的工具栏

图例:

未修改
增加
删除
修改
  • TicketDescriptionTemplates

    v9 v10  
    5252        width: 0%;
    5353    }
     54    .textarea-toolbar {
     55        margin-top: 0.3em;
     56        margin-left: 0.2em;
     57        border: solid #d7d7d7;
     58        border-width: 1px 1px 1px 0;
     59        height: 18px;
     60        width: 52px;
     61    }
     62    .textarea-toolbar :link, .textarea-toolbar :visited {
     63        background: transparent url(raw-attachment/wiki/TicketDescriptionTemplates/toolbar.png) no-repeat;
     64        border: 1px solid #fff;
     65        border-left-color: #d7d7d7;
     66        cursor: default;
     67        display: block;
     68        float: left;
     69        width: 24px;
     70        height: 16px;
     71       }
     72    .textarea-toolbar :link:hover, .textarea-toolbar :visited:hover {
     73        ckground-color: transparent;
     74        border: 1px solid #fb2;
     75    }
     76    .textarea-toolbar a#em { background-position: 0 0 }
     77    .textarea-toolbar a#strong { background-position: 0 -16px }
    5478</style>
    5579<script type="text/javascript">
     
    189213            });
    190214        }
     215
     216        function addToolbarButton(toolbar, id, title, click_fn) {
     217            var a = document.createElement("a");
     218            a.href = "#";
     219            a.id = id;
     220            a.title = title;
     221            a.onclick = function() {
     222                if ($(toolbar.target_textarea).prop("disabled") === false &&
     223                    $(toolbar.target_textarea).prop("readonly") === false) {
     224                    try { click_fn() } catch (e) {}
     225                }
     226                return false;
     227            };
     228            a.tabIndex = 400;
     229            toolbar.appendChild(a);
     230        }
     231
     232        function encloseSelection(textarea, prefix, suffix) {
     233            textarea.focus();
     234            var start, end, sel, scrollPos, subst;
     235            if (document.selection != undefined) {
     236                sel = document.selection.createRange().text;
     237            } else if (textarea.setSelectionRange != undefined) {
     238                start = textarea.selectionStart;
     239                end = textarea.selectionEnd;
     240                scrollPos = textarea.scrollTop;
     241                sel = textarea.value.substring(start, end);
     242            }
     243            if (sel.match(/ $/)) {
     244                sel = sel.substring(0, sel.length - 1);
     245                suffix = suffix + " ";
     246            }
     247            subst = prefix + sel + suffix;
     248            if (document.selection != undefined) {
     249                var range = document.selection.createRange().text = subst;
     250                textarea.caretPos -= suffix.length;
     251            } else if (textarea.setSelectionRange != undefined) {
     252                textarea.value = textarea.value.substring(0, start) + subst + textarea.value.substring(end);
     253                if (sel) {
     254                    textarea.setSelectionRange(start + subst.length, start + subst.length);
     255                } else {
     256                    textarea.setSelectionRange(start + prefix.length, start + prefix.length);
     257                }
     258                textarea.scrollTop = scrollPos;
     259            }
     260        }
     261
     262        $("textarea.toolbar").each(function(index, element) {
     263            if ($(element).prev('div.textarea-toolbar').length == 0) {
     264                $(element).before('<div class="textarea-toolbar"></div>');
     265                var toolbar = $(element).prev('div.textarea-toolbar').get(0);
     266                toolbar.target_textarea = element;
     267                addToolbarButton(toolbar, "strong", "插入 C 代码块", function() {encloseSelection(element, "\n{{{#!c\n", "\n}}}\n");});
     268                addToolbarButton(toolbar, "em", "插入 C++ 代码块", function() {encloseSelection(element, "\n{{{#!cpp\n", "\n}}}\n");});
     269            }
     270        });
    191271    }
    192272
     
    255335        <tr title="问题描述" class="panel-row">
    256336            <th><label>问题描述 <span class="required-field-label">*</span>:</label></th>
    257             <td colspan="5"><textarea class="required-field"></textarea></td>
     337            <td colspan="5"><textarea class="required-field toolbar"></textarea></td>
    258338        </tr>
    259339        <tr title="问题场景" class="panel-row">
    260340            <th><label>问题场景 <span class="required-field-label">*</span>:</label></th>
    261             <td colspan="5"><textarea class="required-field"></textarea></td>
     341            <td colspan="5"><textarea class="required-field toolbar"></textarea></td>
    262342        </tr>
    263343        <tr title="复现步骤" class="panel-row">
    264344            <th><label>复现步骤 <span class="required-field-label">*</span>:</label></th>
    265             <td colspan="5"><textarea class="required-field"></textarea></td>
     345            <td colspan="5"><textarea class="required-field toolbar"></textarea></td>
    266346        </tr>
    267347        <tr title="出错日志" class="panel-row">
     
    271351        <tr title="初步定位" class="panel-row">
    272352            <th><label>初步定位:</label></th>
    273             <td colspan="5"><textarea></textarea></td>
     353            <td colspan="5"><textarea class="toolbar"></textarea></td>
    274354        </tr>
    275355        <tr title="问题处理时间段" class="panel-row">