Sync with Kendo UI Professional

Author: Kendo Bot

docs/AngularJS/Troubleshooting/common-issues.md

@@ -29,7 +29,7 @@ For example, a DatePicker with an empty `value` attribute will not initialize.
     });
 ```
 
-In the previous example, the widget checks the `tag` element attributes and finds a `value` attribute, because it has a [`value`](/api/javascript/ui/datepicker#configuration-value) option. The evaluation against the `$scope` returns `undefined` and the widget does not initialize.
+In the previous example, the widget checks the `tag` element attributes and finds a `value` attribute, because it has a [`value`](/api/javascript/ui/datepicker/configuration/value) option. The evaluation against the `$scope` returns `undefined` and the widget does not initialize.
 
 **Solution**
 

docs/AngularJS/introduction.md

@@ -211,7 +211,7 @@ To bind the value of widgets that provide a `value()` method to the AngularJS sc
       <label>Birthday: <input kendo-date-picker ng-model="birthday" /></label>
       <p>
         Your selection: {% raw %}{{ birthday }}{% endraw %}
-      </p>  
+      </p>
     </div>
     <script>
     angular.module("app", ["kendo.directives"]).controller("MyCtrl", function($scope) {
@@ -409,7 +409,7 @@ The following example demonstrates how to use some of these local variables.
           console.log("Selected: "+ selected.selected,data,dataIteam,angularDataItem);
           console.log("data: ", data);
           console.log("dataIteam: ", dataIteam);
-          console.log("angularDataItem: ", angularDataItem);                    
+          console.log("angularDataItem: ", angularDataItem);
         }
         $scope.mainGridOptions = {
           dataSource: {
@@ -679,7 +679,7 @@ AngularJS creates a new scope for the content placed in a window. The reason for
 
 The available workaround is either:
 
-* To use the [`appendTo`](http://docs.telerik.com/kendo-ui/api/javascript/ui/window#configuration-appendTo) option to append the window to another HTML element which is part of the Angular application and scope, or
+* To use the [`appendTo`](http://docs.telerik.com/kendo-ui/api/javascript/ui/window/configuration/appendto) option to append the window to another HTML element which is part of the Angular application and scope, or
 * To initialize the AngularJS application on the body.
 
 The following example demonstrates the first approach and it shows how to find the window or popup element and get the scope from it.

docs/AngularJS/the-grid-widget.md

@@ -16,7 +16,7 @@ This article outlines some of its particularities regarding the AngularJS integr
 
 > **Important**
 >
-> AngularJS evaluates a template expression placed as [`column.title`](/api/javascript/ui/grid#configuration-columns.title) content. To avoid this behavior, set a [`ng-non-bindable`](https://docs.angularjs.org/api/ng/directive/ngNonBindable) attribute through the [`headerAttributes`](/api/javascript/ui/grid#configuration-columns.headerAttributes) so that AngularJS skips the expression evaluation.
+> AngularJS evaluates a template expression placed as [`column.title`](/api/javascript/ui/grid/configuration/columns.title) content. To avoid this behavior, set a [`ng-non-bindable`](https://docs.angularjs.org/api/ng/directive/ngNonBindable) attribute through the [`headerAttributes`](/api/javascript/ui/grid/configuration/columns.headerattributes) so that AngularJS skips the expression evaluation.
 
 The following example demonstrates how to use the `headerAttributes` to prevent the execution of expressions inside the title content.
 
@@ -219,7 +219,7 @@ The following example demonstrates how to use the `sum` aggregate in a `footerTe
 <script src="https://demos.telerik.com/kendo-ui/content/shared/js/products.js"></script>
 
   <div id="example" ng-app="KendoDemos">
-    <div ng-controller="MyCtrl">      
+    <div ng-controller="MyCtrl">
       <kendo-grid options="mainGridOptions" k-data-source="ds"></kendo-grid>
     </div>
   </div>
