mirror of https://github.com/akveo/blur-admin
Ayoub Allali
GitHub
commit
ba64bdd3ca
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -1,225 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovsky
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.amCharts', [])
|
|
||||||
.config(routeConfig).config(amChartConfig);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function routeConfig($stateProvider) {
|
|
||||||
$stateProvider
|
|
||||||
.state('charts.amCharts', {
|
|
||||||
url: '/amCharts',
|
|
||||||
templateUrl: 'app/pages/charts/amCharts/charts.html',
|
|
||||||
title: 'amCharts',
|
|
||||||
sidebarMeta: {
|
|
||||||
order: 0,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function amChartConfig(baConfigProvider) {
|
|
||||||
var layoutColors = baConfigProvider.colors;
|
|
||||||
AmCharts.themes.blur = {
|
|
||||||
|
|
||||||
themeName: "blur",
|
|
||||||
|
|
||||||
AmChart: {
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
backgroundColor: "#FFFFFF"
|
|
||||||
},
|
|
||||||
|
|
||||||
AmCoordinateChart: {
|
|
||||||
colors: [layoutColors.primary, layoutColors.danger, layoutColors.warning, layoutColors.success, layoutColors.info, layoutColors.primaryDark, layoutColors.warningLight, layoutColors.successDark, layoutColors.successLight, layoutColors.primaryLight, layoutColors.warningDark]
|
|
||||||
},
|
|
||||||
|
|
||||||
AmStockChart: {
|
|
||||||
colors: [layoutColors.primary, layoutColors.danger, layoutColors.warning, layoutColors.success, layoutColors.info, layoutColors.primaryDark, layoutColors.warningLight, layoutColors.successDark, layoutColors.successLight, layoutColors.primaryLight, layoutColors.warningDark]
|
|
||||||
},
|
|
||||||
|
|
||||||
AmSlicedChart: {
|
|
||||||
colors: [layoutColors.primary, layoutColors.danger, layoutColors.warning, layoutColors.success, layoutColors.info, layoutColors.primaryDark, layoutColors.warningLight, layoutColors.successDark, layoutColors.successLight, layoutColors.primaryLight, layoutColors.warningDark],
|
|
||||||
labelTickColor: "#FFFFFF",
|
|
||||||
labelTickAlpha: 0.3
|
|
||||||
},
|
|
||||||
|
|
||||||
AmRectangularChart: {
|
|
||||||
zoomOutButtonColor: '#FFFFFF',
|
|
||||||
zoomOutButtonRollOverAlpha: 0.15,
|
|
||||||
zoomOutButtonImage: "lens.png"
|
|
||||||
},
|
|
||||||
|
|
||||||
AxisBase: {
|
|
||||||
axisColor: "#FFFFFF",
|
|
||||||
axisAlpha: 0.3,
|
|
||||||
gridAlpha: 0.1,
|
|
||||||
gridColor: "#FFFFFF"
|
|
||||||
},
|
|
||||||
|
|
||||||
ChartScrollbar: {
|
|
||||||
backgroundColor: "#FFFFFF",
|
|
||||||
backgroundAlpha: 0.12,
|
|
||||||
graphFillAlpha: 0.5,
|
|
||||||
graphLineAlpha: 0,
|
|
||||||
selectedBackgroundColor: "#FFFFFF",
|
|
||||||
selectedBackgroundAlpha: 0.4,
|
|
||||||
gridAlpha: 0.15
|
|
||||||
},
|
|
||||||
|
|
||||||
ChartCursor: {
|
|
||||||
cursorColor: layoutColors.primary,
|
|
||||||
color: "#FFFFFF",
|
|
||||||
cursorAlpha: 0.5
|
|
||||||
},
|
|
||||||
|
|
||||||
AmLegend: {
|
|
||||||
color: "#FFFFFF"
|
|
||||||
},
|
|
||||||
|
|
||||||
AmGraph: {
|
|
||||||
lineAlpha: 0.9
|
|
||||||
},
|
|
||||||
GaugeArrow: {
|
|
||||||
color: "#FFFFFF",
|
|
||||||
alpha: 0.8,
|
|
||||||
nailAlpha: 0,
|
|
||||||
innerRadius: "40%",
|
|
||||||
nailRadius: 15,
|
|
||||||
startWidth: 15,
|
|
||||||
borderAlpha: 0.8,
|
|
||||||
nailBorderAlpha: 0
|
|
||||||
},
|
|
||||||
|
|
||||||
GaugeAxis: {
|
|
||||||
tickColor: "#FFFFFF",
|
|
||||||
tickAlpha: 1,
|
|
||||||
tickLength: 15,
|
|
||||||
minorTickLength: 8,
|
|
||||||
axisThickness: 3,
|
|
||||||
axisColor: '#FFFFFF',
|
|
||||||
axisAlpha: 1,
|
|
||||||
bandAlpha: 0.8
|
|
||||||
},
|
|
||||||
|
|
||||||
TrendLine: {
|
|
||||||
lineColor: layoutColors.danger,
|
|
||||||
lineAlpha: 0.8
|
|
||||||
},
|
|
||||||
|
|
||||||
// ammap
|
|
||||||
AreasSettings: {
|
|
||||||
alpha: 0.8,
|
|
||||||
color: layoutColors.info,
|
|
||||||
colorSolid: layoutColors.primaryDark,
|
|
||||||
unlistedAreasAlpha: 0.4,
|
|
||||||
unlistedAreasColor: "#FFFFFF",
|
|
||||||
outlineColor: "#FFFFFF",
|
|
||||||
outlineAlpha: 0.5,
|
|
||||||
outlineThickness: 0.5,
|
|
||||||
rollOverColor: layoutColors.primary,
|
|
||||||
rollOverOutlineColor: "#FFFFFF",
|
|
||||||
selectedOutlineColor: "#FFFFFF",
|
|
||||||
selectedColor: "#f15135",
|
|
||||||
unlistedAreasOutlineColor: "#FFFFFF",
|
|
||||||
unlistedAreasOutlineAlpha: 0.5
|
|
||||||
},
|
|
||||||
|
|
||||||
LinesSettings: {
|
|
||||||
color: "#FFFFFF",
|
|
||||||
alpha: 0.8
|
|
||||||
},
|
|
||||||
|
|
||||||
ImagesSettings: {
|
|
||||||
alpha: 0.8,
|
|
||||||
labelColor: "#FFFFFF",
|
|
||||||
color: "#FFFFFF",
|
|
||||||
labelRollOverColor: layoutColors.primaryDark
|
|
||||||
},
|
|
||||||
|
|
||||||
ZoomControl: {
|
|
||||||
buttonFillAlpha: 0.8,
|
|
||||||
buttonIconColor: layoutColors.defaultText,
|
|
||||||
buttonRollOverColor: layoutColors.danger,
|
|
||||||
buttonFillColor: layoutColors.primaryDark,
|
|
||||||
buttonBorderColor: layoutColors.primaryDark,
|
|
||||||
buttonBorderAlpha: 0,
|
|
||||||
buttonCornerRadius: 0,
|
|
||||||
gridColor: "#FFFFFF",
|
|
||||||
gridBackgroundColor: "#FFFFFF",
|
|
||||||
buttonIconAlpha: 0.6,
|
|
||||||
gridAlpha: 0.6,
|
|
||||||
buttonSize: 20
|
|
||||||
},
|
|
||||||
|
|
||||||
SmallMap: {
|
|
||||||
mapColor: "#000000",
|
|
||||||
rectangleColor: layoutColors.danger,
|
|
||||||
backgroundColor: "#FFFFFF",
|
|
||||||
backgroundAlpha: 0.7,
|
|
||||||
borderThickness: 1,
|
|
||||||
borderAlpha: 0.8
|
|
||||||
},
|
|
||||||
|
|
||||||
// the defaults below are set using CSS syntax, you can use any existing css property
|
|
||||||
// if you don't use Stock chart, you can delete lines below
|
|
||||||
PeriodSelector: {
|
|
||||||
color: "#FFFFFF"
|
|
||||||
},
|
|
||||||
|
|
||||||
PeriodButton: {
|
|
||||||
color: "#FFFFFF",
|
|
||||||
background: "transparent",
|
|
||||||
opacity: 0.7,
|
|
||||||
border: "1px solid rgba(0, 0, 0, .3)",
|
|
||||||
MozBorderRadius: "5px",
|
|
||||||
borderRadius: "5px",
|
|
||||||
margin: "1px",
|
|
||||||
outline: "none",
|
|
||||||
boxSizing: "border-box"
|
|
||||||
},
|
|
||||||
|
|
||||||
PeriodButtonSelected: {
|
|
||||||
color: "#FFFFFF",
|
|
||||||
backgroundColor: "#b9cdf5",
|
|
||||||
border: "1px solid rgba(0, 0, 0, .3)",
|
|
||||||
MozBorderRadius: "5px",
|
|
||||||
borderRadius: "5px",
|
|
||||||
margin: "1px",
|
|
||||||
outline: "none",
|
|
||||||
opacity: 1,
|
|
||||||
boxSizing: "border-box"
|
|
||||||
},
|
|
||||||
|
|
||||||
PeriodInputField: {
|
|
||||||
color: "#FFFFFF",
|
|
||||||
background: "transparent",
|
|
||||||
border: "1px solid rgba(0, 0, 0, .3)",
|
|
||||||
outline: "none"
|
|
||||||
},
|
|
||||||
|
|
||||||
DataSetSelector: {
|
|
||||||
color: "#FFFFFF",
|
|
||||||
selectedBackgroundColor: "#b9cdf5",
|
|
||||||
rollOverBackgroundColor: "#a8b0e4"
|
|
||||||
},
|
|
||||||
|
|
||||||
DataSetCompareList: {
|
|
||||||
color: "#FFFFFF",
|
|
||||||
lineHeight: "100%",
|
|
||||||
boxSizing: "initial",
|
|
||||||
webkitBoxSizing: "initial",
|
|
||||||
border: "1px solid rgba(0, 0, 0, .3)"
|
|
||||||
},
|
|
||||||
|
|
||||||
DataSetSelect: {
|
|
||||||
border: "1px solid rgba(0, 0, 0, .3)",
|
|
||||||
outline: "none"
|
|
||||||
}
|
|
||||||
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,147 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovsky
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.amCharts')
|
|
||||||
.controller('AreaChartCtrl', AreaChartCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function AreaChartCtrl($scope, baConfig, $element, layoutPaths) {
|
|
||||||
var layoutColors = baConfig.colors;
|
|
||||||
var id = $element[0].getAttribute('id');
|
|
||||||
var areaChart = AmCharts.makeChart(id, {
|
|
||||||
type: 'serial',
|
|
||||||
theme: 'blur',
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
dataProvider: [
|
|
||||||
{
|
|
||||||
lineColor: layoutColors.info,
|
|
||||||
date: '2012-01-01',
|
|
||||||
duration: 408
|
|
||||||
},
|
|
||||||
{
|
|
||||||
date: '2012-01-02',
|
|
||||||
duration: 482
|
|
||||||
},
|
|
||||||
{
|
|
||||||
date: '2012-01-03',
|
|
||||||
duration: 562
|
|
||||||
},
|
|
||||||
{
|
|
||||||
date: '2012-01-04',
|
|
||||||
duration: 379
|
|
||||||
},
|
|
||||||
{
|
|
||||||
lineColor: layoutColors.warning,
|
|
||||||
date: '2012-01-05',
|
|
||||||
duration: 501
|
|
||||||
},
|
|
||||||
{
|
|
||||||
date: '2012-01-06',
|
|
||||||
duration: 443
|
|
||||||
},
|
|
||||||
{
|
|
||||||
date: '2012-01-07',
|
|
||||||
duration: 405
|
|
||||||
},
|
|
||||||
{
|
|
||||||
date: '2012-01-08',
|
|
||||||
duration: 309,
|
|
||||||
lineColor: layoutColors.danger
|
|
||||||
},
|
|
||||||
{
|
|
||||||
date: '2012-01-09',
|
|
||||||
duration: 287
|
|
||||||
},
|
|
||||||
{
|
|
||||||
date: '2012-01-10',
|
|
||||||
duration: 485
|
|
||||||
},
|
|
||||||
{
|
|
||||||
date: '2012-01-11',
|
|
||||||
duration: 890
|
|
||||||
},
|
|
||||||
{
|
|
||||||
date: '2012-01-12',
|
|
||||||
duration: 810
|
|
||||||
}
|
|
||||||
],
|
|
||||||
balloon: {
|
|
||||||
cornerRadius: 6,
|
|
||||||
horizontalPadding: 15,
|
|
||||||
verticalPadding: 10
|
|
||||||
},
|
|
||||||
valueAxes: [
|
|
||||||
{
|
|
||||||
duration: 'mm',
|
|
||||||
durationUnits: {
|
|
||||||
hh: 'h ',
|
|
||||||
mm: 'min'
|
|
||||||
},
|
|
||||||
gridAlpha: 0.5,
|
|
||||||
gridColor: layoutColors.border,
|
|
||||||
}
|
|
||||||
],
|
|
||||||
graphs: [
|
|
||||||
{
|
|
||||||
bullet: 'square',
|
|
||||||
bulletBorderAlpha: 1,
|
|
||||||
bulletBorderThickness: 1,
|
|
||||||
fillAlphas: 0.5,
|
|
||||||
fillColorsField: 'lineColor',
|
|
||||||
legendValueText: '[[value]]',
|
|
||||||
lineColorField: 'lineColor',
|
|
||||||
title: 'duration',
|
|
||||||
valueField: 'duration'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
|
|
||||||
chartCursor: {
|
|
||||||
categoryBalloonDateFormat: 'YYYY MMM DD',
|
|
||||||
cursorAlpha: 0,
|
|
||||||
fullWidth: true
|
|
||||||
},
|
|
||||||
dataDateFormat: 'YYYY-MM-DD',
|
|
||||||
categoryField: 'date',
|
|
||||||
categoryAxis: {
|
|
||||||
dateFormats: [
|
|
||||||
{
|
|
||||||
period: 'DD',
|
|
||||||
format: 'DD'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
period: 'WW',
|
|
||||||
format: 'MMM DD'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
period: 'MM',
|
|
||||||
format: 'MMM'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
period: 'YYYY',
|
|
||||||
format: 'YYYY'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
parseDates: true,
|
|
||||||
autoGridCount: false,
|
|
||||||
gridCount: 50,
|
|
||||||
gridAlpha: 0.5,
|
|
||||||
gridColor: layoutColors.border,
|
|
||||||
},
|
|
||||||
export: {
|
|
||||||
enabled: true
|
|
||||||
},
|
|
||||||
pathToImages: layoutPaths.images.amChart
|
|
||||||
});
|
|
||||||
|
|
||||||
areaChart.addListener('dataUpdated', zoomAreaChart);
|
|
||||||
|
|
||||||
function zoomAreaChart() {
|
|
||||||
areaChart.zoomToDates(new Date(2012, 0, 3), new Date(2012, 0, 11));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
<div id="areaChart" class="admin-chart" ng-controller="AreaChartCtrl"></div>
|
|
||||||
|
|
@ -1,91 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovsky
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.amCharts')
|
|
||||||
.controller('BarChartCtrl', BarChartCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function BarChartCtrl($scope, baConfig, $element, layoutPaths) {
|
|
||||||
var layoutColors = baConfig.colors;
|
|
||||||
var id = $element[0].getAttribute('id');
|
|
||||||
var barChart = AmCharts.makeChart(id, {
|
|
||||||
type: 'serial',
|
|
||||||
theme: 'blur',
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
dataProvider: [
|
|
||||||
{
|
|
||||||
country: 'USA',
|
|
||||||
visits: 3025,
|
|
||||||
color: layoutColors.primary
|
|
||||||
},
|
|
||||||
{
|
|
||||||
country: 'China',
|
|
||||||
visits: 1882,
|
|
||||||
color: layoutColors.danger
|
|
||||||
|
|
||||||
},
|
|
||||||
{
|
|
||||||
country: 'Japan',
|
|
||||||
visits: 1809,
|
|
||||||
color: layoutColors.info
|
|
||||||
},
|
|
||||||
{
|
|
||||||
country: 'Germany',
|
|
||||||
visits: 1322,
|
|
||||||
color: layoutColors.success
|
|
||||||
},
|
|
||||||
{
|
|
||||||
country: 'UK',
|
|
||||||
visits: 1122,
|
|
||||||
color: layoutColors.warning
|
|
||||||
},
|
|
||||||
{
|
|
||||||
country: 'France',
|
|
||||||
visits: 1114,
|
|
||||||
color: layoutColors.primaryLight
|
|
||||||
}
|
|
||||||
],
|
|
||||||
valueAxes: [
|
|
||||||
{
|
|
||||||
axisAlpha: 0,
|
|
||||||
position: 'left',
|
|
||||||
title: 'Visitors from country',
|
|
||||||
gridAlpha: 0.5,
|
|
||||||
gridColor: layoutColors.border,
|
|
||||||
}
|
|
||||||
],
|
|
||||||
startDuration: 1,
|
|
||||||
graphs: [
|
|
||||||
{
|
|
||||||
balloonText: '<b>[[category]]: [[value]]</b>',
|
|
||||||
fillColorsField: 'color',
|
|
||||||
fillAlphas: 0.7,
|
|
||||||
lineAlpha: 0.2,
|
|
||||||
type: 'column',
|
|
||||||
valueField: 'visits'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
chartCursor: {
|
|
||||||
categoryBalloonEnabled: false,
|
|
||||||
cursorAlpha: 0,
|
|
||||||
zoomable: false
|
|
||||||
},
|
|
||||||
categoryField: 'country',
|
|
||||||
categoryAxis: {
|
|
||||||
gridPosition: 'start',
|
|
||||||
labelRotation: 45,
|
|
||||||
gridAlpha: 0.5,
|
|
||||||
gridColor: layoutColors.border,
|
|
||||||
},
|
|
||||||
export: {
|
|
||||||
enabled: true
|
|
||||||
},
|
|
||||||
creditsPosition: 'top-right',
|
|
||||||
pathToImages: layoutPaths.images.amChart
|
|
||||||
});
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
<div id="barChart" class="admin-chart" ng-controller="BarChartCtrl"></div>
|
|
||||||
|
|
@ -1,53 +0,0 @@
|
||||||
<div class="widgets">
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-4 col-md-6"
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Bar Chart"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/charts/amCharts/barChart/barChart.html'"></div>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-4 col-md-6"
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Area Chart"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/charts/amCharts/areaChart/areaChart.html'"></div>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-4 col-md-12"
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Line Chart"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/charts/amCharts/lineChart/lineChart.html'"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-6"
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Pie Chart"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/charts/amCharts/pieChart/pieChart.html'"></div>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-6"
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Funnel Chart"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/charts/amCharts/funnelChart/funnelChart.html'"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-12"
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Combined bullet/column and line graphs with multiple value axes"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/charts/amCharts/combinedChart/combinedChart.html'"></div>
|
|
||||||
</div>
|
|
||||||
<!--<div class="col-md-6">-->
|
|
||||||
<!--<div ba-panel ba-panel-title="Gantt chart" ba-panel-class="with-scroll">-->
|
|
||||||
<!--<div ng-include="'app/pages/charts/amCharts/ganttChart/ganttChart.html'"></div>-->
|
|
||||||
<!--</div>-->
|
|
||||||
<!--</div>-->
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
<div id="zoomAxisChart" class="admin-chart" ng-controller="combinedChartCtrl"></div>
|
|
||||||
|
|
@ -1,248 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 22.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.amCharts')
|
|
||||||
.controller('combinedChartCtrl', combinedChartCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function combinedChartCtrl($element, baConfig, layoutPaths) {
|
|
||||||
var layoutColors = baConfig.colors;
|
|
||||||
var id = $element[0].getAttribute('id');
|
|
||||||
var chart = AmCharts.makeChart(id, {
|
|
||||||
"type": "serial",
|
|
||||||
"theme": "none",
|
|
||||||
"color": layoutColors.defaultText,
|
|
||||||
"dataDateFormat": "YYYY-MM-DD",
|
|
||||||
"precision": 2,
|
|
||||||
"valueAxes": [{
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
axisColor: layoutColors.defaultText,
|
|
||||||
gridColor: layoutColors.defaultText,
|
|
||||||
"id": "v1",
|
|
||||||
"title": "Sales",
|
|
||||||
"position": "left",
|
|
||||||
"autoGridCount": false,
|
|
||||||
"labelFunction": function(value) {
|
|
||||||
return "$" + Math.round(value) + "M";
|
|
||||||
}
|
|
||||||
}, {
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
axisColor: layoutColors.defaultText,
|
|
||||||
gridColor: layoutColors.defaultText,
|
|
||||||
"id": "v2",
|
|
||||||
"title": "Market Days",
|
|
||||||
"gridAlpha": 0,
|
|
||||||
"position": "right",
|
|
||||||
"autoGridCount": false
|
|
||||||
}],
|
|
||||||
"graphs": [{
|
|
||||||
"id": "g3",
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
"valueAxis": "v1",
|
|
||||||
"lineColor": layoutColors.primaryLight,
|
|
||||||
"fillColors": layoutColors.primaryLight,
|
|
||||||
"fillAlphas": 0.8,
|
|
||||||
"lineAlpha": 0.8,
|
|
||||||
"type": "column",
|
|
||||||
"title": "Actual Sales",
|
|
||||||
"valueField": "sales2",
|
|
||||||
"clustered": false,
|
|
||||||
"columnWidth": 0.5,
|
|
||||||
"lineColorField" : layoutColors.defaultText,
|
|
||||||
"legendValueText": "$[[value]]M",
|
|
||||||
"balloonText": "[[title]]<br/><b style='font-size: 130%'>$[[value]]M</b>"
|
|
||||||
}, {
|
|
||||||
"id": "g4",
|
|
||||||
"valueAxis": "v1",
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
"lineColor": layoutColors.primary,
|
|
||||||
"fillColors": layoutColors.primary,
|
|
||||||
"fillAlphas": 0.9,
|
|
||||||
"lineAlpha": 0.9,
|
|
||||||
"type": "column",
|
|
||||||
"title": "Target Sales",
|
|
||||||
"valueField": "sales1",
|
|
||||||
"clustered": false,
|
|
||||||
"columnWidth": 0.3,
|
|
||||||
"legendValueText": "$[[value]]M",
|
|
||||||
"balloonText": "[[title]]<br/><b style='font-size: 130%'>$[[value]]M</b>"
|
|
||||||
}, {
|
|
||||||
"id": "g1",
|
|
||||||
"valueAxis": "v2",
|
|
||||||
"bullet": "round",
|
|
||||||
"bulletBorderAlpha": 1,
|
|
||||||
"bulletColor": layoutColors.defaultText,
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
"bulletSize": 5,
|
|
||||||
"hideBulletsCount": 50,
|
|
||||||
"lineThickness": 2,
|
|
||||||
"lineColor": layoutColors.danger,
|
|
||||||
"type": "smoothedLine",
|
|
||||||
"title": "Market Days",
|
|
||||||
"useLineColorForBulletBorder": true,
|
|
||||||
"valueField": "market1",
|
|
||||||
"balloonText": "[[title]]<br/><b style='font-size: 130%'>[[value]]</b>"
|
|
||||||
}, {
|
|
||||||
"id": "g2",
|
|
||||||
"valueAxis": "v2",
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
"bullet": "round",
|
|
||||||
"bulletBorderAlpha": 1,
|
|
||||||
"bulletColor": layoutColors.defaultText,
|
|
||||||
"bulletSize": 5,
|
|
||||||
"hideBulletsCount": 50,
|
|
||||||
"lineThickness": 2,
|
|
||||||
"lineColor": layoutColors.warning,
|
|
||||||
"type": "smoothedLine",
|
|
||||||
"dashLength": 5,
|
|
||||||
"title": "Market Days ALL",
|
|
||||||
"useLineColorForBulletBorder": true,
|
|
||||||
"valueField": "market2",
|
|
||||||
"balloonText": "[[title]]<br/><b style='font-size: 130%'>[[value]]</b>"
|
|
||||||
}],
|
|
||||||
"chartScrollbar": {
|
|
||||||
"graph": "g1",
|
|
||||||
"oppositeAxis": false,
|
|
||||||
"offset": 30,
|
|
||||||
gridAlpha: 0,
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
scrollbarHeight: 50,
|
|
||||||
backgroundAlpha: 0,
|
|
||||||
selectedBackgroundAlpha: 0.05,
|
|
||||||
selectedBackgroundColor: layoutColors.defaultText,
|
|
||||||
graphFillAlpha: 0,
|
|
||||||
autoGridCount: true,
|
|
||||||
selectedGraphFillAlpha: 0,
|
|
||||||
graphLineAlpha: 0.2,
|
|
||||||
selectedGraphLineColor: layoutColors.defaultText,
|
|
||||||
selectedGraphLineAlpha: 1
|
|
||||||
},
|
|
||||||
"chartCursor": {
|
|
||||||
"pan": true,
|
|
||||||
"cursorColor" : layoutColors.danger,
|
|
||||||
"valueLineEnabled": true,
|
|
||||||
"valueLineBalloonEnabled": true,
|
|
||||||
"cursorAlpha": 0,
|
|
||||||
"valueLineAlpha": 0.2
|
|
||||||
},
|
|
||||||
"categoryField": "date",
|
|
||||||
"categoryAxis": {
|
|
||||||
"axisColor": layoutColors.defaultText,
|
|
||||||
"color": layoutColors.defaultText,
|
|
||||||
"gridColor": layoutColors.defaultText,
|
|
||||||
"parseDates": true,
|
|
||||||
"dashLength": 1,
|
|
||||||
"minorGridEnabled": true
|
|
||||||
},
|
|
||||||
"legend": {
|
|
||||||
"useGraphSettings": true,
|
|
||||||
"position": "top",
|
|
||||||
"color": layoutColors.defaultText
|
|
||||||
},
|
|
||||||
"balloon": {
|
|
||||||
"borderThickness": 1,
|
|
||||||
"shadowAlpha": 0
|
|
||||||
},
|
|
||||||
"export": {
|
|
||||||
"enabled": true
|
|
||||||
},
|
|
||||||
"dataProvider": [{
|
|
||||||
"date": "2013-01-16",
|
|
||||||
"market1": 71,
|
|
||||||
"market2": 75,
|
|
||||||
"sales1": 5,
|
|
||||||
"sales2": 8
|
|
||||||
}, {
|
|
||||||
"date": "2013-01-17",
|
|
||||||
"market1": 74,
|
|
||||||
"market2": 78,
|
|
||||||
"sales1": 4,
|
|
||||||
"sales2": 6
|
|
||||||
}, {
|
|
||||||
"date": "2013-01-18",
|
|
||||||
"market1": 78,
|
|
||||||
"market2": 88,
|
|
||||||
"sales1": 5,
|
|
||||||
"sales2": 2
|
|
||||||
}, {
|
|
||||||
"date": "2013-01-19",
|
|
||||||
"market1": 85,
|
|
||||||
"market2": 89,
|
|
||||||
"sales1": 8,
|
|
||||||
"sales2": 9
|
|
||||||
}, {
|
|
||||||
"date": "2013-01-20",
|
|
||||||
"market1": 82,
|
|
||||||
"market2": 89,
|
|
||||||
"sales1": 9,
|
|
||||||
"sales2": 6
|
|
||||||
}, {
|
|
||||||
"date": "2013-01-21",
|
|
||||||
"market1": 83,
|
|
||||||
"market2": 85,
|
|
||||||
"sales1": 3,
|
|
||||||
"sales2": 5
|
|
||||||
}, {
|
|
||||||
"date": "2013-01-22",
|
|
||||||
"market1": 88,
|
|
||||||
"market2": 92,
|
|
||||||
"sales1": 5,
|
|
||||||
"sales2": 7
|
|
||||||
}, {
|
|
||||||
"date": "2013-01-23",
|
|
||||||
"market1": 85,
|
|
||||||
"market2": 90,
|
|
||||||
"sales1": 7,
|
|
||||||
"sales2": 6
|
|
||||||
}, {
|
|
||||||
"date": "2013-01-24",
|
|
||||||
"market1": 85,
|
|
||||||
"market2": 91,
|
|
||||||
"sales1": 9,
|
|
||||||
"sales2": 5
|
|
||||||
}, {
|
|
||||||
"date": "2013-01-25",
|
|
||||||
"market1": 80,
|
|
||||||
"market2": 84,
|
|
||||||
"sales1": 5,
|
|
||||||
"sales2": 8
|
|
||||||
}, {
|
|
||||||
"date": "2013-01-26",
|
|
||||||
"market1": 87,
|
|
||||||
"market2": 92,
|
|
||||||
"sales1": 4,
|
|
||||||
"sales2": 8
|
|
||||||
}, {
|
|
||||||
"date": "2013-01-27",
|
|
||||||
"market1": 84,
|
|
||||||
"market2": 87,
|
|
||||||
"sales1": 3,
|
|
||||||
"sales2": 4
|
|
||||||
}, {
|
|
||||||
"date": "2013-01-28",
|
|
||||||
"market1": 83,
|
|
||||||
"market2": 88,
|
|
||||||
"sales1": 5,
|
|
||||||
"sales2": 7
|
|
||||||
}, {
|
|
||||||
"date": "2013-01-29",
|
|
||||||
"market1": 84,
|
|
||||||
"market2": 87,
|
|
||||||
"sales1": 5,
|
|
||||||
"sales2": 8
|
|
||||||
}, {
|
|
||||||
"date": "2013-01-30",
|
|
||||||
"market1": 81,
|
|
||||||
"market2": 85,
|
|
||||||
"sales1": 4,
|
|
||||||
"sales2": 7
|
|
||||||
}],
|
|
||||||
pathToImages: layoutPaths.images.amChart
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,70 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovsky
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.amCharts')
|
|
||||||
.controller('FunnelChartCtrl', FunnelChartCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function FunnelChartCtrl($scope, $element, layoutPaths, baConfig) {
|
|
||||||
var layoutColors = baConfig.colors;
|
|
||||||
var id = $element[0].getAttribute('id');
|
|
||||||
var funnelChart = AmCharts.makeChart(id, {
|
|
||||||
type: 'funnel',
|
|
||||||
theme: 'blur',
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
labelTickColor: layoutColors.borderDark,
|
|
||||||
dataProvider: [
|
|
||||||
{
|
|
||||||
title: 'Website visits',
|
|
||||||
value: 300
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'Downloads',
|
|
||||||
value: 123
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'Requested prices',
|
|
||||||
value: 98
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'Contaced',
|
|
||||||
value: 72
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'Purchased',
|
|
||||||
value: 35
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'Asked for support',
|
|
||||||
value: 25
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'Purchased more',
|
|
||||||
value: 18
|
|
||||||
}
|
|
||||||
],
|
|
||||||
titleField: 'title',
|
|
||||||
marginRight: 160,
|
|
||||||
marginLeft: 15,
|
|
||||||
labelPosition: 'right',
|
|
||||||
funnelAlpha: 0.9,
|
|
||||||
valueField: 'value',
|
|
||||||
startX: 0,
|
|
||||||
alpha: 0.8,
|
|
||||||
neckWidth: '0%',
|
|
||||||
startAlpha: 0,
|
|
||||||
outlineThickness: 1,
|
|
||||||
neckHeight: '0%',
|
|
||||||
balloonText: '[[title]]:<b>[[value]]</b>',
|
|
||||||
export: {
|
|
||||||
enabled: true
|
|
||||||
},
|
|
||||||
creditsPosition: 'bottom-left',
|
|
||||||
pathToImages: layoutPaths
|
|
||||||
});
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
<div id="funnelChart" class="admin-chart" ng-controller="FunnelChartCtrl"></div>
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
<div id="gnattChart" class="admin-chart" ng-controller="ganttChartCtrl"></div>
|
|
||||||
|
|
@ -1,297 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 22.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.amCharts')
|
|
||||||
.controller('ganttChartCtrl', ganttChartCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function ganttChartCtrl($element) {
|
|
||||||
var id = $element[0].getAttribute('id');
|
|
||||||
var chart = AmCharts.makeChart( id, {
|
|
||||||
"type": "gantt",
|
|
||||||
"theme": "light",
|
|
||||||
"marginRight": 70,
|
|
||||||
"period": "hh",
|
|
||||||
"dataDateFormat":"YYYY-MM-DD",
|
|
||||||
"balloonDateFormat": "JJ:NN",
|
|
||||||
"columnWidth": 0.5,
|
|
||||||
"valueAxis": {
|
|
||||||
"type": "date",
|
|
||||||
"minimum": 7,
|
|
||||||
"maximum": 31
|
|
||||||
},
|
|
||||||
"brightnessStep": 10,
|
|
||||||
"graph": {
|
|
||||||
"fillAlphas": 1,
|
|
||||||
"balloonText": "<b>[[task]]</b>: [[open]] [[value]]"
|
|
||||||
},
|
|
||||||
"rotate": true,
|
|
||||||
"categoryField": "category",
|
|
||||||
"segmentsField": "segments",
|
|
||||||
"colorField": "color",
|
|
||||||
"startDate": "2015-01-01",
|
|
||||||
"startField": "start",
|
|
||||||
"endField": "end",
|
|
||||||
"durationField": "duration",
|
|
||||||
"dataProvider": [
|
|
||||||
{
|
|
||||||
"category": "John",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 7,
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#46615e",
|
|
||||||
"task": "Task #1"
|
|
||||||
}, {
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
}, {
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#8dc49f",
|
|
||||||
"task": "Task #3"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Smith",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 10,
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
}, {
|
|
||||||
"duration": 1,
|
|
||||||
"color": "#8dc49f",
|
|
||||||
"task": "Task #3"
|
|
||||||
}, {
|
|
||||||
"duration": 4,
|
|
||||||
"color": "#46615e",
|
|
||||||
"task": "Task #1"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Ben",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 12,
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
}, {
|
|
||||||
"start": 16,
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#FFE4C4",
|
|
||||||
"task": "Task #4"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Mike",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 9,
|
|
||||||
"duration": 6,
|
|
||||||
"color": "#46615e",
|
|
||||||
"task": "Task #1"
|
|
||||||
}, {
|
|
||||||
"duration": 4,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Lenny",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 8,
|
|
||||||
"duration": 1,
|
|
||||||
"color": "#8dc49f",
|
|
||||||
"task": "Task #3"
|
|
||||||
}, {
|
|
||||||
"duration": 4,
|
|
||||||
"color": "#46615e",
|
|
||||||
"task": "Task #1"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Scott",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 15,
|
|
||||||
"duration": 3,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Julia",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 9,
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#46615e",
|
|
||||||
"task": "Task #1"
|
|
||||||
}, {
|
|
||||||
"duration": 1,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
}, {
|
|
||||||
"duration": 8,
|
|
||||||
"color": "#8dc49f",
|
|
||||||
"task": "Task #3"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Bob",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 9,
|
|
||||||
"duration": 8,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
}, {
|
|
||||||
"duration": 7,
|
|
||||||
"color": "#8dc49f",
|
|
||||||
"task": "Task #3"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Kendra",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 11,
|
|
||||||
"duration": 8,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
}, {
|
|
||||||
"start": 16,
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#FFE4C4",
|
|
||||||
"task": "Task #4"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Tom",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 9,
|
|
||||||
"duration": 4,
|
|
||||||
"color": "#46615e",
|
|
||||||
"task": "Task #1"
|
|
||||||
}, {
|
|
||||||
"duration": 3,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
}, {
|
|
||||||
"duration": 5,
|
|
||||||
"color": "#8dc49f",
|
|
||||||
"task": "Task #3"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Kyle",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 6,
|
|
||||||
"duration": 3,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Anita",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 12,
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
}, {
|
|
||||||
"start": 16,
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#FFE4C4",
|
|
||||||
"task": "Task #4"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Jack",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 8,
|
|
||||||
"duration": 10,
|
|
||||||
"color": "#46615e",
|
|
||||||
"task": "Task #1"
|
|
||||||
}, {
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Kim",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 12,
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
}, {
|
|
||||||
"duration": 3,
|
|
||||||
"color": "#8dc49f",
|
|
||||||
"task": "Task #3"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Aaron",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 18,
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
}, {
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#FFE4C4",
|
|
||||||
"task": "Task #4"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Alan",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 17,
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#46615e",
|
|
||||||
"task": "Task #1"
|
|
||||||
}, {
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
}, {
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#8dc49f",
|
|
||||||
"task": "Task #3"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Ruth",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 13,
|
|
||||||
"duration": 2,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
}, {
|
|
||||||
"duration": 1,
|
|
||||||
"color": "#8dc49f",
|
|
||||||
"task": "Task #3"
|
|
||||||
}, {
|
|
||||||
"duration": 4,
|
|
||||||
"color": "#46615e",
|
|
||||||
"task": "Task #1"
|
|
||||||
} ]
|
|
||||||
}, {
|
|
||||||
"category": "Simon",
|
|
||||||
"segments": [ {
|
|
||||||
"start": 10,
|
|
||||||
"duration": 3,
|
|
||||||
"color": "#727d6f",
|
|
||||||
"task": "Task #2"
|
|
||||||
}, {
|
|
||||||
"start": 17,
|
|
||||||
"duration": 4,
|
|
||||||
"color": "#FFE4C4",
|
|
||||||
"task": "Task #4"
|
|
||||||
} ]
|
|
||||||
} ],
|
|
||||||
"valueScrollbar": {
|
|
||||||
"autoGridCount":true
|
|
||||||
},
|
|
||||||
"chartCursor": {
|
|
||||||
"cursorColor":"#55bb76",
|
|
||||||
"valueBalloonsEnabled": false,
|
|
||||||
"cursorAlpha": 0,
|
|
||||||
"valueLineAlpha":0.5,
|
|
||||||
"valueLineBalloonEnabled": true,
|
|
||||||
"valueLineEnabled": true,
|
|
||||||
"zoomable":false,
|
|
||||||
"valueZoomable":true
|
|
||||||
},
|
|
||||||
"export": {
|
|
||||||
"enabled": true
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,158 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovsky
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.amCharts')
|
|
||||||
.controller('LineChartCtrl', LineChartCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function LineChartCtrl($scope, baConfig, $element, layoutPaths) {
|
|
||||||
var layoutColors = baConfig.colors;
|
|
||||||
var id = $element[0].getAttribute('id');
|
|
||||||
var lineChart = AmCharts.makeChart(id, {
|
|
||||||
type: 'serial',
|
|
||||||
theme: 'blur',
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
marginTop: 0,
|
|
||||||
marginRight: 15,
|
|
||||||
dataProvider: [
|
|
||||||
{
|
|
||||||
year: '1990',
|
|
||||||
value: -0.17
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '1991',
|
|
||||||
value: -0.254
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '1992',
|
|
||||||
value: 0.019
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '1993',
|
|
||||||
value: -0.063
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '1994',
|
|
||||||
value: 0.005
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '1995',
|
|
||||||
value: 0.077
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '1996',
|
|
||||||
value: 0.12
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '1997',
|
|
||||||
value: 0.011
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '1998',
|
|
||||||
value: 0.177
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '1999',
|
|
||||||
value: -0.021
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '2000',
|
|
||||||
value: -0.037
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '2001',
|
|
||||||
value: 0.03
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '2002',
|
|
||||||
value: 0.179
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '2003',
|
|
||||||
value: 0.2
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '2004',
|
|
||||||
value: 0.180
|
|
||||||
},
|
|
||||||
{
|
|
||||||
year: '2005',
|
|
||||||
value: 0.21
|
|
||||||
}
|
|
||||||
],
|
|
||||||
valueAxes: [
|
|
||||||
{
|
|
||||||
axisAlpha: 0,
|
|
||||||
position: 'left',
|
|
||||||
gridAlpha: 0.5,
|
|
||||||
gridColor: layoutColors.border,
|
|
||||||
}
|
|
||||||
],
|
|
||||||
graphs: [
|
|
||||||
{
|
|
||||||
id: 'g1',
|
|
||||||
balloonText: '[[value]]',
|
|
||||||
bullet: 'round',
|
|
||||||
bulletSize: 8,
|
|
||||||
lineColor: layoutColors.danger,
|
|
||||||
lineThickness: 1,
|
|
||||||
negativeLineColor: layoutColors.warning,
|
|
||||||
type: 'smoothedLine',
|
|
||||||
valueField: 'value'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
chartScrollbar: {
|
|
||||||
graph: 'g1',
|
|
||||||
gridAlpha: 0,
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
scrollbarHeight: 55,
|
|
||||||
backgroundAlpha: 0,
|
|
||||||
selectedBackgroundAlpha: 0.05,
|
|
||||||
selectedBackgroundColor: layoutColors.defaultText,
|
|
||||||
graphFillAlpha: 0,
|
|
||||||
autoGridCount: true,
|
|
||||||
selectedGraphFillAlpha: 0,
|
|
||||||
graphLineAlpha: 0.2,
|
|
||||||
selectedGraphLineColor: layoutColors.defaultText,
|
|
||||||
selectedGraphLineAlpha: 1
|
|
||||||
},
|
|
||||||
chartCursor: {
|
|
||||||
categoryBalloonDateFormat: 'YYYY',
|
|
||||||
cursorAlpha: 0,
|
|
||||||
valueLineEnabled: true,
|
|
||||||
valueLineBalloonEnabled: true,
|
|
||||||
valueLineAlpha: 0.5,
|
|
||||||
fullWidth: true
|
|
||||||
},
|
|
||||||
dataDateFormat: 'YYYY',
|
|
||||||
categoryField: 'year',
|
|
||||||
categoryAxis: {
|
|
||||||
minPeriod: 'YYYY',
|
|
||||||
parseDates: true,
|
|
||||||
minorGridAlpha: 0.1,
|
|
||||||
minorGridEnabled: true,
|
|
||||||
gridAlpha: 0.5,
|
|
||||||
gridColor: layoutColors.border,
|
|
||||||
},
|
|
||||||
export: {
|
|
||||||
enabled: true
|
|
||||||
},
|
|
||||||
creditsPosition: 'bottom-right',
|
|
||||||
pathToImages: layoutPaths.images.amChart
|
|
||||||
});
|
|
||||||
|
|
||||||
lineChart.addListener('rendered', zoomChart);
|
|
||||||
if (lineChart.zoomChart) {
|
|
||||||
lineChart.zoomChart();
|
|
||||||
}
|
|
||||||
|
|
||||||
function zoomChart() {
|
|
||||||
lineChart.zoomToIndexes(Math.round(lineChart.dataProvider.length * 0.4), Math.round(lineChart.dataProvider.length * 0.55));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
<div id="lineChart" class="admin-chart" ng-controller="LineChartCtrl"></div>
|
|
||||||
|
|
@ -1,148 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovsky
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.amCharts')
|
|
||||||
.controller('PieChartCtrl', PieChartCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function PieChartCtrl($element, layoutPaths, baConfig) {
|
|
||||||
var layoutColors = baConfig.colors;
|
|
||||||
var id = $element[0].getAttribute('id');
|
|
||||||
var pieChart = AmCharts.makeChart(id, {
|
|
||||||
type: 'pie',
|
|
||||||
startDuration: 0,
|
|
||||||
theme: 'blur',
|
|
||||||
addClassNames: true,
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
labelTickColor: layoutColors.borderDark,
|
|
||||||
legend: {
|
|
||||||
position: 'right',
|
|
||||||
marginRight: 100,
|
|
||||||
autoMargins: false,
|
|
||||||
},
|
|
||||||
innerRadius: '40%',
|
|
||||||
defs: {
|
|
||||||
filter: [
|
|
||||||
{
|
|
||||||
id: 'shadow',
|
|
||||||
width: '200%',
|
|
||||||
height: '200%',
|
|
||||||
feOffset: {
|
|
||||||
result: 'offOut',
|
|
||||||
in: 'SourceAlpha',
|
|
||||||
dx: 0,
|
|
||||||
dy: 0
|
|
||||||
},
|
|
||||||
feGaussianBlur: {
|
|
||||||
result: 'blurOut',
|
|
||||||
in: 'offOut',
|
|
||||||
stdDeviation: 5
|
|
||||||
},
|
|
||||||
feBlend: {
|
|
||||||
in: 'SourceGraphic',
|
|
||||||
in2: 'blurOut',
|
|
||||||
mode: 'normal'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
dataProvider: [
|
|
||||||
{
|
|
||||||
country: 'Lithuania',
|
|
||||||
litres: 501.9
|
|
||||||
},
|
|
||||||
{
|
|
||||||
country: 'Czech Republic',
|
|
||||||
litres: 301.9
|
|
||||||
},
|
|
||||||
{
|
|
||||||
country: 'Ireland',
|
|
||||||
litres: 201.1
|
|
||||||
},
|
|
||||||
{
|
|
||||||
country: 'Germany',
|
|
||||||
litres: 165.8
|
|
||||||
},
|
|
||||||
{
|
|
||||||
country: 'Australia',
|
|
||||||
litres: 139.9
|
|
||||||
},
|
|
||||||
{
|
|
||||||
country: 'Austria',
|
|
||||||
litres: 128.3
|
|
||||||
},
|
|
||||||
{
|
|
||||||
country: 'UK',
|
|
||||||
litres: 99
|
|
||||||
},
|
|
||||||
{
|
|
||||||
country: 'Belgium',
|
|
||||||
litres: 60
|
|
||||||
}
|
|
||||||
],
|
|
||||||
valueField: 'litres',
|
|
||||||
titleField: 'country',
|
|
||||||
export: {
|
|
||||||
enabled: true
|
|
||||||
},
|
|
||||||
creditsPosition: 'bottom-left',
|
|
||||||
|
|
||||||
autoMargins: false,
|
|
||||||
marginTop: 10,
|
|
||||||
alpha: 0.8,
|
|
||||||
marginBottom: 0,
|
|
||||||
marginLeft: 0,
|
|
||||||
marginRight: 0,
|
|
||||||
pullOutRadius: 0,
|
|
||||||
pathToImages: layoutPaths.images.amChart,
|
|
||||||
responsive: {
|
|
||||||
enabled: true,
|
|
||||||
rules: [
|
|
||||||
// at 900px wide, we hide legend
|
|
||||||
{
|
|
||||||
maxWidth: 900,
|
|
||||||
overrides: {
|
|
||||||
legend: {
|
|
||||||
enabled: false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
// at 200 px we hide value axis labels altogether
|
|
||||||
{
|
|
||||||
maxWidth: 200,
|
|
||||||
overrides: {
|
|
||||||
valueAxes: {
|
|
||||||
labelsEnabled: false
|
|
||||||
},
|
|
||||||
marginTop: 30,
|
|
||||||
marginBottom: 30,
|
|
||||||
marginLeft: 30,
|
|
||||||
marginRight: 30
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
pieChart.addListener('init', handleInit);
|
|
||||||
|
|
||||||
pieChart.addListener('rollOverSlice', function (e) {
|
|
||||||
handleRollOver(e);
|
|
||||||
});
|
|
||||||
|
|
||||||
function handleInit() {
|
|
||||||
pieChart.legend.addListener('rollOverItem', handleRollOver);
|
|
||||||
}
|
|
||||||
|
|
||||||
function handleRollOver(e) {
|
|
||||||
var wedge = e.dataItem.wedge.node;
|
|
||||||
wedge.parentNode.appendChild(wedge);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
<div id="pieChart" class="admin-chart" ng-controller="PieChartCtrl"></div>
|
|
||||||
|
|
@ -1,81 +0,0 @@
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-4" ng-controller="chartJs1DCtrl">
|
|
||||||
<div ba-panel ba-panel-title="Pie" ba-panel-class="with-scroll ">
|
|
||||||
<div class="chartjs-canvas-holder-first-row">
|
|
||||||
<canvas id="pie" class="chart chart-pie"
|
|
||||||
chart-options="options" chart-data="data" chart-labels="labels"
|
|
||||||
chart-click="changeData">
|
|
||||||
</canvas>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-4" ng-controller="chartJs1DCtrl">
|
|
||||||
<div ba-panel ba-panel-title="Doughnut" ba-panel-class="with-scroll ">
|
|
||||||
<div class="chartjs-canvas-holder-first-row">
|
|
||||||
<canvas id="doughnut" chart-options="options" class="chart chart-doughnut"
|
|
||||||
chart-data="data" chart-labels="labels" chart-click="changeData">
|
|
||||||
</canvas>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-4" ng-controller="chartJs1DCtrl">
|
|
||||||
<div ba-panel ba-panel-title="Polar" ba-panel-class="with-scroll ">
|
|
||||||
<div class="chartjs-canvas-holder-first-row">
|
|
||||||
<canvas id="polar-area" class="chart chart-polar-area"
|
|
||||||
chart-data="data" chart-options="options" chart-labels="labels"
|
|
||||||
chart-click="changeData">
|
|
||||||
</canvas>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row ">
|
|
||||||
<div class="col-md-6" ng-controller="chartJsWaveCtrl">
|
|
||||||
<div ba-panel ba-panel-title="Animated Radar" ba-panel-class="col-eq-height">
|
|
||||||
<div class="chartjs-canvas-holder-second-row">
|
|
||||||
<canvas id="waveLine" class="chart chart-radar" chart-data="[data]" chart-labels="labels"></canvas>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-6" ng-controller="chartJsWaveCtrl">
|
|
||||||
<div ba-panel ba-panel-title="Animated Bars" ba-panel-class="col-eq-height">
|
|
||||||
<div class="chartjs-canvas-holder-second-row">
|
|
||||||
<canvas id="waveBars" class="chart chart-bar" chart-data="[data]" chart-labels="labels"></canvas>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="row ">
|
|
||||||
<div class="col-lg-4 col-md-6" ng-controller="chartJs2DCtrl">
|
|
||||||
<div ba-panel ba-panel-title="Radar" ba-panel-class="with-scroll ">
|
|
||||||
<div class="chartjs-canvas-holder-third-row">
|
|
||||||
<canvas id="radar" class="chart chart-radar" chart-series="series" chart-data="data"
|
|
||||||
chart-labels="labels" chart-click="changeData">
|
|
||||||
</canvas>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-4 col-md-6" ng-controller="chartJs2DCtrl">
|
|
||||||
<div ba-panel ba-panel-title="Line" ba-panel-class="with-scroll ">
|
|
||||||
<div class="chartjs-canvas-holder-third-row">
|
|
||||||
<canvas id="line" class="chart chart-line" chart-data="data" chart-labels="labels"
|
|
||||||
chart-series="series" chart-click="changeData"></canvas>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-4 col-md-12" ng-controller="chartJs2DCtrl">
|
|
||||||
<div ba-panel ba-panel-title="Bars" ba-panel-class="with-scroll ">
|
|
||||||
<div class="chartjs-canvas-holder-third-row">
|
|
||||||
<canvas id="bar" class="chart chart-bar"
|
|
||||||
chart-data="data" chart-labels="labels" chart-series="series" chart-click="changeData" chart-update="updateC">
|
|
||||||
</canvas>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -1,72 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 12/16/15
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.chartJs', [])
|
|
||||||
.config(routeConfig).config(chartJsConfig);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function routeConfig($stateProvider) {
|
|
||||||
$stateProvider
|
|
||||||
.state('charts.chartJs', {
|
|
||||||
url: '/chartJs',
|
|
||||||
templateUrl: 'app/pages/charts/chartJs/chartJs.html',
|
|
||||||
title: 'Chart.js',
|
|
||||||
sidebarMeta: {
|
|
||||||
order: 200
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function chartJsConfig(ChartJsProvider, baConfigProvider) {
|
|
||||||
var layoutColors = baConfigProvider.colors;
|
|
||||||
// Configure all charts
|
|
||||||
ChartJsProvider.setOptions({
|
|
||||||
chartColors: [
|
|
||||||
layoutColors.primary, layoutColors.danger, layoutColors.warning, layoutColors.success, layoutColors.info, layoutColors.default, layoutColors.primaryDark, layoutColors.successDark, layoutColors.warningLight, layoutColors.successLight, layoutColors.primaryLight],
|
|
||||||
responsive: true,
|
|
||||||
maintainAspectRatio: false,
|
|
||||||
animation: {
|
|
||||||
duration: 2500
|
|
||||||
},
|
|
||||||
scale: {
|
|
||||||
gridLines: {
|
|
||||||
color: layoutColors.border
|
|
||||||
},
|
|
||||||
scaleLabel: {
|
|
||||||
fontColor: layoutColors.defaultText
|
|
||||||
},
|
|
||||||
ticks: {
|
|
||||||
fontColor: layoutColors.defaultText,
|
|
||||||
showLabelBackdrop: false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
// Configure all line charts
|
|
||||||
ChartJsProvider.setOptions('Line', {
|
|
||||||
datasetFill: false
|
|
||||||
});
|
|
||||||
// Configure all radar charts
|
|
||||||
ChartJsProvider.setOptions('radar', {
|
|
||||||
scale: {
|
|
||||||
pointLabels: {
|
|
||||||
fontColor: layoutColors.defaultText
|
|
||||||
},
|
|
||||||
ticks: {
|
|
||||||
maxTicksLimit: 5,
|
|
||||||
display: false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
// Configure all bar charts
|
|
||||||
ChartJsProvider.setOptions('bar', {
|
|
||||||
tooltips: {
|
|
||||||
enabled: false
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,42 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 12/16/15
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.chartJs')
|
|
||||||
.controller('chartJs1DCtrl', chartJs1DCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function chartJs1DCtrl($scope, baConfig) {
|
|
||||||
var layoutColors = baConfig.colors;
|
|
||||||
|
|
||||||
$scope.labels =["Sleeping", "Designing", "Coding", "Cycling"];
|
|
||||||
$scope.data = [20, 40, 5, 35];
|
|
||||||
$scope.options = {
|
|
||||||
elements: {
|
|
||||||
arc: {
|
|
||||||
borderWidth: 0
|
|
||||||
}
|
|
||||||
},
|
|
||||||
legend: {
|
|
||||||
display: true,
|
|
||||||
position: 'bottom',
|
|
||||||
labels: {
|
|
||||||
fontColor: layoutColors.defaultText
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.changeData = function () {
|
|
||||||
$scope.data = shuffle($scope.data);
|
|
||||||
};
|
|
||||||
|
|
||||||
function shuffle(o){
|
|
||||||
for(var j, x, i = o.length; i; j = Math.floor(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x){}
|
|
||||||
return o;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,32 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 12/16/15
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.chartJs')
|
|
||||||
.controller('chartJs2DCtrl', chartJs2DCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function chartJs2DCtrl($scope) {
|
|
||||||
$scope.labels =["May", "Jun", "Jul", "Aug", "Sep"];
|
|
||||||
$scope.data = [
|
|
||||||
[65, 59, 90, 81, 56],
|
|
||||||
[28, 48, 40, 19, 88]
|
|
||||||
];
|
|
||||||
$scope.series = ['Product A', 'Product B'];
|
|
||||||
|
|
||||||
|
|
||||||
$scope.changeData = function () {
|
|
||||||
$scope.data[0] = shuffle($scope.data[0]);
|
|
||||||
$scope.data[1] = shuffle($scope.data[1]);
|
|
||||||
};
|
|
||||||
|
|
||||||
function shuffle(o){
|
|
||||||
for(var j, x, i = o.length; i; j = Math.floor(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x){}
|
|
||||||
return o;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,29 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 12/16/15
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.chartJs')
|
|
||||||
.controller('chartJsWaveCtrl', chartJsWaveCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function chartJsWaveCtrl($scope, $interval, stopableInterval) {
|
|
||||||
$scope.labels =["Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
|
|
||||||
$scope.data = [1, 9, 3, 4, 5, 6, 7, 8, 2].map(function(e){
|
|
||||||
return Math.sin(e) * 25 +25;
|
|
||||||
});
|
|
||||||
|
|
||||||
stopableInterval.start($interval, function(){
|
|
||||||
var tempArray = [];
|
|
||||||
var lastElement = $scope.data[$scope.data.length-1];
|
|
||||||
for(var i = $scope.data.length-1; i > 0; i--){
|
|
||||||
tempArray[i] = $scope.data[i-1];
|
|
||||||
}
|
|
||||||
tempArray[0] = lastElement;
|
|
||||||
$scope.data = tempArray;
|
|
||||||
}, 400)
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,43 +0,0 @@
|
||||||
<section ng-controller="chartistCtrl" class="chartist">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-6 ">
|
|
||||||
<div ba-panel ba-panel-title="Lines" ba-panel-class="with-scroll ">
|
|
||||||
<h5>Simple line chart</h5>
|
|
||||||
<div id="line-chart" class="ct-chart"></div>
|
|
||||||
<h5>Line chart with area</h5>
|
|
||||||
<div id="area-chart" class="ct-chart"></div>
|
|
||||||
<h5>Bi-polar line chart with area only</h5>
|
|
||||||
<div id="bi-chart" class="ct-chart"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-md-6 ">
|
|
||||||
<div ba-panel ba-panel-title="Bars" ba-panel-class="with-scroll ">
|
|
||||||
<h5>Simple bar chart</h5>
|
|
||||||
<div id="simple-bar" class="ct-chart"></div>
|
|
||||||
<h5>Multi-line labels bar chart</h5>
|
|
||||||
<div id="multi-bar" class="ct-chart"></div>
|
|
||||||
<h5>Stacked bar chart</h5>
|
|
||||||
<div id="stacked-bar" class="ct-chart stacked-bar"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-12">
|
|
||||||
<div ba-panel ba-panel-title="Pies & Donuts" ba-panel-class="with-scroll ">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-12 col-lg-4"><h5>Simple Pie</h5>
|
|
||||||
<div id="simple-pie" class="ct-chart"></div>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-12 col-lg-4"><h5>Pie with labels</h5>
|
|
||||||
<div id="label-pie" class="ct-chart"></div>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-12 col-lg-4"><h5>Donut</h5>
|
|
||||||
<div id="donut" class="ct-chart"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
@ -1,24 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 12/17/15
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.chartist', [])
|
|
||||||
.config(routeConfig);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function routeConfig($stateProvider) {
|
|
||||||
$stateProvider
|
|
||||||
.state('charts.chartist', {
|
|
||||||
url: '/chartist',
|
|
||||||
templateUrl: 'app/pages/charts/chartist/chartist.html',
|
|
||||||
title: 'Chartist',
|
|
||||||
sidebarMeta: {
|
|
||||||
order: 100,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,240 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 12/16/15
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.chartist')
|
|
||||||
.controller('chartistCtrl', chartistCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function chartistCtrl($scope, $timeout, baConfig) {
|
|
||||||
|
|
||||||
$scope.simpleLineOptions = {
|
|
||||||
color: baConfig.colors.defaultText,
|
|
||||||
fullWidth: true,
|
|
||||||
height: "300px",
|
|
||||||
chartPadding: {
|
|
||||||
right: 40
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.simpleLineData = {
|
|
||||||
labels: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri'],
|
|
||||||
series: [
|
|
||||||
[20, 20, 12, 45, 50],
|
|
||||||
[10, 45, 30, 14, 12],
|
|
||||||
[34, 12, 12, 40, 50],
|
|
||||||
[10, 43, 25, 22, 16],
|
|
||||||
[3, 6, 30, 33, 43]
|
|
||||||
]
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.areaLineData = {
|
|
||||||
labels: [1, 2, 3, 4, 5, 6, 7, 8],
|
|
||||||
series: [
|
|
||||||
[5, 9, 7, 8, 5, 3, 5, 4]
|
|
||||||
]
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.areaLineOptions = {
|
|
||||||
fullWidth: true,
|
|
||||||
height: "300px",
|
|
||||||
low: 0,
|
|
||||||
showArea: true
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.biLineData = {
|
|
||||||
labels: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
|
|
||||||
series: [
|
|
||||||
[1, 2, 3, 1, -2, 0, 1],
|
|
||||||
[-2, -1, -2, -1, -2.5, -1, -2],
|
|
||||||
[0, 0, 0, 1, 2, 2.5, 2],
|
|
||||||
[2.5, 2, 1, 0.5, 1, 0.5, -1]
|
|
||||||
]
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.biLineOptions = {
|
|
||||||
height: "300px",
|
|
||||||
high: 3,
|
|
||||||
low: -3,
|
|
||||||
showArea: true,
|
|
||||||
showLine: false,
|
|
||||||
showPoint: false,
|
|
||||||
fullWidth: true,
|
|
||||||
axisX: {
|
|
||||||
showGrid: false
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.simpleBarData = {
|
|
||||||
labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
|
|
||||||
series: [
|
|
||||||
[15, 24, 43, 27, 5, 10, 23, 44, 68, 50, 26, 8],
|
|
||||||
[13, 22, 49, 22, 4, 6, 24, 46, 57, 48, 22, 4]
|
|
||||||
]
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.simpleBarOptions = {
|
|
||||||
fullWidth: true,
|
|
||||||
height: "300px"
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.multiBarData = {
|
|
||||||
labels: ['Quarter 1', 'Quarter 2', 'Quarter 3', 'Quarter 4'],
|
|
||||||
series: [
|
|
||||||
[5, 4, 3, 7],
|
|
||||||
[3, 2, 9, 5],
|
|
||||||
[1, 5, 8, 4],
|
|
||||||
[2, 3, 4, 6],
|
|
||||||
[4, 1, 2, 1]
|
|
||||||
]
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.multiBarOptions = {
|
|
||||||
fullWidth: true,
|
|
||||||
height: "300px",
|
|
||||||
stackBars: true,
|
|
||||||
axisX: {
|
|
||||||
labelInterpolationFnc: function (value) {
|
|
||||||
return value.split(/\s+/).map(function (word) {
|
|
||||||
return word[0];
|
|
||||||
}).join('');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
axisY: {
|
|
||||||
offset: 20
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.multiBarResponsive = [
|
|
||||||
['screen and (min-width: 400px)', {
|
|
||||||
reverseData: true,
|
|
||||||
horizontalBars: true,
|
|
||||||
axisX: {
|
|
||||||
labelInterpolationFnc: Chartist.noop
|
|
||||||
},
|
|
||||||
axisY: {
|
|
||||||
offset: 60
|
|
||||||
}
|
|
||||||
}],
|
|
||||||
['screen and (min-width: 700px)', {
|
|
||||||
stackBars: false,
|
|
||||||
reverseData: false,
|
|
||||||
horizontalBars: false,
|
|
||||||
seriesBarDistance: 15
|
|
||||||
}]
|
|
||||||
];
|
|
||||||
|
|
||||||
$scope.stackedBarData = {
|
|
||||||
labels: ['Quarter 1', 'Quarter 2', 'Quarter 3', 'Quarter 4'],
|
|
||||||
series: [
|
|
||||||
[800000, 1200000, 1400000, 1300000],
|
|
||||||
[200000, 400000, 500000, 300000],
|
|
||||||
[100000, 200000, 400000, 600000]
|
|
||||||
]
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.stackedBarOptions = {
|
|
||||||
fullWidth: true,
|
|
||||||
height: "300px",
|
|
||||||
stackBars: true,
|
|
||||||
axisY: {
|
|
||||||
labelInterpolationFnc: function (value) {
|
|
||||||
return (value / 1000) + 'k';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.simplePieData = {
|
|
||||||
series: [5, 3, 4]
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.simplePieOptions = {
|
|
||||||
fullWidth: true,
|
|
||||||
height: "300px",
|
|
||||||
weight: "300px",
|
|
||||||
labelInterpolationFnc: function (value) {
|
|
||||||
return Math.round(value / 12 * 100) + '%';
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.labelsPieData = {
|
|
||||||
labels: ['Bananas', 'Apples', 'Grapes'],
|
|
||||||
series: [20, 15, 40]
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.labelsPieOptions = {
|
|
||||||
fullWidth: true,
|
|
||||||
height: "300px",
|
|
||||||
weight: "300px",
|
|
||||||
labelDirection: 'explode',
|
|
||||||
labelInterpolationFnc: function (value) {
|
|
||||||
return value[0];
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.simpleDonutData = {
|
|
||||||
labels: ['Bananas', 'Apples', 'Grapes'],
|
|
||||||
series: [20, 15, 40]
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.simpleDonutOptions = {
|
|
||||||
fullWidth: true,
|
|
||||||
donut: true,
|
|
||||||
height: "300px",
|
|
||||||
weight: "300px",
|
|
||||||
labelDirection: 'explode',
|
|
||||||
labelInterpolationFnc: function (value) {
|
|
||||||
return value[0];
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.donutResponsive = getResponsive(5, 40);
|
|
||||||
|
|
||||||
$scope.pieResponsive = getResponsive(20, 80);
|
|
||||||
|
|
||||||
function getResponsive(padding, offset){
|
|
||||||
return [
|
|
||||||
['screen and (min-width: 1550px)', {
|
|
||||||
chartPadding: padding,
|
|
||||||
labelOffset: offset,
|
|
||||||
labelDirection: 'explode',
|
|
||||||
labelInterpolationFnc: function (value) {
|
|
||||||
return value;
|
|
||||||
}
|
|
||||||
}],
|
|
||||||
['screen and (max-width: 1200px)', {
|
|
||||||
chartPadding: padding,
|
|
||||||
labelOffset: offset,
|
|
||||||
labelDirection: 'explode',
|
|
||||||
labelInterpolationFnc: function (value) {
|
|
||||||
return value;
|
|
||||||
}
|
|
||||||
}],
|
|
||||||
['screen and (max-width: 600px)', {
|
|
||||||
chartPadding: 0,
|
|
||||||
labelOffset: 0,
|
|
||||||
labelInterpolationFnc: function (value) {
|
|
||||||
return value[0];
|
|
||||||
}
|
|
||||||
}]
|
|
||||||
];
|
|
||||||
}
|
|
||||||
|
|
||||||
$timeout(function(){
|
|
||||||
new Chartist.Line('#line-chart', $scope.simpleLineData, $scope.simpleLineOptions);
|
|
||||||
new Chartist.Line('#area-chart', $scope.areaLineData, $scope.areaLineOptions);
|
|
||||||
new Chartist.Line('#bi-chart', $scope.biLineData, $scope.biLineOptions);
|
|
||||||
|
|
||||||
new Chartist.Bar('#simple-bar', $scope.simpleBarData, $scope.simpleBarOptions);
|
|
||||||
new Chartist.Bar('#multi-bar', $scope.multiBarData, $scope.multiBarOptions, $scope.multiBarResponsive);
|
|
||||||
new Chartist.Bar('#stacked-bar', $scope.stackedBarData, $scope.stackedBarOptions);
|
|
||||||
|
|
||||||
new Chartist.Pie('#simple-pie', $scope.simplePieData, $scope.simplePieOptions, $scope.pieResponsive);
|
|
||||||
new Chartist.Pie('#label-pie', $scope.labelsPieData, $scope.labelsPieOptions);
|
|
||||||
new Chartist.Pie('#donut', $scope.simpleDonutData, $scope.simpleDonutOptions, $scope.donutResponsive);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,31 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovsky
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts', [
|
|
||||||
'BlurAdmin.pages.charts.amCharts',
|
|
||||||
'BlurAdmin.pages.charts.chartJs',
|
|
||||||
'BlurAdmin.pages.charts.chartist',
|
|
||||||
'BlurAdmin.pages.charts.morris'
|
|
||||||
])
|
|
||||||
.config(routeConfig);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function routeConfig($stateProvider) {
|
|
||||||
$stateProvider
|
|
||||||
.state('charts', {
|
|
||||||
url: '/charts',
|
|
||||||
abstract: true,
|
|
||||||
template: '<div ui-view autoscroll="true" autoscroll-body-top></div>',
|
|
||||||
title: 'Charts',
|
|
||||||
sidebarMeta: {
|
|
||||||
icon: 'ion-stats-bars',
|
|
||||||
order: 150,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,55 +0,0 @@
|
||||||
<section ng-controller="morrisCtrl">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-12">
|
|
||||||
<div ba-panel ba-panel-title="Line Chart" ba-panel-class="with-scroll">
|
|
||||||
<div
|
|
||||||
line-chart
|
|
||||||
line-data='lineData'
|
|
||||||
line-xkey='y'
|
|
||||||
line-ykeys='["a", "b"]'
|
|
||||||
line-labels='["Serie A", "Serie B"]'
|
|
||||||
line-colors='colors'>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-4">
|
|
||||||
<div ba-panel ba-panel-title="Donut" ba-panel-class="with-scroll">
|
|
||||||
<div
|
|
||||||
donut-chart
|
|
||||||
donut-data='donutData'
|
|
||||||
donut-colors='colors'
|
|
||||||
|
|
||||||
donut-formatter='"currency"'>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-8">
|
|
||||||
<div ba-panel ba-panel-title="Bar Chart" ba-panel-class="with-scroll ">
|
|
||||||
<div
|
|
||||||
bar-chart
|
|
||||||
bar-data='barData'
|
|
||||||
bar-x='y'
|
|
||||||
bar-y='["a", "b"]'
|
|
||||||
bar-labels='["Series A", "Series B"]'
|
|
||||||
bar-colors='colors'>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-12">
|
|
||||||
<div ba-panel ba-panel-title="Area Chart" ba-panel-class="with-scroll">
|
|
||||||
<div
|
|
||||||
area-chart
|
|
||||||
area-data='areaData'
|
|
||||||
area-xkey='y'
|
|
||||||
area-ykeys='["a", "b"]' %
|
|
||||||
area-labels='["Serie A", "Serie B"]'
|
|
||||||
line-colors='colors'>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
@ -1,30 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 12/18/15
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.morris', [])
|
|
||||||
.config(routeConfig).config(function(baConfigProvider){
|
|
||||||
var layoutColors = baConfigProvider.colors;
|
|
||||||
Morris.Donut.prototype.defaults.backgroundColor = 'transparent';
|
|
||||||
Morris.Donut.prototype.defaults.labelColor = layoutColors.defaultText;
|
|
||||||
Morris.Grid.prototype.gridDefaults.gridLineColor = layoutColors.borderDark;
|
|
||||||
Morris.Grid.prototype.gridDefaults.gridTextColor = layoutColors.defaultText;
|
|
||||||
});
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function routeConfig($stateProvider) {
|
|
||||||
$stateProvider
|
|
||||||
.state('charts.morris', {
|
|
||||||
url: '/morris',
|
|
||||||
templateUrl: 'app/pages/charts/morris/morris.html',
|
|
||||||
title: 'Morris',
|
|
||||||
sidebarMeta: {
|
|
||||||
order: 300,
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,53 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 12/16/15
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.charts.morris')
|
|
||||||
.controller('morrisCtrl', morrisCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function morrisCtrl($scope, $window, baConfig) {
|
|
||||||
var layoutColors = baConfig.colors;
|
|
||||||
$scope.colors = [layoutColors.primary, layoutColors.warning, layoutColors.danger, layoutColors.info, layoutColors.success, layoutColors.primaryDark];
|
|
||||||
$scope.lineData = [
|
|
||||||
{y: "2006", a: 100, b: 90},
|
|
||||||
{y: "2007", a: 75, b: 65},
|
|
||||||
{y: "2008", a: 50, b: 40},
|
|
||||||
{y: "2009", a: 75, b: 65},
|
|
||||||
{y: "2010", a: 50, b: 40},
|
|
||||||
{y: "2011", a: 75, b: 65},
|
|
||||||
{y: "2012", a: 100, b: 90}
|
|
||||||
];
|
|
||||||
$scope.areaData = [
|
|
||||||
{y: "2006", a: 100, b: 90},
|
|
||||||
{y: "2007", a: 75, b: 65},
|
|
||||||
{y: "2008", a: 50, b: 40},
|
|
||||||
{y: "2009", a: 75, b: 65},
|
|
||||||
{y: "2010", a: 50, b: 40},
|
|
||||||
{y: "2011", a: 75, b: 65},
|
|
||||||
{y: "2012", a: 100, b: 90}
|
|
||||||
];
|
|
||||||
$scope.barData = [
|
|
||||||
{y: "2006", a: 100, b: 90},
|
|
||||||
{y: "2007", a: 75, b: 65},
|
|
||||||
{y: "2008", a: 50, b: 40},
|
|
||||||
{y: "2009", a: 75, b: 65},
|
|
||||||
{y: "2010", a: 50, b: 40},
|
|
||||||
{y: "2011", a: 75, b: 65},
|
|
||||||
{y: "2012", a: 100, b: 90}
|
|
||||||
];
|
|
||||||
$scope.donutData = [
|
|
||||||
{label: "Download Sales", value: 12},
|
|
||||||
{label: "In-Store Sales", value: 30},
|
|
||||||
{label: "Mail-Order Sales", value: 20}
|
|
||||||
];
|
|
||||||
|
|
||||||
angular.element($window).bind('resize', function () {
|
|
||||||
//$window.Morris.Grid.prototype.redraw();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,27 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovsky
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.components.mail')
|
|
||||||
.controller('MailTabCtrl', MailTabCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function MailTabCtrl(composeModal, mailMessages) {
|
|
||||||
|
|
||||||
var vm = this;
|
|
||||||
vm.navigationCollapsed = true;
|
|
||||||
vm.showCompose = function(subject, to , text){
|
|
||||||
composeModal.open({
|
|
||||||
subject : subject,
|
|
||||||
to: to,
|
|
||||||
text: text
|
|
||||||
})
|
|
||||||
};
|
|
||||||
|
|
||||||
vm.tabs = mailMessages.getTabs();
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,26 +0,0 @@
|
||||||
<div class="compose-header">
|
|
||||||
<span>
|
|
||||||
New message
|
|
||||||
</span>
|
|
||||||
<span class="header-controls">
|
|
||||||
<i class="ion-minus-round"></i>
|
|
||||||
<i class="ion-arrow-resize"></i>
|
|
||||||
<i ng-click="$dismiss()" class="ion-close-round"></i>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<input type="text" class="form-control compose-input default-color" placeholder="To" ng-model="boxCtrl.to">
|
|
||||||
<input type="text" class="form-control compose-input default-color" placeholder="Subject" ng-model="boxCtrl.subject">
|
|
||||||
<div class="compose-container">
|
|
||||||
<text-angular-toolbar ta-toolbar-class="toolbarMain" name="toolbarMain" ta-toolbar="[['h1','h2','h3','bold','italics', 'underline', 'justifyLeft', 'justifyCenter', 'justifyRight', 'justifyFull']]"></text-angular-toolbar>
|
|
||||||
<text-angular name="htmlcontent" ta-target-toolbars='toolbarMain,toolbarFooter' ng-model="boxCtrl.text"></text-angular>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="compose-footer clearfix">
|
|
||||||
<button type="button" ng-click="$dismiss()" class="btn btn-send">Send</button>
|
|
||||||
<text-angular-toolbar ta-toolbar-class="toolbarFooter" name="toolbarFooter" ta-toolbar="[['insertLink', 'insertImage', 'html', 'quote','insertVideo']]"></text-angular-toolbar>
|
|
||||||
<div class="footer-controls">
|
|
||||||
<i class="footer-control-first compose-footer-icon ion-arrow-down-b"></i>
|
|
||||||
<i ng-click="$dismiss()" class="compose-footer-icon ion-android-delete"></i>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,18 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 24/12/15
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.components.mail')
|
|
||||||
.controller('composeBoxCtrl', composeBoxCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function composeBoxCtrl(subject, to, text) {
|
|
||||||
var vm = this;
|
|
||||||
vm.subject = subject;
|
|
||||||
vm.to = to;
|
|
||||||
vm.text = text;
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,18 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 28.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.components.mail')
|
|
||||||
.controller('MailDetailCtrl', MailDetailCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function MailDetailCtrl($stateParams, mailMessages) {
|
|
||||||
var vm = this;
|
|
||||||
vm.mail = mailMessages.getMessageById($stateParams.id);
|
|
||||||
vm.label = $stateParams.label;
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,82 +0,0 @@
|
||||||
<div class="message-container" ng-class="{'expanded': tabCtrl.navigationCollapsed}">
|
|
||||||
<div class="message">
|
|
||||||
<div class="row">
|
|
||||||
<div class="toggle-navigation-container detail-page">
|
|
||||||
<a href class="collapse-navigation-link ion-navicon"
|
|
||||||
ng-click="tabCtrl.navigationCollapsed=!tabCtrl.navigationCollapsed"></a>
|
|
||||||
</div>
|
|
||||||
<button ui-sref="components.mail.label({label : detailCtrl.label})" type="button" class="back-button btn btn-default btn-with-icon"><i
|
|
||||||
class="ion-chevron-left"></i>Back
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="person-info row">
|
|
||||||
<div class="col-lg-4 col-md-12 no-padding">
|
|
||||||
<img ng-src="{{detailCtrl.mail.name.split(' ')[0] | profilePicture}}" class="human-picture">
|
|
||||||
|
|
||||||
<div class="name">
|
|
||||||
<h2 class="name-h">{{detailCtrl.mail.name.split(' ')[0]}}</h2>
|
|
||||||
|
|
||||||
<h2 class="name-h second-name">{{detailCtrl.mail.name.split(' ')[1]}}</h2>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<span class="mail-tag tag label {{detailCtrl.mail.tag}}">{{detailCtrl.mail.tag}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-4 col-md-6 col-xs-12 no-padding">
|
|
||||||
<div class="contact-info phone-email">
|
|
||||||
<div>
|
|
||||||
<i class="ion-iphone"></i>
|
|
||||||
<span class="phone">777-777-7777</span>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<i class="ion-email"></i>
|
|
||||||
<span class="email">{{detailCtrl.mail.email}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-lg-4 col-md-6 col-xs-12 no-padding">
|
|
||||||
<div class="contact-info position-address">
|
|
||||||
<div>
|
|
||||||
<span class="position">{{detailCtrl.mail.position}}</span>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<span class="address">12 Nezavisimosti st. Vilnius, Lithuania</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
</div>
|
|
||||||
<div class="line"></div>
|
|
||||||
<div class="message-details">
|
|
||||||
<span class="subject">{{detailCtrl.mail.subject}} </span>
|
|
||||||
<span class="date">• {{detailCtrl.mail.date | date : 'h:mm a MMMM d '}}</span>
|
|
||||||
</div>
|
|
||||||
<div class="line"></div>
|
|
||||||
<div ng-bind-html="detailCtrl.mail.body" class="message-body">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class="line"></div>
|
|
||||||
<div class="attachment" ng-show="detailCtrl.mail.attachment">
|
|
||||||
<span class="file-links">1 Attachment - <a href>View</a> | <a href>Download</a></span>
|
|
||||||
<div>
|
|
||||||
<i class="file-icon ion-document"></i>
|
|
||||||
<span class="file-name">{{detailCtrl.mail.attachment}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="line" ng-show="detailCtrl.mail.attachment"></div>
|
|
||||||
<div class="answer-container">
|
|
||||||
<button type="button" class="btn btn-with-icon" ng-click="tabCtrl.showCompose(detailCtrl.mail.subject,detailCtrl.mail.email,'')"><i class="ion-reply"></i>Reply</button>
|
|
||||||
<button type="button" class="btn btn-with-icon" ng-click="tabCtrl.showCompose(detailCtrl.mail.subject,'',detailCtrl.mail.body)"><i class="ion-forward"></i>Forward</button>
|
|
||||||
<button type="button" class="btn btn-with-icon"><i class="ion-printer"></i>Print</button>
|
|
||||||
<button type="button" class="btn btn-with-icon"><i class="ion-android-remove-circle"></i>Spam</button>
|
|
||||||
<button type="button" class="btn btn-with-icon"><i class="ion-android-delete"></i>Delete</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div ng-show="!detailCtrl.mail">
|
|
||||||
<h5 ng-class="text-center">Nothing to show</h5>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,18 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 28.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.components.mail')
|
|
||||||
.controller('MailListCtrl', MailListCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function MailListCtrl($stateParams, mailMessages) {
|
|
||||||
var vm = this;
|
|
||||||
vm.messages = mailMessages.getMessagesByLabel($stateParams.label);
|
|
||||||
vm.label = $stateParams.label;
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,42 +0,0 @@
|
||||||
<div class="row mail-client-container transparent">
|
|
||||||
<div class="col-md-12">
|
|
||||||
<div ba-panel ba-panel-class="xmedium-panel mail-panel">
|
|
||||||
<div class="letter-layout">
|
|
||||||
<div class="mail-navigation-container" ng-class="{'expanded' : !tabCtrl.navigationCollapsed}">
|
|
||||||
<div class="text-center">
|
|
||||||
<button type="button" class="btn btn-default compose-button" ng-click="tabCtrl.showCompose('','','')">
|
|
||||||
Compose
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div ng-repeat="t in tabCtrl.tabs" ui-sref-active="active" class="mail-navigation"
|
|
||||||
ui-sref="components.mail.label({label: t.label})" ng-click="selectTab(t.label)">
|
|
||||||
{{t.name}}<span class="new-mails" ng-show="t.newMails">{{t.newMails}}</span>
|
|
||||||
</div>
|
|
||||||
<div class="labels">
|
|
||||||
<div class="labels-title">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class="labels-container">
|
|
||||||
<div class="label-item">
|
|
||||||
<span class="tag label work">Work</span>
|
|
||||||
</div>
|
|
||||||
<div class="label-item">
|
|
||||||
<span class="tag label family">Family</span>
|
|
||||||
</div>
|
|
||||||
<div class="label-item">
|
|
||||||
<span class="tag label friend">Friend</span>
|
|
||||||
</div>
|
|
||||||
<div class="label-item">
|
|
||||||
<span class="tag label study">Study</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="add-label-container">
|
|
||||||
<i class="ion-plus-round"></i><span class="label-input-stub">Add new label</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<ui-view></ui-view>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,40 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovsky
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.components.mail', [])
|
|
||||||
.config(routeConfig);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function routeConfig($stateProvider,$urlRouterProvider) {
|
|
||||||
$stateProvider
|
|
||||||
.state('components.mail', {
|
|
||||||
url: '/mail',
|
|
||||||
abstract: true,
|
|
||||||
templateUrl: 'app/pages/components/mail/mail.html',
|
|
||||||
controller: "MailTabCtrl",
|
|
||||||
controllerAs: "tabCtrl",
|
|
||||||
title: 'Mail',
|
|
||||||
sidebarMeta: {
|
|
||||||
order: 0,
|
|
||||||
},
|
|
||||||
}).state('components.mail.label', {
|
|
||||||
url: '/:label',
|
|
||||||
templateUrl: 'app/pages/components/mail/list/mailList.html',
|
|
||||||
title: 'Mail',
|
|
||||||
controller: "MailListCtrl",
|
|
||||||
controllerAs: "listCtrl"
|
|
||||||
}).state('components.mail.detail', {
|
|
||||||
url: '/:label/:id',
|
|
||||||
templateUrl: 'app/pages/components/mail/detail/mailDetail.html',
|
|
||||||
title: 'Mail',
|
|
||||||
controller: "MailDetailCtrl",
|
|
||||||
controllerAs: "detailCtrl"
|
|
||||||
});
|
|
||||||
$urlRouterProvider.when('/components/mail','/components/mail/inbox');
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,249 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 12/29/15
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.components.mail')
|
|
||||||
.service('mailMessages', mailMessages);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function mailMessages($sce) {
|
|
||||||
var messages = [
|
|
||||||
{
|
|
||||||
"id": "4563faass",
|
|
||||||
"name": "Nasta Linnie",
|
|
||||||
"subject": "Great text",
|
|
||||||
"date": "2015-08-28T07:57:09",
|
|
||||||
"body": $sce.trustAsHtml("<p>Hey John, </p><p>Check out this cool text.</p>"),
|
|
||||||
"pic": "img/Nasta.png",
|
|
||||||
"email": "petraramsey@mail.com",
|
|
||||||
"attachment": "poem.txt",
|
|
||||||
"position": "Great Employee",
|
|
||||||
"tag": "friend",
|
|
||||||
"labels": ['inbox']
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "4563fdfvd",
|
|
||||||
"name": "Nasta Linnie",
|
|
||||||
"subject": "Lores ipsum",
|
|
||||||
"date": "2015-11-19T03:30:45",
|
|
||||||
"important": false,
|
|
||||||
"body": $sce.trustAsHtml("<p>Hey John, </p><br><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris ex mauris, ultrices vel lectus quis, scelerisque hendrerit ipsum. Suspendisse ullamcorper turpis neque, eget dapibus magna placerat ac. Suspendisse rhoncus ligula ac mi tempus varius ut sed lacus. Sed et commodo nulla, et placerat leo. Nam rhoncus vulputate sem non pharetra. Praesent fringilla massa in laoreet convallis. Aliquam lobortis dui a congue facilisis. Aenean dapibus semper semper. Quisque aliquam, nibh dapibus interdum condimentum, ex velit tempor tortor, at vestibulum magna leo quis leo. Morbi pulvinar varius erat ac rutrum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In hac habitasse platea dictumst.</p>" +
|
|
||||||
"<br><p>Cras rhoncus quam ipsum, vel dignissim nisl egestas sed. Aliquam erat volutpat. Integer eu nisl elit. Donec malesuada diam vitae tellus luctus tincidunt. Donec tempus blandit neque, rutrum egestas ipsum sagittis tempor. Curabitur volutpat ligula enim, nec vehicula purus molestie at. Sed a facilisis enim, nec molestie magna. Donec in augue non est viverra dapibus vel tempus risus. Nam porttitor purus sit amet hendrerit ullamcorper. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>"),
|
|
||||||
"pic": "img/Nasta.png",
|
|
||||||
"email": "petraramsey@mail.com",
|
|
||||||
"position": "Great Employee",
|
|
||||||
"tag": "study",
|
|
||||||
"labels": ['inbox']
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "4563zxcss",
|
|
||||||
"name": "Nasta Linnie",
|
|
||||||
"subject": "Lores ipsum",
|
|
||||||
"date": "2015-10-19T03:30:45",
|
|
||||||
"important": false,
|
|
||||||
"body": $sce.trustAsHtml("<p>Hey Nasta, </p><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit</p>"),
|
|
||||||
"pic": "img/Nasta.png",
|
|
||||||
"email": "petraramsey@mail.com",
|
|
||||||
"position": "Great Employee",
|
|
||||||
"tag": "work",
|
|
||||||
"labels": ['sent', 'important']
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "8955sddf",
|
|
||||||
"name": "Nick Cat",
|
|
||||||
"subject": "New Design",
|
|
||||||
"date": "2015-05-05T12:59:45",
|
|
||||||
"body": $sce.trustAsHtml("<p>Hey John, Consectetur adipiscing elit</p><br>" +
|
|
||||||
"<p>Cras rhoncus quam ipsum, vel dignissim nisl egestas sed. Aliquam erat volutpat. Integer eu nisl elit. Donec malesuada diam vitae tellus luctus tincidunt. Donec tempus blandit neque, rutrum egestas ipsum sagittis tempor. Curabitur volutpat ligula enim, nec vehicula purus molestie at. Sed a facilisis enim, nec molestie magna. Donec in augue non est viverra dapibus vel tempus risus. Nam porttitor purus sit amet hendrerit ullamcorper. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>"),
|
|
||||||
"pic": "img/Nick.png",
|
|
||||||
"email": "barlowshort@mail.com",
|
|
||||||
"position": "Graphical designer",
|
|
||||||
"attachment": "design.psd",
|
|
||||||
"tag": "work",
|
|
||||||
"labels": ['inbox']
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "8955sdfcc",
|
|
||||||
"name": "Nick Cat",
|
|
||||||
"subject": "Gift card",
|
|
||||||
"date": "2015-07-18T10:19:01",
|
|
||||||
"body": $sce.trustAsHtml("<p>Hey John, </p><br><p>Consectetur adipiscing elit, Lorem ipsum dolor sit amet</p>"),
|
|
||||||
"pic": "img/Nick.png",
|
|
||||||
"email": "barlowshort@mail.com",
|
|
||||||
"position": "Graphical designer",
|
|
||||||
"tag": "study",
|
|
||||||
"labels": ['inbox']
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "8955asewf",
|
|
||||||
"name": "Nick Cat",
|
|
||||||
"subject": "Some news",
|
|
||||||
"date": "2015-09-23T03:04:10",
|
|
||||||
"body": $sce.trustAsHtml("<p>Hey John, </p><br><p>Integer eu nisl elit. Donec malesuada diam vitae tellus luctus tincidunt. Donec tempus blandit neque, rutrum egestas ipsum sagittis tempor. Curabitur volutpat ligula enim, nec vehicula purus molestie at. Sed a facilisis enim, nec molestie magna. Donec in augue non est viverra dapibus vel tempus risus. Nam porttitor purus sit amet hendrerit ullamcorper. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>"),
|
|
||||||
"pic": "img/Nick.png",
|
|
||||||
"email": "barlowshort@mail.com",
|
|
||||||
"position": "Graphical designer",
|
|
||||||
"tag": "work",
|
|
||||||
"labels": ['inbox', 'important']
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "2334uudsa",
|
|
||||||
"name": "Kostya Danovsky",
|
|
||||||
"subject": "Street Art",
|
|
||||||
"date": "2015-11-22T10:05:09",
|
|
||||||
"body": $sce.trustAsHtml("<p>Hey John, </p><p>Aliquam eu facilisis eros, quis varius est.</p>" +
|
|
||||||
"<p>Consectetur adipiscing elit. Aliquam sodales sem in nibh pellentesque, ac dignissim mi dapibus.</p>" +
|
|
||||||
"<p>Lorem ipsum dolor sit amet! Nullam imperdiet justo a ipsum laoreet euismod.</p>" +
|
|
||||||
"<br><p>Cras tincidunt fermentum lectus, quis scelerisque lorem volutpat sed." +
|
|
||||||
"Sed quis orci sed nisl sagittis viverra id at mauris. Nam venenatis mi nibh. Sed fringilla mattis vehic</p>"),
|
|
||||||
"pic": "img/Kostya.png",
|
|
||||||
"email": "schwart@mail.com",
|
|
||||||
"position": "Technical Chef",
|
|
||||||
"attachment": "file.doc",
|
|
||||||
"tag": "family",
|
|
||||||
"labels": ['inbox', 'important']
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "2334aefvv",
|
|
||||||
"name": "Kostya Danovsky",
|
|
||||||
"subject": "New product",
|
|
||||||
"date": "2015-06-22T06:26:10",
|
|
||||||
"body": $sce.trustAsHtml("<p>Hello John, </p><p>Lorem ipsum dolor sit amet!</p>" +
|
|
||||||
"<p>Consectetur adipiscing elit. Aliquam sodales sem in nibh pellentesque, ac dignissim mi dapibus.</p>" +
|
|
||||||
"<p>Aliquam eu facilisis eros, quis varius est. Nullam imperdiet justo a ipsum laoreet euismod.</p>" +
|
|
||||||
"<br><p>Nulla facilisi. Nulla congue, arcu eget blandit lacinia, leo ante ullamcorper lectus, vel pulvinar justo ipsum vitae justo." +
|
|
||||||
"Cras tincidunt fermentum lectus, quis scelerisque lorem volutpat sed. Sed quis orci sed nisl sagittis viverra id at mauris. Nam venenatis mi nibh. Sed fringilla mattis vehic</p>"),
|
|
||||||
"pic": "img/Kostya.png",
|
|
||||||
"email": "schwart@mail.com",
|
|
||||||
"position": "Technical Chef",
|
|
||||||
"tag": "family",
|
|
||||||
"labels": ['inbox', 'important']
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "2334cvdss",
|
|
||||||
"name": "Kostya Danovsky",
|
|
||||||
"subject": "Old product",
|
|
||||||
"date": "2015-06-22T06:26:10",
|
|
||||||
"body": $sce.trustAsHtml("<p>Hello John, </p>" +
|
|
||||||
"<p>Consectetur adipiscing elit. Aliquam sodales sem in nibh pellentesque, ac dignissim mi dapibus.</p>" +
|
|
||||||
"<br>"+
|
|
||||||
"<p>Cras tincidunt fermentum lectus, quis scelerisque lorem volutpat sed. Sed quis orci sed nisl sagittis viverra id at mauris. Nam venenatis mi nibh. Sed fringilla mattis vehic</p>"),
|
|
||||||
"pic": "img/Kostya.png",
|
|
||||||
"email": "schwart@mail.com",
|
|
||||||
"position": "Technical Chef",
|
|
||||||
"tag": "study",
|
|
||||||
"labels": ['trash']
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "8223xzxfn",
|
|
||||||
"name": "Andrey Hrabouski",
|
|
||||||
"subject": "Skype moji",
|
|
||||||
"date": "2015-07-16T06:47:53",
|
|
||||||
"body": $sce.trustAsHtml("<p>Hello John, </p><p>Aliquam sodales sem in nibh pellentesque</p>" +
|
|
||||||
"<p>Lorem ipsum dolor I find moji in skype sit amet!.</p>"),
|
|
||||||
"pic": "img/Andrey.png",
|
|
||||||
"email": "lakeishaphillips@mail.com",
|
|
||||||
"position": "Mobile Developer",
|
|
||||||
"tag": 'family',
|
|
||||||
"labels": ['trash']
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "8223sdffn",
|
|
||||||
"name": "Andrey Hrabouski",
|
|
||||||
"subject": "My App",
|
|
||||||
"date": "2015-06-20T07:05:02",
|
|
||||||
"body": $sce.trustAsHtml("<p>Hey Vlad. </p><p>Lorem ipsum dolor sit amet!</p>" +
|
|
||||||
"<p>Consectetur My Falasson App elit. Aliquam sodales sem in nibh pellentesque, ac dignissim mi dapibus.</p>"),
|
|
||||||
"pic": "img/Andrey.png",
|
|
||||||
"email": "lakeishaphillips@mail.com",
|
|
||||||
"position": "Mobile Developer",
|
|
||||||
"tag": 'family',
|
|
||||||
"labels": ['spam']
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "9391xdsff",
|
|
||||||
"name": "Vlad Lugovsky",
|
|
||||||
"subject": "Cool",
|
|
||||||
"date": "2015-03-31T11:52:58",
|
|
||||||
"body": $sce.trustAsHtml("<p>Hey Vlad. </p><p>Aliquam sodales sem in nibh pellentesque</p>" +
|
|
||||||
"<p>Cras tincidunt fermentum lectus, quis scelerisque lorem volutpat sed.</p>"),
|
|
||||||
"pic": "img/Vlad.png",
|
|
||||||
"email": "carlsongoodman@mail.com",
|
|
||||||
"position": "Fullstack man",
|
|
||||||
"tag": "study",
|
|
||||||
"labels": ['draft']
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "8223xsdaa",
|
|
||||||
"name": "Andrey Hrabouski",
|
|
||||||
"subject": "Car rent",
|
|
||||||
"date": "2015-02-25T10:58:58",
|
|
||||||
"body": $sce.trustAsHtml("<p>Hey Andrey. </p>" +
|
|
||||||
"<p>Cras tincidunt fermentum lectus, quis scelerisque lorem volutpat sed. Sed quis orci sed nisl sagittis viverra id at mauris. Nam venenatis mi nibh. Sed fringilla mattis vehic</p>"),
|
|
||||||
"pic": "img/Andrey.png",
|
|
||||||
"email": "lakeishaphillips@mail.com",
|
|
||||||
"position": "Mobile Developer",
|
|
||||||
"tag": "family",
|
|
||||||
"labels": ['draft']
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "9391xdsff",
|
|
||||||
"name": "Vlad Lugovsky",
|
|
||||||
"subject": "What next",
|
|
||||||
"date": "2015-03-31T11:52:58",
|
|
||||||
"body": $sce.trustAsHtml("<p>Hey Vlad. </p><p>Lorem ipsum dolor sit amet!</p>" +
|
|
||||||
"<p>Esse esse labore tempor ullamco ullamco. Id veniam laborum c.</p>"),
|
|
||||||
"pic": "img/Vlad.png",
|
|
||||||
"email": "carlsongoodman@mail.com",
|
|
||||||
"position": "Fullstack man",
|
|
||||||
"tag": "study",
|
|
||||||
"labels": ['sent']
|
|
||||||
}
|
|
||||||
].sort(function (a, b) {
|
|
||||||
if (a.date > b.date) return 1;
|
|
||||||
if (a.date < b.date) return -1;
|
|
||||||
}).reverse();
|
|
||||||
var tabs = [{
|
|
||||||
label: 'inbox',
|
|
||||||
name: 'Inbox',
|
|
||||||
newMails: 7
|
|
||||||
}, {
|
|
||||||
label: 'sent',
|
|
||||||
name: 'Sent Mail'
|
|
||||||
}, {
|
|
||||||
label: 'important',
|
|
||||||
name: 'Important'
|
|
||||||
}, {
|
|
||||||
label: 'draft',
|
|
||||||
name: 'Draft',
|
|
||||||
newMails: 2
|
|
||||||
}, {
|
|
||||||
label: 'spam',
|
|
||||||
name: 'Spam'
|
|
||||||
}, {
|
|
||||||
label: 'trash',
|
|
||||||
name: 'Trash'
|
|
||||||
}];
|
|
||||||
|
|
||||||
return{
|
|
||||||
getTabs : function(){
|
|
||||||
return tabs
|
|
||||||
},
|
|
||||||
getMessagesByLabel : function(label){
|
|
||||||
return messages.filter(function(m){
|
|
||||||
return m.labels.indexOf(label) != -1;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
getMessageById : function(id){
|
|
||||||
return messages.filter(function(m){
|
|
||||||
return m.id == id;
|
|
||||||
})[0];
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,44 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.components.timeline')
|
|
||||||
.controller('TimelineCtrl', TimelineCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function TimelineCtrl() {
|
|
||||||
var timelineBlocks = $('.cd-timeline-block'),
|
|
||||||
offset = 0.8;
|
|
||||||
|
|
||||||
//hide timeline blocks which are outside the viewport
|
|
||||||
hideBlocks(timelineBlocks, offset);
|
|
||||||
|
|
||||||
//on scolling, show/animate timeline blocks when enter the viewport
|
|
||||||
$(window).on('scroll', function () {
|
|
||||||
if (!window.requestAnimationFrame) {
|
|
||||||
setTimeout(function () {
|
|
||||||
showBlocks(timelineBlocks, offset);
|
|
||||||
}, 100);
|
|
||||||
} else {
|
|
||||||
window.requestAnimationFrame(function () {
|
|
||||||
showBlocks(timelineBlocks, offset);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
function hideBlocks(blocks, offset) {
|
|
||||||
blocks.each(function () {
|
|
||||||
( $(this).offset().top > $(window).scrollTop() + $(window).height() * offset ) && $(this).find('.cd-timeline-img, .cd-timeline-content').addClass('is-hidden');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function showBlocks(blocks, offset) {
|
|
||||||
blocks.each(function () {
|
|
||||||
( $(this).offset().top <= $(window).scrollTop() + $(window).height() * offset && $(this).find('.cd-timeline-img').hasClass('is-hidden') ) && $(this).find('.cd-timeline-img, .cd-timeline-content').removeClass('is-hidden').addClass('bounce-in');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,101 +0,0 @@
|
||||||
<!-- todo: remove whole block -->
|
|
||||||
<div ba-panel>
|
|
||||||
<section id="cd-timeline" class="cd-container cssanimations" ng-controller="TimelineCtrl">
|
|
||||||
<div class="cd-timeline-block">
|
|
||||||
<div class="cd-timeline-img">
|
|
||||||
<div class="kameleon-icon with-round-bg warning"><img ng-src="{{::( 'Euro-Coin' | kameleonImg )}}"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cd-timeline-content warning">
|
|
||||||
<h5>Title of section 1</h5>
|
|
||||||
|
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto, optio, dolorum provident rerum aut hic quasi
|
|
||||||
placeat iure tempora laudantium ipsa ad debitis unde? Iste voluptatibus minus veritatis qui ut.</p>
|
|
||||||
<span class="cd-date">Jan 14</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cd-timeline-block">
|
|
||||||
<div class="cd-timeline-img">
|
|
||||||
<div class="kameleon-icon with-round-bg danger"><img ng-src="{{::( 'Laptop-Signal' | kameleonImg )}}"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cd-timeline-content danger">
|
|
||||||
<h5>Title of section 2</h5>
|
|
||||||
|
|
||||||
<p>Donec dapibus at leo eget volutpat. Praesent dolor tellus, ultricies venenatis molestie eu, luctus eget nibh.
|
|
||||||
Curabitur ullamcorper eleifend nisl.</p>
|
|
||||||
<span class="cd-date">Jan 18</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cd-timeline-block">
|
|
||||||
<div class="cd-timeline-img">
|
|
||||||
<div class="kameleon-icon with-round-bg primary"><img ng-src="{{::( 'Checklist' | kameleonImg )}}"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cd-timeline-content primary">
|
|
||||||
<h5>Title of section 3</h5>
|
|
||||||
|
|
||||||
<p>Phasellus auctor tellus eget lacinia condimentum. Cum sociis natoque penatibus et magnis dis parturient
|
|
||||||
montes.</p>
|
|
||||||
<span class="cd-date">Feb 18</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cd-timeline-block">
|
|
||||||
<div class="cd-timeline-img">
|
|
||||||
<div class="kameleon-icon with-round-bg warning"><img ng-src="{{::( 'Boss-3' | kameleonImg )}}"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cd-timeline-content warning">
|
|
||||||
<h5>Title of section 4</h5>
|
|
||||||
|
|
||||||
<p>Morbi fringilla in massa ac posuere. Fusce non sagittis massa, id accumsan odio. Nullam eget tempor est.
|
|
||||||
Etiam eu felis eu purus aliquam tristique id quis nisl. Nam eros nibh, consequat sed pulvinar eu, ultrices
|
|
||||||
ornare ligula. Aenean interdum sed nunc sed hendrerit.</p>
|
|
||||||
<span class="cd-date">Feb 20</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cd-timeline-block">
|
|
||||||
<div class="cd-timeline-img">
|
|
||||||
<div class="kameleon-icon with-round-bg danger"><img ng-src="{{::( 'Online-Shopping' | kameleonImg )}}"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cd-timeline-content danger">
|
|
||||||
<h5>Title of section 5</h5>
|
|
||||||
|
|
||||||
<p> Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Curabitur eget mattis
|
|
||||||
metus. Nullam egestas eros metus, quis fringilla urna accumsan sed. Aliquam ultrices at arcu vitae
|
|
||||||
tincidunt.</p>
|
|
||||||
<span class="cd-date">Feb 21</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cd-timeline-block">
|
|
||||||
<div class="cd-timeline-img">
|
|
||||||
<div class="kameleon-icon with-round-bg primary"><img ng-src="{{::( 'Money-Increase' | kameleonImg )}}"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cd-timeline-content primary">
|
|
||||||
<h5>Title of section 6</h5>
|
|
||||||
|
|
||||||
<p>Praesent bibendum ante mattis augue consectetur, ut commodo turpis consequat. Donec ligula eros, porta in
|
|
||||||
iaculis vel, semper ac sem. Integer at mauris lorem.</p>
|
|
||||||
<span class="cd-date">Feb 23</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cd-timeline-block">
|
|
||||||
<div class="cd-timeline-img">
|
|
||||||
<div class="kameleon-icon with-round-bg warning"><img ng-src="{{::( 'Vector' | kameleonImg )}}"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cd-timeline-content warning">
|
|
||||||
<h5>Title of section 7</h5>
|
|
||||||
|
|
||||||
<p>Vivamus ut laoreet erat, vitae eleifend eros. Sed varius id tellus non lobortis. Sed dolor ante, cursus non
|
|
||||||
scelerisque sed, euismod id eros.</p>
|
|
||||||
<span class="cd-date">Feb 24</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,24 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 1/12/16
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.components.timeline', [])
|
|
||||||
.config(routeConfig);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function routeConfig($stateProvider) {
|
|
||||||
$stateProvider
|
|
||||||
.state('components.timeline', {
|
|
||||||
url: '/timeline',
|
|
||||||
templateUrl: 'app/pages/components/timeline/timeline.html',
|
|
||||||
title: 'Timeline',
|
|
||||||
sidebarMeta: {
|
|
||||||
icon: 'ion-ios-pulse',
|
|
||||||
order: 100,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,33 +0,0 @@
|
||||||
<div class="row" ng-controller="treeCtrl">
|
|
||||||
<div class="col-md-6">
|
|
||||||
<div ba-panel ba-panel-title="Basic Action" ba-panel-class="with-scroll tree-panel">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-4">
|
|
||||||
<div class="control-side text-center">
|
|
||||||
<div>
|
|
||||||
<button class="btn btn-primary" ng-click="addNewNode()">Add</button>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<button class="btn btn-primary" ng-click="collapse()">Collapse All</button>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<button class="btn btn-primary" ng-click="expand()">Expand All</button>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<button class="btn btn-primary" ng-click="refresh()">Refresh</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-sm-8">
|
|
||||||
<div js-tree="basicConfig" ng-model="treeData" should-apply="applyModelChanges()" tree="basicTree" tree-events="ready:readyCB"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-6">
|
|
||||||
<div ba-panel ba-panel-title="Drag & Drop" ba-panel-class="with-scroll tree-panel">
|
|
||||||
<div js-tree="dragConfig" ng-model="dragData"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,28 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 12.21.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.components.tree', [])
|
|
||||||
.config(routeConfig)
|
|
||||||
.config(function(){
|
|
||||||
$.jstree.defaults.core.themes.url = true;
|
|
||||||
$.jstree.defaults.core.themes.dir = "assets/img/theme/vendor/jstree/dist/themes";
|
|
||||||
});
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function routeConfig($stateProvider) {
|
|
||||||
$stateProvider
|
|
||||||
.state('components.tree', {
|
|
||||||
url: '/tree',
|
|
||||||
templateUrl: 'app/pages/components/tree/tree.html',
|
|
||||||
title: 'Tree View',
|
|
||||||
sidebarMeta: {
|
|
||||||
order: 200,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,387 +0,0 @@
|
||||||
/**
|
|
||||||
* @author a.demeshko
|
|
||||||
* created on 12/21/15
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.components.tree')
|
|
||||||
.controller('treeCtrl', treeCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function treeCtrl($scope, $timeout) {
|
|
||||||
|
|
||||||
$scope.ignoreChanges = false;
|
|
||||||
var newId = 0;
|
|
||||||
$scope.ignoreChanges = false;
|
|
||||||
$scope.newNode = {};
|
|
||||||
|
|
||||||
$scope.basicConfig = {
|
|
||||||
core: {
|
|
||||||
multiple: false,
|
|
||||||
check_callback: true,
|
|
||||||
worker: true
|
|
||||||
},
|
|
||||||
'types': {
|
|
||||||
'folder': {
|
|
||||||
'icon': 'ion-ios-folder'
|
|
||||||
},
|
|
||||||
'default': {
|
|
||||||
'icon': 'ion-document-text'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
'plugins': ['types'],
|
|
||||||
'version': 1
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.dragConfig = {
|
|
||||||
'core': {
|
|
||||||
'check_callback': true,
|
|
||||||
'themes': {
|
|
||||||
'responsive': false
|
|
||||||
}
|
|
||||||
},
|
|
||||||
'types': {
|
|
||||||
'folder': {
|
|
||||||
'icon': 'ion-ios-folder'
|
|
||||||
},
|
|
||||||
'default': {
|
|
||||||
'icon': 'ion-document-text'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"plugins": ["dnd", 'types']
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.addNewNode = function () {
|
|
||||||
$scope.ignoreChanges = true;
|
|
||||||
var selected = this.basicTree.jstree(true).get_selected()[0];
|
|
||||||
if (selected)
|
|
||||||
$scope.treeData.push({
|
|
||||||
id: (newId++).toString(),
|
|
||||||
parent: selected,
|
|
||||||
text: "New node " + newId,
|
|
||||||
state: {opened: true}
|
|
||||||
});
|
|
||||||
$scope.basicConfig.version++;
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
$scope.refresh = function () {
|
|
||||||
$scope.ignoreChanges = true;
|
|
||||||
newId = 0;
|
|
||||||
$scope.treeData = getDefaultData();
|
|
||||||
$scope.basicConfig.version++;
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.expand = function () {
|
|
||||||
$scope.ignoreChanges = true;
|
|
||||||
$scope.treeData.forEach(function (n) {
|
|
||||||
n.state.opened = true;
|
|
||||||
});
|
|
||||||
$scope.basicConfig.version++;
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.collapse = function () {
|
|
||||||
$scope.ignoreChanges = true;
|
|
||||||
$scope.treeData.forEach(function (n) {
|
|
||||||
n.state.opened = false;
|
|
||||||
});
|
|
||||||
$scope.basicConfig.version++;
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.readyCB = function() {
|
|
||||||
$timeout(function() {
|
|
||||||
$scope.ignoreChanges = false;
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
$scope.applyModelChanges = function() {
|
|
||||||
return !$scope.ignoreChanges;
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.treeData = getDefaultData();
|
|
||||||
$scope.dragData = [
|
|
||||||
{
|
|
||||||
"id": "nd1",
|
|
||||||
"parent": "#",
|
|
||||||
"type": "folder",
|
|
||||||
"text": "Node 1",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd2",
|
|
||||||
"parent": "#",
|
|
||||||
"type": "folder",
|
|
||||||
"text": "Node 2",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd3",
|
|
||||||
"parent": "#",
|
|
||||||
"type": "folder",
|
|
||||||
"text": "Node 3",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd4",
|
|
||||||
"parent": "#",
|
|
||||||
"type": "folder",
|
|
||||||
"text": "Node 4",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd5",
|
|
||||||
"parent": "nd1",
|
|
||||||
"text": "Node 1.1",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd6",
|
|
||||||
"parent": "nd1",
|
|
||||||
"text": "Node 1.2",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd7",
|
|
||||||
"parent": "nd1",
|
|
||||||
"text": "Node 1.3",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd8",
|
|
||||||
"parent": "nd2",
|
|
||||||
"text": "Node 2.1",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd9",
|
|
||||||
"parent": "nd2",
|
|
||||||
"text": "Node 2.2",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd10",
|
|
||||||
"parent": "nd2",
|
|
||||||
"text": "Node 2.3",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd11",
|
|
||||||
"parent": "nd3",
|
|
||||||
"text": "Node 3.1",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd12",
|
|
||||||
"parent": "nd3",
|
|
||||||
"text": "Node 3.2",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd13",
|
|
||||||
"parent": "nd3",
|
|
||||||
"text": "Node 3.3",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd14",
|
|
||||||
"parent": "nd4",
|
|
||||||
"text": "Node 4.1",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd15",
|
|
||||||
"parent": "nd4",
|
|
||||||
"text": "Node 4.2",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "nd16",
|
|
||||||
"parent": "nd4",
|
|
||||||
"text": "Node 4.3",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
function getDefaultData() {
|
|
||||||
return [
|
|
||||||
{
|
|
||||||
"id": "n1",
|
|
||||||
"parent": "#",
|
|
||||||
"type": "folder",
|
|
||||||
"text": "Node 1",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n2",
|
|
||||||
"parent": "#",
|
|
||||||
"type": "folder",
|
|
||||||
"text": "Node 2",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n3",
|
|
||||||
"parent": "#",
|
|
||||||
"type": "folder",
|
|
||||||
"text": "Node 3",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n5",
|
|
||||||
"parent": "n1",
|
|
||||||
"text": "Node 1.1",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n6",
|
|
||||||
"parent": "n1",
|
|
||||||
"text": "Node 1.2",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n7",
|
|
||||||
"parent": "n1",
|
|
||||||
"text": "Node 1.3",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n8",
|
|
||||||
"parent": "n1",
|
|
||||||
"text": "Node 1.4",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n9",
|
|
||||||
"parent": "n2",
|
|
||||||
"text": "Node 2.1",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n10",
|
|
||||||
"parent": "n2",
|
|
||||||
"text": "Node 2.2 (Custom icon)",
|
|
||||||
"icon": "ion-help-buoy",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n12",
|
|
||||||
"parent": "n3",
|
|
||||||
"text": "Node 3.1",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n13",
|
|
||||||
"parent": "n3",
|
|
||||||
"type": "folder",
|
|
||||||
"text": "Node 3.2",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n14",
|
|
||||||
"parent": "n13",
|
|
||||||
"text": "Node 3.2.1",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n15",
|
|
||||||
"parent": "n13",
|
|
||||||
"text": "Node 3.2.2",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n16",
|
|
||||||
"parent": "n3",
|
|
||||||
"text": "Node 3.3",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n17",
|
|
||||||
"parent": "n3",
|
|
||||||
"text": "Node 3.4",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n18",
|
|
||||||
"parent": "n3",
|
|
||||||
"text": "Node 3.5",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "n19",
|
|
||||||
"parent": "n3",
|
|
||||||
"text": "Node 3.6",
|
|
||||||
"state": {
|
|
||||||
"opened": true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,129 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.controller('BlurFeedCtrl', BlurFeedCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function BlurFeedCtrl($scope) {
|
|
||||||
$scope.feed = [
|
|
||||||
{
|
|
||||||
type: 'text-message',
|
|
||||||
author: 'Kostya',
|
|
||||||
surname: 'Danovsky',
|
|
||||||
header: 'Posted new message',
|
|
||||||
text: 'Guys, check this out: \nA police officer found a perfect hiding place for watching for speeding motorists. One day, the officer was amazed when everyone was under the speed limit, so he investigated and found the problem. A 10 years old boy was standing on the side of the road with a huge hand painted sign which said "Radar Trap Ahead." A little more investigative work led the officer to the boy\'s accomplice: another boy about 100 yards beyond the radar trap with a sign reading "TIPS" and a bucket at his feet full of change.',
|
|
||||||
time: 'Today 11:55 pm',
|
|
||||||
ago: '25 minutes ago',
|
|
||||||
expanded: false,
|
|
||||||
}, {
|
|
||||||
type: 'video-message',
|
|
||||||
author: 'Andrey',
|
|
||||||
surname: 'Hrabouski',
|
|
||||||
header: 'Added new video',
|
|
||||||
text: '"Vader and Me"',
|
|
||||||
preview: 'app/feed/vader-and-me-preview.png',
|
|
||||||
link: 'https://www.youtube.com/watch?v=IfcpzBbbamk',
|
|
||||||
time: 'Today 9:30 pm',
|
|
||||||
ago: '3 hrs ago',
|
|
||||||
expanded: false,
|
|
||||||
}, {
|
|
||||||
type: 'image-message',
|
|
||||||
author: 'Vlad',
|
|
||||||
surname: 'Lugovsky',
|
|
||||||
header: 'Added new image',
|
|
||||||
text: '"My little kitten"',
|
|
||||||
preview: 'app/feed/my-little-kitten.png',
|
|
||||||
link: 'http://api.ning.com/files/DtcI2O2Ry7A7VhVxeiWfGU9WkHcMy4WSTWZ79oxJq*h0iXvVGndfD7CIYy-Ax-UAFCBCdqXI4GCBw3FOLKTTjQc*2cmpdOXJ/1082127884.jpeg',
|
|
||||||
time: 'Today 2:20 pm',
|
|
||||||
ago: '10 hrs ago',
|
|
||||||
expanded: false,
|
|
||||||
}, {
|
|
||||||
type: 'text-message',
|
|
||||||
author: 'Nasta',
|
|
||||||
surname: 'Linnie',
|
|
||||||
header: 'Posted new message',
|
|
||||||
text: 'Haha lol',
|
|
||||||
time: '11.11.2015',
|
|
||||||
ago: '2 days ago',
|
|
||||||
expanded: false,
|
|
||||||
}, {
|
|
||||||
type: 'geo-message',
|
|
||||||
author: 'Nick',
|
|
||||||
surname: 'Cat',
|
|
||||||
header: 'Posted location',
|
|
||||||
text: '"New York, USA"',
|
|
||||||
preview: 'app/feed/new-york-location.png',
|
|
||||||
link: 'https://www.google.by/maps/place/New+York,+NY,+USA/@40.7201111,-73.9893872,14z',
|
|
||||||
time: '11.11.2015',
|
|
||||||
ago: '2 days ago',
|
|
||||||
expanded: false,
|
|
||||||
}, {
|
|
||||||
type: 'text-message',
|
|
||||||
author: 'Vlad',
|
|
||||||
surname: 'Lugovsky',
|
|
||||||
header: 'Posted new message',
|
|
||||||
text: "First snake: I hope I'm not poisonous. Second snake: Why? First snake: Because I bit my lip!",
|
|
||||||
time: '12.11.2015',
|
|
||||||
ago: '3 days ago',
|
|
||||||
expanded: false,
|
|
||||||
}, {
|
|
||||||
type: 'text-message',
|
|
||||||
author: 'Andrey',
|
|
||||||
surname: 'Hrabouski',
|
|
||||||
header: 'Posted new message',
|
|
||||||
text: 'How do you smuggle an elephant across the border? Put a slice of bread on each side, and call him "lunch".',
|
|
||||||
time: '14.11.2015',
|
|
||||||
ago: '5 days ago',
|
|
||||||
expanded: false,
|
|
||||||
}, {
|
|
||||||
type: 'text-message',
|
|
||||||
author: 'Nasta',
|
|
||||||
surname: 'Linnie',
|
|
||||||
header: 'Posted new message',
|
|
||||||
text: 'When your hammer is C++, everything begins to look like a thumb.',
|
|
||||||
time: '14.11.2015',
|
|
||||||
ago: '5 days ago',
|
|
||||||
expanded: false,
|
|
||||||
}, {
|
|
||||||
type: 'text-message',
|
|
||||||
author: 'Alexander',
|
|
||||||
surname: 'Demeshko',
|
|
||||||
header: 'Posted new message',
|
|
||||||
text: '“I mean, they say you die twice. One time when you stop breathing and a second time, a bit later on, when somebody says your name for the last time." ©',
|
|
||||||
time: '15.11.2015',
|
|
||||||
ago: '6 days ago',
|
|
||||||
expanded: false,
|
|
||||||
}, {
|
|
||||||
type: 'image-message',
|
|
||||||
author: 'Nick',
|
|
||||||
surname: 'Cat',
|
|
||||||
header: 'Posted photo',
|
|
||||||
text: '"Protein Heroes"',
|
|
||||||
preview: 'app/feed/genom.png',
|
|
||||||
link: 'https://dribbble.com/shots/2504810-Protein-Heroes',
|
|
||||||
time: '16.11.2015',
|
|
||||||
ago: '7 days ago',
|
|
||||||
expanded: false,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'text-message',
|
|
||||||
author: 'Kostya',
|
|
||||||
surname: 'Danovsky',
|
|
||||||
header: 'Posted new message',
|
|
||||||
text: 'Why did the CoffeeScript developer keep getting lost? Because he couldn\'t find his source without a map',
|
|
||||||
time: '18.11.2015',
|
|
||||||
ago: '9 days ago',
|
|
||||||
expanded: false,
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
$scope.expandMessage = function(message){
|
|
||||||
message.expanded = !message.expanded;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,19 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.directive('blurFeed', blurFeed);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function blurFeed() {
|
|
||||||
return {
|
|
||||||
restrict: 'E',
|
|
||||||
controller: 'BlurFeedCtrl',
|
|
||||||
templateUrl: 'app/pages/dashboard/blurFeed/blurFeed.html'
|
|
||||||
};
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,33 +0,0 @@
|
||||||
|
|
||||||
<div class="feed-messages-container" track-width="smallContainerWidth" min-width="360">
|
|
||||||
<div class="feed-message" ng-repeat="message in feed" ng-click="expandMessage(message)">
|
|
||||||
<div class="message-icon" ng-if="message.type == 'text-message'">
|
|
||||||
<img class="photo-icon" ng-src="{{::( message.author | profilePicture )}}">
|
|
||||||
</div>
|
|
||||||
<div class="message-icon" ng-if="message.type != 'text-message'">
|
|
||||||
<img class="photo-icon" ng-src="{{::( message.author | profilePicture )}}">
|
|
||||||
<span class="sub-photo-icon" ng-class="::message.type"></span>
|
|
||||||
</div>
|
|
||||||
<div class="text-block text-message">
|
|
||||||
<div class="message-header">
|
|
||||||
<span class="author">{{ ::message.author }} {{ ::message.surname}}</span>
|
|
||||||
</div>
|
|
||||||
<div class="message-content line-clamp" ng-class="{'line-clamp-2' : !message.expanded}">
|
|
||||||
<span ng-if="message.preview">{{message.header}} </span>{{::message.text}}
|
|
||||||
</div>
|
|
||||||
<div class="preview" ng-show="message.expanded" ng-if="message.preview">
|
|
||||||
<a href="{{::message.link}}" target="_blank">
|
|
||||||
<img ng-src="{{ ::( message.preview | appImage )}}">
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div ng-show="message.expanded" class="message-time">
|
|
||||||
<div class="post-time">
|
|
||||||
{{::message.time}}
|
|
||||||
</div>
|
|
||||||
<div class="ago-time">
|
|
||||||
{{::message.ago}}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.service('dashboardCalendar', dashboardCalendar);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function dashboardCalendar() {
|
|
||||||
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,63 +0,0 @@
|
||||||
<dashboard-pie-chart></dashboard-pie-chart>
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-6 col-md-12 col-sm-12"
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Acquisition Channels"
|
|
||||||
ba-panel-class="medium-panel traffic-panel">
|
|
||||||
<traffic-chart></traffic-chart>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-6 col-md-12 col-sm-12"
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Users by Country"
|
|
||||||
ba-panel-class="medium-panel">
|
|
||||||
<dashboard-map></dashboard-map>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-xlg-9 col-lg-6 col-md-6 col-sm-12 col-xs-12">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-xlg-8 col-lg-12 col-md-12 col-sm-7 col-xs-12"
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Revenue"
|
|
||||||
ba-panel-class="medium-panel">
|
|
||||||
<dashboard-line-chart></dashboard-line-chart>
|
|
||||||
</div>
|
|
||||||
<div class="col-xlg-4 col-lg-12 col-md-12 col-sm-5 col-xs-12"
|
|
||||||
ba-panel
|
|
||||||
ba-panel-class="popular-app medium-panel">
|
|
||||||
<popular-app></popular-app>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-xlg-3 col-lg-6 col-md-6 col-sm-12 col-xs-12"
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Feed"
|
|
||||||
ba-panel-class="large-panel with-scroll feed-panel">
|
|
||||||
<blur-feed></blur-feed>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row shift-up">
|
|
||||||
<div class="col-xlg-3 col-lg-6 col-md-6 col-xs-12"
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="To Do List"
|
|
||||||
ba-panel-class="xmedium-panel feed-comply-panel with-scroll todo-panel">
|
|
||||||
<dashboard-todo></dashboard-todo>
|
|
||||||
</div>
|
|
||||||
<div class="col-xlg-6 col-lg-6 col-md-6 col-xs-12"
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Calendar"
|
|
||||||
ba-panel-class="xmedium-panel feed-comply-panel with-scroll calendar-panel">
|
|
||||||
<dashboard-calendar></dashboard-calendar>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!--<div class="row">
|
|
||||||
<div class="col-lg-4 col-sm-6 col-xs-12">
|
|
||||||
<div ba-panel ba-panel-title="Weather" ba-panel-class="medium-panel with-scroll">
|
|
||||||
<blur-weather forecast="5"></blur-weather>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>-->
|
|
||||||
|
|
@ -1,25 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovsky
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard', [])
|
|
||||||
.config(routeConfig);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function routeConfig($stateProvider) {
|
|
||||||
$stateProvider
|
|
||||||
.state('dashboard', {
|
|
||||||
url: '/dashboard',
|
|
||||||
templateUrl: 'app/pages/dashboard/dashboard.html',
|
|
||||||
title: 'Dashboard',
|
|
||||||
sidebarMeta: {
|
|
||||||
icon: 'ion-android-home',
|
|
||||||
order: 0,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,64 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.controller('DashboardCalendarCtrl', DashboardCalendarCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function DashboardCalendarCtrl(baConfig) {
|
|
||||||
var dashboardColors = baConfig.colors.dashboard;
|
|
||||||
var $element = $('#calendar').fullCalendar({
|
|
||||||
//height: 335,
|
|
||||||
header: {
|
|
||||||
left: 'prev,next today',
|
|
||||||
center: 'title',
|
|
||||||
right: 'month,agendaWeek,agendaDay'
|
|
||||||
},
|
|
||||||
defaultDate: '2016-03-08',
|
|
||||||
selectable: true,
|
|
||||||
selectHelper: true,
|
|
||||||
select: function (start, end) {
|
|
||||||
var title = prompt('Event Title:');
|
|
||||||
var eventData;
|
|
||||||
if (title) {
|
|
||||||
eventData = {
|
|
||||||
title: title,
|
|
||||||
start: start,
|
|
||||||
end: end
|
|
||||||
};
|
|
||||||
$element.fullCalendar('renderEvent', eventData, true); // stick? = true
|
|
||||||
}
|
|
||||||
$element.fullCalendar('unselect');
|
|
||||||
},
|
|
||||||
editable: true,
|
|
||||||
eventLimit: true, // allow "more" link when too many events
|
|
||||||
events: [
|
|
||||||
{
|
|
||||||
title: 'All Day Event',
|
|
||||||
start: '2016-03-01',
|
|
||||||
color: dashboardColors.silverTree
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'Long Event',
|
|
||||||
start: '2016-03-07',
|
|
||||||
end: '2016-03-10',
|
|
||||||
color: dashboardColors.blueStone
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'Dinner',
|
|
||||||
start: '2016-03-14T20:00:00',
|
|
||||||
color: dashboardColors.surfieGreen
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'Birthday Party',
|
|
||||||
start: '2016-04-01T07:00:00',
|
|
||||||
color: dashboardColors.gossipDark
|
|
||||||
}
|
|
||||||
]
|
|
||||||
});
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,19 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.directive('dashboardCalendar', dashboardCalendar);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function dashboardCalendar() {
|
|
||||||
return {
|
|
||||||
restrict: 'E',
|
|
||||||
controller: 'DashboardCalendarCtrl',
|
|
||||||
templateUrl: 'app/pages/dashboard/dashboardCalendar/dashboardCalendar.html'
|
|
||||||
};
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
<div id='calendar' class="blurCalendar"></div>
|
|
||||||
|
|
@ -1,126 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.controller('DashboardLineChartCtrl', DashboardLineChartCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function DashboardLineChartCtrl(baConfig, layoutPaths, baUtil) {
|
|
||||||
var layoutColors = baConfig.colors;
|
|
||||||
var graphColor = baConfig.theme.blur ? '#000000' : layoutColors.primary;
|
|
||||||
var chartData = [
|
|
||||||
{ date: new Date(2012, 11), value: 0, value0: 0 },
|
|
||||||
{ date: new Date(2013, 0), value: 15000, value0: 19000},
|
|
||||||
{ date: new Date(2013, 1), value: 30000, value0: 20000},
|
|
||||||
|
|
||||||
{ date: new Date(2013, 2), value: 25000, value0: 22000},
|
|
||||||
{ date: new Date(2013, 3), value: 21000, value0: 25000},
|
|
||||||
{ date: new Date(2013, 4), value: 24000, value0: 29000},
|
|
||||||
{ date: new Date(2013, 5), value: 31000, value0: 26000},
|
|
||||||
{ date: new Date(2013, 6), value: 40000, value0: 25000},
|
|
||||||
{ date: new Date(2013, 7), value: 37000, value0: 20000},
|
|
||||||
{ date: new Date(2013, 8), value: 18000, value0: 22000},
|
|
||||||
{ date: new Date(2013, 9), value: 5000, value0: 26000},
|
|
||||||
{ date: new Date(2013, 10), value: 40000, value0: 30000},
|
|
||||||
{ date: new Date(2013, 11), value: 20000, value0: 25000},
|
|
||||||
{ date: new Date(2014, 0), value: 5000, value0: 13000},
|
|
||||||
|
|
||||||
{ date: new Date(2014, 1), value: 3000, value0: 13000},
|
|
||||||
{ date: new Date(2014, 2), value: 1800, value0: 13000},
|
|
||||||
{ date: new Date(2014, 3), value: 10400, value0: 13000},
|
|
||||||
{ date: new Date(2014, 4), value: 25500, value0: 13000},
|
|
||||||
{ date: new Date(2014, 5), value: 2100, value0: 13000},
|
|
||||||
{ date: new Date(2014, 6), value: 6500, value0: 13000},
|
|
||||||
{ date: new Date(2014, 7), value: 1100, value0: 13000},
|
|
||||||
{ date: new Date(2014, 8), value: 17200, value0: 13000},
|
|
||||||
{ date: new Date(2014, 9), value: 26900, value0: 13000},
|
|
||||||
{ date: new Date(2014, 10), value: 14100, value0: 13000},
|
|
||||||
{ date: new Date(2014, 11), value: 35300, value0: 13000},
|
|
||||||
{ date: new Date(2015, 0), value: 54800, value0: 13000},
|
|
||||||
{ date: new Date(2015, 1), value: 49800, value0: 13000}
|
|
||||||
];
|
|
||||||
|
|
||||||
var chart = AmCharts.makeChart('amchart', {
|
|
||||||
type: 'serial',
|
|
||||||
theme: 'blur',
|
|
||||||
marginTop: 15,
|
|
||||||
marginRight: 15,
|
|
||||||
dataProvider: chartData,
|
|
||||||
categoryField: 'date',
|
|
||||||
categoryAxis: {
|
|
||||||
parseDates: true,
|
|
||||||
gridAlpha: 0,
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
axisColor: layoutColors.defaultText
|
|
||||||
},
|
|
||||||
valueAxes: [
|
|
||||||
{
|
|
||||||
minVerticalGap: 50,
|
|
||||||
gridAlpha: 0,
|
|
||||||
color: layoutColors.defaultText,
|
|
||||||
axisColor: layoutColors.defaultText
|
|
||||||
}
|
|
||||||
],
|
|
||||||
graphs: [
|
|
||||||
{
|
|
||||||
id: 'g0',
|
|
||||||
bullet: 'none',
|
|
||||||
useLineColorForBulletBorder: true,
|
|
||||||
lineColor: baUtil.hexToRGB(graphColor, 0.3),
|
|
||||||
lineThickness: 1,
|
|
||||||
negativeLineColor: layoutColors.danger,
|
|
||||||
type: 'smoothedLine',
|
|
||||||
valueField: 'value0',
|
|
||||||
fillAlphas: 1,
|
|
||||||
fillColorsField: 'lineColor'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 'g1',
|
|
||||||
bullet: 'none',
|
|
||||||
useLineColorForBulletBorder: true,
|
|
||||||
lineColor: baUtil.hexToRGB(graphColor, 0.5),
|
|
||||||
lineThickness: 1,
|
|
||||||
negativeLineColor: layoutColors.danger,
|
|
||||||
type: 'smoothedLine',
|
|
||||||
valueField: 'value',
|
|
||||||
fillAlphas: 1,
|
|
||||||
fillColorsField: 'lineColor'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
chartCursor: {
|
|
||||||
categoryBalloonDateFormat: 'MM YYYY',
|
|
||||||
categoryBalloonColor: '#4285F4',
|
|
||||||
categoryBalloonAlpha: 0.7,
|
|
||||||
cursorAlpha: 0,
|
|
||||||
valueLineEnabled: true,
|
|
||||||
valueLineBalloonEnabled: true,
|
|
||||||
valueLineAlpha: 0.5
|
|
||||||
},
|
|
||||||
dataDateFormat: 'MM YYYY',
|
|
||||||
export: {
|
|
||||||
enabled: true
|
|
||||||
},
|
|
||||||
creditsPosition: 'bottom-right',
|
|
||||||
zoomOutButton: {
|
|
||||||
backgroundColor: '#fff',
|
|
||||||
backgroundAlpha: 0
|
|
||||||
},
|
|
||||||
zoomOutText: '',
|
|
||||||
pathToImages: layoutPaths.images.amChart
|
|
||||||
});
|
|
||||||
|
|
||||||
function zoomChart() {
|
|
||||||
chart.zoomToDates(new Date(2013, 3), new Date(2014, 0));
|
|
||||||
}
|
|
||||||
|
|
||||||
chart.addListener('rendered', zoomChart);
|
|
||||||
zoomChart();
|
|
||||||
if (chart.zoomChart) {
|
|
||||||
chart.zoomChart();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,19 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.directive('dashboardLineChart', dashboardLineChart);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function dashboardLineChart() {
|
|
||||||
return {
|
|
||||||
restrict: 'E',
|
|
||||||
controller: 'DashboardLineChartCtrl',
|
|
||||||
templateUrl: 'app/pages/dashboard/dashboardLineChart/dashboardLineChart.html'
|
|
||||||
};
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
<div id="amchart"></div>
|
|
||||||
|
|
@ -1,104 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.controller('DashboardMapCtrl', DashboardMapCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function DashboardMapCtrl(baConfig, layoutPaths) {
|
|
||||||
var layoutColors = baConfig.colors;
|
|
||||||
var map = AmCharts.makeChart('amChartMap', {
|
|
||||||
type: 'map',
|
|
||||||
theme: 'blur',
|
|
||||||
zoomControl: { zoomControlEnabled: false, panControlEnabled: false },
|
|
||||||
|
|
||||||
dataProvider: {
|
|
||||||
map: 'worldLow',
|
|
||||||
zoomLevel: 3.5,
|
|
||||||
zoomLongitude: 10,
|
|
||||||
zoomLatitude: 52,
|
|
||||||
areas: [
|
|
||||||
{ title: 'Austria', id: 'AT', color: layoutColors.primary, customData: '1 244', groupId: '1'},
|
|
||||||
{ title: 'Ireland', id: 'IE', color: layoutColors.primary, customData: '1 342', groupId: '1'},
|
|
||||||
{ title: 'Denmark', id: 'DK', color: layoutColors.primary, customData: '1 973', groupId: '1'},
|
|
||||||
{ title: 'Finland', id: 'FI', color: layoutColors.primary, customData: '1 573', groupId: '1'},
|
|
||||||
{ title: 'Sweden', id: 'SE', color: layoutColors.primary, customData: '1 084', groupId: '1'},
|
|
||||||
{ title: 'Great Britain', id: 'GB', color: layoutColors.primary, customData: '1 452', groupId: '1'},
|
|
||||||
{ title: 'Italy', id: 'IT', color: layoutColors.primary, customData: '1 321', groupId: '1'},
|
|
||||||
{ title: 'France', id: 'FR', color: layoutColors.primary, customData: '1 112', groupId: '1'},
|
|
||||||
{ title: 'Spain', id: 'ES', color: layoutColors.primary, customData: '1 865', groupId: '1'},
|
|
||||||
{ title: 'Greece', id: 'GR', color: layoutColors.primary, customData: '1 453', groupId: '1'},
|
|
||||||
{ title: 'Germany', id: 'DE', color: layoutColors.primary, customData: '1 957', groupId: '1'},
|
|
||||||
{ title: 'Belgium', id: 'BE', color: layoutColors.primary, customData: '1 011', groupId: '1'},
|
|
||||||
{ title: 'Luxembourg', id: 'LU', color: layoutColors.primary, customData: '1 011', groupId: '1'},
|
|
||||||
{ title: 'Netherlands', id: 'NL', color: layoutColors.primary, customData: '1 213', groupId: '1'},
|
|
||||||
{ title: 'Portugal', id: 'PT', color: layoutColors.primary, customData: '1 291', groupId: '1'},
|
|
||||||
{ title: 'Lithuania', id: 'LT', color: layoutColors.successLight, customData: '567', groupId: '2'},
|
|
||||||
{ title: 'Latvia', id: 'LV', color: layoutColors.successLight, customData: '589', groupId: '2'},
|
|
||||||
{ title: 'Czech Republic ', id: 'CZ', color: layoutColors.successLight, customData: '785', groupId: '2'},
|
|
||||||
{ title: 'Slovakia', id: 'SK', color: layoutColors.successLight, customData: '965', groupId: '2'},
|
|
||||||
{ title: 'Estonia', id: 'EE', color: layoutColors.successLight, customData: '685', groupId: '2'},
|
|
||||||
{ title: 'Hungary', id: 'HU', color: layoutColors.successLight, customData: '854', groupId: '2'},
|
|
||||||
{ title: 'Cyprus', id: 'CY', color: layoutColors.successLight, customData: '754', groupId: '2'},
|
|
||||||
{ title: 'Malta', id: 'MT', color: layoutColors.successLight, customData: '867', groupId: '2'},
|
|
||||||
{ title: 'Poland', id: 'PL', color: layoutColors.successLight, customData: '759', groupId: '2'},
|
|
||||||
{ title: 'Romania', id: 'RO', color: layoutColors.success, customData: '302', groupId: '3'},
|
|
||||||
{ title: 'Bulgaria', id: 'BG', color: layoutColors.success, customData: '102', groupId: '3'},
|
|
||||||
{ title: 'Slovenia', id: 'SI', color: layoutColors.danger, customData: '23', groupId: '4'},
|
|
||||||
{ title: 'Croatia', id: 'HR', color: layoutColors.danger, customData: '96', groupId: '4'}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
|
|
||||||
areasSettings: {
|
|
||||||
rollOverOutlineColor: layoutColors.border,
|
|
||||||
rollOverColor: layoutColors.primaryDark,
|
|
||||||
alpha: 0.8,
|
|
||||||
unlistedAreasAlpha: 0.2,
|
|
||||||
unlistedAreasColor: layoutColors.defaultText,
|
|
||||||
balloonText: '[[title]]: [[customData]] users'
|
|
||||||
},
|
|
||||||
|
|
||||||
|
|
||||||
legend: {
|
|
||||||
width: '100%',
|
|
||||||
marginRight: 27,
|
|
||||||
marginLeft: 27,
|
|
||||||
equalWidths: false,
|
|
||||||
backgroundAlpha: 0.3,
|
|
||||||
backgroundColor: layoutColors.border,
|
|
||||||
borderColor: layoutColors.border,
|
|
||||||
borderAlpha: 1,
|
|
||||||
top: 362,
|
|
||||||
left: 0,
|
|
||||||
horizontalGap: 10,
|
|
||||||
data: [
|
|
||||||
{
|
|
||||||
title: 'over 1 000 users',
|
|
||||||
color: layoutColors.primary
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '500 - 1 000 users',
|
|
||||||
color: layoutColors.successLight
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '100 - 500 users',
|
|
||||||
color: layoutColors.success
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '0 - 100 users',
|
|
||||||
color: layoutColors.danger
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
export: {
|
|
||||||
enabled: true
|
|
||||||
},
|
|
||||||
creditsPosition: 'bottom-right',
|
|
||||||
pathToImages: layoutPaths.images.amChart
|
|
||||||
});
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,19 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.directive('dashboardMap', dashboardMap);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function dashboardMap() {
|
|
||||||
return {
|
|
||||||
restrict: 'E',
|
|
||||||
controller: 'DashboardMapCtrl',
|
|
||||||
templateUrl: 'app/pages/dashboard/dashboardMap/dashboardMap.html'
|
|
||||||
};
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
<div id="amChartMap"></div>
|
|
||||||
|
|
@ -1,75 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.controller('DashboardPieChartCtrl', DashboardPieChartCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function DashboardPieChartCtrl($scope, $timeout, baConfig, baUtil) {
|
|
||||||
var pieColor = baUtil.hexToRGB(baConfig.colors.defaultText, 0.2);
|
|
||||||
$scope.charts = [{
|
|
||||||
color: pieColor,
|
|
||||||
description: 'New Visits',
|
|
||||||
stats: '57,820',
|
|
||||||
icon: 'person',
|
|
||||||
}, {
|
|
||||||
color: pieColor,
|
|
||||||
description: 'Purchases',
|
|
||||||
stats: '$ 89,745',
|
|
||||||
icon: 'money',
|
|
||||||
}, {
|
|
||||||
color: pieColor,
|
|
||||||
description: 'Active Users',
|
|
||||||
stats: '178,391',
|
|
||||||
icon: 'face',
|
|
||||||
}, {
|
|
||||||
color: pieColor,
|
|
||||||
description: 'Returned',
|
|
||||||
stats: '32,592',
|
|
||||||
icon: 'refresh',
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
function getRandomArbitrary(min, max) {
|
|
||||||
return Math.random() * (max - min) + min;
|
|
||||||
}
|
|
||||||
|
|
||||||
function loadPieCharts() {
|
|
||||||
$('.chart').each(function () {
|
|
||||||
var chart = $(this);
|
|
||||||
chart.easyPieChart({
|
|
||||||
easing: 'easeOutBounce',
|
|
||||||
onStep: function (from, to, percent) {
|
|
||||||
$(this.el).find('.percent').text(Math.round(percent));
|
|
||||||
},
|
|
||||||
barColor: chart.attr('rel'),
|
|
||||||
trackColor: 'rgba(0,0,0,0)',
|
|
||||||
size: 84,
|
|
||||||
scaleLength: 0,
|
|
||||||
animation: 2000,
|
|
||||||
lineWidth: 9,
|
|
||||||
lineCap: 'round',
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
$('.refresh-data').on('click', function () {
|
|
||||||
updatePieCharts();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function updatePieCharts() {
|
|
||||||
$('.pie-charts .chart').each(function(index, chart) {
|
|
||||||
$(chart).data('easyPieChart').update(getRandomArbitrary(55, 90));
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
$timeout(function () {
|
|
||||||
loadPieCharts();
|
|
||||||
updatePieCharts();
|
|
||||||
}, 1000);
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,19 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.directive('dashboardPieChart', dashboardPieChart);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function dashboardPieChart() {
|
|
||||||
return {
|
|
||||||
restrict: 'E',
|
|
||||||
controller: 'DashboardPieChartCtrl',
|
|
||||||
templateUrl: 'app/pages/dashboard/dashboardPieChart/dashboardPieChart.html'
|
|
||||||
};
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,14 +0,0 @@
|
||||||
<div class="row pie-charts">
|
|
||||||
<div class="pie-chart-item-container" ng-repeat="chart in charts">
|
|
||||||
<div ba-panel>
|
|
||||||
<div class="pie-chart-item">
|
|
||||||
<div class="chart" rel="{{ ::chart.color }}" data-percent="60"> <span class="percent"></span> </div>
|
|
||||||
<div class="description">
|
|
||||||
<div>{{ ::chart.description }}</div>
|
|
||||||
<div class="description-stats">{{ ::chart.stats }}</div>
|
|
||||||
</div>
|
|
||||||
<i class="chart-icon i-{{ ::chart.icon }}"></i>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,19 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.directive('dashboardTodo', dashboardTodo);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function dashboardTodo() {
|
|
||||||
return {
|
|
||||||
restrict: 'EA',
|
|
||||||
controller: 'DashboardTodoCtrl',
|
|
||||||
templateUrl: 'app/pages/dashboard/dashboardTodo/dashboardTodo.html'
|
|
||||||
};
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.service('dashboardPieChart', dashboardPieChart);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function dashboardPieChart() {
|
|
||||||
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,18 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.directive('popularApp', popularApp);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function popularApp() {
|
|
||||||
return {
|
|
||||||
restrict: 'E',
|
|
||||||
templateUrl: 'app/pages/dashboard/popularApp/popularApp.html'
|
|
||||||
};
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,28 +0,0 @@
|
||||||
<div class="popular-app-img-container">
|
|
||||||
<div class="popular-app-img">
|
|
||||||
<img ng-src="{{::( 'app/my-app-logo.png' | appImage )}}"/>
|
|
||||||
<span class="logo-text">Super App</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="popular-app-cost row">
|
|
||||||
<div class="col-xs-9">
|
|
||||||
Most Popular App
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-3 text-right">
|
|
||||||
175$
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="popular-app-info row">
|
|
||||||
<div class="col-xs-4 text-left">
|
|
||||||
<div class="info-label">Total Visits</div>
|
|
||||||
<div>47,512</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-4 text-center">
|
|
||||||
<div class="info-label">New Visits</div>
|
|
||||||
<div>9,217</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-4 text-right">
|
|
||||||
<div class="info-label">Sales</div>
|
|
||||||
<div>2,928</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,61 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.controller('TrafficChartCtrl', TrafficChartCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function TrafficChartCtrl($scope, baConfig, colorHelper) {
|
|
||||||
|
|
||||||
$scope.transparent = baConfig.theme.blur;
|
|
||||||
var dashboardColors = baConfig.colors.dashboard;
|
|
||||||
$scope.doughnutData = {
|
|
||||||
labels: [
|
|
||||||
'Other',
|
|
||||||
'Search engines',
|
|
||||||
'Referral Traffic',
|
|
||||||
'Direct Traffic',
|
|
||||||
'Ad Campaigns'
|
|
||||||
],
|
|
||||||
datasets: [
|
|
||||||
{
|
|
||||||
data: [2000, 1500, 1000, 1200, 400],
|
|
||||||
backgroundColor: [
|
|
||||||
dashboardColors.white,
|
|
||||||
dashboardColors.blueStone,
|
|
||||||
dashboardColors.surfieGreen,
|
|
||||||
dashboardColors.silverTree,
|
|
||||||
dashboardColors.gossip
|
|
||||||
|
|
||||||
],
|
|
||||||
hoverBackgroundColor: [
|
|
||||||
colorHelper.shade(dashboardColors.white, 15),
|
|
||||||
colorHelper.shade(dashboardColors.blueStone, 15),
|
|
||||||
colorHelper.shade(dashboardColors.surfieGreen, 15),
|
|
||||||
colorHelper.shade(dashboardColors.silverTree, 15),
|
|
||||||
colorHelper.shade(dashboardColors.gossip, 15)
|
|
||||||
],
|
|
||||||
percentage: [87, 22, 70, 38, 17]
|
|
||||||
}]
|
|
||||||
};
|
|
||||||
|
|
||||||
var ctx = document.getElementById('chart-area').getContext('2d');
|
|
||||||
window.myDoughnut = new Chart(ctx, {
|
|
||||||
type: 'doughnut',
|
|
||||||
data: $scope.doughnutData,
|
|
||||||
options: {
|
|
||||||
cutoutPercentage: 64,
|
|
||||||
responsive: true,
|
|
||||||
elements: {
|
|
||||||
arc: {
|
|
||||||
borderWidth: 0
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,19 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.directive('trafficChart', trafficChart);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function trafficChart() {
|
|
||||||
return {
|
|
||||||
restrict: 'E',
|
|
||||||
controller: 'TrafficChartCtrl',
|
|
||||||
templateUrl: 'app/pages/dashboard/trafficChart/trafficChart.html'
|
|
||||||
};
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,29 +0,0 @@
|
||||||
<div class="channels-block" ng-class="{'transparent': transparent}">
|
|
||||||
<div class="chart-bg"></div>
|
|
||||||
<div class="traffic-chart" id="trafficChart">
|
|
||||||
<div class="canvas-holder">
|
|
||||||
<canvas id="chart-area" width="280" height="280"></canvas>
|
|
||||||
<div class="traffic-text">
|
|
||||||
1,900,128
|
|
||||||
<span>Views Total</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="channels-info">
|
|
||||||
<div>
|
|
||||||
<div class="channels-info-item" ng-repeat="label in doughnutData.labels"
|
|
||||||
ng-init="i = $index; data = doughnutData.datasets[0]">
|
|
||||||
<div class="legend-color" style="background-color: {{::data.backgroundColor[i]}}"></div>
|
|
||||||
<p>{{::label}}<span class="channel-number">+{{data.percentage[i]}}%</span></p>
|
|
||||||
<div class="progress progress-sm channel-progress">
|
|
||||||
<div class="progress-bar " role="progressbar"
|
|
||||||
aria-valuenow="{{data.percentage[i]}}" aria-valuemin="0" aria-valuemax="100"
|
|
||||||
style="width: {{item.percentage}}%">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
@ -1,144 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.controller('WeatherCtrl', WeatherCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function WeatherCtrl($scope, $http, $timeout, $element) {
|
|
||||||
var url = 'http://api.openweathermap.org/data/2.5/forecast';
|
|
||||||
var method = 'GET';
|
|
||||||
var key = '2de143494c0b295cca9337e1e96b00e0';
|
|
||||||
var middleOfTheDay = 15;
|
|
||||||
$scope.units = 'metric';
|
|
||||||
$scope.weatherIcons = {
|
|
||||||
'01d': 'ion-ios-sunny-outline',
|
|
||||||
'02d': 'ion-ios-partlysunny-outline',
|
|
||||||
'03d': 'ion-ios-cloud-outline',
|
|
||||||
'04d': 'ion-ios-cloud',
|
|
||||||
'09d': 'ion-ios-rainy',
|
|
||||||
'10d': 'ion-ios-rainy-outline',
|
|
||||||
'11d': 'ion-ios-thunderstorm-outline',
|
|
||||||
'13d': 'ion-ios-snowy',
|
|
||||||
'50d': 'ion-ios-cloudy-outline',
|
|
||||||
'01n': 'ion-ios-cloudy-night-outline',
|
|
||||||
'02n': 'ion-ios-cloudy-night',
|
|
||||||
'03n': 'ion-ios-cloud-outline',
|
|
||||||
'04n': 'ion-ios-cloud',
|
|
||||||
'09n': 'ion-ios-rainy',
|
|
||||||
'10n': 'ion-ios-rainy-outline',
|
|
||||||
'11n': 'ion-ios-thunderstorm',
|
|
||||||
'13n': 'ion-ios-snowy',
|
|
||||||
'50n': 'ion-ios-cloudy-outline'
|
|
||||||
};
|
|
||||||
$scope.weather = {};
|
|
||||||
|
|
||||||
$scope.switchUnits = function (name) {
|
|
||||||
$scope.units = name;
|
|
||||||
$scope.updateWeather();
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.switchDay = function (day) {
|
|
||||||
$scope.weather.current = day;
|
|
||||||
makeChart($scope.weather.days[$scope.weather.current].timeTemp)
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.updateWeather = function () {
|
|
||||||
$http({
|
|
||||||
method: method, url: url, params: {
|
|
||||||
appid: key,
|
|
||||||
lat: $scope.geoData.geoplugin_latitude,
|
|
||||||
lon: $scope.geoData.geoplugin_longitude,
|
|
||||||
units: $scope.units
|
|
||||||
}
|
|
||||||
}).then(function success(response) {
|
|
||||||
saveWeatherData(response.data);
|
|
||||||
makeChart($scope.weather.days[$scope.weather.current].timeTemp)
|
|
||||||
}, function error() {
|
|
||||||
console.log("WEATHER FAILED")
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
function updateGeoData() {
|
|
||||||
$http.jsonp('http://www.geoplugin.net/json.gp?jsoncallback=JSON_CALLBACK').then(function success(response) {
|
|
||||||
$scope.geoData = response.data;
|
|
||||||
$scope.updateWeather();
|
|
||||||
}, function error() {
|
|
||||||
console.log("GEO FAILED")
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function makeChart(data) {
|
|
||||||
AmCharts.makeChart('tempChart', {
|
|
||||||
type: 'serial',
|
|
||||||
theme: 'blur',
|
|
||||||
handDrawn: true,
|
|
||||||
categoryField: 'time',
|
|
||||||
dataProvider: data,
|
|
||||||
valueAxes: [
|
|
||||||
{
|
|
||||||
axisAlpha: 0.3,
|
|
||||||
gridAlpha: 0
|
|
||||||
}
|
|
||||||
],
|
|
||||||
graphs: [
|
|
||||||
{
|
|
||||||
bullet: 'square',
|
|
||||||
fillAlphas: 0.3,
|
|
||||||
fillColorsField: 'lineColor',
|
|
||||||
legendValueText: '[[value]]',
|
|
||||||
lineColorField: 'lineColor',
|
|
||||||
title: 'Temp',
|
|
||||||
valueField: 'temp'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
categoryAxis: {
|
|
||||||
gridAlpha: 0,
|
|
||||||
axisAlpha: 0.3
|
|
||||||
}
|
|
||||||
}).write('tempChart');
|
|
||||||
}
|
|
||||||
|
|
||||||
function saveWeatherData(data) {
|
|
||||||
var firstItem = data.list[0];
|
|
||||||
var weather = {
|
|
||||||
days: [{
|
|
||||||
date: new Date(),
|
|
||||||
timeTemp: [],
|
|
||||||
main: firstItem.weather[0].main,
|
|
||||||
description: firstItem.weather[0].description,
|
|
||||||
icon: firstItem.weather[0].icon,
|
|
||||||
temp: firstItem.main.temp
|
|
||||||
}], current: 0
|
|
||||||
};
|
|
||||||
data.list.forEach(function (item, i) {
|
|
||||||
var itemDate = new Date(item.dt_txt);
|
|
||||||
if (itemDate.getDate() !== weather.days[weather.days.length - 1].date.getDate()) {
|
|
||||||
weather.days.push({date: itemDate, timeTemp: []});
|
|
||||||
}
|
|
||||||
var lastItem = weather.days[weather.days.length - 1];
|
|
||||||
lastItem.timeTemp.push({
|
|
||||||
time: itemDate.getHours(),
|
|
||||||
temp: item.main.temp
|
|
||||||
});
|
|
||||||
if ((weather.days.length > 1 && itemDate.getHours() == middleOfTheDay) || i == data.list.length - 1) {
|
|
||||||
lastItem.main = item.weather[0].main;
|
|
||||||
lastItem.description = item.weather[0].description;
|
|
||||||
lastItem.icon = item.weather[0].icon;
|
|
||||||
lastItem.temp = item.main.temp;
|
|
||||||
lastItem.date.setHours(i == data.list.length - 1 ? 0 : middleOfTheDay);
|
|
||||||
lastItem.date.setMinutes(0);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
console.log(weather.days[weather.current].date);
|
|
||||||
weather.days = weather.days.slice(0, $element.attr('forecast') || 5);
|
|
||||||
$scope.weather = weather;
|
|
||||||
}
|
|
||||||
|
|
||||||
updateGeoData();
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,19 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.dashboard')
|
|
||||||
.directive('weather', weather);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function weather() {
|
|
||||||
return {
|
|
||||||
restrict: 'EA',
|
|
||||||
controller: 'WeatherCtrl',
|
|
||||||
templateUrl: 'app/pages/dashboard/weather/weather.html'
|
|
||||||
};
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,45 +0,0 @@
|
||||||
<div class="weather-wrapper">
|
|
||||||
<div class="weather-main-info">
|
|
||||||
<h5 class="city-date font-x1dot5">
|
|
||||||
<div>
|
|
||||||
{{geoData.geoplugin_city}} - {{geoData.geoplugin_countryName | uppercase}}
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
{{ weather.days[weather.current].date | date : 'EEEE h:mm'}}
|
|
||||||
</div>
|
|
||||||
</h5>
|
|
||||||
<div class="weather-description font-x1dot5">
|
|
||||||
<i class="font-x3 {{weatherIcons[weather.days[weather.current].icon]}}"></i>
|
|
||||||
|
|
||||||
<div class="weather-info">{{weather.days[weather.current].main}} -
|
|
||||||
{{weather.days[weather.current].description}}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="weather-temp font-x1dot5">
|
|
||||||
<i class="font-x2 ion-thermometer"></i>
|
|
||||||
|
|
||||||
<div class="weather-info" ng-switch on="units">
|
|
||||||
<span ng-switch-when="metric">{{weather.days[weather.current].temp}} °C | <a
|
|
||||||
ng-click="switchUnits('imperial')" href>°F</a></span>
|
|
||||||
<span ng-switch-when="imperial">{{weather.days[weather.current].temp}} °F | <a
|
|
||||||
ng-click="switchUnits('metric')" href>°C</a></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div id="tempChart" class="temp-by-time"></div>
|
|
||||||
<div class="select-day">
|
|
||||||
<div class="day" ng-repeat="day in weather.days" ng-click="switchDay($index)">
|
|
||||||
<div>
|
|
||||||
<span class="font-x1dot25">{{day.temp}}</span>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<i class="weatherIcon font-x2 {{weatherIcons[day.icon]}}"></i></td>
|
|
||||||
<span class="select-day-info">{{day.main}}</span>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<span>{{day.date | date : 'EEE'}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,52 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovsky
|
|
||||||
* created on 16.12.2015
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.form', ['ui.select', 'ngSanitize'])
|
|
||||||
.config(routeConfig);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function routeConfig($stateProvider) {
|
|
||||||
$stateProvider
|
|
||||||
.state('form', {
|
|
||||||
url: '/form',
|
|
||||||
template : '<ui-view autoscroll="true" autoscroll-body-top></ui-view>',
|
|
||||||
abstract: true,
|
|
||||||
title: 'Form Elements',
|
|
||||||
sidebarMeta: {
|
|
||||||
icon: 'ion-compose',
|
|
||||||
order: 250,
|
|
||||||
},
|
|
||||||
})
|
|
||||||
.state('form.inputs', {
|
|
||||||
url: '/inputs',
|
|
||||||
templateUrl: 'app/pages/form/inputs/inputs.html',
|
|
||||||
title: 'Form Inputs',
|
|
||||||
sidebarMeta: {
|
|
||||||
order: 0,
|
|
||||||
},
|
|
||||||
})
|
|
||||||
.state('form.layouts', {
|
|
||||||
url: '/layouts',
|
|
||||||
templateUrl: 'app/pages/form/layouts/layouts.html',
|
|
||||||
title: 'Form Layouts',
|
|
||||||
sidebarMeta: {
|
|
||||||
order: 100,
|
|
||||||
},
|
|
||||||
})
|
|
||||||
.state('form.wizard',
|
|
||||||
{
|
|
||||||
url: '/wizard',
|
|
||||||
templateUrl: 'app/pages/form/wizard/wizard.html',
|
|
||||||
controller: 'WizardCtrl',
|
|
||||||
controllerAs: 'vm',
|
|
||||||
title: 'Form Wizard',
|
|
||||||
sidebarMeta: {
|
|
||||||
order: 200,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,67 +0,0 @@
|
||||||
<div class="widgets">
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-6">
|
|
||||||
<div
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Standard Fields"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/inputs/widgets/standardFields.html'"></div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Tags Input"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/inputs/widgets/tagsInput/tagsInput.html'"></div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Input Groups"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/inputs/widgets/inputGroups.html'"></div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Checkboxes & Radios"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/inputs/widgets/checkboxesRadios.html'"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div ba-panel ba-panel-title="On/Off Switches" ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/inputs/widgets/switches/switch.html'"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div ba-panel ba-panel-title="Old On/Off Switches (Deprecated)" ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/inputs/widgets/oldSwitches/switch.html'"></div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Datepicker"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/inputs/widgets/datePickers/datePickers.html'"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class="col-md-6">
|
|
||||||
<div
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Validation States"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/inputs/widgets/validationStates.html'"></div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Selects"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/inputs/widgets/select/select.html'"></div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Old selects(deprecated)"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/inputs/widgets/oldSelect/select.html'"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,56 +0,0 @@
|
||||||
<div class="checkbox-demo-row">
|
|
||||||
<div class="input-demo checkbox-demo row">
|
|
||||||
<div class="col-md-4">
|
|
||||||
<label class="checkbox-inline custom-checkbox nowrap">
|
|
||||||
<input type="checkbox" id="inlineCheckbox01" value="option1">
|
|
||||||
<span>Check 1</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-4">
|
|
||||||
<label class="checkbox-inline custom-checkbox nowrap">
|
|
||||||
<input type="checkbox" id="inlineCheckbox02" value="option2">
|
|
||||||
<span>Check 2</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-4">
|
|
||||||
<label class="checkbox-inline custom-checkbox nowrap">
|
|
||||||
<input type="checkbox" id="inlineCheckbox03" value="option3">
|
|
||||||
<span>Check 3</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="input-demo radio-demo row">
|
|
||||||
<div class="col-md-4">
|
|
||||||
<label class="radio-inline custom-radio nowrap">
|
|
||||||
<input type="radio" name="inlineRadioOptions" id="inlineRadio1" value="option1">
|
|
||||||
<span>Option 1</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-4">
|
|
||||||
<label class="radio-inline custom-radio nowrap">
|
|
||||||
<input type="radio" name="inlineRadioOptions" id="inlineRadio2" value="option2">
|
|
||||||
<span>Option 2</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-4">
|
|
||||||
<label class="radio-inline custom-radio nowrap">
|
|
||||||
<input type="radio" name="inlineRadioOptions" id="inlineRadio3" value="option3">
|
|
||||||
<span>Option3</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<div class="checkbox disabled">
|
|
||||||
<label class="custom-checkbox nowrap">
|
|
||||||
<input type="checkbox" value="" disabled>
|
|
||||||
<span>Checkbox is disabled</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="radio disabled">
|
|
||||||
<label class="custom-radio nowrap">
|
|
||||||
<input type="radio" name="optionsRadios" id="optionsRadios3" value="option3" disabled>
|
|
||||||
<span>Disabled option</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,22 +0,0 @@
|
||||||
<div class="datepicker row">
|
|
||||||
<div class="col-xlg-6 col-md-12 col-sm-6" ng-controller="datepickerCtrl">
|
|
||||||
<h4>Inline</h4>
|
|
||||||
<label>Selected date is: <em>{{dt | date:'fullDate' }}</em></label>
|
|
||||||
<div class="uib-datepicker-wrap">
|
|
||||||
<uib-datepicker ng-model="dt" datepicker-options="options"></uib-datepicker>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-xlg-6 col-md-12 col-sm-6" ng-controller="datepickerpopupCtrl">
|
|
||||||
<h4>Popup</h4>
|
|
||||||
<label>Selected date is: <em>{{dt | date:'fullDate' }}</em></label>
|
|
||||||
<p class="input-group">
|
|
||||||
<input type="text" class="form-control" uib-datepicker-popup="{{format}}" datepicker-options="options" ng-model="dt" is-open="opened" ng-required="true" close-text="Close" alt-input-formats="altInputFormats" show-button-bar="false" />
|
|
||||||
<span class="input-group-btn">
|
|
||||||
<button type="button" class="btn btn-default" ng-click="open()"><i class="glyphicon glyphicon-calendar"></i></button>
|
|
||||||
</span>
|
|
||||||
</p>
|
|
||||||
<label>Format: <span class="muted-text">(manual alternate <em>{{altInputFormats[0]}}</em>)</span></label> <select class="form-control" ng-model="format" ng-options="f for f in formats"><option></option></select>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,20 +0,0 @@
|
||||||
/**
|
|
||||||
* Created by n.poltoratsky
|
|
||||||
* on 23.06.2016.
|
|
||||||
*/
|
|
||||||
(function(){
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.form')
|
|
||||||
.controller('datepickerCtrl', datepickerCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function datepickerCtrl($scope) {
|
|
||||||
|
|
||||||
$scope.dt = new Date();
|
|
||||||
$scope.options = {
|
|
||||||
showWeeks: false
|
|
||||||
};
|
|
||||||
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,26 +0,0 @@
|
||||||
/**
|
|
||||||
* Created by n.poltoratsky
|
|
||||||
* on 23.06.2016.
|
|
||||||
*/
|
|
||||||
(function(){
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.form')
|
|
||||||
.controller('datepickerpopupCtrl', datepickerpopupCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function datepickerpopupCtrl($scope) {
|
|
||||||
|
|
||||||
$scope.open = open;
|
|
||||||
$scope.opened = false;
|
|
||||||
$scope.formats = ['dd-MMMM-yyyy', 'yyyy/MM/dd', 'dd.MM.yyyy', 'shortDate'];
|
|
||||||
$scope.format = $scope.formats[0];
|
|
||||||
$scope.options = {
|
|
||||||
showWeeks: false
|
|
||||||
};
|
|
||||||
|
|
||||||
function open() {
|
|
||||||
$scope.opened = true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,22 +0,0 @@
|
||||||
<div class="input-group">
|
|
||||||
<span class="input-group-addon input-group-addon-primary addon-left" id="basic-addon1">@</span>
|
|
||||||
<input type="text" class="form-control with-primary-addon" placeholder="Username" aria-describedby="basic-addon1">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="input-group">
|
|
||||||
<input type="text" class="form-control with-warning-addon" placeholder="Recipient's username" aria-describedby="basic-addon2">
|
|
||||||
<span class="input-group-addon input-group-addon-warning addon-right" id="basic-addon2">@example.com</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="input-group">
|
|
||||||
<span class="input-group-addon addon-left input-group-addon-success">$</span>
|
|
||||||
<input type="text" class="form-control with-success-addon" aria-label="Amount (to the nearest dollar)">
|
|
||||||
<span class="input-group-addon addon-right input-group-addon-success">.00</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="input-group">
|
|
||||||
<input type="text" class="form-control with-danger-addon" placeholder="Search for...">
|
|
||||||
<span class="input-group-btn">
|
|
||||||
<button class="btn btn-danger" type="button">Go!</button>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,39 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovsky
|
|
||||||
* created on 22.04.2016
|
|
||||||
* @deprecated
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.form')
|
|
||||||
.controller('OldSelectpickerPanelCtrl', OldSelectpickerPanelCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function OldSelectpickerPanelCtrl() {
|
|
||||||
var vm = this;
|
|
||||||
|
|
||||||
vm.standardSelectItems = [
|
|
||||||
{ label: 'Option 1', value: 1 },
|
|
||||||
{ label: 'Option 2', value: 2 },
|
|
||||||
{ label: 'Option 3', value: 3 },
|
|
||||||
{ label: 'Option 4', value: 4 },
|
|
||||||
];
|
|
||||||
|
|
||||||
vm.selectWithSearchItems = [
|
|
||||||
{ label: 'Hot Dog, Fries and a Soda', value: 1 },
|
|
||||||
{ label: 'Burger, Shake and a Smile', value: 2 },
|
|
||||||
{ label: 'Sugar, Spice and all things nice', value: 3 },
|
|
||||||
{ label: 'Baby Back Ribs', value: 4 },
|
|
||||||
];
|
|
||||||
|
|
||||||
vm.groupedSelectItems = [
|
|
||||||
{ label: 'Group 1 - Option 1', value: 1, group: 'Group 1' },
|
|
||||||
{ label: 'Group 2 - Option 2', value: 2, group: 'Group 2' },
|
|
||||||
{ label: 'Group 1 - Option 3', value: 3, group: 'Group 1' },
|
|
||||||
{ label: 'Group 2 - Option 4', value: 4, group: 'Group 2' },
|
|
||||||
];
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,134 +0,0 @@
|
||||||
<div ng-controller="OldSelectpickerPanelCtrl as selectpickerVm">
|
|
||||||
<div class="form-group">
|
|
||||||
<select class="form-control selectpicker" selectpicker title="Standard Select"
|
|
||||||
ng-model="selectpickerVm.standardSelected"
|
|
||||||
ng-options="item as item.label for item in selectpickerVm.standardSelectItems">
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<select class="form-control selectpicker with-search" data-live-search="true" title="Select With Search"
|
|
||||||
selectpicker
|
|
||||||
ng-model="selectpickerVm.searchSelectedItem"
|
|
||||||
ng-options="item as item.label for item in selectpickerVm.selectWithSearchItems">
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<select class="form-control selectpicker" title="Option Types" selectpicker>
|
|
||||||
<option>Standard option</option>
|
|
||||||
<option data-subtext="option subtext">Option with subtext</option>
|
|
||||||
<option disabled>Disabled Option</option>
|
|
||||||
<option data-icon="glyphicon-heart">Option with cion</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<select class="form-control selectpicker" disabled title="Disabled Select" selectpicker>
|
|
||||||
<option>Option 1</option>
|
|
||||||
<option>Option 2</option>
|
|
||||||
<option>Option 3</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<div class="form-group">
|
|
||||||
<select class="form-control" title="Select with Option Groups" selectpicker
|
|
||||||
ng-model="selectpickerVm.groupedSelectedItem"
|
|
||||||
ng-options="item as item.label group by item.group for item in selectpickerVm.groupedSelectItems">
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<div class="form-group">
|
|
||||||
<select class="form-control" title="Select with Divider" selectpicker>
|
|
||||||
<option>Group 1 - Option 1</option>
|
|
||||||
<option>Group 1 - Option 2</option>
|
|
||||||
<option data-divider="true"></option>
|
|
||||||
<option>Group 2 - Option 1</option>
|
|
||||||
<option>Group 2 - Option 2</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group">
|
|
||||||
<select class="form-control" title="Multiple Select" multiple selectpicker
|
|
||||||
ng-model="selectpickerVm.multipleSelectedItems"
|
|
||||||
ng-options="item as item.label for item in selectpickerVm.standardSelectItems">
|
|
||||||
<option>Option 1</option>
|
|
||||||
<option>Option 2</option>
|
|
||||||
<option>Option 3</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<select class="form-control" title="Multiple Select with Limit" multiple data-max-options="2" selectpicker
|
|
||||||
ng-model="selectpickerVm.multipleSelectedItems2"
|
|
||||||
ng-options="item as item.label for item in selectpickerVm.standardSelectItems">
|
|
||||||
<option>Option 1</option>
|
|
||||||
<option>Option 2</option>
|
|
||||||
<option>Option 3</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<div class="form-group">
|
|
||||||
<select class="form-control" title="Primary Select" data-style="btn-primary" data-container="body"
|
|
||||||
selectpicker>
|
|
||||||
<option>Option 1</option>
|
|
||||||
<option>Option 2</option>
|
|
||||||
<option>Option 3</option>
|
|
||||||
<option>Option 4</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<select class="form-control" title="Success Select" data-style="btn-success" data-container="body"
|
|
||||||
selectpicker>
|
|
||||||
<option>Option 1</option>
|
|
||||||
<option>Option 2</option>
|
|
||||||
<option>Option 3</option>
|
|
||||||
<option>Option 4</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<select class="form-control" title="Warning Select" data-style="btn-warning" data-container="body"
|
|
||||||
selectpicker>
|
|
||||||
<option>Option 1</option>
|
|
||||||
<option>Option 2</option>
|
|
||||||
<option>Option 3</option>
|
|
||||||
<option>Option 4</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<div class="form-group">
|
|
||||||
<select class="form-control" title="Info Select" data-style="btn-info" data-container="body"
|
|
||||||
selectpicker>
|
|
||||||
<option>Option 1</option>
|
|
||||||
<option>Option 2</option>
|
|
||||||
<option>Option 3</option>
|
|
||||||
<option>Option 4</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group">
|
|
||||||
<select class="form-control" title="Danger Select" data-style="btn-danger" data-container="body"
|
|
||||||
selectpicker>
|
|
||||||
<option>Option 1</option>
|
|
||||||
<option>Option 2</option>
|
|
||||||
<option>Option 3</option>
|
|
||||||
<option>Option 4</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group">
|
|
||||||
<select class="form-control" title="Inverse Select" data-style="btn-inverse" data-container="body"
|
|
||||||
selectpicker>
|
|
||||||
<option>Option 1</option>
|
|
||||||
<option>Option 2</option>
|
|
||||||
<option>Option 3</option>
|
|
||||||
<option>Option 4</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,42 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
* @deprecated
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.form')
|
|
||||||
.directive('selectpicker', selectpicker);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function selectpicker() {
|
|
||||||
return {
|
|
||||||
restrict: 'A',
|
|
||||||
require: '?ngOptions',
|
|
||||||
priority: 1500, // make priority bigger than ngOptions and ngRepeat
|
|
||||||
link: {
|
|
||||||
pre: function(scope, elem, attrs) {
|
|
||||||
elem.append('<option data-hidden="true" disabled value="">' + (attrs.title || 'Select something') + '</option>')
|
|
||||||
},
|
|
||||||
post: function(scope, elem, attrs) {
|
|
||||||
function refresh() {
|
|
||||||
elem.selectpicker('refresh');
|
|
||||||
}
|
|
||||||
|
|
||||||
if (attrs.ngModel) {
|
|
||||||
scope.$watch(attrs.ngModel, refresh);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (attrs.ngDisabled) {
|
|
||||||
scope.$watch(attrs.ngDisabled, refresh);
|
|
||||||
}
|
|
||||||
|
|
||||||
elem.selectpicker({ dropupAuto: false, hideDisabled: true });
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,24 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovsky
|
|
||||||
* created on 07.06.2016
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.form')
|
|
||||||
.controller('OldSwitchPanelCtrl', OldSwitchPanelCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function OldSwitchPanelCtrl() {
|
|
||||||
var vm = this;
|
|
||||||
|
|
||||||
vm.switcherValues = {
|
|
||||||
primary: true,
|
|
||||||
warning: true,
|
|
||||||
danger: true,
|
|
||||||
info: true,
|
|
||||||
success: true
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,37 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovksy
|
|
||||||
* created on 16.12.2015
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.form')
|
|
||||||
.directive('switch', switchDirective);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function switchDirective($timeout) {
|
|
||||||
return {
|
|
||||||
restrict: 'EA',
|
|
||||||
replace: true,
|
|
||||||
scope: {
|
|
||||||
ngModel: '='
|
|
||||||
},
|
|
||||||
template: function(el, attrs) {
|
|
||||||
return '<div class="switch-container ' + (attrs.color || '') + '"><input type="checkbox" ng-model="ngModel"></div>';
|
|
||||||
},
|
|
||||||
link: function (scope, elem, attr) {
|
|
||||||
var input = $(elem).find('input');
|
|
||||||
input.bootstrapSwitch({
|
|
||||||
size: 'small',
|
|
||||||
onColor: attr.color
|
|
||||||
});
|
|
||||||
input.on('switchChange.bootstrapSwitch', function(event, state) {
|
|
||||||
scope.ngModel = state;
|
|
||||||
scope.$apply();
|
|
||||||
});
|
|
||||||
|
|
||||||
}
|
|
||||||
};
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,7 +0,0 @@
|
||||||
<div ng-controller="OldSwitchPanelCtrl as switchPanelVm" class="switches clearfix">
|
|
||||||
<switch color="primary" ng-model="switchPanelVm.switcherValues.primary"></switch>
|
|
||||||
<switch color="warning" ng-model="switchPanelVm.switcherValues.warning"></switch>
|
|
||||||
<switch color="danger" ng-model="switchPanelVm.switcherValues.danger"></switch>
|
|
||||||
<switch color="info" ng-model="switchPanelVm.switcherValues.info"></switch>
|
|
||||||
<switch color="success" ng-model="switchPanelVm.switcherValues.success"></switch>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,44 +0,0 @@
|
||||||
/**
|
|
||||||
* @author p.maslava
|
|
||||||
* created on 28.11.2016
|
|
||||||
*/
|
|
||||||
|
|
||||||
(function() {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.form')
|
|
||||||
.filter('groupSelectpickerOptions', GroupSelectpickerOptions);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function GroupSelectpickerOptions() {
|
|
||||||
return function (items, props) {
|
|
||||||
var out = [];
|
|
||||||
|
|
||||||
if (angular.isArray(items)) {
|
|
||||||
var keys = Object.keys(props);
|
|
||||||
|
|
||||||
items.forEach(function (item) {
|
|
||||||
var itemMatches = false;
|
|
||||||
|
|
||||||
for (var i = 0; i < keys.length; i++) {
|
|
||||||
var prop = keys[i];
|
|
||||||
var text = props[prop].toLowerCase();
|
|
||||||
if (item[prop].toString().toLowerCase().indexOf(text) !== -1) {
|
|
||||||
itemMatches = true;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (itemMatches) {
|
|
||||||
out.push(item);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
// Let the output be the input untouched
|
|
||||||
out = items;
|
|
||||||
}
|
|
||||||
|
|
||||||
return out;
|
|
||||||
};
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
@ -1,92 +0,0 @@
|
||||||
/**
|
|
||||||
* @author p.maslava
|
|
||||||
* created on 28.11.2016
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.form')
|
|
||||||
.controller('SelectpickerPanelCtrl', SelectpickerPanelCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function SelectpickerPanelCtrl() {
|
|
||||||
|
|
||||||
var vm = this;
|
|
||||||
vm.disabled = undefined;
|
|
||||||
|
|
||||||
|
|
||||||
vm.standardItem = {};
|
|
||||||
vm.standardSelectItems = [
|
|
||||||
{label: 'Option 1', value: 1},
|
|
||||||
{label: 'Option 2', value: 2},
|
|
||||||
{label: 'Option 3', value: 3},
|
|
||||||
{label: 'Option 4', value: 4}
|
|
||||||
];
|
|
||||||
|
|
||||||
vm.withSearchItem = {};
|
|
||||||
|
|
||||||
vm.selectWithSearchItems = [
|
|
||||||
{label: 'Hot Dog, Fries and a Soda', value: 1},
|
|
||||||
{label: 'Burger, Shake and a Smile', value: 2},
|
|
||||||
{label: 'Sugar, Spice and all things nice', value: 3},
|
|
||||||
{label: 'Baby Back Ribs', value: 4}
|
|
||||||
];
|
|
||||||
vm.groupedItem = {};
|
|
||||||
vm.groupedSelectItems = [
|
|
||||||
{label: 'Group 1 - Option 1', value: 1, group: 'Group 1'},
|
|
||||||
{label: 'Group 2 - Option 2', value: 2, group: 'Group 2'},
|
|
||||||
{label: 'Group 1 - Option 3', value: 3, group: 'Group 1'},
|
|
||||||
{label: 'Group 2 - Option 4', value: 4, group: 'Group 2'}
|
|
||||||
];
|
|
||||||
|
|
||||||
vm.groupedByItem = {};
|
|
||||||
vm.groupedBySelectItems = [
|
|
||||||
{name: 'Adam', country: 'United States'},
|
|
||||||
{name: 'Amalie', country: 'Argentina'},
|
|
||||||
{name: 'Estefanía', country: 'Argentina'},
|
|
||||||
{name: 'Adrian', country: 'Ecuador'},
|
|
||||||
{name: 'Wladimir', country: 'Ecuador'},
|
|
||||||
{name: 'Samantha', country: 'United States'},
|
|
||||||
{name: 'Nicole', country: 'Colombia'},
|
|
||||||
{name: 'Natasha', country: 'Ecuador'},
|
|
||||||
{name: 'Michael', country: 'Colombia'},
|
|
||||||
{name: 'Nicolás', country: 'Colombia'}
|
|
||||||
];
|
|
||||||
vm.someGroupFn = function (item) {
|
|
||||||
|
|
||||||
if (item.name[0] >= 'A' && item.name[0] <= 'M')
|
|
||||||
return 'From A - M';
|
|
||||||
if (item.name[0] >= 'N' && item.name[0] <= 'Z')
|
|
||||||
return 'From N - Z';
|
|
||||||
};
|
|
||||||
|
|
||||||
vm.disableItem = {};
|
|
||||||
vm.disableItems = [];
|
|
||||||
|
|
||||||
vm.multipleItem = {};
|
|
||||||
vm.multipleSelectItems = [
|
|
||||||
{label: 'Option 1', value: 1},
|
|
||||||
{label: 'Option 2', value: 2},
|
|
||||||
{label: 'Option 3', value: 3},
|
|
||||||
{label: 'Option 4', value: 4},
|
|
||||||
{label: 'Option 5', value: 5},
|
|
||||||
{label: 'Option 6', value: 6},
|
|
||||||
{label: 'Option 7', value: 7},
|
|
||||||
{label: 'Option 8', value: 8}
|
|
||||||
];
|
|
||||||
vm.withDeleteItem = {};
|
|
||||||
vm.withDeleteSelectItems = [
|
|
||||||
{label: 'Option 1', value: 1},
|
|
||||||
{label: 'Option 2', value: 2},
|
|
||||||
{label: 'Option 3', value: 3},
|
|
||||||
{label: 'Option 4', value: 4},
|
|
||||||
{label: 'Option 5', value: 5},
|
|
||||||
{label: 'Option 6', value: 6},
|
|
||||||
{label: 'Option 7', value: 7},
|
|
||||||
{label: 'Option 8', value: 8}
|
|
||||||
];
|
|
||||||
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -1,124 +0,0 @@
|
||||||
<div class="ng-cloak" ng-controller="SelectpickerPanelCtrl as selectpickerVm">
|
|
||||||
<div class="form-group">
|
|
||||||
<ui-select ng-model="selectpickerVm.selectedItem.selected"
|
|
||||||
class="btn-group bootstrap-select form-control"
|
|
||||||
ng-disabled="false"
|
|
||||||
append-to-body="true"
|
|
||||||
search-enabled="false">
|
|
||||||
<ui-select-match placeholder="Standard Select">
|
|
||||||
<span> {{$select.selected.label}}</span>
|
|
||||||
</ui-select-match>
|
|
||||||
<ui-select-choices repeat="standardItem in selectpickerVm.standardSelectItems | filter: $select.search">
|
|
||||||
<span ng-bind-html="standardItem.label"></span>
|
|
||||||
</ui-select-choices>
|
|
||||||
</ui-select>
|
|
||||||
</div>
|
|
||||||
<div class="form-group ">
|
|
||||||
<ui-select ng-model="selectpickerVm.withSearchItem.selected"
|
|
||||||
class="btn-group bootstrap-select form-control"
|
|
||||||
ng-disabled="false"
|
|
||||||
append-to-body="true"
|
|
||||||
search-enabled="true">
|
|
||||||
<ui-select-match placeholder="Select With Search">
|
|
||||||
{{$select.selected.label}}
|
|
||||||
</ui-select-match>
|
|
||||||
<ui-select-choices
|
|
||||||
repeat="withSearchItem in selectpickerVm.selectWithSearchItems | filter: $select.search">
|
|
||||||
<span ng-bind-html="withSearchItem.label"></span>
|
|
||||||
</ui-select-choices>
|
|
||||||
</ui-select>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group">
|
|
||||||
<ui-select ng-model="selectpickerVm.disableItem.selected"
|
|
||||||
class="btn-group bootstrap-select form-control"
|
|
||||||
ng-disabled="true"
|
|
||||||
append-to-body="true"
|
|
||||||
search-enabled="false">
|
|
||||||
<ui-select-match placeholder="Disabled Selection">
|
|
||||||
<span> {{$select.selected.label}}</span>
|
|
||||||
</ui-select-match>
|
|
||||||
<ui-select-choices repeat="disableItem in selectpickerVm.disableItems | filter: $select.search">
|
|
||||||
<span ng-bind-html="disableItem.label"></span>
|
|
||||||
</ui-select-choices>
|
|
||||||
</ui-select>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="form-group">
|
|
||||||
<ui-select ng-model="selectpickerVm.groupedItems.selected"
|
|
||||||
class="btn-group bootstrap-select form-control"
|
|
||||||
ng-disabled="false"
|
|
||||||
append-to-body="true"
|
|
||||||
search-enabled="true">
|
|
||||||
<ui-select-match placeholder="Select With Option Groups">
|
|
||||||
{{$select.selected.label}}
|
|
||||||
</ui-select-match>
|
|
||||||
<ui-select-choices
|
|
||||||
repeat="groupedItems in selectpickerVm.groupedSelectItems | groupSelectpickerOptions: {label: $select.search}"
|
|
||||||
group-by="'group'">
|
|
||||||
<span ng-bind-html="groupedItems.label | highlight: $select.search"></span>
|
|
||||||
</ui-select-choices>
|
|
||||||
</ui-select>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group">
|
|
||||||
<ui-select ng-model="selectpickerVm.groupedByItems.selected"
|
|
||||||
class="btn-group bootstrap-select form-control"
|
|
||||||
ng-disabled="false"
|
|
||||||
append-to-body="true"
|
|
||||||
search-enabled="true">
|
|
||||||
<ui-select-match placeholder="Select With Option Groups Function">
|
|
||||||
{{$select.selected.name}}
|
|
||||||
</ui-select-match>
|
|
||||||
<ui-select-choices
|
|
||||||
repeat="groupedByItems in selectpickerVm.groupedBySelectItems | filter: $select.search"
|
|
||||||
group-by="selectpickerVm.someGroupFn">
|
|
||||||
<span ng-bind-html="groupedByItems.name | highlight: $select.search"></span>
|
|
||||||
</ui-select-choices>
|
|
||||||
</ui-select>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="form-group">
|
|
||||||
<ui-select multiple ng-model="selectpickerVm.multipleItem.selected"
|
|
||||||
ng-disabled="false"
|
|
||||||
search-enabled="true"
|
|
||||||
append-to-body="true"
|
|
||||||
class="form-control ">
|
|
||||||
<ui-select-match placeholder="Multiple Select">
|
|
||||||
{{$item.label}}
|
|
||||||
</ui-select-match>
|
|
||||||
<ui-select-choices repeat="multipleItem in selectpickerVm.multipleSelectItems | filter: $select.search">
|
|
||||||
{{multipleItem.label}}
|
|
||||||
</ui-select-choices>
|
|
||||||
</ui-select>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="form-group ">
|
|
||||||
<div class="input-group">
|
|
||||||
|
|
||||||
<ui-select multiple
|
|
||||||
ng-model="selectpickerVm.withDeleteItem.selected"
|
|
||||||
ng-disabled="false"
|
|
||||||
search-enabled="true"
|
|
||||||
append-to-body="true"
|
|
||||||
class="form-control form-control">
|
|
||||||
<ui-select-match placeholder="Select With Clear Button">
|
|
||||||
{{$item.label}}
|
|
||||||
</ui-select-match>
|
|
||||||
<ui-select-choices
|
|
||||||
repeat="withDeleteItem in selectpickerVm.withDeleteSelectItems | filter: $select.search">
|
|
||||||
{{withDeleteItem.label}}
|
|
||||||
</ui-select-choices>
|
|
||||||
</ui-select>
|
|
||||||
<span class="input-group-btn">
|
|
||||||
<button type="button" ng-click="selectpickerVm.withDeleteItem.selected = undefined"
|
|
||||||
class="btn btn-danger">
|
|
||||||
<span class="glyphicon glyphicon-trash"></span>
|
|
||||||
</button>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,35 +0,0 @@
|
||||||
<form>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="input01">Text</label>
|
|
||||||
<input type="text" class="form-control" id="input01" placeholder="Text">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="input02">Password</label>
|
|
||||||
<input type="password" class="form-control" id="input02" placeholder="Password">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="input03">Rounded Corners</label>
|
|
||||||
<input type="text" class="form-control form-control-rounded" id="input03" placeholder="Rounded Corners">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="input04">With help</label>
|
|
||||||
<input type="text" class="form-control" id="input04" placeholder="With help">
|
|
||||||
<span class="help-block sub-little-text">A block of help text that breaks onto a new line and may extend beyond one line.</span>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="input05">Disabled Input</label>
|
|
||||||
<input type="text" class="form-control" id="input05" placeholder="Disabled Input" disabled>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="textarea01">Textarea</label>
|
|
||||||
<textarea placeholder="Default Input" class="form-control" id="textarea01"></textarea>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group">
|
|
||||||
<input type="text" class="form-control input-sm" id="input2" placeholder="Small Input">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<input type="text" class="form-control input-lg" id="input4" placeholder="Large Input">
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
|
|
@ -1,23 +0,0 @@
|
||||||
/**
|
|
||||||
* @author v.lugovsky
|
|
||||||
* created on 10.12.2016
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
angular.module('BlurAdmin.pages.form')
|
|
||||||
.controller('SwitchDemoPanelCtrl', SwitchDemoPanelCtrl);
|
|
||||||
|
|
||||||
/** @ngInject */
|
|
||||||
function SwitchDemoPanelCtrl() {
|
|
||||||
var vm = this;
|
|
||||||
vm.switches = {
|
|
||||||
s1: true,
|
|
||||||
s2: false,
|
|
||||||
s3: true,
|
|
||||||
s4: true,
|
|
||||||
s5: false
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
|
|
@ -1,9 +0,0 @@
|
||||||
<div ng-controller="SwitchDemoPanelCtrl as vm">
|
|
||||||
<ba-switcher switcher-style="primary" switcher-value="vm.switches.s1"></ba-switcher>
|
|
||||||
<ba-switcher switcher-style="success" switcher-value="vm.switches.s2"></ba-switcher>
|
|
||||||
<ba-switcher switcher-style="warning" switcher-value="vm.switches.s3"></ba-switcher>
|
|
||||||
<ba-switcher switcher-style="danger" switcher-value="vm.switches.s4"></ba-switcher>
|
|
||||||
<ba-switcher switcher-style="info" switcher-value="vm.switches.s5"></ba-switcher>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -1,11 +0,0 @@
|
||||||
<div class="form-group">
|
|
||||||
<div class="form-group">
|
|
||||||
<input type="text" tag-input="primary" value="Amsterdam,Washington,Sydney,Beijing,Cairo" data-role="tagsinput" placeholder="Add Tag">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<input type="text" tag-input="warning" value="Minsk,Prague,Vilnius,Warsaw" data-role="tagsinput" placeholder="Add Tag">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<input type="text" tag-input="danger" value="London,Berlin,Paris,Rome,Munich" data-role="tagsinput" placeholder="Add Tag">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,64 +0,0 @@
|
||||||
<div class="form-group has-success">
|
|
||||||
<label class="control-label" for="inputSuccess1">Input with success</label>
|
|
||||||
<input type="text" class="form-control" id="inputSuccess1">
|
|
||||||
</div>
|
|
||||||
<div class="form-group has-warning">
|
|
||||||
<label class="control-label" for="inputWarning1">Input with warning</label>
|
|
||||||
<input type="text" class="form-control" id="inputWarning1">
|
|
||||||
</div>
|
|
||||||
<div class="form-group has-error">
|
|
||||||
<label class="control-label" for="inputError1">Input with error</label>
|
|
||||||
<input type="text" class="form-control" id="inputError1">
|
|
||||||
</div>
|
|
||||||
<div class="has-success">
|
|
||||||
<div class="checkbox">
|
|
||||||
<label class="custom-checkbox">
|
|
||||||
<input type="checkbox" id="checkboxSuccess" value="option1">
|
|
||||||
<span>Checkbox with success</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="has-warning">
|
|
||||||
<div class="checkbox">
|
|
||||||
<label class="custom-checkbox">
|
|
||||||
<input type="checkbox" id="checkboxWarning" value="option1">
|
|
||||||
<span>Checkbox with warning</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="has-error">
|
|
||||||
<div class="checkbox">
|
|
||||||
<label class="custom-checkbox">
|
|
||||||
<input type="checkbox" id="checkboxError" value="option1">
|
|
||||||
<span>Checkbox with error</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group has-success has-feedback">
|
|
||||||
<label class="control-label" for="inputSuccess2">Input with success</label>
|
|
||||||
<input type="text" class="form-control" id="inputSuccess2" aria-describedby="inputSuccess2Status">
|
|
||||||
<i class="ion-checkmark-circled form-control-feedback" aria-hidden="true"></i>
|
|
||||||
<span id="inputSuccess2Status" class="sr-only">(success)</span>
|
|
||||||
</div>
|
|
||||||
<div class="form-group has-warning has-feedback">
|
|
||||||
<label class="control-label" for="inputWarning2">Input with warning</label>
|
|
||||||
<input type="text" class="form-control" id="inputWarning2" aria-describedby="inputWarning2Status">
|
|
||||||
<i class="ion-alert-circled form-control-feedback" aria-hidden="true"></i>
|
|
||||||
<span id="inputWarning2Status" class="sr-only">(warning)</span>
|
|
||||||
</div>
|
|
||||||
<div class="form-group has-error has-feedback">
|
|
||||||
<label class="control-label" for="inputError2">Input with error</label>
|
|
||||||
<input type="text" class="form-control" id="inputError2" aria-describedby="inputError2Status">
|
|
||||||
<i class="ion-android-cancel form-control-feedback" aria-hidden="true"></i>
|
|
||||||
<span id="inputError2Status" class="sr-only">(error)</span>
|
|
||||||
</div>
|
|
||||||
<div class="form-group has-success has-feedback">
|
|
||||||
<label class="control-label" for="inputGroupSuccess1">Input group with success</label>
|
|
||||||
<div class="input-group">
|
|
||||||
<span class="input-group-addon addon-left">@</span>
|
|
||||||
<input type="text" class="form-control" id="inputGroupSuccess1" aria-describedby="inputGroupSuccess1Status">
|
|
||||||
</div>
|
|
||||||
<i class="ion-checkmark-circled form-control-feedback" aria-hidden="true"></i>
|
|
||||||
<span id="inputGroupSuccess1Status" class="sr-only">(success)</span>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,44 +0,0 @@
|
||||||
<div class="widgets">
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-12"
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Inline Form"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/layouts/widgets/inlineForm.html'"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-6">
|
|
||||||
<div
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Basic Form"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/layouts/widgets/basicForm.html'"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Horizontal Form"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/layouts/widgets/horizontalForm.html'"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-6">
|
|
||||||
<div
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Form Without Labels"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/layouts/widgets/formWithoutLabels.html'"></div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
ba-panel
|
|
||||||
ba-panel-title="Block Form"
|
|
||||||
ba-panel-class="with-scroll">
|
|
||||||
<div ng-include="'app/pages/form/layouts/widgets/blockForm.html'"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,17 +0,0 @@
|
||||||
<form>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="exampleInputEmail1">Email address</label>
|
|
||||||
<input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="exampleInputPassword1">Password</label>
|
|
||||||
<input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
|
|
||||||
</div>
|
|
||||||
<div class="checkbox">
|
|
||||||
<label class="custom-checkbox">
|
|
||||||
<input type="checkbox">
|
|
||||||
<span>Check me out</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<button type="submit" class="btn btn-danger">Submit</button>
|
|
||||||
</form>
|
|
||||||
|
|
@ -1,29 +0,0 @@
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="inputFirstName">First Name</label>
|
|
||||||
<input type="text" class="form-control" id="inputFirstName" placeholder="First Name">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="inputLastName">Last Name</label>
|
|
||||||
<input type="text" class="form-control" id="inputLastName" placeholder="Last Name">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="inputFirstName">Email</label>
|
|
||||||
<input type="email" class="form-control" id="inputEmail" placeholder="Email">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="inputWebsite">Website</label>
|
|
||||||
<input type="text" class="form-control" id="inputWebsite" placeholder="Website">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<button type="submit" class="btn btn-primary">Submit</button>
|
|
||||||
|
|
@ -1,12 +0,0 @@
|
||||||
<form>
|
|
||||||
<div class="form-group">
|
|
||||||
<input type="text" class="form-control" placeholder="Recipients">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<input type="text" class="form-control" placeholder="Subject">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<textarea class="form-control" placeholder="Message"></textarea>
|
|
||||||
</div>
|
|
||||||
<button type="submit" class="btn btn-success">Send</button>
|
|
||||||
</form>
|
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue