<commit_before>﻿
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <title></title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width">
  <link rel="stylesheet" href="styles/bootstrap.css">
  <link rel="stylesheet" href="styles/style.css" />
  <link rel="stylesheet" href="../dist/angular-datepicker.css" />
</head>
<body ng-app="sample">
  <div class="row-fluid" ng-controller="DemoController">
    <div class="span4">
      <div>
        <h2>Timezones</h2>

        <div ng-repeat="timezone in timezones">

          <h4>{{timezone[0]}}</h4>

          <div date-picker="dates.today" timezone="{{timezone[1]}}" view="hours" min-view="hours" watch-direct-changes="true"></div>

          <hr />

        </div>

        <h4>No timezone (Uses local)</h4>

        <div date-picker="dates.today" view="hours" min-view="hours" watch-direct-changes="true"></div>

      </div>
      <hr />

      <h2>Custom formats</h2>
      <div ng-repeat="format in formats">
        <h5>{{format}}</h5>
        <input type="text" date-time ng-model="dates.today" view="hours" format="{{format}}">
      </div>

    </div>
    <div class="span4">
      <h2>Minimum / Maximum dates</h2>

      <div>
        <h4>Always open div (date-picker directive)</h4>

        <div>
          <h5>Minimum</h5>
          <div date-picker="dates.today" id="pickerMinDateDiv" min-date="minDate" view="date" min-view="hours" timezone="UTC" watch-direct-changes="true"></div>
        </div>

        <div>
          <h5>Maximum</h5>
          <div date-picker="dates.today" id="pickerMaxDateDiv" max-date="maxDate" view="date" min-view="hours" timezone="UTC" watch-direct-changes="true"></div>
        </div>

        <div>
          <h5>Minimum + maximum</h5>
          <div date-picker="dates.today" id="pickerBothDatesDiv" min-date="minDate" max-date="maxDate" view="date" min-view="hours" timezone="UTC" watch-direct-changes="true"></div>
        </div>
      </div>

      <div>
        <h4>Input with popup (date-time directive)</h4>

	  	<form name="demoForm">
			<div>
			  <h5>Min ({{demoForm.pickerMinDate.$error.min ? 'Min: invalid' : 'Min: valid'}})</h5>				
				<input date-time name="pickerMinDate" ng-model="dates.today" id="pickerMinDate" min-date="minDate" view="date" min-view="hours" timezone="UTC" format="lll">
			</div>

			<div>
			  <h5>Max ({{demoForm.pickerMaxDate.$error.max ? 'Max: invalid' : 'Max: valid'}})</h5>
				<input date-time name="pickerMaxDate" ng-model="dates.today" id="pickerMaxDate" max-date="maxDate" view="date" min-view="hours" timezone="UTC" format="lll">
			</div>

			<div>
			  <h5>Min + max ({{demoForm.pickerBothDates.$error.min ? 'Min: invalid, ' : 'Min: valid, '}} {{demoForm.pickerBothDates.$error.max ? 'max: invalid' : 'max: valid'}})</h5>
				<input date-time name="pickerBothDates" ng-model="dates.today" id="pickerBothDates" min-date="minDate" max-date="maxDate" view="date" min-view="hours" timezone="UTC" format="lll">
			</div>
		</form>
      </div>

      <div>
        <h2>Range</h2>

        <div date-range id="pickerRange" start="dates.minDate" end="dates.maxDate" date-change="changeDate" view="date" min-view="date" timezone="UTC"></div>

      </div>

    </div>
    <div class="span4">
      <h2>Update events</h2>
      <div>
        <h4>Minimum date</h4>
        <input date-time ng-model="dates.minDate" id="pickerMinSelector" date-change="changeMinMax" max-date="maxDate" view="date" timezone="UTC" format="lll">
      </div>
      <div>
        <h4>Maximum date</h4>
        <input date-time ng-model="dates.maxDate" id="pickerMaxSelector" date-change="changeMinMax" min-date="minDate" view="date" timezone="UTC" format="lll">
      </div>

      <div>
        <h4>Default view</h4>

        <select ng-change="changeData('view')"
                ng-options="view for view in views"
                ng-model="options.view"></select>
      </div>

      <div>
        <h4>Min view</h4>

        <select ng-change="changeData('minView')"
                ng-options="view for view in views"
                ng-model="options.minView">
          <option value="">Disabled</option>
        </select>
      </div>

      <div>
        <h4>Max view</h4>

        <select ng-change="changeData('maxView')"
                ng-options="view for view in views"
                ng-model="options.maxView">
          <option value="">Disabled</option>
        </select>
      </div>

      <div>
        <h4>Format</h4>

        <select ng-change="changeData('format')"
                ng-options="format for format in formats"
                ng-model="options.format">
          <option value="">Disabled</option>
        </select>
      </div>

      <h2>Callback</h2>
      <div>
        <h4>Select a date from either picker</h4>
        <div ng-bind="callbackState"></div>
        <button ng-click="callbackState = 'Callback: Not fired'">Reset state</button>
      </div>
      <input type="text" date-time ng-model="dates.today"  view="hours" date-change="changeDate">
      <div date-picker="dates.today" view="date" date-change="changeDate" timezone="UTC" watch-direct-changes="true"></div>
    </div>
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.4.1/moment-timezone-with-data.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.6.0/ui-bootstrap-tpls.min.js"></script>
  <script src="scripts/datePicker.js"></script>
  <script src="scripts/datePickerUtils.js"></script>
  <script src="scripts/dateRange.js"></script>
  <script src="scripts/input.js"></script>
  <script>
    var demoApp = angular.module('sample', ['datePicker', 'ui.bootstrap']);
    demoApp.controller('DemoController', function ($scope) {
      $scope.dates = {
        today: moment.tz('UTC').hour(12).startOf('h'), //12:00 UTC, today.
        minDate: moment.tz('UTC').add(-4, 'd').hour(12).startOf('h'), //12:00 UTC, four days ago.
        maxDate: moment.tz('UTC').add(4, 'd').hour(12).startOf('h'), //12:00 UTC, in four days.
      };

      $scope.options = {
        view: 'date',
        format: 'lll',
        maxView: false,
        minView: 'hours',
      };

      $scope.minDate = $scope.dates.minDate;
      $scope.maxDate = $scope.dates.maxDate;

      $scope.formats = [
         "MMMM YYYY",
         "DD MMM YYYY",
         "ddd MMM DD YYYY",
         "D MMM YYYY HH:mm",
         "lll",
      ];

      $scope.timezones = [
        ['London, UK', 'Europe/London'],<commit_msg>Updating demo to show new functionality.<commit_after>﻿
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <title></title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width">
  <link rel="stylesheet" href="styles/bootstrap.css">
  <link rel="stylesheet" href="styles/style.css" />
  <link rel="stylesheet" href="../dist/angular-datepicker.css" />
</head>
<body ng-app="sample">
  <div class="row-fluid" ng-controller="DemoController">
    <div class="span4">
      <div>
        <h2>Timezones</h2>

        <div ng-repeat="timezone in timezones">

          <h4>{{timezone[0]}}</h4>

          <div date-picker="dates.today" timezone="{{timezone[1]}}" view="hours" min-view="hours" watch-direct-changes="true"></div>

          <hr />

        </div>

        <h4>No timezone (Uses local)</h4>

        <div date-picker="dates.today" view="hours" min-view="hours" watch-direct-changes="true"></div>

      </div>
      <hr />

      <h2>Custom formats</h2>
      <div ng-repeat="format in formats">
        <h5>{{format}}</h5>
        <input type="text" date-time ng-model="dates.today" view="hours" format="{{format}}">
      </div>
      <hr />
	  
      <h2>First day</h2>
      <div ng-repeat="weekDay in weekDays">
        <h5>First Day: {{weekDay[0]}}</h5>
	  	<div date-picker="dates.today" view="date" first-day="{{weekDay[1]}}" watch-direct-changes="true"></div>
	  </div>
    </div>
    <div class="span4">
      <h2>Minimum / Maximum dates</h2>

      <div>
        <h4>Always open div (date-picker directive)</h4>

        <div>
          <h5>Minimum</h5>
          <div date-picker="dates.today" id="pickerMinDateDiv" min-date="minDate" view="date" min-view="hours" timezone="UTC" watch-direct-changes="true"></div>
        </div>

        <div>
          <h5>Maximum</h5>
          <div date-picker="dates.today" id="pickerMaxDateDiv" max-date="maxDate" view="date" min-view="hours" timezone="UTC" watch-direct-changes="true"></div>
        </div>

        <div>
          <h5>Minimum + maximum</h5>
          <div date-picker="dates.today" id="pickerBothDatesDiv" min-date="minDate" max-date="maxDate" view="date" min-view="hours" timezone="UTC" watch-direct-changes="true"></div>
        </div>
      </div>

      <div>
        <h4>Input with popup (date-time directive)</h4>

	  	<form name="demoForm">
			<div>
			  <h5>Min ({{demoForm.pickerMinDate.$error.min ? 'Min: invalid' : 'Min: valid'}})</h5>				
				<input date-time name="pickerMinDate" ng-model="dates.today" id="pickerMinDate" min-date="minDate" view="date" min-view="hours" timezone="UTC" format="lll">
			</div>

			<div>
			  <h5>Max ({{demoForm.pickerMaxDate.$error.max ? 'Max: invalid' : 'Max: valid'}})</h5>
				<input date-time name="pickerMaxDate" ng-model="dates.today" id="pickerMaxDate" max-date="maxDate" view="date" min-view="hours" timezone="UTC" format="lll">
			</div>

			<div>
			  <h5>Min + max ({{demoForm.pickerBothDates.$error.min ? 'Min: invalid, ' : 'Min: valid, '}} {{demoForm.pickerBothDates.$error.max ? 'max: invalid' : 'max: valid'}})</h5>
				<input date-time name="pickerBothDates" ng-model="dates.today" id="pickerBothDates" min-date="minDate" max-date="maxDate" view="date" min-view="hours" timezone="UTC" format="lll">
			</div>
		</form>
      </div>

      <div>
        <h2>Range</h2>

        <div date-range id="pickerRange" start="dates.minDate" end="dates.maxDate" date-change="changeDate" view="date" min-view="date" timezone="UTC"></div>

      </div>

    </div>
    <div class="span4">
      <h2>Update events</h2>
      <div>
        <h4>Minimum date</h4>
        <input date-time ng-model="dates.minDate" id="pickerMinSelector" date-change="changeMinMax" max-date="maxDate" view="date" timezone="UTC" format="lll">
      </div>
      <div>
        <h4>Maximum date</h4>
        <input date-time ng-model="dates.maxDate" id="pickerMaxSelector" date-change="changeMinMax" min-date="minDate" view="date" timezone="UTC" format="lll">
      </div>

      <div>
        <h4>Default view</h4>

        <select ng-change="changeData('view')"
                ng-options="view for view in views"
                ng-model="options.view"></select>
      </div>

      <div>
        <h4>Min view</h4>

        <select ng-change="changeData('minView')"
                ng-options="view for view in views"
                ng-model="options.minView">
          <option value="">Disabled</option>
        </select>
      </div>

      <div>
        <h4>Max view</h4>

        <select ng-change="changeData('maxView')"
                ng-options="view for view in views"
                ng-model="options.maxView">
          <option value="">Disabled</option>
        </select>
      </div>

      <div>
        <h4>Format</h4>

        <select ng-change="changeData('format')"
                ng-options="format for format in formats"
                ng-model="options.format">
          <option value="">Disabled</option>
        </select>
      </div>

      <h2>Callback</h2>
      <div>
        <h4>Select a date from either picker</h4>
        <div ng-bind="callbackState"></div>
        <button ng-click="callbackState = 'Callback: Not fired'">Reset state</button>
      </div>
      <input type="text" date-time ng-model="dates.today"  view="hours" date-change="changeDate">
      <div date-picker="dates.today" view="date" date-change="changeDate" timezone="UTC" watch-direct-changes="true"></div>
    </div>
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.4.1/moment-timezone-with-data.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.6.0/ui-bootstrap-tpls.min.js"></script>
  <script src="scripts/datePicker.js"></script>
  <script src="scripts/datePickerUtils.js"></script>
  <script src="scripts/dateRange.js"></script>
  <script src="scripts/input.js"></script>
  <script>
    var demoApp = angular.module('sample', ['datePicker', 'ui.bootstrap']);
    demoApp.controller('DemoController', function ($scope) {
      $scope.dates = {
        today: moment.tz('UTC').hour(12).startOf('h'), //12:00 UTC, today.
        minDate: moment.tz('UTC').add(-4, 'd').hour(12).startOf('h'), //12:00 UTC, four days ago.
        maxDate: moment.tz('UTC').add(4, 'd').hour(12).startOf('h'), //12:00 UTC, in four days.
      };

      $scope.options = {
        view: 'date',
        format: 'lll',
        maxView: false,
        minView: 'hours',
      };

      $scope.minDate = $scope.dates.minDate;
      $scope.maxDate = $scope.dates.maxDate;

      $scope.formats = [
         "MMMM YYYY",
         "DD MMM YYYY",
         "ddd MMM DD YYYY",
         "D MMM YYYY HH:mm",
         "lll",
      ];

      $scope.weekDays = [
        ['Sunday', 0],
        ['Monday', 1],
        ['Tuesday', 2],
        ['Wednesday', 3],
        ['Thursday', 4],
        ['Friday', 5],
        ['Saturday', 6],
      ];

      $scope.timezones = [
        ['London, UK', 'Europe/London'],
{'fraction_non_alphanumeric': 0.19448992667473483, 'fraction_numerical': 0.013597209368548444, 'mean_word_length': 2.779391982781813, 'pattern_counts': {'":': 0, '<': 348, '<?xml version=': 0, '>': 348, 'https://': 8, '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': '2303052', 'n_tokens_mistral': 5071, 'n_tokens_neox': 4730, 'n_words': 839}