Matthew Schinckel avatar Matthew Schinckel committed e2062c0

Prevent selection of text on double-click of buttons.

Comments (0)

Files changed (2)

examples/datepicker.html

 		<div data-bind="messages: {}"></div>
 		
     <form>
-  		<input type="text" data-bind="date: theDate, dateOptions: {displayFormat:dateFormat}">
+  		<!-- <input type="text" data-bind="date: theDate, dateOptions: {displayFormat:dateFormat}">
 		
   		<input name="date" type="text" data-bind="date: theDate, 
   											dateOptions: {
   												displayFormat: '%-d %b, %Y',
                           yearRange: 'c-5:c+5',
   												maxDate: '2015-01-01'
-                        }">
+                        }"> -->
       <input type="text" data-bind="date: theDate">
   		<input type="text" data-bind="time: theDate">
     </form>

src/js/datepicker.js

   
 TODO: Ensure we can change options.
 
+TODO: Make it work when multiple inputs are bound to the same observable.
+
 */
 
 ko.bindingHandlers.date = {
     
     // TODO: Figure out how to not add it multiple times!
     if (!$('style#datepicker-styles').length) {
-      var $styles = $("<style id=\"datepicker-style\">.datepicker-wrapper {position: relative;display: inline;display: inline-block;}.datepicker {display: block;font-size: 12px;}.datepicker .alert-error {margin: 16px 32px;max-width: 220px;text-align: center;padding-bottom: 0;}.datepicker a {text-align: center;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;display: block;padding: 6px 12px;clear: both;font-weight: normal;line-height: 20px;color: #333333;white-space: nowrap;}.datepicker a:hover {color: #ffffff;text-decoration: none;background-color: #0081c2;background-image: -moz-linear-gradient(top, #0088cc, #0077b3);background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);background-image: -o-linear-gradient(top, #0088cc, #0077b3);background-image: linear-gradient(to bottom, #0088cc, #0077b3);background-repeat: repeat-x;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0);cursor: hand;}.datepicker a:active {color: #333333;text-decoration: none;background-color: #0081c2;background-image: -moz-linear-gradient(top, #0088cc, #0077b3);background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);background-image: -o-linear-gradient(top, #0088cc, #0077b3);background-image: linear-gradient(to bottom, #0088cc, #0077b3);background-repeat: repeat-x;outline: 0;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0);}.datepicker td, .datepicker th {padding: 0;}.datepicker tr {padding: 0 12px;}.datepicker:before {content: '';display: inline-block;border-left: 7px solid transparent;border-right: 7px solid transparent;border-bottom: 7px solid #ccc;border-bottom-color: rgba(0, 0, 0, 0.2);position: absolute;top: -7px;left: 6px;}.datepicker:after {content: '';display: inline-block;border-left: 6px solid transparent;border-right: 6px solid transparent;border-bottom: 6px solid #ffffff;position: absolute;top: -6px;left: 7px;}</style>");
+      var $styles = $("<style id=\"datepicker-style\">.datepicker-wrapper {position: relative;display: inline!important;display: inline-block!important; top: 12px;}.datepicker {display: block;font-size: 12px;-webkit-user-select: none; -moz-user-select: none;-khtml-user-select: none;}.datepicker .alert-error {margin: 16px 32px;max-width: 220px;text-align: center;padding-bottom: 0;}.datepicker a {text-align: center;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;display: block;padding: 6px 12px;clear: both;font-weight: normal;line-height: 20px;color: #333333;white-space: nowrap;}.datepicker a:hover {color: #ffffff;text-decoration: none;background-color: #0081c2;background-image: -moz-linear-gradient(top, #0088cc, #0077b3);background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);background-image: -o-linear-gradient(top, #0088cc, #0077b3);background-image: linear-gradient(to bottom, #0088cc, #0077b3);background-repeat: repeat-x;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0);cursor: hand;}.datepicker a:active {color: #333333;text-decoration: none;background-color: #0081c2;background-image: -moz-linear-gradient(top, #0088cc, #0077b3);background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);background-image: -o-linear-gradient(top, #0088cc, #0077b3);background-image: linear-gradient(to bottom, #0088cc, #0077b3);background-repeat: repeat-x;outline: 0;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0);}.datepicker td, .datepicker th {padding: 0;}.datepicker tr {padding: 0 12px;}.datepicker:before {content: '';display: inline-block;border-left: 7px solid transparent;border-right: 7px solid transparent;border-bottom: 7px solid #ccc;border-bottom-color: rgba(0, 0, 0, 0.2);position: absolute;top: -7px;left: 6px;}.datepicker:after {content: '';display: inline-block;border-left: 6px solid transparent;border-right: 6px solid transparent;border-bottom: 6px solid #ffffff;position: absolute;top: -6px;left: 7px;}</style>");
       $('head').append($styles);
     }
     
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.