use bootstrap-datepicker
This also validates transaction date and description upon form submission. As noted in the issue, this removes hledger-web's "smart date" functionality. This functionality can be restored giving the demand but should be tracked in another issue. Previous iterations used input[type=date], but it isn't easily crossbrowser and the polyfill I found had some quirks.
This commit is contained in:
		
							parent
							
								
									aa06d0f9bd
								
							
						
					
					
						commit
						d12d7e2228
					
				| @ -125,6 +125,7 @@ instance Yesod App where | ||||
| 
 | ||||
|         pc <- widgetToPageContent $ do | ||||
|             addStylesheet $ StaticR css_bootstrap_min_css | ||||
|             addStylesheet $ StaticR css_bootstrap_datepicker_standalone_min_css | ||||
|              -- load these things early, in HEAD: | ||||
|             toWidgetHead [hamlet| | ||||
|                           <script type="text/javascript" src="@{StaticR js_jquery_min_js}"> | ||||
| @ -132,6 +133,7 @@ instance Yesod App where | ||||
|                          |] | ||||
|             addScript $ StaticR js_bootstrap_min_js | ||||
|             -- addScript $ StaticR js_typeahead_bundle_min_js | ||||
|             addScript $ StaticR js_bootstrap_datepicker_min_js | ||||
|             addScript $ StaticR js_jquery_url_js | ||||
|             addScript $ StaticR js_jquery_cookie_js | ||||
|             addScript $ StaticR js_jquery_hotkeys_js | ||||
| @ -297,19 +299,11 @@ getLastMessage = cached getMessage | ||||
| addform :: Text -> ViewData -> HtmlUrl AppRoute | ||||
| addform _ vd@VD{..} = [hamlet| | ||||
| 
 | ||||
| <script language="javascript"> | ||||
| <script> | ||||
|   jQuery(document).ready(function() { | ||||
| 
 | ||||
|     /* set up typeahead fields */ | ||||
| 
 | ||||
|     datesSuggester = new Bloodhound({ | ||||
|       local:#{listToJsonValueObjArrayStr dates}, | ||||
|       limit:100, | ||||
|       datumTokenizer: function(d) { return [d.value]; }, | ||||
|       queryTokenizer: function(q) { return [q]; } | ||||
|     }); | ||||
|     datesSuggester.initialize(); | ||||
| 
 | ||||
|     descriptionsSuggester = new Bloodhound({ | ||||
|       local:#{listToJsonValueObjArrayStr descriptions}, | ||||
|       limit:100, | ||||
| @ -331,7 +325,6 @@ addform _ vd@VD{..} = [hamlet| | ||||
|     }); | ||||
|     accountsSuggester.initialize(); | ||||
| 
 | ||||
|     enableTypeahead(jQuery('input#date'), datesSuggester); | ||||
|     enableTypeahead(jQuery('input#description'), descriptionsSuggester); | ||||
|     enableTypeahead(jQuery('input#account1, input#account2, input#account3, input#account4'), accountsSuggester); | ||||
| 
 | ||||
| @ -340,10 +333,13 @@ addform _ vd@VD{..} = [hamlet| | ||||
| <form#addform method=POST .form> | ||||
|  <div .form-group> | ||||
|   <div .row> | ||||
|    <div .col-md-2 .col-xs-6 .col-sm-6> | ||||
|     <input #date .typeahead .form-control .input-lg type=text size=15 name=date placeholder="Date" value="#{defdate}"> | ||||
|    <div .col-md-10 .col-xs-6 .col-sm-6> | ||||
|     <input #description .typeahead .form-control .input-lg type=text size=40 name=description placeholder="Description"> | ||||
|    <div .col-md-3 .col-xs-6 .col-sm-6> | ||||
|     <div #dateWrap .input-group .date> | ||||
|      <input #date required lang=en name=date .form-control .input-lg placeholder="Date" > | ||||
|      <div .input-group-addon> | ||||
|       <span .glyphicon .glyphicon-th> | ||||
|    <div .col-md-9 .col-xs-6 .col-sm-6> | ||||
|     <input #description required .typeahead .form-control .input-lg type=text size=40 name=description placeholder="Description"> | ||||
|  <div .account-postings> | ||||
|   $forall n <- postingnums | ||||
|     ^{postingfields vd n} | ||||
| @ -361,8 +357,6 @@ addform _ vd@VD{..} = [hamlet| | ||||
|     (or ctrl +, ctrl -) | ||||
| |] | ||||
|  where | ||||
|   defdate = "" :: String -- #322 don't set a default, typeahead(?) clears it on tab. See also hledger.js | ||||
|   dates = ["today","yesterday","tomorrow"] :: [String] | ||||
|   descriptions = sort $ nub $ map tdescription $ jtxns j | ||||
|   accts = journalAccountNamesDeclaredOrImplied j | ||||
|   escapeJSSpecialChars = regexReplaceCI "</script>" "<\\/script>" -- #236 | ||||
|  | ||||
| @ -2,7 +2,7 @@ | ||||
| -- | ||||
| -- see: https://github.com/sol/hpack | ||||
| -- | ||||
| -- hash: 8b909b66ed99a760e973a9a36822f85ab879fb9823aab1521214d41b237abd45 | ||||
| -- hash: e44d6ce1b41bd59cebb67a6f567178cd7fdef2396dd1debf0c5c1e9635233736 | ||||
| 
 | ||||
| name:           hledger-web | ||||
| version:        1.4.99 | ||||
| @ -38,6 +38,7 @@ extra-source-files: | ||||
|     config/settings.yml | ||||
|     messages/en.msg | ||||
|     README | ||||
|     static/css/bootstrap-datepicker.standalone.min.css | ||||
|     static/css/bootstrap-theme.css | ||||
|     static/css/bootstrap-theme.css.map | ||||
|     static/css/bootstrap-theme.min.css | ||||
| @ -50,6 +51,7 @@ extra-source-files: | ||||
|     static/fonts/glyphicons-halflings-regular.woff | ||||
|     static/hledger.css | ||||
|     static/hledger.js | ||||
|     static/js/bootstrap-datepicker.min.js | ||||
|     static/js/bootstrap.js | ||||
|     static/js/bootstrap.min.js | ||||
|     static/js/excanvas.js | ||||
|  | ||||
							
								
								
									
										7
									
								
								hledger-web/static/css/bootstrap-datepicker.standalone.min.css
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										7
									
								
								hledger-web/static/css/bootstrap-datepicker.standalone.min.css
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							| @ -14,6 +14,14 @@ $(document).ready(function() { | ||||
|   // show add form if ?add=1
 | ||||
|   if ($.url.param('add')) { addformShow(true); } | ||||
| 
 | ||||
| 	// date picker
 | ||||
| 	// http://bootstrap-datepicker.readthedocs.io/en/latest/options.html
 | ||||
| 	$('#dateWrap').datepicker({ | ||||
| 		showOnFocus: false, | ||||
| 		autoclose: true, | ||||
| 		format: 'yyyy-mm-dd' | ||||
| 	}); | ||||
| 
 | ||||
|   // sidebar account hover handlers
 | ||||
|   $('#sidebar td a').mouseenter(function(){ $(this).parent().addClass('mouseover'); }); | ||||
|   $('#sidebar td').mouseleave(function(){ $(this).removeClass('mouseover'); }); | ||||
| @ -141,7 +149,6 @@ function addformReset(showmsg) { | ||||
|     // reset typehead state (though not fetched completions)
 | ||||
|     $('.typeahead').typeahead('val', ''); | ||||
|     $('.tt-dropdown-menu').hide(); | ||||
|     $('input#date').val(''); // #322 don't set a default, typeahead(?) clears it on tab. See also Foundation.hs
 | ||||
|   } | ||||
| } | ||||
| 
 | ||||
|  | ||||
							
								
								
									
										8
									
								
								hledger-web/static/js/bootstrap-datepicker.min.js
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										8
									
								
								hledger-web/static/js/bootstrap-datepicker.min.js
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
		Loading…
	
		Reference in New Issue
	
	Block a user