Can't put Product Reviews into Tabs

Question

In the Blacknwhite magento theme we bought they use Tabs on the product details page and have the Product Reviews sitting beneath them.

I would like to move the Product reviews into their own tab. But am not sure what layout updates I should add.

The Theme's Layout.xml is

<block type="catalog/product_view_tabs" name="product.info.tabs" as="info_tabs" template="catalog/product/view/tabs.phtml" >
    <action method="addTab" translate="title" module="catalog"><alias>description</alias><title>Product Description</title><block>catalog/product_view_description</block><template>catalog/product/view/description.phtml</template></action>
    <action check_version="1">
        <if_version method="addTab" translate="title" module="catalog" is="1.7.x.x">
            <alias>upsell_products</alias>
            <title>We Also Recommend</title>
            <block>catalog/product_list_upsell</block>
            <template>1.7.x.x/catalog/product/list/upsell.phtml</template>
        </if_version>
        <default  method="addTab" translate="title" module="catalog">
            <alias>upsell_products</alias>
            <title>We Also Recommend</title>
            <block>catalog/product_list_upsell</block>
            <template>catalog/product/list/upsell.phtml</template>
        </default>
    </action>
    <action check_version="1">
        <if_version method="addTab" translate="title" module="catalog" is="1.7.x.x">
            <alias>additional</alias>
            <title>Additional Information</title>
            <block>catalog/product_view_attributes</block>
            <template>1.7.x.x/catalog/product/view/attributes.phtml</template>
        </if_version>
        <default method="addTab" translate="title" module="catalog">
            <alias>additional</alias>
            <title>Additional Information</title>
            <block>catalog/product_view_attributes</block>
            <template>catalog/product/view/attributes.phtml</template>
        </default>
    </action>
</block>
<block type="catalog/product_view" name="manufacturer.center" template="meigee/manufacturer_center.phtml" />
<block type="catalog/product_list_related" name="catalog.product.related.bottom" template="catalog/product/list/related_bottom.phtml"/>
<block type="core/template" name="product_review_list.count" template="review/product/view/count.phtml" />
<block type="review/product_view_list" name="product.info.review_list">
    <action check_version="1">
        <if_version method="setTemplate" is="1.7.x.x">
            <template>1.7.x.x/review/product/view/list.phtml</template>
        </if_version>
        <default method="setTemplate">
            <template>review/product/view/list.phtml</template>
        </default>
    </action>
    <block type="review/form" name="product.review.form" as="review_form">
        <block type="page/html_wrapper" name="product.review.form.fields.before" as="form_fields_before" translate="label">
            <label>Review Form Fields Before</label>
            <action method="setMayBeInvisible"><value>1</value></action>
        </block>
    </block>
</block>

I've tried adding the below to my own layout/local.xml file

<catalog_product_view>
    <reference name="product.info.tabs">
        <action method="addTab" translate="title" module="review">
            <alias>product.info.review_list</alias>
            <title>Reviews</title>
            <block>review/product_view_list</block>
            <template>review/product/view/list.phtml</template>
        </action>
    </reference>
</catalog_product_view>

This loads the review/product/view/list.phtml template in the tab but outputs nothing from the template except for the first tag. It falls down on an if statement which fails as $this->getReviewsCollection()->getItems() returns an empty array.

Here is the review/product/view/list.phtml template:

