Merge pull request #14 from BanupriyaSelvaraj/master

v17.4.39 Released

Author: ajithr

gulpfile.js

@@ -632,7 +632,10 @@ function generateStackblitzFiles() {
         let sampleName = sampleData.name;
         let mdescription = sampleData.description;
         let ftPath = sampleJson.ftName || '';
-        let title = sampleJson.name + ' · ' + sampleName + ` · Essential JS 2 for Javascript (ES5) · Syncfusion`;
+        let platformName = 'Javascript (ES5)';
+        let title = platformName + ' ' + sampleJson.name + ' ' + sampleName + ` Example - Syncfusion Demos`;
+        let metaTagTemplate = `<meta name="description" content="This example demonstrates the ${sampleName} in ${platformName} ${sampleJson.name} Control. Explore here for more details." />`;
+        let headerDesc = `Example for ${sampleName} in ${platformName} ${sampleJson.name} Control`;
         let plnkr = {};
         let stack = {};
         var compname = filePath.replace('./src/', '');
@@ -665,10 +668,10 @@ function generateStackblitzFiles() {
             $('#action-description').remove();
             var metaDescription = "";
             if (mdescription) {
-                if ((mdescription.length >= 100) && (mdescription.length <= 160)) {
+                if ((mdescription.length >= 60) && (mdescription.length <= 160)) {
                     metaDescription = metaTagTemplate.replace(/{{metaData}}/, mdescription);
                 } else {
-                    error = error + canonical + ' description length should be between 100-160 characters\n';
+                    error = error + canonical + ' description length should be between 60-160 characters\n';
                 }
             }
             var repoScript = '';
@@ -679,7 +682,8 @@ function generateStackblitzFiles() {
             hfile = hfile.replace(/{{:header1}}/g, sampleName);
             hfile = hfile.replace(/{{:header}}/g, sampleJson.name);
             hfile = hfile.replace(/{{:header2}}/g, ftPath);
-            hfile = hfile.replace(/{{:meta}}/, metaDescription);
+            hfile = hfile.replace(/{{:meta}}/, metaTagTemplate);
+            hfile = hfile.replace(/{{:Newheader}}/, headerDesc);
             hfile = hfile.replace(/{{:title}}/g, title);
             hfile = hfile.replace(/{{:repoName}}/g, repoScript);
             var stackHtmlFile = stackBlitzHDep.replace(/{{datasource}}/, ((dataSource !== 'nil') ? ('<script src="' + sbLink +
@@ -865,4 +869,4 @@ gulp.task('build', function (done) {
     };
     bs.init(options, done);
 });
-/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

index.html

@@ -114,7 +114,7 @@
             </div>
             <div class='sb-header-item sb-table-cell'>
                 <div id='sb-header-text' class='e-sb-header-text'>
-                    <span class='sb-header-text-left'>Essential JS 2 for</span>
+                    <span class='sb-header-text-left'>Essential Studio for</span>
                     <span class='sb-header-text-right'>JavaScript (ES5)</span>
                 </div>
             </div>
@@ -310,7 +310,7 @@ <h1 class='sb-sample-text'>Chart</h1>
                                 <span class="sb-icons sb-icon-Demo"></span><span class="sb-tab-title"> DEMO </span> </div>
                             <div>
                                 <span class="sb-icons sb-icon-Code"></span><span class="sb-tab-title">  SOURCE </span> </div>
-                                <!-- <div><span class="sb-icons sb-icon-API"></span><span class="sb-tab-title">  API </span></div> -->
+                                <div><span class="sb-icons sb-icon-API"></span><span class="sb-tab-title">  API </span></div>
                         </div>
                         <div class="e-content sb-sample-content-area">
                             <div>
@@ -371,7 +371,7 @@ <h1 class='sb-sample-text'>Chart</h1>
                             <a href="https://www.syncfusion.com/forums/essential-js2" target="_blank">
                                 <div class="sb-footer-link">Forum</div>
                             </a>
-                            <a href="https://blog.syncfusion.com/" target="_blank">
+                            <a href="https://syncfusion.com/blogs" target="_blank">
                                 <div class="sb-footer-link">Blog</div>
                             </a>
                             <a href="https://www.syncfusion.com/kb" target="_blank">

src/accordion/Ajax_content.html

@@ -1 +1 @@
-{"index.html":"<html><head><script src=\"//npmci.syncfusion.com/production/demos/accordion/ajax/datasource.js\" type=\"text/javascript\"></script>\n<script src=\"https://cdn.syncfusion.com/ej2/dist/ej2.min.js\" type=\"text/javascript\"></script>\n    <link href=\"https://cdn.syncfusion.com/ej2/material.css\" rel=\"stylesheet\">\n\n    <link href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css\" rel=\"stylesheet\">\n\n    <style>\n            body{\n                touch-action:none;\n            }\n        </style></head><body><div class=\"stackblitz-container {{theme}}\"><div class=\"control-section\">\n    <div class=\"control_wrapper accordion-control-section\">\n        <div class=\"product_title\"> iPhone X Product Specification </div>\n        <div id=\"Accordion_Nested\"></div>\n    </div>\n    <div id=\"Sensor_features\" style=\"display:none\">\n        <table>\n            <tbody><tr>\n                <td class=\"e-bold\">Proximity sensor</td>\n                <td>Yes</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Face ID</td>\n                <td>Yes</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Accelerometer</td>\n                <td>Yes</td>\n            </tr>\n        </tbody></table>\n    </div>\n    <div id=\"Hard_Soft_features\" style=\"display:none\">\n        <table>\n            <tbody><tr>\n                <th rowspan=\"3\"> Hardware</th>\n                <td class=\"e-bold\" rowspan=\"2 \">Chip</td>\n                <td>Apple A11 Bionic chip with 64-bit architecture</td>\n            </tr>\n            <tr>\n                <td>Embedded M11 motion coprocessor</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Capacity</td>\n                <td>64GB/256GB</td>\n            </tr>\n            <tr>\n                <th> Software</th>\n                <td class=\"e-bold\" rowspan=\"2 \">Operating System</td>\n                <td>iOS 11</td>\n            </tr>\n        </tbody></table>\n    </div>\n    <div id=\"Video_Rec_features\" style=\"display:none\">\n        <table>\n            <tbody><tr>\n                <th class=\"e-bold\" rowspan=\"9\">Video Recording</th>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">4K video recording</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">1080p &amp; 720p HD video recording</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Optical zoom, 6x digital zoom</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Slow motion video support</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Take 8MP still photos while recording 4K video</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Noise reduction</td>\n            </tr>\n        </tbody></table>\n    </div>\n    <div id=\"Camera_features\" style=\"display:none\">\n        <table>\n            <tbody><tr>\n                <th class=\"e-bold\" rowspan=\"3\">Camera</th>\n                <td class=\"e-bold\"> 12MP wide-angle</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Live Photos with stabilization</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Body and face detection</td>\n            </tr>\n            <tr>\n                <th class=\"e-bold\" rowspan=\"4\">TrueDepth Camera</th>\n                <td class=\"e-bold\"> 7MP camera</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\"> Animoji</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\"> Face detection</td>\n            </tr>\n        </tbody></table>\n    </div>\n    <div id=\"source_link\">Source: &#xA0;\n        <a href=\"https://www.apple.com/iphone-x/specs/\" target=\"_blank\">www.apple.com/iphone-x/specs/</a>\n    </div>\n</div>\n\n\n<style>\n    @-moz-document url-prefix() {\n        .e-accordion .e-content table {\n            border-collapse: initial;\n        }\n    }\n    \n    .e-accordion table {\n        border-collapse: collapse;\n        border-spacing: 0;\n        width: 100%;\n    }\n    \n    .e-accordion table th,\n    .e-accordion table td {\n        font-weight: normal;\n        padding: 5px;\n        text-align: left;\n        border: 1px solid #ddd\n    }\n    \n    .product_title {\n        text-align: center;\n        margin: 20px 0;\n        padding: 10px 0;\n        text-overflow: ellipsis;\n        font-weight: bold;\n        font-size: 16px;\n    }\n    \n    .accordion-control-section {\n        margin: 0 10% 0 10%;\n        padding-bottom: 25px;\n    }\n\n</style></div></body></html>","index.js":"{{ripple}}/**\n * Accordion Ajax Sample\n */\nvar acrdnObj,nestAcrdn;\n\n    var ajax = new ej.base.Ajax('//npmci.syncfusion.com/production/demos/src/accordion/ajax-content.html', 'GET', true);\n    ajax.send().then();\n    ajax.onSuccess = function (data) {\n        //Initialize Accordion component\n        acrdnObj = new ej.navigations.Accordion({\n            expandMode: 'Single',\n            expanding: expand,\n            items: [\n                { header: 'Network & Connectivity', content: data, expanded: true },\n                { header: 'Feature', content: '<div id=\"nested_Acc\"></div>' },\n                { header: 'Hardware & Software', content: '#Hard_Soft_features' }\n            ]\n        });\n        //Render initialized Accordion component\n        acrdnObj.appendTo('#Accordion_Nested');\n    };\n\n//Expanding Event function for Accordion component.\nfunction expand(e) {\n    if (e.isExpanded && [].indexOf.call(this.items, e.item) === 1) {\n        if (e.element.querySelectorAll('.e-accordion').length > 0) {\n            return;\n        }\n        //Initialize Nested Accordion component\n        nestAcrdn = new ej.navigations.Accordion({\n            expandMode: 'Single',\n            items: [\n                { header: 'Sensor', content: '#Sensor_features' },\n                { header: 'Camera', content: '#Camera_features' },\n                { header: 'Video Recording', content: '#Video_Rec_features' },\n            ]\n        });\n        //Render initialized Nested Accordion component\n        nestAcrdn.appendTo('#nested_Acc');\n    }\n}\n\n\n   "}
+{"index.html":"<html><head><script src=\"//ej2.syncfusion.com/javascript/demos/accordion/ajax/datasource.js\" type=\"text/javascript\"></script>\n<script src=\"https://cdn.syncfusion.com/ej2/dist/ej2.min.js\" type=\"text/javascript\"></script>\n    <link href=\"https://cdn.syncfusion.com/ej2/material.css\" rel=\"stylesheet\">\n\n    <link href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css\" rel=\"stylesheet\">\n\n    <style>\n            body{\n                touch-action:none;\n            }\n        </style></head><body><div class=\"stackblitz-container {{theme}}\"><div class=\"control-section\">\n    <div class=\"control_wrapper accordion-control-section\">\n        <div class=\"product_title\"> iPhone X Product Specification </div>\n        <div id=\"Accordion_Nested\"></div>\n    </div>\n    <div id=\"Sensor_features\" style=\"display:none\">\n        <table>\n            <tbody><tr>\n                <td class=\"e-bold\">Proximity sensor</td>\n                <td>Yes</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Face ID</td>\n                <td>Yes</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Accelerometer</td>\n                <td>Yes</td>\n            </tr>\n        </tbody></table>\n    </div>\n    <div id=\"Hard_Soft_features\" style=\"display:none\">\n        <table>\n            <tbody><tr>\n                <th rowspan=\"3\"> Hardware</th>\n                <td class=\"e-bold\" rowspan=\"2 \">Chip</td>\n                <td>Apple A11 Bionic chip with 64-bit architecture</td>\n            </tr>\n            <tr>\n                <td>Embedded M11 motion coprocessor</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Capacity</td>\n                <td>64GB/256GB</td>\n            </tr>\n            <tr>\n                <th> Software</th>\n                <td class=\"e-bold\" rowspan=\"2 \">Operating System</td>\n                <td>iOS 11</td>\n            </tr>\n        </tbody></table>\n    </div>\n    <div id=\"Video_Rec_features\" style=\"display:none\">\n        <table>\n            <tbody><tr>\n                <th class=\"e-bold\" rowspan=\"9\">Video Recording</th>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">4K video recording</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">1080p &amp; 720p HD video recording</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Optical zoom, 6x digital zoom</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Slow motion video support</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Take 8MP still photos while recording 4K video</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Noise reduction</td>\n            </tr>\n        </tbody></table>\n    </div>\n    <div id=\"Camera_features\" style=\"display:none\">\n        <table>\n            <tbody><tr>\n                <th class=\"e-bold\" rowspan=\"3\">Camera</th>\n                <td class=\"e-bold\"> 12MP wide-angle</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Live Photos with stabilization</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\">Body and face detection</td>\n            </tr>\n            <tr>\n                <th class=\"e-bold\" rowspan=\"4\">TrueDepth Camera</th>\n                <td class=\"e-bold\"> 7MP camera</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\"> Animoji</td>\n            </tr>\n            <tr>\n                <td class=\"e-bold\"> Face detection</td>\n            </tr>\n        </tbody></table>\n    </div>\n    <div id=\"source_link\">Source: &#xA0;\n        <a href=\"https://www.apple.com/iphone-x/specs/\" target=\"_blank\">www.apple.com/iphone-x/specs/</a>\n    </div>\n</div>\n\n\n<style>\n    @-moz-document url-prefix() {\n        .e-accordion .e-content table {\n            border-collapse: initial;\n        }\n    }\n    \n    .e-accordion table {\n        border-collapse: collapse;\n        border-spacing: 0;\n        width: 100%;\n    }\n    \n    .e-accordion table th,\n    .e-accordion table td {\n        font-weight: normal;\n        padding: 5px;\n        text-align: left;\n        border: 1px solid #ddd\n    }\n    \n    .product_title {\n        text-align: center;\n        margin: 20px 0;\n        padding: 10px 0;\n        text-overflow: ellipsis;\n        font-weight: bold;\n        font-size: 16px;\n    }\n    \n    .accordion-control-section {\n        margin: 0 10% 0 10%;\n        padding-bottom: 25px;\n    }\n\n</style></div></body></html>","index.js":"{{ripple}}/**\r\n * Accordion Ajax Sample\r\n */\r\nvar acrdnObj,nestAcrdn;\r\n\r\n    var ajax = new ej.base.Ajax('//ej2.syncfusion.com/javascript/demos/src/accordion/ajax-content.html', 'GET', true);\r\n    ajax.send().then();\r\n    ajax.onSuccess = function (data) {\r\n        //Initialize Accordion component\r\n        acrdnObj = new ej.navigations.Accordion({\r\n            expandMode: 'Single',\r\n            expanding: expand,\r\n            items: [\r\n                { header: 'Network & Connectivity', content: data, expanded: true },\r\n                { header: 'Feature', content: '<div id=\"nested_Acc\"></div>' },\r\n                { header: 'Hardware & Software', content: '#Hard_Soft_features' }\r\n            ]\r\n        });\r\n        //Render initialized Accordion component\r\n        acrdnObj.appendTo('#Accordion_Nested');\r\n    };\r\n\r\n//Expanding Event function for Accordion component.\r\nfunction expand(e) {\r\n    if (e.isExpanded && [].indexOf.call(this.items, e.item) === 1) {\r\n        if (e.element.querySelectorAll('.e-accordion').length > 0) {\r\n            return;\r\n        }\r\n        //Initialize Nested Accordion component\r\n        nestAcrdn = new ej.navigations.Accordion({\r\n            expandMode: 'Single',\r\n            items: [\r\n                { header: 'Sensor', content: '#Sensor_features' },\r\n                { header: 'Camera', content: '#Camera_features' },\r\n                { header: 'Video Recording', content: '#Video_Rec_features' },\r\n            ]\r\n        });\r\n        //Render initialized Nested Accordion component\r\n        nestAcrdn.appendTo('#nested_Acc');\r\n    }\r\n}\r\n\r\n\r\n   "}