diff --git a/types/ej.web.all/ej.web.all-tests.ts b/types/ej.web.all/ej.web.all-tests.ts index 83ed128742..ddfdc39876 100644 --- a/types/ej.web.all/ej.web.all-tests.ts +++ b/types/ej.web.all/ej.web.all-tests.ts @@ -1,3 +1,7 @@ +/* tslint:disable */ + + + module AccordionComponent { $(function () { var sample = new ej.Accordion($("#basicAccordion"), { @@ -18,39 +22,39 @@ module AccordionComponent { }); } + - -module AutocompleteComponent { +module AutocompleteComponent{ var carList = [ - "Audi S6", "Austin-Healey", "Alfa Romeo", "Aston Martin", - "BMW 7", "Bentley Mulsanne", "Bugatti Veyron", - "Chevrolet Camaro", "Cadillac", - "Duesenberg J", "Dodge Sprinter", - "Elantra", "Excavator", - "Ford Boss 302", "Ferrari 360", "Ford Thunderbird", - "GAZ Siber", - "Honda S2000", "Hyundai Santro", - "Isuzu Swift", "Infiniti Skyline", - "Jaguar XJS", - "Kia Sedona EX", "Koenigsegg Agera", - "Lotus Esprit", "Lamborghini Diablo", - "Mercedes-Benz", "Mercury Coupe", "Maruti Alto 800", - "Nissan Qashqai", - "Oldsmobile S98", "Opel Superboss", - "Porsche 356", "Pontiac Sunbird", - "Scion SRS/SC/SD", "Saab Sportcombi", "Subaru Sambar", "Suzuki Swift", - "Triumph Spitfire", "Toyota 2000GT", - "Volvo P1800", "Volkswagen Shirako" - ]; - $(function () { - var autocompleteInstance = new ej.Autocomplete($("#selectCar"), { + "Audi S6", "Austin-Healey", "Alfa Romeo", "Aston Martin", + "BMW 7", "Bentley Mulsanne", "Bugatti Veyron", + "Chevrolet Camaro", "Cadillac", + "Duesenberg J", "Dodge Sprinter", + "Elantra", "Excavator", + "Ford Boss 302", "Ferrari 360", "Ford Thunderbird", + "GAZ Siber", + "Honda S2000", "Hyundai Santro", + "Isuzu Swift", "Infiniti Skyline", + "Jaguar XJS", + "Kia Sedona EX", "Koenigsegg Agera", + "Lotus Esprit", "Lamborghini Diablo", + "Mercedes-Benz", "Mercury Coupe", "Maruti Alto 800", + "Nissan Qashqai", + "Oldsmobile S98", "Opel Superboss", + "Porsche 356", "Pontiac Sunbird", + "Scion SRS/SC/SD", "Saab Sportcombi", "Subaru Sambar", "Suzuki Swift", + "Triumph Spitfire", "Toyota 2000GT", + "Volvo P1800", "Volkswagen Shirako" + ]; + $(function () { + var autocompleteInstance =new ej.Autocomplete($("#selectCar"), { width: "100%", watermarkText: "Select a car", dataSource: carList, enableAutoFill: true, showPopupButton: true, multiSelectMode: "delimiter" - }); + }); }); } @@ -193,12 +197,12 @@ module ChartComponent { range: { min: 25, max: 50, interval: 5 }, labelFormat: "{value}%", title: { text: "Efficiency" }, - + }, commonSeriesOptions: - { + { type: 'line', enableAnimation: true, - tooltip: { visible: true, template: 'Tooltip' }, + tooltip:{ visible :true, template:'Tooltip'}, marker: { shape: 'circle', @@ -208,30 +212,30 @@ module ChartComponent { }, visible: true }, - border: { width: 2 } - }, - series: - [ + border : {width: 2} + }, + series: + [ + { + points: [{ x: 2005, y: 28 }, { x: 2006, y: 25 },{ x: 2007, y: 26 }, { x: 2008, y: 27 }, + { x: 2009, y: 32 }, { x: 2010, y: 35 }, { x: 2011, y: 30 }], + name: 'India' + }, { - points: [{ x: 2005, y: 28 }, { x: 2006, y: 25 }, { x: 2007, y: 26 }, { x: 2008, y: 27 }, - { x: 2009, y: 32 }, { x: 2010, y: 35 }, { x: 2011, y: 30 }], - name: 'India' + points: [{ x: 2005, y: 31 }, { x: 2006, y: 28 },{ x: 2007, y: 30 }, { x: 2008, y: 36 }, + { x: 2009, y: 36 }, { x: 2010, y: 39 }, { x: 2011, y: 37 }], + name: 'Germany' }, + { + points: [{ x: 2005, y: 36 }, { x: 2006, y: 32 },{ x: 2007, y: 34 }, { x: 2008, y: 41 }, + { x: 2009, y: 42 }, { x: 2010, y: 42 }, { x: 2011, y: 43 }], + name: 'England' + }, { - points: [{ x: 2005, y: 31 }, { x: 2006, y: 28 }, { x: 2007, y: 30 }, { x: 2008, y: 36 }, - { x: 2009, y: 36 }, { x: 2010, y: 39 }, { x: 2011, y: 37 }], - name: 'Germany' - }, - { - points: [{ x: 2005, y: 36 }, { x: 2006, y: 32 }, { x: 2007, y: 34 }, { x: 2008, y: 41 }, - { x: 2009, y: 42 }, { x: 2010, y: 42 }, { x: 2011, y: 43 }], - name: 'England' - }, - { - points: [{ x: 2005, y: 39 }, { x: 2006, y: 36 }, { x: 2007, y: 40 }, { x: 2008, y: 44 }, - { x: 2009, y: 45 }, { x: 2010, y: 48 }, { x: 2011, y: 46 }], - name: 'France' - } + points: [{ x: 2005, y: 39 }, { x: 2006, y: 36 },{ x: 2007, y: 40 }, { x: 2008, y: 44 }, + { x: 2009, y: 45 }, { x: 2010, y: 48 }, { x: 2011, y: 46 }], + name: 'France' + } ], isResponsive: true, load: function () { @@ -296,14 +300,14 @@ module ChartComponent { theme = "flatlight"; break; } - sender.model.theme = theme; + sender.model.theme = theme; } }, title: { text: 'Efficiency of oil-fired power production' }, size: { height: "600" }, - legend: { visible: true }, + legend: { visible: true}, }); - // chartsample.model.load="loadTheme"; + // chartsample.model.load="loadTheme"; }); } @@ -357,7 +361,7 @@ module circulargaugecomponent { backgroundColor: "#f5b43f", border: { color: "#f5b43f" } }] - }] + }] }); }); } @@ -376,21 +380,21 @@ module ColorPickerComponent { -module ComboBoxComponent { +module ComboBoxComponent{ var BikeList = [ { empid: "bk1", text: "Apache RTR" }, { empid: "bk2", text: "CBR 150-R" }, { empid: "bk3", text: "CBZ Xtreme" }, { empid: "bk4", text: "Discover" }, { empid: "bk5", text: "Dazzler" }, { empid: "bk6", text: "Flame" }, { empid: "bk7", text: "Fazzer" }, { empid: "bk8", text: "FZ-S" }, { empid: "bk9", text: "Pulsar" }, { empid: "bk10", text: "Shine" }, { empid: "bk11", text: "R15" }, { empid: "bk12", text: "Unicorn" } ]; - $(function () { - var comboboxInstance = new ej.ComboBox($("#selectCar"), { + $(function () { + var comboboxInstance =new ej.ComboBox($("#selectCar"), { width: "100%", placeholder: "Select a Bike", - fields: { text: "text", value: "empid" }, + fields: { text: "text", value: "empid" }, dataSource: BikeList, autofill: true - }); + }); }); } @@ -462,8 +466,7 @@ $(function () { }), createNode({ name: "Project", width: 150, height: 100, offsetX: 300, offsetY: 430, labels: [createLabel({ "text": "Find Project \nmanager" })], type: "flow", shape: ej.datavisualization.Diagram.FlowShapes.Decision }), createNode({ - name: "End", width: 150, height: 60, offsetX: 300, offsetY: 555, labels: [createLabel({ "text": "Implement and Deliver" })], type: "flow", shape: ej.datavisualization.Diagram.FlowShapes.Process - }), + name: "End", width: 150, height: 60, offsetX: 300, offsetY: 555, labels: [createLabel({ "text": "Implement and Deliver" })], type: "flow", shape: ej.datavisualization.Diagram.FlowShapes.Process }), createNode({ name: "Decision", width: 250, height: 60, offsetX: 550, offsetY: 60, labels: [createLabel({ "text": "Decision Process for new software ideas" })], type: "flow", shape: ej.datavisualization.Diagram.FlowShapes.Card, fillColor: "#858585", borderColor: "#858585" }), createNode({ name: "Reject", width: 150, height: 60, offsetX: 550, offsetY: 285, labels: [createLabel({ "text": "Reject and write report" })], type: "flow", shape: ej.datavisualization.Diagram.FlowShapes.Process }), createNode({ name: "Resources", width: 150, height: 60, offsetX: 550, offsetY: 430, labels: [createLabel({ "text": "Hire new resources" })], type: "flow", shape: ej.datavisualization.Diagram.FlowShapes.Process }) @@ -477,7 +480,7 @@ $(function () { createConnector({ name: "connector6", sourceNode: "Project", targetNode: "Resources", labels: [createLabel({ "text": "No" })] }) ] }); - + }); function createNode(option: ej.datavisualization.Diagram.Node) { @@ -498,11 +501,11 @@ function createConnector(option: ej.datavisualization.Diagram.Connector) { return option; } -function createLabel(options: any) { +function createLabel(options : any) { return options; } - + module DialogComponent { $(function () { @@ -510,17 +513,15 @@ module DialogComponent { width: 550, minWidth: 310, minHeight: 215, - target: ".control", - close: () => { - $("#btnOpen").show(); - } + target:".control", + close:()=>{ + $("#btnOpen").show();} }); var btnInstance = new ej.Button($("#btnOpen"), { size: "medium", - click: () => { - $("#btnOpen").hide(); - $("#basicDialog").ejDialog("open"); - }, + click: ()=>{ + $("#btnOpen").hide(); + $("#basicDialog").ejDialog("open");}, type: "button", height: 30, width: 150 @@ -554,7 +555,7 @@ module digitalgaugecomponent { } - + @@ -566,7 +567,7 @@ module DropDownListComponent { { empid: "bk10", text: "Shine" }, { empid: "bk11", text: "R15" }, { empid: "bk12", text: "Unicorn" } ]; $(function () { - var sample = new ej.DropDownList($("#bikeList"), { + var sample = new ej.DropDownList($("#bikeList"),{ dataSource: BikeList, width: "100%", watermarkText: "Select a bike", @@ -574,12 +575,12 @@ module DropDownListComponent { enableFilterSearch: true, caseSensitiveSearch: true, enableIncrementalSearch: true, - enablePopupResize: true, + enablePopupResize: true, delimiterChar: ";", multiSelectMode: ej.MultiSelectMode.Delimiter, maxPopupHeight: "300px", - minPopupHeight: "150px", - maxPopupWidth: "500px", + minPopupHeight: "150px", + maxPopupWidth: "500px", minPopupWidth: "350px", showCheckbox: true, showRoundedCorner: true @@ -610,53 +611,53 @@ module ExplorerComponent { module GanttComponent { - $(function () { - var ganttInstance = new ej.Gantt($("#GanttContainer"), { - dataSource: (window).projectData, - allowColumnResize: true, - allowSorting: true, - allowSelection: true, - enableContextMenu: true, - taskIdMapping: "taskID", - allowDragAndDrop: true, - taskNameMapping: "taskName", - startDateMapping: "startDate", - showColumnChooser: true, - showColumnOptions: true, - progressMapping: "progress", - durationMapping: "duration", - endDateMapping: "endDate", - childMapping: "subtasks", - scheduleStartDate: "02/01/2017", - scheduleEndDate: "04/09/2017", - //Resources mapping - resourceInfoMapping: "resourceId", - resourceNameMapping: "resourceName", - resourceIdMapping: "resourceId", - resources: (window).projectResources, - predecessorMapping: "predecessor", - showResourceNames: true, - toolbarSettings: { - showToolbar: true, - toolbarItems: ["add", "edit", "delete", "update", "cancel", "indent", "outdent", "expandAll", "collapseAll", "search"] - }, - editSettings: { - allowEditing: true, - allowAdding: true, - allowDeleting: true, - allowIndent: true, - editMode: "cellEditing" - }, - sizeSettings: { - width: "100%", - height: "100%" - }, - dragTooltip: { showTooltip: true }, - showGridCellTooltip: true, - treeColumnIndex: 1, - isResponsive: true, - }); + $(function () { + var ganttInstance = new ej.Gantt($("#GanttContainer"), { + dataSource: (window).projectData, + allowColumnResize: true, + allowSorting: true, + allowSelection: true, + enableContextMenu: true, + taskIdMapping: "taskID", + allowDragAndDrop: true, + taskNameMapping: "taskName", + startDateMapping: "startDate", + showColumnChooser: true, + showColumnOptions: true, + progressMapping: "progress", + durationMapping: "duration", + endDateMapping: "endDate", + childMapping: "subtasks", + scheduleStartDate: "02/01/2017", + scheduleEndDate: "04/09/2017", + //Resources mapping + resourceInfoMapping: "resourceId", + resourceNameMapping: "resourceName", + resourceIdMapping: "resourceId", + resources: (window).projectResources, + predecessorMapping: "predecessor", + showResourceNames: true, + toolbarSettings: { + showToolbar: true, + toolbarItems: ["add","edit","delete","update","cancel","indent","outdent","expandAll","collapseAll","search"] + }, + editSettings: { + allowEditing: true, + allowAdding: true, + allowDeleting: true, + allowIndent: true, + editMode: "cellEditing" + }, + sizeSettings: { + width: "100%", + height: "100%" + }, + dragTooltip: { showTooltip: true }, + showGridCellTooltip: true, + treeColumnIndex: 1, + isResponsive: true, }); +}); } @@ -749,7 +750,7 @@ $(function () { module KanbanComponent { $(function () { var sample = new ej.Kanban($("#Kanban"), { - dataSource: new ej.DataManager((window).kanbanData).executeLocal(new ej.Query().take(20)), + dataSource: new ej.DataManager((window).kanbanData).executeLocal(new ej.Query().take(20)), columns: [ { headerText: "Backlog", key: "Open" }, { headerText: "In Progress", key: "InProgress" }, @@ -768,7 +769,7 @@ module KanbanComponent { }); } - + module lineargaugecomponent { @@ -794,14 +795,14 @@ module lineargaugecomponent { backgroundColor: "#E94649", border: { color: "#E94649" }, startWidth: 4, endWidth: 4 }] - }] + }] }); }); } + - - + module ListBoxComponent { $(function () { @@ -811,13 +812,13 @@ module ListBoxComponent { }); } - + module ListviewComponent { $(function () { var listviewInstance = new ej.ListView($("#defaultlistview"), { - enableCheckMark: true, - width: 400 + enableCheckMark: true, + width: 400 }); }); } @@ -1056,7 +1057,7 @@ module mapcomponenet { module MenuComponent { $(function () { - var sample = new ej.Menu($("#syncfusionProducts"), { + var sample = new ej.Menu($("#syncfusionProducts"),{ width: "100%", animationType: ej.AnimationType.Default, cssClass: 'gradient-lime ', @@ -1081,12 +1082,12 @@ module MenuComponent { - + module NavigationDrawerComponent { $(function () { var navigationdrawerInstance = new ej.NavigationDrawer($("#navpane"), { - targetId: "butdrawer", + targetId: "butdrawer", contentId: "content_container", type: "overlay", direction: "left", @@ -1097,8 +1098,8 @@ module NavigationDrawerComponent { }, position: "normal" }); - $("#navpane_listview").click(function (e: any) { - var text = e.target["text"] || $(e.target).closest("li.e-list").text(); + $("#navpane_listview").click(function(e: any) { + var text=e.target["text"]||$(e.target).closest("li.e-list").text(); $("#butdrawer").parent().children("h2").text(text); }); }); @@ -1109,7 +1110,7 @@ module NavigationDrawerComponent { module PDFViewerComponent { $(function () { var pdfviewerControl = new ej.PdfViewer($("#pdfviewer"), { - serviceUrl: (window).baseurl + "api/PdfViewer", + serviceUrl:(window).baseurl+ "api/PdfViewer", isResponsive: true }); }); @@ -1119,42 +1120,42 @@ module PDFViewerComponent { module PivotChartOlap { $(function () { - var sample = new ej.PivotChart($("#PivotChart"), { + var sample = new ej.PivotChart($("#PivotChart"),{ dataSource: { - data: "//bi.syncfusion.com/olap/msmdpump.dll", - catalog: "Adventure Works DW 2008 SE", - cube: "Adventure Works", - rows: [ - { - fieldName: "[Date].[Fiscal]" - } - ], - columns: [ - { - fieldName: "[Customer].[Customer Geography]" - } - ], - values: [ - { - measures: [ - { - fieldName: "[Measures].[Internet Sales Amount]" - } - ], - axis: "columns" - } - ], - filters: [] - }, - isResponsive: true, zooming: { enableScrollbar: true }, - commonSeriesOptions: { - type: "column" - }, - size: { height: "460px", width: "100%" }, - primaryXAxis: { title: { text: "Date - Fiscal" }, labelRotation: 0 }, - primaryYAxis: { title: { text: "Internet Sales Amount" } }, - legend: { visible: true, rowCount: 2 } - // load:"loadTheme" + data: "//bi.syncfusion.com/olap/msmdpump.dll", + catalog: "Adventure Works DW 2008 SE", + cube: "Adventure Works", + rows: [ + { + fieldName: "[Date].[Fiscal]" + } + ], + columns: [ + { + fieldName: "[Customer].[Customer Geography]" + } + ], + values: [ + { + measures: [ + { + fieldName: "[Measures].[Internet Sales Amount]" + } + ], + axis: "columns" + } + ], + filters:[] + }, + isResponsive: true,zooming:{enableScrollbar: true}, + commonSeriesOptions: { + type: "column" + }, + size: { height: "460px", width: "100%" }, + primaryXAxis: { title: { text: "Date - Fiscal" }, labelRotation: 0 }, + primaryYAxis: { title: { text: "Internet Sales Amount" } }, + legend: { visible: true, rowCount: 2 } + // load:"loadTheme" }); }); } @@ -1191,45 +1192,45 @@ var pivot_dataset = [ module PivotChartRelational { $(function () { - var sample = new ej.PivotChart($("#PivotChart"), { + var sample = new ej.PivotChart($("#PivotChart"),{ dataSource: { - data: pivot_dataset, - rows: [ - { - fieldName: "Country", - fieldCaption: "Country" - }, - { - fieldName: "State", - fieldCaption: "State" - }, - { - fieldName: "Date", - fieldCaption: "Date" - } - ], - columns: [ - { - fieldName: "Product", - fieldCaption: "Product" - } - ], - values: [ - { - fieldName: "Amount", - fieldCaption: "Amount" - } - ], - filters: [] - }, - isResponsive: true, zooming: { enableScrollbar: true }, - commonSeriesOptions: { - type: "column" - }, - size: { height: "460px", width: "100%" }, - primaryYAxis: { title: { text: "Amount" } }, - legend: { visible: true } - // load:"loadTheme" + data: pivot_dataset, + rows: [ + { + fieldName: "Country", + fieldCaption: "Country" + }, + { + fieldName: "State", + fieldCaption: "State" + }, + { + fieldName: "Date", + fieldCaption: "Date" + } + ], + columns: [ + { + fieldName: "Product", + fieldCaption: "Product" + } + ], + values: [ + { + fieldName: "Amount", + fieldCaption: "Amount" + } + ], + filters:[] + }, + isResponsive: true,zooming:{enableScrollbar: true}, + commonSeriesOptions: { + type: "column" + }, + size: { height: "460px", width: "100%" }, + primaryYAxis: { title: { text: "Amount" } }, + legend: { visible: true } + // load:"loadTheme" }); }); } @@ -1239,106 +1240,106 @@ module PivotChartRelational { module PivotGaugeOlap { $(function () { - var sample = new ej.PivotGauge($("#PivotGauge"), { + var sample = new ej.PivotGauge($("#PivotGauge"),{ dataSource: { - data: "//bi.syncfusion.com/olap/msmdpump.dll", - catalog: "Adventure Works DW 2008 SE", - cube: "Adventure Works", - rows: [ - { - fieldName: "[Date].[Fiscal]", - filterItems: { filterType: "include", values: ["[Date].[Fiscal].[Fiscal Year].&[2004]"] } - }, - ], - columns: [ - { - fieldName: "[Customer].[Customer Geography]" - } - ], - values: [ - { - measures: [ - { - fieldName: "[Measures].[Internet Sales Amount]" - }, - { - fieldName: "[Measures].[Internet Revenue Status]" - }, - { - fieldName: "[Measures].[Internet Revenue Trend]" - }, - { - fieldName: "[Measures].[Internet Revenue Goal]" - }, - ], - axis: "columns" - } - ], - filters: [] - }, + data: "//bi.syncfusion.com/olap/msmdpump.dll", + catalog: "Adventure Works DW 2008 SE", + cube: "Adventure Works", + rows: [ + { + fieldName: "[Date].[Fiscal]", + filterItems: { filterType: "include", values: ["[Date].[Fiscal].[Fiscal Year].&[2004]"] } + }, + ], + columns: [ + { + fieldName: "[Customer].[Customer Geography]" + } + ], + values: [ + { + measures: [ + { + fieldName: "[Measures].[Internet Sales Amount]" + }, + { + fieldName: "[Measures].[Internet Revenue Status]" + }, + { + fieldName: "[Measures].[Internet Revenue Trend]" + }, + { + fieldName: "[Measures].[Internet Revenue Goal]" + }, + ], + axis: "columns" + } + ], + filters:[] + }, enableTooltip: true, isResponsive: true, labelFormatSettings: { decimalPlaces: 2 }, - scales: [{ - showRanges: true, - radius: 150, showScaleBar: true, size: 1, + scales: [{ + showRanges: true, + radius: 150, showScaleBar: true, size: 1, border: { - width: 0.5 - }, - showIndicators: true, showLabels: true, + width: 0.5 + }, + showIndicators: true, showLabels: true, pointers: [{ - showBackNeedle: true, - backNeedleLength: 20, - length: 120, - width: 7 + showBackNeedle: true, + backNeedleLength: 20, + length: 120, + width: 7 }, - { - type: "marker", - markerType: "diamond", - distanceFromScale: 5, - placement: "center", - backgroundColor: "#29A4D9", - length: 25, - width: 15 - }], + { + type: "marker", + markerType: "diamond", + distanceFromScale: 5, + placement: "center", + backgroundColor: "#29A4D9", + length: 25, + width: 15 + }], ticks: [{ - type: "major", + type: "major", distanceFromScale: 2, - height: 16, - width: 1, color: "#8c8c8c" - }, - { - type: "minor", - height: 6, - width: 1, - distanceFromScale: 2, - color: "#8c8c8c" - }], - labels: [{ + height: 16, + width: 1, color: "#8c8c8c" + }, + { + type: "minor", + height: 6, + width: 1, + distanceFromScale: 2, color: "#8c8c8c" }], + labels: [{ + color: "#8c8c8c" + }], ranges: [{ - distanceFromScale: -5, + distanceFromScale: -5, backgroundColor: "#fc0606", - border: { color: "#fc0606" } + border: { color: "#fc0606" } + }, + { + distanceFromScale: -5 + }], + customLabels: [{ + position: { x: 180, y: 290 }, + font: { size: "10px", fontFamily: "Segoe UI", fontStyle: "Normal" }, color: "#666666" }, - { - distanceFromScale: -5 - }], - customLabels: [{ - position: { x: 180, y: 290 }, - font: { size: "10px", fontFamily: "Segoe UI", fontStyle: "Normal" }, color: "#666666" + { + position: { x: 180, y: 320 }, + font: { size: "10px", fontFamily: "Segoe UI", fontStyle: "Normal" }, color: "#666666" }, - { - position: { x: 180, y: 320 }, - font: { size: "10px", fontFamily: "Segoe UI", fontStyle: "Normal" }, color: "#666666" - }, - { - position: { x: 180, y: 150 }, - font: { size: "12px", fontFamily: "Segoe UI", fontStyle: "Normal" }, color: "#666666" - }] + { + position: { x: 180, y: 150 }, + font: { size: "12px", fontFamily: "Segoe UI", fontStyle: "Normal" }, color: "#666666" + }] }] }); - }); + }); } @@ -1372,94 +1373,94 @@ var pivot_dataset = [ module PivotGaugeRelational { $(function () { - var sample = new ej.PivotGauge($("#PivotGauge"), { + var sample = new ej.PivotGauge($("#PivotGauge"),{ dataSource: { - data: pivot_dataset, - rows: [ - { - fieldName: "Country", - }, - { - fieldName: "State", - } - ], - columns: [ - { - fieldName: "Product", - } - ], + data: pivot_dataset, + rows: [ + { + fieldName: "Country", + }, + { + fieldName: "State", + } + ], + columns: [ + { + fieldName: "Product", + } + ], values: [ - { - fieldName: "Amount", - }, - { - fieldName: "Quantity", - } - ] - }, + { + fieldName: "Amount", + }, + { + fieldName: "Quantity", + } + ] + }, enableTooltip: true, isResponsive: true, labelFormatSettings: { decimalPlaces: 2 }, - scales: [{ - showRanges: true, - radius: 150, showScaleBar: true, size: 1, + scales: [{ + showRanges: true, + radius: 150, showScaleBar: true, size: 1, border: { - width: 0.5 - }, - showIndicators: true, showLabels: true, + width: 0.5 + }, + showIndicators: true, showLabels: true, pointers: [{ - showBackNeedle: true, - backNeedleLength: 20, - length: 120, - width: 7 + showBackNeedle: true, + backNeedleLength: 20, + length: 120, + width: 7 }, - { - type: "marker", - markerType: "diamond", - distanceFromScale: 5, - placement: "center", - backgroundColor: "#29A4D9", - length: 25, - width: 15 - }], + { + type: "marker", + markerType: "diamond", + distanceFromScale: 5, + placement: "center", + backgroundColor: "#29A4D9", + length: 25, + width: 15 + }], ticks: [{ - type: "major", + type: "major", distanceFromScale: 2, - height: 16, - width: 1, color: "#8c8c8c" - }, - { - type: "minor", - height: 6, - width: 1, - distanceFromScale: 2, - color: "#8c8c8c" - }], - labels: [{ + height: 16, + width: 1, color: "#8c8c8c" + }, + { + type: "minor", + height: 6, + width: 1, + distanceFromScale: 2, color: "#8c8c8c" }], + labels: [{ + color: "#8c8c8c" + }], ranges: [{ - distanceFromScale: -5, + distanceFromScale: -5, backgroundColor: "#fc0606", - border: { color: "#fc0606" } + border: { color: "#fc0606" } + }, + { + distanceFromScale: -5 + }], + customLabels: [{ + position: { x: 180, y: 290 }, + font: { size: "10px", fontFamily: "Segoe UI", fontStyle: "Normal" }, color: "#666666" }, - { - distanceFromScale: -5 - }], - customLabels: [{ - position: { x: 180, y: 290 }, - font: { size: "10px", fontFamily: "Segoe UI", fontStyle: "Normal" }, color: "#666666" + { + position: { x: 180, y: 320 }, + font: { size: "10px", fontFamily: "Segoe UI", fontStyle: "Normal" }, color: "#666666" }, - { - position: { x: 180, y: 320 }, - font: { size: "10px", fontFamily: "Segoe UI", fontStyle: "Normal" }, color: "#666666" - }, - { - position: { x: 180, y: 150 }, - font: { size: "12px", fontFamily: "Segoe UI", fontStyle: "Normal" }, color: "#666666" - }] + { + position: { x: 180, y: 150 }, + font: { size: "12px", fontFamily: "Segoe UI", fontStyle: "Normal" }, color: "#666666" + }] }] }); - }); + }); } @@ -1467,35 +1468,35 @@ module PivotGaugeRelational { module PivotGridOlap { $(function () { - var sample = new ej.PivotGrid($("#PivotGrid"), { + var sample = new ej.PivotGrid($("#PivotGrid"),{ dataSource: { - data: "//bi.syncfusion.com/olap/msmdpump.dll", - catalog: "Adventure Works DW 2008 SE", - cube: "Adventure Works", - rows: [ - { - fieldName: "[Date].[Fiscal]" - } - ], - columns: [ - { - fieldName: "[Customer].[Customer Geography]" - } - ], - values: [ - { - measures: [ - { - fieldName: "[Measures].[Internet Sales Amount]", - } - ], - axis: "columns" - } - ], - filters: [] - }, - enableGroupingBar: true, - pivotTableFieldListID: "PivotSchemaDesigner" + data: "//bi.syncfusion.com/olap/msmdpump.dll", + catalog: "Adventure Works DW 2008 SE", + cube: "Adventure Works", + rows: [ + { + fieldName: "[Date].[Fiscal]" + } + ], + columns: [ + { + fieldName: "[Customer].[Customer Geography]" + } + ], + values: [ + { + measures: [ + { + fieldName: "[Measures].[Internet Sales Amount]", + } + ], + axis: "columns" + } + ], + filters:[] + }, + enableGroupingBar: true, + pivotTableFieldListID:"PivotSchemaDesigner" }); $("#PivotSchemaDesigner").ejPivotSchemaDesigner(); }); @@ -1532,41 +1533,41 @@ var pivot_dataset = [ module PivotGridRelational { $(function () { - var sample = new ej.PivotGrid($("#PivotGrid"), { + var sample = new ej.PivotGrid($("#PivotGrid"),{ dataSource: { - data: pivot_dataset, - rows: [ - { - fieldName: "Country", - fieldCaption: "Country" - }, - { - fieldName: "State", - fieldCaption: "State" - } - ], - columns: - [{ - fieldName: "Product", - fieldCaption: "Product" - } - ], - values: [ - { - fieldName: "Amount", - fieldCaption: "Amount" - }, - { - fieldName: "Quantity", - fieldCaption: "Quantity" - } - ], - filters: [] - }, - enableGroupingBar: true, - pivotTableFieldListID: "PivotSchemaDesigner" + data: pivot_dataset, + rows: [ + { + fieldName: "Country", + fieldCaption: "Country" + }, + { + fieldName: "State", + fieldCaption: "State" + } + ], + columns: + [{ + fieldName: "Product", + fieldCaption: "Product" + } + ], + values: [ + { + fieldName: "Amount", + fieldCaption: "Amount" + }, + { + fieldName: "Quantity", + fieldCaption: "Quantity" + } + ], + filters:[] + }, + enableGroupingBar: true, + pivotTableFieldListID:"PivotSchemaDesigner" }); - $("#PivotSchemaDesigner").ejPivotSchemaDesigner(); + $("#PivotSchemaDesigner").ejPivotSchemaDesigner(); }); } @@ -1575,33 +1576,33 @@ module PivotGridRelational { module PivotTreeMap { $(function () { - var sample = new ej.PivotTreeMap($("#PivotTreeMap"), { + var sample = new ej.PivotTreeMap($("#PivotTreeMap"),{ dataSource: { - data: "//bi.syncfusion.com/olap/msmdpump.dll;Locale Identifier=1033;", - catalog: "Adventure Works DW 2008 SE", - cube: "Adventure Works", - rows: [ - { - fieldName: "[Customer].[Customer Geography]" - } - ], - columns: [ - { - fieldName: "[Date].[Fiscal]" - } - ], - values: [ - { - measures: [ - { - fieldName: "[Measures].[Customer Count]", - } - ], - axis: "columns" - } - ], - filters: [] - } + data: "//bi.syncfusion.com/olap/msmdpump.dll;Locale Identifier=1033;", + catalog: "Adventure Works DW 2008 SE", + cube: "Adventure Works", + rows: [ + { + fieldName: "[Customer].[Customer Geography]" + } + ], + columns: [ + { + fieldName: "[Date].[Fiscal]" + } + ], + values: [ + { + measures: [ + { + fieldName: "[Measures].[Customer Count]", + } + ], + axis: "columns" + } + ], + filters:[] + } }); }); } @@ -1610,7 +1611,7 @@ module PivotTreeMap { module ProgressBarComponent { $(function () { - var sample = new ej.ProgressBar($("#progressBar"), { + var sample = new ej.ProgressBar($("#progressBar"),{ width: 200, value: 45, height: 20, @@ -1640,7 +1641,7 @@ module RadialMenuComponent { backImageClass: "backimageclass", targetElementId: "radialtarget1" }); - $("#radialtarget1").parent().css("position", "relative"); + $("#radialtarget1").parent().css("position", "relative"); } else { $("#contentDiv").html("Radial Menu is only supported from Internet Explorer Versioned 9 and above.").css({ "font-size": "20px", "color": "red" }); @@ -1707,12 +1708,12 @@ function redo(e: any) { } - + module RadialSliderComponent { $(function () { var radialsliderInstance = new ej.RadialSlider($("#radialSlider"), { - innerCircleImageUrl: "images/radialslider/chevron-right.png" + innerCircleImageUrl: "images/radialslider/chevron-right.png" }); }); } @@ -1809,8 +1810,8 @@ var data; data = GetData(); function GetData() { - var series1: any[] = []; - var series2: any[] = []; + var series1:any[]=[]; + var series2:any[]= []; var value = 100; var value1 = 120; for (var i = 1; i < 730; i++) { @@ -1837,7 +1838,7 @@ function GetData() { module RatingComponent { $(function () { - var sample1 = new ej.Rating($("#fullRating"), { + var sample1 = new ej.Rating($("#fullRating"),{ value: 4, precision: ej.Rating.Precision.Full, allowReset: true, @@ -1852,8 +1853,8 @@ module RatingComponent { shapeWidth: 25, showTooltip: true }); - - var sample2 = new ej.Rating($("#halfRating"), { + + var sample2 = new ej.Rating($("#halfRating"),{ precision: ej.Rating.Precision.Half, value: 3.5, allowReset: true, @@ -1869,7 +1870,7 @@ module RatingComponent { showTooltip: true }); - var sample3 = new ej.Rating($("#exactRating"), { + var sample3 = new ej.Rating($("#exactRating"),{ precision: ej.Rating.Precision.Exact, value: 3.7, allowReset: true, @@ -1883,7 +1884,7 @@ module RatingComponent { shapeHeight: 25, shapeWidth: 25, showTooltip: true - }); + }); }); } @@ -1891,15 +1892,15 @@ module RatingComponent { module ReportViewerComponent { - $(function () { - var report = new ej.ReportViewer($("#territoryReportViewer"), { - reportServiceUrl: (window).baseurl + 'api/ReportViewer', - reportServerUrl: 'http://104.207.134.201/reportserver', - processingMode: ej.ReportViewer.ProcessingMode.Remote, - reportPath: "/SSRSSamples2/Territory Sales new", - isResponsive: true - }); - }); + $(function () { + var report = new ej.ReportViewer($("#territoryReportViewer"), { + reportServiceUrl: (window).baseurl + 'api/ReportViewer', + reportServerUrl: 'http://104.207.134.201/reportserver', + processingMode: ej.ReportViewer.ProcessingMode.Remote, + reportPath: "/SSRSSamples2/Territory Sales new", + isResponsive: true + }); + }); } @@ -1916,7 +1917,7 @@ module RibbonComponent { toolTip: "Pin the Ribbon" }, applicationTab: { - type: ej.Ribbon.ApplicationTabType.Menu, menuItemID: "ribbonmenu", menuSettings: { openOnClick: false } + type: ej.Ribbon.ApplicationTabType.Menu, menuItemID: "ribbonmenu", menuSettings: { openOnClick: false } }, tabs: [{ id: "home", text: "HOME", groups: [{ @@ -1940,7 +1941,7 @@ module RibbonComponent { } }] }, - { + { text: "Clipboard", alignType: ej.Ribbon.AlignType.Columns, content: [{ groups: [{ id: "paste", @@ -1962,8 +1963,8 @@ module RibbonComponent { height: 70 } }, - { - groups: [{ + { + groups: [{ id: "cut", text: "Cut", toolTip: "Cut", @@ -1993,14 +1994,14 @@ module RibbonComponent { prefixIcon: "e-icon e-ribbon clearAll" } }], - defaults: { + defaults: { type: "button", width: 60, isBig: false } - }] - }, - { + }] + }, + { text: "Font", alignType: "rows", content: [{ groups: [{ id: "fontfamily", @@ -2299,7 +2300,7 @@ module RibbonComponent { groups: [{ id: "zoomin", text: "Zoom In", - toolTip: "Zoom In", + toolTip: "Zoom In", buttonSettings: { width: 58, click: "onClick", @@ -2311,7 +2312,7 @@ module RibbonComponent { { id: "zoomout", text: "Zoom Out", - toolTip: "Zoom Out", + toolTip: "Zoom Out", buttonSettings: { width: 70, click: "onClick", @@ -2323,7 +2324,7 @@ module RibbonComponent { { id: "fullscreen", text: "Full Screen", - toolTip: "Full Screen", + toolTip: "Full Screen", buttonSettings: { width: 73, click: "onClick", @@ -2339,7 +2340,7 @@ module RibbonComponent { } }] }] - }, { + },{ id: "insert", text: "INSERT", groups: [{ text: "Tables", alignType: ej.Ribbon.AlignType.Columns, content: [{ groups: [{ @@ -2484,7 +2485,7 @@ module RibbonComponent { } ], defaults: { - type: "button", + type: "button", width: 70, height: 70 } @@ -2566,7 +2567,7 @@ module RibbonComponent { } ] } - ], + ], create: function createControl(args) { var ribbon = $("#defaultRibbon").data("ejRibbon"); $("#fontcolor").ejColorPicker({ value: "#FFFF00", modelType: "palette", cssClass: "e-ribbon", toolIcon: "e-fontcoloricon", select: colorHandler }); @@ -2578,7 +2579,7 @@ module RibbonComponent { function colorHandler(args:any) { (this._id.indexOf("fillcolor") != -1) ? $("#contenteditor").css('background-color', args.value) : document.execCommand('forecolor', false, args.value); } -function onClick(args: any) { +function onClick(args:any) { var val, prop = args.text; val = (ej.isNullOrUndefined(args.model.text)) ? args.model.activeText : args.model.text; if (action1.indexOf(val) != -1) @@ -2596,7 +2597,7 @@ function onClick(args: any) { - + module RotatorComponent { $(function () { @@ -2606,14 +2607,14 @@ module RotatorComponent { slideHeight: "auto", displayItemsCount: "1", navigateSteps: "1", - pagerPosition: "outside", + pagerPosition:"outside", orientation: "horizontal", showPager: true, enabled: true, showCaption: true, allowKeyboardNavigation: true, showPlayButton: true, - isResponsive: true, + isResponsive:true, animationType: "slide", }); }); @@ -2623,7 +2624,7 @@ module RotatorComponent { module RTEComponent { $(function () { - var sample = new ej.RTE($("#rteSample"), { + var sample = new ej.RTE($("#rteSample"),{ width: "100%", minWidth: "150px", showFooter: true, @@ -2759,7 +2760,7 @@ module ScheduleComponent { } }); }); -} +} @@ -2819,10 +2820,10 @@ module linesparkline { dataSource: [12, 14, 11, 12, 11, 15, 12, 10, 11, 12, 15, 13, 12, 11, 10, 13, 15, 12, 14, 16, 14, 12, 11], tooltip: { visible: true, - font: { size: "12px" } + font: { size:"12px" } }, type: "line", - size: { height: "40", width: "170" }, + size: { height: "40", width:"170" }, }); }); } @@ -2830,7 +2831,7 @@ module linesparkline { module columnsparkline { $(function () { var sparkcolumnsample = new ej.Sparkline($("#column"), { - dataSource: [2, 6, -1, 1, 12, 5, -2, 7, -3, 5, 8, 10, ], + dataSource: [2, 6, -1, 1, 12, 5, -2, 7, -3, 5, 8, 10,], negativePointColor: "red", highPointColor: "blue", tooltip: { @@ -2848,7 +2849,7 @@ module columnsparkline { module areasparkline { $(function () { var sparkareasample = new ej.Sparkline($("#area"), { - dataSource: [12, -10, 11, 8, 17, 6, 2, -17, 13, -6, 8, 10, ], + dataSource: [12, -10, 11, 8, 17, 6, 2, -17, 13, -6, 8, 10,], markerSettings: { visible: true }, highPointColor: "blue", lowPointColor: "orange", @@ -2868,7 +2869,7 @@ module areasparkline { module windlosssparkline { $(function () { var sparkwinlosssample = new ej.Sparkline($("#winloss"), { - dataSource: [12, 15, -11, 13, 17, 0, -12, 17, 13, -15, 8, 10, ], + dataSource: [12, 15, -11, 13, 17, 0, -12, 17, 13, -15, 8, 10,], type: "winloss", size: { height: "100", width: "150" }, }); @@ -2894,7 +2895,7 @@ module piesparkline1 { module piesparkline2 { $(function () { var sparkpiesample2 = new ej.Sparkline($("#pie2"), { - dataSource: [8, 9, 1, ], + dataSource: [8, 9, 1,], type: "pie", tooltip: { visible: true, @@ -2939,9 +2940,9 @@ module piesparkline4 { }); } + - - + module SplitterComponent { @@ -2951,10 +2952,10 @@ module SplitterComponent { width: "50%", orientation: ej.Orientation.Vertical, properties: [{}, { paneSize: 80 }], - isResponsive: true + isResponsive:true }); var splitterInstance1 = new ej.Splitter($("#innerSpliter"), { - isResponsive: true, + isResponsive:true, }); }); } @@ -2962,7 +2963,7 @@ module SplitterComponent { module SpreadsheetComponent { - $(function () { +$(function () { var sample = new ej.Spreadsheet($("#basicSpreadsheet"), { scrollSettings: { height: 550, @@ -2976,15 +2977,14 @@ module SpreadsheetComponent { pdfUrl: (window).baseurl + "api/Spreadsheet/PdfExport" }, sheets: [{ rangeSettings: [{ dataSource: (window).defaultData, startCell: "A1" }] }], - loadComplete: () => { - var spreadsheet = $("#basicSpreadsheet").data("ejSpreadsheet"), xlFormat = spreadsheet.XLFormat; - if (!(spreadsheet).isImport) { - spreadsheet.setWidthToColumns([140, 128, 105, 100, 100, 110, 120, 120, 100]); - xlFormat.format({ "style": { "font-weight": "bold" } }, "A1:H1"); - xlFormat.format({ "type": "currency" }, "E2:H11"); - spreadsheet.XLRibbon.updateRibbonIcons(); - } - } + loadComplete: () => { + var spreadsheet = $("#basicSpreadsheet").data("ejSpreadsheet"), xlFormat = spreadsheet.XLFormat; + if (!(spreadsheet).isImport) { + spreadsheet.setWidthToColumns([140, 128, 105, 100, 100, 110, 120, 120, 100]); + xlFormat.format({ "style": { "font-weight": "bold" } }, "A1:H1"); + xlFormat.format({ "type": "currency" }, "E2:H11"); + spreadsheet.XLRibbon.updateRibbonIcons(); + }} }); }); } @@ -2993,58 +2993,58 @@ module SpreadsheetComponent { var default_data: Array = [ - { Category: "Employees", Country: "USA", JobDescription: "Sales", JobGroup: "Executive", EmployeesCount: 50 }, - { Category: "Employees", Country: "USA", JobDescription: "Sales", JobGroup: "Analyst", EmployeesCount: 40 }, - { Category: "Employees", Country: "USA", JobDescription: "Marketing", EmployeesCount: 40 }, - { Category: "Employees", Country: "USA", JobDescription: "Technical", JobGroup: "Testers", EmployeesCount: 55 }, - { Category: "Employees", Country: "USA", JobDescription: "Technical", JobGroup: "Developers", JobRole: "Windows", EmployeesCount: 175 }, - { Category: "Employees", Country: "USA", JobDescription: "Technical", JobGroup: "Developers", JobRole: "Web", EmployeesCount: 70 }, - { Category: "Employees", Country: "USA", JobDescription: "Management", EmployeesCount: 40 }, - { Category: "Employees", Country: "USA", JobDescription: "Accounts", EmployeesCount: 60 }, - - { Category: "Employees", Country: "India", JobDescription: "Technical", JobGroup: "Testers", EmployeesCount: 43 }, - { Category: "Employees", Country: "India", JobDescription: "Technical", JobGroup: "Developers", JobRole: "Windows", EmployeesCount: 125 }, - { Category: "Employees", Country: "India", JobDescription: "Technical", JobGroup: "Developers", JobRole: "Web", EmployeesCount: 60 }, - { Category: "Employees", Country: "India", JobDescription: "HR Executives", EmployeesCount: 70 }, - { Category: "Employees", Country: "India", JobDescription: "Accounts", EmployeesCount: 45 }, - - { Category: "Employees", Country: "Germany", JobDescription: "Sales", JobGroup: "Executive", EmployeesCount: 30 }, - { Category: "Employees", Country: "Germany", JobDescription: "Sales", JobGroup: "Analyst", EmployeesCount: 40 }, - { Category: "Employees", Country: "Germany", JobDescription: "Marketing", EmployeesCount: 50 }, - { Category: "Employees", Country: "Germany", JobDescription: "Technical", JobGroup: "Testers", EmployeesCount: 40 }, - { Category: "Employees", Country: "Germany", JobDescription: "Technical", JobGroup: "Developers", JobRole: "Windows", EmployeesCount: 65 }, - { Category: "Employees", Country: "Germany", JobDescription: "Technical", JobGroup: "Developers", JobRole: "Web", EmployeesCount: 27 }, - { Category: "Employees", Country: "Germany", JobDescription: "Management", EmployeesCount: 33 }, - { Category: "Employees", Country: "Germany", JobDescription: "Accounts", EmployeesCount: 55 }, - - { Category: "Employees", Country: "UK", JobDescription: "Technical", JobGroup: "Testers", EmployeesCount: 45 }, - { Category: "Employees", Country: "UK", JobDescription: "Technical", JobGroup: "Developers", JobRole: "Windows", EmployeesCount: 96 }, - { Category: "Employees", Country: "UK", JobDescription: "Technical", JobGroup: "Developers", JobRole: "Web", EmployeesCount: 55 }, - { Category: "Employees", Country: "UK", JobDescription: "HR Executives", EmployeesCount: 60 }, - { Category: "Employees", Country: "UK", JobDescription: "Accounts", EmployeesCount: 30 }, - - { Category: "Employees", Country: "France", JobDescription: "Technical", JobGroup: "Testers", EmployeesCount: 40 }, - { Category: "Employees", Country: "France", JobDescription: "Technical", JobGroup: "Developers", JobRole: "Windows", EmployeesCount: 65 }, - { Category: "Employees", Country: "France", JobDescription: "Technical", JobGroup: "Developers", JobRole: "Web", EmployeesCount: 27 }, - { Category: "Employees", Country: "France", JobDescription: "Marketing", EmployeesCount: 50 } + { Category : "Employees", Country : "USA", JobDescription : "Sales", JobGroup:"Executive", EmployeesCount : 50 }, + { Category : "Employees", Country : "USA", JobDescription : "Sales", JobGroup : "Analyst", EmployeesCount : 40 }, + { Category : "Employees", Country : "USA", JobDescription : "Marketing", EmployeesCount : 40 }, + { Category : "Employees", Country : "USA", JobDescription : "Technical", JobGroup : "Testers", EmployeesCount : 55 }, + { Category : "Employees", Country : "USA", JobDescription : "Technical", JobGroup : "Developers", JobRole : "Windows", EmployeesCount : 175}, + { Category : "Employees", Country : "USA", JobDescription : "Technical", JobGroup : "Developers", JobRole : "Web", EmployeesCount : 70 }, + { Category : "Employees", Country : "USA", JobDescription : "Management", EmployeesCount : 40 }, + { Category : "Employees", Country : "USA", JobDescription : "Accounts", EmployeesCount : 60 }, + + { Category : "Employees", Country : "India", JobDescription : "Technical", JobGroup : "Testers", EmployeesCount : 43 }, + { Category : "Employees", Country : "India", JobDescription : "Technical", JobGroup : "Developers", JobRole : "Windows", EmployeesCount : 125}, + { Category : "Employees", Country : "India", JobDescription : "Technical", JobGroup : "Developers", JobRole : "Web", EmployeesCount : 60 }, + { Category : "Employees", Country : "India", JobDescription : "HR Executives", EmployeesCount : 70 }, + { Category : "Employees", Country : "India", JobDescription : "Accounts", EmployeesCount : 45 }, + + { Category : "Employees", Country : "Germany", JobDescription : "Sales", JobGroup : "Executive", EmployeesCount : 30 }, + { Category : "Employees", Country : "Germany", JobDescription : "Sales", JobGroup : "Analyst", EmployeesCount : 40 }, + { Category : "Employees", Country : "Germany", JobDescription : "Marketing", EmployeesCount : 50 }, + { Category : "Employees", Country : "Germany", JobDescription : "Technical", JobGroup : "Testers", EmployeesCount : 40 }, + { Category : "Employees", Country : "Germany", JobDescription : "Technical", JobGroup : "Developers", JobRole : "Windows", EmployeesCount : 65 }, + { Category : "Employees", Country : "Germany", JobDescription : "Technical", JobGroup : "Developers", JobRole : "Web", EmployeesCount : 27 }, + { Category : "Employees", Country : "Germany", JobDescription : "Management", EmployeesCount : 33 }, + { Category : "Employees", Country : "Germany", JobDescription : "Accounts", EmployeesCount : 55 }, + + { Category : "Employees", Country : "UK", JobDescription : "Technical", JobGroup : "Testers", EmployeesCount : 45 }, + { Category : "Employees", Country : "UK", JobDescription : "Technical", JobGroup : "Developers", JobRole : "Windows", EmployeesCount : 96 }, + { Category : "Employees", Country : "UK", JobDescription : "Technical", JobGroup : "Developers", JobRole : "Web", EmployeesCount : 55 }, + { Category : "Employees", Country : "UK", JobDescription : "HR Executives", EmployeesCount : 60 }, + { Category : "Employees", Country : "UK", JobDescription: "Accounts", EmployeesCount: 30 }, + + { Category : "Employees", Country : "France", JobDescription : "Technical", JobGroup : "Testers", EmployeesCount : 40 }, + { Category : "Employees", Country : "France", JobDescription : "Technical", JobGroup : "Developers", JobRole : "Windows", EmployeesCount : 65 }, + { Category : "Employees", Country : "France", JobDescription : "Technical", JobGroup : "Developers", JobRole : "Web", EmployeesCount : 27 }, + { Category : "Employees", Country : "France", JobDescription: "Marketing", EmployeesCount: 50 } ]; module sunburstcomponent { $(function () { var sunburstsample = new ej.SunburstChart($("#Sunburst"), { - valueMemberPath: "EmployeesCount", + valueMemberPath: "EmployeesCount", levels: [ - { groupMemberPath: "Country" }, - { groupMemberPath: "JobDescription" }, - { groupMemberPath: "JobGroup" }, - { groupMemberPath: "JobRole" } + {groupMemberPath: "Country"}, + {groupMemberPath: "JobDescription"}, + {groupMemberPath: "JobGroup"}, + {groupMemberPath: "JobRole"} ], dataSource: default_data, - dataLabelSettings: { visible: true }, - tooltip: { visible: false }, - enableAnimation: false, - size: { height: "600" }, - innerRadius: 0.2, + dataLabelSettings:{visible:true}, + tooltip:{visible:false}, + enableAnimation:false, + size:{height:"600"}, + innerRadius:0.2, load: function () { var sender = $("#Sunburst").data("ejSunburstChart"); var SunBurstTheme = (window).themeStyle + (window).themeColor + (window).themeVarient; @@ -3055,10 +3055,10 @@ module sunburstcomponent { SunBurstTheme = "flatlight"; sender.model.theme = SunBurstTheme; }, - title: { text: "Employees Count" }, - zoomSettings: { enable: false }, - legend: { visible: true, position: 'top' } - // load:"loadTheme" + title:{text:"Employees Count"}, + zoomSettings:{enable:false}, + legend:{visible:true,position:'top'} + // load:"loadTheme" }); }); } @@ -3068,7 +3068,7 @@ module sunburstcomponent { module TabComponent { $(function () { - var sample = new ej.Tab($("#defaultTab"), { + var sample = new ej.Tab($("#defaultTab"),{ width: "500px", collapsible: true, events: "click", @@ -3082,8 +3082,8 @@ module TabComponent { module TagCloudComponent { - - + + var websiteCollection = [ { text: "Google", url: "http://www.google.com", frequency: 12 }, { text: "All Things Digital", url: "http://allthingsd.com/", frequency: 3 }, @@ -3114,7 +3114,7 @@ module TagCloudComponent { text: "text", url: "url", frequency: "frequency" } }); - + }); } @@ -3154,82 +3154,82 @@ module EditorComponent { - + module TileViewComponent { $(function () { var tile1 = new ej.Tile($("#tile1"), { - imagePosition: "fill", - caption: { text: "People" }, - tileSize: "medium", - imageUrl: 'content/images/tile/windows/people_1.png' + imagePosition:"fill", + caption:{text:"People"}, + tileSize:"medium", + imageUrl:'content/images/tile/windows/people_1.png' }); - var tile2 = new ej.Tile($("#tile2"), { - imagePosition: "center", - tileSize: "small", - imageUrl: 'content/images/tile/windows/alerts.png', - + var tile2 = new ej.Tile($("#tile2"), { + imagePosition:"center", + tileSize:"small", + imageUrl:'content/images/tile/windows/alerts.png', + }); - var tile3 = new ej.Tile($("#tile3"), { - imagePosition: "center", - tileSize: "small", - imageUrl: 'content/images/tile/windows/bing.png', + var tile3 = new ej.Tile($("#tile3"), { + imagePosition:"center", + tileSize:"small", + imageUrl:'content/images/tile/windows/bing.png', }); - var tile4 = new ej.Tile($("#tile4"), { - tileSize: "small", - imageUrl: 'content/images/tile/windows/camera.png', + var tile4 = new ej.Tile($("#tile4"), { + tileSize:"small", + imageUrl:'content/images/tile/windows/camera.png', }); - var tile5 = new ej.Tile($("#tile5"), { - imagePosition: "center", - tileSize: "small", - imageUrl: 'content/images/tile/windows/messages.png', + var tile5 = new ej.Tile($("#tile5"), { + imagePosition:"center", + tileSize:"small", + imageUrl:'content/images/tile/windows/messages.png', }); - var tile6 = new ej.Tile($("#tile6"), { - imagePosition: "center", - tileSize: "medium", - imageUrl: 'content/images/tile/windows/games.png', - caption: { text: "Play" } + var tile6 = new ej.Tile($("#tile6"), { + imagePosition:"center", + tileSize:"medium", + imageUrl:'content/images/tile/windows/games.png', + caption:{text:"Play"} }); - var tile7 = new ej.Tile($("#tile7"), { - tileSize: "medium", - imageUrl: 'content/images/tile/windows/map.png', - caption: { text: "Maps" } + var tile7 = new ej.Tile($("#tile7"), { + tileSize:"medium", + imageUrl:'content/images/tile/windows/map.png', + caption:{text:"Maps"} }); - var tile8 = new ej.Tile($("#tile8"), { - imagePosition: "fill", - tileSize: "wide", - imageUrl: 'content/images/tile/windows/sports.png', - caption: { text: "Sports" } + var tile8 = new ej.Tile($("#tile8"), { + imagePosition:"fill", + tileSize:"wide", + imageUrl:'content/images/tile/windows/sports.png', + caption:{text:"Sports"} }); - var tile9 = new ej.Tile($("#tile9"), { - imagePosition: "fill", - tileSize: "medium", - imageUrl: 'content/images/tile/windows/people_2.png', - caption: { text: "People" } + var tile9 = new ej.Tile($("#tile9"), { + imagePosition:"fill", + tileSize:"medium", + imageUrl:'content/images/tile/windows/people_2.png', + caption:{text:"People"} }); - var tile10 = new ej.Tile($("#tile10"), { - imagePosition: "center", - tileSize: "medium", - imageUrl: 'content/images/tile/windows/pictures.png', - caption: { text: "Photo" } + var tile10 = new ej.Tile($("#tile10"), { + imagePosition:"center", + tileSize:"medium", + imageUrl:'content/images/tile/windows/pictures.png', + caption:{text:"Photo"} }); - var tile11 = new ej.Tile($("#tile11"), { - imagePosition: "center", - tileSize: "wide", - imageUrl: 'content/images/tile/windows/weather.png', - caption: { text: "Weather" } + var tile11 = new ej.Tile($("#tile11"), { + imagePosition:"center", + tileSize:"wide", + imageUrl:'content/images/tile/windows/weather.png', + caption:{text:"Weather"} }); - var tile12 = new ej.Tile($("#tile12"), { - imagePosition: "center", - tileSize: "medium", - imageUrl: 'content/images/tile/windows/music.png', - caption: { text: "Music" } + var tile12 = new ej.Tile($("#tile12"), { + imagePosition:"center", + tileSize:"medium", + imageUrl:'content/images/tile/windows/music.png', + caption:{text:"Music"} }); - var tile13 = new ej.Tile($("#tile13"), { - imagePosition: "center", - tileSize: "medium", - imageUrl: 'content/images/tile/windows/favs.png', - caption: { text: "Favorites" } + var tile13 = new ej.Tile($("#tile13"), { + imagePosition:"center", + tileSize:"medium", + imageUrl:'content/images/tile/windows/favs.png', + caption:{text:"Favorites"} }); }); } @@ -3248,13 +3248,13 @@ module TimePickerComponent { module ToolbarComponent { - + $(function () { - var sample = new ej.Toolbar($("#editingToolbar"), { + var sample = new ej.Toolbar($("#editingToolbar"),{ width: "100%", cssClass: "gradient-lime", enableSeparator: true, - + isResponsive: true, orientation: ej.Orientation.Horizontal, showRoundedCorner: true @@ -3267,10 +3267,10 @@ module ToolbarComponent { module TooltipComponent { - + $(function () { - var sample1 = new ej.Tooltip($("#link1"), { + var sample1 = new ej.Tooltip($("#link1"),{ content: "ECMAScript (or ES) is a trademarked scripting-language specification standardized by Ecma International in ECMA-262 and ISO/IEC 16262.", associate: "mousefollow", autoCloseTimeout: 5000, @@ -3280,7 +3280,7 @@ module TooltipComponent { showShadow: true }); - var sample2 = new ej.Tooltip($("#link2"), { + var sample2 = new ej.Tooltip($("#link2"),{ content: "The World Wide Web (WWW) is an information space where documents and other web resources are identified by URLs, interlinked by hypertext links, and can be accessed via the Internet.", position: { stem: { @@ -3299,7 +3299,7 @@ module TooltipComponent { showShadow: true }); - var sample3 = new ej.Tooltip($("#link3"), { + var sample3 = new ej.Tooltip($("#link3"),{ content: 'Object-oriented programming (OOP) is a programming language model organized around objects rather than "actions" and data rather than logic.', position: { stem: { @@ -3326,43 +3326,43 @@ module TooltipComponent { module TreeGridComponent { $(function () { var treegridInstance = new ej.TreeGrid($("#TreeGridContainer"), { - dataSource: (window).treeGridData, - childMapping: "subtasks", - allowSorting: true, - allowMultiSorting: true, - enableAltRow: true, - allowFiltering: true, - treeColumnIndex: 1, - allowKeyboardNavigation: true, - showColumnChooser: true, - showColumnOptions: true, - contextMenuSettings: { - showContextMenu: true, - contextMenuItems: ["add", "edit", "delete"] - }, - columnDialogFields: ["field", "headerText", "editType", "width", "visible", "allowSorting", "textAlign", "headerTextAlign"], - editSettings: { - allowAdding: true, - allowEditing: true, - allowDeleting: true, - editMode: "cellEditing", - rowPosition: "belowSelectedRow" - }, - toolbarSettings: { - showToolbar: true, - toolbarItems: ["add", "edit", "delete", "update", "cancel", "expandAll", "collapseAll"] - }, - columns: [ - { field: "taskID", headerText: "Task Id", allowFiltering: false, editType: "numericedit", filterEditType: "numericedit" }, - { field: "taskName", headerText: "Task Name", editType: "stringedit", filterEditType: "stringedit" }, - { field: "startDate", headerText: "Start Date", editType: "datepicker", filterEditType: "datepicker", format: "{0:MM/dd/yyyy}" }, - { field: "endDate", headerText: "End Date", editType: "datepicker", filterEditType: "datepicker", format: "{0:MM/dd/yyyy}" }, - { field: "progress", headerText: "Progress", editType: "numericedit", filterEditType: "numericedit" } - ], - isResponsive: true, - }); + dataSource: (window).treeGridData, + childMapping: "subtasks", + allowSorting: true, + allowMultiSorting: true, + enableAltRow: true, + allowFiltering: true, + treeColumnIndex: 1, + allowKeyboardNavigation: true, + showColumnChooser: true, + showColumnOptions: true, + contextMenuSettings: { + showContextMenu: true, + contextMenuItems: ["add", "edit", "delete"] + }, + columnDialogFields: ["field", "headerText", "editType", "width", "visible", "allowSorting", "textAlign", "headerTextAlign"], + editSettings: { + allowAdding: true, + allowEditing: true, + allowDeleting: true, + editMode: "cellEditing", + rowPosition: "belowSelectedRow" + }, + toolbarSettings: { + showToolbar: true, + toolbarItems: ["add","edit","delete","update","cancel","expandAll","collapseAll"] + }, + columns: [ + { field: "taskID", headerText: "Task Id", allowFiltering: false, editType: "numericedit", filterEditType: "numericedit" }, + { field: "taskName", headerText: "Task Name", editType: "stringedit", filterEditType: "stringedit" }, + { field: "startDate", headerText: "Start Date", editType: "datepicker", filterEditType: "datepicker", format:"{0:MM/dd/yyyy}" }, + { field: "endDate", headerText: "End Date", editType: "datepicker", filterEditType: "datepicker", format:"{0:MM/dd/yyyy}" }, + { field: "progress", headerText: "Progress", editType: "numericedit", filterEditType: "numericedit" } + ], + isResponsive: true, }); -} +}); +} @@ -3407,7 +3407,7 @@ module treemapcomponent { - + module TreeViewComponent { $(function () { @@ -3424,9 +3424,9 @@ module TreeViewComponent { module UploadboxComponent { - + $(function () { - var sample = new ej.Uploadbox($("#UploadDefault"), { + var sample = new ej.Uploadbox($("#UploadDefault"),{ saveUrl: (window).baseurl + "api/uploadbox/Save", removeUrl: (window).baseurl + "api/uploadbox/Remove", buttonText: { @@ -3449,12 +3449,12 @@ module UploadboxComponent { module WaitingPopupComponent { $(function () { - var sample = new ej.WaitingPopup($("#target"), { + var sample = new ej.WaitingPopup($("#target"),{ showOnInit: true, showImage: true, text: 'waiting…', - target: "#target", - appendTo: "#waiting" + target: "#target", + appendTo: "#waiting" }); }); diff --git a/types/ej.web.all/index.d.ts b/types/ej.web.all/index.d.ts index 03f6b12c24..2342262ca6 100644 --- a/types/ej.web.all/index.d.ts +++ b/types/ej.web.all/index.d.ts @@ -2,13 +2,13 @@ // Project: http://help.syncfusion.com/js/typescript // Definitions by: Syncfusion // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped -// TypeScript Version: 2.3 +// TypeScript Version:2.3 /// /*! * filename: ej.web.all.d.ts -* version : 16.1.0.24 +* version : 16.1.0.32 * Copyright Syncfusion Inc. 2001 - 2018. All rights reserved. * Use of this code is subject to the terms of our license. * A copy of the current license can be obtained at any time by e-mailing @@ -378,7 +378,7 @@ declare namespace ej { update(dm: ej.DataManager, keyField: string, value: any, tableName: string): any; } class ForeignKeyAdaptor extends ej.JsonAdaptor { - constructor(); + constructor(data: any, type: string); processQuery(ds: any, query: ej.Query): any; insert(dm: ej.DataManager, data: any, tableName: string): { url: string; data: any }; update(dm: ej.DataManager, keyField: string, value: any, tableName: string): { url: string; type: string; data: any }; @@ -9567,8 +9567,8 @@ declare namespace ej { */ cssClass?: string; - /** Sets the separator when the multiSelectMode with delimiter option or checkbox is enabled.When you enter the delimiter value, the text after the delimiter is considered as a - * separateword or query. The delimiter string is a single character and must be a symbol. Mostly,the delimiter symbol is used as comma (,), semi-colon (;), or any other special + /** Sets the separator when the multiSelectMode with delimiter option or checkbox is enabled. When you enter the delimiter value, the text after the delimiter is considered as a + * separate word or query. The delimiter string is a single character and must be a symbol. Mostly, the delimiter symbol is used as comma (,), semi-colon (;), or any other special * character. * @Default {,} */ @@ -9628,12 +9628,12 @@ declare namespace ej { */ readOnly?: boolean; - /** The DropDownTree’s textbox is displayed with rounded corner style. + /** The DropDownTree's textbox is displayed with rounded corner style. * @Default {false} */ showRoundedCorner?: boolean; - /** Specifies the targetID for the DropDownTree’s items. + /** Specifies the targetID for the DropDownTree's items. * @Default {null} */ targetID?: string; @@ -9653,8 +9653,8 @@ declare namespace ej { */ validationRules?: any; - /** Specifies the value (text content) for the DropDownTree control. For the single selection mode, the selected item’s value will be returned in its data type, and for - * MultiSelectMode, returns the selected items’ values separated by delimiter in string type. + /** Specifies the value (text content) for the DropDownTree control. For the single selection mode, the selected item's value will be returned in its data type, and for + * MultiSelectMode, returns the selected items values separated by delimiter in string type. * @Default {null} */ value?: string; @@ -9678,7 +9678,7 @@ declare namespace ej { */ blur?(e: BlurEventArgs): void; - /** Fires the action when the DropDownTree control’s value is changed. + /** Fires the action when the DropDownTree control's value is changed. */ change?(e: ChangeEventArgs): void; @@ -9744,15 +9744,15 @@ declare namespace ej { */ model?: any; - /** Selected item’s text. + /** Selected item's text. */ selectedText?: string; - /** Selected item’s text. + /** Selected item's text. */ text?: string; - /** Selected item’s value. + /** Selected item's value. */ value?: string; @@ -9779,11 +9779,11 @@ declare namespace ej { */ model?: any; - /** Selected item’s text. + /** Selected item's text. */ text?: string; - /** Selected item’s value. + /** Selected item's value. */ value?: string; @@ -9810,11 +9810,11 @@ declare namespace ej { */ model?: any; - /** Selected item’s text. + /** Selected item's text. */ text?: string; - /** Selected item’s value. + /** Selected item's value. */ value?: string; } @@ -9863,7 +9863,7 @@ declare namespace ej { */ model?: any; - /** Selected item’s text. + /** Selected item's text. */ selectedText?: string; @@ -9905,11 +9905,11 @@ declare namespace ej { */ model?: any; - /** Selected item’s text. + /** Selected item's text. */ text?: string; - /** Selected item’s value. + /** Selected item's value. */ value?: string; } @@ -9928,11 +9928,11 @@ declare namespace ej { */ model?: any; - /** Selected item’s text. + /** Selected item's text. */ text?: string; - /** Selected item’s value. + /** Selected item's value. */ value?: string; @@ -9961,7 +9961,7 @@ declare namespace ej { } } enum Textmode { - //When TextMode property is set to none, only selected/checked node’s text is presented. + //When TextMode property is set to none, only selected/checked node's text is presented. None, //When FullPath option is selected, the full path of the selected node is shown in the control. FullPath, @@ -19622,6 +19622,11 @@ declare namespace ej { */ value?: string|Date; + /** Specifies the water mark text to be displayed in input text. + * @Default {select a time} + */ + watermarkText?: string; + /** Defines the width of the TimePicker textbox. */ width?: string|number; @@ -30758,6 +30763,11 @@ declare namespace ej { */ operationalMode?: ej.Pivot.OperationalMode|string; + /** To override x axis for particular series, create an axis object by providing unique name by using name property and add it to axes array. + * @Default {[]} + */ + axes?: any[]; + /** This is a horizontal axis that contains options to configure the axis and it is the primary x-axis for all series in the series array. To override x-axis for particular series, * create an axis object by providing a unique name by using the name property and add it to the axes array. Then, assign the name to the series’s xAxisName property to link both * the axis and the series. @@ -30818,10 +30828,6 @@ declare namespace ej { */ beforeServiceInvoke?(e: BeforeServiceInvokeEventArgs): void; - /** Triggers before the pivot engine starts to populate. - */ - beforePivotEnginePopulate?(e: BeforePivotEnginePopulateEventArgs): void; - /** Triggers when performing drill up/down operation in the pivot chart control. */ drillSuccess?(e: DrillSuccessEventArgs): void; @@ -30888,13 +30894,6 @@ declare namespace ej { element?: any; } - export interface BeforePivotEnginePopulateEventArgs { - - /** returns the current instance of PivotChart. - */ - chartObj?: any; - } - export interface DrillSuccessEventArgs { /** returns the current instance of PivotChart. @@ -33505,6 +33504,11 @@ declare namespace ej { */ allowInline?: boolean; + /** When set to false, disables the appointment delete option on the Scheduler. + * @Default {true} + */ + allowDelete?: boolean; + /** When set to true, Scheduler allows interaction through keyboard shortcut keys. * @Default {true} */ @@ -37077,6 +37081,11 @@ declare namespace ej { * @Default {0} */ weekStartDay?: number; + + /** Enable or disable the automatic timescale update on cell editing, dialog editing and taskbar editing. + * @Default {true} + */ + updateTimescaleView?: boolean; } export interface SelectedCellIndex { @@ -38114,6 +38123,14 @@ declare namespace ej { */ sortColumn(fieldName: string, columnSortDirection: string): void; + /** To move the TreeGrid rows programmatically with from index ,to index and position. + * @param {number} you can pass drag Index of the row + * @param {number} you can pass target Index of the row. + * @param {string} you can pass the drop position as above,below,child + * @returns {void} + */ + moveRow(fromIndex: number, toIndex: number, position: string): void; + /** To reorder the column with field name and target index values * @param {string} you can pass a name of column to reorder. * @param {string} you can pass a target column index to be inserted. @@ -38651,6 +38668,10 @@ declare namespace ej { */ rowDragStop?(e: RowDragStopEventArgs): void; + /** Triggered before row drop action begins. + */ + rowDropActionBegin?(e: RowDropActionBeginEventArgs): void; + /** Triggered before selecting a cell */ cellSelecting?(e: CellSelectingEventArgs): void; @@ -39378,6 +39399,45 @@ declare namespace ej { type?: string; } + export interface RowDropActionBeginEventArgs { + + /** Returns the cancel option value. + */ + cancel?: boolean; + + /** Returns the row which we start to drag. + */ + draggedRow?: any; + + /** Returns the row index which we start to drag. + */ + draggedRowIndex?: number; + + /** Returns the multiple dragged row collection for multiple reorder + */ + draggedRecords?: any[]; + + /** Returns the drop position. + */ + dropPosition?: string; + + /** Returns the row which we are dropped to row. + */ + targetRow?: any; + + /** Returns the row index which we are dropped to row. + */ + targetRowIndex?: number; + + /** Returns the TreeGrid model. + */ + model?: any; + + /** Returns the name of the event. + */ + type?: string; + } + export interface CellSelectingEventArgs { /** Returns the cancel option value. @@ -42693,6 +42753,8 @@ declare namespace ej { XLSort: Spreadsheet.XLSort; + XLSparkline: Spreadsheet.XLSparkline; + XLValidate: Spreadsheet.XLValidate; } export namespace Spreadsheet { @@ -43547,6 +43609,35 @@ declare namespace ej { sortByRange(range: any[]|string, columnName: string, direction: any): boolean; } + export interface XLSparkline { + + /** This method used for creating the sparkline chart for specified range in spreadsheet. + * @param {string} Pass the data range + * @param {string} Pass the location range + * @param {string} Pass the sparkline chart type + * @param {any} Pass the sparkline chart options + * @param {number} Pass the sheetIndex + * @returns {void} + */ + createSparkline(dataRange: string, locationRange: string, type: string, options: any, sheetIndex: number): void; + + /** This method used to change the sparkline color and marker point color in the spreadsheet. + * @param {string} Pass the sparkline ID + * @param {any} Pass the sparkline options + * @param {number} Optional. Pass the sheet index + * @returns {void} + */ + changePointColor(sparklineId: string, option: any, sheetIdx: number): void; + + /** This method used to change the sparkline type in the spreadsheet. + * @param {string} Pass the sparkline ID + * @param {string} Pass the sparkline type + * @param {number} Optional. Pass the sheet index + * @returns {void} + */ + changeType(sparklineId: string, type: string, sheetIdx: number): void; + } + export interface XLValidate { /** This method is used to apply data validation rules in a selected range of cells based on the defined condition in the Spreadsheet. @@ -43737,6 +43828,11 @@ declare namespace ej { */ allowSorting?: boolean; + /** Gets or sets a value that indicates whether to enable the sparkline feature in the Spreadsheet. + * @Default {false} + */ + allowSparkline?: boolean; + /** Gets or sets a value that indicates whether to enable or disable undo and redo feature in the Spreadsheet. * @Default {true} */