├── .gitignore ├── LICENSE ├── README.md ├── bin ├── build.sh ├── bundle.sh ├── common.flags ├── css.sh └── solution.sh ├── css ├── button.less ├── chartEditor.freeboard.less ├── chartEditor.less ├── chartEditor.qlik.less ├── chartEditor.tableau.less ├── checkbox.less ├── colormenubutton.less ├── combobox.less ├── common.less ├── dialog.less ├── dialog.qlik.less ├── dialog.tableau.less ├── menu.less ├── menubutton.less ├── mixins.less ├── variables.freeboard.less ├── variables.less ├── variables.qlik.less └── variables.tableau.less ├── dist ├── anychart-editor.css ├── anychart-editor.min.css ├── anychart-editor.min.js ├── index.html └── index.js ├── editor.js ├── index.html ├── index.js ├── package-lock.json ├── package.json └── src ├── basicEditor.js ├── binding.js ├── bundleEditor.js ├── chartEditor.js ├── editor ├── Base.js ├── Chart.js ├── Gantt.js ├── Map.js ├── Stock.js └── bundle.js ├── enums.js ├── events.js ├── ganttEditor.js ├── mapEditor.js ├── model ├── Base.js ├── Chart.js ├── Gantt.js ├── Map.js └── Stock.js ├── reporting.js ├── stockEditor.js ├── ui ├── Chart.js ├── Component.js ├── ComponentWithKey.js ├── Panel.js ├── PanelIndexed.js ├── PanelZippy.js ├── PanelsGroup.js ├── Preloader.js ├── Tabs.js ├── appearanceTab │ ├── ChartLabels.js │ ├── ChartSpecific.js │ ├── ChartTitle.js │ ├── CircularRanges.js │ ├── ColorRange.js │ ├── ColorScale.js │ ├── Data.js │ ├── DataLabels.js │ ├── DropOff.js │ ├── Flow.js │ ├── GanttDataGrid.js │ ├── GanttGridColoring.js │ ├── GanttTimeLine.js │ ├── GanttTimeLineHeader.js │ ├── GanttTooltip.js │ ├── GeneralTheming.js │ ├── Grids.js │ ├── Legend.js │ ├── Node.js │ ├── Pointers.js │ ├── Quarters.js │ ├── ScaleBars.js │ ├── Scales.js │ ├── SeriesWithScales.js │ ├── StockSeries.js │ ├── Tabs.js │ ├── Tooltip.js │ └── axes │ │ ├── Cartesian.js │ │ ├── CartesianXAxes.js │ │ ├── CartesianYAxes.js │ │ ├── GaugeAxes.js │ │ ├── RadarPolar.js │ │ ├── RadarPolarXAxis.js │ │ └── RadarPolarYAxis.js ├── breadcrumbs │ ├── Breadcrumbs.js │ └── Item.js ├── control │ ├── Menu.js │ ├── button │ │ ├── Base.js │ │ ├── Bold.js │ │ ├── Italic.js │ │ ├── Toggle.js │ │ └── Underline.js │ ├── checkbox │ │ ├── AdjustFontSize.js │ │ ├── Base.js │ │ └── Renderer.js │ ├── colorPicker │ │ ├── Base.js │ │ └── Renderer.js │ ├── comboBox │ │ ├── Base.js │ │ ├── PercentToRatio.js │ │ └── Percentage.js │ ├── fieldSelect │ │ ├── Base.js │ │ ├── MenuCaption.js │ │ ├── MenuItem.js │ │ ├── Select.js │ │ └── Theme.js │ ├── input │ │ ├── Base.js │ │ ├── Numbers.js │ │ ├── Palette.js │ │ └── StringArray.js │ ├── select │ │ ├── Base.js │ │ ├── DataType.js │ │ ├── FontFamily.js │ │ ├── Palettes.js │ │ ├── ScaleType.js │ │ └── Scales.js │ └── wrapped │ │ ├── Base.js │ │ ├── Labeled.js │ │ ├── LabeledTwins.js │ │ └── SeriesName.js ├── dataSets │ ├── DataSet.js │ ├── DataSetPreview.js │ ├── Intro.js │ ├── Widget.js │ ├── WidgetPreview.js │ └── edit │ │ ├── ColumnsController.js │ │ ├── Input.js │ │ └── Table.js ├── dataSettings │ ├── GeoDataInputs.js │ ├── Plot.js │ ├── Series.js │ ├── Widget.js │ └── chartTypeSelect │ │ ├── Filters.js │ │ ├── Menu.js │ │ ├── MenuItem.js │ │ ├── Pages.js │ │ └── Widget.js ├── dialog │ ├── Base.js │ ├── Confirm.js │ ├── Data.js │ ├── DataPreview.js │ ├── PresetPreview.js │ ├── Sample.js │ └── Settings.js ├── exportTabs │ ├── Embed.js │ ├── Json.js │ ├── Scripts.js │ ├── SourceCode.js │ └── Tabs.js ├── panel │ ├── Background.js │ ├── Cap.js │ ├── ChartLabel.js │ ├── CircularRange.js │ ├── Error.js │ ├── Font.js │ ├── Grid.js │ ├── Labels.js │ ├── Legend.js │ ├── Markers.js │ ├── PlotGrids.js │ ├── Quarter.js │ ├── QuarterLabel.js │ ├── ScaleBar.js │ ├── Stagger.js │ ├── Stroke.js │ ├── Ticks.js │ ├── Title.js │ ├── Tooltip.js │ ├── TooltipTitle.js │ ├── TreemapHeaders.js │ ├── axes │ │ ├── Cartesian.js │ │ ├── CircularGauge.js │ │ ├── Linear.js │ │ ├── LinearGauge.js │ │ ├── Polar.js │ │ ├── Radar.js │ │ └── Radial.js │ ├── ganttProject │ │ ├── Buttons.js │ │ ├── Coloring.js │ │ ├── Column.js │ │ ├── DataGrid.js │ │ ├── LevelWrapper.js │ │ ├── Tooltip.js │ │ └── elements │ │ │ ├── Base.js │ │ │ └── Connectors.js │ ├── pointers │ │ ├── Bar.js │ │ ├── CircularBase.js │ │ ├── Knob.js │ │ ├── Led.js │ │ ├── LinearBase.js │ │ ├── LinearMarker.js │ │ ├── Marker.js │ │ ├── Needle.js │ │ ├── RangeBar.js │ │ ├── Tank.js │ │ └── Thermometer.js │ ├── scales │ │ ├── Base.js │ │ ├── DateTime.js │ │ ├── DateTimeTicks.js │ │ ├── Linear.js │ │ ├── LinearColor.js │ │ ├── Logarithmic.js │ │ ├── Ordinal.js │ │ ├── OrdinalColor.js │ │ ├── OrdinalTicks.js │ │ ├── Ranges.js │ │ ├── ScalePanel.js │ │ ├── ScatterTicks.js │ │ └── Standalone.js │ ├── series │ │ ├── SeriesWithScales.js │ │ └── StockSeries.js │ └── specific │ │ ├── Cartesian.js │ │ ├── GaugeCircular.js │ │ ├── GaugeLinear.js │ │ ├── HeatMap.js │ │ ├── Mekko.js │ │ ├── Pie.js │ │ ├── Polar.js │ │ ├── Quadrant.js │ │ ├── Radar.js │ │ ├── Sankey.js │ │ ├── Scatter.js │ │ ├── TagCloud.js │ │ ├── TreeMap.js │ │ └── Waterfall.js ├── presets │ ├── Preset.js │ └── Widget.js ├── steps │ ├── Export.js │ ├── PrepareData.js │ ├── SetupChart.js │ ├── Step.js │ ├── VisualAppearance.js │ └── Widget.js └── userData │ └── Widget.js └── utils.js /.gitignore: -------------------------------------------------------------------------------- 1 | .idea/ 2 | out/* 3 | node_modules/ 4 | demos-local 5 | tmp 6 | *___jb_old___ 7 | .DS_Store 8 | tmp 9 | tests -------------------------------------------------------------------------------- /bin/build.sh: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | 4 | 5 | if [ -z $1 ] || [ $1 = "css" ] 6 | then 7 | echo 'Start building CSS.' 8 | sh ./bin/css.sh 9 | sh ./bin/css.sh qlik 10 | sh ./bin/css.sh tableau 11 | sh ./bin/css.sh freeboard 12 | echo 'Finish building CSS.' 13 | fi 14 | 15 | if [ -z $1 ] || [ $1 = "deps" ] 16 | then 17 | echo 'Start building deps.' 18 | python node_modules/google-closure-library/closure/bin/build/depswriter.py \ 19 | --root_with_prefix="src ../../../../src" \ 20 | --output_file="out/deps.js" 21 | echo 'Finish building deps.' 22 | fi 23 | 24 | -------------------------------------------------------------------------------- /bin/bundle.sh: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | echo 'Start building bundle.' 4 | 5 | if [ -z $1 ] 6 | then 7 | sh ./bin/solution.sh 8 | else 9 | if [ $1 == 'all' ] 10 | then 11 | sh ./bin/solution.sh 12 | sh ./bin/solution.sh qlik 13 | sh ./bin/solution.sh tableau 14 | sh ./bin/solution.sh freeboard 15 | else 16 | sh ./bin/solution.sh $1 17 | fi 18 | fi 19 | 20 | echo 'Bundle build done!' -------------------------------------------------------------------------------- /bin/common.flags: -------------------------------------------------------------------------------- 1 | --charset UTF-8 2 | 3 | --process_closure_primitives 4 | 5 | --compilation_level=ADVANCED_OPTIMIZATIONS 6 | 7 | --dependency_mode STRICT 8 | 9 | --language_in ECMASCRIPT3 10 | --language_out ECMASCRIPT3 11 | 12 | --extra_annotation_name "includeDoc" 13 | --extra_annotation_name "illustration" 14 | --extra_annotation_name "illustrationDesc" 15 | --extra_annotation_name "ignoreDoc" 16 | --extra_annotation_name "propertyDoc" 17 | --extra_annotation_name "shortDescription" 18 | 19 | --isolation_mode IIFE 20 | 21 | --use_types_for_optimization true 22 | 23 | --warning_level VERBOSE 24 | 25 | --jscomp_warning accessControls 26 | --jscomp_warning ambiguousFunctionDecl 27 | --jscomp_warning checkDebuggerStatement 28 | --jscomp_warning checkEventfulObjectDisposal 29 | --jscomp_warning checkRegExp 30 | --jscomp_warning checkTypes 31 | --jscomp_warning checkVars 32 | --jscomp_warning closureDepMethodUsageChecks 33 | --jscomp_warning conformanceViolations 34 | --jscomp_warning const 35 | --jscomp_warning constantProperty 36 | --jscomp_warning es3 37 | --jscomp_warning es5Strict 38 | --jscomp_warning externsValidation 39 | --jscomp_off extraRequire 40 | --jscomp_warning fileoverviewTags 41 | --jscomp_warning functionParams 42 | --jscomp_warning globalThis 43 | --jscomp_warning internetExplorerChecks 44 | --jscomp_warning invalidCasts 45 | --jscomp_warning misplacedTypeAnnotation 46 | --jscomp_warning missingGetCssName 47 | --jscomp_off missingOverride 48 | --jscomp_warning missingPolyfill 49 | --jscomp_warning missingProperties 50 | --jscomp_warning missingProvide 51 | --jscomp_warning missingRequire 52 | --jscomp_warning missingReturn 53 | --jscomp_warning msgDescriptions 54 | --jscomp_off newCheckTypes 55 | --jscomp_off newCheckTypesExtraChecks 56 | --jscomp_off nonStandardJsDocs 57 | --jscomp_off reportUnknownTypes 58 | --jscomp_warning suspiciousCode 59 | --jscomp_warning strictModuleDepCheck 60 | --jscomp_warning typeInvalidation 61 | --jscomp_warning undefinedNames 62 | --jscomp_warning undefinedVars 63 | --jscomp_warning unknownDefines 64 | --jscomp_off unusedLocalVariables 65 | --jscomp_off unusedPrivateMembers 66 | --jscomp_warning uselessCode 67 | --jscomp_off useOfGoogBase 68 | --jscomp_warning underscore 69 | --jscomp_warning visibility 70 | --jscomp_warning lintChecks 71 | 72 | --hide_warnings_for "node_modules/google-closure-library" -------------------------------------------------------------------------------- /bin/css.sh: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | if [ -z $1 ] 4 | then 5 | echo " Compiling vanilla chart editor CSS." 6 | LOCATION="out/anychart-editor.min.css" 7 | else 8 | echo " Compiling chart editor CSS for $1." 9 | LOCATION="out/$1/anychart-editor.min.css" 10 | fi 11 | 12 | if [ -z $1 ] 13 | then 14 | lessc css/chartEditor.less out/anychart-editor.css 15 | lessc css/chartEditor.less "$LOCATION" --clean-css="--s1 --advanced --compatibility=ie8" 16 | echo " Compilation of vanilla chart editor CSS complete: $LOCATION" 17 | else 18 | lessc css/chartEditor."$1".less out/"$1"/anychart-editor.css 19 | lessc css/chartEditor."$1".less "$LOCATION" --clean-css="--s1 --advanced --compatibility=ie8" 20 | echo " Compilation of chart editor CSS for $1 complete: $LOCATION" 21 | fi -------------------------------------------------------------------------------- /bin/solution.sh: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | if [ -z $1 ] 4 | then 5 | echo " Compiling vanilla chart editor." 6 | LOCATION="out/anychart-editor.min.js" 7 | else 8 | echo " Compiling chart editor for $1." 9 | LOCATION="out/$1/anychart-editor.min.js" 10 | fi 11 | 12 | PACKAGE_VERSION=$(cat package.json \ 13 | | grep version \ 14 | | head -1 \ 15 | | awk -F: '{ print $2 }' \ 16 | | sed 's/[",]//g' \ 17 | | tr -d '[[:space:]]') 18 | 19 | java -jar node_modules/google-closure-compiler/compiler.jar \ 20 | --js_output_file="$LOCATION" \ 21 | --js="node_modules/google-closure-library/closure/goog/**.js" \ 22 | --js="src/**.js" \ 23 | --entry_point=bundleEditor \ 24 | --flagfile="bin/common.flags" \ 25 | --define="chartEditor.model.Base.SOLUTION='$1'" \ 26 | --define="chartEditor.editor.Base.VERSION='$PACKAGE_VERSION'" 27 | 28 | DATE=`date +%Y-%m-%d` 29 | 30 | HEADER=$'/** 31 | * AnyChart is lightweight robust charting library with great API and Docs, 32 | * that works with your stack and has tons of chart types and features. 33 | * 34 | * Chart Editor is an out-of-the-box chart generator and editor with intuitive user interface 35 | * that can be easily embedded into any web service or web view based desktop application. 36 | * AnyChart Chart Editor allows you to leverage the entire power of AnyChart with minimal integration effort. 37 | * 38 | * Version: '${PACKAGE_VERSION}' ('${DATE}') 39 | * License: https://www.anychart.com/buy/ 40 | * Contact: sales@anychart.com 41 | * Copyright: AnyChart.com 2018. All rights reserved. 42 | */' 43 | 44 | echo "$HEADER" | cat - "$LOCATION" > temp && mv temp "$LOCATION" 45 | 46 | sh ./bin/css.sh $1 47 | 48 | if [ -z $1 ] 49 | then 50 | echo " Compilation of vanilla chart editor complete: $LOCATION" 51 | else 52 | echo " Compilation of chart editor for $1 complete: $LOCATION" 53 | fi 54 | 55 | echo "" 56 | 57 | 58 | 59 | -------------------------------------------------------------------------------- /css/checkbox.less: -------------------------------------------------------------------------------- 1 | @import "variables.less"; 2 | 3 | /* ------- CHECKBOX ------- */ 4 | 5 | .anychart-ce-checkbox { 6 | cursor: pointer; 7 | display: inline-block; 8 | 9 | overflow: hidden; 10 | padding: 0; 11 | 12 | position: relative; 13 | white-space: nowrap; 14 | vertical-align: middle; 15 | 16 | .anychart-ce-checkbox-element { 17 | .border-radius(4px); 18 | .box-sizing(content-box); 19 | 20 | background: @color-background; 21 | border: 1px solid @color-background; 22 | color: @color-blue; 23 | 24 | height: 20px; 25 | width: 20px; 26 | 27 | outline: 0; 28 | vertical-align: text-bottom; 29 | } 30 | } 31 | 32 | .anychart-ce-checkbox-hover { 33 | .anychart-ce-checkbox-element { 34 | 35 | } 36 | } 37 | 38 | .anychart-ce-checkbox-focused { 39 | .anychart-ce-checkbox-element { 40 | border-color: @color-shadow; 41 | } 42 | } 43 | 44 | .anychart-ce-checkbox-checked { 45 | background-color: #fff; 46 | background-color: rgba(255,255,255,.65); 47 | 48 | .anychart-ce-checkbox-checkmark { 49 | display: block; 50 | } 51 | } 52 | 53 | .anychart-ce-checkbox-undetermined { 54 | 55 | } 56 | 57 | .anychart-ce-checkbox-unchecked { 58 | .anychart-ce-checkbox-checkmark { 59 | display: none !important; 60 | } 61 | } 62 | 63 | .anychart-ce-checkbox-caption { 64 | color: @color-label; 65 | padding: 0 10px; 66 | } 67 | 68 | .anychart-ce-checkbox-disabled { 69 | cursor: default; 70 | color: @color-text-disabled; 71 | 72 | .anychart-ce-checkbox-element { 73 | //background-color: @color-border-disabled; 74 | border: 1px solid @color-border-disabled !important; 75 | cursor: default; 76 | } 77 | .anychart-ce-checkbox-caption { 78 | color: @color-text-disabled; 79 | } 80 | } 81 | .anychart-ce-checkbox-disabled.anychart-ce-checkbox-checked { 82 | .anychart-ce-checkbox-element { 83 | background-color: @color-background !important; 84 | } 85 | .anychart-ce-checkbox-checkmark { 86 | color: @color-text-disabled !important; 87 | } 88 | } 89 | 90 | .anychart-ce-checkbox-checkmark { 91 | display: none; 92 | height: 15px; 93 | width: 15px; 94 | outline: 0; 95 | position: relative; 96 | left: 2px; 97 | } -------------------------------------------------------------------------------- /css/combobox.less: -------------------------------------------------------------------------------- 1 | @import "variables.less"; 2 | 3 | .anychart-ce-combobox { 4 | .border-radius(4px); 5 | .box-sizing(content-box); 6 | 7 | height: 30px; 8 | 9 | background: @color-background; 10 | border: 1px solid @color-background; 11 | color: @color-text; 12 | 13 | -webkit-user-select: none; 14 | -moz-user-select: none; 15 | -ms-user-select: none; 16 | 17 | line-height: 24px; 18 | list-style: none; 19 | font-size: 11px; 20 | font-weight: bold; 21 | text-decoration: none; 22 | vertical-align: middle; 23 | cursor: pointer; 24 | 25 | input { 26 | .border-radius(4px); 27 | .box-sizing(content-box); 28 | width: 35px; 29 | 30 | font-size: 13px; 31 | color: @color-text; 32 | padding: 3px 5px; 33 | margin: 3px; 34 | 35 | border: 1px solid transparent; 36 | overflow: hidden; 37 | position: relative; 38 | 39 | &:focus { 40 | background: #ffffff; 41 | -webkit-user-select: text; 42 | -moz-user-select: text; 43 | 44 | border: 1px solid #4d90fe; 45 | height: 16px; 46 | outline: none; 47 | } 48 | } 49 | } 50 | 51 | .anychart-ce-combobox-disabled { 52 | //border-color: @color-border-disabled !important; 53 | cursor: default; 54 | 55 | input { 56 | color: @color-text-disabled; 57 | background-color: inherit; 58 | } 59 | 60 | .anychart-ce-combobox-button { 61 | border-color: @color-border-disabled transparent; 62 | } 63 | } 64 | 65 | .anychart-ce-combobox-active { 66 | border-bottom-left-radius: 0; 67 | border-bottom-right-radius: 0; 68 | border: 1px solid @color-border; 69 | border-bottom: 1px solid transparent; 70 | 71 | .anychart-ce-combobox-button { 72 | .rotate(180deg); 73 | } 74 | } 75 | 76 | .anychart-ce-combobox-button { 77 | @thickness: 3px; 78 | @unitSize: 6px; 79 | width: 0; 80 | height: 0; 81 | position: relative; 82 | display: inline-block; 83 | 84 | float: right; 85 | margin: 12px 5px @unitSize 3px; 86 | 87 | border-right: @unitSize solid transparent; 88 | border-left: @unitSize solid transparent; 89 | border-top: (@unitSize * 1) solid @color-arrow; 90 | //margin-bottom: @unitSize; 91 | 92 | &:before { 93 | content: ""; 94 | position: absolute; 95 | 96 | border-right: @unitSize solid transparent; 97 | border-left: @unitSize solid transparent; 98 | border-top: (@unitSize * 1) solid @color-background; 99 | margin-bottom: @unitSize; 100 | 101 | left: -@unitSize; 102 | top: -(@unitSize + @thickness); 103 | } 104 | } 105 | -------------------------------------------------------------------------------- /css/dialog.qlik.less: -------------------------------------------------------------------------------- 1 | @import "variables.qlik.less"; 2 | @import "dialog.less"; 3 | 4 | // region ---- Qlik theme 5 | .anychart-ce-dialog-qlik-theme { 6 | .anychart-ce-dialog-title { 7 | padding: 4px 14px; 8 | } 9 | .anychart-ce-dialog-content { 10 | top: 53px; 11 | left: 0; 12 | right: 0; 13 | bottom: 0; 14 | } 15 | .anychart-ce-dialog-title-close { 16 | margin-top: -3px; 17 | margin-right: 3px; 18 | } 19 | } 20 | // endregion -------------------------------------------------------------------------------- /css/dialog.tableau.less: -------------------------------------------------------------------------------- 1 | @import "variables.qlik.less"; 2 | @import "dialog.less"; 3 | 4 | // region ---- Tableau theme 5 | .anychart-ce-dialog-tableau-theme { 6 | .anychart-ce-dialog-title { 7 | padding: 4px 14px; 8 | } 9 | .anychart-ce-dialog-content { 10 | top: 53px; 11 | left: 0; 12 | right: 0; 13 | bottom: 0; 14 | } 15 | .anychart-ce-dialog-title-close { 16 | margin-top: -3px; 17 | margin-right: 3px; 18 | } 19 | } 20 | // endregion -------------------------------------------------------------------------------- /css/variables.freeboard.less: -------------------------------------------------------------------------------- 1 | @import "variables.less"; 2 | 3 | // region ---- Freeboard theme 4 | 5 | @color-background: #f1f1f1; 6 | 7 | @color-blue: #f8a235; 8 | @color-blue-hovered: #da8418; 9 | @color-blue-disabled: #9c9c9c; 10 | 11 | @color-border: #b3b3b3; 12 | @color-border-disabled: #e4e4e4; 13 | @color-arrow: @color-border; 14 | 15 | @color-text: #4d4d4d; 16 | @color-text-disabled: #bcbcbc; 17 | @color-label: #969696; 18 | @color-caption: #222222; 19 | @color-text2: #31424f; 20 | 21 | @color-hovered: #caf1fe; 22 | @color-checked: #dde5ea; 23 | @color-breadcrumbs-back: @color-text; 24 | 25 | @color-menu-item-highlight-color: white; 26 | @color-menu-item--highlight-background: #1e90ff; 27 | @color-button-hover-background: #c9e1f0; 28 | @color-button-active-background: #f5f5f5; 29 | @color-dialog-background: #92a0b3; 30 | @color-content-background: #e5e5e5; 31 | 32 | @color-shadow: #dbdbdb; 33 | @shadow-1: none; 34 | @shadow-dialog: 0 4px 16px rgba(0, 0, 0, .2); 35 | 36 | @color-special-value: #fff1e9; 37 | // endregion ---- Freeboard theme -------------------------------------------------------------------------------- /css/variables.less: -------------------------------------------------------------------------------- 1 | @import "mixins.less"; 2 | 3 | @color-background: #e9edf0; 4 | 5 | @color-blue: #469ced; 6 | @color-blue-hovered: #02befc; 7 | @color-blue-disabled: #738db0; 8 | 9 | @color-green-loaded: #5dff7e; 10 | 11 | @color-border: #c7d8e4; 12 | @color-border-disabled: #adc0d9 transparent; 13 | @color-arrow: #738db0; 14 | 15 | @color-text: #4a6181; 16 | @color-text-disabled: #a9bad0; 17 | @color-text2: #31424f; 18 | @color-label: #7e92ad; 19 | @color-caption: #171c20; 20 | 21 | @color-hovered: #caf1fe; 22 | @color-checked: #dde5ea; 23 | @color-breadcrumbs-back: @color-text; 24 | 25 | @color-menu-item-highlight-color: @color-blue; 26 | @color-menu-item--highlight-background: #d0ebff; 27 | @color-button-hover-background: #ecf7ff; 28 | @color-button-active-background: #ecf7ff; 29 | @color-dialog-background: #92a0b3; 30 | @color-content-background: white; 31 | @color-error: #ff5f7f; 32 | @color-special-value: #e0eef9; 33 | 34 | @color-shadow: #c4d5df; 35 | @shadow-1: 0 0 8px @color-shadow; 36 | @shadow-dialog: 0 4px 16px rgba(0, 0, 0, .2); 37 | -------------------------------------------------------------------------------- /css/variables.qlik.less: -------------------------------------------------------------------------------- 1 | @import "variables.less"; 2 | 3 | // region ---- Qlik theme 4 | 5 | @color-background: #f1f1f1; 6 | 7 | @color-blue: #f8a235; 8 | @color-blue-hovered: #da8418; 9 | @color-blue-disabled: #9c9c9c; 10 | 11 | @color-border: #b3b3b3; 12 | @color-border-disabled: #e4e4e4; 13 | @color-arrow: @color-border; 14 | 15 | @color-text: #4d4d4d; 16 | @color-text-disabled: #bcbcbc; 17 | @color-label: #969696; 18 | @color-caption: #222222; 19 | @color-text2: #31424f; 20 | 21 | @color-hovered: #caf1fe; 22 | @color-checked: #dde5ea; 23 | @color-breadcrumbs-back: @color-text; 24 | 25 | @color-menu-item-highlight-color: white; 26 | @color-menu-item--highlight-background: #1e90ff; 27 | @color-button-hover-background: #c9e1f0; 28 | @color-button-active-background: #f5f5f5; 29 | @color-dialog-background: #92a0b3; 30 | @color-content-background: #e5e5e5; 31 | 32 | @color-shadow: #dbdbdb; 33 | @shadow-1: none; 34 | @shadow-dialog: 0 4px 16px rgba(0, 0, 0, .2); 35 | 36 | @color-special-value: #fff1e9; 37 | // endregion ---- Qlik theme -------------------------------------------------------------------------------- /css/variables.tableau.less: -------------------------------------------------------------------------------- 1 | @import "variables.less"; 2 | 3 | // region ---- Tableau theme 4 | 5 | @color-background: #f1f1f1; 6 | 7 | @color-blue: #f8a235; 8 | @color-blue-hovered: #da8418; 9 | @color-blue-disabled: #9c9c9c; 10 | 11 | @color-border: #b3b3b3; 12 | @color-border-disabled: #e4e4e4; 13 | @color-arrow: @color-border; 14 | 15 | @color-text: #4d4d4d; 16 | @color-text-disabled: #bcbcbc; 17 | @color-label: #969696; 18 | @color-caption: #222222; 19 | @color-text2: #31424f; 20 | 21 | @color-hovered: #caf1fe; 22 | @color-checked: #dde5ea; 23 | @color-breadcrumbs-back: @color-text; 24 | 25 | @color-menu-item-highlight-color: white; 26 | @color-menu-item--highlight-background: #1e90ff; 27 | @color-button-hover-background: #c9e1f0; 28 | @color-button-active-background: #f5f5f5; 29 | @color-dialog-background: #92a0b3; 30 | @color-content-background: #e5e5e5; 31 | 32 | @color-shadow: #dbdbdb; 33 | @shadow-1: none; 34 | @shadow-dialog: 0 4px 16px rgba(0, 0, 0, .2); 35 | 36 | @color-special-value: #fff1e9; 37 | // endregion ---- Tableau theme -------------------------------------------------------------------------------- /dist/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 53 | 54 | 55 |
56 | 57 | 58 | 59 | -------------------------------------------------------------------------------- /dist/index.js: -------------------------------------------------------------------------------- 1 | anychart.onDocumentReady(function() { 2 | // Create editor instance 3 | var editor = anychart.editor(); 4 | 5 | // console.log(editor.version()); 6 | 7 | // Add your data from code 8 | // editor.data({ 9 | // data: [ 10 | // {name: 'Jan', val1: 10, price: 20.5, amount: 100}, 11 | // {name: 'Feb', val1: 20, price: 30, amount: 200}, 12 | // {name: 'Mar', val1: 5, price: 115, amount: 10} 13 | // ], 14 | // chartType: 'column', 15 | // fieldNames: { 16 | // name: 'Month', 17 | // val1: 'Value 1' 18 | // }, 19 | // title: 'Awesome Chart' 20 | // }); 21 | 22 | // Render editor to div#container 23 | editor.render(document.getElementById("container")); 24 | 25 | editor.listen('editorComplete', function() { 26 | console.log(editor.getJavascript()); 27 | }); 28 | }); -------------------------------------------------------------------------------- /editor.js: -------------------------------------------------------------------------------- 1 | goog.provide('editor'); 2 | 3 | goog.require('chartEditor.editor.Chart'); 4 | goog.require('chartEditor.editor.Stock'); 5 | goog.require('chartEditor.editor.Map'); 6 | goog.require('chartEditor.editor.Gantt'); 7 | 8 | /** 9 | * Set default css name mapping for anychart chart editor ui. 10 | */ 11 | goog.setCssNameMapping({ 12 | 'goog': 'anychart-ce' 13 | }); 14 | 15 | chartEditor.DEVELOP = true; 16 | 17 | chartEditor.PRODUCT = chartEditor.model.Product.BUNDLE; -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | module.exports = require('./dist/js/anychart-editor.min.js'); 2 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "chart-editor", 3 | "version": "1.2.0", 4 | "description": "AnyChart Chart Editor utility", 5 | "main": "index.js", 6 | "scripts": { 7 | "deps": "sh ./bin/build.sh deps", 8 | "css": "sh ./bin/build.sh css", 9 | "bundle": "sh ./bin/bundle.sh", 10 | "bundleAll": "sh ./bin/bundle.sh all", 11 | "bundleQlik": "sh ./bin/bundle.sh qlik", 12 | "bundleTableau": "sh ./bin/bundle.sh tableau", 13 | "bundleFreeboard": "sh ./bin/bundle.sh freeboard" 14 | }, 15 | "repository": { 16 | "type": "git", 17 | "url": "git+https://github.com/AnyChart/chart-editor.git" 18 | }, 19 | "keywords": [ 20 | "anychart", 21 | "anystock", 22 | "anymap", 23 | "charts", 24 | "plots", 25 | "line charts", 26 | "bar charts", 27 | "pie charts", 28 | "choropleth map", 29 | "javascript charts", 30 | "javascript plots", 31 | "javascript", 32 | "SVG", 33 | "HTML5", 34 | "VML" 35 | ], 36 | "author": "AnyChart", 37 | "license": "Apache-2.0", 38 | "bugs": { 39 | "url": "https://github.com/AnyChart/chart-editor/issues" 40 | }, 41 | "homepage": "https://github.com/AnyChart/chart-editor", 42 | "devDependencies": { 43 | "google-closure-compiler": "^20180204.0.0", 44 | "google-closure-library": "^20180204.0.0", 45 | "less": "^3.9.0", 46 | "less-plugin-clean-css": "^1.5.1" 47 | }, 48 | "dependencies": { 49 | "anychart": "^8.5.1" 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /src/basicEditor.js: -------------------------------------------------------------------------------- 1 | goog.provide('basicEditor'); 2 | 3 | goog.require('chartEditor.editor.Basic'); 4 | 5 | /** 6 | * Set default css name mapping for anychart chart editor ui. 7 | */ 8 | goog.setCssNameMapping({ 9 | 'goog': 'anychart-ce' 10 | }); 11 | 12 | chartEditor.DEVELOP = true; 13 | 14 | chartEditor.PRODUCT = chartEditor.model.Product.BASIC; -------------------------------------------------------------------------------- /src/bundleEditor.js: -------------------------------------------------------------------------------- 1 | goog.provide('bundleEditor'); 2 | 3 | goog.require('chartEditor.editor.bundle'); 4 | 5 | /** 6 | * Set default css name mapping for anychart chart editor ui. 7 | */ 8 | goog.setCssNameMapping({ 9 | 'goog': 'anychart-ce' 10 | }); 11 | 12 | chartEditor.DEVELOP = true; 13 | 14 | chartEditor.PRODUCT = chartEditor.model.Product.BUNDLE; -------------------------------------------------------------------------------- /src/chartEditor.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor'); 2 | 3 | goog.require('chartEditor.editor.Chart'); 4 | 5 | /** 6 | * Set default css name mapping for anychart chart editor ui. 7 | */ 8 | goog.setCssNameMapping({ 9 | 'goog': 'anychart-ce' 10 | }); 11 | 12 | chartEditor.DEVELOP = true; 13 | 14 | chartEditor.PRODUCT = chartEditor.model.Product.CHART; -------------------------------------------------------------------------------- /src/editor/Chart.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.editor.Chart'); 2 | 3 | goog.require('chartEditor.editor.Base'); 4 | goog.require('chartEditor.model.Chart'); 5 | 6 | 7 | /** 8 | * Editor ui for Chart Editor 9 | * 10 | * @constructor 11 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 12 | * @param {chartEditor.enums.ChartType=} opt_lockedChartType - Locked chart type. 13 | * @extends {chartEditor.editor.Base} 14 | */ 15 | chartEditor.editor.Chart = function(opt_domHelper, opt_lockedChartType) { 16 | chartEditor.editor.Chart.base(this, 'constructor', opt_domHelper, opt_lockedChartType); 17 | 18 | this.setModel(new chartEditor.model.Chart()); 19 | 20 | this.addClassName(goog.getCssName('anychart-ce-chart')); 21 | }; 22 | goog.inherits(chartEditor.editor.Chart, chartEditor.editor.Base); 23 | 24 | 25 | /** 26 | * Constructor function for Stock Editor. 27 | * @param {chartEditor.enums.ChartType=} opt_lockedChartType - Locked chart type. 28 | * @return {chartEditor.editor.Chart} 29 | */ 30 | window['anychart'].chartEditor = function(opt_lockedChartType) { 31 | return new chartEditor.editor.Chart(void 0, opt_lockedChartType); 32 | }; 33 | 34 | //exports 35 | (function() { 36 | goog.exportSymbol('anychart.chartEditor', window['anychart'].chartEditor); 37 | })(); 38 | -------------------------------------------------------------------------------- /src/editor/Gantt.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.editor.Gantt'); 2 | 3 | goog.require('chartEditor.editor.Base'); 4 | goog.require('chartEditor.model.Gantt'); 5 | goog.require('chartEditor.utils'); 6 | 7 | 8 | 9 | /** 10 | * Editor ui for Gantt Editor 11 | * 12 | * @constructor 13 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 14 | * @param {chartEditor.enums.ChartType=} opt_lockedChartType - Locked chart type. 15 | * @extends {chartEditor.editor.Base} 16 | */ 17 | chartEditor.editor.Gantt = function(opt_domHelper, opt_lockedChartType) { 18 | chartEditor.editor.Gantt.base(this, 'constructor', opt_domHelper, opt_lockedChartType); 19 | 20 | this.setModel(new chartEditor.model.Gantt()); 21 | 22 | this.addClassName(goog.getCssName('anychart-ce-gantt')); 23 | }; 24 | goog.inherits(chartEditor.editor.Gantt, chartEditor.editor.Base); 25 | 26 | 27 | /** 28 | * Constructor function for Map Editor. 29 | * @param {chartEditor.enums.ChartType=} opt_lockedChartType - Locked chart type. 30 | * @return {chartEditor.editor.Gantt} 31 | */ 32 | window['anychart'].ganttEditor = function(opt_lockedChartType) { 33 | return new chartEditor.editor.Gantt(void 0, opt_lockedChartType); 34 | }; 35 | 36 | 37 | /** 38 | * Wrapper function for preprocessing mapping for Gantt Resource chart. 39 | * @param {Object} mappingObj default mapping for the current chart type 40 | * @return {Object} 41 | */ 42 | chartEditor.editor.Gantt.preprocessResourceMapping = function(mappingObj) { 43 | return chartEditor.utils.preprocessResourceMapping(mappingObj); 44 | }; 45 | 46 | 47 | /** 48 | * Wrapper function for preprocessing data for Gantt Resource chart. 49 | * @param {Array.} rawData raw incoming data 50 | * @param {Object} mappingObj default mapping for the current chart type 51 | * @return {Array.} 52 | */ 53 | chartEditor.editor.Gantt.preprocessResourceData = function(rawData, mappingObj) { 54 | return chartEditor.utils.preprocessResourceData(rawData, mappingObj); 55 | }; 56 | 57 | 58 | //exports 59 | (function() { 60 | goog.exportSymbol('anychart.ganttEditor', window['anychart'].ganttEditor); 61 | goog.exportSymbol('chartEditor.editor.Gantt.preprocessResourceMapping', chartEditor.editor.Gantt.preprocessResourceMapping); 62 | goog.exportSymbol('chartEditor.editor.Gantt.preprocessResourceData', chartEditor.editor.Gantt.preprocessResourceData); 63 | })(); 64 | -------------------------------------------------------------------------------- /src/editor/Map.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.editor.Map'); 2 | 3 | goog.require('chartEditor.editor.Base'); 4 | goog.require('chartEditor.model.Map'); 5 | 6 | 7 | /** 8 | * Editor ui for Map Editor 9 | * 10 | * @constructor 11 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 12 | * @param {chartEditor.enums.ChartType=} opt_lockedChartType - Locked chart type. 13 | * @extends {chartEditor.editor.Base} 14 | */ 15 | chartEditor.editor.Map = function(opt_domHelper, opt_lockedChartType) { 16 | chartEditor.editor.Map.base(this, 'constructor', opt_domHelper, opt_lockedChartType); 17 | 18 | this.setModel(new chartEditor.model.Map()); 19 | 20 | this.addClassName(goog.getCssName('anychart-ce-map')); 21 | }; 22 | goog.inherits(chartEditor.editor.Map, chartEditor.editor.Base); 23 | 24 | 25 | /** 26 | * Constructor function for Map Editor. 27 | * @param {chartEditor.enums.ChartType=} opt_lockedChartType - Locked chart type. 28 | * @return {chartEditor.editor.Map} 29 | */ 30 | window['anychart'].mapEditor = function(opt_lockedChartType) { 31 | return new chartEditor.editor.Map(void 0, opt_lockedChartType); 32 | }; 33 | 34 | 35 | //exports 36 | (function() { 37 | goog.exportSymbol('anychart.mapEditor', window['anychart'].mapEditor); 38 | })(); 39 | -------------------------------------------------------------------------------- /src/editor/Stock.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.editor.Stock'); 2 | 3 | goog.require('chartEditor.editor.Base'); 4 | goog.require('chartEditor.model.Stock'); 5 | 6 | 7 | /** 8 | * Editor ui for Stock Editor 9 | * 10 | * @constructor 11 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 12 | * @param {chartEditor.enums.ChartType=} opt_lockedChartType - Locked chart type. 13 | * @extends {chartEditor.editor.Base} 14 | */ 15 | chartEditor.editor.Stock = function(opt_domHelper, opt_lockedChartType) { 16 | chartEditor.editor.Stock.base(this, 'constructor', opt_domHelper, opt_lockedChartType); 17 | 18 | this.setModel(new chartEditor.model.Stock()); 19 | 20 | this.addClassName(goog.getCssName('anychart-ce-stock')); 21 | }; 22 | goog.inherits(chartEditor.editor.Stock, chartEditor.editor.Base); 23 | 24 | 25 | /** 26 | * Constructor function for Stock Editor. 27 | * @param {chartEditor.enums.ChartType=} opt_lockedChartType - Locked chart type. 28 | * @return {chartEditor.editor.Stock} 29 | */ 30 | window['anychart'].stockEditor = function(opt_lockedChartType) { 31 | return new chartEditor.editor.Stock(void 0, opt_lockedChartType); 32 | }; 33 | 34 | 35 | //exports 36 | (function() { 37 | goog.exportSymbol('anychart.stockEditor', window['anychart'].stockEditor); 38 | })(); 39 | -------------------------------------------------------------------------------- /src/editor/bundle.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.editor.bundle'); 2 | 3 | goog.require('chartEditor.editor.Chart'); 4 | goog.require('chartEditor.editor.Gantt'); 5 | goog.require('chartEditor.editor.Stock'); 6 | goog.require('chartEditor.enums'); 7 | goog.require('chartEditor.ui.dialog.Settings'); 8 | 9 | 10 | 11 | /** 12 | * Constructor function for Stock Editor. 13 | * @param {chartEditor.enums.ChartType=} opt_lockedChartType - Locked chart type. 14 | * @return {chartEditor.editor.Base} 15 | */ 16 | window['anychart'].editor = function(opt_lockedChartType) { 17 | var lockedChartType = goog.isDefAndNotNull(opt_lockedChartType) ? 18 | chartEditor.enums.normalizeChartType(opt_lockedChartType) : 19 | null; 20 | if (lockedChartType) { 21 | var types = chartEditor.model.ChartTypes; 22 | var config = types[lockedChartType]; 23 | var product = config.product; 24 | switch (product) { 25 | case chartEditor.model.Product.GANTT: 26 | return new chartEditor.editor.Gantt(void 0, lockedChartType); 27 | // case chartEditor.model.Product.MAP: 28 | // return new chartEditor.editor.Map(void 0, lockedChartType); 29 | case chartEditor.model.Product.STOCK: 30 | return new chartEditor.editor.Stock(void 0, lockedChartType); 31 | default: 32 | return new chartEditor.editor.Chart(void 0, lockedChartType); 33 | } 34 | } 35 | return new chartEditor.editor.Chart(); 36 | }; 37 | 38 | 39 | //exports 40 | (function() { 41 | goog.exportSymbol('anychart.editor', window['anychart'].editor); 42 | })(); 43 | -------------------------------------------------------------------------------- /src/events.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.events'); 2 | goog.require('goog.events'); 3 | 4 | 5 | /** @enum {string} */ 6 | chartEditor.events.EventType = { 7 | WAIT: goog.events.getUniqueId('wait'), 8 | 9 | // working with data model 10 | DATA_ADD: goog.events.getUniqueId('data-add'), 11 | DATA_REMOVE: goog.events.getUniqueId('data-remove'), 12 | GEO_DATA_INDEX_LOADED: goog.events.getUniqueId('geo-data-index-loaded'), 13 | 14 | // editor model 15 | EDITOR_MODEL_UPDATE: goog.events.getUniqueId('editor-model-update'), 16 | EDITOR_MODEL_UPDATE_SPECIAL: goog.events.getUniqueId('editor-model-update-special'), 17 | 18 | CHART_DRAW: goog.events.getUniqueId('chart-draw'), 19 | 20 | // widgets events 21 | FILTER_UPDATE: goog.events.getUniqueId('filter-update'), 22 | PANEL_CLOSE: goog.events.getUniqueId('panel-close'), 23 | 24 | OPEN_SAMPLE_DIALOG: goog.events.getUniqueId('open-sample-dialog'), 25 | 26 | LOCK: goog.events.getUniqueId('lock'), 27 | 28 | EDIT_DATA_SUBMIT: goog.events.getUniqueId('edit-data-submit') 29 | }; 30 | -------------------------------------------------------------------------------- /src/ganttEditor.js: -------------------------------------------------------------------------------- 1 | goog.provide('ganttEditor'); 2 | 3 | goog.require('chartEditor.editor.Gantt'); 4 | 5 | /** 6 | * Set default css name mapping for anychart chart editor ui. 7 | */ 8 | goog.setCssNameMapping({ 9 | 'goog': 'anychart-ce' 10 | }); 11 | 12 | chartEditor.DEVELOP = true; 13 | 14 | chartEditor.PRODUCT = chartEditor.model.Product.GANTT; -------------------------------------------------------------------------------- /src/mapEditor.js: -------------------------------------------------------------------------------- 1 | goog.provide('mapEditor'); 2 | 3 | goog.require('chartEditor.editor.Map'); 4 | 5 | /** 6 | * Set default css name mapping for anychart chart editor ui. 7 | */ 8 | goog.setCssNameMapping({ 9 | 'goog': 'anychart-ce' 10 | }); 11 | 12 | chartEditor.DEVELOP = true; 13 | 14 | chartEditor.PRODUCT = chartEditor.model.Product.MAP; -------------------------------------------------------------------------------- /src/stockEditor.js: -------------------------------------------------------------------------------- 1 | goog.provide('stockEditor'); 2 | 3 | goog.require('chartEditor.editor.Stock'); 4 | 5 | /** 6 | * Set default css name mapping for anychart chart editor ui. 7 | */ 8 | goog.setCssNameMapping({ 9 | 'goog': 'anychart-ce' 10 | }); 11 | 12 | chartEditor.DEVELOP = true; 13 | 14 | chartEditor.PRODUCT = chartEditor.model.Product.STOCK; -------------------------------------------------------------------------------- /src/ui/PanelIndexed.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.PanelIndexed'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | 5 | 6 | /** 7 | * @param {chartEditor.model.Base} model 8 | * @param {number} index 9 | * @param {?string=} opt_name 10 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 11 | * @constructor 12 | * @extends {chartEditor.ui.Panel} 13 | */ 14 | chartEditor.ui.PanelIndexed = function(model, index, opt_name, opt_domHelper) { 15 | chartEditor.ui.PanelIndexed.base(this, 'constructor', model, opt_name, opt_domHelper); 16 | 17 | /** @type {number|undefined} */ 18 | this.plotIndex_ = void 0; 19 | 20 | /** @type {number} */ 21 | this.index_ = index; 22 | 23 | this.addClassName(goog.getCssName('anychart-ce-panel-indexed')); 24 | }; 25 | goog.inherits(chartEditor.ui.PanelIndexed, chartEditor.ui.Panel); 26 | 27 | 28 | /** @return {number} */ 29 | chartEditor.ui.PanelIndexed.prototype.getIndex = function() { 30 | return this.index_; 31 | }; 32 | 33 | 34 | /** @return {number} */ 35 | chartEditor.ui.PanelIndexed.prototype.getPlotIndex = function() { 36 | return goog.isNumber(this.plotIndex_) ? this.plotIndex_ : 0; 37 | }; 38 | 39 | 40 | /** @inheritDoc */ 41 | chartEditor.ui.PanelIndexed.prototype.createDom = function() { 42 | chartEditor.ui.PanelIndexed.base(this, 'createDom'); 43 | goog.dom.classlist.add(this.getElement(), this.index_ % 2 ? 'even' : 'odd'); 44 | }; 45 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/ChartLabels.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.ChartLabels'); 2 | 3 | goog.require('chartEditor.enums'); 4 | goog.require('chartEditor.ui.PanelsGroup'); 5 | goog.require('chartEditor.ui.panel.ChartLabel'); 6 | 7 | 8 | 9 | /** 10 | * @param {chartEditor.model.Base} model 11 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 12 | * @constructor 13 | * @extends {chartEditor.ui.PanelsGroup} 14 | */ 15 | chartEditor.ui.appearanceTabs.ChartLabels = function(model, opt_domHelper) { 16 | chartEditor.ui.appearanceTabs.ChartLabels.base(this, 'constructor', model, 'Chart Labels', opt_domHelper); 17 | 18 | this.stringId = chartEditor.enums.EditorTabs.CHART_LABELS; 19 | 20 | this.setButtonLabel('+ Add label'); 21 | 22 | this.removeFromIndex(0); 23 | 24 | this.addClassName(goog.getCssName('anychart-ce-panel-gauge-ranges')); 25 | }; 26 | goog.inherits(chartEditor.ui.appearanceTabs.ChartLabels, chartEditor.ui.PanelsGroup); 27 | 28 | 29 | /** @override */ 30 | chartEditor.ui.appearanceTabs.ChartLabels.prototype.createPanel = function() { 31 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 32 | var panelIndex = model.addIndexedSetting('label', true); 33 | return new chartEditor.ui.panel.ChartLabel(model, panelIndex); 34 | }; 35 | 36 | 37 | /** @override */ 38 | chartEditor.ui.appearanceTabs.ChartLabels.prototype.removePanel = function(panelIndex) { 39 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 40 | model.dropIndexedSetting(panelIndex, 'label'); 41 | }; 42 | 43 | 44 | /** @override */ 45 | chartEditor.ui.appearanceTabs.ChartLabels.prototype.createPanels = function() { 46 | if (!this.isExcluded()) { 47 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 48 | var settings = model.getModel()['chart']['settings']; 49 | 50 | var pattern = '^label\\((\\d+)\\)$'; 51 | var regExp = new RegExp(pattern); 52 | 53 | for (var key in settings) { 54 | var match = key.match(regExp); 55 | if (match) { 56 | var axisIndex = Number(match[1]); 57 | var panel = new chartEditor.ui.panel.ChartLabel(model, axisIndex); 58 | this.addPanelInstance(panel); 59 | } 60 | } 61 | } 62 | }; 63 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/ChartTitle.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.ChartTitle'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.panel.Title'); 5 | 6 | 7 | 8 | /** 9 | * @param {chartEditor.model.Base} model 10 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 11 | * @constructor 12 | * @extends {chartEditor.ui.Panel} 13 | */ 14 | chartEditor.ui.appearanceTabs.ChartTitle = function(model, opt_domHelper) { 15 | chartEditor.ui.appearanceTabs.ChartTitle.base(this, 'constructor', model, 'Chart Title', opt_domHelper); 16 | 17 | this.stringId = chartEditor.enums.EditorTabs.TITLE; 18 | 19 | this.key = [['chart'], ['settings'], 'title()']; 20 | 21 | this.allowReset(true); 22 | }; 23 | goog.inherits(chartEditor.ui.appearanceTabs.ChartTitle, chartEditor.ui.Panel); 24 | 25 | 26 | /** @inheritDoc */ 27 | chartEditor.ui.appearanceTabs.ChartTitle.prototype.createDom = function() { 28 | chartEditor.ui.appearanceTabs.ChartTitle.base(this, 'createDom'); 29 | 30 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 31 | var title = new chartEditor.ui.panel.Title(model, null); 32 | title.allowEnabled(false); 33 | title.setPositionKey('orientation()'); 34 | title.setKey([['chart'], ['settings'], 'title()']); 35 | this.addChildControl(title); 36 | }; 37 | 38 | 39 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/CircularRanges.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.CircularRanges'); 2 | 3 | goog.require('chartEditor.enums'); 4 | goog.require('chartEditor.ui.PanelsGroup'); 5 | goog.require('chartEditor.ui.panel.CircularRange'); 6 | 7 | 8 | 9 | /** 10 | * @param {chartEditor.model.Base} model 11 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 12 | * @constructor 13 | * @extends {chartEditor.ui.PanelsGroup} 14 | */ 15 | chartEditor.ui.appearanceTabs.CircularRanges = function(model, opt_domHelper) { 16 | chartEditor.ui.appearanceTabs.CircularRanges.base(this, 'constructor', model, 'Ranges', opt_domHelper); 17 | 18 | this.stringId = chartEditor.enums.EditorTabs.CIRCULAR_RANGES; 19 | 20 | this.setButtonLabel('+ Add range'); 21 | 22 | this.removeFromIndex(0); 23 | 24 | this.addClassName(goog.getCssName('anychart-ce-panel-gauge-ranges')); 25 | }; 26 | goog.inherits(chartEditor.ui.appearanceTabs.CircularRanges, chartEditor.ui.PanelsGroup); 27 | 28 | 29 | /** @override */ 30 | chartEditor.ui.appearanceTabs.CircularRanges.prototype.createPanel = function() { 31 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 32 | var panelIndex = model.addIndexedSetting('range', true); 33 | return new chartEditor.ui.panel.CircularRange(model, panelIndex); 34 | }; 35 | 36 | 37 | /** @override */ 38 | chartEditor.ui.appearanceTabs.CircularRanges.prototype.removePanel = function(panelIndex) { 39 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 40 | model.dropIndexedSetting(panelIndex, 'range'); 41 | }; 42 | 43 | 44 | /** @override */ 45 | chartEditor.ui.appearanceTabs.CircularRanges.prototype.createPanels = function() { 46 | if (!this.isExcluded()) { 47 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 48 | var settings = model.getModel()['chart']['settings']; 49 | 50 | var pattern = '^range\\((\\d+)\\)$'; 51 | var regExp = new RegExp(pattern); 52 | 53 | for (var key in settings) { 54 | var match = key.match(regExp); 55 | if (match) { 56 | var axisIndex = Number(match[1]); 57 | var panel = new chartEditor.ui.panel.CircularRange(model, axisIndex); 58 | this.addPanelInstance(panel); 59 | } 60 | } 61 | } 62 | }; 63 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/ColorScale.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.ColorScale'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.panel.scales.Base'); 5 | 6 | 7 | 8 | /** 9 | * @param {chartEditor.model.Base} model 10 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 11 | * @constructor 12 | * @extends {chartEditor.ui.Panel} 13 | */ 14 | chartEditor.ui.appearanceTabs.ColorScale = function(model, opt_domHelper) { 15 | chartEditor.ui.appearanceTabs.ColorScale.base(this, 'constructor', model, 'Color Scale', opt_domHelper); 16 | 17 | this.stringId = chartEditor.enums.EditorTabs.COLOR_SCALE; 18 | }; 19 | goog.inherits(chartEditor.ui.appearanceTabs.ColorScale, chartEditor.ui.Panel); 20 | 21 | 22 | /** @inheritDoc */ 23 | chartEditor.ui.appearanceTabs.ColorScale.prototype.createDom = function() { 24 | chartEditor.ui.appearanceTabs.ColorScale.base(this, 'createDom'); 25 | var element = /** @type {Element} */(this.getElement()); 26 | goog.dom.classlist.add(element, 'panel-panel-color-scale'); 27 | 28 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 29 | var chartColorScale = new chartEditor.ui.panel.scales.Base(model, ['linear-color', 'ordinal-color']); 30 | chartColorScale.setName(null); 31 | chartColorScale.setKey([['chart'], ['settings'], 'colorScale()']); 32 | this.addChildControl(chartColorScale); 33 | }; 34 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/Data.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.Data'); 2 | 3 | goog.require("chartEditor.ui.Component"); 4 | goog.require("chartEditor.ui.Panel"); 5 | goog.require("chartEditor.ui.dataSettings.Widget"); 6 | 7 | 8 | 9 | /** 10 | * @param {chartEditor.model.Base} model 11 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 12 | * @constructor 13 | * @extends {chartEditor.ui.Panel} 14 | */ 15 | chartEditor.ui.appearanceTabs.Data = function(model, opt_domHelper) { 16 | chartEditor.ui.appearanceTabs.Data.base(this, 'constructor', model, 'Data', opt_domHelper); 17 | this.stringId = chartEditor.enums.EditorTabs.DATA; 18 | }; 19 | goog.inherits(chartEditor.ui.appearanceTabs.Data, chartEditor.ui.Panel); 20 | 21 | 22 | /** @inheritDoc */ 23 | chartEditor.ui.appearanceTabs.Data.prototype.createDom = function() { 24 | chartEditor.ui.appearanceTabs.Data.base(this, 'createDom'); 25 | 26 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 27 | 28 | // user data and predefined data sets sections wrapper 29 | var wrapper = new chartEditor.ui.Component(); 30 | this.addChild(wrapper, true); 31 | 32 | var chartDataSettings = new chartEditor.ui.dataSettings.Widget(model); 33 | wrapper.addChild(chartDataSettings, true); 34 | }; 35 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/DataLabels.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.DataLabels'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.panel.Labels'); 5 | 6 | 7 | 8 | /** 9 | * @param {chartEditor.model.Base} model 10 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 11 | * @constructor 12 | * @extends {chartEditor.ui.Panel} 13 | */ 14 | chartEditor.ui.appearanceTabs.DataLabels = function(model, opt_domHelper) { 15 | chartEditor.ui.appearanceTabs.DataLabels.base(this, 'constructor', model, 'Data Labels', opt_domHelper); 16 | 17 | this.stringId = chartEditor.enums.EditorTabs.DATA_LABELS; 18 | 19 | this.key = [['chart'], ['settings'], 'labels()']; 20 | 21 | this.allowReset(true); 22 | }; 23 | goog.inherits(chartEditor.ui.appearanceTabs.DataLabels, chartEditor.ui.Panel); 24 | 25 | 26 | /** @inheritDoc */ 27 | chartEditor.ui.appearanceTabs.DataLabels.prototype.createDom = function() { 28 | chartEditor.ui.appearanceTabs.DataLabels.base(this, 'createDom'); 29 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 30 | 31 | var settings = new chartEditor.ui.panel.Labels(model); 32 | settings.allowEnabled(false); 33 | settings.setName(null); 34 | settings.setKey(this.getKey()); 35 | this.addChildControl(settings); 36 | 37 | this.settings_ = settings; 38 | }; 39 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/DropOff.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.DropOff'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require("chartEditor.ui.control.colorPicker.Base"); 5 | goog.require("chartEditor.ui.control.wrapped.Labeled"); 6 | goog.require('chartEditor.ui.panel.Labels'); 7 | goog.require("chartEditor.ui.panel.Stroke"); 8 | goog.require('chartEditor.ui.panel.Tooltip'); 9 | 10 | 11 | 12 | /** 13 | * @param {chartEditor.model.Base} model 14 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 15 | * @constructor 16 | * @extends {chartEditor.ui.Panel} 17 | */ 18 | chartEditor.ui.appearanceTabs.DropOff = function(model, opt_domHelper) { 19 | chartEditor.ui.appearanceTabs.DropOff.base(this, 'constructor', model, 'DropOffs', opt_domHelper); 20 | this.stringId = chartEditor.enums.EditorTabs.DROP_OFF; 21 | this.key = [['chart'], ['settings'], 'dropoff()']; 22 | this.allowEnabled(false); 23 | 24 | this.allowReset(true); 25 | }; 26 | goog.inherits(chartEditor.ui.appearanceTabs.DropOff, chartEditor.ui.Panel); 27 | 28 | 29 | /** @inheritDoc */ 30 | chartEditor.ui.appearanceTabs.DropOff.prototype.createDom = function() { 31 | chartEditor.ui.appearanceTabs.DropOff.base(this, 'createDom'); 32 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 33 | 34 | var fill = new chartEditor.ui.control.colorPicker.Base(); 35 | var fillLC = new chartEditor.ui.control.wrapped.Labeled(fill, 'Fill'); 36 | fillLC.init(model, this.genKey('fill()')); 37 | this.addChildControl(fillLC); 38 | 39 | var stroke = new chartEditor.ui.panel.Stroke(model, 'Stroke'); 40 | stroke.setKey(this.genKey('stroke()')); 41 | this.addChildControl(stroke); 42 | 43 | this.addContentSeparator(); 44 | 45 | var labelSettings = new chartEditor.ui.panel.Labels(model); 46 | labelSettings.allowEnabled(true); 47 | labelSettings.setName('Labels'); 48 | labelSettings.allowEditPosition(false); 49 | labelSettings.setKey(this.genKey('labels()')); 50 | this.addChildControl(labelSettings); 51 | 52 | this.addContentSeparator(); 53 | 54 | var tooltipSettings = new chartEditor.ui.panel.Tooltip(model); 55 | tooltipSettings.allowEnabled(false); 56 | tooltipSettings.allowEditDisplayMode(false); 57 | tooltipSettings.allowEditPositionMode(false); 58 | tooltipSettings.setName('Tooltip'); 59 | tooltipSettings.setKey(this.genKey('tooltip()')); 60 | this.addChildControl(tooltipSettings); 61 | }; 62 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/Flow.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.Flow'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require("chartEditor.ui.control.colorPicker.Base"); 5 | goog.require("chartEditor.ui.control.wrapped.Labeled"); 6 | goog.require('chartEditor.ui.panel.Labels'); 7 | goog.require("chartEditor.ui.panel.Stroke"); 8 | goog.require('chartEditor.ui.panel.Tooltip'); 9 | 10 | 11 | 12 | /** 13 | * @param {chartEditor.model.Base} model 14 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 15 | * @constructor 16 | * @extends {chartEditor.ui.Panel} 17 | */ 18 | chartEditor.ui.appearanceTabs.Flow = function(model, opt_domHelper) { 19 | chartEditor.ui.appearanceTabs.Flow.base(this, 'constructor', model, 'Flows', opt_domHelper); 20 | this.stringId = chartEditor.enums.EditorTabs.FLOW; 21 | this.key = [['chart'], ['settings'], 'flow()']; 22 | this.allowEnabled(false); 23 | 24 | this.allowReset(true); 25 | }; 26 | goog.inherits(chartEditor.ui.appearanceTabs.Flow, chartEditor.ui.Panel); 27 | 28 | 29 | /** @inheritDoc */ 30 | chartEditor.ui.appearanceTabs.Flow.prototype.createDom = function() { 31 | chartEditor.ui.appearanceTabs.Flow.base(this, 'createDom'); 32 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 33 | 34 | var fill = new chartEditor.ui.control.colorPicker.Base(); 35 | var fillLC = new chartEditor.ui.control.wrapped.Labeled(fill, 'Fill'); 36 | fillLC.init(model, this.genKey('fill()')); 37 | this.addChildControl(fillLC); 38 | 39 | var stroke = new chartEditor.ui.panel.Stroke(model, 'Stroke'); 40 | stroke.setKey(this.genKey('stroke()')); 41 | this.addChildControl(stroke); 42 | 43 | this.addContentSeparator(); 44 | 45 | var labelSettings = new chartEditor.ui.panel.Labels(model); 46 | labelSettings.allowEnabled(true); 47 | labelSettings.setName('Labels'); 48 | labelSettings.allowEditPosition(false); 49 | labelSettings.setKey(this.genKey('labels()')); 50 | this.addChildControl(labelSettings); 51 | 52 | this.addContentSeparator(); 53 | 54 | var tooltipSettings = new chartEditor.ui.panel.Tooltip(model); 55 | tooltipSettings.allowEnabled(false); 56 | tooltipSettings.allowEditDisplayMode(false); 57 | tooltipSettings.allowEditPositionMode(false); 58 | tooltipSettings.setName('Tooltip'); 59 | tooltipSettings.setKey(this.genKey('tooltip()')); 60 | this.addChildControl(tooltipSettings); 61 | }; 62 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/GanttDataGrid.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.GanttDataGrid'); 2 | 3 | goog.require('chartEditor.ui.PanelsGroup'); 4 | goog.require('chartEditor.ui.panel.ganttProject.Column'); 5 | 6 | 7 | 8 | /** 9 | * @param {chartEditor.model.Base} model 10 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 11 | * @constructor 12 | * @extends {chartEditor.ui.PanelsGroup} 13 | */ 14 | chartEditor.ui.appearanceTabs.GanttDataGrid = function(model, opt_domHelper) { 15 | chartEditor.ui.appearanceTabs.GanttDataGrid.base(this, 'constructor', model, 'Data grid', opt_domHelper); 16 | 17 | this.stringId = chartEditor.enums.EditorTabs.GANTT_DATAGRID; 18 | 19 | /** @type {number}*/ 20 | this.lastColumnIndex = 0; 21 | 22 | this.setButtonLabel('+ Add column'); 23 | this.removeFromIndex(2); 24 | this.addClassName(goog.getCssName('anychart-ce-panel-gantt-datagrid')); 25 | }; 26 | goog.inherits(chartEditor.ui.appearanceTabs.GanttDataGrid, chartEditor.ui.PanelsGroup); 27 | 28 | 29 | /** @override */ 30 | chartEditor.ui.appearanceTabs.GanttDataGrid.prototype.createPanel = function() { 31 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 32 | return /**@type {chartEditor.ui.PanelIndexed}*/(new chartEditor.ui.panel.ganttProject.Column(model, this.lastColumnIndex++)); 33 | }; 34 | 35 | 36 | /** @override */ 37 | chartEditor.ui.appearanceTabs.GanttDataGrid.prototype.removePanel = function(panelIndex) { 38 | var model = this.getModel(); 39 | model.dropIndexedSetting(panelIndex, 'dataGrid\\(\\)\\.column'); 40 | this.lastColumnIndex--; 41 | }; 42 | 43 | 44 | /** @override */ 45 | chartEditor.ui.appearanceTabs.GanttDataGrid.prototype.createPanels = function() { 46 | if (!this.isExcluded()) { 47 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 48 | var settings = model.getModel()['chart']['settings']; 49 | this.lastColumnIndex = 0; 50 | var pattern = '^dataGrid\(\)\.column\(\d\).enabled\\(\\)$'; 51 | var regExp = new RegExp(pattern); 52 | 53 | for (var key in settings) { 54 | var match = key.match(regExp); 55 | if (match) { 56 | this.addPanelInstance(/** @type {chartEditor.ui.PanelIndexed} */(this.createPanel())); 57 | } 58 | } 59 | 60 | if (this.lastColumnIndex == 0) { 61 | model.suspendDispatch(); 62 | // Always create 2 column for gantt chart 63 | this.addPanelInstance(/** @type {chartEditor.ui.PanelIndexed} */(this.createPanel())); 64 | this.addPanelInstance(/** @type {chartEditor.ui.PanelIndexed} */(this.createPanel())); 65 | model.resumeDispatch(false); 66 | } 67 | } 68 | }; 69 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/GanttGridColoring.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.GanttGridColoring'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.panel.ganttProject.Coloring'); 5 | 6 | 7 | 8 | /** 9 | * @param {chartEditor.model.Base} model 10 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 11 | * @constructor 12 | * @extends {chartEditor.ui.Panel} 13 | */ 14 | chartEditor.ui.appearanceTabs.GanttGridColoring = function(model, opt_domHelper) { 15 | chartEditor.ui.appearanceTabs.GanttGridColoring.base(this, 'constructor', model, 'Grid coloring', opt_domHelper); 16 | 17 | this.stringId = chartEditor.enums.EditorTabs.GANTT_GRID_COLORING; 18 | 19 | this.allowEnabled(false); 20 | 21 | this.allowReset(true); 22 | 23 | this.addClassName(goog.getCssName('anychart-ce-panel-gantt-datagrid-coloring')); 24 | }; 25 | goog.inherits(chartEditor.ui.appearanceTabs.GanttGridColoring, chartEditor.ui.Panel); 26 | 27 | 28 | /** @inheritDoc */ 29 | chartEditor.ui.appearanceTabs.GanttGridColoring.prototype.createDom = function() { 30 | chartEditor.ui.appearanceTabs.GanttGridColoring.base(this, 'createDom'); 31 | 32 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 33 | 34 | var timeLine = new chartEditor.ui.panel.ganttProject.Coloring(model, 'Timeline'); 35 | timeLine.setKey([['chart'], ['settings'], 'getTimeline()']); 36 | timeLine.allowEnabled(false); 37 | this.addChildControl(timeLine); 38 | 39 | this.addContentSeparator(); 40 | 41 | var dataGrid = new chartEditor.ui.panel.ganttProject.Coloring(model, 'Data grid'); 42 | dataGrid.allowEnabled(false); 43 | dataGrid.setKey([['chart'], ['settings'], 'dataGrid()']); 44 | this.addChildControl(dataGrid); 45 | }; 46 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/GanttTimeLineHeader.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.GanttTimeLineHeader'); 2 | 3 | goog.require("chartEditor.ui.Panel"); 4 | goog.require("chartEditor.ui.panel.ganttProject.LevelWrapper"); 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 10 | * @constructor 11 | * @extends {chartEditor.ui.Panel} 12 | */ 13 | chartEditor.ui.appearanceTabs.GanttTimeLineHeader = function(model, opt_domHelper) { 14 | chartEditor.ui.appearanceTabs.GanttTimeLineHeader.base(this, 'constructor', model, 'Timeline header', opt_domHelper); 15 | 16 | this.stringId = chartEditor.enums.EditorTabs.GANTT_TIMELINE_HEADER; 17 | 18 | this.allowEnabled(false); 19 | 20 | this.allowReset(true); 21 | 22 | this.key = [['chart'], ['settings'], 'getTimeline().header()']; 23 | }; 24 | goog.inherits(chartEditor.ui.appearanceTabs.GanttTimeLineHeader, chartEditor.ui.Panel); 25 | 26 | 27 | /** @inheritDoc */ 28 | chartEditor.ui.appearanceTabs.GanttTimeLineHeader.prototype.createDom = function() { 29 | chartEditor.ui.appearanceTabs.GanttTimeLineHeader.base(this, 'createDom'); 30 | 31 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 32 | var timeLineHeader = new chartEditor.ui.panel.ganttProject.LevelWrapper(model, void 0, 'Common settings'); 33 | timeLineHeader.allowEnabled(false); 34 | timeLineHeader.setKey(this.getKey()); 35 | this.addChildControl(timeLineHeader); 36 | 37 | this.addContentSeparator(); 38 | 39 | var levelIndex = 0; 40 | var level0 = new chartEditor.ui.panel.ganttProject.LevelWrapper(model, levelIndex); 41 | level0.setKey(this.genKey('level(' + levelIndex + ')')); 42 | this.addChildControl(level0); 43 | 44 | this.addContentSeparator(); 45 | 46 | levelIndex = 1; 47 | var level1 = new chartEditor.ui.panel.ganttProject.LevelWrapper(model, levelIndex); 48 | level1.setKey(this.genKey('level(' + levelIndex + ')')); 49 | this.addChildControl(level1); 50 | 51 | this.addContentSeparator(); 52 | 53 | levelIndex = 2; 54 | var level2 = new chartEditor.ui.panel.ganttProject.LevelWrapper(model, levelIndex); 55 | level2.setKey(this.genKey('level(' + levelIndex + ')')); 56 | this.addChildControl(level2); 57 | }; 58 | 59 | 60 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/Grids.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.Grids'); 2 | 3 | goog.require('chartEditor.ui.PanelsGroup'); 4 | goog.require('chartEditor.ui.panel.PlotGrids'); 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 10 | * @constructor 11 | * @extends {chartEditor.ui.PanelsGroup} 12 | */ 13 | chartEditor.ui.appearanceTabs.Grids = function(model, opt_domHelper) { 14 | chartEditor.ui.appearanceTabs.Grids.base(this, 'constructor', model, 'Grids', opt_domHelper); 15 | 16 | this.stringId = chartEditor.enums.EditorTabs.GRIDS; 17 | 18 | this.allowAddPanels(false); 19 | }; 20 | goog.inherits(chartEditor.ui.appearanceTabs.Grids, chartEditor.ui.PanelsGroup); 21 | 22 | 23 | /** 24 | * Create plotGrids panel panel. 25 | */ 26 | chartEditor.ui.appearanceTabs.Grids.prototype.createPanels = function() { 27 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 28 | var chartType = model.getValue([['chart'], 'type']); 29 | var mappings = model.getValue([['dataSettings'], 'mappings']); 30 | 31 | var plotIndex; 32 | var plotGrids; 33 | for (var i = 0; i < mappings.length; i++) { 34 | plotIndex = chartType === 'stock' ? i : void 0; 35 | plotGrids = new chartEditor.ui.panel.PlotGrids(model, plotIndex); 36 | 37 | this.addPanelInstance(plotGrids); 38 | } 39 | }; 40 | 41 | 42 | 43 | /** @inheritDoc */ 44 | chartEditor.ui.appearanceTabs.Grids.prototype.onModelChange = function(evt) { 45 | chartEditor.ui.appearanceTabs.Grids.base(this, 'onModelChange', evt); 46 | 47 | var needRebuildFor = ['addPlot', 'dropPlot']; 48 | if (!this.isExcluded() && evt && needRebuildFor.indexOf(evt.meta) !== -1) { 49 | this.rebuildPanels(); 50 | } 51 | }; -------------------------------------------------------------------------------- /src/ui/appearanceTab/Legend.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.Legend'); 2 | 3 | goog.require('chartEditor.ui.PanelsGroup'); 4 | goog.require('chartEditor.ui.panel.Legend'); 5 | 6 | 7 | 8 | /** 9 | * @param {chartEditor.model.Base} model 10 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 11 | * @constructor 12 | * @extends {chartEditor.ui.PanelsGroup} 13 | */ 14 | chartEditor.ui.appearanceTabs.Legend = function(model, opt_domHelper) { 15 | chartEditor.ui.appearanceTabs.Legend.base(this, 'constructor', model, 'Legend', opt_domHelper); 16 | 17 | this.stringId = chartEditor.enums.EditorTabs.LEGEND; 18 | 19 | this.allowAddPanels(false); 20 | 21 | this.allowReset(true); 22 | }; 23 | goog.inherits(chartEditor.ui.appearanceTabs.Legend, chartEditor.ui.PanelsGroup); 24 | 25 | 26 | /** 27 | * Create legend panel panel. 28 | */ 29 | chartEditor.ui.appearanceTabs.Legend.prototype.createPanels = function() { 30 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 31 | var chartType = model.getValue([['chart'], 'type']); 32 | var mappings = model.getValue([['dataSettings'], 'mappings']); 33 | 34 | var plotIndex; 35 | var legend; 36 | for (var i = 0; i < mappings.length; i++) { 37 | plotIndex = chartType === 'stock' ? i : void 0; 38 | legend = new chartEditor.ui.panel.Legend(model, plotIndex); 39 | 40 | this.addPanelInstance(legend); 41 | } 42 | }; 43 | 44 | 45 | /** @inheritDoc */ 46 | chartEditor.ui.appearanceTabs.Legend.prototype.onModelChange = function(evt) { 47 | chartEditor.ui.appearanceTabs.Legend.base(this, 'onModelChange', evt); 48 | 49 | var needRebuildFor = ['addPlot', 'dropPlot']; 50 | if (!this.isExcluded() && evt && needRebuildFor.indexOf(evt.meta) !== -1) { 51 | this.rebuildPanels(); 52 | } 53 | }; 54 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/Node.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.Node'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require("chartEditor.ui.control.colorPicker.Base"); 5 | goog.require("chartEditor.ui.control.wrapped.Labeled"); 6 | goog.require('chartEditor.ui.panel.Labels'); 7 | goog.require("chartEditor.ui.panel.Stroke"); 8 | goog.require('chartEditor.ui.panel.Tooltip'); 9 | 10 | 11 | /** 12 | * @param {chartEditor.model.Base} model 13 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 14 | * @constructor 15 | * @extends {chartEditor.ui.Panel} 16 | */ 17 | chartEditor.ui.appearanceTabs.Node = function(model, opt_domHelper) { 18 | chartEditor.ui.appearanceTabs.Node.base(this, 'constructor', model, 'Nodes', opt_domHelper); 19 | this.stringId = chartEditor.enums.EditorTabs.NODE; 20 | this.key = [['chart'], ['settings'], 'node()']; 21 | this.allowEnabled(false); 22 | 23 | this.allowReset(true); 24 | }; 25 | goog.inherits(chartEditor.ui.appearanceTabs.Node, chartEditor.ui.Panel); 26 | 27 | 28 | /** @inheritDoc */ 29 | chartEditor.ui.appearanceTabs.Node.prototype.createDom = function() { 30 | chartEditor.ui.appearanceTabs.Node.base(this, 'createDom'); 31 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 32 | 33 | var fill = new chartEditor.ui.control.colorPicker.Base(); 34 | var fillLC = new chartEditor.ui.control.wrapped.Labeled(fill, 'Fill'); 35 | fillLC.init(model, this.genKey('fill()')); 36 | this.addChildControl(fillLC); 37 | 38 | var stroke = new chartEditor.ui.panel.Stroke(model, 'Stroke'); 39 | stroke.setKey(this.genKey('stroke()')); 40 | this.addChildControl(stroke); 41 | 42 | this.addContentSeparator(); 43 | 44 | var labelSettings = new chartEditor.ui.panel.Labels(model); 45 | labelSettings.allowEnabled(true); 46 | labelSettings.setName('Labels'); 47 | labelSettings.setKey(this.genKey('labels()')); 48 | this.addChildControl(labelSettings); 49 | 50 | this.addContentSeparator(); 51 | 52 | var tooltipSettings = new chartEditor.ui.panel.Tooltip(model); 53 | tooltipSettings.allowEnabled(false); 54 | tooltipSettings.allowEditDisplayMode(false); 55 | tooltipSettings.allowEditPositionMode(false); 56 | tooltipSettings.setName('Tooltip'); 57 | tooltipSettings.setKey(this.genKey('tooltip()')); 58 | this.addChildControl(tooltipSettings); 59 | }; 60 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/Quarters.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.Quarters'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.panel.Quarter'); 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 10 | * @constructor 11 | * @extends {chartEditor.ui.Panel} 12 | */ 13 | chartEditor.ui.appearanceTabs.Quarters = function(model, opt_domHelper) { 14 | chartEditor.ui.appearanceTabs.Quarters.base(this, 'constructor', model, 'Quarters', opt_domHelper); 15 | this.stringId = chartEditor.enums.EditorTabs.QUARTERS; 16 | this.key = [['chart'], ['settings'], 'quarters()']; 17 | this.allowEnabled(false); 18 | 19 | this.allowReset(true); 20 | }; 21 | goog.inherits(chartEditor.ui.appearanceTabs.Quarters, chartEditor.ui.Panel); 22 | 23 | 24 | /** @inheritDoc */ 25 | chartEditor.ui.appearanceTabs.Quarters.prototype.createDom = function() { 26 | chartEditor.ui.appearanceTabs.Quarters.base(this, 'createDom'); 27 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 28 | 29 | var leftTop = new chartEditor.ui.panel.Quarter(model); 30 | leftTop.setName('Left Top Quarter'); 31 | leftTop.setKey(this.genKey('leftTop()')); 32 | this.addChildControl(leftTop); 33 | 34 | this.addContentSeparator(); 35 | 36 | var rightTop = new chartEditor.ui.panel.Quarter(model); 37 | rightTop.setName('Right Top Quarter'); 38 | rightTop.setKey(this.genKey('rightTop()')); 39 | this.addChildControl(rightTop); 40 | 41 | this.addContentSeparator(); 42 | 43 | var leftBottom = new chartEditor.ui.panel.Quarter(model); 44 | leftBottom.setName('Left Bottom Quarter'); 45 | leftBottom.setKey(this.genKey('leftBottom()')); 46 | this.addChildControl(leftBottom); 47 | 48 | this.addContentSeparator(); 49 | 50 | var rightBottom = new chartEditor.ui.panel.Quarter(model); 51 | rightBottom.setName('Right Bottom Quarter'); 52 | rightBottom.setKey(this.genKey('rightBottom()')); 53 | this.addChildControl(rightBottom); 54 | }; 55 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/ScaleBars.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.ScaleBars'); 2 | 3 | goog.require('chartEditor.ui.PanelsGroup'); 4 | goog.require('chartEditor.ui.panel.ScaleBar'); 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 10 | * @constructor 11 | * @extends {chartEditor.ui.PanelsGroup} 12 | */ 13 | chartEditor.ui.appearanceTabs.ScaleBars = function(model, opt_domHelper) { 14 | chartEditor.ui.appearanceTabs.ScaleBars.base(this, 'constructor', model, 'Scale Bars', opt_domHelper); 15 | 16 | this.stringId = chartEditor.enums.EditorTabs.SCALE_BARS; 17 | 18 | this.setButtonLabel('+ Add scale bar'); 19 | 20 | this.removeFromIndex(0); 21 | 22 | this.addClassName(goog.getCssName('anychart-ce-panel-gauge-scale-bars')); 23 | }; 24 | goog.inherits(chartEditor.ui.appearanceTabs.ScaleBars, chartEditor.ui.PanelsGroup); 25 | 26 | 27 | /** @override */ 28 | chartEditor.ui.appearanceTabs.ScaleBars.prototype.createPanel = function() { 29 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 30 | var panelIndex = model.addIndexedSetting('scaleBar', true); 31 | return new chartEditor.ui.panel.ScaleBar(model, panelIndex); 32 | }; 33 | 34 | 35 | /** @override */ 36 | chartEditor.ui.appearanceTabs.ScaleBars.prototype.removePanel = function(panelIndex) { 37 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 38 | model.dropIndexedSetting(panelIndex, 'scaleBar'); 39 | }; 40 | 41 | 42 | /** @override */ 43 | chartEditor.ui.appearanceTabs.ScaleBars.prototype.createPanels = function() { 44 | if (!this.isExcluded()) { 45 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 46 | var settings = model.getModel()['chart']['settings']; 47 | 48 | var pattern = '^scaleBar\\((\\d+)\\)$'; 49 | var regExp = new RegExp(pattern); 50 | 51 | for (var key in settings) { 52 | var match = key.match(regExp); 53 | if (match) { 54 | var axisIndex = Number(match[1]); 55 | var panel = new chartEditor.ui.panel.ScaleBar(model, axisIndex); 56 | this.addPanelInstance(panel); 57 | } 58 | } 59 | } 60 | }; 61 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/Scales.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.Scales'); 2 | 3 | goog.require('chartEditor.scales.ScalePanel'); 4 | goog.require('chartEditor.ui.PanelsGroup'); 5 | 6 | 7 | 8 | /** 9 | * @param {chartEditor.model.Base} model 10 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 11 | * @constructor 12 | * @extends {chartEditor.ui.PanelsGroup} 13 | */ 14 | chartEditor.ui.appearanceTabs.Scales = function(model, opt_domHelper) { 15 | chartEditor.ui.appearanceTabs.Scales.base(this, 'constructor', model, 'Scales', opt_domHelper); 16 | 17 | this.stringId = chartEditor.enums.EditorTabs.SCALES; 18 | 19 | this.setButtonLabel('+ Add scale'); 20 | 21 | this.removeFromIndex(0); 22 | 23 | this.addClassName(goog.getCssName('anychart-ce-panel-scales')); 24 | this.addClassName(goog.getCssName('anychart-ce-panel-group-with-btn')); 25 | }; 26 | goog.inherits(chartEditor.ui.appearanceTabs.Scales, chartEditor.ui.PanelsGroup); 27 | 28 | 29 | /** @inheritDoc */ 30 | chartEditor.ui.appearanceTabs.Scales.prototype.enterDocument = function() { 31 | chartEditor.ui.appearanceTabs.Scales.base(this, 'enterDocument'); 32 | 33 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 34 | if (model) 35 | this.getHandler().listen(model, chartEditor.events.EventType.EDITOR_MODEL_UPDATE_SPECIAL, this.onModelSpecialChange); 36 | }; 37 | 38 | 39 | /** 40 | * Updates panel list on demand 41 | * @param {Object} evt 42 | */ 43 | chartEditor.ui.appearanceTabs.Scales.prototype.onModelSpecialChange = function(evt) { 44 | if (evt.target == this.stringId) { 45 | this.removeAllPanels(); 46 | this.createPanels(); 47 | } 48 | }; 49 | 50 | 51 | /** @override */ 52 | chartEditor.ui.appearanceTabs.Scales.prototype.createPanel = function() { 53 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 54 | var panelIndex = model.addStandalone('scale'); 55 | return new chartEditor.scales.ScalePanel(model, panelIndex); 56 | }; 57 | 58 | 59 | /** @override */ 60 | chartEditor.ui.appearanceTabs.Scales.prototype.removePanel = function() { 61 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 62 | model.dropStandalone('scale'); 63 | }; 64 | 65 | 66 | /** @override */ 67 | chartEditor.ui.appearanceTabs.Scales.prototype.createPanels = function() { 68 | if (!this.isExcluded()) { 69 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 70 | var scales = model.getValue([['standalones'], 'scale']); 71 | 72 | if (scales) { 73 | for (var i = 0; i < scales.length; i++) { 74 | var panel = new chartEditor.scales.ScalePanel(model, i); 75 | if (scales[i]['key']) { 76 | panel.setScaleAsDefault(scales[i]['type']); 77 | } 78 | 79 | this.addPanelInstance(panel); 80 | } 81 | } 82 | } 83 | }; 84 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/SeriesWithScales.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.SeriesWithScales'); 2 | 3 | goog.require('chartEditor.ui.PanelsGroup'); 4 | goog.require('chartEditor.ui.panel.series.SeriesWithScales'); 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 10 | * @constructor 11 | * @extends {chartEditor.ui.PanelsGroup} 12 | */ 13 | chartEditor.ui.appearanceTabs.SeriesWithScales = function(model, opt_domHelper) { 14 | chartEditor.ui.appearanceTabs.SeriesWithScales.base(this, 'constructor', model, 'Series', opt_domHelper); 15 | 16 | this.stringId = chartEditor.enums.EditorTabs.SERIES; 17 | 18 | this.allowAddPanels(false); 19 | }; 20 | goog.inherits(chartEditor.ui.appearanceTabs.SeriesWithScales, chartEditor.ui.PanelsGroup); 21 | 22 | 23 | /** 24 | * Create series panel panel. 25 | */ 26 | chartEditor.ui.appearanceTabs.SeriesWithScales.prototype.createPanels = function() { 27 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 28 | var singleSeries = model.isChartSingleSeries(); 29 | if (!singleSeries) { 30 | var mappings = model.getValue([['dataSettings'], 'mappings']); 31 | 32 | for (var j = 0; j < mappings[0].length; j++) { 33 | var seriesId = mappings[0][j]['id'] ? mappings[0][j]['id'] : j; 34 | var series = new chartEditor.ui.panel.series.SeriesWithScales(model, seriesId, j); 35 | this.addPanelInstance(series); 36 | } 37 | } 38 | }; 39 | 40 | 41 | /** @inheritDoc */ 42 | chartEditor.ui.appearanceTabs.SeriesWithScales.prototype.onModelChange = function(evt) { 43 | chartEditor.ui.appearanceTabs.SeriesWithScales.base(this, 'onModelChange', evt); 44 | 45 | var needRebuildFor = ['addSeries', 'dropSeries', 'setSeriesType']; 46 | if (!this.isExcluded() && evt && needRebuildFor.indexOf(evt.meta) !== -1) { 47 | this.rebuildPanels(); 48 | } 49 | }; 50 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/StockSeries.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.StockSeries'); 2 | 3 | goog.require('chartEditor.ui.PanelsGroup'); 4 | goog.require('chartEditor.ui.panel.series.StockSeries'); 5 | 6 | 7 | 8 | /** 9 | * @param {chartEditor.model.Base} model 10 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 11 | * @constructor 12 | * @extends {chartEditor.ui.PanelsGroup} 13 | */ 14 | chartEditor.ui.appearanceTabs.StockSeries = function(model, opt_domHelper) { 15 | chartEditor.ui.appearanceTabs.StockSeries.base(this, 'constructor', model, 'Series', opt_domHelper); 16 | 17 | this.stringId = chartEditor.enums.EditorTabs.SERIES; 18 | 19 | this.allowAddPanels(false); 20 | }; 21 | goog.inherits(chartEditor.ui.appearanceTabs.StockSeries, chartEditor.ui.PanelsGroup); 22 | 23 | 24 | /** 25 | * Create series panel panel. 26 | */ 27 | chartEditor.ui.appearanceTabs.StockSeries.prototype.createPanels = function() { 28 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 29 | var mappings = model.getValue([['dataSettings'], 'mappings']); 30 | 31 | for (var i = 0; i < mappings.length; i++) { 32 | for (var j = 0; j < mappings[i].length; j++) { 33 | var seriesId = mappings[i][j]['id'] ? mappings[i][j]['id'] : j; 34 | var series = new chartEditor.ui.panel.series.StockSeries(model, seriesId, j, i); 35 | this.addPanelInstance(series); 36 | } 37 | } 38 | }; 39 | 40 | 41 | /** @inheritDoc */ 42 | chartEditor.ui.appearanceTabs.StockSeries.prototype.onModelChange = function(evt) { 43 | chartEditor.ui.appearanceTabs.StockSeries.base(this, 'onModelChange', evt); 44 | var needRebuildFor = ['addPlot', 'dropPlot', 'addSeries', 'dropSeries', 'setSeriesType']; 45 | if (!this.isExcluded() && evt && needRebuildFor.indexOf(evt.meta) !== -1) { 46 | this.rebuildPanels(); 47 | } 48 | }; 49 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/Tabs.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.Tabs'); 2 | 3 | goog.require('chartEditor.model.Base'); 4 | goog.require('chartEditor.ui.Tabs'); 5 | 6 | 7 | 8 | /** 9 | * Appearance tabs widget. 10 | * 11 | * @param {chartEditor.model.Base} model 12 | * @param {chartEditor.ui.Component=} opt_buttonsWrapper 13 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 14 | * @constructor 15 | * @extends {chartEditor.ui.Tabs} 16 | */ 17 | chartEditor.ui.appearanceTabs.Tabs = function(model, opt_buttonsWrapper, opt_domHelper) { 18 | chartEditor.ui.appearanceTabs.Tabs.base(this, 'constructor', model, opt_buttonsWrapper, opt_domHelper); 19 | 20 | this.descriptors = model.appearanceTabs; 21 | }; 22 | goog.inherits(chartEditor.ui.appearanceTabs.Tabs, chartEditor.ui.Tabs); 23 | 24 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/Tooltip.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.Tooltip'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.panel.Tooltip'); 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 10 | * @constructor 11 | * @extends {chartEditor.ui.Panel} 12 | */ 13 | chartEditor.ui.appearanceTabs.Tooltip = function(model, opt_domHelper) { 14 | chartEditor.ui.appearanceTabs.Tooltip.base(this, 'constructor', model, 'Tooltip', opt_domHelper); 15 | 16 | this.stringId = chartEditor.enums.EditorTabs.TOOLTIP; 17 | 18 | this.key = [['chart'], ['settings'], 'tooltip()']; 19 | 20 | this.allowReset(true); 21 | }; 22 | goog.inherits(chartEditor.ui.appearanceTabs.Tooltip, chartEditor.ui.Panel); 23 | 24 | 25 | /** @inheritDoc */ 26 | chartEditor.ui.appearanceTabs.Tooltip.prototype.createDom = function() { 27 | chartEditor.ui.appearanceTabs.Tooltip.base(this, 'createDom'); 28 | 29 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 30 | 31 | var settings = new chartEditor.ui.panel.Tooltip(model); 32 | settings.allowEnabled(false); 33 | settings.allowReset(false); 34 | settings.setName(null); 35 | settings.setKey(this.getKey()); 36 | this.addChildControl(settings); 37 | }; 38 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/axes/CartesianXAxes.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.axes.CartesianXAxes'); 2 | 3 | goog.require('chartEditor.ui.appearanceTabs.axes.Cartesian'); 4 | 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 10 | * @constructor 11 | * @extends {chartEditor.ui.appearanceTabs.axes.Cartesian} 12 | */ 13 | chartEditor.ui.appearanceTabs.axes.CartesianXAxes = function(model, opt_domHelper) { 14 | chartEditor.ui.appearanceTabs.axes.CartesianXAxes.base(this, 'constructor', model, opt_domHelper); 15 | 16 | this.name = 'X Axes'; 17 | this.xOrY = 'x'; 18 | }; 19 | goog.inherits(chartEditor.ui.appearanceTabs.axes.CartesianXAxes, chartEditor.ui.appearanceTabs.axes.Cartesian); 20 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/axes/CartesianYAxes.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.axes.CartesianYAxes'); 2 | 3 | goog.require('chartEditor.ui.appearanceTabs.axes.Cartesian'); 4 | 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 10 | * @constructor 11 | * @extends {chartEditor.ui.appearanceTabs.axes.Cartesian} 12 | */ 13 | chartEditor.ui.appearanceTabs.axes.CartesianYAxes = function(model, opt_domHelper) { 14 | chartEditor.ui.appearanceTabs.axes.CartesianYAxes.base(this, 'constructor', model, opt_domHelper); 15 | 16 | this.name = 'Y Axes'; 17 | this.xOrY = 'y'; 18 | }; 19 | goog.inherits(chartEditor.ui.appearanceTabs.axes.CartesianYAxes, chartEditor.ui.appearanceTabs.axes.Cartesian); 20 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/axes/RadarPolar.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.axes.RadarPolar'); 2 | 3 | goog.require('chartEditor.ui.PanelsGroup'); 4 | goog.require('chartEditor.ui.panel.axes.Polar'); 5 | goog.require('chartEditor.ui.panel.axes.Radar'); 6 | goog.require('chartEditor.ui.panel.axes.Radial'); 7 | 8 | 9 | /** 10 | * Base class for axes of radar and polar charts. 11 | * 12 | * @param {chartEditor.model.Base} model 13 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 14 | * @constructor 15 | * @extends {chartEditor.ui.PanelsGroup} 16 | */ 17 | chartEditor.ui.appearanceTabs.axes.RadarPolar = function(model, opt_domHelper) { 18 | chartEditor.ui.appearanceTabs.axes.RadarPolar.base(this, 'constructor', model, 'RadarAxesPanelBase', opt_domHelper); 19 | 20 | this.stringId = chartEditor.enums.EditorTabs.RADAR_POLAR_AXES; 21 | 22 | /** 23 | * Axis prefix. Should be overridden. 24 | * @type {string} 25 | * @protected 26 | */ 27 | this.xOrY = ''; 28 | 29 | this.allowAddPanels(false); 30 | }; 31 | goog.inherits(chartEditor.ui.appearanceTabs.axes.RadarPolar, chartEditor.ui.PanelsGroup); 32 | 33 | 34 | /** @override */ 35 | chartEditor.ui.appearanceTabs.axes.RadarPolar.prototype.createPanels = function() { 36 | if (!this.isExcluded()) { 37 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 38 | var settings = model.getModel()['chart']['settings']; 39 | var chartType = model.getModel()['chart']['type']; 40 | 41 | var pattern = '^' + this.xOrY + 'Axis\\(\\)\\.enabled\\(\\)$'; 42 | var regExp = new RegExp(pattern); 43 | var axisCount = 0; 44 | 45 | for (var key in settings) { 46 | if (regExp.test(key)) { 47 | axisCount++; 48 | break; 49 | } 50 | } 51 | 52 | if (axisCount === 0) { 53 | // Always create 0 axis panel 54 | model.suspendDispatch(); 55 | var panel = this.xOrY === 'x' ? 56 | chartType === 'polar' ? 57 | new chartEditor.ui.panel.axes.Polar(model) : 58 | new chartEditor.ui.panel.axes.Radar(model) 59 | : 60 | new chartEditor.ui.panel.axes.Radial(model); 61 | this.addPanelInstance(panel); 62 | model.resumeDispatch(false); 63 | } 64 | } 65 | }; 66 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/axes/RadarPolarXAxis.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.axes.RadarPolarXAxis'); 2 | 3 | goog.require('chartEditor.ui.appearanceTabs.axes.RadarPolar'); 4 | 5 | 6 | /** 7 | * @param {chartEditor.model.Base} model 8 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 9 | * @constructor 10 | * @extends {chartEditor.ui.appearanceTabs.axes.RadarPolar} 11 | */ 12 | chartEditor.ui.appearanceTabs.axes.RadarPolarXAxis = function(model, opt_domHelper) { 13 | chartEditor.ui.appearanceTabs.axes.RadarPolarXAxis.base(this, 'constructor', model, opt_domHelper); 14 | 15 | this.name = 'X Axis'; 16 | this.xOrY = 'x'; 17 | }; 18 | goog.inherits(chartEditor.ui.appearanceTabs.axes.RadarPolarXAxis, chartEditor.ui.appearanceTabs.axes.RadarPolar); 19 | -------------------------------------------------------------------------------- /src/ui/appearanceTab/axes/RadarPolarYAxis.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.appearanceTabs.axes.RadarPolarYAxis'); 2 | 3 | goog.require('chartEditor.ui.appearanceTabs.axes.RadarPolar'); 4 | 5 | 6 | /** 7 | * @param {chartEditor.model.Base} model 8 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 9 | * @constructor 10 | * @extends {chartEditor.ui.appearanceTabs.axes.RadarPolar} 11 | */ 12 | chartEditor.ui.appearanceTabs.axes.RadarPolarYAxis = function(model, opt_domHelper) { 13 | chartEditor.ui.appearanceTabs.axes.RadarPolarYAxis.base(this, 'constructor', model, opt_domHelper); 14 | 15 | this.name = 'Y Axis'; 16 | this.xOrY = 'y'; 17 | }; 18 | goog.inherits(chartEditor.ui.appearanceTabs.axes.RadarPolarYAxis, chartEditor.ui.appearanceTabs.axes.RadarPolar); 19 | -------------------------------------------------------------------------------- /src/ui/breadcrumbs/Item.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.breadcrumbs.Item'); 2 | 3 | goog.require('chartEditor.ui.Component'); 4 | 5 | 6 | /** 7 | * @param {string} caption 8 | * @param {string=} opt_icon 9 | * @constructor 10 | * @extends {chartEditor.ui.Component} 11 | */ 12 | chartEditor.ui.breadcrumbs.Item = function(caption, opt_icon) { 13 | chartEditor.ui.breadcrumbs.Item.base(this, 'constructor'); 14 | this.caption_ = caption; 15 | this.icon_ = opt_icon; 16 | this.addClassName('anychart-ce-breadcrumbs-item'); 17 | }; 18 | goog.inherits(chartEditor.ui.breadcrumbs.Item, chartEditor.ui.Component); 19 | 20 | 21 | /** @inheritDoc */ 22 | chartEditor.ui.breadcrumbs.Item.prototype.createDom = function() { 23 | chartEditor.ui.breadcrumbs.Item.base(this, 'createDom'); 24 | var element = this.getElement(); 25 | 26 | var caption = goog.dom.createDom(goog.dom.TagName.DIV, 'anychart-ce-breadcrumbs-item-caption', this.caption_); 27 | goog.dom.appendChild(element, caption); 28 | 29 | if (this.icon_){ 30 | var faIcon = goog.dom.createDom('i', 'ac ' + this.icon_); 31 | goog.dom.insertChildAt(caption, faIcon, 0); 32 | } 33 | 34 | var indicator = goog.dom.createDom(goog.dom.TagName.DIV, 'anychart-ce-breadcrumbs-item-indicator'); 35 | goog.dom.appendChild(element, indicator); 36 | 37 | this.getHandler().listen(element, goog.events.EventType.CLICK, function(e) { 38 | e.preventDefault(); 39 | e.stopPropagation(); 40 | this.dispatchEvent(goog.ui.Component.EventType.ACTION); 41 | }); 42 | }; -------------------------------------------------------------------------------- /src/ui/control/Menu.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.Menu'); 2 | goog.provide('chartEditor.ui.control.MenuRenderer'); 3 | 4 | goog.require('goog.ui.Menu'); 5 | goog.require('goog.ui.MenuRenderer'); 6 | 7 | 8 | 9 | // region ---- DataFieldMenu 10 | /** 11 | * @param {string=} opt_additionalClassName 12 | * @param {goog.dom.DomHelper=} opt_domHelper 13 | * @param {goog.ui.MenuRenderer=} opt_renderer 14 | * @constructor 15 | * @extends {goog.ui.Menu} 16 | */ 17 | chartEditor.ui.control.Menu = function (opt_additionalClassName, opt_domHelper, opt_renderer) { 18 | chartEditor.ui.control.Menu.base(this, 'constructor', 19 | opt_domHelper, 20 | opt_renderer || chartEditor.ui.control.MenuRenderer.getInstance()); 21 | 22 | /** 23 | * @type {string} 24 | */ 25 | this.additionalClassName = opt_additionalClassName || ''; 26 | }; 27 | goog.inherits(chartEditor.ui.control.Menu, goog.ui.Menu); 28 | 29 | 30 | /** @inheritDoc */ 31 | chartEditor.ui.control.Menu.prototype.setVisible = function(show, opt_force, opt_e) { 32 | if (show) { 33 | var select = this.getParent(); 34 | var bounds = goog.style.getBounds(select.getElement()); 35 | goog.style.setWidth(this.getElement(), bounds.width); 36 | goog.style.setPosition(this.getElement(), bounds.left); 37 | } 38 | return chartEditor.ui.control.Menu.base(this, 'setVisible', show, opt_force, opt_e); 39 | }; 40 | // endregion 41 | 42 | 43 | // region ---- DataFieldMenuRenderer 44 | /** 45 | * @param {string=} opt_ariaRole Optional ARIA role used for the element. 46 | * @constructor 47 | * @extends {goog.ui.MenuRenderer} 48 | */ 49 | chartEditor.ui.control.MenuRenderer = function (opt_ariaRole) { 50 | chartEditor.ui.control.MenuRenderer.base(this, 'constructor', opt_ariaRole); 51 | }; 52 | goog.inherits(chartEditor.ui.control.MenuRenderer, goog.ui.MenuRenderer); 53 | goog.addSingletonGetter(chartEditor.ui.control.MenuRenderer); 54 | 55 | 56 | /** @inheritDoc */ 57 | chartEditor.ui.control.MenuRenderer.prototype.createDom = function(container) { 58 | container = /** @type {chartEditor.ui.control.Menu} */(container); 59 | var element = chartEditor.ui.control.MenuRenderer.base(this, 'createDom', container); 60 | if (container.additionalClassName) goog.dom.classlist.add(element, container.additionalClassName); 61 | return element; 62 | }; 63 | 64 | 65 | /** @inheritDoc */ 66 | chartEditor.ui.control.MenuRenderer.prototype.getCssClass = function () { 67 | return 'anychart-ce-control-menu'; 68 | }; 69 | // endregion 70 | -------------------------------------------------------------------------------- /src/ui/control/button/Base.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.button.Base'); 2 | 3 | goog.require('goog.ui.Button'); 4 | 5 | 6 | 7 | /** 8 | * A button control. 9 | * 10 | * @param {goog.ui.ControlContent=} opt_content Text caption or existing DOM 11 | * structure to display as the button's caption. 12 | * @param {goog.ui.ButtonRenderer=} opt_renderer Optional renderer used to 13 | * render or decorate the button; defaults to 14 | * {@link goog.ui.CustomButtonRenderer}. 15 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper, used for 16 | * document interaction. 17 | * @constructor 18 | * @extends {goog.ui.Button} 19 | */ 20 | chartEditor.ui.control.button.Base = function(opt_content, opt_renderer, opt_domHelper) { 21 | chartEditor.ui.control.button.Base.base(this, 'constructor', opt_content || '', opt_renderer, opt_domHelper); 22 | 23 | /** 24 | * @type {?string} Css name or null. 25 | * @private 26 | */ 27 | this.iconClass_ = null; 28 | 29 | /** 30 | * @type {number} 31 | * @private 32 | */ 33 | this.iconPositionIndex_ = 0; 34 | }; 35 | goog.inherits(chartEditor.ui.control.button.Base, goog.ui.Button); 36 | 37 | 38 | /** 39 | * Set icon class to button. 40 | * @param {string} iconClass Class name or null. 41 | * @param {number=} opt_index 42 | */ 43 | chartEditor.ui.control.button.Base.prototype.setIcon = function(iconClass, opt_index) { 44 | this.iconClass_ = iconClass; 45 | 46 | if (goog.isDef(opt_index)) { 47 | this.iconPositionIndex_ = opt_index; 48 | } 49 | 50 | if (this.isInDocument()) { 51 | this.setIcon_(); 52 | } 53 | }; 54 | 55 | 56 | /** 57 | * Apply icon class to button. 58 | * @private 59 | */ 60 | chartEditor.ui.control.button.Base.prototype.setIcon_ = function() { 61 | var element = this.getElement(); 62 | var renderer = /** @type {goog.ui.CustomButtonRenderer} */ (this.getRenderer()); 63 | var contentElement = renderer.getContentElement(element); 64 | var iconElement = goog.dom.getElementsByTagNameAndClass(goog.dom.TagName.I, null, contentElement)[0]; 65 | 66 | if (this.iconClass_) { 67 | if (iconElement) { 68 | goog.dom.classlist.set(iconElement, this.iconClass_); 69 | goog.style.setElementShown(iconElement, true); 70 | } else { 71 | iconElement = goog.dom.createDom(goog.dom.TagName.I, this.iconClass_); 72 | goog.a11y.aria.setState(iconElement, goog.a11y.aria.State.HIDDEN, true); 73 | goog.dom.insertChildAt(contentElement, iconElement, this.iconPositionIndex_); 74 | } 75 | } else { 76 | if (iconElement) goog.style.setElementShown(iconElement, false); 77 | } 78 | }; 79 | 80 | 81 | /** @override */ 82 | chartEditor.ui.control.button.Base.prototype.createDom = function() { 83 | chartEditor.ui.control.button.Base.base(this, 'createDom'); 84 | goog.dom.setProperties(this.getElement(), {'type': 'button'}); 85 | this.setIcon_(); 86 | }; 87 | -------------------------------------------------------------------------------- /src/ui/control/button/Bold.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.button.Bold'); 2 | 3 | goog.require('chartEditor.ui.control.button.Toggle'); 4 | 5 | 6 | 7 | /** 8 | * Bold button for text appearance. 9 | * @constructor 10 | * @extends {chartEditor.ui.control.button.Toggle} 11 | */ 12 | chartEditor.ui.control.button.Bold = function() { 13 | chartEditor.ui.control.button.Bold.base(this, 'constructor'); 14 | 15 | this.setIcon('ac ac-bold'); 16 | this.setNormalValue('normal'); 17 | this.setCheckedValue('bold'); 18 | }; 19 | goog.inherits(chartEditor.ui.control.button.Bold, chartEditor.ui.control.button.Toggle); 20 | -------------------------------------------------------------------------------- /src/ui/control/button/Italic.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.button.Italic'); 2 | 3 | goog.require('chartEditor.ui.control.button.Toggle'); 4 | 5 | 6 | 7 | /** 8 | * Italic button for text appearance. 9 | * @constructor 10 | * @extends {chartEditor.ui.control.button.Toggle} 11 | */ 12 | chartEditor.ui.control.button.Italic = function() { 13 | chartEditor.ui.control.button.Italic.base(this, 'constructor'); 14 | 15 | this.setIcon('ac ac-italic'); 16 | this.setNormalValue('normal'); 17 | this.setCheckedValue('italic'); 18 | }; 19 | goog.inherits(chartEditor.ui.control.button.Italic, chartEditor.ui.control.button.Toggle); 20 | -------------------------------------------------------------------------------- /src/ui/control/button/Underline.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.button.Underline'); 2 | 3 | goog.require('chartEditor.ui.control.button.Toggle'); 4 | 5 | 6 | 7 | /** 8 | * Underline button for text appearance. 9 | * @constructor 10 | * @extends {chartEditor.ui.control.button.Toggle} 11 | */ 12 | chartEditor.ui.control.button.Underline = function() { 13 | chartEditor.ui.control.button.Underline.base(this, 'constructor'); 14 | 15 | this.setIcon('ac ac-underline'); 16 | this.setNormalValue('normal'); 17 | this.setCheckedValue('underline'); 18 | }; 19 | goog.inherits(chartEditor.ui.control.button.Underline, chartEditor.ui.control.button.Toggle); 20 | -------------------------------------------------------------------------------- /src/ui/control/checkbox/AdjustFontSize.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.checkbox.AdjustFontSize'); 2 | 3 | goog.require('chartEditor.ui.control.checkbox.Base'); 4 | 5 | 6 | 7 | /** 8 | * @param {goog.ui.Checkbox.State=} opt_checked Checked state to set. 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper, used for 10 | * document interaction. 11 | * @param {goog.ui.CheckboxRenderer=} opt_renderer Renderer used to render or 12 | * decorate the checkbox; defaults to {@link goog.ui.CheckboxRenderer}. 13 | * @constructor 14 | * @extends {chartEditor.ui.control.checkbox.Base} 15 | */ 16 | chartEditor.ui.control.checkbox.AdjustFontSize = function(opt_checked, opt_domHelper, opt_renderer) { 17 | chartEditor.ui.control.checkbox.AdjustFontSize.base(this, 'constructor', opt_checked, opt_domHelper, 18 | opt_renderer || chartEditor.ui.control.checkbox.Renderer.getInstance()); 19 | 20 | }; 21 | goog.inherits(chartEditor.ui.control.checkbox.AdjustFontSize, chartEditor.ui.control.checkbox.Base); 22 | 23 | 24 | 25 | /** @inheritDoc */ 26 | chartEditor.ui.control.checkbox.AdjustFontSize.prototype.setValueByTarget = function(target) { 27 | if (!this.key || this.excluded) return; 28 | 29 | this.target = target; 30 | 31 | var stringKey = chartEditor.model.Base.getStringKey(this.key); 32 | var value = chartEditor.binding.exec(this.target, stringKey); 33 | if (goog.isObject(value)) 34 | value = value.width && value.height; 35 | else 36 | value = goog.typeOf(value) === 'boolean' ? /** @type {boolean} */(value) : false; 37 | 38 | this.noDispatch = true; 39 | this.setChecked(value); 40 | this.noDispatch = false; 41 | }; 42 | 43 | -------------------------------------------------------------------------------- /src/ui/control/checkbox/Renderer.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.checkbox.Renderer'); 2 | 3 | goog.require('goog.ui.CheckboxRenderer'); 4 | goog.require('goog.ui.INLINE_BLOCK_CLASSNAME'); 5 | 6 | 7 | /** 8 | * Select renderer. 9 | * @constructor 10 | * @extends {goog.ui.CheckboxRenderer} 11 | */ 12 | chartEditor.ui.control.checkbox.Renderer = function() { 13 | chartEditor.ui.control.checkbox.Renderer.base(this, 'constructor'); 14 | }; 15 | goog.inherits(chartEditor.ui.control.checkbox.Renderer, goog.ui.CheckboxRenderer); 16 | goog.addSingletonGetter(chartEditor.ui.control.checkbox.Renderer); 17 | 18 | 19 | /** @override */ 20 | chartEditor.ui.control.checkbox.Renderer.prototype.createDom = function(checkbox) { 21 | var dom = checkbox.getDomHelper(); 22 | var element = dom.createDom(goog.dom.TagName.SPAN, 23 | this.getClassNames(checkbox).join(' '), 24 | dom.createDom(goog.dom.TagName.SPAN, [ 25 | goog.getCssName(this.getCssClass(), 'element'), 26 | goog.ui.INLINE_BLOCK_CLASSNAME 27 | ], 28 | dom.createDom(goog.dom.TagName.DIV, [ 29 | goog.getCssName(this.getCssClass(), 'checkmark'), 30 | 'ac ac-check'])), 31 | 32 | checkbox.getCaption() ? dom.createDom(goog.dom.TagName.DIV, [ 33 | goog.getCssName(this.getCssClass(), 'caption'), 34 | goog.ui.INLINE_BLOCK_CLASSNAME 35 | ], 36 | checkbox.getCaption()) : null 37 | ); 38 | 39 | var state = checkbox.getChecked(); 40 | this.setCheckboxState(element, state); 41 | 42 | return element; 43 | }; 44 | 45 | 46 | /** 47 | * @param {Element} element Root element of the checkbox whose content element 48 | * is to be returned. 49 | * @return {Element} The checkbox's content element. 50 | * @override 51 | */ 52 | chartEditor.ui.control.checkbox.Renderer.prototype.getContentElement = function(element) { 53 | if (element) { 54 | var captionElem = goog.dom.getElementsByTagNameAndClass( 55 | '*', goog.getCssName(this.getCssClass(), 'caption'), element)[0]; 56 | return captionElem; 57 | } 58 | return null; 59 | }; 60 | -------------------------------------------------------------------------------- /src/ui/control/comboBox/PercentToRatio.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.comboBox.PercentToRatio'); 2 | goog.provide('chartEditor.ui.control.comboBox.PercentToRatioInput'); 3 | 4 | goog.require('chartEditor.ui.control.comboBox.Percent'); 5 | 6 | 7 | 8 | /** 9 | * A ComboBox control. 10 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper. 11 | * @param {goog.ui.Menu=} opt_menu Optional menu ui. 12 | * This menu is disposed of by this control. 13 | * @param {goog.ui.LabelInput=} opt_labelInput Optional label input. 14 | * This label input is disposed of by this control. 15 | * @constructor 16 | * @extends {chartEditor.ui.control.comboBox.Percent} 17 | * @suppress {visibility} 18 | */ 19 | chartEditor.ui.control.comboBox.PercentToRatio = function(opt_domHelper, opt_menu, opt_labelInput) { 20 | opt_labelInput = opt_labelInput || new chartEditor.ui.control.comboBox.PercentToRatioInput; 21 | 22 | chartEditor.ui.control.comboBox.PercentToRatio.base(this, 'constructor', opt_domHelper, opt_menu, opt_labelInput); 23 | 24 | this.setValidateFunction(function(value) { 25 | return !isNaN(Number(value)); 26 | }); 27 | 28 | this.setFormatterFunction(function(value) { 29 | return String(goog.math.clamp(Number(value), 0, 1)); 30 | }); 31 | }; 32 | goog.inherits(chartEditor.ui.control.comboBox.PercentToRatio, chartEditor.ui.control.comboBox.Percent); 33 | 34 | 35 | /** @inheritDoc */ 36 | chartEditor.ui.control.comboBox.PercentToRatio.prototype.setValue = function(value) { 37 | if (this.lastToken_ !== value && this.validateFunction_(value)) { 38 | value = this.formatterFunction_(value); 39 | this.lastToken_ = value; 40 | this.labelInput_.setValueConvert(value); 41 | this.handleInputChange_(); 42 | this.dispatchEvent(goog.ui.Component.EventType.CHANGE); 43 | } 44 | }; 45 | 46 | 47 | /** @inheritDoc */ 48 | chartEditor.ui.control.comboBox.PercentToRatio.prototype.onInputBlur_ = function(e) { 49 | chartEditor.ui.control.comboBox.PercentToRatio.base(this, 'onInputBlur_', e); 50 | 51 | this.labelInput_.setValueConvert(/** @type {string} */(this.lastToken_)); 52 | }; 53 | 54 | 55 | /** 56 | * This creates the label input object. 57 | * @param {string=} opt_label The text to show as the label. 58 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper. 59 | * @constructor 60 | * @extends {goog.ui.LabelInput} 61 | */ 62 | chartEditor.ui.control.comboBox.PercentToRatioInput = function(opt_label, opt_domHelper) { 63 | chartEditor.ui.control.input.Base.base(this, 'constructor', opt_label, opt_domHelper); 64 | }; 65 | goog.inherits(chartEditor.ui.control.comboBox.PercentToRatioInput, goog.ui.LabelInput); 66 | 67 | 68 | chartEditor.ui.control.comboBox.PercentToRatioInput.prototype.setValueConvert = function(s) { 69 | s = (Number(s) * 100) + '%'; 70 | this.setValue(s); 71 | }; -------------------------------------------------------------------------------- /src/ui/control/comboBox/Percentage.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.comboBox.Percent'); 2 | 3 | goog.require('chartEditor.ui.control.comboBox.Base'); 4 | goog.require('goog.ui.ComboBox'); 5 | 6 | 7 | /** 8 | * A ComboBox control. 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper. 10 | * @param {goog.ui.Menu=} opt_menu Optional menu ui. 11 | * This menu is disposed of by this control. 12 | * @param {goog.ui.LabelInput=} opt_labelInput Optional label input. 13 | * This label input is disposed of by this control. 14 | * @constructor 15 | * @extends {chartEditor.ui.control.comboBox.Base} 16 | * @suppress {visibility} 17 | */ 18 | chartEditor.ui.control.comboBox.Percent = function(opt_domHelper, opt_menu, opt_labelInput) { 19 | chartEditor.ui.control.comboBox.Percent.base(this, 'constructor', opt_domHelper, opt_menu, opt_labelInput); 20 | 21 | this.allowNegative(false); 22 | }; 23 | goog.inherits(chartEditor.ui.control.comboBox.Percent, chartEditor.ui.control.comboBox.Base); 24 | 25 | 26 | /** 27 | * @type {boolean} 28 | * @private 29 | */ 30 | chartEditor.ui.control.comboBox.Percent.prototype.allowNegative_ = false; 31 | 32 | 33 | /** @param {boolean} value */ 34 | chartEditor.ui.control.comboBox.Percent.prototype.allowNegative = function(value) { 35 | this.allowNegative_ = value; 36 | 37 | if (this.allowNegative_) { 38 | // -100 - 100 39 | this.setValidateFunction(function(value) { 40 | return /^-?\d{1,3}%?$/.test(value); 41 | }); 42 | 43 | this.setFormatterFunction(function(value) { 44 | var match = String(value).match(/^(-?\d{1,3})%?$/); 45 | return match[1] + "%"; 46 | }); 47 | 48 | this.setOptions([-100, -70, -50, -30, -10, 0, 10, 30, 50, 70, 100]); 49 | 50 | } else { 51 | // 0 - 100 52 | this.setValidateFunction(function(value) { 53 | return /^\d{1,3}%?$/.test(value); 54 | }); 55 | 56 | this.setFormatterFunction(function(value) { 57 | if (value == 'default') return ''; 58 | var match = String(value).match(/^(\d{1,3})%?$/); 59 | return String(goog.math.clamp(Number(match[1]), 0, 100)) + "%"; 60 | }); 61 | 62 | this.setOptions([0, 10, 30, 50, 70, 90, 100]); 63 | } 64 | }; 65 | 66 | 67 | /** @inheritDoc */ 68 | chartEditor.ui.control.comboBox.Percent.prototype.setOptions = function(value) { 69 | chartEditor.ui.control.comboBox.Percent.base(this, 'setOptions', value); 70 | var self = this; 71 | self.captions.length = 0; 72 | goog.array.forEach(self.options, function(item){ 73 | self.captions.push(item == 'default' ? 'Default' : item + '%'); 74 | }); 75 | }; -------------------------------------------------------------------------------- /src/ui/control/fieldSelect/Base.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.fieldSelect.Base'); 2 | 3 | goog.require('chartEditor.ui.Component'); 4 | goog.require('chartEditor.ui.control.fieldSelect.Select'); 5 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 6 | 7 | 8 | 9 | /** 10 | * @param {Object=} opt_model 11 | * @param {goog.ui.Menu=} opt_menu 12 | * @param {goog.ui.ButtonRenderer=} opt_renderer 13 | * @param {goog.dom.DomHelper=} opt_domHelper 14 | * @param {!goog.ui.MenuRenderer=} opt_menuRenderer 15 | * @param {string=} opt_menuAdditionalClass 16 | * @constructor 17 | * @extends {chartEditor.ui.control.wrapped.Labeled} 18 | */ 19 | chartEditor.ui.control.fieldSelect.Base = function(opt_model, opt_menu, opt_renderer, opt_domHelper, opt_menuRenderer, opt_menuAdditionalClass) { 20 | var select = new chartEditor.ui.control.fieldSelect.Select( 21 | opt_model, 22 | opt_menu, 23 | opt_renderer, 24 | opt_domHelper, 25 | opt_menuRenderer, 26 | opt_menuAdditionalClass); 27 | 28 | var label = opt_model && opt_model.label || ''; 29 | chartEditor.ui.control.fieldSelect.Base.base(this, 'constructor', select, label, false, opt_domHelper); 30 | }; 31 | goog.inherits(chartEditor.ui.control.fieldSelect.Base, chartEditor.ui.control.wrapped.Labeled); 32 | 33 | 34 | /** @inheritDoc */ 35 | chartEditor.ui.control.fieldSelect.Base.prototype.enterDocument = function() { 36 | chartEditor.ui.control.fieldSelect.Base.base(this, 'enterDocument'); 37 | 38 | this.updateExclusion(); 39 | }; 40 | 41 | 42 | /** @return {chartEditor.ui.control.select.Base} */ 43 | chartEditor.ui.control.fieldSelect.Base.prototype.getSelect = function() { 44 | return /** @type {chartEditor.ui.control.select.Base} */(this.getControl()); 45 | }; 46 | 47 | 48 | /** @param {chartEditor.ui.control.fieldSelect.Select} select */ 49 | chartEditor.ui.control.fieldSelect.Base.prototype.setSelect = function(select) { 50 | this.setControl(select); 51 | }; 52 | 53 | 54 | /** @inheritDoc */ 55 | chartEditor.ui.control.fieldSelect.Base.prototype.init = function(model, key, opt_callback, opt_rebuilcChart) { 56 | chartEditor.ui.control.fieldSelect.Base.base(this, 'init', model, key, opt_callback, opt_rebuilcChart); 57 | 58 | this.updateExclusion(); 59 | }; 60 | 61 | 62 | /** 63 | * Hide or show control by assigning 'hidden' class 64 | * @param {boolean} value True if excluded. 65 | */ 66 | chartEditor.ui.control.fieldSelect.Base.prototype.exclude = function(value) { 67 | if (this.isInDocument()) goog.style.setElementShown(this.getElement(), !value); 68 | this.control_.exclude(value); 69 | }; 70 | 71 | 72 | /** 73 | * @public 74 | */ 75 | chartEditor.ui.control.fieldSelect.Base.prototype.updateExclusion = function() { 76 | this.exclude(!!this.control_.updateExclusion()); 77 | }; 78 | -------------------------------------------------------------------------------- /src/ui/control/fieldSelect/MenuCaption.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.fieldSelect.SelectMenuCaption'); 2 | goog.provide('chartEditor.ui.control.fieldSelect.SelectMenuCaptionRenderer'); 3 | goog.require('goog.ui.MenuItem'); 4 | goog.require('goog.ui.MenuItemRenderer'); 5 | 6 | 7 | /** 8 | * @param {Object=} opt_model 9 | * @param {goog.dom.DomHelper=} opt_domHelper 10 | * @param {goog.ui.MenuItemRenderer=} opt_renderer 11 | * @constructor 12 | * @extends {goog.ui.MenuItem} 13 | */ 14 | chartEditor.ui.control.fieldSelect.SelectMenuCaption = function(opt_model, opt_domHelper, opt_renderer) { 15 | goog.ui.MenuItem.call( 16 | this, 17 | opt_model ? opt_model.caption : '', 18 | opt_model, 19 | opt_domHelper, 20 | opt_renderer || chartEditor.ui.control.fieldSelect.SelectMenuCaptionRenderer.getInstance() 21 | ); 22 | this.setSelectable(false); 23 | this.setCheckable(false); 24 | }; 25 | goog.inherits(chartEditor.ui.control.fieldSelect.SelectMenuCaption, goog.ui.MenuItem); 26 | 27 | 28 | /** 29 | * @constructor 30 | * @extends {goog.ui.MenuItemRenderer} 31 | */ 32 | chartEditor.ui.control.fieldSelect.SelectMenuCaptionRenderer = function() { 33 | goog.ui.MenuItemRenderer.call(this); 34 | }; 35 | goog.inherits(chartEditor.ui.control.fieldSelect.SelectMenuCaptionRenderer, goog.ui.MenuItemRenderer); 36 | goog.addSingletonGetter(chartEditor.ui.control.fieldSelect.SelectMenuCaptionRenderer); 37 | 38 | 39 | /** 40 | * Overrides {@link goog.ui.ControlRenderer#createDom} by adding extra markup 41 | * and stying to the menu item's element if it is selectable or checkable. 42 | * @param {goog.ui.Control} item Menu item to render. 43 | * @return {Element} Root element for the item. 44 | * @override 45 | */ 46 | chartEditor.ui.control.fieldSelect.SelectMenuCaptionRenderer.prototype.createDom = function(item) { 47 | var element = chartEditor.ui.control.fieldSelect.SelectMenuCaptionRenderer.base(this, 'createDom', item); 48 | 49 | return element; 50 | }; 51 | 52 | 53 | /** @inheritDoc */ 54 | chartEditor.ui.control.fieldSelect.SelectMenuCaptionRenderer.prototype.getCssClass = function() { 55 | return 'anychart-ce-control-menu-caption'; 56 | }; -------------------------------------------------------------------------------- /src/ui/control/fieldSelect/MenuItem.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.fieldSelect.SelectMenuItem'); 2 | goog.provide('chartEditor.ui.control.fieldSelect.SelectMenuItemRenderer'); 3 | goog.require('goog.ui.MenuItem'); 4 | goog.require('goog.ui.MenuItemRenderer'); 5 | 6 | 7 | /** 8 | * @param {Object=} opt_model 9 | * @param {goog.dom.DomHelper=} opt_domHelper 10 | * @param {goog.ui.MenuItemRenderer=} opt_renderer 11 | * @constructor 12 | * @extends {goog.ui.MenuItem} 13 | */ 14 | chartEditor.ui.control.fieldSelect.SelectMenuItem = function(opt_model, opt_domHelper, opt_renderer) { 15 | goog.ui.MenuItem.call( 16 | this, 17 | opt_model ? opt_model.caption : '', 18 | opt_model, 19 | opt_domHelper, 20 | opt_renderer || chartEditor.ui.control.fieldSelect.SelectMenuItemRenderer.getInstance() 21 | ); 22 | }; 23 | goog.inherits(chartEditor.ui.control.fieldSelect.SelectMenuItem, goog.ui.MenuItem); 24 | 25 | 26 | /** 27 | * @constructor 28 | * @extends {goog.ui.MenuItemRenderer} 29 | */ 30 | chartEditor.ui.control.fieldSelect.SelectMenuItemRenderer = function() { 31 | goog.ui.MenuItemRenderer.call(this); 32 | }; 33 | goog.inherits(chartEditor.ui.control.fieldSelect.SelectMenuItemRenderer, goog.ui.MenuItemRenderer); 34 | goog.addSingletonGetter(chartEditor.ui.control.fieldSelect.SelectMenuItemRenderer); 35 | 36 | 37 | /** @inheritDoc */ 38 | chartEditor.ui.control.fieldSelect.SelectMenuItemRenderer.prototype.getCssClass = function() { 39 | return 'anychart-ce-control-menu-item'; 40 | }; -------------------------------------------------------------------------------- /src/ui/control/fieldSelect/Theme.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.fieldSelect.Theme'); 2 | goog.provide('chartEditor.ui.control.fieldSelect.ThemeDataFieldSelect'); 3 | 4 | goog.require('chartEditor.ui.control.fieldSelect.Base'); 5 | goog.require('chartEditor.ui.control.fieldSelect.Select'); 6 | 7 | 8 | 9 | /** 10 | * DataField ui for Theme property. 11 | * 12 | * @param {Object=} opt_model 13 | * @param {goog.ui.Menu=} opt_menu 14 | * @param {goog.ui.ButtonRenderer=} opt_renderer 15 | * @param {goog.dom.DomHelper=} opt_domHelper 16 | * @param {!goog.ui.MenuRenderer=} opt_menuRenderer 17 | * @param {string=} opt_menuAdditionalClass 18 | * 19 | * @constructor 20 | * @extends {chartEditor.ui.control.fieldSelect.Base} 21 | */ 22 | chartEditor.ui.control.fieldSelect.Theme = function(opt_model, opt_menu, opt_renderer, opt_domHelper, opt_menuRenderer, opt_menuAdditionalClass) { 23 | chartEditor.ui.control.fieldSelect.Theme.base(this, 'constructor',opt_model, opt_menu, opt_renderer, opt_domHelper, opt_menuRenderer, opt_menuAdditionalClass); 24 | 25 | this.setSelect(new chartEditor.ui.control.fieldSelect.ThemeDataFieldSelect( 26 | opt_model, 27 | opt_menu, 28 | opt_renderer, 29 | opt_domHelper, 30 | opt_menuRenderer, 31 | opt_menuAdditionalClass 32 | )); 33 | }; 34 | goog.inherits(chartEditor.ui.control.fieldSelect.Theme, chartEditor.ui.control.fieldSelect.Base); 35 | 36 | 37 | /** 38 | * @param {Object=} opt_model 39 | * @param {goog.ui.Menu=} opt_menu 40 | * @param {goog.ui.ButtonRenderer=} opt_renderer 41 | * @param {goog.dom.DomHelper=} opt_domHelper 42 | * @param {!goog.ui.MenuRenderer=} opt_menuRenderer 43 | * @param {string=} opt_menuAdditionalClass 44 | * @constructor 45 | * @extends {chartEditor.ui.control.fieldSelect.Select} 46 | */ 47 | chartEditor.ui.control.fieldSelect.ThemeDataFieldSelect = function (opt_model, opt_menu, opt_renderer, opt_domHelper, opt_menuRenderer, opt_menuAdditionalClass) { 48 | chartEditor.ui.control.fieldSelect.ThemeDataFieldSelect.base(this, 'constructor', 49 | opt_model, 50 | opt_menu, 51 | opt_renderer, 52 | opt_domHelper, 53 | opt_menuRenderer, 54 | opt_menuAdditionalClass); 55 | }; 56 | goog.inherits(chartEditor.ui.control.fieldSelect.ThemeDataFieldSelect, chartEditor.ui.control.fieldSelect.Select); 57 | 58 | 59 | 60 | /** @inheritDoc */ 61 | chartEditor.ui.control.fieldSelect.ThemeDataFieldSelect.prototype.setValueByTarget = function(target) { 62 | if (this.excluded) return; 63 | 64 | this.target = target; 65 | var stringKey = chartEditor.model.Base.getStringKey(this.key); 66 | var value = /** @type {string} */(chartEditor.binding.exec(this.target, stringKey)); 67 | 68 | if (goog.isArray(value)) 69 | value = value[0] || 'defaultTheme'; 70 | 71 | if (goog.isObject(value) && value['stringId']) 72 | value = value['stringId']; 73 | 74 | this.noDispatch = true; 75 | this.setValue(value); 76 | this.noDispatch = false; 77 | }; 78 | -------------------------------------------------------------------------------- /src/ui/control/input/Numbers.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.input.Numbers'); 2 | 3 | goog.require('chartEditor.ui.control.input.Base'); 4 | 5 | 6 | /** 7 | * This creates the label input object. 8 | * @param {string=} opt_label The text to show as the label. 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper. 10 | * @constructor 11 | * @extends {chartEditor.ui.control.input.Base} 12 | */ 13 | chartEditor.ui.control.input.Numbers = function(opt_label, opt_domHelper) { 14 | opt_label = goog.isDef(opt_label) ? opt_label : 'Only numbers'; 15 | chartEditor.ui.control.input.Numbers.base(this, 'constructor', opt_label, opt_domHelper); 16 | 17 | this.setValidateFunction(function(value){ 18 | return !isNaN(Number(value)); 19 | }); 20 | this.setFormatterFunction(function(value){ 21 | return String(Number(value)); 22 | }); 23 | }; 24 | goog.inherits(chartEditor.ui.control.input.Numbers, chartEditor.ui.control.input.Base); 25 | -------------------------------------------------------------------------------- /src/ui/control/input/StringArray.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.input.StringArray'); 2 | 3 | goog.require('chartEditor.ui.control.input.Base'); 4 | 5 | 6 | /** 7 | * This creates the label input object. 8 | * @param {string=} opt_label The text to show as the label. 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper. 10 | * @constructor 11 | * @extends {chartEditor.ui.control.input.Base} 12 | */ 13 | chartEditor.ui.control.input.StringArray = function(opt_label, opt_domHelper) { 14 | chartEditor.ui.control.input.StringArray.base(this, 'constructor', opt_label, opt_domHelper); 15 | 16 | this.setFormatterFunction(function(value){ 17 | if (goog.isFunction(value)) 18 | value = ''; 19 | 20 | else if (goog.isArray(value)) 21 | value = /** @type {Array} */(value).join(','); 22 | 23 | return value ? String(value) : ''; 24 | }); 25 | }; 26 | goog.inherits(chartEditor.ui.control.input.StringArray, chartEditor.ui.control.input.Base); 27 | 28 | 29 | /** @inheritDoc */ 30 | chartEditor.ui.control.input.StringArray.prototype.enterDocument = function() { 31 | chartEditor.ui.control.input.StringArray.base(this, 'enterDocument'); 32 | goog.events.unlisten(this.inputHandler_, goog.events.InputHandler.EventType.INPUT, this.onChange, false, this); 33 | goog.events.listen(this.getElement(), goog.events.EventType.BLUR, this.onChange, false, this); 34 | }; 35 | 36 | 37 | /** @inheritDoc */ 38 | chartEditor.ui.control.input.StringArray.prototype.onChange = function() { 39 | var value = this.getValue(); 40 | 41 | if (!this.noDispatch && value !== this.lastValue && this.editorModel) { 42 | value = value.split(','); 43 | for (var i = 0; i < value.length; i++) 44 | value[i] = value[i].trim(); 45 | if (value.length == 1 && !value[0]) 46 | value = null; 47 | 48 | var caretPosition = goog.dom.selection.getStart(this.getElement()); 49 | 50 | if (this.callback) 51 | this.editorModel.callbackByString(this.callback, this); 52 | else 53 | this.editorModel.setValue(this.key, value, this.rebuildChart); 54 | 55 | goog.dom.selection.setCursorPosition(this.getElement(), caretPosition); 56 | } 57 | this.revisionCount1++; 58 | }; 59 | -------------------------------------------------------------------------------- /src/ui/control/select/FontFamily.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.select.FontFamily'); 2 | 3 | goog.require('chartEditor.ui.control.fieldSelect.Select'); 4 | goog.require('chartEditor.ui.control.fieldSelect.SelectMenuItem'); 5 | 6 | 7 | 8 | /** 9 | * @param {(string|Object)=} opt_model 10 | * @param {goog.ui.Menu=} opt_menu 11 | * @param {goog.ui.ButtonRenderer=} opt_renderer 12 | * @param {goog.dom.DomHelper=} opt_domHelper 13 | * @param {!goog.ui.MenuRenderer=} opt_menuRenderer 14 | * @param {string=} opt_menuAdditionalClass 15 | * @constructor 16 | * @extends {chartEditor.ui.control.fieldSelect.Select} 17 | */ 18 | chartEditor.ui.control.select.FontFamily = function(opt_model, opt_menu, opt_renderer, opt_domHelper, opt_menuRenderer, opt_menuAdditionalClass) { 19 | opt_model = goog.isDef(opt_model) ? opt_model : 'font family'; 20 | chartEditor.ui.control.select.FontFamily.base(this, 'constructor', opt_model, opt_menu, opt_renderer, opt_domHelper, opt_menuRenderer, opt_menuAdditionalClass); 21 | 22 | var fonts = { 23 | 'Arial': 'Arial, Helvetica, sans-serif', 24 | 'Arial Black': 'Arial Black, Gadget, sans-serif', 25 | 'Comic Sans MS': 'Comic Sans MS, cursive, sans-serif', 26 | 'Impact': 'Impact, Charcoal, sans-serif', 27 | 'Lucida Sans Unicode': 'Lucida Sans Unicode, Lucida Grande, sans-serif', 28 | 'Tahoma': 'Tahoma, Geneva, sans-serif', 29 | 'Trebuchet MS': 'Trebuchet MS, Helvetica, sans-serif', 30 | 'Verdana': 'Verdana, Helvetica, Arial, sans-serif', 31 | 'Lucida Console': 'Lucida Console, Monaco, monospace', 32 | 'Source Sans Pro': 'Source Sans Pro, sans-serif' 33 | }; 34 | 35 | for (var key in fonts) { 36 | this.addItem(new chartEditor.ui.control.fieldSelect.SelectMenuItem({ 37 | caption: key, 38 | value: fonts[key] 39 | })); 40 | } 41 | 42 | }; 43 | goog.inherits(chartEditor.ui.control.select.FontFamily, chartEditor.ui.control.fieldSelect.Select); 44 | -------------------------------------------------------------------------------- /src/ui/control/select/ScaleType.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.select.ScaleType'); 2 | goog.provide('chartEditor.ui.control.select.ScaleTypeDataFieldSelect'); 3 | 4 | goog.require('chartEditor.ui.control.fieldSelect.Base'); 5 | goog.require('chartEditor.ui.control.fieldSelect.Select'); 6 | 7 | 8 | /** 9 | * DataField ui for palettes property. 10 | * 11 | * @param {Object=} opt_model 12 | * @param {goog.ui.Menu=} opt_menu 13 | * @param {goog.ui.ButtonRenderer=} opt_renderer 14 | * @param {goog.dom.DomHelper=} opt_domHelper 15 | * @param {!goog.ui.MenuRenderer=} opt_menuRenderer 16 | * @param {string=} opt_menuAdditionalClass 17 | * 18 | * @constructor 19 | * @extends {chartEditor.ui.control.fieldSelect.Base} 20 | */ 21 | chartEditor.ui.control.select.ScaleType = function(opt_model, opt_menu, opt_renderer, opt_domHelper, opt_menuRenderer, opt_menuAdditionalClass) { 22 | chartEditor.ui.control.select.ScaleType.base(this, 'constructor',opt_model, opt_menu, opt_renderer, opt_domHelper, opt_menuRenderer, opt_menuAdditionalClass); 23 | 24 | this.setSelect(new chartEditor.ui.control.select.ScaleTypeDataFieldSelect( 25 | opt_model, 26 | opt_menu, 27 | opt_renderer, 28 | opt_domHelper, 29 | opt_menuRenderer, 30 | opt_menuAdditionalClass 31 | )); 32 | 33 | this.addClassName(goog.getCssName('anychart-ce-scale-type')); 34 | }; 35 | goog.inherits(chartEditor.ui.control.select.ScaleType, chartEditor.ui.control.fieldSelect.Base); 36 | 37 | 38 | /** 39 | * @param {Object=} opt_model 40 | * @param {goog.ui.Menu=} opt_menu 41 | * @param {goog.ui.ButtonRenderer=} opt_renderer 42 | * @param {goog.dom.DomHelper=} opt_domHelper 43 | * @param {!goog.ui.MenuRenderer=} opt_menuRenderer 44 | * @param {string=} opt_menuAdditionalClass 45 | * @constructor 46 | * @extends {chartEditor.ui.control.fieldSelect.Select} 47 | */ 48 | chartEditor.ui.control.select.ScaleTypeDataFieldSelect = function (opt_model, opt_menu, opt_renderer, opt_domHelper, opt_menuRenderer, opt_menuAdditionalClass) { 49 | chartEditor.ui.control.select.ScaleTypeDataFieldSelect.base(this, 'constructor', 50 | opt_model, 51 | opt_menu, 52 | opt_renderer, 53 | opt_domHelper, 54 | opt_menuRenderer, 55 | opt_menuAdditionalClass); 56 | }; 57 | goog.inherits(chartEditor.ui.control.select.ScaleTypeDataFieldSelect, chartEditor.ui.control.fieldSelect.Select); 58 | 59 | 60 | /** @inheritDoc */ 61 | chartEditor.ui.control.select.ScaleTypeDataFieldSelect.prototype.applySelection = function () { 62 | var stringKey = chartEditor.model.Base.getStringKey(this.key); 63 | var tmp = stringKey.split('.'); 64 | var lastKey = tmp[tmp.length - 1]; 65 | stringKey = stringKey.replace('.' + lastKey, ''); 66 | 67 | this.editorModel.dropChartSettings(stringKey); 68 | 69 | chartEditor.ui.control.select.ScaleTypeDataFieldSelect.base(this, 'applySelection'); 70 | }; 71 | -------------------------------------------------------------------------------- /src/ui/control/wrapped/Labeled.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.wrapped.Labeled'); 2 | 3 | goog.require('chartEditor.ui.control.wrapped.Base'); 4 | 5 | 6 | /** 7 | * @param {chartEditor.model.Base.Control} control 8 | * @param {string=} opt_label 9 | * @param {boolean=} opt_allowReset 10 | * @param {goog.dom.DomHelper=} opt_domHelper 11 | * @constructor 12 | * @extends {chartEditor.ui.control.wrapped.Base} 13 | */ 14 | chartEditor.ui.control.wrapped.Labeled = function(control, opt_label, opt_allowReset, opt_domHelper) { 15 | chartEditor.ui.control.wrapped.Labeled.base(this, 'constructor', control, opt_allowReset, opt_domHelper); 16 | 17 | this.labelString_ = opt_label ? opt_label : ''; 18 | 19 | this.addClassName('anychart-ce-labeled-control'); 20 | }; 21 | goog.inherits(chartEditor.ui.control.wrapped.Labeled, chartEditor.ui.control.wrapped.Base); 22 | 23 | 24 | /** @inheritDoc */ 25 | chartEditor.ui.control.wrapped.Labeled.prototype.createDom = function() { 26 | chartEditor.ui.control.wrapped.Labeled.base(this, 'createDom'); 27 | 28 | var element = this.getElement(); 29 | 30 | this.label_ = goog.dom.createDom(goog.dom.TagName.DIV, 'anychart-ce-labeled-control-label', this.labelString_); 31 | goog.dom.insertChildAt(element, this.label_, 0); 32 | 33 | goog.dom.classlist.add(this.control_.getElement(), 'anychart-ce-panel-control-right'); 34 | goog.dom.appendChild(element, goog.dom.createDom(goog.dom.TagName.DIV, goog.getCssName('anychart-ce-clearboth'))); 35 | }; 36 | 37 | 38 | /** @override */ 39 | chartEditor.ui.control.wrapped.Labeled.prototype.disposeInternal = function() { 40 | this.label_ = null; 41 | chartEditor.ui.control.wrapped.Labeled.base(this, 'disposeInternal'); 42 | }; -------------------------------------------------------------------------------- /src/ui/dataSets/Intro.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.dataSets.Intro'); 2 | goog.require('chartEditor.ui.Component'); 3 | 4 | 5 | /** 6 | * @constructor 7 | * @extends {chartEditor.ui.Component} 8 | */ 9 | chartEditor.ui.dataSets.Intro = function () { 10 | chartEditor.ui.dataSets.Intro.base(this, 'constructor'); 11 | this.addClassName('anychart-ce-data-set-intro'); 12 | }; 13 | goog.inherits(chartEditor.ui.dataSets.Intro, chartEditor.ui.Component); 14 | 15 | 16 | /** @inheritDoc */ 17 | chartEditor.ui.dataSets.Intro.prototype.createDom = function () { 18 | chartEditor.ui.dataSets.Intro.base(this, 'createDom'); 19 | 20 | var element = this.getElement(); 21 | var caption = goog.dom.createDom( 22 | goog.dom.TagName.DIV, 23 | 'anychart-ce-content-caption', 24 | 'Welcome to AnyChart Charts Editor' 25 | ); 26 | var p1 = goog.dom.createDom( 27 | goog.dom.TagName.P, 28 | 'anychart-ce-data-set-intro-p', 29 | 'To start working with the charts editor, add your data or use one of our ready to use Data Sets.' 30 | ); 31 | var p2 = goog.dom.createDom( 32 | goog.dom.TagName.P, 33 | 'anychart-ce-data-set-intro-p', 34 | 'After the data is added, you can move forward to Setup Chart step and start configuring your chart.' 35 | ); 36 | goog.dom.appendChild(element, caption); 37 | goog.dom.appendChild(element, p1); 38 | goog.dom.appendChild(element, p2); 39 | }; 40 | -------------------------------------------------------------------------------- /src/ui/dataSets/WidgetPreview.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.dataSets.WidgetPreview'); 2 | 3 | goog.require('chartEditor.model.Base'); 4 | goog.require('chartEditor.ui.dataSets.DataSetPreview'); 5 | goog.require('chartEditor.ui.dataSets.Intro'); 6 | goog.require('chartEditor.ui.dataSets.Widget'); 7 | 8 | 9 | 10 | /** 11 | * List of data set panel on SetupChart step. 12 | * 13 | * @param {chartEditor.model.Base} model 14 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 15 | * @constructor 16 | * @extends {chartEditor.ui.dataSets.Widget} 17 | */ 18 | chartEditor.ui.dataSets.WidgetPreview = function(model, opt_domHelper) { 19 | chartEditor.ui.dataSets.WidgetPreview.base(this, 'constructor', model, opt_domHelper); 20 | }; 21 | goog.inherits(chartEditor.ui.dataSets.WidgetPreview, chartEditor.ui.dataSets.Widget); 22 | 23 | 24 | /** 25 | * @inheritDoc 26 | */ 27 | chartEditor.ui.dataSets.WidgetPreview.prototype.initClasses = function() { 28 | this.addClassName('anychart-ce-input-data'); 29 | }; 30 | 31 | 32 | /** 33 | * @inheritDoc 34 | */ 35 | chartEditor.ui.dataSets.WidgetPreview.prototype.createPanel = function(model, data) { 36 | return new chartEditor.ui.dataSets.DataSetPreview(model, data); 37 | }; 38 | 39 | 40 | /** 41 | * Updates data. 42 | */ 43 | chartEditor.ui.dataSets.WidgetPreview.prototype.updateData = function() { 44 | this.dataSetPanel.updateData(); 45 | }; 46 | 47 | 48 | -------------------------------------------------------------------------------- /src/ui/dataSettings/chartTypeSelect/Filters.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.dataSettings.chartTypeSelect.Filters'); 2 | 3 | goog.require('chartEditor.ui.Component'); 4 | goog.require('chartEditor.ui.control.checkbox.Base'); 5 | 6 | 7 | /** 8 | * Filters widget for chart type select menu. 9 | * 10 | * @param {goog.dom.DomHelper=} opt_domHelper 11 | * @constructor 12 | * @extends {chartEditor.ui.Component} 13 | */ 14 | chartEditor.ui.dataSettings.chartTypeSelect.Filters = function(opt_domHelper) { 15 | chartEditor.ui.dataSettings.chartTypeSelect.Filters.base(this, 'constructor', opt_domHelper); 16 | 17 | this.addClassName(goog.getCssName('anychart-ce-chart-type-filters')); 18 | }; 19 | goog.inherits(chartEditor.ui.dataSettings.chartTypeSelect.Filters, chartEditor.ui.Component); 20 | 21 | 22 | chartEditor.ui.dataSettings.chartTypeSelect.Filters.Map = { 23 | 'common': 'Common', 24 | 'stacked-value': 'Stacked', 25 | 'stacked-percent': 'Percent stacked', 26 | 'gauges': 'Gauges', 27 | 'gantt': 'Gantts' 28 | }; 29 | 30 | 31 | /** @inheritDoc */ 32 | chartEditor.ui.dataSettings.chartTypeSelect.Filters.prototype.createDom = function() { 33 | chartEditor.ui.dataSettings.chartTypeSelect.Filters.base(this, 'createDom'); 34 | 35 | var map = chartEditor.ui.dataSettings.chartTypeSelect.Filters.Map; 36 | for (var key in map) { 37 | var checkbox = new chartEditor.ui.control.checkbox.Base(); 38 | checkbox.setModel(key); 39 | checkbox.setCaption(map[key]); 40 | if ((chartEditor.PRODUCT != chartEditor.model.Product.GANTT && key === 'common') || 41 | (chartEditor.PRODUCT == chartEditor.model.Product.GANTT && key === 'gantt') ) { 42 | checkbox.setChecked(true); 43 | } 44 | 45 | this.addChild(checkbox, true); 46 | } 47 | }; 48 | 49 | 50 | /** 51 | * @return {Array} All checked checkboxes values. 52 | */ 53 | chartEditor.ui.dataSettings.chartTypeSelect.Filters.prototype.getValue = function() { 54 | var result = []; 55 | for (var i = 0; i < this.getChildCount(); i++) { 56 | var checkbox = this.getChildAt(i); 57 | if (goog.isFunction(checkbox.isChecked) && checkbox.isChecked()) { 58 | result.push(checkbox.getModel()); 59 | } 60 | } 61 | 62 | return result; 63 | }; 64 | -------------------------------------------------------------------------------- /src/ui/dataSettings/chartTypeSelect/MenuItem.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.control.select.MenuItem'); 2 | goog.provide('chartEditor.ui.control.select.MenuItemRenderer'); 3 | goog.require('goog.ui.MenuItem'); 4 | goog.require('goog.ui.MenuItemRenderer'); 5 | 6 | 7 | /** 8 | * @param {Object=} opt_model 9 | * @param {goog.dom.DomHelper=} opt_domHelper 10 | * @param {goog.ui.MenuItemRenderer=} opt_renderer 11 | * @constructor 12 | * @extends {goog.ui.MenuItem} 13 | */ 14 | chartEditor.ui.control.select.MenuItem = function(opt_model, opt_domHelper, opt_renderer) { 15 | goog.ui.MenuItem.call( 16 | this, 17 | opt_model ? opt_model.caption : '', 18 | opt_model, 19 | opt_domHelper, 20 | opt_renderer || chartEditor.ui.control.select.MenuItemRenderer.getInstance() 21 | ); 22 | //this.addClassName(chartEditor.ui.control.select.MenuItem.CSS_CLASS); 23 | }; 24 | goog.inherits(chartEditor.ui.control.select.MenuItem, goog.ui.MenuItem); 25 | 26 | 27 | /** 28 | * @constructor 29 | * @extends {goog.ui.MenuItemRenderer} 30 | */ 31 | chartEditor.ui.control.select.MenuItemRenderer = function() { 32 | goog.ui.MenuItemRenderer.call(this); 33 | }; 34 | goog.inherits(chartEditor.ui.control.select.MenuItemRenderer, goog.ui.MenuItemRenderer); 35 | goog.addSingletonGetter(chartEditor.ui.control.select.MenuItemRenderer); 36 | 37 | 38 | /** 39 | * Overrides {@link goog.ui.ControlRenderer#createDom} by adding extra markup 40 | * and stying to the menu item's element if it is selectable or checkable. 41 | * @param {goog.ui.Control} item Menu item to render. 42 | * @return {Element} Root element for the item. 43 | * @override 44 | */ 45 | chartEditor.ui.control.select.MenuItemRenderer.prototype.createDom = function(item) { 46 | var element = chartEditor.ui.control.select.MenuItemRenderer.base(this, 'createDom', item); 47 | 48 | //var content = this.getContentElement(element); 49 | 50 | var iconUrl = item.getModel().icon; 51 | var icon = goog.dom.createDom('img', {'src': iconUrl}); 52 | goog.dom.insertChildAt(element, icon, 0); 53 | return element; 54 | }; 55 | 56 | 57 | // /** @inheritDoc */ 58 | // chartEditor.ui.control.select.MenuItemRenderer.prototype.getCssClass = function() { 59 | // return chartEditor.ui.control.select.MenuItem.CSS_CLASS; 60 | // }; -------------------------------------------------------------------------------- /src/ui/dialog/Base.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.dialog.Base'); 2 | 3 | goog.require('goog.ui.Dialog'); 4 | 5 | 6 | /** 7 | * Modal dialog for adding custom data on Prepare Data step. 8 | * 9 | * @param {string=} opt_class 10 | * @param {boolean=} opt_useIframeMask 11 | * @param {goog.dom.DomHelper=} opt_domHelper 12 | * @constructor 13 | * @extends {goog.ui.Dialog} 14 | */ 15 | chartEditor.ui.dialog.Base = function(opt_class, opt_useIframeMask, opt_domHelper) { 16 | chartEditor.ui.dialog.Base.base( 17 | this, 18 | 'constructor', 19 | opt_class || goog.getCssName('anychart-ce-dialog'), 20 | opt_useIframeMask, 21 | opt_domHelper); 22 | }; 23 | goog.inherits(chartEditor.ui.dialog.Base, goog.ui.Dialog); 24 | 25 | 26 | /** @inheritDoc */ 27 | chartEditor.ui.dialog.Base.prototype.createDom = function(){ 28 | chartEditor.ui.dialog.Base.base(this, 'createDom'); 29 | 30 | var titleCloseEl = this.getTitleCloseElement(); 31 | goog.dom.classlist.add(titleCloseEl, goog.getCssName('ac')); 32 | goog.dom.classlist.add(titleCloseEl, goog.getCssName('ac-plus')); 33 | }; 34 | -------------------------------------------------------------------------------- /src/ui/dialog/Confirm.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.dialog.Confirm'); 2 | 3 | goog.require('chartEditor.ui.dialog.Base'); 4 | goog.require('goog.ui.Dialog'); 5 | 6 | 7 | /** 8 | * Modal dialog for adding custom data on Prepare Data step. 9 | * 10 | * @param {string=} opt_class 11 | * @param {boolean=} opt_useIframeMask 12 | * @param {goog.dom.DomHelper=} opt_domHelper 13 | * @constructor 14 | * @extends {chartEditor.ui.dialog.Base} 15 | */ 16 | chartEditor.ui.dialog.Confirm = function(opt_class, opt_useIframeMask, opt_domHelper) { 17 | chartEditor.ui.dialog.Confirm.base(this, 'constructor', opt_class, opt_useIframeMask, opt_domHelper); 18 | 19 | this.setButtonSet(goog.ui.Dialog.ButtonSet.createOkCancel()); 20 | }; 21 | goog.inherits(chartEditor.ui.dialog.Confirm, chartEditor.ui.dialog.Base); 22 | 23 | 24 | /** @inheritDoc */ 25 | chartEditor.ui.dialog.Confirm.prototype.createDom = function(){ 26 | chartEditor.ui.dialog.Confirm.base(this, 'createDom'); 27 | 28 | goog.dom.classlist.add(this.getDialogElement(), goog.getCssName('anychart-ce-dialog-confirm')); 29 | }; 30 | -------------------------------------------------------------------------------- /src/ui/dialog/PresetPreview.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.dialog.PresetPreview'); 2 | 3 | goog.require('chartEditor.ui.dialog.Base'); 4 | goog.require('chartEditor.ui.presets.Widget'); 5 | goog.require('goog.ui.Dialog'); 6 | 7 | 8 | /** 9 | * Modal dialog to show preset preview and selector. 10 | * 11 | * @param {string=} opt_class 12 | * @param {boolean=} opt_useIframeMask 13 | * @param {goog.dom.DomHelper=} opt_domHelper 14 | * @constructor 15 | * @extends {chartEditor.ui.dialog.Base} 16 | */ 17 | chartEditor.ui.dialog.PresetPreview = function(opt_class, opt_useIframeMask, opt_domHelper) { 18 | chartEditor.ui.dialog.PresetPreview.base(this, 'constructor', opt_class, opt_useIframeMask, opt_domHelper); 19 | this.setButtonSet(null); 20 | }; 21 | goog.inherits(chartEditor.ui.dialog.PresetPreview, chartEditor.ui.dialog.Base); 22 | 23 | 24 | /** @inheritDoc */ 25 | chartEditor.ui.dialog.PresetPreview.prototype.createDom = function() { 26 | chartEditor.ui.dialog.PresetPreview.base(this, 'createDom'); 27 | goog.dom.classlist.add(this.getDialogElement(), goog.getCssName('anychart-ce-data-preview-dialog')); 28 | 29 | var predefinedDataSelector = new chartEditor.ui.presets.Widget(/** @type {chartEditor.model.Base} */ (this.getModel())); 30 | this.addChild(predefinedDataSelector, true); 31 | }; 32 | 33 | -------------------------------------------------------------------------------- /src/ui/exportTabs/Json.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.exportTabs.Json'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('goog.Timer'); 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 10 | * @constructor 11 | * @extends {chartEditor.ui.Panel} 12 | */ 13 | chartEditor.ui.exportTabs.Json = function(model, opt_domHelper) { 14 | chartEditor.ui.exportTabs.Json.base(this, 'constructor', model, 'JSON', opt_domHelper); 15 | 16 | this.stringId = chartEditor.enums.EditorTabs.JSON; 17 | 18 | this.key = []; 19 | }; 20 | goog.inherits(chartEditor.ui.exportTabs.Json, chartEditor.ui.Panel); 21 | 22 | 23 | /** @inheritDoc */ 24 | chartEditor.ui.exportTabs.Json.prototype.enterDocument = function() { 25 | chartEditor.ui.exportTabs.Json.base(this, 'enterDocument'); 26 | 27 | if (!this.isExcluded()) { 28 | this.dispatchEvent({ 29 | type: chartEditor.events.EventType.WAIT, 30 | wait: true 31 | }); 32 | } 33 | }; 34 | 35 | 36 | /** @inheritDoc */ 37 | chartEditor.ui.exportTabs.Json.prototype.onChartDraw = function(evt) { 38 | chartEditor.ui.exportTabs.Json.base(this, 'onChartDraw', evt); 39 | 40 | var self = this; 41 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 42 | var json = model.getChartAsJson(); 43 | 44 | var dom = this.getDomHelper(); 45 | if (this.preEl) 46 | dom.removeNode(this.preEl); 47 | 48 | this.codeEl = dom.createDom(goog.dom.TagName.CODE, 'language-json', json); 49 | this.preEl = dom.createDom(goog.dom.TagName.PRE, 'language-json', this.codeEl); 50 | dom.appendChild(this.getContentElement(), this.preEl); 51 | 52 | var chartContainer = dom.getElementByClass('anychart-ce-chart-container'); 53 | if (chartContainer) { 54 | var h = goog.style.getSize(chartContainer).height; 55 | goog.style.setHeight(this.preEl, h); 56 | } 57 | 58 | var wrapperEl = dom.getAncestorByClass( this.preEl, 'anychart-ce-tabs-tab-content'); 59 | if (wrapperEl) { 60 | goog.style.setStyle(wrapperEl, 'overflow-y', 'hidden'); 61 | } 62 | 63 | var prism = goog.dom.getWindow()['Prism']; 64 | if (prism) { 65 | prism['highlightElement'](this.codeEl); 66 | } 67 | 68 | goog.Timer.callOnce(function(){ 69 | self.dispatchEvent({ 70 | type: chartEditor.events.EventType.WAIT, 71 | wait: false 72 | }); 73 | }, 10); 74 | }; 75 | 76 | 77 | /** @inheritDoc */ 78 | chartEditor.ui.exportTabs.Json.prototype.disposeInternal = function() { 79 | this.preEl = this.codeEl = null; 80 | 81 | chartEditor.ui.exportTabs.Json.base(this, 'disposeInternal'); 82 | }; 83 | -------------------------------------------------------------------------------- /src/ui/exportTabs/Scripts.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.exportTabs.Scripts'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | 5 | 6 | /** 7 | * @param {chartEditor.model.Base} model 8 | * @param {?string=} opt_name 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 10 | * @constructor 11 | * @extends {chartEditor.ui.Panel} 12 | */ 13 | chartEditor.ui.exportTabs.Scripts = function(model, opt_name, opt_domHelper) { 14 | chartEditor.ui.exportTabs.Scripts.base(this, 'constructor', model, opt_name, opt_domHelper); 15 | 16 | this.key = []; 17 | 18 | this.cdnBaseUrl_ = 'https://cdn.anychart.com/releases/v8'; 19 | 20 | this.themesMap_ = { 21 | 'coffee': 'coffee', 22 | 'darkBlue': 'dark_blue', 23 | 'darkEarth': 'dark_earth', 24 | 'darkGlamour': 'dark_glamour', 25 | 'darkProvence': 'dark_provence', 26 | 'darkTurquoise': 'dark_turquoise', 27 | 'lightBlue': 'light_blue', 28 | 'lightEarth': 'light_earth', 29 | 'lightGlamour': 'light_glamour', 30 | 'lightProvence': 'light_provence', 31 | 'lightTurquoise': 'light_turquoise', 32 | 'monochrome': 'monochrome', 33 | 'morning': 'morning', 34 | 'pastel': 'pastel', 35 | 'sea': 'sea', 36 | 'wines': 'wines' 37 | }; 38 | }; 39 | goog.inherits(chartEditor.ui.exportTabs.Scripts, chartEditor.ui.Panel); 40 | 41 | 42 | /** 43 | * Returns all the scripts that need to create html page 44 | * @return {Object} 45 | */ 46 | chartEditor.ui.exportTabs.Scripts.prototype.getScripts = function() { 47 | 48 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 49 | 50 | var result = { 51 | bundle: this.cdnBaseUrl_ + '/js/anychart-bundle.min.js', 52 | css_ui: this.cdnBaseUrl_ + '/css/anychart-ui.min.css', 53 | css_fonts: this.cdnBaseUrl_ + '/fonts/css/anychart-font.min.css' 54 | }; 55 | 56 | // Include theme if needed 57 | var theme = model.getValue([['anychart'], 'theme()']); 58 | if (theme && this.themesMap_[theme]) { 59 | result.theme = this.cdnBaseUrl_ + '/themes/' + this.themesMap_[theme] + '.min.js'; 60 | } 61 | 62 | // Include proj4js for maps 63 | var chartType = model.getValue([['chart'], 'type']); 64 | if (chartType == 'map') { 65 | var getGeoDataInfo = model.getGeoDataInfo(); 66 | result.geoData = getGeoDataInfo['url']; 67 | result.proj4js = 'https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.15/proj4.js'; 68 | } 69 | 70 | return result; 71 | }; 72 | -------------------------------------------------------------------------------- /src/ui/exportTabs/Tabs.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.exportTabs.Tabs'); 2 | 3 | goog.require("chartEditor.ui.Tabs"); 4 | goog.require("chartEditor.ui.exportTabs.Embed"); 5 | goog.require("chartEditor.ui.exportTabs.Json"); 6 | goog.require("chartEditor.ui.exportTabs.SourceCode"); 7 | 8 | 9 | /** 10 | * Appearance panel widget. 11 | * 12 | * @param {chartEditor.model.Base} model 13 | * @param {chartEditor.ui.Component=} opt_buttonsWrapper 14 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 15 | * @constructor 16 | * @extends {chartEditor.ui.Tabs} 17 | */ 18 | chartEditor.ui.exportTabs.Tabs = function(model, opt_buttonsWrapper, opt_domHelper) { 19 | chartEditor.ui.exportTabs.Tabs.base(this, 'constructor', model, opt_buttonsWrapper, opt_domHelper); 20 | 21 | this.descriptors = [ 22 | { 23 | name: chartEditor.enums.EditorTabs.SOURCE_CODE, 24 | enabled: true, 25 | classFunc: chartEditor.ui.exportTabs.SourceCode, 26 | instance: null 27 | }, { 28 | name: chartEditor.enums.EditorTabs.JSON, 29 | enabled: true, 30 | classFunc: chartEditor.ui.exportTabs.Json, 31 | instance: null 32 | }, { 33 | name: chartEditor.enums.EditorTabs.EMBED, 34 | enabled: true, 35 | classFunc: chartEditor.ui.exportTabs.Embed, 36 | instance: null 37 | } 38 | ]; 39 | }; 40 | goog.inherits(chartEditor.ui.exportTabs.Tabs, chartEditor.ui.Tabs); 41 | -------------------------------------------------------------------------------- /src/ui/panel/Background.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.Background'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.colorPicker.Base'); 5 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 6 | goog.require('chartEditor.ui.panel.Stroke'); 7 | 8 | 9 | /** 10 | * @param {chartEditor.model.Base} model 11 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 12 | * @constructor 13 | * @extends {chartEditor.ui.Panel} 14 | */ 15 | chartEditor.ui.panel.Background = function(model, opt_domHelper) { 16 | chartEditor.ui.panel.Background.base(this, 'constructor', model, 'Background', opt_domHelper); 17 | 18 | this.allowEnabled(false); 19 | 20 | this.addClassName(goog.getCssName('anychart-ce-panel-Background')); 21 | }; 22 | goog.inherits(chartEditor.ui.panel.Background, chartEditor.ui.Panel); 23 | 24 | 25 | /** @inheritDoc */ 26 | chartEditor.ui.panel.Background.prototype.createDom = function() { 27 | chartEditor.ui.panel.Background.base(this, 'createDom'); 28 | 29 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 30 | 31 | var fill = new chartEditor.ui.control.colorPicker.Base(); 32 | var fillLC = new chartEditor.ui.control.wrapped.Labeled(fill, 'Background Fill'); 33 | fillLC.init(model, this.genKey('fill()')); 34 | this.addChildControl(fillLC); 35 | 36 | var stroke = new chartEditor.ui.panel.Stroke(model, 'Stroke'); 37 | stroke.setKey(this.genKey('stroke()')); 38 | this.addChildControl(stroke); 39 | }; 40 | -------------------------------------------------------------------------------- /src/ui/panel/Cap.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.Cap'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.colorPicker.Base'); 5 | goog.require('chartEditor.ui.control.comboBox.Percent'); 6 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 7 | goog.require('chartEditor.ui.panel.Stroke'); 8 | 9 | 10 | /** 11 | * @param {chartEditor.model.Base} model 12 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 13 | * @constructor 14 | * @extends {chartEditor.ui.Panel} 15 | */ 16 | chartEditor.ui.panel.Cap = function(model, opt_domHelper) { 17 | chartEditor.ui.panel.Cap.base(this, 'constructor', model, 'Cap', opt_domHelper); 18 | 19 | this.allowEnabled(true); 20 | }; 21 | goog.inherits(chartEditor.ui.panel.Cap, chartEditor.ui.Panel); 22 | 23 | 24 | /** 25 | * Default CSS class. 26 | * @type {string} 27 | */ 28 | chartEditor.ui.panel.Cap.CSS_CLASS = goog.getCssName('anychart-ce-panel-cap'); 29 | 30 | 31 | /** @override */ 32 | chartEditor.ui.panel.Cap.prototype.createDom = function() { 33 | chartEditor.ui.panel.Cap.base(this, 'createDom'); 34 | 35 | goog.dom.classlist.add(this.getElement(), chartEditor.ui.panel.Cap.CSS_CLASS); 36 | 37 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 38 | 39 | var fill = new chartEditor.ui.control.colorPicker.Base(); 40 | var fillLC = new chartEditor.ui.control.wrapped.Labeled(fill, 'Cap Fill'); 41 | fillLC.init(model, this.genKey('fill()')); 42 | this.addChildControl(fillLC); 43 | 44 | var stroke = new chartEditor.ui.panel.Stroke(model); 45 | stroke.setKey(this.genKey('stroke()')); 46 | this.addChildControl(stroke); 47 | 48 | var radius = new chartEditor.ui.control.comboBox.Percent(); 49 | radius.setOptions([10, 30, 50, 70, 90]); 50 | var radiusLC = new chartEditor.ui.control.wrapped.Labeled(radius, 'Radius'); 51 | radiusLC.init(model, this.genKey('radius()')); 52 | this.addChildControl(radiusLC); 53 | }; 54 | -------------------------------------------------------------------------------- /src/ui/panel/Error.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.Error'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.comboBox.Percent'); 5 | goog.require('chartEditor.ui.control.input.Numbers'); 6 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 7 | 8 | 9 | 10 | /** 11 | * @param {chartEditor.model.Base} model 12 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 13 | * @constructor 14 | * @extends {chartEditor.ui.Panel} 15 | */ 16 | chartEditor.ui.panel.Error = function(model, opt_domHelper) { 17 | chartEditor.ui.panel.Error.base(this, 'constructor', model, 'Error', opt_domHelper); 18 | 19 | this.allowReset(true); 20 | }; 21 | goog.inherits(chartEditor.ui.panel.Error, chartEditor.ui.Panel); 22 | 23 | 24 | /** @override */ 25 | chartEditor.ui.panel.Error.prototype.createDom = function() { 26 | chartEditor.ui.panel.Error.base(this, 'createDom'); 27 | 28 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 29 | 30 | var valueError = new chartEditor.ui.control.comboBox.Percent(); 31 | valueError.setOptions([1, 2, 3, 4, 5, 10, 15]); 32 | var valueErrorLC = new chartEditor.ui.control.wrapped.Labeled(valueError, 'Value Error'); 33 | valueErrorLC.init(model, this.genKey(['valueError()'])); 34 | this.addChildControl(valueErrorLC); 35 | 36 | var valueUpperError = new chartEditor.ui.control.input.Numbers(); 37 | var valueUpperErrorLC = new chartEditor.ui.control.wrapped.Labeled(valueUpperError, 'Value Upper Error'); 38 | valueUpperErrorLC.init(model, this.genKey(['valueUpperError()'])); 39 | this.addChildControl(valueUpperErrorLC); 40 | 41 | var valueLowerError = new chartEditor.ui.control.input.Numbers(); 42 | var valueLowerErrorLC = new chartEditor.ui.control.wrapped.Labeled(valueLowerError, 'Value Lower Error'); 43 | valueLowerErrorLC.init(model, this.genKey(['valueLowerError()'])); 44 | this.addChildControl(valueLowerErrorLC); 45 | 46 | if (model.getModel()['chart']['type'] === 'scatter') { 47 | var xUpperError = new chartEditor.ui.control.input.Numbers(); 48 | var xUpperErrorLC = new chartEditor.ui.control.wrapped.Labeled(xUpperError, 'X Upper Error'); 49 | xUpperErrorLC.init(model, this.genKey(['xUpperError()'])); 50 | this.addChildControl(xUpperErrorLC); 51 | 52 | var xLowerError = new chartEditor.ui.control.input.Numbers(); 53 | var xLowerErrorLC = new chartEditor.ui.control.wrapped.Labeled(xLowerError, 'X Lower Error'); 54 | xLowerErrorLC.init(model, this.genKey(['xLowerError()'])); 55 | this.addChildControl(xLowerErrorLC); 56 | } 57 | }; 58 | -------------------------------------------------------------------------------- /src/ui/panel/Markers.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.Markers'); 2 | 3 | goog.require('chartEditor.enums'); 4 | goog.require('chartEditor.ui.Panel'); 5 | goog.require('chartEditor.ui.control.colorPicker.Base'); 6 | goog.require('chartEditor.ui.control.comboBox.Base'); 7 | goog.require('chartEditor.ui.control.fieldSelect.Select'); 8 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 9 | goog.require('chartEditor.ui.panel.Stroke'); 10 | 11 | 12 | 13 | /** 14 | * @param {chartEditor.model.Base} model 15 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 16 | * @constructor 17 | * @extends {chartEditor.ui.Panel} 18 | */ 19 | chartEditor.ui.panel.Markers = function(model, opt_domHelper) { 20 | chartEditor.ui.panel.Markers.base(this, 'constructor', model, 'Markers', opt_domHelper); 21 | 22 | this.allowReset(true); 23 | 24 | this.addClassName(goog.getCssName('anychart-ce-panel-markers')); 25 | 26 | this.fillKey_ = 'fill()'; 27 | }; 28 | goog.inherits(chartEditor.ui.panel.Markers, chartEditor.ui.Panel); 29 | 30 | 31 | /** @param {string} value */ 32 | chartEditor.ui.panel.Markers.prototype.setFillKey = function(value) { 33 | this.fillKey_ = value; 34 | }; 35 | 36 | /** @override */ 37 | chartEditor.ui.panel.Markers.prototype.createDom = function() { 38 | chartEditor.ui.panel.Markers.base(this, 'createDom'); 39 | 40 | var content = this.getContentElement(); 41 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 42 | 43 | var type = new chartEditor.ui.control.fieldSelect.Select('Type'); 44 | type.setOptions(goog.object.getValues(chartEditor.enums.MarkerType)); 45 | type.addClassName(goog.getCssName('markers-type')); 46 | var pointWidthLC = new chartEditor.ui.control.wrapped.Labeled(type, 'Type'); 47 | pointWidthLC.init(model, this.genKey('type()')); 48 | this.addChildControl(pointWidthLC); 49 | 50 | var size = new chartEditor.ui.control.comboBox.Base(); 51 | size.setOptions([6, 10, 12, 15]); 52 | pointWidthLC = new chartEditor.ui.control.wrapped.Labeled(size, 'Size'); 53 | pointWidthLC.init(model, this.genKey('size()')); 54 | this.addChildControl(pointWidthLC); 55 | goog.dom.classlist.add(size.getElement(), goog.getCssName('markers-size')); 56 | 57 | var fill = new chartEditor.ui.control.colorPicker.Base(); 58 | pointWidthLC = new chartEditor.ui.control.wrapped.Labeled(fill, 'Fill'); 59 | pointWidthLC.init(model, this.genKey(this.fillKey_)); 60 | this.addChildControl(pointWidthLC); 61 | goog.dom.classlist.add(fill.getElement(), goog.getCssName('markers-fill')); 62 | 63 | goog.dom.appendChild(content, goog.dom.createDom(goog.dom.TagName.DIV, goog.getCssName('anychart-ce-clearboth'))); 64 | 65 | goog.dom.appendChild(this.getContentElement(), goog.dom.createDom( 66 | goog.dom.TagName.DIV, 67 | goog.getCssName('anychart-ce-panel-item-gap'))); 68 | 69 | var stroke = new chartEditor.ui.panel.Stroke(model); 70 | stroke.setKey(this.genKey('stroke()')); 71 | this.addChildControl(stroke); 72 | }; 73 | -------------------------------------------------------------------------------- /src/ui/panel/PlotGrids.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.PlotGrids'); 2 | 3 | goog.require('chartEditor.ui.PanelIndexed'); 4 | goog.require('chartEditor.ui.panel.Grid'); 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {number=} opt_plotIndex 10 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 11 | * @constructor 12 | * @extends {chartEditor.ui.PanelIndexed} 13 | */ 14 | chartEditor.ui.panel.PlotGrids = function(model, opt_plotIndex, opt_domHelper) { 15 | chartEditor.ui.panel.PlotGrids.base( 16 | this, 17 | 'constructor', 18 | model, 19 | goog.isDef(opt_plotIndex) ? opt_plotIndex : 0, 20 | null, 21 | opt_domHelper); 22 | 23 | this.plotIndex_ = opt_plotIndex; 24 | 25 | this.key = [['chart'], ['settings']]; 26 | if (goog.isDef(this.plotIndex_)) { 27 | this.name = 'Grids (plot ' + this.plotIndex_ + ')'; 28 | this.key.push('plot(' + this.plotIndex_ + ')'); 29 | 30 | } else { 31 | // this.name = 'Grids'; 32 | } 33 | 34 | this.allowEnabled(false); 35 | 36 | this.addClassName(goog.getCssName('anychart-ce-panel-plot-grids')); 37 | }; 38 | goog.inherits(chartEditor.ui.panel.PlotGrids, chartEditor.ui.PanelIndexed); 39 | 40 | 41 | /** @override */ 42 | chartEditor.ui.panel.PlotGrids.prototype.createDom = function() { 43 | chartEditor.ui.panel.PlotGrids.base(this, 'createDom'); 44 | 45 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 46 | 47 | var xGrid = new chartEditor.ui.panel.Grid(model, 'X Grid'); 48 | xGrid.setKey(this.genKey('xGrid()')); 49 | this.addChildControl(xGrid); 50 | 51 | this.addContentSeparator(); 52 | 53 | var yGrid = new chartEditor.ui.panel.Grid(model, 'Y Grid'); 54 | yGrid.setKey(this.genKey('yGrid()')); 55 | this.addChildControl(yGrid); 56 | }; 57 | -------------------------------------------------------------------------------- /src/ui/panel/Quarter.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.Quarter'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.colorPicker.Base'); 5 | goog.require('chartEditor.ui.control.comboBox.Base'); 6 | goog.require('chartEditor.ui.control.fieldSelect.Base'); 7 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 8 | goog.require('chartEditor.ui.panel.QuarterLabel'); 9 | goog.require('chartEditor.ui.panel.Stroke'); 10 | goog.require('chartEditor.ui.panel.Title'); 11 | 12 | 13 | /** 14 | * @param {chartEditor.model.Base} model 15 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 16 | * @constructor 17 | * @extends {chartEditor.ui.Panel} 18 | */ 19 | chartEditor.ui.panel.Quarter = function(model, opt_domHelper) { 20 | chartEditor.ui.panel.Quarter.base(this, 'constructor', model, 'Quarter', opt_domHelper); 21 | this.allowEnabled(false); 22 | }; 23 | goog.inherits(chartEditor.ui.panel.Quarter, chartEditor.ui.Panel); 24 | 25 | 26 | /** @inheritDoc */ 27 | chartEditor.ui.panel.Quarter.prototype.createDom = function() { 28 | chartEditor.ui.panel.Quarter.base(this, 'createDom'); 29 | 30 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 31 | 32 | var fill = new chartEditor.ui.control.colorPicker.Base(); 33 | var fillLC = new chartEditor.ui.control.wrapped.Labeled(fill, 'Fill'); 34 | fillLC.init(model, this.genKey('fill()')); 35 | this.addChildControl(fillLC); 36 | 37 | var corners = new chartEditor.ui.control.comboBox.Base(); 38 | corners.setOptions([0, 10, 20, 30]); 39 | corners.setRange(0,200); 40 | var cornersLC = new chartEditor.ui.control.wrapped.Labeled(corners, 'Corners'); 41 | cornersLC.init(model, this.genKey('corners()')); 42 | this.addChildControl(cornersLC); 43 | 44 | var cornerType = new chartEditor.ui.control.fieldSelect.Base({label: 'Corner type'}); 45 | cornerType.init(model, this.genKey('cornerType()')); 46 | cornerType.getSelect().setOptions([ 47 | {'value': 'none'}, 48 | {'value': 'round'}, 49 | {'value': 'round-inner'}, 50 | {'value': 'cut'} 51 | ]); 52 | this.addChildControl(cornerType); 53 | 54 | var stroke = new chartEditor.ui.panel.Stroke(model, 'Stroke'); 55 | stroke.setKey(this.genKey('stroke()')); 56 | this.addChildControl(stroke); 57 | 58 | var title = new chartEditor.ui.panel.Title(model, 'Title'); 59 | title.allowEnabled(true); 60 | title.setPositionKey('orientation()'); 61 | title.setKey(this.genKey('title()')); 62 | this.addChildControl(title); 63 | 64 | var label = new chartEditor.ui.panel.QuarterLabel(model); 65 | label.setName('Label'); 66 | label.setKey(this.genKey('label()')); 67 | this.addChildControl(label); 68 | }; 69 | -------------------------------------------------------------------------------- /src/ui/panel/Stagger.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.Stagger'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.checkbox.Base'); 5 | goog.require('chartEditor.ui.control.comboBox.Base'); 6 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 7 | 8 | 9 | /** 10 | * @param {chartEditor.model.Base} model 11 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 12 | * @constructor 13 | * @extends {chartEditor.ui.Panel} 14 | */ 15 | chartEditor.ui.panel.Stagger = function(model, opt_domHelper) { 16 | chartEditor.ui.panel.Stagger.base(this, 'constructor', model, 'Stagger Mode', opt_domHelper); 17 | 18 | this.allowReset(true); 19 | 20 | this.addClassName(goog.getCssName('anychart-ce-panel-stagger')); 21 | }; 22 | goog.inherits(chartEditor.ui.panel.Stagger, chartEditor.ui.Panel); 23 | 24 | 25 | /** @inheritDoc */ 26 | chartEditor.ui.panel.Stagger.prototype.setKey = function(key) { 27 | chartEditor.ui.panel.Stagger.base(this, 'setKey', key); 28 | this.enabledKey(this.genKey('staggerMode()')); 29 | }; 30 | 31 | 32 | /** @inheritDoc */ 33 | chartEditor.ui.panel.Stagger.prototype.createDom = function() { 34 | chartEditor.ui.panel.Stagger.base(this, 'createDom'); 35 | 36 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 37 | 38 | // Stagger lines 39 | var staggerLines = new chartEditor.ui.control.comboBox.Base(); 40 | staggerLines.setOptions([1, 2, 3, 4, 5]); 41 | staggerLines.setRange(0, 10); 42 | var staggerLinesLC = new chartEditor.ui.control.wrapped.Labeled(staggerLines, 'Stagger Lines'); 43 | staggerLinesLC.init(model, this.genKey('staggerLines()')); 44 | this.addChildControl(staggerLinesLC); 45 | 46 | // Stagger max lines 47 | var staggerMaxLines = new chartEditor.ui.control.comboBox.Base(); 48 | staggerMaxLines.setOptions([1, 2, 3, 4, 5]); 49 | staggerMaxLines.setRange(0, 10); 50 | var staggerMaxLinesLC = new chartEditor.ui.control.wrapped.Labeled(staggerMaxLines, 'Stagger Max Lines'); 51 | staggerMaxLinesLC.init(model, this.genKey('staggerMaxLines()')); 52 | this.addChildControl(staggerMaxLinesLC); 53 | }; 54 | -------------------------------------------------------------------------------- /src/ui/panel/TooltipTitle.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.TooltipTitle'); 2 | 3 | goog.require('chartEditor.ui.panel.Title'); 4 | 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {?string=} opt_name 10 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 11 | * @constructor 12 | * @extends {chartEditor.ui.panel.Title} 13 | */ 14 | chartEditor.ui.panel.TooltipTitle = function(model, opt_name, opt_domHelper) { 15 | chartEditor.ui.panel.TooltipTitle.base(this, 'constructor', model, opt_name, opt_domHelper); 16 | 17 | this.allowEnabled(true); 18 | this.allowEditPosition(false); 19 | this.allowEditAlign(false); 20 | 21 | /** 22 | * @type {chartEditor.model.Base.Key} 23 | * @private 24 | */ 25 | this.titleFormatKey_ = []; 26 | }; 27 | goog.inherits(chartEditor.ui.panel.TooltipTitle, chartEditor.ui.panel.Title); 28 | 29 | 30 | /** 31 | * @param {chartEditor.model.Base.Key} value 32 | */ 33 | chartEditor.ui.panel.TooltipTitle.prototype.setTitleFormatKey = function(value) { 34 | this.titleFormatKey_ = value; 35 | }; 36 | 37 | 38 | /** @inheritDoc */ 39 | chartEditor.ui.panel.TooltipTitle.prototype.updateKeys = function() { 40 | chartEditor.ui.panel.TooltipTitle.base(this, 'updateKeys'); 41 | if (this.isExcluded()) return; 42 | 43 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 44 | if (this.textInput_) this.textInput_.init(model, this.titleFormatKey_); 45 | }; 46 | -------------------------------------------------------------------------------- /src/ui/panel/TreemapHeaders.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.TreemapHeaders'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.comboBox.Base'); 5 | goog.require('chartEditor.ui.control.fieldSelect.Base'); 6 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 7 | goog.require('chartEditor.ui.panel.Title'); 8 | 9 | 10 | 11 | /** 12 | * @param {chartEditor.model.Base} model 13 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 14 | * @constructor 15 | * @extends {chartEditor.ui.Panel} 16 | */ 17 | chartEditor.ui.panel.TreemapHeaders = function(model, opt_domHelper) { 18 | chartEditor.ui.panel.TreemapHeaders.base(this, 'constructor', model, 'Headers', opt_domHelper); 19 | 20 | this.key = [['chart'], ['settings'], 'headers()']; 21 | }; 22 | goog.inherits(chartEditor.ui.panel.TreemapHeaders, chartEditor.ui.Panel); 23 | 24 | 25 | /** 26 | * Default CSS class. 27 | * @type {string} 28 | */ 29 | chartEditor.ui.panel.TreemapHeaders.CSS_CLASS = goog.getCssName('anychart-ce-panel-treemap-headers'); 30 | 31 | 32 | /** @inheritDoc */ 33 | chartEditor.ui.panel.TreemapHeaders.prototype.createDom = function() { 34 | chartEditor.ui.panel.TreemapHeaders.base(this, 'createDom'); 35 | 36 | var element = this.getElement(); 37 | goog.dom.classlist.add(element, chartEditor.ui.panel.TreemapHeaders.CSS_CLASS); 38 | 39 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 40 | var settings = new chartEditor.ui.panel.Title(model, null); 41 | settings.allowEnabled(false); 42 | settings.allowEditPosition(false); 43 | settings.allowEditAlign(false); 44 | 45 | settings.setTitleKey('format()'); 46 | settings.setKey(this.getKey()); // This is for enabled working sake! 47 | this.addChildControl(settings); 48 | this.settings_ = settings; 49 | 50 | var maxHeadersHeight = new chartEditor.ui.control.comboBox.Base(); 51 | maxHeadersHeight.setOptions([0, 10, 20, 50, 100]); 52 | maxHeadersHeight.setRange(0, 100); 53 | this.maxHeadersHeight_ = new chartEditor.ui.control.wrapped.Labeled(maxHeadersHeight, 'Max Headers Height'); 54 | this.maxHeadersHeight_.init(model, [['chart'], ['settings'], 'maxHeadersHeight()']); 55 | this.addChildControl(this.maxHeadersHeight_); 56 | 57 | var headersDisplayMode = new chartEditor.ui.control.fieldSelect.Base({label: 'Headers Display Mode'}); 58 | headersDisplayMode.getSelect().setOptions([ 59 | {value: 'always-show', caption: 'Always Show'}, 60 | {value: 'clip', caption: 'Clip'}, 61 | {value: 'drop', caption: 'Drop'} 62 | ]); 63 | this.headersDisplayMode_ = headersDisplayMode; 64 | this.headersDisplayMode_.init(model, [['chart'], ['settings'], 'headersDisplayMode()']); 65 | this.addChildControl(this.headersDisplayMode_); 66 | }; 67 | -------------------------------------------------------------------------------- /src/ui/panel/axes/Cartesian.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.axes.Cartesian'); 2 | 3 | goog.require('chartEditor.ui.panel.axes.Linear'); 4 | 5 | 6 | /** 7 | * @param {chartEditor.model.Base} model 8 | * @param {number} index 9 | * @param {string} xOrY 10 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 11 | * @constructor 12 | * @extends {chartEditor.ui.panel.axes.Linear} 13 | */ 14 | chartEditor.ui.panel.axes.Cartesian = function(model, index, xOrY, opt_domHelper) { 15 | chartEditor.ui.panel.axes.Cartesian.base(this, 'constructor', model, index, opt_domHelper); 16 | 17 | this.xOrY = xOrY; 18 | this.name = this.xOrY + 'Axis(' + this.index_ + ')'; 19 | this.key = [['chart'], ['settings'], this.xOrY + 'Axis(' + this.index_ + ')']; 20 | this.allowReset(true); 21 | }; 22 | goog.inherits(chartEditor.ui.panel.axes.Cartesian, chartEditor.ui.panel.axes.Linear); 23 | -------------------------------------------------------------------------------- /src/ui/panel/axes/LinearGauge.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.axes.LinearGauge'); 2 | 3 | goog.require('chartEditor.ui.control.comboBox.Percent'); 4 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 5 | goog.require('chartEditor.ui.panel.axes.Linear'); 6 | goog.require('chartEditor.ui.panel.scales.Base'); 7 | 8 | 9 | /** 10 | * @param {chartEditor.model.Base} model 11 | * @param {number} index 12 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 13 | * @constructor 14 | * @extends {chartEditor.ui.panel.axes.Linear} 15 | */ 16 | chartEditor.ui.panel.axes.LinearGauge = function(model, index, opt_domHelper) { 17 | chartEditor.ui.panel.axes.LinearGauge.base(this, 'constructor', model, index, opt_domHelper); 18 | 19 | this.allowReset(true); 20 | }; 21 | goog.inherits(chartEditor.ui.panel.axes.LinearGauge, chartEditor.ui.panel.axes.Linear); 22 | 23 | 24 | /** @override */ 25 | chartEditor.ui.panel.axes.LinearGauge.prototype.createDom = function() { 26 | chartEditor.ui.panel.axes.LinearGauge.base(this, 'createDom'); 27 | 28 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 29 | 30 | var offset = new chartEditor.ui.control.comboBox.Percent(); 31 | offset.allowNegative(true); 32 | var offsetLC = new chartEditor.ui.control.wrapped.Labeled(offset, 'Offset'); 33 | offsetLC.init(model, this.genKey('offset()'), void 0, true); 34 | this.addChildControl(offsetLC, 1); 35 | }; 36 | -------------------------------------------------------------------------------- /src/ui/panel/axes/Radar.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.axes.Radar'); 2 | 3 | goog.require('chartEditor.ui.PanelZippy'); 4 | goog.require('chartEditor.ui.control.select.Scales'); 5 | goog.require('chartEditor.ui.panel.Labels'); 6 | goog.require('chartEditor.ui.panel.Ticks'); 7 | 8 | 9 | /** 10 | * @param {chartEditor.model.Base} model 11 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 12 | * @constructor 13 | * @extends {chartEditor.ui.PanelZippy} 14 | */ 15 | chartEditor.ui.panel.axes.Radar = function(model, opt_domHelper) { 16 | chartEditor.ui.panel.axes.Radar.base(this, 'constructor', model, 0, 'Enabled', opt_domHelper); 17 | 18 | this.key = [['chart'], ['settings'], 'xAxis()']; 19 | 20 | this.allowEnabled(true); 21 | 22 | this.addClassName(goog.getCssName('anychart-ce-panel-axis-radar')); 23 | }; 24 | goog.inherits(chartEditor.ui.panel.axes.Radar, chartEditor.ui.PanelZippy); 25 | 26 | 27 | /** @override */ 28 | chartEditor.ui.panel.axes.Radar.prototype.createDom = function() { 29 | chartEditor.ui.panel.axes.Radar.base(this, 'createDom'); 30 | 31 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 32 | 33 | var scale = new chartEditor.ui.control.select.Scales({label: 'Scale'}); 34 | scale.init(model, this.genKey('scale()'), void 0, true); 35 | this.addChildControl(scale); 36 | 37 | this.addContentSeparator(); 38 | 39 | //region Labels 40 | var labels = new chartEditor.ui.panel.Labels(model); 41 | labels.allowEnabled(true); 42 | labels.allowEditPosition(false); 43 | labels.allowEditAnchor(false); 44 | labels.setKey(this.genKey('labels()')); 45 | this.addChildControl(labels); 46 | 47 | this.addContentSeparator(); 48 | 49 | // Ticks 50 | var ticks = new chartEditor.ui.panel.Ticks(model); 51 | ticks.allowEnabled(true); 52 | ticks.allowEditPosition(false); 53 | ticks.setKey(this.genKey('ticks()')); 54 | this.addChildControl(ticks); 55 | //endregion 56 | }; 57 | -------------------------------------------------------------------------------- /src/ui/panel/ganttProject/Buttons.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.ganttProject.Button'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.colorPicker.Base'); 5 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 6 | goog.require('chartEditor.ui.control.input.Base'); 7 | goog.require('chartEditor.ui.panel.Font'); 8 | goog.require('chartEditor.ui.panel.Stroke'); 9 | 10 | 11 | 12 | /** 13 | * @param {chartEditor.model.Base} model 14 | * @param {string=} opt_name 15 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 16 | * @constructor 17 | * @extends {chartEditor.ui.Panel} 18 | */ 19 | chartEditor.ui.panel.ganttProject.Button = function(model, opt_name, opt_domHelper) { 20 | chartEditor.ui.panel.ganttProject.Button.base(this, 'constructor', model, opt_name, opt_domHelper); 21 | this.allowEnabled(true); 22 | this.addClassName(goog.getCssName('anychart-ce-panel-level-wrapper')); 23 | }; 24 | goog.inherits(chartEditor.ui.panel.ganttProject.Button, chartEditor.ui.Panel); 25 | 26 | 27 | /** @override */ 28 | chartEditor.ui.panel.ganttProject.Button.prototype.createDom = function() { 29 | chartEditor.ui.panel.ganttProject.Button.base(this, 'createDom'); 30 | 31 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 32 | 33 | var labels = new chartEditor.ui.panel.Font(model); 34 | labels.setKey(this.genKey('labels()')); 35 | this.addChildControl(labels); 36 | 37 | var depthPaddingMultiplier = new chartEditor.ui.control.input.Base(); 38 | var depthPaddingMultiplierLC = new chartEditor.ui.control.wrapped.Labeled(depthPaddingMultiplier, 'Content'); 39 | depthPaddingMultiplierLC.init(model, this.genKey('content()')); 40 | this.addChildControl(depthPaddingMultiplierLC); 41 | 42 | var colorPicker = new chartEditor.ui.control.colorPicker.Base(); 43 | colorPicker.addClassName(goog.getCssName('background')); 44 | colorPicker.init(model, this.genKey('fontColor()')); 45 | this.addChildControl(colorPicker); 46 | }; 47 | -------------------------------------------------------------------------------- /src/ui/panel/ganttProject/Column.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.ganttProject.Column'); 2 | 3 | goog.require('chartEditor.ui.PanelZippy'); 4 | goog.require('chartEditor.ui.control.colorPicker.Base'); 5 | goog.require('chartEditor.ui.control.input.Base'); 6 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 7 | goog.require('chartEditor.ui.panel.Font'); 8 | goog.require('chartEditor.ui.panel.Title'); 9 | 10 | 11 | 12 | /** 13 | * @param {chartEditor.model.Base} model 14 | * @param {number} index index of level. 15 | * @param {string=} opt_name 16 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 17 | * @constructor 18 | * @extends {chartEditor.ui.PanelZippy} 19 | */ 20 | chartEditor.ui.panel.ganttProject.Column = function(model, index, opt_name, opt_domHelper) { 21 | chartEditor.ui.panel.ganttProject.Column.base(this, 'constructor', model, index, opt_name || 'Column ' + (index + 1), opt_domHelper); 22 | this.setKey([['chart'], ['settings'], 'dataGrid().column(' + this.index_ + ')']); 23 | this.allowRemove(true); 24 | this.allowEnabled(true); 25 | this.allowReset(true); 26 | this.addClassName(goog.getCssName('anychart-ce-panel-gantt-column')); 27 | }; 28 | goog.inherits(chartEditor.ui.panel.ganttProject.Column, chartEditor.ui.PanelZippy); 29 | 30 | /** @override */ 31 | chartEditor.ui.panel.ganttProject.Column.prototype.createDom = function() { 32 | chartEditor.ui.panel.ganttProject.Column.base(this, 'createDom'); 33 | 34 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 35 | 36 | var title = new chartEditor.ui.panel.Title(model, 'Title'); 37 | title.allowEditPosition(false); 38 | title.setKey(this.genKey('title()')); 39 | this.addChildControl(title); 40 | 41 | var labels = new chartEditor.ui.panel.Font(model); 42 | labels.setKey(this.genKey('labels()')); 43 | this.addChildControl(labels); 44 | 45 | var format = new chartEditor.ui.control.input.Base(); 46 | var formatLC = new chartEditor.ui.control.wrapped.Labeled(format, 'Format'); 47 | formatLC.init(model, this.genKey('labels().format()')); 48 | this.addChildControl(formatLC); 49 | 50 | var depthPaddingMultiplier = new chartEditor.ui.control.input.Base(); 51 | var depthPaddingMultiplierLC = new chartEditor.ui.control.wrapped.Labeled(depthPaddingMultiplier, 'Depth padding multiplier'); 52 | depthPaddingMultiplierLC.init(model, this.genKey('depthPaddingMultiplier()')); 53 | this.addChildControl(depthPaddingMultiplierLC); 54 | }; 55 | -------------------------------------------------------------------------------- /src/ui/panel/ganttProject/DataGrid.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.ganttProject.DataGrid'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.panel.ganttProject.Button'); 5 | goog.require('chartEditor.ui.panel.ganttProject.Column'); 6 | 7 | 8 | 9 | 10 | /** 11 | * @param {chartEditor.model.Base} model 12 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 13 | * @constructor 14 | * @extends {chartEditor.ui.Panel} 15 | */ 16 | chartEditor.ui.panel.ganttProject.DataGrid = function(model, opt_domHelper) { 17 | chartEditor.ui.panel.ganttProject.DataGrid.base(this, 'constructor', model, '', opt_domHelper); 18 | this.allowEnabled(false); 19 | this.addClassName(goog.getCssName('anychart-ce-panel-gantt-datagrid')); 20 | }; 21 | goog.inherits(chartEditor.ui.panel.ganttProject.DataGrid, chartEditor.ui.Panel); 22 | 23 | 24 | /** @override */ 25 | chartEditor.ui.panel.ganttProject.DataGrid.prototype.createDom = function() { 26 | chartEditor.ui.panel.ganttProject.DataGrid.base(this, 'createDom'); 27 | 28 | var model = /**@type {chartEditor.model.Base}*/(this.getModel()); 29 | var column = new chartEditor.ui.panel.ganttProject.Column(model, 1); 30 | column.setKey(this.genKey('column(1)')); 31 | this.addChildControl(column); 32 | 33 | var buttons = new chartEditor.ui.panel.ganttProject.Button(model, 'Buttons'); 34 | buttons.setKey(this.genKey('buttons()')); 35 | this.addChildControl(buttons); 36 | }; 37 | -------------------------------------------------------------------------------- /src/ui/panel/ganttProject/LevelWrapper.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.ganttProject.LevelWrapper'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.colorPicker.Base'); 5 | goog.require('chartEditor.ui.control.input.Base'); 6 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 7 | goog.require('chartEditor.ui.panel.Font'); 8 | goog.require('chartEditor.ui.panel.Stroke'); 9 | 10 | 11 | 12 | /** 13 | * @param {chartEditor.model.Base} model 14 | * @param {number=} opt_index index of level. 15 | * @param {string=} opt_name 16 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 17 | * @constructor 18 | * @extends {chartEditor.ui.Panel} 19 | */ 20 | chartEditor.ui.panel.ganttProject.LevelWrapper = function(model, opt_index, opt_name, opt_domHelper) { 21 | chartEditor.ui.panel.ganttProject.LevelWrapper.base(this, 'constructor', model, opt_name || 'Level ' + (opt_index + 1), opt_domHelper); 22 | this.index_ = opt_index; 23 | 24 | this.allowEnabled(true); 25 | 26 | this.allowReset(true); 27 | 28 | this.addClassName(goog.getCssName('anychart-ce-panel-level-wrapper')); 29 | }; 30 | goog.inherits(chartEditor.ui.panel.ganttProject.LevelWrapper, chartEditor.ui.Panel); 31 | 32 | 33 | /** @override */ 34 | chartEditor.ui.panel.ganttProject.LevelWrapper.prototype.createDom = function() { 35 | chartEditor.ui.panel.ganttProject.LevelWrapper.base(this, 'createDom'); 36 | 37 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 38 | 39 | var stroke = new chartEditor.ui.panel.Stroke(model); 40 | stroke.setKey(this.genKey('stroke()')); 41 | this.addChildControl(stroke); 42 | 43 | var fill = new chartEditor.ui.control.colorPicker.Base(); 44 | var fillLC = new chartEditor.ui.control.wrapped.Labeled(fill, 'Fill'); 45 | fillLC.init(model, this.genKey('fill()')); 46 | this.addChildControl(fillLC); 47 | 48 | var font = new chartEditor.ui.panel.Font(model); 49 | font.setKey(this.getKey()); 50 | this.addChildControl(font); 51 | 52 | var format = new chartEditor.ui.control.input.Base(); 53 | var formatLC = new chartEditor.ui.control.wrapped.Labeled(format, 'Format', true); 54 | formatLC.init(model, this.genKey('format()')); 55 | this.addChildControl(formatLC); 56 | 57 | // Not implemented 58 | // Advanced Text Settings 59 | // maxFontSize() Maximum font size panel. 60 | // minFontSize() Minimum font size panel. 61 | }; 62 | -------------------------------------------------------------------------------- /src/ui/panel/ganttProject/Tooltip.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.ganttProject.Tooltip'); 2 | 3 | goog.require('chartEditor.ui.PanelZippy'); 4 | goog.require('chartEditor.ui.panel.Tooltip'); 5 | 6 | 7 | 8 | /** 9 | * @param {chartEditor.model.Base} model 10 | * @param {string=} opt_name 11 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 12 | * @constructor 13 | * @extends {chartEditor.ui.PanelZippy} 14 | */ 15 | chartEditor.ui.panel.ganttProject.Tooltip = function(model, opt_name, opt_domHelper) { 16 | chartEditor.ui.panel.ganttProject.Tooltip.base(this, 'constructor', model, -1, opt_name, opt_domHelper); 17 | 18 | this.allowEnabled(true); 19 | this.allowReset(true); 20 | }; 21 | goog.inherits(chartEditor.ui.panel.ganttProject.Tooltip, chartEditor.ui.PanelZippy); 22 | 23 | 24 | 25 | /** @override */ 26 | chartEditor.ui.panel.ganttProject.Tooltip.prototype.createDom = function() { 27 | chartEditor.ui.panel.ganttProject.Tooltip.base(this, 'createDom'); 28 | 29 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 30 | var tooltip = new chartEditor.ui.panel.Tooltip(model); 31 | tooltip.setKey(this.getKey()); 32 | tooltip.setName(null); 33 | tooltip.allowEnabled(false); 34 | tooltip.allowReset(false); 35 | tooltip.allowEditDisplayMode(false); 36 | tooltip.allowEditPositionMode(false); 37 | this.addChildControl(tooltip); 38 | }; 39 | -------------------------------------------------------------------------------- /src/ui/panel/ganttProject/elements/Connectors.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.ganttProject.elements.Connectors'); 2 | 3 | goog.require('chartEditor.ui.PanelZippy'); 4 | goog.require('chartEditor.ui.control.colorPicker.Base'); 5 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 6 | goog.require('chartEditor.ui.panel.Stroke'); 7 | 8 | 9 | 10 | /** 11 | * @param {chartEditor.model.Base} model 12 | * @param {string=} opt_name 13 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 14 | * @constructor 15 | * @extends {chartEditor.ui.PanelZippy} 16 | */ 17 | chartEditor.ui.panel.ganttProject.elements.Connectors = function(model, opt_name, opt_domHelper) { 18 | chartEditor.ui.panel.ganttProject.elements.Connectors.base(this, 'constructor', model, -1, opt_name, opt_domHelper); 19 | 20 | this.allowReset(true); 21 | this.allowEnabled(false); 22 | }; 23 | goog.inherits(chartEditor.ui.panel.ganttProject.elements.Connectors, chartEditor.ui.PanelZippy); 24 | 25 | 26 | 27 | /** @override */ 28 | chartEditor.ui.panel.ganttProject.elements.Connectors.prototype.createDom = function() { 29 | chartEditor.ui.panel.ganttProject.elements.Connectors.base(this, 'createDom'); 30 | 31 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 32 | 33 | var stroke = new chartEditor.ui.panel.Stroke(model); 34 | stroke.setKey(this.genKey('stroke()')); 35 | this.addChildControl(stroke); 36 | 37 | var fill = new chartEditor.ui.control.colorPicker.Base(); 38 | var fillLC = new chartEditor.ui.control.wrapped.Labeled(fill, 'Fill'); 39 | fillLC.init(model, this.genKey('fill()')); 40 | this.addChildControl(fillLC); 41 | }; 42 | -------------------------------------------------------------------------------- /src/ui/panel/pointers/Bar.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.pointers.Bar'); 2 | 3 | goog.require('chartEditor.ui.control.comboBox.Percent'); 4 | goog.require('chartEditor.ui.control.fieldSelect.Base'); 5 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 6 | goog.require('chartEditor.ui.panel.pointers.CircularBase'); 7 | 8 | 9 | 10 | /** 11 | * @param {chartEditor.model.Base} model 12 | * @param {string} type 13 | * @param {string|number} pointerId 14 | * @param {number} pointerIndex 15 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 16 | * @constructor 17 | * @extends {chartEditor.ui.panel.pointers.CircularBase} 18 | */ 19 | chartEditor.ui.panel.pointers.Bar = function(model, type, pointerId, pointerIndex, opt_domHelper) { 20 | chartEditor.ui.panel.pointers.Bar.base(this, 'constructor', model, type, pointerId, pointerIndex, opt_domHelper); 21 | 22 | this.addClassName(goog.getCssName('anychart-ce-panel-pointer-bar')); 23 | }; 24 | goog.inherits(chartEditor.ui.panel.pointers.Bar, chartEditor.ui.panel.pointers.CircularBase); 25 | 26 | 27 | /** @override */ 28 | chartEditor.ui.panel.pointers.Bar.prototype.createDom = function() { 29 | chartEditor.ui.panel.pointers.Bar.base(this, 'createDom'); 30 | 31 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 32 | 33 | var position = new chartEditor.ui.control.fieldSelect.Base({label: 'Position'}); 34 | position.getSelect().setOptions(goog.object.getValues(chartEditor.enums.GaugeSidePosition)); 35 | position.init(model, this.genKey('position()')); 36 | this.addChildControl(position); 37 | 38 | var radius = new chartEditor.ui.control.comboBox.Percent(); 39 | radius.setOptions([10, 30, 50, 70, 90, 100]); 40 | var radiusLC = new chartEditor.ui.control.wrapped.Labeled(radius, 'Radius'); 41 | radiusLC.init(model, this.genKey('radius()')); 42 | this.addChildControl(radiusLC); 43 | 44 | var width = new chartEditor.ui.control.comboBox.Percent(); 45 | width.setOptions([0, 1, 3, 5, 10, 20]); 46 | var widthLC = new chartEditor.ui.control.wrapped.Labeled(width, 'Width'); 47 | widthLC.init(model, this.genKey('width()')); 48 | this.addChildControl(widthLC); 49 | }; 50 | -------------------------------------------------------------------------------- /src/ui/panel/pointers/Led.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.pointers.Led'); 2 | 3 | goog.require('chartEditor.ui.control.comboBox.Percent'); 4 | goog.require('chartEditor.ui.control.fieldSelect.Base'); 5 | goog.require('chartEditor.ui.control.input.Numbers'); 6 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 7 | goog.require('chartEditor.ui.panel.pointers.LinearBase'); 8 | goog.require('chartEditor.ui.panel.scales.Base'); 9 | 10 | 11 | 12 | /** 13 | * @param {chartEditor.model.Base} model 14 | * @param {string} type 15 | * @param {string|number} pointerId 16 | * @param {number} pointerIndex 17 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 18 | * @constructor 19 | * @extends {chartEditor.ui.panel.pointers.LinearBase} 20 | */ 21 | chartEditor.ui.panel.pointers.Led = function(model, type, pointerId, pointerIndex, opt_domHelper) { 22 | chartEditor.ui.panel.pointers.Led.base(this, 'constructor', model, type, pointerId, pointerIndex, opt_domHelper); 23 | 24 | this.skipSettings(['fill()', 'stroke()']); 25 | 26 | this.addClassName(goog.getCssName('anychart-ce-panel-pointer-led')); 27 | }; 28 | goog.inherits(chartEditor.ui.panel.pointers.Led, chartEditor.ui.panel.pointers.LinearBase); 29 | 30 | 31 | /** @override */ 32 | chartEditor.ui.panel.pointers.Led.prototype.createDom = function() { 33 | chartEditor.ui.panel.pointers.Led.base(this, 'createDom'); 34 | 35 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 36 | 37 | this.addContentSeparator(); 38 | 39 | var count = new chartEditor.ui.control.input.Numbers(); 40 | var countLC = new chartEditor.ui.control.wrapped.Labeled(count, 'Count'); 41 | countLC.init(model, this.genKey('count()')); 42 | this.addChildControl(countLC); 43 | 44 | var gap = new chartEditor.ui.control.comboBox.Percent(); 45 | gap.setOptions([1,2,3,5,7,10]); 46 | var gapLC = new chartEditor.ui.control.wrapped.Labeled(gap, 'Gap'); 47 | gapLC.init(model, this.genKey('gap()')); 48 | this.addChildControl(gapLC); 49 | 50 | var size = new chartEditor.ui.control.comboBox.Percent(); 51 | size.setOptions([1,2,3,5,7,10]); 52 | var sizeLC = new chartEditor.ui.control.wrapped.Labeled(size, 'Size'); 53 | sizeLC.init(model, this.genKey('size()')); 54 | this.addChildControl(sizeLC); 55 | 56 | this.addContentSeparator(); 57 | 58 | var colorScale = new chartEditor.ui.panel.scales.Base(model, ['linear-color', 'ordinal-color']); 59 | colorScale.setKey(this.genKey('colorScale()')); 60 | this.addChildControl(colorScale); 61 | }; 62 | -------------------------------------------------------------------------------- /src/ui/panel/pointers/LinearMarker.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.pointers.LinearMarker'); 2 | 3 | goog.require('chartEditor.ui.control.fieldSelect.Base'); 4 | goog.require('chartEditor.ui.panel.pointers.LinearBase'); 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {string} type 10 | * @param {string|number} pointerId 11 | * @param {number} pointerIndex 12 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 13 | * @constructor 14 | * @extends {chartEditor.ui.panel.pointers.LinearBase} 15 | */ 16 | chartEditor.ui.panel.pointers.LinearMarker = function(model, type, pointerId, pointerIndex, opt_domHelper) { 17 | chartEditor.ui.panel.pointers.LinearMarker.base(this, 'constructor', model, type, pointerId, pointerIndex, opt_domHelper); 18 | 19 | this.addClassName(goog.getCssName('anychart-ce-panel-pointer-marker')); 20 | }; 21 | goog.inherits(chartEditor.ui.panel.pointers.LinearMarker, chartEditor.ui.panel.pointers.LinearBase); 22 | 23 | 24 | /** @override */ 25 | chartEditor.ui.panel.pointers.LinearMarker.prototype.createDom = function() { 26 | chartEditor.ui.panel.pointers.LinearMarker.base(this, 'createDom'); 27 | 28 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 29 | 30 | this.addContentSeparator(); 31 | 32 | var type = new chartEditor.ui.control.fieldSelect.Base({label: 'Type'}); 33 | type.getSelect().setOptions(goog.object.getValues(chartEditor.enums.MarkerType)); 34 | type.init(model, this.genKey('type()')); 35 | this.addChildControl(type); 36 | }; 37 | -------------------------------------------------------------------------------- /src/ui/panel/pointers/Marker.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.pointers.Marker'); 2 | 3 | goog.require('chartEditor.ui.control.comboBox.Percent'); 4 | goog.require('chartEditor.ui.control.fieldSelect.Base'); 5 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 6 | goog.require('chartEditor.ui.panel.pointers.CircularBase'); 7 | 8 | 9 | 10 | /** 11 | * @param {chartEditor.model.Base} model 12 | * @param {string} type 13 | * @param {string|number} pointerId 14 | * @param {number} pointerIndex 15 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 16 | * @constructor 17 | * @extends {chartEditor.ui.panel.pointers.CircularBase} 18 | */ 19 | chartEditor.ui.panel.pointers.Marker = function(model, type, pointerId, pointerIndex, opt_domHelper) { 20 | chartEditor.ui.panel.pointers.Marker.base(this, 'constructor', model, type, pointerId, pointerIndex, opt_domHelper); 21 | 22 | this.addClassName(goog.getCssName('anychart-ce-panel-pointer-marker')); 23 | }; 24 | goog.inherits(chartEditor.ui.panel.pointers.Marker, chartEditor.ui.panel.pointers.CircularBase); 25 | 26 | 27 | /** @override */ 28 | chartEditor.ui.panel.pointers.Marker.prototype.createDom = function() { 29 | chartEditor.ui.panel.pointers.Marker.base(this, 'createDom'); 30 | 31 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 32 | 33 | var type = new chartEditor.ui.control.fieldSelect.Base({label: 'Type'}); 34 | type.getSelect().setOptions(goog.object.getValues(chartEditor.enums.MarkerType)); 35 | type.init(model, this.genKey('type()')); 36 | this.addChildControl(type); 37 | 38 | var position = new chartEditor.ui.control.fieldSelect.Base({label: 'Position'}); 39 | position.getSelect().setOptions(goog.object.getValues(chartEditor.enums.GaugeSidePosition)); 40 | position.init(model, this.genKey('position()')); 41 | this.addChildControl(position); 42 | 43 | var radius = new chartEditor.ui.control.comboBox.Percent(); 44 | radius.setOptions([10, 30, 50, 70, 90, 100]); 45 | var radiusLC = new chartEditor.ui.control.wrapped.Labeled(radius, 'Radius'); 46 | radiusLC.init(model, this.genKey('radius()')); 47 | this.addChildControl(radiusLC); 48 | 49 | var size = new chartEditor.ui.control.comboBox.Percent(); 50 | size.setOptions([2, 5, 10, 15, 20]); 51 | var sizeLC = new chartEditor.ui.control.wrapped.Labeled(size, 'Size'); 52 | sizeLC.init(model, this.genKey('size()')); 53 | this.addChildControl(sizeLC); 54 | }; 55 | -------------------------------------------------------------------------------- /src/ui/panel/pointers/RangeBar.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.pointers.RangeBar'); 2 | 3 | goog.require('chartEditor.ui.panel.pointers.LinearBase'); 4 | 5 | 6 | /** 7 | * @param {chartEditor.model.Base} model 8 | * @param {string} type 9 | * @param {string|number} pointerId 10 | * @param {number} pointerIndex 11 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 12 | * @constructor 13 | * @extends {chartEditor.ui.panel.pointers.LinearBase} 14 | */ 15 | chartEditor.ui.panel.pointers.RangeBar = function(model, type, pointerId, pointerIndex, opt_domHelper) { 16 | chartEditor.ui.panel.pointers.RangeBar.base(this, 'constructor', model, type, pointerId, pointerIndex, opt_domHelper); 17 | 18 | this.addClassName(goog.getCssName('anychart-ce-panel-pointer-range-bar')); 19 | }; 20 | goog.inherits(chartEditor.ui.panel.pointers.RangeBar, chartEditor.ui.panel.pointers.LinearBase); 21 | -------------------------------------------------------------------------------- /src/ui/panel/pointers/Tank.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.pointers.Tank'); 2 | 3 | goog.require('chartEditor.ui.control.colorPicker.Base'); 4 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 5 | goog.require('chartEditor.ui.panel.pointers.LinearBase'); 6 | 7 | 8 | /** 9 | * @param {chartEditor.model.Base} model 10 | * @param {string} type 11 | * @param {string|number} pointerId 12 | * @param {number} pointerIndex 13 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 14 | * @constructor 15 | * @extends {chartEditor.ui.panel.pointers.LinearBase} 16 | */ 17 | chartEditor.ui.panel.pointers.Tank = function(model, type, pointerId, pointerIndex, opt_domHelper) { 18 | chartEditor.ui.panel.pointers.Tank.base(this, 'constructor', model, type, pointerId, pointerIndex, opt_domHelper); 19 | 20 | this.skipSettings(['stroke()']); 21 | 22 | this.addClassName(goog.getCssName('anychart-ce-panel-pointer-tank')); 23 | }; 24 | goog.inherits(chartEditor.ui.panel.pointers.Tank, chartEditor.ui.panel.pointers.LinearBase); 25 | 26 | 27 | /** @override */ 28 | chartEditor.ui.panel.pointers.Tank.prototype.createDom = function() { 29 | chartEditor.ui.panel.pointers.Tank.base(this, 'createDom'); 30 | 31 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 32 | 33 | this.addContentSeparator(); 34 | 35 | var emptyFill = new chartEditor.ui.control.colorPicker.Base(); 36 | var emptyFillLC = new chartEditor.ui.control.wrapped.Labeled(emptyFill, 'Empty Fill'); 37 | emptyFillLC.init(model, this.genKey('emptyFill()')); 38 | this.addChildControl(emptyFillLC); 39 | }; 40 | -------------------------------------------------------------------------------- /src/ui/panel/pointers/Thermometer.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.pointers.Thermometer'); 2 | 3 | goog.require('chartEditor.ui.control.comboBox.Percent'); 4 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 5 | goog.require('chartEditor.ui.panel.pointers.LinearBase'); 6 | 7 | 8 | /** 9 | * @param {chartEditor.model.Base} model 10 | * @param {string} type 11 | * @param {string|number} pointerId 12 | * @param {number} pointerIndex 13 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 14 | * @constructor 15 | * @extends {chartEditor.ui.panel.pointers.LinearBase} 16 | */ 17 | chartEditor.ui.panel.pointers.Thermometer = function(model, type, pointerId, pointerIndex, opt_domHelper) { 18 | chartEditor.ui.panel.pointers.Thermometer.base(this, 'constructor', model, type, pointerId, pointerIndex, opt_domHelper); 19 | 20 | this.addClassName(goog.getCssName('anychart-ce-panel-pointer-thermometer')); 21 | }; 22 | goog.inherits(chartEditor.ui.panel.pointers.Thermometer, chartEditor.ui.panel.pointers.LinearBase); 23 | 24 | 25 | /** @override */ 26 | chartEditor.ui.panel.pointers.Thermometer.prototype.createDom = function() { 27 | chartEditor.ui.panel.pointers.Thermometer.base(this, 'createDom'); 28 | 29 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 30 | 31 | this.addContentSeparator(); 32 | 33 | var bulbRadius = new chartEditor.ui.control.comboBox.Percent(); 34 | bulbRadius.allowNegative(true); 35 | bulbRadius.setOptions([0, 1, 3, 5, 10, 15, 20, 30]); 36 | var bulbRadiusLC = new chartEditor.ui.control.wrapped.Labeled(bulbRadius, 'Bulb Radius'); 37 | bulbRadiusLC.init(model, this.genKey('bulbRadius()')); 38 | this.addChildControl(bulbRadiusLC); 39 | 40 | var bulbPadding = new chartEditor.ui.control.comboBox.Percent(); 41 | bulbPadding.setOptions([0, 1, 3, 5, 10, 15]); 42 | var bulbPaddingLC = new chartEditor.ui.control.wrapped.Labeled(bulbPadding, 'Bulb Padding'); 43 | bulbPaddingLC.init(model, this.genKey('bulbPadding()')); 44 | this.addChildControl(bulbPaddingLC); 45 | }; 46 | -------------------------------------------------------------------------------- /src/ui/panel/scales/DateTimeTicks.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.scales.DateTimeTicks'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.input.Numbers'); 5 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 6 | 7 | 8 | 9 | /** 10 | * @param {chartEditor.model.Base} model 11 | * @param {?string=} opt_name 12 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 13 | * @constructor 14 | * @extends {chartEditor.ui.Panel} 15 | */ 16 | chartEditor.ui.panel.scales.DateTimeTicks = function(model, opt_name, opt_domHelper) { 17 | chartEditor.ui.panel.scales.DateTimeTicks.base(this, 'constructor', model, opt_name, opt_domHelper); 18 | }; 19 | goog.inherits(chartEditor.ui.panel.scales.DateTimeTicks, chartEditor.ui.Panel); 20 | 21 | 22 | /** @override */ 23 | chartEditor.ui.panel.scales.DateTimeTicks.prototype.createDom = function() { 24 | chartEditor.ui.panel.scales.DateTimeTicks.base(this, 'createDom'); 25 | 26 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 27 | 28 | var count = new chartEditor.ui.control.input.Numbers(); 29 | count.setFormatterFunction(function(value){ 30 | return String(goog.isArray(value) ? Number(value[0]) : Number(value)); 31 | }); 32 | var countLC = new chartEditor.ui.control.wrapped.Labeled(count, 'Count'); 33 | countLC.init(model, this.genKey('count()')); 34 | this.addChildControl(countLC); 35 | 36 | // var interval = new chartEditor.ui.control.input.Numbers(); 37 | // var intervalLC = new chartEditor.ui.control.wrapped.Labeled(interval, 'Interval'); 38 | // intervalLC.init(model, this.genKey('interval()')); 39 | // this.addChildControl(intervalLC); 40 | }; 41 | -------------------------------------------------------------------------------- /src/ui/panel/scales/LinearColor.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.scales.LinearColor'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.input.Palette'); 5 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 6 | 7 | 8 | 9 | /** 10 | * @param {chartEditor.model.Base} model 11 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 12 | * @constructor 13 | * @extends {chartEditor.ui.Panel} 14 | */ 15 | chartEditor.ui.panel.scales.LinearColor = function(model, opt_domHelper) { 16 | chartEditor.ui.panel.scales.LinearColor.base(this, 'constructor', model, null, opt_domHelper); 17 | 18 | this.allowEnabled(false); 19 | }; 20 | goog.inherits(chartEditor.ui.panel.scales.LinearColor, chartEditor.ui.Panel); 21 | 22 | 23 | /** @override */ 24 | chartEditor.ui.panel.scales.LinearColor.prototype.createDom = function() { 25 | chartEditor.ui.panel.scales.LinearColor.base(this, 'createDom'); 26 | 27 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 28 | var colors = new chartEditor.ui.control.input.Palette('Comma separated colors'); 29 | this.colors_ = new chartEditor.ui.control.wrapped.Labeled(colors, 'Palette'); 30 | this.colors_.init(model, this.genKey('colors', true), void 0, true); 31 | this.addChild(this.colors_, true); 32 | }; 33 | 34 | 35 | /** @inheritDoc */ 36 | chartEditor.ui.panel.scales.LinearColor.prototype.onChartDraw = function(evt) { 37 | chartEditor.ui.panel.scales.LinearColor.base(this, 'onChartDraw', evt); 38 | 39 | if (!this.isExcluded()) { 40 | var target; 41 | if (this.key[0] && this.key[0][0] == 'standalones') { 42 | var key = this.genKey(); 43 | key.pop(); // pop 'panel' 44 | key.push('instance'); 45 | 46 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 47 | target = /** @type {Object} */(model.getValue(key)); 48 | } else 49 | target = evt.chart; 50 | 51 | var stringKey = chartEditor.model.Base.getStringKey(this.key); 52 | var scale = /** @type {Object} */(chartEditor.binding.exec(target, stringKey)); 53 | 54 | if (scale && this.colors_) { 55 | var colors = scale['colors'](); 56 | this.colors_.getControl().setValueByColors(colors); 57 | } 58 | } 59 | }; 60 | 61 | 62 | /** @override */ 63 | chartEditor.ui.panel.scales.LinearColor.prototype.disposeInternal = function() { 64 | goog.dispose(this.colors_); 65 | this.colors_ = null; 66 | chartEditor.ui.panel.scales.LinearColor.base(this, 'disposeInternal'); 67 | }; 68 | -------------------------------------------------------------------------------- /src/ui/panel/scales/Logarithmic.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.scales.Logarithmic'); 2 | 3 | goog.require('chartEditor.ui.panel.scales.Linear'); 4 | 5 | 6 | /** 7 | * @param {chartEditor.model.Base} model 8 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 9 | * @constructor 10 | * @extends {chartEditor.ui.panel.scales.Linear} 11 | */ 12 | chartEditor.ui.panel.scales.Logarithmic = function(model, opt_domHelper) { 13 | chartEditor.ui.panel.scales.Logarithmic.base(this, 'constructor', model, opt_domHelper); 14 | }; 15 | goog.inherits(chartEditor.ui.panel.scales.Logarithmic, chartEditor.ui.panel.scales.Linear); 16 | 17 | 18 | // /** @override */ 19 | // chartEditor.panel.scales.Logarithmic.prototype.createDom = function() { 20 | // chartEditor.panel.scales.Logarithmic.base(this, 'createDom'); 21 | // 22 | // // var model = /** @type {chartEditor.model.Base} */(this.getModel()); 23 | // // var logBase = new chartEditor.ui.control.input.Base(); 24 | // // var logBaseLC = new chartEditor.ui.control.wrapped.Labeled(logBase, 'Log Base'); 25 | // // logBaseLC.init(model, this.genKey('logBase()')); 26 | // // this.addChildControl(logBaseLC); 27 | // }; 28 | -------------------------------------------------------------------------------- /src/ui/panel/scales/Ordinal.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.scales.Ordinal'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.checkbox.Base'); 5 | goog.require('chartEditor.ui.control.input.StringArray'); 6 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 7 | goog.require('chartEditor.ui.panel.scales.OrdinalTicks'); 8 | 9 | 10 | 11 | /** 12 | * @param {chartEditor.model.Base} model 13 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 14 | * @constructor 15 | * @extends {chartEditor.ui.Panel} 16 | */ 17 | chartEditor.ui.panel.scales.Ordinal = function(model, opt_domHelper) { 18 | chartEditor.ui.panel.scales.Ordinal.base(this, 'constructor', model, null, opt_domHelper); 19 | 20 | this.allowEnabled(false); 21 | }; 22 | goog.inherits(chartEditor.ui.panel.scales.Ordinal, chartEditor.ui.Panel); 23 | 24 | 25 | /** @override */ 26 | chartEditor.ui.panel.scales.Ordinal.prototype.createDom = function() { 27 | chartEditor.ui.panel.scales.Ordinal.base(this, 'createDom'); 28 | 29 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 30 | 31 | var inverted = new chartEditor.ui.control.checkbox.Base(); 32 | inverted.setCaption('Inverted'); 33 | inverted.init(model, this.genKey('inverted()')); 34 | this.addChildControl(inverted); 35 | 36 | var names = new chartEditor.ui.control.input.StringArray(); 37 | var namesLC = new chartEditor.ui.control.wrapped.Labeled(names, 'Names'); 38 | namesLC.init(model, this.genKey('names()')); 39 | this.addChildControl(namesLC); 40 | 41 | var weights = new chartEditor.ui.control.input.StringArray(); 42 | var weightsLC = new chartEditor.ui.control.wrapped.Labeled(weights, 'Weights'); 43 | weightsLC.init(model, this.genKey('weights()')); 44 | this.addChildControl(weightsLC); 45 | 46 | this.addContentSeparator(); 47 | 48 | var ticks = new chartEditor.ui.panel.scales.OrdinalTicks(model, 'Ticks'); 49 | ticks.allowEnabled(false); 50 | ticks.setKey(this.genKey('ticks()')); 51 | this.addChildControl(ticks); 52 | }; 53 | -------------------------------------------------------------------------------- /src/ui/panel/scales/OrdinalColor.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.scales.OrdinalColor'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.input.Palette'); 5 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 6 | goog.require('chartEditor.ui.panel.scales.Ranges'); 7 | 8 | 9 | 10 | /** 11 | * @param {chartEditor.model.Base} model 12 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 13 | * @constructor 14 | * @extends {chartEditor.ui.Panel} 15 | */ 16 | chartEditor.ui.panel.scales.OrdinalColor = function(model, opt_domHelper) { 17 | chartEditor.ui.panel.scales.OrdinalColor.base(this, 'constructor', model, null, opt_domHelper); 18 | 19 | this.allowEnabled(false); 20 | 21 | this.addClassName(goog.getCssName('anychart-ce-panel-scale-ordinal-color')); 22 | }; 23 | goog.inherits(chartEditor.ui.panel.scales.OrdinalColor, chartEditor.ui.Panel); 24 | 25 | 26 | /** @override */ 27 | chartEditor.ui.panel.scales.OrdinalColor.prototype.createDom = function() { 28 | chartEditor.ui.panel.scales.OrdinalColor.base(this, 'createDom'); 29 | 30 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 31 | 32 | var colors = new chartEditor.ui.control.input.Palette('Comma separated colors'); 33 | var colorsLC = new chartEditor.ui.control.wrapped.Labeled(colors, 'Colors'); 34 | colorsLC.init(model, this.genKey('colors()')); 35 | this.addChildControl(colorsLC); 36 | 37 | this.addContentSeparator(); 38 | 39 | var ord = new chartEditor.ui.panel.scales.Ranges(model); 40 | ord.setKey(this.getKey()); 41 | this.addChildControl(ord); 42 | }; 43 | 44 | 45 | -------------------------------------------------------------------------------- /src/ui/panel/scales/OrdinalTicks.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.scales.OrdinalTicks'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.input.Numbers'); 5 | goog.require('chartEditor.ui.control.input.StringArray'); 6 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 7 | 8 | 9 | 10 | /** 11 | * @param {chartEditor.model.Base} model 12 | * @param {?string=} opt_name 13 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 14 | * @constructor 15 | * @extends {chartEditor.ui.Panel} 16 | */ 17 | chartEditor.ui.panel.scales.OrdinalTicks = function(model, opt_name, opt_domHelper) { 18 | chartEditor.ui.panel.scales.OrdinalTicks.base(this, 'constructor', model, opt_name, opt_domHelper); 19 | 20 | this.allowReset(true); 21 | }; 22 | goog.inherits(chartEditor.ui.panel.scales.OrdinalTicks, chartEditor.ui.Panel); 23 | 24 | 25 | /** @override */ 26 | chartEditor.ui.panel.scales.OrdinalTicks.prototype.createDom = function() { 27 | chartEditor.ui.panel.scales.OrdinalTicks.base(this, 'createDom'); 28 | 29 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 30 | 31 | var names = new chartEditor.ui.control.input.StringArray(); 32 | var namesLC = new chartEditor.ui.control.wrapped.Labeled(names, 'Names'); 33 | namesLC.init(model, this.genKey('names()')); 34 | this.addChildControl(namesLC); 35 | 36 | var interval = new chartEditor.ui.control.input.Numbers(); 37 | var intervalLC = new chartEditor.ui.control.wrapped.Labeled(interval, 'Interval'); 38 | intervalLC.init(model, this.genKey('interval()')); 39 | this.addChildControl(intervalLC); 40 | 41 | var maxCount = new chartEditor.ui.control.input.Numbers(); 42 | var maxCountLC = new chartEditor.ui.control.wrapped.Labeled(maxCount, 'Max Count'); 43 | maxCountLC.init(model, this.genKey('maxCount()')); 44 | this.addChildControl(maxCountLC); 45 | }; 46 | -------------------------------------------------------------------------------- /src/ui/panel/scales/ScatterTicks.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.scales.ScatterTicks'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.input.Numbers'); 5 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 6 | 7 | 8 | 9 | /** 10 | * @param {chartEditor.model.Base} model 11 | * @param {?string=} opt_name 12 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 13 | * @constructor 14 | * @extends {chartEditor.ui.Panel} 15 | */ 16 | chartEditor.ui.panel.scales.ScatterTicks = function(model, opt_name, opt_domHelper) { 17 | chartEditor.ui.panel.scales.ScatterTicks.base(this, 'constructor', model, opt_name, opt_domHelper); 18 | 19 | this.allowReset(true); 20 | }; 21 | goog.inherits(chartEditor.ui.panel.scales.ScatterTicks, chartEditor.ui.Panel); 22 | 23 | 24 | /** @override */ 25 | chartEditor.ui.panel.scales.ScatterTicks.prototype.createDom = function() { 26 | chartEditor.ui.panel.scales.ScatterTicks.base(this, 'createDom'); 27 | 28 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 29 | 30 | var count = new chartEditor.ui.control.input.Numbers(); 31 | count.setFormatterFunction(function(value){ 32 | return String(goog.isArray(value) ? Number(value[0]) : Number(value)); 33 | }); 34 | var countLC = new chartEditor.ui.control.wrapped.Labeled(count, 'Count'); 35 | countLC.init(model, this.genKey('count()')); 36 | this.addChildControl(countLC); 37 | 38 | var interval = new chartEditor.ui.control.input.Numbers(); 39 | var intervalLC = new chartEditor.ui.control.wrapped.Labeled(interval, 'Interval'); 40 | intervalLC.init(model, this.genKey('interval()')); 41 | this.addChildControl(intervalLC); 42 | }; 43 | -------------------------------------------------------------------------------- /src/ui/panel/scales/Standalone.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.scales.Standalone'); 2 | 3 | goog.require("chartEditor.ui.panel.scales.Base"); 4 | 5 | 6 | /** 7 | * @param {chartEditor.model.Base} model 8 | * @param {string|Array.} types 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 10 | * @constructor 11 | * @extends {chartEditor.ui.panel.scales.Base} 12 | */ 13 | chartEditor.ui.panel.scales.Standalone = function(model, types, opt_domHelper) { 14 | chartEditor.ui.panel.scales.Standalone.base(this, 'constructor', model, types, opt_domHelper); 15 | }; 16 | goog.inherits(chartEditor.ui.panel.scales.Standalone, chartEditor.ui.panel.scales.Base); 17 | 18 | 19 | /** @override */ 20 | chartEditor.ui.panel.scales.Standalone.prototype.createDom = function() { 21 | chartEditor.ui.panel.scales.Standalone.base(this, 'createDom'); 22 | 23 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 24 | var key = this.genKey(); 25 | key.pop(); 26 | key.push('type'); 27 | this.scaleTypeField.init(model, key); 28 | }; 29 | 30 | 31 | /** @inheritDoc */ 32 | chartEditor.ui.panel.scales.Standalone.prototype.onModelChange = function(evt) { 33 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 34 | 35 | if (!this.isExcluded()) { 36 | var scaleType = this.fixedScaleType_ || model.getValue(this.scaleTypeField.getKey()); 37 | 38 | this.scaleTypeField.setValue(scaleType ? scaleType : null, true); 39 | this.updateSpecific(); 40 | } 41 | 42 | this.getHandler().listenOnce(model, chartEditor.events.EventType.CHART_DRAW, this.onChartDraw); 43 | }; 44 | 45 | 46 | /** @inheritDoc */ 47 | chartEditor.ui.panel.scales.Standalone.prototype.onChartDraw = function(evt) { 48 | if (!this.isExcluded()) { 49 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 50 | var key = this.genKey(); 51 | key.pop(); 52 | var descriptor = model.getValue(key); 53 | 54 | if (descriptor['instance'] && !descriptor['locked']) { 55 | this.scaleTypeField.setValue(descriptor['type'], true); 56 | if (this.specificComponent) { 57 | this.specificComponent.exclude(false); 58 | this.specificComponent.onChartDraw(evt); 59 | } 60 | 61 | } else { 62 | this.scaleTypeField.setValue(null, true); 63 | if (this.specificComponent) { 64 | this.specificComponent.exclude(true); 65 | } 66 | } 67 | 68 | this.dispatchEvent({ 69 | type: chartEditor.events.EventType.LOCK, 70 | lock: descriptor['locked'] 71 | }); 72 | } 73 | }; 74 | -------------------------------------------------------------------------------- /src/ui/panel/specific/GaugeLinear.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.specific.GaugeLinear'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.fieldSelect.Base'); 5 | goog.require('chartEditor.ui.control.input.Palette'); 6 | goog.require('chartEditor.ui.control.select.Scales'); 7 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 8 | goog.require('chartEditor.ui.panel.Background'); 9 | 10 | 11 | 12 | /** 13 | * @param {chartEditor.model.Base} model 14 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 15 | * @constructor 16 | * @extends {chartEditor.ui.Panel} 17 | */ 18 | chartEditor.ui.panel.specific.GaugeLinear = function(model, opt_domHelper) { 19 | chartEditor.ui.panel.specific.GaugeLinear.base(this, 'constructor', model, 'Linear Gauge Settings', opt_domHelper); 20 | 21 | this.key = [['chart'], ['settings']]; 22 | }; 23 | goog.inherits(chartEditor.ui.panel.specific.GaugeLinear, chartEditor.ui.Panel); 24 | 25 | 26 | /** @override */ 27 | chartEditor.ui.panel.specific.GaugeLinear.prototype.createDom = function() { 28 | chartEditor.ui.panel.specific.GaugeLinear.base(this, 'createDom'); 29 | 30 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 31 | 32 | var layout = new chartEditor.ui.control.fieldSelect.Base({label: 'Layout'}); 33 | layout.getSelect().setOptions([ 34 | {value: 'horizontal'}, 35 | {value: 'vertical'} 36 | ]); 37 | layout.init(model, this.genKey('layout()')); 38 | this.addChildControl(layout); 39 | 40 | var background = new chartEditor.ui.panel.Background(model); 41 | background.setName(null); 42 | background.setKey(this.genKey('background()')); 43 | this.addChildControl(background); 44 | 45 | var palette = new chartEditor.ui.control.input.Palette('Comma separated colors'); 46 | var paletteLC = new chartEditor.ui.control.wrapped.Labeled(palette, 'Palette'); 47 | paletteLC.init(model, this.genKey('palette()')); 48 | this.addChildControl(paletteLC); 49 | 50 | var scale = new chartEditor.ui.control.select.Scales({label: 'Scale', scaleName: 'Default Scale'}); 51 | scale.init(model, this.genKey('scale()'), void 0, true); 52 | this.addChildControl(scale); 53 | }; 54 | -------------------------------------------------------------------------------- /src/ui/panel/specific/HeatMap.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.specific.HeatMap'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.select.Scales'); 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 10 | * @constructor 11 | * @extends {chartEditor.ui.Panel} 12 | */ 13 | chartEditor.ui.panel.specific.HeatMap = function(model, opt_domHelper) { 14 | chartEditor.ui.panel.specific.HeatMap.base(this, 'constructor', model, 'Heat Map Chart Settings', opt_domHelper); 15 | 16 | this.key = [['chart'], ['settings']]; 17 | }; 18 | goog.inherits(chartEditor.ui.panel.specific.HeatMap, chartEditor.ui.Panel); 19 | 20 | 21 | /** @override */ 22 | chartEditor.ui.panel.specific.HeatMap.prototype.createDom = function() { 23 | chartEditor.ui.panel.specific.HeatMap.base(this, 'createDom'); 24 | 25 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 26 | 27 | var xScale = new chartEditor.ui.control.select.Scales({label: 'X Scale', scaleName: 'Default X Scale'}); 28 | xScale.init(model, this.genKey('xScale()')); 29 | this.addChildControl(xScale); 30 | 31 | var yScale = new chartEditor.ui.control.select.Scales({label: 'Y Scale', scaleName: 'Default Y Scale'}); 32 | yScale.init(model, this.genKey('yScale()')); 33 | this.addChildControl(yScale); 34 | }; 35 | -------------------------------------------------------------------------------- /src/ui/panel/specific/Mekko.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.specific.Mekko'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.comboBox.Base'); 5 | goog.require('chartEditor.ui.control.select.Scales'); 6 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 7 | 8 | 9 | 10 | /** 11 | * @param {chartEditor.model.Base} model 12 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 13 | * @constructor 14 | * @extends {chartEditor.ui.Panel} 15 | */ 16 | chartEditor.ui.panel.specific.Mekko = function(model, opt_domHelper) { 17 | chartEditor.ui.panel.specific.Mekko.base(this, 'constructor', model, 'Mekko Chart Settings', opt_domHelper); 18 | 19 | this.key = [['chart'], ['settings']]; 20 | }; 21 | goog.inherits(chartEditor.ui.panel.specific.Mekko, chartEditor.ui.Panel); 22 | 23 | 24 | /** @override */ 25 | chartEditor.ui.panel.specific.Mekko.prototype.createDom = function() { 26 | chartEditor.ui.panel.specific.Mekko.base(this, 'createDom'); 27 | 28 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 29 | 30 | var pointsPadding = new chartEditor.ui.control.comboBox.Base(); 31 | pointsPadding.setOptions([0, 1, 3, 5, 10, 15]); 32 | pointsPadding.setRange(0, 20); 33 | var pointsPaddingLC = new chartEditor.ui.control.wrapped.Labeled(pointsPadding, 'Points Padding'); 34 | pointsPaddingLC.init(model, this.genKey('pointsPadding()')); 35 | this.addChildControl(pointsPaddingLC); 36 | 37 | var xScale = new chartEditor.ui.control.select.Scales({label: 'X Scale', scaleName: 'Default X Scale'}); 38 | xScale.init(model, this.genKey('xScale()')); 39 | this.addChildControl(xScale); 40 | 41 | var yScale = new chartEditor.ui.control.select.Scales({label: 'Y Scale', scaleName: 'Default Y Scale'}); 42 | yScale.init(model, this.genKey('yScale()')); 43 | this.addChildControl(yScale); 44 | }; 45 | -------------------------------------------------------------------------------- /src/ui/panel/specific/Pie.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.specific.Pie'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.comboBox.Percent'); 5 | goog.require('chartEditor.ui.control.fieldSelect.Base'); 6 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 7 | goog.require('chartEditor.ui.panel.Stroke'); 8 | 9 | 10 | 11 | /** 12 | * @param {chartEditor.model.Base} model 13 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 14 | * @constructor 15 | * @extends {chartEditor.ui.Panel} 16 | */ 17 | chartEditor.ui.panel.specific.Pie = function(model, opt_domHelper) { 18 | chartEditor.ui.panel.specific.Pie.base(this, 'constructor', model, 'Pie Chart Settings', opt_domHelper); 19 | 20 | this.key = [['chart'], ['settings']]; 21 | 22 | this.addClassName(goog.getCssName('anychart-ce-panel-pie')); 23 | }; 24 | goog.inherits(chartEditor.ui.panel.specific.Pie, chartEditor.ui.Panel); 25 | 26 | 27 | /** @override */ 28 | chartEditor.ui.panel.specific.Pie.prototype.createDom = function() { 29 | chartEditor.ui.panel.specific.Pie.base(this, 'createDom'); 30 | 31 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 32 | 33 | var innerRadius = new chartEditor.ui.control.comboBox.Percent(); 34 | innerRadius.setOptions([5, 10, 20, 30, 40]); 35 | var innerRadiusLC = new chartEditor.ui.control.wrapped.Labeled(innerRadius, 'Inner Radius'); 36 | innerRadiusLC.init(model, this.genKey('innerRadius()')); 37 | this.addChildControl(innerRadiusLC); 38 | 39 | var connectorstroke = new chartEditor.ui.panel.Stroke(model, 'Connectors'); 40 | connectorstroke.setKey(this.genKey('connectorStroke()')); 41 | this.addChildControl(connectorstroke); 42 | }; 43 | -------------------------------------------------------------------------------- /src/ui/panel/specific/Quadrant.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.specific.Quadrant'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.panel.Stroke'); 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 10 | * @constructor 11 | * @extends {chartEditor.ui.Panel} 12 | */ 13 | chartEditor.ui.panel.specific.Quadrant = function(model, opt_domHelper) { 14 | chartEditor.ui.panel.specific.Quadrant.base(this, 'constructor', model, 'Quadrant Chart Settings', opt_domHelper); 15 | 16 | this.key = [['chart'], ['settings']]; 17 | }; 18 | goog.inherits(chartEditor.ui.panel.specific.Quadrant, chartEditor.ui.Panel); 19 | 20 | 21 | /** @override */ 22 | chartEditor.ui.panel.specific.Quadrant.prototype.createDom = function() { 23 | chartEditor.ui.panel.specific.Quadrant.base(this, 'createDom'); 24 | 25 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 26 | 27 | var stroke = new chartEditor.ui.panel.Stroke(model, 'Crossing stroke'); 28 | stroke.setKey(this.genKey('crossing().stroke()')); 29 | this.addChildControl(stroke); 30 | }; 31 | -------------------------------------------------------------------------------- /src/ui/panel/specific/Radar.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.specific.Radar'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.comboBox.Base'); 5 | goog.require('chartEditor.ui.control.select.Scales'); 6 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 7 | 8 | 9 | 10 | /** 11 | * @param {chartEditor.model.Base} model 12 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 13 | * @constructor 14 | * @extends {chartEditor.ui.Panel} 15 | */ 16 | chartEditor.ui.panel.specific.Radar = function(model, opt_domHelper) { 17 | chartEditor.ui.panel.specific.Radar.base(this, 'constructor', model, 'Radar Chart Settings', opt_domHelper); 18 | 19 | this.key = [['chart'], ['settings']]; 20 | }; 21 | goog.inherits(chartEditor.ui.panel.specific.Radar, chartEditor.ui.Panel); 22 | 23 | 24 | /** @override */ 25 | chartEditor.ui.panel.specific.Radar.prototype.createDom = function() { 26 | chartEditor.ui.panel.specific.Radar.base(this, 'createDom'); 27 | 28 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 29 | 30 | var startAngle = new chartEditor.ui.control.comboBox.Base(); 31 | startAngle.setOptions([0, 90, 180, 270]); 32 | startAngle.setRange(0, 360); 33 | var startAngleLC = new chartEditor.ui.control.wrapped.Labeled(startAngle, 'Start Angle'); 34 | startAngleLC.init(model, this.genKey('startAngle()')); 35 | this.addChildControl(startAngleLC); 36 | 37 | var xScale = new chartEditor.ui.control.select.Scales({label: 'X Scale', scaleName: 'Default X Scale'}); 38 | xScale.init(model, this.genKey('xScale()')); 39 | this.addChildControl(xScale); 40 | 41 | var yScale = new chartEditor.ui.control.select.Scales({label: 'Y Scale', scaleName: 'Default Y Scale'}); 42 | yScale.init(model, this.genKey('yScale()')); 43 | this.addChildControl(yScale); 44 | }; 45 | -------------------------------------------------------------------------------- /src/ui/panel/specific/Sankey.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.specific.Sankey'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require("chartEditor.ui.control.comboBox.Base"); 5 | goog.require('chartEditor.ui.control.comboBox.Percent'); 6 | goog.require('chartEditor.ui.control.wrapped.Labeled'); 7 | 8 | 9 | /** 10 | * @param {chartEditor.model.Base} model 11 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 12 | * @constructor 13 | * @extends {chartEditor.ui.Panel} 14 | */ 15 | chartEditor.ui.panel.specific.Sankey = function(model, opt_domHelper) { 16 | chartEditor.ui.panel.specific.Sankey.base(this, 'constructor', model, 'Sankey Chart Settings', opt_domHelper); 17 | 18 | this.key = [['chart'], ['settings']]; 19 | }; 20 | goog.inherits(chartEditor.ui.panel.specific.Sankey, chartEditor.ui.Panel); 21 | 22 | 23 | /** @override */ 24 | chartEditor.ui.panel.specific.Sankey.prototype.createDom = function() { 25 | chartEditor.ui.panel.specific.Sankey.base(this, 'createDom'); 26 | 27 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 28 | 29 | var nodeWidth = new chartEditor.ui.control.comboBox.Percent(); 30 | nodeWidth.setOptions([5, 10, 20, 30, 40]); 31 | var nodeWidthLC = new chartEditor.ui.control.wrapped.Labeled(nodeWidth, 'Node Width'); 32 | nodeWidthLC.init(model, this.genKey('nodeWidth()')); 33 | this.addChildControl(nodeWidthLC); 34 | 35 | var nodePadding = new chartEditor.ui.control.comboBox.Base(); 36 | nodePadding.setOptions([0, 10, 20, 30]); 37 | nodePadding.setRange(0,200); 38 | var nodePaddingLC = new chartEditor.ui.control.wrapped.Labeled(nodePadding, 'Node Padding'); 39 | nodePaddingLC.init(model, this.genKey('nodePadding()')); 40 | this.addChildControl(nodePaddingLC); 41 | 42 | var curveFactor = new chartEditor.ui.control.comboBox.Base(); 43 | curveFactor.setOptions([0, 0.2, 0.5, 0.8]); 44 | curveFactor.setRange(0, 1); 45 | var curveFactorLC = new chartEditor.ui.control.wrapped.Labeled(curveFactor, 'Curve Factor'); 46 | curveFactorLC.init(model, this.genKey('curveFactor()')); 47 | this.addChildControl(curveFactorLC); 48 | }; 49 | -------------------------------------------------------------------------------- /src/ui/panel/specific/Scatter.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.panel.specific.Scatter'); 2 | 3 | goog.require('chartEditor.ui.Panel'); 4 | goog.require('chartEditor.ui.control.select.Scales'); 5 | 6 | 7 | /** 8 | * @param {chartEditor.model.Base} model 9 | * @param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper; see {@link goog.ui.Component} for semantics. 10 | * @constructor 11 | * @extends {chartEditor.ui.Panel} 12 | */ 13 | chartEditor.ui.panel.specific.Scatter = function(model, opt_domHelper) { 14 | chartEditor.ui.panel.specific.Scatter.base(this, 'constructor', model, 'Scatter Chart Settings', opt_domHelper); 15 | 16 | this.key = [['chart'], ['settings']]; 17 | }; 18 | goog.inherits(chartEditor.ui.panel.specific.Scatter, chartEditor.ui.Panel); 19 | 20 | 21 | /** @override */ 22 | chartEditor.ui.panel.specific.Scatter.prototype.createDom = function() { 23 | chartEditor.ui.panel.specific.Scatter.base(this, 'createDom'); 24 | 25 | var model = /** @type {chartEditor.model.Base} */(this.getModel()); 26 | 27 | var xScale = new chartEditor.ui.control.select.Scales({label: 'X Scale', scaleName: 'Default X Scale'}); 28 | xScale.init(model, this.genKey('xScale()')); 29 | this.addChildControl(xScale); 30 | 31 | var yScale = new chartEditor.ui.control.select.Scales({label: 'Y Scale', scaleName: 'Default Y Scale'}); 32 | yScale.init(model, this.genKey('yScale()')); 33 | this.addChildControl(yScale); 34 | }; 35 | -------------------------------------------------------------------------------- /src/ui/userData/Widget.js: -------------------------------------------------------------------------------- 1 | goog.provide('chartEditor.ui.userData.Widget'); 2 | 3 | goog.require('chartEditor.ui.Component'); 4 | 5 | 6 | 7 | /** 8 | * @param {Array.<{id: string, type:string, caption: string, icon:string}>=} opt_model 9 | * @constructor 10 | * @extends {chartEditor.ui.Component} 11 | */ 12 | chartEditor.ui.userData.Widget = function(opt_model) { 13 | chartEditor.ui.userData.Widget.base(this, 'constructor'); 14 | 15 | this.addClassName('anychart-ce-user-data'); 16 | 17 | this.setModel(opt_model); 18 | 19 | this.items_ = []; 20 | }; 21 | goog.inherits(chartEditor.ui.userData.Widget, chartEditor.ui.Component); 22 | 23 | 24 | /** @enum {string} */ 25 | chartEditor.ui.userData.Widget.EventType = { 26 | ACTION: goog.events.getUniqueId('action') 27 | }; 28 | 29 | 30 | /** @inheritDoc */ 31 | chartEditor.ui.userData.Widget.prototype.createDom = function() { 32 | chartEditor.ui.userData.Widget.base(this, 'createDom'); 33 | var element = this.getElement(); 34 | var model = /** @type {Array.<{id: string, caption: string, icon:string}>} */(this.getModel()); 35 | 36 | if (model) { 37 | for (var i = 0, count = model.length; i < count; i++) { 38 | var item = model[i]; 39 | var itemElement = goog.dom.createDom(goog.dom.TagName.DIV, 'anychart-ce-user-data-item', [ 40 | goog.dom.createDom(goog.dom.TagName.IMG, { 41 | 'src': item.icon, 42 | 'class': 'anychart-ce-user-data-item-icon' 43 | }), 44 | goog.dom.createDom(goog.dom.TagName.DIV, 'anychart-ce-user-data-item-caption', item.caption) 45 | ]); 46 | goog.dom.setProperties(itemElement, {'data-value': item.id}); 47 | goog.dom.appendChild(element, itemElement); 48 | 49 | this.items_.push(itemElement); 50 | } 51 | } 52 | }; 53 | 54 | 55 | /** @inheritDoc */ 56 | chartEditor.ui.userData.Widget.prototype.enterDocument = function() { 57 | chartEditor.ui.userData.Widget.base(this, 'enterDocument'); 58 | for (var i = 0; i < this.items_.length; i++) { 59 | var itemElement = this.items_[i]; 60 | this.getHandler().listen(itemElement, goog.events.EventType.CLICK, this.onItemClick_); 61 | } 62 | }; 63 | 64 | 65 | /** 66 | * @param {Object} e 67 | * @private 68 | */ 69 | chartEditor.ui.userData.Widget.prototype.onItemClick_ = function(e) { 70 | e.preventDefault(); 71 | e.stopPropagation(); 72 | this.dispatchEvent({ 73 | type: chartEditor.ui.userData.Widget.EventType.ACTION, 74 | value: e.currentTarget.getAttribute('data-value') 75 | }); 76 | }; 77 | 78 | 79 | /** @inheritDoc */ 80 | chartEditor.ui.userData.Widget.prototype.disposeInternal = function () { 81 | this.items_.length = 0; 82 | chartEditor.ui.userData.Widget.base(this, 'disposeInternal'); 83 | }; 84 | --------------------------------------------------------------------------------