@{
    ViewBag.Title = "Product";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<script src="~/Scripts/angular.js"></script>
<script src="~/Scripts/ui-bootstrap-tpls-0.10.0.min.js"></script>
<link href="~/Scripts/bootstrap.min.css" rel="stylesheet" />
<script src="/Scripts/jquery-1.7.1.js"></script>

<script>
    var appProd = angular.module("appProd", ['ui.bootstrap']);
    appProd.filter('startFrom', function () {
        return function (input, start) {
            if (input) {
                start = +start; //parse to int
                return input.slice(start);
            }
            return [];
        }
    });
    appProd.controller("cntProduct", function ($scope, $http, $timeout, $modal, $log) {
        var catid = 0;
        $scope.list = [];
        $scope.entryLimit = 2;
        debugger;
        $.ajax({
            type: 'GET',
            contentType: 'application/json; charset=utf-8',
            url: '/Home/GetList',
            success: function (data) {
                debugger;
                window.alert(1);
                $scope.list = data;
                $scope.currentPage = 1;
                $scope.entryLimit = 2;
                $scope.filteredItems = $scope.list.length;
                $scope.totalItems = $scope.list.length;
                if (catid == '1') {
                    $scope.bClass = "selected";
                    $scope.mClass = "";
                } else {
                    $scope.bClass = "";
                    $scope.mClass = "selected";
                }
            },
            error: function (response) {
                debugger;
                window.alert(1);
            }
        });

        $scope.setPage = function (pageNo) {
            $scope.currentPage = pageNo;
        };
        $scope.filter = function () {
            debugger;
            $timeout(function () {
                $scope.filteredItems = $scope.filtered.length;
            }, 10);

        };

        $scope.getText = function (obj) {
            debugger;

            return obj.replace(' ', '-').replace('&', '-');
        };



    });
</script>
<div id="scartcontent" class="scartcontent" ng-app="appProd" ng-controller="cntProduct">
    <div class="clr pad10"></div>

    <div class="fright cart">
        <div>
            <span>
                <img src='../../images/card-img.jpg' width="31" height="28" alt="" align="absmiddle" /></span><span> hjuyjuyjuy
                 <a href="ViewBasket" title="go to shopping cart">
                     <img src='../../images/green-chkout.jpg' title="Checkout" alt="" align="absmiddle" class="margL10" />
                 </a>
                </span>
        </div>

    </div>
    <div class="cd-tabs">
        <nav>
            <ul class="cd-tabs-navigation">
                <li style="display: none;"><a class="{{bClass}}" n1111g-click="getProductList('1')">Book</a>
                </li>
                <li><a class="{{mClass}}" ng11111-click="getProductList('2')">Magazine</a>
                </li>
            </ul>
            <!-- cd-tabs-navigation -->
        </nav>
        <ul class="cd-tabs-content">
            <li class="selected">

                <div class="pad5">
                    <div class="fleft pad10">
                        PageSize:                        
                    <select ng-model="entryLimit">
                        <option>2</option>
                        <option>5</option>
                        <option>10</option>
                        <option>20</option>
                        <option>50</option>
                        <option>100</option>
                    </select>
                    </div>
                    <div class="fright pad10">
                        <input type="text" class="add_input2 pad5" ng-model="search" ng-change="filter()" id="txtSearch" placeholder="Search Book/Magazine here" />
                    </div>
                </div>
                <div class="clear"></div>
                <div class="gd-row" align="center">

                    <div class="gd-col gu3" ng-repeat="prod in filtered = (list | filter:{ProductName:search}) | startFrom:(currentPage-1)*entryLimit | limitTo:entryLimit">

                        <div class="product-unit">
                            <div class="center">
                                <a ng-disabled='{{prod.OutOfStock=="0"? false :true }}' ng-href="{{prod.CategoryId}}/{{prod.ProductId}}/PD/{{getText(prod.ProductName)}}">
                                    <img style="width: 103px; height: 142px" ng-src="../../Images/{{ prod.ProductImage}}" /></a>
                            </div>
                            <div class="pu-details">
                                <div class="height35">
                                    {{prod.ProductName}}-  {{prod.ProductSummary}}
                                </div>

                                <div class="pu-price margT8">
                                    <div class="pu-border-top padT5">
                                        <div class="margB5">Rs.{{prod.DisplayProductPrice}}</div>
                                    </div>
                                    <div class="pu-border-top"></div>
                                </div>
                                <div class='{{prod.OutOfStock=="0"? "avalb":"notavalb" }}'>
                                    {{prod.OutOfStock=="0"? "Available":"Out of Stock" }}
                                </div>

                            </div>
                        </div>
                    </div>

                </div>
            </li>
        </ul>
        <div class="clear"></div>
        <div class="col-mid-10" style="background: #fff;">
            <div class="pad5">
                <div class="col-wid-10" ng-show="filteredItems == 0">
                    <h4>No Product found as per Search keyword </h4>
                </div>
            </div>
            <div class="clear"></div>
            <div class="fleft col-mid-10" ng-show="filteredItems > 0">
                <div class="fleft col-wid-3 pad10">
                    {{ "Showing " + (currentPage == 1 ? "1" : ((currentPage - 1) * entryLimit)+1) + " to " +
               ((currentPage * entryLimit) >= filteredItems ? filteredItems : (currentPage * entryLimit))
                 + " of " + filteredItems + " Items";}}
                </div>
                <div class="fright pagination-small margR10">
                    <div pagination="" page="currentPage" on-select-page="setPage(page)"
                        boundary-links="true" total-items="filteredItems" items-per-page="entryLimit"
                        previous-text="&laquo;" next-text="&raquo;">
                    </div>
                </div>
            </div>
            <div class="clear"></div>
        </div>
    </div>
    <div class="disclm">
        <strong>Disclaimer</strong>:- All Magazines listed at this site belongs to Publication Division, Ministry of Info. & Broadcasting, for any product related queries or issues customers will have to contact the ministry at 011-2436 7453, email-id pdjucir@gmail.com  for any product non-delivery / refund / quality or other issues related to the magazines listed here. Office of CGA (BharatKosh Portal Owner) will complete financial transaction related activity only.
    </div>
    <div class="clear"></div>

</div>
<div class="clr pad10"></div>
<div class="clr padB20"></div>