@@ -305,7 +305,7 @@ define([
305305// select - right
306306tag . appendFormatLine ( '<div class="{0}">' , APP_SELECT_RIGHT ) ;
307307var selectedList = this . dataList . filter ( data => that . selectedList . includes ( data . code ) ) ;
308- tag . appendLine ( this . renderSelectedBox ( this . selectedList ) ) ;
308+ tag . appendLine ( this . renderSelectedBox ( selectedList ) ) ;
309309if ( this . allowAdd ) {
310310// add item
311311tag . appendLine ( '<input type="text" class="vp-cs-add-item-name vp-input wp100" placeholder="New item to add" value="">' ) ;
@@ -380,6 +380,62 @@ define([
380380that . bindDraggable ( ) ;
381381} ) ;
382382
383+ // item indexing
384+ $ ( this . wrapSelector ( '.' + APP_SELECT_ITEM ) ) . on ( 'click' , function ( event ) {
385+ var dataIdx = $ ( this ) . attr ( 'data-idx' ) ;
386+ var idx = $ ( this ) . index ( ) ;
387+ var added = $ ( this ) . hasClass ( 'added' ) ; // right side added item?
388+ var selector = '' ;
389+
390+ // remove selection for select box on the other side
391+ if ( added ) {
392+ // remove selection for left side
393+ $ ( that . wrapSelector ( '.' + APP_SELECT_ITEM + ':not(.added)' ) ) . removeClass ( 'selected' ) ;
394+ // set selector
395+ selector = '.added' ;
396+ } else {
397+ // remove selection for right(added) side
398+ $ ( that . wrapSelector ( '.' + APP_SELECT_ITEM + '.added' ) ) . removeClass ( 'selected' ) ;
399+ // set selector
400+ selector = ':not(.added)' ;
401+ }
402+
403+ if ( vpEvent . keyManager . keyCheck . ctrlKey ) {
404+ // multi-select
405+ that . pointer = { start :idx , end :- 1 } ;
406+ $ ( this ) . toggleClass ( 'selected' ) ;
407+ } else if ( vpEvent . keyManager . keyCheck . shiftKey ) {
408+ // slicing
409+ var startIdx = that . pointer . start ;
410+
411+ if ( startIdx == - 1 ) {
412+ // no selection
413+ that . pointer = { start :idx , end :- 1 } ;
414+ } else if ( startIdx > idx ) {
415+ // add selection from idx to startIdx
416+ var tags = $ ( that . wrapSelector ( '.' + APP_SELECT_ITEM + selector ) ) ;
417+ for ( var i = idx ; i <= startIdx ; i ++ ) {
418+ $ ( tags [ i ] ) . addClass ( 'selected' ) ;
419+ }
420+ that . pointer = { start :startIdx , end :idx } ;
421+ } else if ( startIdx <= idx ) {
422+ // add selection from startIdx to idx
423+ var tags = $ ( that . wrapSelector ( '.' + APP_SELECT_ITEM + selector ) ) ;
424+ for ( var i = startIdx ; i <= idx ; i ++ ) {
425+ $ ( tags [ i ] ) . addClass ( 'selected' ) ;
426+ }
427+ that . pointer = { start :startIdx , end :idx } ;
428+ }
429+ } else {
430+ // single-select
431+ that . pointer = { start :idx , end :- 1 } ;
432+ // un-select others
433+ $ ( that . wrapSelector ( '.' + APP_SELECT_ITEM + selector ) ) . removeClass ( 'selected' ) ;
434+ // select this
435+ $ ( this ) . addClass ( 'selected' ) ;
436+ }
437+ } ) ;
438+
383439// item indexing - add all
384440$ ( this . wrapSelector ( '.' + APP_SELECT_ADD_ALL_BTN ) ) . on ( 'click' , function ( event ) {
385441$ ( that . wrapSelector ( '.' + APP_SELECT_BOX + '.left .' + APP_SELECT_ITEM ) ) . appendTo (
@@ -454,75 +510,6 @@ define([
454510that . _addNewItem ( newItemName ) ;
455511}
456512} ) ;
457-
458- this . _bindItemClickEvent ( ) ;
459- }
460-
461- _bindItemClickEvent ( ) {
462- let that = this ;
463- // item indexing
464- $ ( this . wrapSelector ( '.' + APP_SELECT_ITEM ) ) . off ( 'click' ) ;
465- $ ( this . wrapSelector ( '.' + APP_SELECT_ITEM ) ) . on ( 'click' , function ( event ) {
466- var dataIdx = $ ( this ) . attr ( 'data-idx' ) ;
467- var idx = $ ( this ) . index ( ) ;
468- var added = $ ( this ) . hasClass ( 'added' ) ; // right side added item?
469- var selector = '' ;
470-
471- // remove selection for select box on the other side
472- if ( added ) {
473- // remove selection for left side
474- $ ( that . wrapSelector ( '.' + APP_SELECT_ITEM + ':not(.added)' ) ) . removeClass ( 'selected' ) ;
475- // set selector
476- selector = '.added' ;
477- } else {
478- // remove selection for right(added) side
479- $ ( that . wrapSelector ( '.' + APP_SELECT_ITEM + '.added' ) ) . removeClass ( 'selected' ) ;
480- // set selector
481- selector = ':not(.added)' ;
482- }
483-
484- if ( vpEvent . keyManager . keyCheck . ctrlKey ) {
485- // multi-select
486- that . pointer = { start :idx , end :- 1 } ;
487- $ ( this ) . toggleClass ( 'selected' ) ;
488- } else if ( vpEvent . keyManager . keyCheck . shiftKey ) {
489- // slicing
490- var startIdx = that . pointer . start ;
491-
492- if ( startIdx == - 1 ) {
493- // no selection
494- that . pointer = { start :idx , end :- 1 } ;
495- } else if ( startIdx > idx ) {
496- // add selection from idx to startIdx
497- var tags = $ ( that . wrapSelector ( '.' + APP_SELECT_ITEM + selector ) ) ;
498- for ( var i = idx ; i <= startIdx ; i ++ ) {
499- $ ( tags [ i ] ) . addClass ( 'selected' ) ;
500- }
501- that . pointer = { start :startIdx , end :idx } ;
502- } else if ( startIdx <= idx ) {
503- // add selection from startIdx to idx
504- var tags = $ ( that . wrapSelector ( '.' + APP_SELECT_ITEM + selector ) ) ;
505- for ( var i = startIdx ; i <= idx ; i ++ ) {
506- $ ( tags [ i ] ) . addClass ( 'selected' ) ;
507- }
508- that . pointer = { start :startIdx , end :idx } ;
509- }
510- } else {
511- // single-select
512- that . pointer = { start :idx , end :- 1 } ;
513- // un-select others
514- $ ( that . wrapSelector ( '.' + APP_SELECT_ITEM + selector ) ) . removeClass ( 'selected' ) ;
515- // select this
516- $ ( this ) . addClass ( 'selected' ) ;
517- }
518- } ) ;
519-
520- // item deleting (manually added item only)
521- $ ( this . wrapSelector ( '.vp-cs-del-item' ) ) . off ( 'click' ) ;
522- $ ( this . wrapSelector ( '.vp-cs-del-item' ) ) . on ( 'click' , function ( event ) {
523- $ ( this ) . closest ( '.' + APP_SELECT_ITEM ) . remove ( ) ;
524- that . pointer = { start :- 1 , end :- 1 } ;
525- } ) ;
526513}
527514
528515_addNewItem ( newItemName ) {
@@ -564,7 +551,6 @@ define([
564551let newItemIndex = this . dataList . length ;
565552var targetTag = $ ( `<div class="${ APP_SELECT_ITEM } ${ APP_DRAGGABLE } added selected" data-idx="${ newItemIndex } " data-name="${ newItemName } " data-type="object" data-code="'${ newItemName } '" title="${ newItemName } : Added manually">
566553 <span>${ newItemName } </span>
567- <div class="vp-cs-del-item vp-icon-close-small" title="Delete this manually added item"></div>
568554 </div>` ) ;
569555$ ( targetTag ) . appendTo (
570556$ ( this . wrapSelector ( '.' + APP_SELECT_BOX + '.right' ) )
@@ -574,8 +560,6 @@ define([
574560$ ( this . wrapSelector ( '.' + APP_SELECT_ITEM ) ) . removeClass ( 'selected' ) ;
575561// clear item input
576562$ ( this . wrapSelector ( '.vp-cs-add-item-name' ) ) . val ( '' ) ;
577- // bind click event
578- this . _bindItemClickEvent ( ) ;
579563// bind draggable
580564this . bindDraggable ( ) ;
581565}