describe("Ext.chart.theme.Base", function() { describe("generate from a base color of black", function() { var theme; beforeEach(function() { Ext.chart.theme.myTheme = Ext.extend(Ext.chart.theme.Base, { constructor: function(config) { Ext.chart.theme.myTheme.superclass.constructor.call(this, { baseColor: '#000' }); } }); theme = new Ext.chart.theme.myTheme(); }); afterEach(function() { delete Ext.chart.theme.myTheme; }); it("should return the generated colors", function() { expect(theme.colors).toEqual(['#000000','#262626','#4d4d4d','#737373','#999999']); }); }); describe("generate from a base color of white", function() { var theme; beforeEach(function() { Ext.chart.theme.myTheme = Ext.extend(Ext.chart.theme.Base, { constructor: function(config) { Ext.chart.theme.myTheme.superclass.constructor.call(this, { baseColor: '#fff' }); } }); theme = new Ext.chart.theme.myTheme(); }); afterEach(function() { delete Ext.chart.theme.myTheme; }); it("should return the generated colors", function() { expect(theme.colors).toEqual(['#666666','#8c8c8c','#b3b3b3','#d9d9d9','#ffffff']); }); }); describe("generate from a base color of #ff0000", function() { var theme; beforeEach(function() { Ext.chart.theme.myTheme = Ext.extend(Ext.chart.theme.Base, { constructor: function(config) { Ext.chart.theme.myTheme.superclass.constructor.call(this, { baseColor: '#ff0000' }); } }); theme = new Ext.chart.theme.myTheme(); }); afterEach(function() { delete Ext.chart.theme.myTheme; }); it("should return the generated colors", function() { expect(theme.colors).toEqual(['#660000','#b30000','#ff0000','#ff4d4d','#ff9999']); }); }); describe("generate from a base color of #00ff00", function() { var theme; beforeEach(function() { Ext.chart.theme.myTheme = Ext.extend(Ext.chart.theme.Base, { constructor: function(config) { Ext.chart.theme.myTheme.superclass.constructor.call(this, { baseColor: '#00ff00' }); } }); theme = new Ext.chart.theme.myTheme(); }); afterEach(function() { delete Ext.chart.theme.myTheme; }); it("should return the generated colors", function() { expect(theme.colors).toEqual(['#006600','#00b300','#00ff00','#4dff4d','#99ff99']); }); }); describe("generate from a base color of #0000ff", function() { var theme; beforeEach(function() { Ext.chart.theme.myTheme = Ext.extend(Ext.chart.theme.Base, { constructor: function(config) { Ext.chart.theme.myTheme.superclass.constructor.call(this, { baseColor: '#0000ff' }); } }); theme = new Ext.chart.theme.myTheme(); }); afterEach(function() { delete Ext.chart.theme.myTheme; }); it("should return the generated colors", function() { expect(theme.colors).toEqual(['#000066','#0000b3','#0000ff','#4d4dff','#9999ff']); }); }); describe("generate gradients from a base color of #800000", function() { var theme; beforeEach(function() { Ext.chart.theme.myTheme = Ext.extend(Ext.chart.theme.Base, { constructor: function(config) { Ext.chart.theme.myTheme.superclass.constructor.call(this, { baseColor: '#800000', useGradients: true }); } }); theme = new Ext.chart.theme.myTheme(); }); afterEach(function() { delete Ext.chart.theme.myTheme; }); it("should create 5 gradients", function() { expect(theme.gradients.length).toEqual(5); }); it("should return the generated first gradient from #340000 to #010000", function() { var gradient = theme.gradients[0].id.split('-'); gradient.pop(); gradient = gradient.join('-'); expect(gradient).toEqual('theme-340000-010000'); }); it("should return the generated second gradient from #800000 to #4d0000", function() { var gradient = theme.gradients[1].id.split('-'); gradient.pop(); gradient = gradient.join('-'); expect(gradient).toEqual('theme-800000-4d0000'); }); it("should return the generated third gradient from #cd0000 to #9a0000", function() { var gradient = theme.gradients[2].id.split('-'); gradient.pop(); gradient = gradient.join('-'); expect(gradient).toEqual('theme-cd0000-9a0000'); }); it("should return the generated fourth gradient from #ff1a1a to #e60000", function() { var gradient = theme.gradients[3].id.split('-'); gradient.pop(); gradient = gradient.join('-'); expect(gradient).toEqual('theme-ff1a1a-e60000'); }); it("should return the generated fifth gradient from #ff6666 to #ff3333", function() { var gradient = theme.gradients[4].id.split('-'); gradient.pop(); gradient = gradient.join('-'); expect(gradient).toEqual('theme-ff6666-ff3333'); }); }); });