<commit_before>
<!DOCTYPE html>
<html>
  <head>
    <!-- Latest compiled and minified CSS 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
    -->
    <link rel="stylesheet" href="/prereqs/bootstrap/dist/css/bootstrap.min.css">

    <!-- Optional theme 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
    -->
    <link rel="stylesheet" href="/prereqs/bootstrap/dist/css/bootstrap-theme.min.css">

    <link rel="stylesheet" type="text/css" href="css/style.css">

    <!--<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>-->

    <!-- <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
    <script data-require="angular.js@1.2.28" data-semver="1.2.28" src="https://code.angularjs.org/1.2.28/angular.js"></script>-->
    <script src="/prereqs/angular/angular.js"></script>
    
    <script src="/directives/iib-widgets.js"></script>

    <!-- Angular UI
    <script src="/prereqs/angular-bootstrap/ui-bootstrap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.12.1/ui-bootstrap-tpls.js"></script>
    -->
    <script src="/prereqs/angular-bootstrap/ui-bootstrap-tpls.js"></script>
    <script src="/prereqs/d3/d3.min.js"></script>
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="/js/integrationBus.js"></script>

  </head>
  <body ng-app="HelloAngular" ng-controller="MainController">
    <nav class="navbar navbar-inverse navbar-fixed-top">
      <div class="container-fluid">
        <div class="navbar-header">          
          <a class="navbar-brand" href="#">My Own Dashboard</a>
        </div>
        <div id="navbar" class="navbar-collapse collapse navbar-form">
        
          <ul class="nav navbar-nav navbar-right">
            <li ng-if="editMode==false"><span class="helper"></span><img ng-click="toggleEdit()" src="images/configure-manage_32.png"/></li>
            <li ng-if="editMode"><img ng-click="toggleEdit()" src="images/success-confirmation_32.png"/></li>
          </ul>          
        </div>
      </div>
    </nav>
    <div class="container-fluid">
      <div class="row">        
        <div class="col-md-3">
          <div class="row">
            <div class="col-md-10">
              <h3>Static specific</h3>
            </div>            
            <div ng-if="editMode" class="col-md-2">
              <img ng-click="editWidget(widget)" src="images/settings-manage_32.png"></img>
            </div>
          </div>
          <div class="row widget-wrapper">
            <div iib-flow-stats iib-simulation="true"  iib-flow-name="Static flow name" iib-mqtt-host="localhost" iib-mqtt-port="4414"></div>          
          </div>
        </div>

        <div class="col-md-3">
          <div class="row">
            <div class="col-md-10">
              <h3>Static generic</h3>
            </div>            
            <div ng-if="editMode" class="col-md-2">
              <img ng-click="editWidget(widget)" src="images/settings-manage_32.png"></img>
            </div>
          </div>
          <div class="row widget-wrapper">
            <div iib-widget iib-widget-type="iib-flow-stats" iib-simulation="true"  iib-attributes="attributesForGeneric"></div>          
          </div>
        </div>

        <div ng-repeat="widget in widgets" class="col-md-3">
          <div class="row">
            <div class="col-md-10">
              <h3>{{widget.attributes.flowName}}</h3>
            </div>            
            <div ng-if="editMode" class="col-md-2">
              <img ng-click="editWidget(widget)" src="images/settings-manage_32.png"></img>
            </div>
          </div>
          <div class="row widget-wrapper">
            <div iib-flow-stats iib-simulation="true"  iib-flow-name="{{widget.attributes.flowName}}" iib-mqtt-host="{{widget.attributes.localhost}}" iib-mqtt-port={{widget.attributes.port}} ></div>          
          </div>
        </div>
        <div ng-if="editMode" class="col-md-2">
          <img ng-click="addWidget()" src="images/add-new_128.png"></img>
        </div>
      </div>
    </div>  
  </body>
  <script>
  var app = angular.module("HelloAngular",['iibWidgets','ui.bootstrap'])//create an application with a dependancy on ngIib 
            .controller("MainController",function($scope,$modal,$http){
              console.log("Using flow tester");

              $scope.attributesForGeneric={
                iibFlowName : "genericFlowName"
              };

              $scope.editMode=false;

              $scope.editWidget=function(currentWidget){
                console.log("edit widget");
                console.dir(currentWidget);
                var modalInstance = $modal.open({
                  templateUrl: 'partials/editWidgetDialog.html',
                  controller: 'EditWidgetController',
                  resolve: {
                    widget: function () {
                      return currentWidget;
                    }
                  }
                });

              };

              $scope.addWidget=function(){

                var modalInstance = $modal.open({
                  
                  templateUrl: 'partials/addWidgetDialog.html',
                  controller: 'AddWidgetController',
                  resolve: {
                    widgets: function () {
                      return $scope.widgets;
                    }
                  }
                });

                modalInstance.result.then(function (selectedItem) {
                  $scope.selected = selectedItem;
                }, function () {
                  console.log('Modal dismissed at: ' + new Date());
                });
              };

              
              $scope.widgets=[
              {
                specId:"iib-flow-stats",
                attributes:{
                  flowName:"MQTTSubscribe",
                  host:"localhost",
                  port:4414
                }
              },
              {
                specId:"iib-flow-stats",
                attributes:{
                  flowName:"TransformationMap",
                  host:"localhost",
                  port:4414
                }
              }

              ];

              $scope.widgets.add = function(specId){
                
              
                this.push({
                  specId:specId,
                  flowName:"MQTTSubscribe",
                  attributes:{
                      host:"localhost",
                      port:4414
                  }
                });
                
              };
              

              $scope.toggleEdit=function(){
                console.log("changing edit mode");
                $scope.editMode=!$scope.editMode;
              }
              $scope.testFlow= function(flowUrl){
                console.log("testing flow");
                $http.post("http://localhost:7800/"+flowUrl)
                  .success(function(data,status,headers,config){
                     console.log("Success");
                  })
                  .error(function(data,status,headers,config){
                     console.log("Error");
                  });
                $http.post("http://localhost:7801/"+flowUrl);
              }
            });

  app.controller('AddWidgetController',function($scope,$modalInstance,widgets,iibWidgetSpec){
    console.log("AddWidgetController");

    $scope.widgets=widgets;
    $scope.installedWidgets=iibWidgetSpec.widgets;
    $scope.selected=$scope.installedWidgets[0];
    

    $scope.ok=function(){
      console.log("selected ");
      console.dir($scope.selected);
      $modalInstance.close();
      $scope.widgets.add("iib-flow-stats");

    };

    $scope.cancel = function () {
      $modalInstance.dismiss('cancel');<commit_msg>add simulation option to user defined dashboard app<commit_after>
<!DOCTYPE html>
<html>
  <head>
    <!-- Latest compiled and minified CSS 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
    -->
    <link rel="stylesheet" href="/prereqs/bootstrap/dist/css/bootstrap.min.css">

    <!-- Optional theme 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
    -->
    <link rel="stylesheet" href="/prereqs/bootstrap/dist/css/bootstrap-theme.min.css">

    <link rel="stylesheet" type="text/css" href="css/style.css">

    <!--<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>-->

    <!-- <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
    <script data-require="angular.js@1.2.28" data-semver="1.2.28" src="https://code.angularjs.org/1.2.28/angular.js"></script>-->
    <script src="/prereqs/angular/angular.js"></script>
    
    <script src="/directives/iib-widgets.js"></script>

    <!-- Angular UI
    <script src="/prereqs/angular-bootstrap/ui-bootstrap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.12.1/ui-bootstrap-tpls.js"></script>
    -->
    <script src="/prereqs/angular-bootstrap/ui-bootstrap-tpls.js"></script>
    <script src="/prereqs/d3/d3.min.js"></script>
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="/js/integrationBus.js"></script>

  </head>
  <body ng-app="HelloAngular" ng-controller="MainController">
    <nav class="navbar navbar-inverse navbar-fixed-top">
      <div class="container-fluid">
        <div class="navbar-header">          
          <a class="navbar-brand" href="#">My Own Dashboard</a>
        </div>
        <div id="navbar" class="navbar-collapse collapse navbar-form">
        
          <ul class="nav navbar-nav navbar-right">
            <li ng-if="editMode==false"><span class="helper"></span><img ng-click="toggleEdit()" src="images/configure-manage_32.png"/></li>
            <li ng-if="editMode"><img ng-click="toggleEdit()" src="images/success-confirmation_32.png"/></li>
          </ul>          
        </div>
      </div>
    </nav>
    <div class="container-fluid">
      <div class="row">        
        
        <div ng-repeat="widget in widgets" class="col-md-3">
          <div class="row">
            <div class="col-md-10">
              <h3>{{widget.attributes.flowName}}</h3>
            </div>            
            <div ng-if="editMode" class="col-md-2">
              <img ng-click="editWidget(widget)" src="images/settings-manage_32.png"></img>
            </div>
          </div>
          <div class="row widget-wrapper">
            <div iib-flow-stats iib-simulation="true"  iib-flow-name="{{widget.attributes.flowName}}" iib-mqtt-host="{{widget.attributes.localhost}}" iib-mqtt-port={{widget.attributes.port}} ></div>          
          </div>
        </div>
        <div ng-if="editMode" class="col-md-2">
          <img ng-click="addWidget()" src="images/add-new_128.png"></img>
        </div>
      </div>
    </div>  
  </body>
  <script>
  function getQueryVariable(variable)
  {
       var query = window.location.search.substring(1);
       var vars = query.split("&");
       for (var i=0;i<vars.length;i++) {
               var pair = vars[i].split("=");
               if(pair[0] == variable){return pair[1];}
       }
       return(false);
  }
  var app = angular.module("HelloAngular",['iibWidgets','ui.bootstrap'])//create an application with a dependancy on ngIib 
            .controller("MainController",function($scope,$modal,$http){
              console.log("Using flow tester");

              $scope.attributesForGeneric={
                iibFlowName : "genericFlowName"
              };

              $scope.editMode=false;

              $scope.editWidget=function(currentWidget){
                console.log("edit widget");
                console.dir(currentWidget);
                var modalInstance = $modal.open({
                  templateUrl: 'partials/editWidgetDialog.html',
                  controller: 'EditWidgetController',
                  resolve: {
                    widget: function () {
                      return currentWidget;
                    }
                  }
                });

              };

              $scope.addWidget=function(){

                var modalInstance = $modal.open({
                  
                  templateUrl: 'partials/addWidgetDialog.html',
                  controller: 'AddWidgetController',
                  resolve: {
                    widgets: function () {
                      return $scope.widgets;
                    }
                  }
                });

                modalInstance.result.then(function (selectedItem) {
                  $scope.selected = selectedItem;
                }, function () {
                  console.log('Modal dismissed at: ' + new Date());
                });
              };

              
              $scope.widgets=[
              ];

              $scope.widgets.add = function(specId){
                
              
                this.push({
                  specId:specId,
                  flowName:"MQTTSubscribe",
                  attributes:{
                      host:"localhost",
                      port:4414
                  }
                });
                
              };
              

              $scope.toggleEdit=function(){
                console.log("changing edit mode");
                $scope.editMode=!$scope.editMode;
              }
              $scope.testFlow= function(flowUrl){
                console.log("testing flow");
                $http.post("http://localhost:7800/"+flowUrl)
                  .success(function(data,status,headers,config){
                     console.log("Success");
                  })
                  .error(function(data,status,headers,config){
                     console.log("Error");
                  });
                $http.post("http://localhost:7801/"+flowUrl);
              }
            });

  app.config(function(iibIntegrationBusProvider){
    if(getQueryVariable("simulation")=="true"){
      iibIntegrationBusProvider.simulate(true);
    }      
  });
  
  app.controller('AddWidgetController',function($scope,$modalInstance,widgets,iibWidgetSpec){
    console.log("AddWidgetController");

    $scope.widgets=widgets;
    $scope.installedWidgets=iibWidgetSpec.widgets;
    $scope.selected=$scope.installedWidgets[0];
    

    $scope.ok=function(){
      console.log("selected ");
      console.dir($scope.selected);
      $modalInstance.close();
      $scope.widgets.add("iib-flow-stats");

    };

    $scope.cancel = function () {
      $modalInstance.dismiss('cancel');
{'fraction_non_alphanumeric': 0.15755366545159985, 'fraction_numerical': 0.010935601458080195, 'mean_word_length': 1.6995262390670554, 'pattern_counts': {'":': 0, '<': 202, '<?xml version=': 0, '>': 201, 'https://': 10, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4473621', 'n_tokens_mistral': 4377, 'n_tokens_neox': 4081, 'n_words': 562}