auto merge

Author: dmitry-kurmanov

README.md

@@ -1,3 +1,5 @@
+  ## Widgets
+
   - select2: [site](https://select2.org/), [repo](https://github.com/select2/select2), license: MIT
 
   - select2tagbox: [site](https://select2.org/), [repo](https://github.com/select2/select2), license: MIT
@@ -20,6 +22,48 @@
 
   - ckeditor: [site](https://ckeditor.com/ckeditor-4/), [repo](https://github.com/ckeditor/ckeditor-dev), license: https://github.com/ckeditor/ckeditor-dev/blob/major/LICENSE.md
 
-  
-  # examples of usage
+  ## Getting started
+es5 examples: https://surveyjs.io/Examples/Library/?id=custom-widget-select2-tagbox  
 es moules examples: https://stackblitz.com/edit/surveyjs-widgets-react 
+
+Install the library using es5.
+```
+<script src="https://unpkg.com/surveyjs-widgets"></script>
+```
+Install the library using npm.
+
+```
+npm install surveyjs-widgets
+```
+
+Or use Azure CDN:
+https://surveyjs.azureedge.net/0.95.0/surveyjs-widgets.min.js
+
+You find all versions/builds in the [surveyjs/build repo](https://github.com/surveyjs/builds).
+
+
+## Building surveyjs-widgets from sources
+
+To build library yourself:
+
+ 1. **Clone the repo from GitHub**  
+	```
+	git clone https://github.com/surveyjs/surveyjs-widgets.git
+	cd surveyjs-widgets
+	```
+
+ 2. **Acquire build dependencies.** Make sure you have [Node.js](http://nodejs.org/) installed on your workstation. This is only needed to _build_ surveyjs from sources.  
+	```
+	npm install
+	```
+
+ 3. **Build the library**
+	```
+	npm run build
+	```
+	After that you should have the libraries (angular, jquery, knockout, react and vue) at 'packages' directory.
+
+
+## License
+
+[MIT license](https://github.com/surveyjs/widgets/blob/master/LICENSE)

src/ck-editor.js

@@ -3,7 +3,7 @@ function init(Survey) {
         name: "editor",
         title: "Editor",
         iconName: "icon-editor",
-        widgetIsLoaded: function() { return typeof CKEDITOR !== undefined; },
+        widgetIsLoaded: function() { return typeof CKEDITOR != "undefined"; },
         isFit : function(question) { 
             return question.getType() === 'editor'; 
         },

src/icheck.js

@@ -2,8 +2,8 @@ function init(Survey) {
     var widget = {
         className: "iradio_square-blue",
         name: "icheck",
+        widgetIsLoaded: function() { return typeof $ == 'function' && !!$.fn.iCheck; },
         isFit : function(question) {  
-            if(typeof iCheck == undefined && typeof _iCheck == undefined) return false;
             var t = question.getType(); return t === 'radiogroup' || t === 'checkbox' || t === 'matrix'; 
         },
         isDefaultRender: true,

src/image-picker.js

@@ -3,7 +3,7 @@ function init(Survey) {
         name: "imagepicker",
         title: "Image picker",
         iconName: "icon-imagepicker",
-        widgetIsLoaded: function() { return !!$.fn.imagepicker; },
+        widgetIsLoaded: function() { return typeof $ == 'function' && !!$.fn.imagepicker; },
         isFit : function(question) { return question.getType() === 'imagepicker'; },
         isDefaultRender: true,
         activatedByChanged: function(activatedBy) {

src/inputmask.js

@@ -9,8 +9,8 @@ function init(Survey) {
         numericDigitsOptional: false,
         numericPrefix: '$',
         numericPlaceholder: '0',
+        widgetIsLoaded: function() { return typeof Inputmask != "undefined"; },
         isFit : function(question) { 
-            if(typeof Inputmask == undefined) return false;
             if(question.getType() == "multipletext") return true;
             return question.getType() == "text" && (question.inputMask != "none" || question.inputFormat);
         },

src/jquery-bar-rating.js

@@ -3,9 +3,9 @@ function init(Survey) {
         name: "barrating",
         title: "Bar rating",
         iconName: "icon-barrating",
-        widgetIsLoaded: function() { return typeof Barrating !== undefined; },
+        widgetIsLoaded: function() { return !!$.fn.barrating; },
         defaultJSON: {choices: [1, 2, 3, 4, 5]},
-        isFit : function(question) { return question.getType() === 'barrating'; },
+        isFit : function(question) { return typeof $ == 'function' && !!$.fn.barrating; },
         isDefaultRender: true,
         activatedByChanged: function(activatedBy) {
             Survey.JsonObject.metaData.addClass("barrating", [ {name: "showValues:boolean", default: false}, 

src/jquery-ui-datepicker.js

@@ -3,7 +3,7 @@ function init(Survey) {
         name: "datepicker",
         title: "Date picker",
         iconName: "icon-datepicker",
-        widgetIsLoaded: function() { return typeof DatePicker !== undefined; },
+        widgetIsLoaded: function() { return typeof $ == 'function' && !!$.fn.datepicker; },
         isFit : function(question) { return question.getType() === 'datepicker'; },
         htmlTemplate: "<input class='widget-datepicker' type='text' style='width: 100%;'>",
         activatedByChanged: function(activatedBy) {
@@ -15,15 +15,22 @@ function init(Survey) {
             var $el = $(el).is(".widget-datepicker") ? $(el) : $(el).find(".widget-datepicker");
             var pickerWidget = $el.datepicker({
                 dateFormat: question.dateFormat,
+                option: { 
+                    minDate: null,
+                    maxDate: null
+                },
                 onSelect: function(dateText) {
                     question.value = dateText;
                 }
             });
             question.valueChangedCallback = function() {
-                pickerWidget.datepicker('setDate', new Date(question.value));
+                if(question.value) {
+                    pickerWidget.datepicker('setDate', new Date(question.value));
+                } else {
+                    pickerWidget.datepicker('setDate', null);
+                }
             }
             question.valueChangedCallback();
-            if(!question.value) question.value = new Date();
         },
         willUnmount: function(question, el) {
             var $el = $(el).is(".widget-datepicker") ? $(el) : $(el).find(".widget-datepicker");

src/nouislider.js

@@ -5,7 +5,7 @@ function init(Survey) {
         name: "nouislider",
         title: "noUiSlider",
         iconName: "icon-nouislider",
-        widgetIsLoaded: function() { return typeof noUiSlider !== undefined; },
+        widgetIsLoaded: function() { return typeof noUiSlider != "undefined"; },
         isFit : function(question) { return question.getType() === 'nouislider'; },
         htmlTemplate: "<div></div>",
         activatedByChanged: function(activatedBy) {

src/select2-tagbox.js

@@ -5,7 +5,7 @@ function init(Survey) {
         name: "tagbox",
         title: "Tag box",
         iconName: "icon-tagbox",
-        widgetIsLoaded: function() { return typeof Select2 !== undefined; },
+        widgetIsLoaded: function() { return typeof $ == 'function' && !!$.fn.select2; },
         defaultJSON: {choices: ["Item 1", "Item 2", "Item 3"]},
         htmlTemplate: "<select multiple='multiple' style='width: 100%;'></select>",
         isFit : function(question) { return question.getType() === 'tagbox';  },

src/select2.js

@@ -5,13 +5,15 @@ function init(Survey) {
         activatedBy: "property",
         name: "select2",
         htmlTemplate: "<select style='width: 100%;'></select>",
+        widgetIsLoaded: function() { return typeof $ == 'function' && !!$.fn.select2; },
         isFit : function(question) {
             if(widget.activatedBy == "property") return question["renderAs"] === 'select2' && question.getType() === 'dropdown'; 
             if(widget.activatedBy == "type") return  typeof Select2 !== undefined && question.getType() === 'dropdown'; 
             if(widget.activatedBy == "customtype") return question.getType() === 'select2';
             return false;
         },
         activatedByChanged: function(activatedBy) {
+            if(!this.widgetIsLoaded()) return;
             widget.activatedBy = activatedBy;
             Survey.JsonObject.metaData.removeProperty("dropdown", "renderAs");
             if(activatedBy == "property") {