<?php
 *
 * @category    design
 * @package     base_default
 * @copyright   Copyright (c) 2012 Magento Inc. (http://www.magentocommerce.com)
 * @license     http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
 */
?>
<header class="rating-title">
    <h2><?php echo $this->__('Reviews') ?></h2>
</header>
<?php $_items = $this->getReviewsCollection()->getItems();?>
<div id="review-point"></div>
<div class="box-collateral box-reviews<?php if (count($_items) == 0):?> full-table<?php else: ?> row clearfix<?php endif; ?>" id="customer-reviews">
    <?php if (count($_items) !== 0):?><div class="grid_6 alpha"><?php endif; ?><?php echo $this->getChildHtml('review_form') ?><?php if (count($_items) !== 0):?></div><?php endif; ?>
    <?php if (count($_items)):?>
        <div class="grid_6 omega">
            <header class="rating-subtitle">
                <h2><?php echo $this->__('Customer Reviews') ?></h2>
            </header>
            <?php echo $this->getChildHtml('toolbar') ?>
            <div class="box visible">
                <ul>
                <?php $i=0; foreach ($_items as $_review):?>
                    <li <?php if ($i++%2!==0) echo 'class="even"'; ?>>
                        <?php $_votes = $_review->getRatingVotes(); ?>
                        <?php if (count($_votes)): ?>
                            <table class="ratings-table">
                                <col class="col-one" />
                                <col />
                                <tbody>
                                    <?php foreach ($_votes as $_vote): ?>
                                    <tr>
                                        <th><?php echo $this->escapeHtml($_vote->getRatingCode()) ?></th>
                                        <td>
                                            <div class="rating-box">
                                                <div class="rating" style="width:<?php echo $_vote->getPercent() ?>%;"></div>
                                            </div>
                                        </td>
                                    </tr>
                                    <?php endforeach; ?>
                                </tbody>
                            </table>
                        <?php endif; ?>
                        <div class="review<?php if(!count($_votes)){echo ' no-table';} ?>">
                            <h6><a href="<?php echo $this->getReviewUrl($_review->getId()) ?>"><?php echo $this->escapeHtml($_review->getTitle()) ?></a></h6>
                            <small><?php 
                                echo $this->__('Review by <span>%s</span>', $this->escapeHtml($_review->getNickname())); 
                                echo $this->__('on %s', $this->formatDate($_review->getCreatedAt()), 'long') ?>
                            </small>
                            <div class="review-txt">
                                <?php echo nl2br($this->escapeHtml($_review->getDetail())) ?>
                            </div>                        
                        </div>
                    </li>
                <?php endforeach; ?>
                </ul>
            </div>
            <div class="actions">
                <button type="button" id="revies-button" class="button"><span><span><?php echo $this->__('View all') ?></span></span></button>
            </div>
            <script type="text/javascript">
                jQuery(window).load(function() {
                    var review_txt_box = jQuery('.box-reviews .review-txt');
                    var number_of_lines = 5; //Number of Review Lines to Output
                    var review_button = '<i class="fa fa-sort-asc"></i>'; //Review Link Text
                    var review_button_active = '<i class="fa fa-sort-desc"></i>'; //Review Opened Link Text
                    var review_txt_box_height = parseFloat(review_txt_box.css('line-height'))*number_of_lines;
                    review_txt_box.each(function(){
                        var this_box = jQuery(this);
                        var this_box_height = this_box.height();
                        if(this_box_height > review_txt_box_height){
                            this_box.css({'height': review_txt_box_height, 'overflow': 'hidden'});
                            this_box.after('<a class="full-review">'+review_button+'</a><div class="clear"></div>');
                            var review_link = this_box.next('.full-review');
                            var is_full = false;
                            review_link.on('click', function(){
                                if(is_full == false){
                                    showAll();
                                    setTimeout(function(){
                                        this_box.animate({
                                            height: this_box_height
                                        }, 'medium', function(){
                                            review_link.html(review_button_active);
                                        });
                                        is_full = true;
                                    }, 1200);
                                }else{
                                    this_box.animate({
                                        height: review_txt_box_height
                                      }, 'medium', function(){
                                        review_link.html(review_button);
                                    });
                                    is_full = false;
                                }
                            });
                        }
                    });

                    var listContainer = jQuery('.box-reviews .box ul');
                    var lis = listContainer.find('li');
                    var fullHeigth = listContainer.outerHeight(true)+32;
                    var startHeigth = lis.eq(0).outerHeight(true) + lis.eq(1).outerHeight(true);

                    listContainer.css({
                        'height': startHeigth,
                        'overflow': 'hidden'
                    });

                    var revButton = jQuery('#revies-button');

                    function showAll(){
                        listContainer.animate({
                            height: fullHeigth
                        }, 1000, function(){
                            listContainer.css('height', 'auto');
                        });
                        revButton.addClass('open').find('span span').html('<?php echo $this->__('Hide') ?>');
                    }
                    function hide(){
                        listContainer.animate({
                            height: startHeigth
                        }, 1000);
                        revButton.removeClass('open').find('span span').html('<?php echo $this->__('View all') ?>');
                    }
                    revButton.on('click', function(){
                        if(!revButton.hasClass('open')){
                            showAll();
                        }else{
                            hide();
                        }
                    });

                    jQuery(window).resize(function(){
                        fullHeigth = listContainer.outerHeight(true)+32;
                        startHeigth = lis.eq(0).outerHeight(true) + lis.eq(1).outerHeight(true);
                        listContainer.css({
                            'height': startHeigth,
                            'overflow': 'hidden'
                        });
                    });

                });
            </script>
            <?php echo $this->getChildHtml('toolbar') ?>
        </div>
    <?php endif;?>
    <div class="clear"></div>
</div>

---

Update with Working Solution

My Attempt after reading fschmengler's answer below, it's not working, I don't think I have done it as he intended.

<catalog_product_view>
    <reference name="product.info.tabs">
        <action method="addTab" translate="title" module="review">
            <alias>hoi.product.info.review_list</alias>
            <title>hoi.product.info.review_list</title>
            <block>review/product_view_list</block>
            <template>review/product/view/list.phtml</template>
        </action>
    </reference>
    <remove name="product.info.review_list"/>
    <block type="review/product_view_list" name="hoi.product.info.review_list" alias="hoi.product.info.review_list">
        <action check_version="1">
            <if_version method="setTemplate" is="1.7.x.x">
                <template>1.7.x.x/review/product/view/list.phtml</template>
            </if_version>
            <default method="setTemplate">
                <template>review/product/view/list.phtml</template>
            </default>
        </action>
        <block type="review/form" name="product.review.form" as="review_form">
            <block type="page/html_wrapper" name="product.review.form.fields.before" as="form_fields_before" translate="label">
                <label>Review Form Fields Before</label>
                <action method="setMayBeInvisible"><value>1</value></action>
            </block>
        </block>
    </block>
    <reference name="product.info.tabs">
        <action method="setChild">
            <alias>hoi.product.info.review_list</alias>
            <block>hoi.product.info.review_list</block>
        </action>
    </reference>
</catalog_product_view>

Answer 1

Since the review block has its own child blocks you cannot easily add it as a tab.

The solution is to add a dummy tab and then replace it with the existing review block. I described this method here: https://magento.stackexchange.com/a/74165/243

To remove the review tab from its original position, you would normally use <action method="unsetChild"><child>ALIAS</child></action> but unfortionately the block does not have an alias in the original theme layout. You will need to remove it entirely with <remove name="product.info.review_list"/> and copy/paste the complete block definition in your local.xml, but outside any other block. This way it can be referenced as explained in the link above but will not be rendered elsewhere.