Skip to main content

Get Google Calendar Event List in WordPress

<a href="https://console.cloud.google.com/apis/credentials">Get Your Api Credentials Here</a> <a href="https://calendar.google.com/calendar">Get your Calender ID</a> <?php include_once("wp-load.php"); function  get_calender_events() { $params = array(); /*Get current date*/ $current_date  = date('Y-m-d H:i:s'); /*Convert it to google calendar's rfc_format */ $rfc_format = date("c", strtotime($current_date)); $params[] = 'orderBy=startTime'; $params[] ='maxResults=100'; $params[] = 'timeMin='.urlencode($rfc_format); $url_param = ''; foreach($params as $param) { $url_param.= '&'.$param; } $calender_id = "calender_id"; $client_key =  "client_key"; $url = "https://www.googleapis.com/calendar/v3/calendars/".$calender_id."/events?key=".$client_key."&singleEvents=true".$url_param; $list_events = wp_remote_post($url, ...
Post a Comment

Date Picker With Event Show in Angular JS

 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular-animate.js"></script>
    <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-1.1.2.js"></script>
    <script>
var myApp= angular.module('ui.bootstrap.demo', ['ngAnimate', 'ui.bootstrap', 'ui.bootstrap.dateparser', 'ui.bootstrap.datepicker']);



            myApp.controller('DatepickerDemoCtrl', function($scope, $http) {


$scope.minDate = new Date();

var afterOneYear=new Date($scope.minDate.getFullYear() + 1, $scope.minDate.getMonth(), $scope.minDate.getDate());
$scope.maxDate=new Date(afterOneYear);



            $scope.today = function() {
                $scope.dt = new Date();

              };

 $scope.endDate = function() {
                $scope.end = new Date();
              };



              $scope.clear = function() {
                $scope.dt = null;
$scope.end =null;

              };
 
$scope.clearEnd = function() {
               
$scope.end =null;

              };

              $scope.inlineOptions = {
                minDate: new Date(),
                showWeeks: true
              };


              $scope.dateOptions = {
                  formatYear: 'yy',
                  startingDay:1
                };




                // Disable weekend selection
                function disabledasda(data) {
                  var date = data.date,
                    mode = data.mode;
                  return mode === 'day' && (date.getDay() === 0 || date.getDay() === 6);
                }


              $scope.open1 = function() {
$scope.minDate =new Date();
                $scope.popup1.opened = true;
$scope.end=null;

$scope.setMaxDate1(new Date(new Date(afterOneYear)))

//if(!$scope.dt){$scope.setMaxDate1(new Date(new Date(afterOneYear)))}


              };


  $scope.open2 = function() {
if(!$scope.dt){alert("Please select Start Date first");return;}
$scope.end=$scope.dt;
                $scope.popup2.opened = true;
$scope.minDate = $scope.dt;

              };



              $scope.setDate = function(year, month, day) {
                $scope.dt = new Date(year, month, day);
              };

  $scope.setMaxDate = function(year, month, day) {
                $scope.maxDate = new Date(year, month, day);

              };

 $scope.setMaxDate1 = function(maxDate1) {
          $scope.setMaxDate(maxDate1.getFullYear(),maxDate1.getMonth(),maxDate1.getDate());
              };




              $scope.formats = ['dd-MMMM-yyyy', 'yyyy/MM/dd', 'dd.MM.yyyy', 'shortDate'];
              $scope.format = $scope.formats[0];
              $scope.altInputFormats = ['M!/d!/yyyy'];

              $scope.popup1 = {
                opened: false
              };

 $scope.popup2 = {
                opened: false
              };

               var today = new Date();

             
//var adate=[new Date(today.getFullYear(),today.getMonth(),27),new Date(today.getFullYear(),today.getMonth(),28//)];

//adate.push(new Date('2016-09-11'));

                //$scope.holidays =angular.copy(adate);

//$scope.appointments=angular.copy(adate);

$scope.holidays = [
                  new Date(today.getFullYear(),today.getMonth(),27),
   new Date(today.getFullYear(),today.getMonth(),2),
                  new Date(today.getFullYear(),today.getMonth(),3),
                  new Date(today.getFullYear(),today.getMonth(),4),
   new Date(today.getFullYear(),today.getMonth(),7),
                  new Date(today.getFullYear(),today.getMonth(),8),
                  new Date(today.getFullYear(),today.getMonth(),11),
   new Date(today.getFullYear(),today.getMonth(),2),
                  new Date(today.getFullYear(),today.getMonth(),13),
                  new Date(today.getFullYear(),today.getMonth(),4),
   new Date(today.getFullYear(),today.getMonth(),16),
                  new Date(today.getFullYear(),today.getMonth(),3),
                  new Date(today.getFullYear(),today.getMonth(),4),
                  new Date(today.getFullYear(),today.getMonth(),28),
                  new Date(today.getFullYear(),today.getMonth(),29),
 new Date('2016-10-10'),
 new Date('2016-09-21'),  new Date('2017-05-21'),
 new Date('2016-10-20')

]
             



              $scope.appointments = [
     new Date(today.getFullYear(),today.getMonth(),2),
                  new Date(today.getFullYear(),today.getMonth(),3),
                  new Date(today.getFullYear(),today.getMonth(),4),
   new Date(today.getFullYear(),today.getMonth(),5),
                  new Date(today.getFullYear(),today.getMonth(),6),
                  new Date(today.getFullYear(),today.getMonth(),4),
   new Date(today.getFullYear(),today.getMonth(),2),
                  new Date(today.getFullYear(),today.getMonth(),3),
                  new Date(today.getFullYear(),today.getMonth(),4),
   new Date(today.getFullYear(),today.getMonth(),11),
                  new Date(today.getFullYear(),today.getMonth(),16),
                  new Date(today.getFullYear(),today.getMonth(),13),
 new Date(today.getFullYear(),today.getMonth(),27),
                  new Date(today.getFullYear(),today.getMonth(),28),
                  new Date(today.getFullYear(),today.getMonth(),29),
 new Date('2016-09-21'),
 new Date('2016-10-10'),
  new Date('2017-05-21'),
  new Date('2016-10-20')
              ];

$scope.disabled = function(date, mode){
             
                var isHoliday = false;
                for(var i = 0; i < $scope.holidays.length ; i++) {
                  if(areDatesEqual($scope.holidays[i], date)){
                    isHoliday = true;
                  }
                }

                return ( mode === 'day' && isHoliday );
              };

              function areDatesEqual(date1, date2) {

                return date1.setHours(0,0,0,0) === date2.setHours(0,0,0,0)

              }


$scope.events=[{status:'partially'},{status:'green'},{status:'full'},{status:'lightgreen'}];

           $scope.dayClass = function(date, mode) {

            if (mode === 'day') {

              var dateToCheck = new Date(date);

              for(var i = 0; i < $scope.appointments.length ; i++) {
                if(areDatesEqual($scope.appointments[i], dateToCheck)){

if($scope.appointments[i].getTime()<today.getTime()){return $scope.events[0].status;}
else { return $scope.events[2].status;}
               
                }
              }

if(dateToCheck.getTime()<new Date().getTime()-86400000){return $scope.events[3].status;}

else return $scope.events[1].status ;

            }

return '';
           
          };

       
$scope.dateSelected = function(){


    var dateSelected = new Date($scope.dt);

//$scope.end=dateSelected;



    for(var i = 0; i < $scope.appointments.length ; i++) {
      //if(areDatesEqual($scope.appointments[i], dateSelected)){

 if(dateSelected.getTime()<$scope.appointments[i].getTime()){

 $scope.setMaxDate1($scope.appointments[i]);
 $scope.open2();
 break;

}
 
      }
    }



   $scope.fun = function() {
         //alert("hello");
      }

 });



</script>

    <link href="//netdna.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
 
  </head>
  <body ng-app="ui.bootstrap.demo" >
    <style>

.green button {
     background-color: #8BC34A;
        color: #FFF;
     }

 .lightgreen button {
        background-color: #9E9E9E;
        color: #FFF;
      }

      .full button  {
        background-color:#ef1202;
        color: #FFF;
      }
      .partially button {
        background-color:#ef938d;
        color: #FFF;;
      }

 .text-info {
color: #FFF;
}



    </style>

      <!--.appointment>button {
        color: white;
font-weight: bold;
        background-color:blue;


.btn-default.active{
    color: #171616;
    background-color: #2196F3;
    border-color: #000000;
}
      }-->







<div ng-controller="DatepickerDemoCtrl">
      <pre>Selected date is: <em>{{dt | date:'fullDate' }}</em></pre>

      <h4>Popup</h4><br><br><br><br><br>
      <div class="row">
        <div class="col-md-6">
          <p class="input-group">
            <input type="text" id="startDate"  class="form-control"  uib-datepicker-popup="{{format}}" ng-model="dt"
ng-change="dateSelected()"is-open="popup1.opened"  min-date="minDate" max-date="maxDate" uib-datepicker-popup placement="right"
datepicker-options="dateOptions" ng-required="true" close-text="Close" alt-input-formats="altInputFormats"  date-disabled="disabled(date, mode)" custom-class="dayClass(date, mode)" />
            <span class="input-group-btn">
              <button type="button" class="btn btn-default" ng-click="open1()"><i class="glyphicon glyphicon-calendar"></i></button>


            </span>
          </p>
        </div>
      </div>



      <pre>Selected date is: <em>{{dt | date:'fullDate' }}</em></pre>

      <h4>Popup</h4><br><br><br><br><br>
      <div class="row">
        <div class="col-md-6">
          <p class="input-group">

            <input type="text" name="endDate" class="form-control"  uib-datepicker-popup="{{format}}" ng-model="end"
is-open="popup2.opened" min-date="minDate" uib-datepicker-popup placement="right" ng-focus="fun()"
max-date="maxDate" datepicker-options="dateOptions" ng-required="true" close-text="Close" alt-input-formats="altInputFormats" date-disabled="disabled(date, mode)" custom-class="dayClass(date, mode)" />
            <span class="input-group-btn">
              <button type="button" class="btn btn-default"  ng-click="open2()" ><i class="glyphicon glyphicon-calendar"></i></button>


            </span>
          </p>
        </div>
      </div>
    </div>

Comments

Post a Comment

Popular posts from this blog

Create Signature pad with save on database in php

Create Signature pad with save on database in php 1.create a folder images index.php ============   <!DOCTYPE >     <head>     <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />     <title>Signature Pad</title>     <script type="text/javascript" src="jquery-1.8.0.min.js"></script>     <script type="text/javascript"> $(document).ready(function () {     /** Set Canvas Size **/     var canvasWidth = 400;     var canvasHeight = 100;     /** IE SUPPORT **/     var canvasDiv = document.getElementById('signaturePad');     canvas = document.createElement('canvas');     canvas.setAttribute('width', canvasWidth);     canvas.setAttribute('height', canvasHeight);     canvas.setAttribute('id', 'canvas');     canvasDiv.appendChild(canvas);    ...
28 comments
Read more

Get Google Calendar Event List in WordPress

<a href="https://console.cloud.google.com/apis/credentials">Get Your Api Credentials Here</a> <a href="https://calendar.google.com/calendar">Get your Calender ID</a> <?php include_once("wp-load.php"); function  get_calender_events() { $params = array(); /*Get current date*/ $current_date  = date('Y-m-d H:i:s'); /*Convert it to google calendar's rfc_format */ $rfc_format = date("c", strtotime($current_date)); $params[] = 'orderBy=startTime'; $params[] ='maxResults=100'; $params[] = 'timeMin='.urlencode($rfc_format); $url_param = ''; foreach($params as $param) { $url_param.= '&'.$param; } $calender_id = "calender_id"; $client_key =  "client_key"; $url = "https://www.googleapis.com/calendar/v3/calendars/".$calender_id."/events?key=".$client_key."&singleEvents=true".$url_param; $list_events = wp_remote_post($url, ...
Post a Comment
Read more

WooCommerce Mini cart With Ajax

WooCommerce Mini cart //MINI CART SECTION   <div class="productdiv rightcart">                                                         <?php if ( ! WC()->cart->is_empty() ) : ?>     <ul class="woocommerce-mini-cart cart_list product_list_widget <?php echo esc_attr( $args['list_class'] ); ?>">         <?php             do_action( 'woocommerce_before_mini_cart_contents' );             foreach ( WC()->cart->get_cart() as $cart_item_key => $cart_item ) {                 $_product     = apply_filters( 'woocommerce_cart_item_pro...
Post a Comment
Read more