@@ -240,7 +240,7 @@ The following example demonstrates how to use the `sum` aggregate in a `footerTe
         aggregate: [
           { field: "UnitPrice", aggregate: "sum" },
           { field: "UnitsInStock", aggregate: "sum" }
-        ]});      
+        ]});
 
       $scope.mainGridOptions = {
         height: 500,
@@ -258,7 +258,7 @@ The following example demonstrates how to use the `sum` aggregate in a `footerTe
             groupFooterTemplate: "{% raw %}{{ dataItem.UnitsInStock.sum }}{% endraw %}"
           }
         ]
-      };      
+      };
     });
   </script>
 ```

docs/AngularJS/tutorials/sushi-angular-tutorial.md

@@ -116,7 +116,7 @@ For a live preview, click [here](http://dojo.telerik.com/@valchev/exeS).
 
 ### Making the Application SEO-Friendly
 
-To [create a SEO (Search Engine Optimization)-friendly](http://googlewebmastercentral.blogspot.com/2009/10/proposal-for-making-ajax-crawlable.html) mobile application, all you need to do is turn on the [`hashBang`](/api/javascript/mobile/application#configuration-hashBang) configuration. The configuration can also be set directly [in the markup]({% slug angularjs_integration_directives %}#widget-options-in-html).
+To [create a SEO (Search Engine Optimization)-friendly](http://googlewebmastercentral.blogspot.com/2009/10/proposal-for-making-ajax-crawlable.html) mobile application, all you need to do is turn on the [`hashBang`](/api/javascript/mobile/application/configuration/hashbang) configuration. The configuration can also be set directly [in the markup]({% slug angularjs_integration_directives %}#widget-options-in-html).
 
 ###### Example
 
@@ -284,7 +284,7 @@ Add a new mobile View called **Our Menu** and add a new ListView with ID `menuLi
 
 ## Using Event Handlers
 
