knockout js checkbox filter working with ko.utils.arrayFilter

I have taken this example

http://knockoutjs.com/examples/animatedTransitions.html

and replaced the radio inputs with checkboxes i have it working if i return the planet.type manualy but i need to return more than 1 planet.type example 1 http://www.html5imageeditor.co.uk/kopush/filter.php example 2 http://www.html5imageeditor.co.uk/kopush/filter2.php

View

       <label><input type='checkbox' name="type" data-bind='value: "all" ,checked: typeToShow' />All</label>
       <label><input type='checkbox' name="type" data-bind='value: "rock" ,checked: typeToShow' />Rock</label>
       <label><input type='checkbox' name="type" data-bind='value: "gasgiant" ,checked: typeToShow' />Gas Giant</label>
   <div data-bind='template: { foreach: planetsToShow,
                               beforeRemove: hidePlanetElement,
                               afterAdd: showPlanetElement }'>
       <div data-bind='attr: { "class": "planet " }'><span data-bind="text: name "></span></div>
   </div>

model

var PlanetsModel = function() {
   this.planets = ko.observableArray([
        { name: "Mercury", type: "rock"},
        { name: "Venus", type: "rock"},
        { name: "Earth", type: "rock"},
        { name: "Mars", type: "rock"},
        { name: "Jupiter", type: "gasgiant"},
        { name: "Saturn", type: "gasgiant"},
        { name: "Uranus", type: "gasgiant"},
        { name: "Neptune", type: "gasgiant"},
        { name: "Pluto", type: "rock"}
    ]);

   this.typeToShow = ko.observableArray(["all"]);

   this.planetsToShow = ko.computed(function() {

       var desiredType = this.typeToShow();
       if (desiredType == "all") return this.planets();
       return ko.utils.arrayFilter(this.planets(), function(planet) {

        return planet.type == 'rock' || planet.type == 'gasgiant';//shows all how can i oproduce this result dynamicly ?
       //return planet.type == 'rock' shows just the rock
       });
   }, this);


   this.showPlanetElement = function(elem) { if (elem.nodeType === 1) $(elem).hide().slideDown() }
   this.hidePlanetElement = function(elem) { if (elem.nodeType === 1) $(elem).slideUp(function() { $(elem).remove(); }) }
};


ko.bindingHandlers.fadeVisible = {
   init: function(element, valueAccessor) {

       var value = valueAccessor();
       $(element).toggle(ko.utils.unwrapObservable(value));
   },
   update: function(element, valueAccessor) {

       var value = valueAccessor();
       ko.utils.unwrapObservable(value) ? $(element).fadeIn() : $(element).fadeOut();
   }
};

ko.applyBindings(new PlanetsModel());

as you can see the return is set manually i need create it dynamicly like planet.type == 'rock' || planet.type == 'gasgiant' hope it makes sence

thank you