Skip to content

Commit

Permalink
Fix select all functionality for gallery and comments listings
Browse files Browse the repository at this point in the history
  • Loading branch information
cheesypoof committed Aug 26, 2016
1 parent fd4e062 commit bc9cb2c
Show file tree
Hide file tree
Showing 5 changed files with 141 additions and 101 deletions.
51 changes: 27 additions & 24 deletions couch/theme/_system/content_list_inner_comments.html
Original file line number Diff line number Diff line change
@@ -1,27 +1,30 @@
<cms:ignore>
<div class="select_all">
<label>
<cms:render 'list_checkbox' for_header='1' />
<strong><cms:localize 'select-deselect' /></strong>
</label>&nbsp;
</div>
</cms:ignore>
<div id="comments-listing">
<cms:comments
masterpage = k_template_name
page_id = k_selected_pageids
approved = k_selected_status
order = k_selected_order
paginate = '1'
limit = k_selected_limit
show_unpublished = '1'
base_link = k_route_link
token = k_cur_token
>

<cms:render 'comment_item' />

<cms:comments
masterpage = k_template_name
page_id = k_selected_pageids
approved = k_selected_status
order = k_selected_order
paginate = '1'
limit = k_selected_limit
show_unpublished = '1'
base_link = k_route_link
token = k_cur_token
>
<cms:if k_paginated_bottom >
<cms:set my_paginator="<cms:render 'paginator' />" 'parent' />

<cms:render 'comment_item' />
<div class="select-all">
<cms:render 'list_checkbox' for_header='1' />
</div>
</cms:if>
</cms:comments>
</div>

<cms:if k_paginated_bottom >
<cms:set my_paginator="<cms:render 'paginator' />" 'parent' />
</cms:if>
</cms:comments>
<cms:admin_add_js>
$(function(){
COUCH.bindCommentsSelect();
});
</cms:admin_add_js>
123 changes: 59 additions & 64 deletions couch/theme/_system/content_list_inner_gallery.html
Original file line number Diff line number Diff line change
@@ -1,78 +1,73 @@
<div class="gallery-listing">
<div id="listing">
<cms:set my_max_items_in_row = '5' />
<cms:set my_gallery_folder_count='0' />
<cms:set my_cur_folder_count='0' />
<cms:set my_page_num="<cms:gpc method='get' var='pg' default='1' />"/>
<div id="gallery-listing">
<cms:set my_max_items_in_row = '5' />
<cms:set my_gallery_folder_count='0' />
<cms:set my_cur_folder_count='0' />
<cms:set my_page_num="<cms:gpc method='get' var='pg' default='1' />"/>

<cms:capture into='my_gallery_items' >
<cms:pages
masterpage = k_template_name
id = k_selected_pageids
folder = k_selected_foldername
orderby = k_selected_orderby
order = k_selected_order
custom_field = k_selected_custom_field
paginate = '1'
limit = k_selected_limit
show_unpublished = '1'
show_future_entries = '1'
page_name = "<cms:if k_selected_exclude>NOT <cms:show k_selected_exclude /></cms:if>"
base_link = k_route_link
token = k_cur_token
include_subfolders = '0'
>
<cms:capture into='my_gallery_items' >
<cms:pages
masterpage = k_template_name
id = k_selected_pageids
folder = k_selected_foldername
orderby = k_selected_orderby
order = k_selected_order
custom_field = k_selected_custom_field
paginate = '1'
limit = k_selected_limit
show_unpublished = '1'
show_future_entries = '1'
page_name = "<cms:if k_selected_exclude>NOT <cms:show k_selected_exclude /></cms:if>"
base_link = k_route_link
token = k_cur_token
include_subfolders = '0'
>

<cms:no_results>
<cms:capture into='my_folder_empty' >
<cms:show_info>
<h4><cms:localize 'folder_empty' /></h4>
</cms:show_info>
</cms:capture>
</cms:no_results>
<cms:no_results>
<cms:capture into='my_folder_empty' >
<cms:show_info>
<h4><cms:localize 'folder_empty' /></h4>
</cms:show_info>
</cms:capture>
</cms:no_results>

<cms:render 'gallery_item'
max_in_row = my_max_items_in_row
current_pos = k_count
start_from = my_gallery_folder_count
/>
<cms:render 'gallery_item'
max_in_row = my_max_items_in_row
current_pos = k_count
start_from = my_gallery_folder_count
/>

<cms:if k_paginated_bottom >
<cms:set my_paginator="<cms:render 'paginator' />" 'parent' />
<cms:if k_paginated_bottom >
<cms:set my_paginator="<cms:render 'paginator' />" 'parent' />

<div style="clear:both;"></div>
<div class="select_all">
<label>
<cms:render 'list_checkbox' for_header='1' />
<strong><cms:localize 'select-deselect' /></strong>
</label>&nbsp;
</div>
</cms:if>
</cms:pages>
</cms:capture>
<div style="clear:both;"></div>
<div class="select-all">
<cms:render 'list_checkbox' for_header='1' />
</div>
</cms:if>
</cms:pages>
</cms:capture>

<cms:show my_folder_empty />
<cms:show my_folder_empty />