-Now you are going to configure the ListView located in the **Home** View to display only the featured products and the ListView located in **Our Menu** View to display a list of all products grouped by their first letter and ordered alphabetically. To do that, use the [DataSource API](/api/javascript/data/datasource#methods) and the [`beforeShow`](/api/javascript/mobile/ui/view#events-beforeShow) event of the mobile View.
+Now you are going to configure the ListView located in the **Home** View to display only the featured products and the ListView located in **Our Menu** View to display a list of all products grouped by their first letter and ordered alphabetically. To do that, use the [DataSource API](/api/javascript/data/datasource#methods) and the [`beforeshow`](/api/javascript/mobile/ui/view/events/beforeshow) event of the mobile View.
 
 Add the `k-on-before-show` attribute to the View elements and specify the event handler name.
 

docs/_assets/javascripts/api.js

@@ -1,4 +1,4 @@
-var API_CATEGORIES = ['configuration', 'fields', 'methods', 'events'];
+var API_CATEGORIES = ['configuration', 'fields', 'methods', 'events', 'class methods', 'properties', 'constructor parameters'];
 var NESTED_ELEMENT_MARK = '.';
 var COLUMNS_STYLE_CLASS_NAME = 'columns';
 var API_SUBPAGE_TITLE = 'related-properties';
@@ -9,7 +9,7 @@ var COLUMN_HEIGHT_TOLLERANCE = 40;
 var filterControl = null;
 var previousSearch = "";
 
-function findApiCategoryIndex(values) {
+function getApiCategoryAndIndex(values) {
     var startIndex = -1;
     var category = "";
     $.each(values, function (index, value) {
@@ -26,10 +26,32 @@ function findApiCategoryIndex(values) {
     };
 }
 
+function findApiCategoryIndexFromPath(path) {
+    var startIndex = -1;
+    $.each(API_CATEGORIES, function (index, value) {
+        startIndex = path.indexOf(value.toLowerCase());
+        if (startIndex > -1) {
+            return false;
+        }
+    });
+
+    return startIndex;
+}
+
+function capitalizeSingle(value) {
+    var newValue = '';
+    $.each(value.split(/ |-/), function (index, item) {
+        if (index > 0) {
+            newValue += ' ';
+        }
+        newValue += item.charAt(0).toUpperCase() + item.slice(1).toLowerCase();
+    });
+    return newValue;
+}
+
 function capitalize(values) {
     for (var i = 0; i < values.length; i++) {
-        var value = values[i];
-        values[i] = value.charAt(0).toUpperCase() + value.slice(1).toLowerCase();
+        values[i] = capitalizeSingle(values[i]);
     }
 
     return values;
@@ -47,11 +69,11 @@ function separatePageParts(values, breadcrumbs) {
 }
 
 function getBreadcrumbsInfo(values) {
-    var startIndex = findApiCategoryIndex(values).index;
+    var startIndex = getApiCategoryAndIndex(values).index;
     var breadcrumbs = values.slice(startIndex - 1, values.length - 1);
     capitalize(breadcrumbs);
     var pagePartsCount = separatePageParts(values, breadcrumbs);
-    categoryInfo = findApiCategoryIndex(breadcrumbs);
+    categoryInfo = getApiCategoryAndIndex(breadcrumbs);
 
     return {
         categoryIndex: categoryInfo.index,
@@ -74,6 +96,12 @@ function buildToc() {
 
         if (headersCount > 1) {
             tocContainer.append('<div class="api-toc-title">In this article</div><ul>' + listItems + '</ul>');
+
+            var list = tocContainer.children('ul:first-of-type');
+            var windowHeight = $(window).outerHeight();
+            var footerHeight = $("#feedback-section").outerHeight() + $("footer").outerHeight();
+            var listTop = list.offset().top - $(window).scrollTop();
+            list.css('max-height', windowHeight - listTop - footerHeight);
         }
     }
 }
@@ -88,11 +116,7 @@ function repeat(string, count) {
 }
 
 function buildApiBreadcrumbs(data) {
-    if ($('#markdown-toc').length > 0) {
-        return;
-    }
-
-    var path = $(location).attr('pathname').split('/');
+    var path = decodeURI($(location).attr('pathname')).split('/');
     var breadcrumbsInfo = getBreadcrumbsInfo(path);
     var breadcrumbs = breadcrumbsInfo.breadcrumbs;
     breadcrumbs = breadcrumbs.slice(0, breadcrumbs.length);
@@ -109,7 +133,9 @@ function buildApiBreadcrumbs(data) {
             lastHref + '#' + breadcrumb :
             relativePathBackPath + breadcrumb;
 
-        links += '<a href="' + href.toLowerCase() + '">' + breadcrumb + '</a>';
+        href = href.replace(' ', '-');
+        var linkText = i === 0 ? data.public_name : breadcrumb;
+        links += '<a href="' + href.toLowerCase() + '">' + linkText + '</a>';
         if (i > 0) {
             links += getBreadcrumbDropDownContent(data, breadcrumbsInfo, i - 1, lastHref);
         }
@@ -141,7 +167,7 @@ function getBreadcrumbDropDownContent(data, breadcrumbsInfo, nestingLevel, lastH
         if (shouldAppendItemToDropDown(item, scopeFilter, nestingLevel, breadcrumbsInfo.nestingLevel)) {
             var href;
             if (isApiCategory) {
-                href = lastHref + '#' + item.toLowerCase();
+                href = lastHref + '#' + item.replace(' ', '-').toLowerCase();
             } else {
                 href = getPrefix(item, data.group_parents) + item;
             }
@@ -153,7 +179,7 @@ function getBreadcrumbDropDownContent(data, breadcrumbsInfo, nestingLevel, lastH
     return dropDownContent;
 }
 
-function getPrefix(item, prefixes){
+function getPrefix(item, prefixes) {
     var result = '';
     $.each(prefixes, function (index, prefix) {
         if (item.indexOf(prefix) > -1) {
@@ -240,7 +266,8 @@ function setupColumnsInternal(category, subCategory, mainNestingLevel) {
 
 function setupColumns() {
     for (var i = 0; i < API_CATEGORIES.length; i++) {
-        setupColumnsInternal(API_CATEGORIES[i], API_CATEGORIES[i], 0);
+        var category = API_CATEGORIES[i].replace(' ', '-');
+        setupColumnsInternal(category, category, 0);
     }
 
     var subCategory = $('#page-article > article').attr('class');
@@ -313,7 +340,7 @@ function ensureCorrectNavigation() {
     if (hash !== "" && dashIndex > -1) {
         var hashIndex = getApiSectionIndex(hash);
         if (hashIndex > -1 && hashIndex < dashIndex) {
-            var newPath = hash.replace('#', '/').replace('-', '/');
+            var newPath = hash.replace('#', '/').replace('-', '/').toLowerCase();
             window.location.replace(window.location.origin + window.location.pathname + newPath);
             return true;
         }
@@ -342,22 +369,23 @@ function attachToApiPageEvents() {
     }
 
     breadcrumbDropDown = $('.links-container > a');
-    if (breadcrumbDropDown.length && breadcrumbDropDown.next('ul').length) {
+    if (breadcrumbDropDown.length) {
         breadcrumbDropDown.mouseenter(function (e) {
             e.preventDefault();
             $('.links-container').children('ul').hide();
 
             var dropDownContent = $(this).next('ul');
-            dropDownContent.css('left', dropDownContent.position().left + $(this).position().left);
-            if (dropDownContent.is(':hidden')) {
-                dropDownContent.show();
-            } else {
-                dropDownContent.hide();
+            if (dropDownContent.length) {
+                dropDownContent.css('left', dropDownContent.position().left + $(this).position().left);
+                if (dropDownContent.is(':hidden')) {
+                    dropDownContent.show();
+                } else {
+                    dropDownContent.hide();
+                }
+                dropDownContent.mouseleave(function () {
+                    $(this).hide();
+                });
             }
-
-            dropDownContent.mouseleave(function () {
-                $(this).hide();
-            });
         });
     }
 
@@ -372,9 +400,12 @@ function attachToApiPageEvents() {
 }
 
 function getDataForCurrentPage(data) {
-    var dataItemForPage;
+    var searchedApiReferenceControl = decodeURI(window.location.pathname).toLowerCase();
+    var startIndex = searchedApiReferenceControl.indexOf('api/javascript');
+    var endIndex = findApiCategoryIndexFromPath(searchedApiReferenceControl);
+    searchedApiReferenceControl = searchedApiReferenceControl.substring(startIndex, endIndex - 1);
     $.each(data, function (index, dataItem) {
-        if (window.location.pathname.indexOf(dataItem.control)) {
+        if (searchedApiReferenceControl === dataItem.control) {
             dataItemForPage = dataItem;
             return false;
         }
@@ -387,9 +418,11 @@ $(document).ready(function () {
     $.get("/kendo-ui/api.json", function (data) {
         if (!ensureCorrectNavigation()) {
             setupColumns();
-            buildApiBreadcrumbs(getDataForCurrentPage(data));
+            if (!$('#markdown-toc').length) {
+                buildApiBreadcrumbs(getDataForCurrentPage(data));
+            }
             buildToc();
             attachToApiPageEvents();
         }
     });
-});
+});

docs/_assets/javascripts/app.js

@@ -199,7 +199,7 @@ $(function(){
         $("#page-article h2").each(function() {
             var h2 = $(this);
 
-            if (!/fields|configuration|properties|events|methods/i.test(h2.text())) {
+            if (!/fields|configuration|properties|events|class methods|constructor parameters|methods/i.test(h2.text())) {
                 return;
             }
 

docs/_assets/stylesheets/api.css

@@ -95,6 +95,7 @@
   overflow-wrap: break-word;
   width: 270px;
   margin-top: 60px;
+  /* bottom: 84px; */
 }
 
 @media (min-width: 1660px) {
@@ -153,6 +154,7 @@
   list-style: none;
   margin: 0;
   padding: 0;
+  overflow-y: auto;
 }
 
 .api-toc-container .active-toc-item, .links-container>ul .selected-dropdown-breadcrumb {
@@ -247,6 +249,21 @@ h2 a:first-child+a code:before {
   vertical-align: middle;
 }
 
+.constructor-parameters:before {
+  background-color: #4b6584;
+  content: "CP";
+}
+
+.properties:before {
+  background-color: #10ac84;
+  content: "P";
+}
+
+.class-methods:before {
+  background-color: #feca57;
+  content: "CM";
+}
+
 .configuration:before {
   background-color: #1ab125;
   content: "C";
@@ -304,10 +321,10 @@ h2 a:first-child+a code:before {
   min-height: 100%;
 }
 
-footer {
+#markdown-toc~footer {
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   margin-bottom: 0;
-}
+}