Skip to content

Issues-487: Home page redesign (frixed breadcrumbs and scrolling) #552

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Apr 8, 2021
Merged

Issues-487: Home page redesign (frixed breadcrumbs and scrolling) #552

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 9 additions & 0 deletions vanilla/applications/vanilla/controllers/class.vanillacontroller.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,7 @@ protected function checkPageRange(int $offset, int $totalCount) {
protected function buildBreadcrumbs($CategoryID) {
$Category = CategoryModel::categories($CategoryID);
$ancestors = CategoryModel::getAncestors($CategoryID);
$parentCategoryID = val('ParentCategoryID', $Category);
if(val('GroupID', $Category) > 0) {
$temp = [];
foreach ($ancestors as $id => $ancestor) {
Expand Down Expand Up @@ -102,6 +103,14 @@ protected function buildBreadcrumbs($CategoryID) {
}
}

// FIX https://github.com/topcoder-platform/forums/issues/487
// Go to a parent category at a home page
foreach ($ancestors as $id => $ancestor) {
if ($ancestor['ParentCategoryID'] == -1) {
$ancestors[$id]['Url'] = url('/categories/#Category_'.$parentCategoryID, true);
}
}

return $ancestors;
}
}
Expand Down
53 changes: 45 additions & 8 deletions vanilla/applications/vanilla/js/home.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,45 @@
jQuery(document).ready(function($) {
$(".CategoryAccordion").accordion({ header: ".CategoryAccordionHeader",
animate:false,
collapsible: true,
active: 0, heightStyle: "content" ,
icons: { "header": "icon icon-chevron-down", "activeHeader": "icon icon-chevron-up" }});

});
jQuery(document).ready(function ($) {
// $(".CategoryAccordion").accordion({ header: ".CategoryAccordionHeader",
// animate:false,
// collapsible: true,
// active: 0, heightStyle: "content" ,
// icons: { "header": "icon icon-chevron-down", "activeHeader": "icon icon-chevron-up" }});

var headers = $('.CategoryAccordion .accordion-header')

// add the accordion functionality
headers.click(function () {
var panel = $(this).next()
var isOpen = panel.is(':visible')
if (isOpen) {
$(panel).parent().find('.ui-accordion-header-icon').removeClass('icon-chevron-up').addClass('icon-chevron-down')
$(panel).parent().find('.CategoryAccordionHeader').removeClass('ui-state-active')
} else {
$(panel).parent().find('.ui-accordion-header-icon').addClass('icon-chevron-up').removeClass('icon-chevron-down')
$(panel).parent().find('.CategoryAccordionHeader').addClass('ui-state-active')
}

//panel[isOpen? 'slideUp': 'slideDown']()
panel[isOpen ? 'hide' : 'show']().trigger(isOpen ? 'hide' : 'show')

return false
})

// hook up the expand/collapse
var hash = window.location.hash.substr(1)
if (hash) {
// Collapse other categories
$('.CategoryAccordionHeader').removeClass('ui-state-active')
$('.CategoryAccordionHeader').find('.ui-accordion-header-icon').removeClass('icon-chevron-up').addClass('icon-chevron-down')
$('.ui-accordion-content').hide()

$('#' + hash).find('.CategoryAccordionHeader').addClass('ui-state-active')
$('#' + hash).find('.ui-accordion-header-icon').removeClass('icon-chevron-down').addClass('icon-chevron-up');
$('#' + hash).find('.ui-accordion-content').show()
} else {
// Expand all categories
$('.CategoryAccordionHeader').addClass('ui-state-active')
$('.CategoryAccordionHeader').find('.ui-accordion-header-icon').removeClass('icon-chevron-down').addClass('icon-chevron-up');
$('.ui-accordion-content').show()
}
})
9 changes: 5 additions & 4 deletions vanilla/applications/vanilla/views/categories/helper_functions.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -378,7 +378,7 @@ function writeCategoryAccordion($categories, $depth = 1) {

?>
<div class="DataListWrap DataAccordionWrap">
<div id="CategoryAccordion" class="CategoryAccordion">
<div id="CategoryAccordion" class="CategoryAccordion ui-accordion ui-widget ui-helper-reset">
<?php
foreach ($categories as $category) {
writeAccordionItem($category, $depth);
Expand Down Expand Up @@ -408,11 +408,12 @@ function writeAccordionItem($category, $depth) {
$categoryID = val('CategoryID', $category);
$cssClass = cssClass($category, true);
?>
<div id="Category_<?php echo $categoryID; ?>" class="CategoryAccordionItem">
<div class="<?php echo $cssClass; ?> CategoryAccordionHeader">
<div id="Category_<?php echo $categoryID; ?>" class="CategoryAccordionItem ">
<div class="<?php echo $cssClass; ?> CategoryAccordionHeader accordion-header ui-accordion-header ui-helper-reset ui-state-default ui-accordion-icons ui-corner-all">
<a class="toggle" href="javascript:void(0);"><?php echo Gdn_Format::text(val('Name', $category)); ?></a>
<span class="ui-accordion-header-icon ui-icon icon icon-chevron-up"></span>
</div>
<ul id="Category_<?php echo $categoryID; ?>_child" class="DataList CategoryList CategoryAccordionCollapse">
<ul id="Category_<?php echo $categoryID; ?>_child" class="DataList CategoryList ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom">
<?php
foreach ($children as $child) {
writeListItem($child, $depth + 1);
Expand Down