Code Monkey home page Code Monkey logo

jquery.filthypillow's Introduction

jquery.filthypillow's People

Contributors

aef- avatar marcosbasualdo avatar serpentblade avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

jquery.filthypillow's Issues

Moment 2.8 add() / subtract() depreciations.

There are a few spots that are depreciated with the new momentjs lib:

--- a/vendor/assets/javascripts/jquery/jquery.filthypillow.js
+++ b/vendor/assets/javascripts/jquery/jquery.filthypillow.js
@@ -527,25 +527,25 @@
   };

   Calendar.prototype.toggleMonthArrows = function( ) {
-    if( this.isInMinRange( this.date.clone( ).subtract( 'months', 1 ).endOf( "month" ) ) )
+    if( this.isInMinRange( this.date.clone( ).subtract( 1, 'months' ).endOf( "month" ) ) )
       this.$left.show( );
     else
       this.$left.hide( );

-    if( this.isInMaxRange( this.date.clone( ).add( 'months', 1 ).date( 1 ) ) )
+    if( this.isInMaxRange( this.date.clone( ).add( 1, 'months' ).date( 1 ) ) )
       this.$right.show( );
     else
       this.$right.hide( );
   };

   Calendar.prototype.nextMonth = function( ) {
-    this.date.add( "month", 1 );
+    this.date.add( 1, 'month' );
     this.selectDate( this.date.get( "year" ), this.date.get( "month" ), this.date.get( "date" ) );
     this.render( );
   };

   Calendar.prototype.prevMonth = function( ) {
-    this.date.subtract( "month", 1 );
+    this.date.subtract( 1, 'month' );
     this.selectDate( this.date.get( "year" ), this.date.get( "month" ), this.date.get( "date" ) );
     this.render( );
   };
@@ -560,7 +560,7 @@
     var $target = $( e.target ),
         addMonths = $target.attr( "data-add-month" );

-    this.date.add( "months", addMonths );
+    this.date.add( addMonths, 'months' );

     this.selectDate( this.date.get( "year" ), this.date.get( "month" ), $target.attr( "data-date" ), { activeDateClicked: !addMonths } );
   };
@@ -608,7 +608,7 @@
       $this = $( this );

       if( $this.attr( "data-add-month" ) )
-        dateTmp.add( "months", $this.attr( "data-add-month" ) );
+        dateTmp.add( $this.attr( "data-add-month" ), 'months' );

       dateTmp.date( $( this ).attr( "data-date" ) );
       return !( self.isInMinRange( dateTmp ) && self.isInMaxRange( dateTmp ) );
@@ -627,7 +627,7 @@
   Calendar.prototype.buildDates = function( ) {
     var days = this.date.daysInMonth( ),
         dateCalc = this.date.clone( ),
-        lastDayOfPrevMonth = this.date.clone( ).subtract( 'months', 1 ).endOf( "month" ).date( ),
+        lastDayOfPrevMonth = this.date.clone( ).subtract( 1, 'months' ).endOf( "month" ).date( ),
         $week = this.$weekTemplate.clone( ),
         firstWeekDay = dateCalc.date( 1 ).weekday( ),
         lastWeekDay = dateCalc.date( days ).weekday( ),

Show DatePicker Calendar Inline instead of as a popup DIV

I am currently searching for just the right Date Selector/Picker library for a Project Management application. I will have Project Tasks shown in a popup Modal window when clicked on and in this module I will need to populate the contents of the modal with the Task record details whenever a Task is clicked on in a list of Tasks.

In my Task Modal will be a few Date input fields that will show up as text like this MM/DD/YYYY and when a user clicks on a date, it will need to reveal an inline Date Picker calendar with the date value selected from that Task record. A user can then select any date just as a typical popup date picker works except it will be shown inline instead of as a popup.

After user selects a new date value, it will send an AJAX POST to save the new Date value for that particular task.

This library called X-Editable has support for making a Date Picker edit-inplace and save to a backend script however it only works with jQueryUI and Bootstrap DatePickers.

For that reason I am trying to find and implement the functionality I described above into other more lightweight Date Picker libraries.

FilthyPillow looks like it could be a nice starting point since it has some events set up too work in my in-line editing/saving to the backend! However I notice when clicking to launch the DatePicker it then inserts the calendar into the DOM and then removes it after selection.

This would be just fine however I would need to make it show inline when my Date text is clicked on instead of opening as a popup like it does now.

Does anyone know if it would be fairly easy to make this open inline, perhaps even make it into an option like some other DatePickers do?

AM / PM Not working

Loving your widget, looks better then any I've seen before but there is a slight glitch. If you load the demo (Chrome / FF tested) and don't change the time but try changing the AM / PM you can make it go to PM but not back again.

Guessing most users will change the time first which then makes it work but I thought it best to let you know about it anyway.

Select / Modify the year shown in the calendar

I can't find any way to modify the year, and I need users to be able to select any year. Clicking the left arrow is the only way I've found to go backwards in time and that is not practical.

Datetime picker show time in 24 hour format?

Hi,

I want to show and deal with time in 24 hour format rather than AM/PM on the datetime picker.

I have looked through the documentation but not been able to find how to do it.

Is this possible?

Thanks

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.