SlickGrid

copy/paste issue

by violet greene

HTML

<script src="https://cdn.rawgit.com/Celebio/SlickGrid/master/lib/jquery.event.drag-2.2.js"></script>
<script src="https://cdn.rawgit.com/Celebio/SlickGrid/master/slick.core.js"></script>
<script src="https://cdn.rawgit.com/Celebio/SlickGrid/master/slick.grid.js"></script>
<script src="https://cdn.rawgit.com/Celebio/SlickGrid/master/slick.dataview.js"></script>
<link rel="stylesheet" href="https://cdn.rawgit.com/Celebio/SlickGrid/master/slick.grid.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Celebio/SlickGrid/master/slick-default-theme.css">
<div id="tardis" style="position:absolute; visibility:hidden">
    <div id="tmpl-smartee">
        <svg  viewBox="0 0 400 400" preserveAspectRatio="xMidYMid meet">
            <title>smarteee</title>
            <defs>
                <radialGradient cx="25%" cy="25%" r="100%" fx="40%" fy="40%"></radialGradient>
            </defs>
            <circle  class="face"          cx="200" cy="200" r="195"  />
            <ellipse class="eye eye-left"  cx="140" cy="150" rx="10" ry="40" fill="black"/>
            <ellipse class="eye eye-right" cx="260" cy="150" rx="10" ry="40" fill="black"/>
            <path    class="smile"         stroke-width="10" stroke="black" fill="none" stroke-linecap="round"/>
        </svg>
    </div>
</div>

<div id="ctr-ctr-caching">
    <div id="ctr-caching">
        <div id="settings-ctr-caching">
            <div id="settings-ex-caching" class="settings-filter-ctr">
                <table>
                    <tr>
                        <td class="label"><span>Filter Min</span></td>
                        <td><input type='number' min='0' max='100' value='0'/></td>
                        <td><input type="range"  min="0" max="100" value='0'/></td>
                    </tr>
                    <tr>
                        <td class="label"><span>Filter Max</span></td>
                        <td><input type='number' min='0' max='100' value='100'/></td>
                        <td><input...

CSS

::-webkit-scrollbar       
{ 
    width:              12px; 
    background-color:   #B9BACC; 
}
::-webkit-scrollbar-track 
{ 
    color:              #fff; 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius:      10px;  
}
::-webkit-scrollbar-thumb 
{ 
    color:              #96A9BB; 
    border-radius:      10px;  
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}

body
{
    font-family:        Arial, Helvetica, sans-serif;
    background-color:   #131313;
    position:           absolute;
    top:                5px;
    bottom:             5px;
    left:               5px;
    right:              5px;
}

.settings-filter-ctr
{
    margin:             0 auto;
    border:             1px solid #19264E;
    font-size:          12px;
    width:              300px;
    background-color:   rgba(22, 22, 128, 0.1);
}
.settings-filter-ctr table                 {margin:0 auto;}
.settings-filter-ctr tr                    {height:40px;}
.settings-filter-ctr td span               {width:60px; padding-right:5px; color:#2595FD;}
.settings-filter-ctr td input[type=range]  {vertical-align:middle; width:100px;}
.settings-filter-ctr td input[type=number] {width:50px;}
 

#ctr-ctr-caching
{
    display: table;
    height:200px;
    width:100%;
    text-align:center;    
}
#ctr-caching
{
    display: table-cell;
    vertical-align:middle;
}

#ctr-caching > div
{
    display:inline-block;
    margin:0 auto;
    padding:0;
}

#settings-ex-caching
{
    padding-top:3px;
    padding-bottom:3px;
    width:350px;
}

#settings-ctr-logging { }

#logit
{
    position:         relative;
    top:              0;
    left:             0;
    height:           88px;
    width:            350px;
    margin:           0;
    padding:          0;
    border:           1px solid #19264E;
    background-color: rgba(22, 22, 128, 0.1);
    padding-top:      3px;
}

#log
{
    position:         absolute;
    top:              0;
    left:             0;
   ...

JavaScript

////////////////////////////////////////////////////////////////////////////////
//example codez re trying to create a grid with rows of dynamic height to
//cater for folks that wanna bung loads of stuff in a field & see it all...
//by violet313@gmail.com ~ visit: www.violet313.org/slickgrids
//have all the fun with it  ;) vxx.
////////////////////////////////////////////////////////////////////////////////
window.V313=(function(V313, $, undefined){return V313;})(window.V313 || {}, jQuery);

V313.modSlickgridEx6=(
function()
{
    var _dataView=null;
    var _grid=null;
    var _data=[];
    var _removedlist={};

    var ReaperCacheSize=30; //defines the extent of *our cached items

    var _attribs= //lets make a start on abstracting out all the DOM attribute literals
    {
        //belongs to slickgrid
        slickRow:           "slick-row",

        //ours
        grid:               "oh-my-griddy-aunt",
        tardis:             "tardis",  //for templates & hiding stuff.
        detailField:        "pcComplete",

        //ours, for styling away UI side-efects etc
        toggle:             "toggle",
        cell:               "dynamic-cell",
        cellDetailCtr:      "dynamic-cell-detail-ctr",
        cellDetail:         "dynamic-cell-detail",
        row:                "dynamic-row",
        rowYin:             "dynamic-row-yin",
        rowYang:            "dynamic-row-yang",
        rowParent:          "dynamic-row-parent",
        rowPadding:         "dynamic-row-padding",
        rowPaddingLast:     "dynamic-row-padding-last",
        rowPaddingInner:    "dynamic-row-padding-inner",
    };
    _attribs.classSelector=function(k) {return "."+this[k]};
    _attribs.idSelector=function(k)    {return "#"+this[k]};


    //////////////////////////////////////////////////////////////
    //////////////////////////////////////////////////////////////
    var logit=(function()
    {
        var _t0=new Date().getTime();
        var _uiLog;...