lab-exercises-detail.html 15.5 KB
<!--Body-->
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>

<div class="bodyWrap row" ng-controller="LabExercController">

    <div class="" ng-init="InitializeLabExerciseMain()" id="LabView">
        <div class="col-sm-12 pageHeading" id="LabExPageHeading">
            <!--<button type="button" class="btn btn-default pull-left toggleBar hidden-lg"> <i class="fa fa-bars"></i> </button>
            <div class=" pull-left toggleBar toggleHeadingButton" data-toggle="tooltip" data-placement="top" title="Show/Hide Sidebar"> <i class="fa fa-bars"></i> </div>-->
            <h4 class="pull-left">Lab Exercise - <span id="exerciseName"></span></h4>
            <div class="pull-right btn-group paddTop4" style="height:35px"> <a href="#" id="minlab" class="btn btn-xs btn-default" ng-click="minLabExPanel($event)" style="font-size:15px"><i id="minlabicon" class="fa fa-minus"></i></a> <a href="#" id="minclose" class="btn btn-xs btn-default" style="font-size:15px"><i class="fa fa-clone"></i></a> <a href="lab-exercises" ng-click="CloseExercise($event)" class="btn btn-xs btn-default" style="font-size:15px"><i id="mincloseicon" class="fa fa-close"></i></a> </div>
            <div class="clearfix"></div>
        </div>

        <div id="labExModalbackground" class="labExModalbackground"></div>
        <!-- Lab Ex -->
        <div class="labExModal labExModalonID" id="labExModalID">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" id="closeEmailmodel" class="close" data-dismiss="modal" aria-label="Close" ng-click="closeLabExEmailModel($event)"><span aria-hidden="true">×</span></button>
                    <h4 class="modal-title" id="myModalLabel">Email your performance report</h4>
                </div>

                <div class="modal-body paddTop15">
                    <div class="modal-body paddTop15">

                        <form class="form-horizontal" name="LabExForm" id="LabExerciseForm" ng-submit="SendLabEXMailToUser($event)">
                            <div class="form-group">
                                <div class="col-sm-5 control-label">
                                    <label>*Email To: (Email address)</label>
                                </div>

                                <div class="col-sm-7">

                                    <input type="text" name="usremail" class="form-control" id="emailTo" multiple />
                                    <div class="help-block">*Use ',' to separate multiple email ids. </div>

                                </div>
                            </div>

                            <div class="form-group">
                                <div class="col-sm-5 control-label">
                                    <label>*Your name:</label>
                                </div>
                                <div class="col-sm-7">
                                    <input type="text" name="name" class="form-control" id="userName" />
                                </div>
                            </div>

                            <div class="form-group">
                                <div class="col-sm-5 control-label">
                                    <label for="">*Your Email Address:</label>
                                </div>
                                <div class="col-sm-7">
                                    <input type="text" class="form-control" name="receiverEmail" id="userEmailID" />

                                </div>
                            </div>

                            <div class="form-group">
                                <div class="col-sm-5 control-label">
                                    <label for="">Send me a copy of the report</label>
                                </div>
                                <div class="col-sm-7">
                                    <input type="checkbox" style="margin-top: 12px;" id="chkCopy" />
                                </div>
                            </div>

                            <div class="form-group">
                                <div class="col-sm-5 control-label">
                                    <label for="">Note(optional)</label>
                                </div>
                                <div class="col-sm-7">
                                    <textarea name="" id="emailComment" class="form-control" cols="30" rows="5"></textarea>
                                    <!--<div class="help-block">255 character limit </div>-->
                                </div>
                            </div>


                            <div class="form-group">
                                <div class="col-sm-5 control-label">

                                </div>
                                <div class="col-sm-7">
                                    <button type="submit" class="btn btn-primary btn-block">Send Mail</button>

                                </div>
                            </div>

                        </form>

                    </div>

                </div>

            </div>
        </div>

        <div class="labExModal" id="alertPopUp" style="display: none;  position: absolute; z-index: 12000001; margin: auto; top: 0; left: 0; right: 0; bottom: 0; width: 400px;height:400px;">
            <div class="modal-content">
                <div class="modal-header">
                    <!--<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>-->
                    <h4 class="modal-title">Alert</h4>
                </div>
                <div class="modal-body ">
                    <div class="modal-body" id="messageBody" style="padding:10px;font-size:15px;">

                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" id="labmodalclose" class="btn btn-primary" ng-click="labExModalClose($event)">Close</button>

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

        <div class="labExModal" id="labExEmailSentModalID" style="display: none;  position: absolute; z-index: 12000001; margin: auto; top: 0; left: 0; right: 0; bottom: 0; width: 400px;height:400px;">
            <div class="modal-content">
                <div class="modal-header">

                    <h4 class="modal-title" id="myModalLabel">Email Your Performance Report</h4>
                </div>
                <div class="modal-body ">
                    <div class="modal-body" style="padding:10px;font-size:15px;">
                        Your report has been sent.
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" id="sendNotification" class="btn btn-primary" ng-click="emailNotification($event)">Close</button>

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

        <div class="col-sm-12">
            <div class="pull-left btn-group LabEx-Panel-state-minimized" id="LabExMinimizedId">
                <p class="pull-left" style="color:#fff">LAB Ex ...</p>
                <a href="#" class="btn btn-xs btn-default" style="font-size:15px"><i class="fa fa-minus"></i></a> <a id="maxlab" href="#" class="btn btn-xs btn-default" style="font-size:15px" ng-click="maxLabExPanel($event)"><i id="maxlabicon" class="fa fa-clone"></i></a> <a href="lab-exercises" id="maxclose" ng-click="CloseExercise($event)" class="btn btn-xs btn-default" style="font-size:15px"><i id="maxcloseicon" class="fa fa-close"></i></a>
            </div>
        </div>

        <div class="col-sm-12">

            <div class="container-fluid main-full">
                <div class="row">
                    <div class="panel panel-default" id="questionHtml" style="margin-bottom:0;">
                        <div class="col-xs-12 panel-heading">
                            <div class="col-xs-3" style="padding-left:5px;" id="activityTitle">
                            </div>
                            <div class="col-xs-6 text-primary text-center" id="Title"></div>
                            <div class="text-right col-xs-3" style="padding-right:5px;">
                                Question <strong id="quizNo"></strong> of <span id="totalquiz"></span>
                            </div>
                        </div>
                        <div id="panelbodyDiv" class="panel-body" style="padding:2px;overflow:scroll">
                            <!--<div id="textblock" style="margin: 80px 20px; display block;width:1200px;">
                                <div style="margin: 20px;" ng-repeat="optionbox in LabExerciseModules.OptionBox" droppable="true" class="droppable ui-droppable options" id="blockbox-{{optionbox.BoxName}}">
                                    <div style="position:relative;" ng-bind-html="deliberatelyTrustDangerousSnippet(optionbox.QuizText)"></div>
                                </div>
                            </div>
                            <div align="center" class="dragger">
                                <div class="col-sm-12">
                                    <div style="position: relative;" id="imgdiv">
                                        <div id="imgblock">
                                            <img id="droppable" ng-src="content/images/LE/{{Imagepath}}" alt="" ng-click="onClick()" ondragstart="return false;" imageonload />
                                        </div>

                                        <div ng-show="IsVisible" ng-repeat="optionbox in LabExerciseModules.OptionBox" droppable="true" class="droppable ui-droppable options" id="blockbox-{{optionbox.BoxName}}" ng-style="{'top':{{optionbox.topcoord}}, 'left':{{optionbox.leftcoord}},'position': 'absolute',  'width': '155px', 'height':'30px', 'border':'0px solid #333', 'background': '#E8E8E8' }">{{optionbox.Answervalue}}</div>
                                        <div draggable="true" ng-repeat="ans in DraggedList" droppable="true" class="droppable ui-droppable answerdroppable" id="blockans-{{ans.id}}" draggedattr="{{ans.DraggedAttr}}" ng-style="{'top':{{ans.topcoord}}, 'left':{{ans.leftcoord}},'position': 'absolute',  'width': '158px', 'height':'30px', 'border':'0px solid #333', 'background': 'transparent','font-size': '12px','border-color':'#FF0000','padding-top':'4px','line-height':'1'}">{{ans.Value}}</div>
                                    </div>

                                    <div class="col-sm-12" style=" margin-top: 20px; min-height:100px;" id="divoptions" droppable="true">
                                        <div draggable="true" ng-repeat="option in LabExerciseModules.Options" style="margin-bottom: 5px !important; width: 180px; float: left" class="thumbnail caption col-sm-2 col-lg-3  ui-draggable marginR5 " id="block-{{option.OptionNumber}}">{{option.OptionTitle}}</div>

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

                        <div class="panel-footer">
                            <div class="pull-left">
                            </div>
                            <div class="pull-right">
                                <div class="btn-group pull-left marginR5">
                                    <button class="btn btn-sm btn-primary" style="display:none;" ng-click="SubmitAttempt($event)" id="quizSubmitBtn">Submit</button>
                                    <button class="btn btn-sm btn-primary" style="display:none;" id="reportBtn" ng-click="ReportGen($event)">Report</button>
                                    <button class="btn btn-sm btn-primary" id="saveBtn" ng-click="SaveAnswer($event)">Save</button>
                                    <button class="btn btn-sm btn-primary" id="reviewBtn" ng-click="ReviewAttempt($event)">Review Your Attempt</button>
                                    <button class="btn btn-sm btn-primary" id="resetBtn" ng-click="OnResetClick($event)">Reset</button>
                                </div>
                                <div class="btn-group">
                                    <button id="btnBackward" class="btn btn-sm btn-black" ng-click="prevQuiz($event)"><i class="fa fa-arrow-left"></i></button>
                                    <button id="btnForward" class="btn btn-sm btn-black" ng-click="nextQuiz($event)"><i class="fa fa-arrow-right"></i></button>
                                </div>
                            </div>
                            <div class="clearfix"></div>
                        </div>
                    </div>
                </div>


                <div class="panel panel-default" id="submitResultHtml" style="display:none;">
                    <div class="panel-heading">
                        <div class="row">
                            <div class="col-sm-4 text-left"><strong id="reporttitle"></strong></div>
                            <div class="col-sm-4 text-center">Performance Report</div>
                            <div class="col-sm-4 text-right">Score:<span id="scoreResult"></span>% </div>
                        </div>
                    </div>
                    <div class="panel-body no-padding">
                        <div class="row">
                            <div class="col-sm-12 table-responsive ">
                                <table class="table table-hover table-condensed bg-white" id="questionStatus">
                                    <thead>
                                        <tr class="active">
                                            <th class="text-center">Total Question</th>
                                            <th class="text-center">Correct Answers</th>
                                            <th class="text-center">Incorrect Answers</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr class="text-center">
                                            <td id="tdTotalQuiz"></td>
                                            <td id="tdCorrectAnswer"></td>
                                            <td id="tdinCorrectAnswer"></td>
                                        </tr>
                                    </tbody>
                                </table>

                            </div>
                            <div class="col-sm-12 table-responsive">
                                <table class="table table-hover table-condensed  bg-white">
                                    <thead>
                                        <tr class="active">
                                            <th>Question</th>
                                            <th>Activity Title</th>
                                            <th>Status</th>
                                            <th>Action</th>
                                        </tr>
                                    </thead>
                                    <tbody id="resultLabData"></tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="panel-footer">
                        <div class="text-center">
                            <button class="btn btn-sm btn-primary" id="btnSendMail" ng-click="sendMail($event)">
                                Email
                            </button>

                        </div>
                        <div class="clearfix"></div>
                    </div>

                </div>


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



</div>