<cms:if my_page_num='1' && "<cms:not k_selected_custom_field />">
<cms:folders
childof=k_selected_foldername
hierarchical='1'
depth='1'
orderby='weight'>
<cms:if my_page_num='1' && "<cms:not k_selected_custom_field />">
<cms:folders
childof=k_selected_foldername
hierarchical='1'
depth='1'
orderby='weight'>

<cms:set my_gallery_folder_count=k_total_folders scope='parent' />
<cms:incr my_cur_folder_count />
<cms:set my_gallery_folder_count=k_total_folders scope='parent' />
<cms:incr my_cur_folder_count />

<cms:render 'gallery_folder'
max_in_row = my_max_items_in_row
current_pos = my_cur_folder_count
/>
</cms:folders>
</cms:if>
<cms:render 'gallery_folder'
max_in_row = my_max_items_in_row
current_pos = my_cur_folder_count
/>
</cms:folders>
</cms:if>


<cms:show my_gallery_items />
</div>
<cms:show my_gallery_items />
</div>

<cms:render 'gallery_upload' />
11 changes: 6 additions & 5 deletions couch/theme/_system/includes/admin/main.css
Original file line number Diff line number Diff line change
Expand Up @@ -103,7 +103,7 @@ background-image:linear-gradient(to bottom, rgba(255,255,255,.075) 0%, rgba(0,0,
.tab>a:hover,.tab>a:focus,
.cke_dialog_tab:hover,.cke_dialog_tab:focus,.cke_dialog_ui_button:hover,.cke_dialog_ui_button:focus,
.panel-toggle:hover,.panel-toggle:focus{text-decoration:none;}
.simple-btns:after,#header-inner:after,#tabs:after,.ctrl-top:after,.ctrl-bot:after,#settings-panel:after,.gallery-listing:after,.gallery-actions:after{content:"";display:block;clear:both;}
.simple-btns:after,#header-inner:after,#tabs:after,.ctrl-top:after,.ctrl-bot:after,#settings-panel:after,#gallery-listing:after,.gallery-actions:after{content:"";display:block;clear:both;}
#sidebar-toggle,.field-hint,.panel-heading,.table>thead,.popover-title{background-color:#ececec;}
.gallery-img-none{background-image:url("images/stripe.svg");}
#scroll-sidebar>.mCustomScrollBox>.mCSB_container,.scroll-relation>.mCustomScrollBox>.mCSB_container{margin-right:0;}
Expand Down Expand Up @@ -385,7 +385,7 @@ input.input-group-field{position:relative;z-index:1;width:100%;border-radius:3px
.field>.field-label{font-weight:bold;text-shadow:0 1px 0 rgba(255,255,255,.5);}
.field>.field-label+br+.alert{margin-top:6px;margin-bottom:15px;}
.ctrls-checkbox>label,.ctrls-radio>label{line-height:28px;margin-right:20px;font-size:13px;}
.ctrls-checkbox>label>.ctrl-option,.ctrls-radio>label>.ctrl-option{margin-right:8px;vertical-align:-4px;}
.select-all>.ctrl>.ctrl-option,.ctrls-checkbox>label>.ctrl-option,.ctrls-radio>label>.ctrl-option{margin-right:8px;vertical-align:-4px;}
.desc{line-height:14px;margin-left:5px;vertical-align:1px;font-size:11px;color:#777;}
.panel-heading>.desc{font-size:12px;}
.panel-body>.field>.field-label>.desc,.panel-heading>.desc{color:#666;}
Expand Down Expand Up @@ -501,6 +501,8 @@ td.col-highlight{border-right:1px solid rgba(0,0,0,.03);border-left:1px solid rg
.col-highlight>.col-sort-link:hover>.i,.col-highlight>.col-sort-link:focus>.i{-ms-transform:rotate(180deg);
-webkit-transform:rotate(180deg);
transform:rotate(180deg);}
#gallery-listing>.select-all{margin-right:15px;}
.select-all>.ctrl{position:relative;bottom:-39px;z-index:1;padding-right:12px;font-size:12px;background-color:#f5f5f5;}

/* Comments */
.comment{position:relative;padding-left:104px;}
Expand All @@ -517,7 +519,7 @@ td.col-highlight{border-right:1px solid rgba(0,0,0,.03);border-left:1px solid rg
.panel-primary+.comment-body>.comment-details{text-shadow:none;}

/* Gallery */
.gallery-listing{margin-right:-15px;overflow-y:hidden;}
#gallery-listing{margin-right:-15px;}
.gallery-wrap{float:left;width:16.66667%;max-width:325px;padding:15px 15px 0 0;}
.gallery-item{padding:10px;border:1px solid #c0c0c0;border-radius:3px;background-color:#fafafa;}
.gallery-item.selected{background-color:#eaeaea;}
Expand Down Expand Up @@ -594,7 +596,7 @@ button.toast-close-button{padding:0;border:0;background:transparent;cursor:point
.toast-progress{position:absolute;bottom:0;left:0;height:4px;opacity:.6;}

/* WTF, forms? (http://wtfforms.com/) - Copyright 2014 Mark Otto - MIT License */
.ctrl{line-height:18px;}
.ctrl{line-height:18px;font-weight:normal;}
.ctrl,.ctrls-checkbox>label,.ctrls-radio>label,.checklist>li>label{display:inline-block;position:relative;cursor:pointer;}
.ctrl-disabled,.ctrls-disabled>label,.checklist-disabled>li>label{cursor:not-allowed;}
.ctrl>input,.ctrls-checkbox>label>input,.ctrls-radio>label>input,.checklist>li>label>input{position:absolute;z-index:-1;opacity:0;}
Expand Down Expand Up @@ -805,7 +807,6 @@ div.mfp-bottom-bar{text-shadow:0 1px 0 rgba(0,0,0,.6);}
height: 57px; /* Height of logo */
}

.select_all{ padding-top: 25px; }
#k_notice_f_k_access_level,
#k_notice_f_k_publish_date,
#k_notice_f_k_show_in_menu,
Expand Down
53 changes: 47 additions & 6 deletions couch/theme/_system/includes/admin/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -274,12 +274,45 @@ COUCH.bindTableSelect = function() {
});
};

/**
* Bind comment item click select action
*/
COUCH.bindCommentsSelect = function() {
this.el.$content.find( "#comments-listing" ).on( "click", ".comment-heading", function( e ) {
if ( e.target === this ) {
var $checkboxAll = COUCH.el.$content.find( ".checkbox-all" ),
$checkboxes = COUCH.el.$content.find( ".checkbox-item" ).not( ":disabled" ),
$this = $( this );

$this.find( ".checkbox-item" ).not( ":disabled" ).prop( "checked", function( i, val ) {
return !val;
}).trigger( "change" );

if ( $checkboxes.length === $checkboxes.filter( ":checked" ).length ) {
$checkboxAll.prop( "checked", true );
} else {
$checkboxAll.prop( "checked", false );
}
}
});

this.el.$content.find( "#comments-listing" ).on( "change", ".checkbox-all", function( e ) {
var $this = $( this ),
$checkboxes = COUCH.el.$content.find( ".checkbox-item" ).not( ":disabled" ),
checked = $this.prop( "checked" );

$checkboxes.prop( "checked", checked );
});
};

/**
* Bind gallery item click select action
*/
COUCH.bindGallerySelect = function() {
this.el.$content.find( ".gallery-listing" ).on( "click", ".gallery-item:not(.gallery-folder)", function( e ) {
var $this = $( this );
this.el.$content.find( "#gallery-listing" ).on( "click", ".gallery-item:not(.gallery-folder)", function( e ) {
var $checkboxAll = COUCH.el.$content.find( ".checkbox-all" ),
$checkboxes = COUCH.el.$content.find( ".checkbox-item" ).not( ":disabled" ),
$this = $( this );

if ( e.target === this || /DIV|STRONG/.test( e.target.nodeName ) ) {
$this.find( ".checkbox-item" ).not( ":disabled" ).prop( "checked", function( i, val ) {
Expand All @@ -290,12 +323,20 @@ COUCH.bindGallerySelect = function() {
} else if ( e.target.nodeName === "INPUT" && !$( e.target ).is( ":disabled" ) ) {
$this.toggleClass( "selected" );
}

if ( $checkboxes.length === $checkboxes.filter( ":checked" ).length ) {
$checkboxAll.prop( "checked", true );
} else {
$checkboxAll.prop( "checked", false );
}
});

this.el.$content.find( ".gallery-listing" ).on( "change", ".checkbox-all", function( e ) {
var $this = $( this );
var $checkboxes = COUCH.el.$content.find( ".checkbox-item" ).not( ":disabled" );
$checkboxes.prop( "checked", $this.prop( "checked" ) ).trigger( "change" );
this.el.$content.find( "#gallery-listing" ).on( "change", ".checkbox-all", function( e ) {
var $this = $( this ),
$checkboxes = COUCH.el.$content.find( ".checkbox-item" ).not( ":disabled" ),
checked = $this.prop( "checked" );

$checkboxes.prop( "checked", checked ).trigger( "change" ).closest( ".gallery-item" ).toggleClass( "selected", checked );
});
};

Expand Down
4 changes: 2 additions & 2 deletions couch/theme/_system/register.php
Original file line number Diff line number Diff line change
Expand Up @@ -1109,15 +1109,15 @@ function _render_alert( $heading='', $content='', $type='', $center='' ){
}

function _render_list_checkbox( $for_header=0 ){
global $CTX;
global $CTX, $FUNCS;

$page_id = $CTX->get( 'k_page_id' );
$can_delete = $CTX->get( 'k_can_delete' );

if( $for_header ){
$html = '<label class="ctrl checkbox">';
$html .= '<input class="checkbox-all" type="checkbox" name="check-all" />';
$html .= '<span class="ctrl-option tt" title="Select/Deselect All"></span></label>';
$html .= '<span class="ctrl-option"></span>'.$FUNCS->t('select-deselect').'</label>';
}
else{
$html = '<label class="ctrl checkbox">';
Expand Down

0 comments on commit bc9cb2c

Please sign in to comment.