<link rel="stylesheet" type="text/css" href="module/content/css/content.css" />
<section class="user_page container">
    <div class="sales_report">
        <div class="sales_report_in">
            <div class="sales_card" ng-show="listFound">
                <div class="container-fluid table_area">
                    <div class="row">
                        <ul class="nav nav-tabs">
                            <li ng-click="listClick(obj)" ng-class="{active:obj.name == sideselect.name}" ng-repeat="obj in submenu track by $index">
                                <a data-toggle="tab" data-target="#menu{{$index}}" class="clsusersidemenu_{{$index}} ptr">{{obj.name}}</a>
                            </li>
                        </ul>
                    </div>
                    <div class="row top_box">
                        <div class="left_box">
                            <div class="input-group mb-3">
                            </div>
                        </div>
                        <div class="right_box">
                            <div class="sear">
                                <form class="row form_2">
                                    <div class="form-group col-sm-12 disable">
                                        <input type="search" ng-change="onSearchChange()" class="form-control" ng-model="formData.mymodel" name="Search" placeholder="Search"
                                            autocomplete="off" required>
                                    </div>
                                </form>
                            </div>
                            <div class="addbtn">
                                <button class="btn export" ng-click="addFun()">
                                    <p>Add</p>
                                </button>
                            </div>
                        </div>
                    </div>
                    <div class="row bottom_box">
                        <div class="col-sm-12 table_box">
                            <div class="table-fixed">
                                <table class="table table-fixed">
                                    <thead ng-if="sideselect.id == 1">
                                        <tr class="row-name">
                                            <th class="col-xs-3">Category</th>
                                            <th class="col-xs-3">Topic</th>
                                            <th class="col-xs-3">Image</th>
                                            <th class="col-xs-3">Action</th>
                                        </tr>
                                    </thead>
                                    <tbody ng-if="sideselect.id == 1">
                                        <tr class="pad-0 row-content col-xs-12" ng-repeat="product in productList" style='min-height:50px'>
                                            <td class="col-xs-3">{{product.catename}}</td>
                                            <td class="col-xs-3">{{product.topicname}}</td>
                                            <td class="col-xs-3">
                                                <div class="topic_img">
                                                    <img src="{{product.image_url}}">
                                                </div>
                                            </td>
                                            <td class="col-xs-3">
                                                <div ng-if="product.is_edit==1" class="clsicon deleteicon  ion-edit" title="Edit" ng-click="editrow(product,$index)"></div>
                                                <div ng-if="product.is_edit!=1" class="clsicondis deleteicon ion-edit" title="Edit"></div>
                                                <div ng-if="product.is_edit==1" class="clsicon editicon  ion-trash-a" title="Delete" ng-click="deleterow(product,$index)"></div>
                                                <div ng-if="product.is_edit!=1" class="clsicondis editicon ion-trash-a" title="Delete"></div>
                                            </td>
                                        </tr>
                                    </tbody>
                                    <thead ng-if="sideselect.id == 2">
                                        <tr class="row-name">
                                            <th class="col-xs-2">Topics</th>
                                            <th class="col-xs-1">File Type</th>
                                            <th class="col-xs-2">Assigned Role</th>
                                            <th class="col-xs-2">Title</th>
                                            <th class="col-xs-3">Description</th>
                                            <th class="col-xs-2">Action</th>
                                        </tr>
                                    </thead>
                                    <tbody ng-if="sideselect.id == 2">
                                        <tr class="pad-0 row-content col-xs-12" ng-repeat="content in contentdata" style='min-height:50px'>
                                            <td class="col-xs-2">{{content.topicname}}</td>
                                            <td class="col-xs-1">{{content.file[0].filetype}}</td>
                                            <td class="col-xs-2">
                                                <div ng-if="content.filter_role_name!=undefined">
                                                    <div ng-repeat="role in content.filter_role_name">{{role.rolename}}{{$last ? '' : ', '}}</div>
                                                </div>

                                            </td>
                                            <td class="col-xs-2">{{content.title}}</td>
                                            <td class="col-xs-3">{{content.description}}</td>
                                            <td class="col-xs-2">
                                                <div ng-if="content.is_edit==1" class="clsicon  deleteicon ion-edit" title="Edit" ng-click="editrow(content,$index,'0')"></div>
                                                <div ng-if="content.is_edit!=1" class="clsicondis deleteicon ion-edit" title="Edit"></div>
                                                <div ng-if="content.is_edit==1" class="clsicon editicon  ion-trash-a" title="Delete" ng-click="deleterow(content,$index)"></div>
                                                <div ng-if="content.is_edit!=1" class="clsicondis editicon ion-trash-a" title="Delete"></div>
                                                <div data-backdrop='static' data-toggle="modal" data-target="#myModal" ng-click="viewfile(content,$index)" class="editicon ion-eye ptr"
                                                    title="View"></div>
                                                <div class="modal" id="myModal">
                                                    <div class="modal-dialog">
                                                        <div class="modal-content">
                                                            <!-- Modal Header -->

                                                            <div class="modal-header">
                                                                <h4 class="modal-title">
                                                                    <!-- <b class="font_14">Question type: </b></h4> -->
                                                                    <button type="button" ng-click="onModalHide($event)" class="close" data-dismiss="modal">&times;</button>
                                                            </div>

                                                            <div class="modal-body model_left">
                                                                <!-- <embed src="{{filename}}" type="application/pdf" width="100%" height="100%" /> -->
                                                                <object data="{{filename}}" type="application/pdf" width="100%" height="100%">
                                                                    <p>Alternative text - include a link
                                                                        <a href="{{filename}}">to the PDF!</a>
                                                                    </p>
                                                                </object>
                                                            </div>


                                                            <!-- Modal footer -->
                                                            <div class="modal-footer">
                                                                <!-- <button type="button" class="btn_close btn btn-danger" data-dismiss="modal">Close</button> -->
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="container">
                    <div class="row">
                        <nav aria-label="Page navigation" id="div1">
                            <ul class="pagination pager" uib-pagination total-items="totalItems" ng-model="currentPage" ng-change="pageChanged()" max-size="maxSize"
                                boundary-links="true" rotate="false" num-pages="numPages" items-per-page="itemsPerPage"></ul>
                        </nav>
                    </div>
                </div>
            </div>
            <!---ADD / EDIT FORM -------->
            <div class="profile_bg" ng-if="formLoad">
                <div class="container-fluid pro_head">
                    <h4 class="text4">{{formTitle}}</h4>
                    <button type="button" class="close ass-close" ng-click="closeForm()">
                        <span>×</span>
                    </button>
                </div>
                <div class="container-fluid form_bg form-scroll" ng-if="sideselect.id == 1">
                    <form class="row form_2" ng-submit="topicSubmit()" novalidate>
                        <div class="form-group col-sm-12 phone">
                            <select name="clscategory" ng-model="formData.cateid" ng-change="functionCall()" class="form-control selectbox" required
                                select-option>
                                <option value="" selected="" disabled="disabled">{{sideselect.formText[1]}}</option>
                                <option value="{{cat.cateid}}" ng-repeat="cat in catList">{{cat.catename}}</option>
                            </select>
                            <div class="color_error shake" ng-if="cat_error!=''">
                                <a class="text-left shake">
                                    {{cat_error}}</a>
                            </div>
                        </div>
                        <!-- <div class="clearfix"></div> -->
                        <div class="form-group col-sm-12">
                            <input id="topic" class="form-control" ng-model="formData.topicname" autocomplete="off" required="required">
                            <label for="topic" class="control-label form-control-placeholder">{{sideselect.formText[0]}}</label>
                            <div class="color_error shake" ng-if="topic_error!=''">
                                <a class="text-left shake">
                                    {{topic_error}}</a>
                            </div>
                        </div>
                        <div class="form-group col-sm-12 phone">
                            <label for="segment" class="control-label ">Segment</label>
                            <select id='segment' name="clscategory" ng-model="formData.segment" class="form-control selectbox" required select-option>
                                <option value="" selected="" disabled="disabled">{{sideselect.formText[4]}}</option>
                                <option value="0"  >Student Learner</option>
                    			<option value="1"  >Parents/Guardian</option>
                    			<option value="2"  >Instructor</option>
                            </select>
                            <div class="color_error shake" ng-if="segment_error!=''">
                                <a class="text-left shake">
                                    {{segment_error}}</a>
                            </div>
                        </div>
                        <div class="form-group col-sm-12">
                            <label class='userlabel'>Order by
                            </label>
                            <br>
                            <div class="input-group">

                                <input type="radio" ng-model="formData.listorder" value="0"> Ascending&nbsp;&nbsp;

                                <input type="radio" ng-model="formData.listorder" value="1"> Descending&nbsp;&nbsp;
                            </div>
                            <div class="color_error shake" ng-if="topic_order_error!=''">
                                <a class="text-left shake">
                                    {{topic_order_error}}</a>
                            </div>
                        </div>

                        <div class="form-group col-sm-12">
                            <label class='userlabel'>Topic Image
                                <span ng-if="formAction=='Edit'">
                                    <a class="preview" target="_blank" href="{{image_url}}">Preview</a>
                                </span>
                            </label>
                            <div class="clearfix"></div>
                            <div class="upload-btn-cus">
                                <!-- <button class="uploadbtn">Choose File</button> -->
                                <input type="file" name="uploadfile" upload-img-file />
                            </div>
                            <div class="color_error shake" ng-if="topic_image_error!=''">
                                <a class="text-left shake">
                                    {{topic_image_error}}</a>
                            </div>
                        </div>
                        <div class="col-sm-12 text-center ">
                            <button type="button" class="btn primary fixed" ng-click="closeForm()">Cancel</button>
                            <button type="submit" class="btn primary fixed">Submit</button>
                        </div>
                    </form>
                </div>
                <div class="container-fluid form_bg form-scroll" ng-if="sideselect.id == 2">
                    <form name="contentform" class="row form_2" ng-submit="contentSubmit()">
                        <div class="form-group col-sm-6">
                            <select class="form-control selectbox" ng-model="formData.assettopicid" ng-change="functionCall()">
                                <option value="" selected="" disabled="disabled">{{sideselect.formText[0]}}</option>
                                <option value="{{prod.assettopicid}}" ng-repeat="prod in productList">{{prod.topicname}} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;- {{prod.segment_str}}</option>
                            </select>
                            <div class="color_error shake" ng-if="topic_error!=''">
                                <a class="text-left shake">
                                    {{topic_error}}</a>
                            </div>
                        </div>

                        <div class="form-group col-sm-6 ">
                            <input id="topic" class="form-control" ng-model="formData.title" autocomplete="off" required="required">
                            <label for="topic" class="control-label form-control-placeholder">{{sideselect.formText[2]}}</label>
                            <div class="color_error shake" ng-if="title_error!=''">
                                <a class="text-left shake">
                                    {{title_error}}</a>
                            </div>
                        </div>
                        <div class="form-group col-sm-12 phone" ng-if="enableeditbox">
                            <label for="segment" class="control-label ">Segment</label>
                            <select id='segment' name="clscategory" ng-model="formData.segment" class="form-control selectbox" required select-option>
                                <option value="" selected="" disabled="disabled">{{sideselect.formText[11]}}</option>
                                <option value="0"  >Student Learner</option>
                    			<option value="1"  >Parents/Guardian</option>
                    			<option value="2"  >Instructor</option>
                            </select>
                            <div class="color_error shake" ng-if="segment_error!=''">
                                <a class="text-left shake">
                                    {{segment_error}}</a>
                            </div>
                        </div>
                        <div class="form-group col-sm-12 phone" ng-if="!enableeditbox">
                            <label for="segment" class="control-label ">Segment</label>
                            <select id='segment' name="clscategory" ng-model="formData.segment" class="form-control selectbox" required select-option>
                                <option value="" selected="" disabled="disabled">{{sideselect.formText[11]}}</option>
                                <option ng-if="topicdata==0 && topicdata!=2 && topicdata!=1" value="0">Student Learner</option>
                                <option ng-if="topicdata==0 || (topicdata!=2 && topicdata==1)" value="1">Parents/Guardian</option>
                                <option ng-if="topicdata==0 || (topicdata!=1 && topicdata==2)" value="2">Instructor</option>
                            </select>
                            <div class="color_error shake" ng-if="segment_error!=''">
                                <a class="text-left shake">
                                    {{segment_error}}</a>
                            </div>
                        </div>
                        <div class="form-group col-sm-12">
                            <label>Role</label>
                            <multiple-autocomplete ng-model="formData.roleList" object-property="rolename" suggestions-arr="role">
                            </multiple-autocomplete>
                        </div>



                        <div class="form-group col-sm-12 description">
                            <textarea id="desc" class="form-control" ng-model="formData.description" rows="10" cols="10" required="required"></textarea>
                            <label for="desc" class="control-label form-control-placeholder">{{sideselect.formText[3]}}</label>
                        </div>
                        <div class="clearfix"></div>

                        <!-- coded by sound -->
                        <label class="inherit">Filters</label>
                        <div class="region">
                            <div class="col-sm-4">
                                <label>Zone</label>
                                <!-- <label>
                                    <input type="checkbox" ng-model="ischecked" id="selectall" name="selectallzone" ng-change="selectallzone()" 
                                    value="1">
                                    Zone
                                </label> -->
                                <div class="region_box scroll">
                                    <div class="checkbox" ng-repeat="obj in zoneList track by $index">
                                        <label class="checkbox-inline">
                                            <input type="checkbox" ng-change="zoneChanged(obj,$index)" ng-model="formData.zoneList[obj.zone]" value="{{obj.zone}}">{{obj.zone}}
                                        </label>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-4" ng-show="stateVisible">
                                <label>City</label>
                                <div class="region_box scroll_bar">
                                    <div class="checkbox" ng-repeat="obj in regionList">
                                        <div ng-repeat="child in obj.child">
                                            <label class="checkbox-inline">
                                                <input type="checkbox" ng-change="regionChanged(child,$index)" ng-model="formData.regionList[child]" value="{{child}}">{{child}}
                                            </label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-4" ng-show="dealerVisible">
                                <label>Dealer</label>
                                <div class="region_box scroll_bar">
                                    <div class="checkbox" ng-repeat="obj in dealerList">
                                        <div ng-repeat="child in obj.child">
                                            <label class="checkbox-inline">
                                                <input type="checkbox" ng-model="formData.dealerList[child.dealer_code]" value="{{child.dealer_code}}">{{child.dealer_name }}
                                            </label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="clearfix"></div>
                        <div class="form-group col-sm-6">
                            <select class="form-control selectbox" ng-model="formData.filetypeid" ng-change="changeType()" ng-required="filerequired">
                                <option value="" selected>{{sideselect.formText[6]}}</option>
                                <option value="1">PDF</option>
                                <option value="2">MP4</option>
                            </select>
                            <div class="color_error shake" ng-if="ftype_error!=''">
                                <a class="text-left shake">
                                    {{ftype_error}}</a>
                            </div>
                        </div>
                        <div class="clearfix"></div>
                        <div class="w100 choose_margin" data-ng-repeat="choice in choices track by $index" data-id={{$index}}>
                            <div class="row col-sm-2 lang">
                                <label class='userlabel'>{{sideselect.formText[10]}}
                                    <span ng-if="formAction!='Edit' " class="redclr">*</span>
                                </label>
                                <div class="input-group">
                                    <!-- <select name="clscategory" ng-model="choice.filelang" ng-change="call(choice)" class="form-control check" ng-required="filerequired" select-option>
                                    <option value="" selected="" disabled="disabled">{{sideselect.formText[10]}}</option>
                                    <option ng-repeat="lang in langList" value="{{lang}}"  ng-disabled="isDisabled(lang)">{{lang.language_title}}</option> 
                                    </select>-->
                                    <select ng-model="choice.filelang" ng-change="call(choice,$index)">
                                        <option ng-repeat="c in langList" ng-disabled="isDisabled(c.language_id)" value="{{c.language_id}}">
                                            {{c.language_title}}
                                        </option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-sm-4" ng-if="formData.filetypeid!=3">
                                <label class='userlabel'>{{sideselect.formText[7]}}
                                    <span ng-if="formAction!='Edit'" class="redclr">*</span>
                                    <span ng-if="formAction=='Edit' && file_show==$index">
                                        <a class="preview" target="_blank" href="{{filepath_url}}">Preview</a>
                                    </span>
                                </label>
                                <!-- <input class="form-control" type="file" name="filename" uploading-file-content ng-required="filerequired" /> -->
                                <div class="upload-btn-cus">
                                    <!-- <button class="uploadfile">Choose File</button> -->
                                    <input type="file" name="filename" uploading-file-content ng-required="filerequired" />
                                </div>
                                <div class="color_error shake" ng-if="pdf_error!=''">
                                    <a class="text-left shake">
                                        {{pdf_error}}</a>
                                </div>
                            </div>

                            <div class="col-sm-4" ng-if="formData.filetypeid!=3">
                                <label class='userlabel'>{{sideselect.formText[8]}}
                                    <span ng-if="formAction!='Edit'" class="redclr">*</span>
                                </label>
                                <div class="upload-btn-cus">
                                    <!-- <button class="uploadfile">Choose File</button> -->
                                    <input type="file" name="uploadthumbimage" thumb-upload-file ng-required="thmbrequired" />
                                </div>
                                <span ng-if="formAction=='Edit' && file_show==$index">
                                    <a class="preview" target="_blank" href="{{thumbpath_url}}">Preview</a>
                                </span>
                                <!-- <img src="{{thumbpath_url}}"> -->
                                <div class="color_error shake" ng-if="thumb_error!=''">
                                    <a class="text-left shake">
                                        {{thumb_error}}</a>
                                </div>
                            </div>

                            <div class="col-sm-2" ng-if="choices.length>1">
                                <!-- <button class="remove" ng-show="$last" ng-click="removeChoice(choice)">-</button> -->
                                <button class="remove" ng-show="$last" ng-click="removeChoice(choice)">-</button>
                            </div>
                        </div>
                        <div class="clearfix"></div>
                        <div class="col-sm-12 text-center">
                            <button type="button" class="addfields" ng-click="addNewChoice()">+ Add fields</button>
                        </div>
                        <div class="clearfix"></div>
                        <!-- <div id="choicesDisplay">
                        {{ choices }}
                        </div> -->
                        <!-- <div class="col-md-6">
                        <label class='userlabel'>{{sideselect.formText[11]}} <span class="redclr">*</span></label>
                        <div class="input-group">
                            <input class="form-control version" type="text" placeholder="{{sideselect.formText[11]}}" ng-model="formData.version" required="required"
                                title="{{sideselect.formText[11]}}" />
                        </div>
                        </div> -->
                        <!-- <div class="col-md-6" ng-if="formData.filetypeid==3">
                        <label class='userlabel'>{{sideselect.formText[10]}} <span class="redclr">*</span></label>
                        <div class="input-group">
                            <input class="form-control" type="text" placeholder="{{sideselect.formText[10]}}" ng-model="formData.url" required="required"
                                title="{{sideselect.formText[10]}}" />
                        </div>
                        </div> -->
                        <div class="clearfix"></div>
                        <div class="box-footer col-sm-12 text-center">
                            <button type="button" class="btn primary fixed" ng-click="closeForm()">Cancel</button>
                            <button type="submit" class="btn primary fixed">Submit</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</section>