<?xml version="1.0" encoding="UTF-8" ?>
<Module>
    <ModulePrefs title="Publisher" description="Publisher">
        <Require feature="pubsub-2"/>
        <Require feature="dynamic-height"/>
        <Require feature="setprefs"/>
    </ModulePrefs>
    <UserPref name="role" display_name="Gadet Role" required="true" />
    <Content type="html">
        <![CDATA[
        <head>

          <!-- Custom Theme -->
          <link rel="stylesheet" type="text/css" href="/portal/libs/bootstrap_3.3.5/css/bootstrap.min.css" />
          <link rel="stylesheet" type="text/css" href="/portal/libs/font-wso2_1.0.0/css/font-wso2.min.css" />
          <link rel="stylesheet" type="text/css" href="/portal/libs/theme-wso2_1.0/css/theme-wso2.css" />
          <link rel="stylesheet" type="text/css" href="../IsAnalytics_Gadget_Commons/css/gadget.css" />
          <link rel="stylesheet" type="text/css" href="css/custom.css" />

          <!-- jQuery -->
          <script src="../IsAnalytics_Gadget_Commons/js/jquery-1.10.2.js"></script>
          <script src="../IsAnalytics_Gadget_Commons/js/moment.min.js"></script>
          <script src="../IsAnalytics_Gadget_Commons/js/gadget-utils.js"></script>

          <!-- Include VizGrammar -->
          <script src="../IsAnalytics_Gadget_Commons/js/d3.min.js"></script>
          <script src="../IsAnalytics_Gadget_Commons/js/vega.js"></script>
          <script src="../IsAnalytics_Gadget_Commons/js/VizGrammar.min.js"></script>

          <!-- Custom -->
          <script src="js/gadgetconf.js"></script>
          <script src="js/main.js"></script>

        </head>
        <body>

            <div class="row no-gutter add-padding-5x">
                <div class="col-6">
                    <span class="fw fw-stack" id="back" data-toggle="tooltip" title="Previous Time Range">
                        <i class="fw fw-left-arrow fw-stack-1x"></i>
                        <i class="fw fw-circle-outline fw-stack-2x"></i>
                    </span>
                    <div id="canvas" style="height:80%;"></div>
                </div>
                <div class="col-2 stats-total add-padding-left-3x add-padding-right-3x">
                    <h4 style="text-align: center;">TOTAL LOGIN ATTEMPTS<span id="title"></span></h4>
                    <h1 id="totalCount" style="text-align: center;"></h1>
                    <div id="successPercent"></div>
                    <div id="failedPercent"></div>
                    <div id="donutDiv" style="text-align: center;"></div>
                </div>
                <div class="col-4 stats-total">
                    <div class="pull-right clearfix">
                        <div class="pull-left arc-chart">
                            <div id="mapSuccessDiv"></div>
                            <div id="mapFailDiv"></div>
                            <div class="text-center">
                                <label>Success</label>
                                <label class="switch">
                                    <input type="checkbox" id="chkMap" onclick="checkMapType()" checked="checked">
                                    <span class="helper"></span>
                                </label>
                                <label>Failure</label>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </body>
        ]]>
    </Content>
</Module>