[MERGE] bunch of stuff from trunk

bzr revid: xmo@openerp.com-20110714102243-kiyp0o6hjbhmxecd
This commit is contained in:
Xavier Morel 2011-07-14 12:22:43 +02:00
commit d4dc9dec04
82 changed files with 14433 additions and 536 deletions

View File

@ -1,6 +1,5 @@
# -*- coding: utf-8 -*-
import base64
import glob, os
import base64, glob, os, re
from xml.etree import ElementTree
from cStringIO import StringIO
@ -55,6 +54,20 @@ class Xml2Json:
# OpenERP Web base Controllers
#----------------------------------------------------------
class Database(openerpweb.Controller):
_cp_path = "/base/database"
@openerpweb.jsonrequest
def get_databases_list(self, req):
proxy = req.session.proxy("db")
dbs = proxy.list()
h = req.httprequest.headers['Host'].split(':')[0]
d = h.split('.')[0]
r = cherrypy.config['openerp.dbfilter'].replace('%h',h).replace('%d',d)
print "h,d",h,d,r
dbs = [i for i in dbs if re.match(r,i)]
return {"db_list": dbs}
class Session(openerpweb.Controller):
_cp_path = "/base/session"
@ -103,13 +116,6 @@ class Session(openerpweb.Controller):
return req.session.model('ir.ui.view_sc').get_sc(req.session._uid, "ir.ui.menu",
req.session.eval_context(req.context))
@openerpweb.jsonrequest
def get_databases_list(self, req):
proxy = req.session.proxy("db")
dbs = proxy.list()
return {"db_list": dbs}
@openerpweb.jsonrequest
def modules(self, req):
return {"modules": [name
@ -124,14 +130,14 @@ class Session(openerpweb.Controller):
def jslist(self, req, mods='base'):
return {'files': self.manifest_glob(mods.split(','), 'js')}
def css(self, req, mods='base,base_hello'):
def css(self, req, mods='base'):
files = self.manifest_glob(mods.split(','), 'css')
concat = self.concat_files(files)[0]
# TODO request set the Date of last modif and Etag
return concat
css.exposed = True
def js(self, req, mods='base,base_hello'):
def js(self, req, mods='base'):
files = self.manifest_glob(mods.split(','), 'js')
concat = self.concat_files(files)[0]
# TODO request set the Date of last modif and Etag
@ -235,14 +241,14 @@ class Session(openerpweb.Controller):
def check(self, req):
req.session.assert_valid()
return None
def eval_context_and_domain(session, context, domain=None):
e_context = session.eval_context(context)
# should we give the evaluated context as an evaluation context to the domain?
e_domain = session.eval_domain(domain or [])
return e_context, e_domain
def load_actions_from_ir_values(req, key, key2, models, meta, context):
Values = req.session.model('ir.values')
actions = Values.get(key, key2, models, meta, context)
@ -306,7 +312,6 @@ def generate_views(action):
return
action['views'] = [(view_id, view_modes[0])]
def fix_view_modes(action):
""" For historical reasons, OpenERP has weird dealings in relation to
view_mode and the view_type attribute (on window actions):
@ -329,7 +334,7 @@ def fix_view_modes(action):
generate_views(action)
if action.pop('view_type') != 'form':
return
return action
action['views'] = [
[id, mode if mode != 'tree' else 'list']
@ -508,7 +513,7 @@ class DataSet(openerpweb.Controller):
@openerpweb.jsonrequest
def call(self, req, model, method, args, domain_id=None, context_id=None):
return {'result': self.call_common(req, model, method, args, domain_id, context_id)}
return self.call_common(req, model, method, args, domain_id, context_id)
@openerpweb.jsonrequest
def call_button(self, req, model, method, args, domain_id=None, context_id=None):
@ -524,20 +529,19 @@ class DataSet(openerpweb.Controller):
@openerpweb.jsonrequest
def default_get(self, req, model, fields):
m = req.session.model(model)
r = m.default_get(fields, req.session.eval_context(req.context))
return {'result': r}
Model = req.session.model(model)
return Model.default_get(fields, req.session.eval_context(req.context))
class DataGroup(openerpweb.Controller):
_cp_path = "/base/group"
@openerpweb.jsonrequest
def read(self, request, model, group_by_fields, domain=None):
def read(self, request, model, fields, group_by_fields, domain=None, sort=None):
Model = request.session.model(model)
context, domain = eval_context_and_domain(request.session, request.context, domain)
return Model.read_group(
domain or [], False, group_by_fields, 0, False,
dict(context, group_by=group_by_fields))
domain or [], fields, group_by_fields, 0, False,
dict(context, group_by=group_by_fields), sort or False)
class View(openerpweb.Controller):
_cp_path = "/base/view"
@ -550,7 +554,7 @@ class View(openerpweb.Controller):
# todo fme?: check that we should pass the evaluated context here
self.process_view(request.session, fvg, context, transform)
return fvg
def process_view(self, session, fvg, context, transform):
# depending on how it feels, xmlrpclib.ServerProxy can translate
# XML-RPC strings to ``str`` or ``unicode``. ElementTree does not
@ -599,36 +603,6 @@ class View(openerpweb.Controller):
return {'result': True}
return {'result': False}
def normalize_attrs(self, elem, context):
""" Normalize @attrs, @invisible, @required, @readonly and @states, so
the client only has to deal with @attrs.
See `the discoveries pad <http://pad.openerp.com/discoveries>`_ for
the rationale.
:param elem: the current view node (Python object)
:type elem: xml.etree.ElementTree.Element
:param dict context: evaluation context
"""
# If @attrs is normalized in json by server, the eval should be replaced by simplejson.loads
attrs = openerpweb.ast.literal_eval(elem.get('attrs', '{}'))
if 'states' in elem.attrib:
attrs.setdefault('invisible', [])\
.append(('state', 'not in', elem.attrib.pop('states').split(',')))
if attrs:
elem.set('attrs', simplejson.dumps(attrs))
for a in ['invisible', 'readonly', 'required']:
if a in elem.attrib:
# In the XML we trust
avalue = bool(eval(elem.get(a, 'False'),
{'context': context or {}}))
if not avalue:
del elem.attrib[a]
else:
elem.attrib[a] = '1'
if a == 'invisible' and 'attrs' in elem.attrib:
del elem.attrib['attrs']
def transform_view(self, view_string, session, context=None):
# transform nodes on the fly via iterparse, instead of
# doing it statically on the parsing result
@ -638,7 +612,6 @@ class View(openerpweb.Controller):
if event == "start":
if root is None:
root = elem
self.normalize_attrs(elem, context)
self.parse_domains_and_contexts(elem, session)
return root

View File

@ -304,6 +304,7 @@ QWeb2.Engine = (function() {
" /* START TEMPLATE */ try {\n" +
(e.compile()) + "\n" +
" /* END OF TEMPLATE */ } catch(error) {\n" +
" if (console && console.exception) console.exception(error);\n" +
" context.engine.tools.exception('Runtime Error: ' + error, context);\n" +
" }\n" +
" return r.join('');";

View File

@ -610,10 +610,14 @@ background: linear-gradient(top, #ffffff 0%,#d8d8d8 11%,#afafaf 86%,#333333 91%,
.openerp .oe-listview td.oe-record-delete {
text-align: right;
}
.openerp .oe-listview th.oe-sortable,
.openerp .oe-listview th.oe-sortable .ui-icon {
.openerp .oe-listview th.oe-sortable {
cursor: pointer;
}
.openerp .oe-listview th.oe-sortable .ui-icon {
height: 1em;
display: inline;
display: inline-block;
}
.openerp .oe-listview .oe-field-cell {
cursor: pointer;

View File

@ -370,7 +370,7 @@ openerp.base.Session = openerp.base.BasicController.extend( /** @lends openerp.b
params: params,
id:null
}).then(function () {deferred.resolve.apply(deferred, arguments);},
function(error) {deferred.reject(error, $.Event());});
function(error) {deferred.reject(error, $.Event());});
return deferred.fail(function() {
deferred.fail(function(error, event) {
if (!event.isDefaultPrevented()) {
@ -403,31 +403,35 @@ openerp.base.Session = openerp.base.BasicController.extend( /** @lends openerp.b
}, url);
var deferred = $.Deferred();
$.ajax(ajax).done(function(response, textStatus, jqXHR) {
self.on_rpc_response();
if (response.error) {
if (response.error.data.type == "session_invalid") {
self.uid = false;
self.on_session_invalid(function() {
self.rpc(url, payload.params,
function() {deferred.resolve.apply(deferred, arguments);},
function(error, event) {event.preventDefault();
deferred.reject.apply(deferred, arguments);});
});
} else {
deferred.reject(response.error);
}
} else {
deferred.resolve(response["result"], textStatus, jqXHR);
}
}).fail(function(jqXHR, textStatus, errorThrown) {
self.on_rpc_response();
var error = {
code: -32098,
message: "XmlHttpRequestError " + errorThrown,
data: {type: "xhr"+textStatus, debug: jqXHR.responseText, objects: [jqXHR, errorThrown] }
};
deferred.reject(error);
self.on_rpc_response();
if (!response.error) {
deferred.resolve(response["result"], textStatus, jqXHR);
return;
}
if (response.error.data.type !== "session_invalid") {
deferred.reject(response.error);
return;
}
self.uid = false;
self.on_session_invalid(function() {
self.rpc(url, payload.params,
function() {
deferred.resolve.apply(deferred, arguments);
},
function(error, event) {
event.preventDefault();
deferred.reject.apply(deferred, arguments);
});
});
}).fail(function(jqXHR, textStatus, errorThrown) {
self.on_rpc_response();
var error = {
code: -32098,
message: "XmlHttpRequestError " + errorThrown,
data: {type: "xhr"+textStatus, debug: jqXHR.responseText, objects: [jqXHR, errorThrown] }
};
deferred.reject(error);
});
return deferred.promise();
},
on_rpc_request: function() {
@ -850,6 +854,7 @@ openerp.base.Dialog = openerp.base.BaseWidget.extend({
this.$dialog.dialog('close');
},
stop: function () {
this.close();
this.$dialog.dialog('destroy');
}
});
@ -926,10 +931,15 @@ openerp.base.Login = openerp.base.Controller.extend({
this.selected_db = localStorage.getItem('last_db_login_success');
this.selected_login = localStorage.getItem('last_login_login_success');
}
if (jQuery.deparam(jQuery.param.querystring()).debug != undefined) {
this.selected_db = this.selected_db || "trunk";
this.selected_login = this.selected_login || "admin";
this.selected_password = this.selected_password || "a";
}
},
start: function() {
var self = this;
this.rpc("/base/session/get_databases_list", {}, function(result) {
this.rpc("/base/database/get_databases_list", {}, function(result) {
self.db_list = result.db_list;
self.display();
}, function() {

View File

@ -1,6 +1,23 @@
openerp.base.data = function(openerp) {
/**
* Serializes the sort criterion array of a dataset into a form which can be
* consumed by OpenERP's RPC APIs.
*
* @param {Array} criterion array of fields, from first to last criteria, prefixed with '-' for reverse sorting
* @returns {String} SQL-like sorting string (``ORDER BY``) clause
*/
openerp.base.serialize_sort = function (criterion) {
return _.map(criterion,
function (criteria) {
if (criteria[0] === '-') {
return criteria.slice(1) + ' DESC';
}
return criteria + ' ASC';
}).join(', ');
};
openerp.base.DataGroup = openerp.base.Controller.extend( /** @lends openerp.base.DataGroup# */{
/**
* Management interface between views and grouped collections of OpenERP
@ -120,29 +137,26 @@ openerp.base.ContainerDataGroup = openerp.base.DataGroup.extend(
aggregates: aggregates
};
},
fetch: function () {
fetch: function (fields) {
// internal method
var d = new $.Deferred();
var self = this;
// disable caching for now, not sure what I should do there
if (false && this.groups) {
d.resolveWith(this, [this.groups]);
} else {
this.rpc('/base/group/read', {
model: this.model,
context: this.context,
domain: this.domain,
group_by_fields: this.group_by
}, function () { }).then(function (response) {
var data_groups = _(response).map(
_.bind(self.transform_group, self));
self.groups = data_groups;
d.resolveWith(self, [data_groups]);
}, function () {
d.rejectWith.apply(d, self, [arguments]);
});
}
this.rpc('/base/group/read', {
model: this.model,
context: this.context,
domain: this.domain,
fields: _.uniq(this.group_by.concat(fields)),
group_by_fields: this.group_by,
sort: openerp.base.serialize_sort(this.sort)
}, function () { }).then(function (response) {
var data_groups = _(response).map(
_.bind(self.transform_group, self));
self.groups = data_groups;
d.resolveWith(self, [data_groups]);
}, function () {
d.rejectWith.apply(d, [self, arguments]);
});
return d.promise();
},
/**
@ -163,10 +177,14 @@ openerp.base.ContainerDataGroup = openerp.base.DataGroup.extend(
* records have for the current ``grouped_on`` field name).
* ``aggregates``
* a mapping of other aggregation fields provided by ``read_group``
*
* @param {Array} fields the list of fields to aggregate in each group, can be empty
* @param {Function} ifGroups function executed if any group is found (DataGroup.group_by is non-null and non-empty), called with a (potentially empty) list of groups as parameters.
* @param {Function} ifRecords function executed if there is no grouping left to perform, called with a DataSet instance as parameter
*/
list: function (ifGroups, ifRecords) {
list: function (fields, ifGroups, ifRecords) {
var self = this;
this.fetch().then(function (group_records) {
this.fetch(fields).then(function (group_records) {
ifGroups(_(group_records).map(function (group) {
var child_context = _.extend({}, self.context, group.__context);
return _.extend(
@ -174,7 +192,7 @@ openerp.base.ContainerDataGroup = openerp.base.DataGroup.extend(
self.session, self.model, group.__domain,
child_context, child_context.group_by,
self.level + 1),
group);
group, {sort: self.sort});
}));
});
}
@ -195,10 +213,10 @@ openerp.base.GrouplessDataGroup = openerp.base.DataGroup.extend(
init: function (session, model, domain, context, level) {
this._super(session, model, domain, context, null, level);
},
list: function (ifGroups, ifRecords) {
list: function (fields, ifGroups, ifRecords) {
ifRecords(_.extend(
new openerp.base.DataSetSearch(this.session, this.model),
{domain: this.domain, context: this.context}));
new openerp.base.DataSetSearch(this.session, this.model),
{domain: this.domain, context: this.context, _sort: this.sort}));
}
});
@ -215,7 +233,7 @@ openerp.base.StaticDataGroup = openerp.base.GrouplessDataGroup.extend(
init: function (dataset) {
this.dataset = dataset;
},
list: function (ifGroups, ifRecords) {
list: function (fields, ifGroups, ifRecords) {
ifRecords(this.dataset);
}
});
@ -378,7 +396,7 @@ openerp.base.DataSetStatic = openerp.base.DataSet.extend({
var self = this;
offset = offset || 0;
var end_pos = limit && limit !== -1 ? offset + limit : undefined;
this.read_ids(this.ids.slice(offset, end_pos), fields, callback);
return this.read_ids(this.ids.slice(offset, end_pos), fields, callback);
},
set_ids: function (ids) {
this.ids = ids;
@ -423,7 +441,7 @@ openerp.base.DataSetSearch = openerp.base.DataSet.extend({
// return read_ids(ids.slice(start,start+limit),fields,callback)
}
}
this.rpc('/base/dataset/search_read', {
return this.rpc('/base/dataset/search_read', {
model: this.model,
fields: fields,
domain: this.domain,
@ -434,7 +452,9 @@ openerp.base.DataSetSearch = openerp.base.DataSet.extend({
}, function (result) {
self.ids = result.ids;
self.offset = offset;
callback(result.records);
if (callback) {
callback(result.records);
}
});
},
/**
@ -452,16 +472,12 @@ openerp.base.DataSetSearch = openerp.base.DataSet.extend({
*/
sort: function (field, force_reverse) {
if (!field) {
return _.map(this._sort, function (criteria) {
if (criteria[0] === '-') {
return criteria.slice(1) + ' DESC';
}
return criteria + ' ASC';
}).join(', ');
return openerp.base.serialize_sort(this._sort);
}
var reverse = force_reverse || (this._sort[0] === field);
this._sort = _.without(this._sort, field, '-' + field);
this._sort.splice.apply(
this._sort, [0, this._sort.length].concat(
_.without(this._sort, field, '-' + field)));
this._sort.unshift((reverse ? '-' : '') + field);
return undefined;
@ -592,12 +608,12 @@ openerp.base.ReadOnlyDataSetSearch = openerp.base.DataSetSearch.extend({
},
on_create: function(data) {},
write: function (id, data, callback) {
this.on_write(id);
this.on_write(id, data);
var to_return = $.Deferred().then(callback);
setTimeout(function () {to_return.resolve({"result": true});}, 0);
return to_return.promise();
},
on_write: function(id) {},
on_write: function(id, data) {},
unlink: function(ids, callback, error_callback) {
this.on_unlink(ids);
var to_return = $.Deferred().then(callback);

View File

@ -41,7 +41,10 @@ openerp.base.FormView = openerp.base.View.extend( /** @lends openerp.base.FormV
start: function() {
//this.log('Starting FormView '+this.model+this.view_id)
if (this.embedded_view) {
return $.Deferred().then(this.on_loaded).resolve({fields_view: this.embedded_view});
var def = $.Deferred().then(this.on_loaded);
var self = this;
setTimeout(function() {def.resolve({fields_view: self.embedded_view});}, 0);
return def.promise();
} else {
var context = new openerp.base.CompoundContext(this.dataset.get_context());
if (this.view_manager.action && this.view_manager.action.context) {
@ -51,6 +54,11 @@ openerp.base.FormView = openerp.base.View.extend( /** @lends openerp.base.FormV
toolbar:!!this.flags.sidebar, context: context}, this.on_loaded);
}
},
stop: function() {
_.each(this.widgets, function(w) {
w.stop();
});
},
on_loaded: function(data) {
var self = this;
this.fields_view = data.fields_view;
@ -132,7 +140,7 @@ openerp.base.FormView = openerp.base.View.extend( /** @lends openerp.base.FormV
on_form_changed: function() {
for (var w in this.widgets) {
w = this.widgets[w];
w.process_attrs();
w.process_modifiers();
w.update_dom();
}
},
@ -261,9 +269,8 @@ openerp.base.FormView = openerp.base.View.extend( /** @lends openerp.base.FormV
on_button_new: function() {
var self = this;
$.when(this.has_been_loaded).then(function() {
self.dataset.default_get(_.keys(self.fields_view.fields), function(result) {
self.on_record_loaded(result.result);
});
self.dataset.default_get(
_.keys(self.fields_view.fields), self.on_record_loaded);
});
},
/**
@ -503,7 +510,7 @@ openerp.base.form.compute_domain = function(expr, fields) {
stack.push(!_(val).contains(field));
break;
default:
this.log("Unsupported operator in attrs :", op);
this.log("Unsupported operator in modifiers :", op);
}
}
return _.all(stack);
@ -514,7 +521,7 @@ openerp.base.form.Widget = openerp.base.Controller.extend({
init: function(view, node) {
this.view = view;
this.node = node;
this.attrs = JSON.parse(this.node.attrs.attrs || '{}');
this.modifiers = JSON.parse(this.node.attrs.modifiers || '{}');
this.type = this.type || node.tag;
this.element_name = this.element_name || this.type;
this.element_id = [this.view.element_id, this.element_name, this.view.widgets_counter++].join("_");
@ -527,15 +534,18 @@ openerp.base.form.Widget = openerp.base.Controller.extend({
this.string = this.string || node.attrs.string;
this.help = this.help || node.attrs.help;
this.invisible = (node.attrs.invisible == '1');
this.invisible = this.modifiers['invisible'] === true;
},
start: function() {
this.$element = $('#' + this.element_id);
},
process_attrs: function() {
stop: function() {
this.$element.remove();
},
process_modifiers: function() {
var compute_domain = openerp.base.form.compute_domain;
for (var a in this.attrs) {
this[a] = compute_domain(this.attrs[a], this.view.fields);
for (var a in this.modifiers) {
this[a] = compute_domain(this.modifiers[a], this.view.fields);
}
},
update_dom: function() {
@ -590,7 +600,10 @@ openerp.base.form.WidgetFrame = openerp.base.form.Widget.extend({
}
},
handle_node: function(node) {
var type = this.view.fields_view.fields[node.attrs.name] || {};
var type = {};
if (node.tag == 'field') {
type = this.view.fields_view.fields[node.attrs.name] || {};
}
var widget = new (this.view.registry.get_any(
[node.attrs.widget, type.type, node.tag])) (this.view, node);
if (node.tag == 'field') {
@ -600,14 +613,15 @@ openerp.base.form.WidgetFrame = openerp.base.form.Widget.extend({
if (node.attrs.nolabel != '1') {
var label = new (this.view.registry.get_object('label')) (this.view, node);
label["for"] = widget;
this.add_widget(label);
this.add_widget(label, widget.colspan + 1);
}
}
this.add_widget(widget);
},
add_widget: function(widget) {
add_widget: function(widget, colspan) {
colspan = colspan || widget.colspan;
var current_row = this.table[this.table.length - 1];
if (current_row.length && (this.x + widget.colspan) > this.columns) {
if (current_row.length && (this.x + colspan) > this.columns) {
current_row = this.add_row();
}
current_row.push(widget);
@ -617,14 +631,14 @@ openerp.base.form.WidgetFrame = openerp.base.form.Widget.extend({
});
openerp.base.form.WidgetNotebook = openerp.base.form.Widget.extend({
template: 'WidgetNotebook',
init: function(view, node) {
this._super(view, node);
this.template = "WidgetNotebook";
this.pages = [];
for (var i = 0; i < node.children.length; i++) {
var n = node.children[i];
if (n.tag == "page") {
var page = new openerp.base.form.WidgetFrame(this.view, n);
var page = new openerp.base.form.WidgetNotebookPage(this.view, n, this, this.pages.length);
this.pages.push(page);
}
}
@ -635,6 +649,28 @@ openerp.base.form.WidgetNotebook = openerp.base.form.Widget.extend({
}
});
openerp.base.form.WidgetNotebookPage = openerp.base.form.WidgetFrame.extend({
template: 'WidgetNotebookPage',
init: function(view, node, notebook, index) {
this.notebook = notebook;
this.index = index;
this.element_name = 'page_' + index;
this._super(view, node);
this.element_tab_id = this.element_id + '_tab';
},
start: function() {
this._super.apply(this, arguments);
this.$element_tab = $('#' + this.element_tab_id);
},
update_dom: function() {
if (this.invisible) {
this.notebook.$element.tabs('select', 0);
}
this.$element_tab.toggle(!this.invisible);
this.$element.toggle(!this.invisible);
}
});
openerp.base.form.WidgetSeparator = openerp.base.form.Widget.extend({
init: function(view, node) {
this._super(view, node);
@ -686,10 +722,7 @@ openerp.base.form.WidgetButton = openerp.base.form.Widget.extend({
this.view.execute_action(
this.node.attrs, this.view.dataset, this.session.action_manager,
this.view.datarecord.id, function (result) {
self.log("Button returned", result);
self.view.reload();
}, function() {
this.view.datarecord.id, function () {
self.view.reload();
});
}
@ -736,10 +769,9 @@ openerp.base.form.Field = openerp.base.form.Widget.extend({
this.field = view.fields_view.fields[node.attrs.name] || {};
this.string = node.attrs.string || this.field.string;
this.help = node.attrs.help || this.field.help;
this.invisible = (this.invisible || this.field.invisible == '1');
this.nolabel = (this.field.nolabel || node.attrs.nolabel) == '1';
this.readonly = (this.field.readonly || node.attrs.readonly) == '1';
this.required = (this.field.required || node.attrs.required) == '1';
this.nolabel = (this.field.nolabel || node.attrs.nolabel) === '1';
this.readonly = this.modifiers['readonly'] === true;
this.required = this.modifiers['required'] === true;
this.invalid = false;
this.touched = false;
},
@ -798,7 +830,7 @@ openerp.base.form.Field = openerp.base.form.Widget.extend({
var v_context1 = this.node.attrs.default_get || {};
var v_context2 = this.node.attrs.context || {};
var v_context = new openerp.base.CompoundContext(v_context1, v_context2);
if (v_context1.__ref || v_context2.__ref) {
if (v_context1.__ref || v_context2.__ref || true) { //TODO niv: remove || true
var fields_values = this._build_view_fields_values();
v_context.set_eval_context(fields_values);
}
@ -808,7 +840,7 @@ openerp.base.form.Field = openerp.base.form.Widget.extend({
build_domain: function() {
var f_domain = this.field.domain || [];
var v_domain = this.node.attrs.domain || [];
if (!(v_domain instanceof Array)) {
if (!(v_domain instanceof Array) || true) { //TODO niv: remove || true
var fields_values = this._build_view_fields_values();
v_domain = new openerp.base.CompoundDomain(v_domain).set_eval_context(fields_values);
}
@ -903,6 +935,7 @@ openerp.base.form.FieldFloat = openerp.base.form.FieldChar.extend({
if (value === false || value === undefined) {
// As in GTK client, floats default to 0
value = 0;
this.touched = true;
}
var show_value = value.toFixed(2);
this.$element.find('input').val(show_value);
@ -912,6 +945,26 @@ openerp.base.form.FieldFloat = openerp.base.form.FieldChar.extend({
}
});
openerp.base.form.FieldInteger = openerp.base.form.FieldFloat.extend({
init: function(view, node) {
this._super(view, node);
this.validation_regex = /^-?\d+$/;
},
set_value: function(value) {
this._super.apply(this, [value]);
if (value === false || value === undefined) {
// TODO fme: check if GTK client default integers to 0 (like it does with floats)
value = 0;
this.touched = true;
}
var show_value = parseInt(value, 10);
this.$element.find('input').val(show_value);
},
set_value_from_ui: function() {
this.value = Number(this.$element.find('input').val());
}
});
openerp.base.form.FieldDatetime = openerp.base.form.Field.extend({
init: function(view, node) {
this._super(view, node);
@ -949,7 +1002,7 @@ openerp.base.form.FieldDatetime = openerp.base.form.Field.extend({
},
update_dom: function() {
this._super.apply(this, arguments);
this.$element.find('input').attr('disabled', this.readonly);
this.$element.find('input').datepicker(this.readonly ? 'disable' : 'enable');
},
validate: function() {
this.invalid = false;
@ -989,6 +1042,7 @@ openerp.base.form.FieldFloatTime = openerp.base.form.FieldChar.extend({
if (value === false || value === undefined) {
// As in GTK client, floats default to 0
value = 0;
this.touched = true;
}
var show_value = _.sprintf("%02d:%02d", Math.floor(value), Math.round((value % 1) * 60));
this.$element.find('input').val(show_value);
@ -1098,28 +1152,54 @@ openerp.base.form.FieldSelection = openerp.base.form.Field.extend({
init: function(view, node) {
this._super(view, node);
this.template = "FieldSelection";
this.field_index = _.map(this.field.selection, function(x, index) {
return {"ikey": "" + index, "ekey": x[0], "label": x[1]};
});
},
start: function() {
// Flag indicating whether we're in an event chain containing a change
// event on the select, in order to know what to do on keyup[RETURN]:
// * If the user presses [RETURN] as part of changing the value of a
// selection, we should just let the value change and not let the
// event broadcast further (e.g. to validating the current state of
// the form in editable list view, which would lead to saving the
// current row or switching to the next one)
// * If the user presses [RETURN] with a select closed (side-effect:
// also if the user opened the select and pressed [RETURN] without
// changing the selected value), takes the action as validating the
// row
var ischanging = false;
this._super.apply(this, arguments);
this.$element.find('select').change(this.on_ui_change);
this.$element.find('select')
.change(this.on_ui_change)
.change(function () { ischanging = true; })
.click(function () { ischanging = false; })
.keyup(function (e) {
if (e.which !== 13 || !ischanging) { return; }
e.stopPropagation();
ischanging = false;
});
},
set_value: function(value) {
this._super.apply(this, arguments);
if (value != null && value !== false) {
this.$element.find('select').val(value);
} else {
this.$element.find('select').val('false');
}
value = value === null ? false : value;
value = value instanceof Array ? value[0] : value;
this._super(value);
var option = _.detect(this.field_index, function(x) {return x.ekey === value;});
this.$element.find('select').val(option === undefined ? '' : option.ikey);
},
set_value_from_ui: function() {
this.value = this.$element.find('select').val();
var ikey = this.$element.find('select').val();
var option = _.detect(this.field_index, function(x) {return x.ikey === ikey;});
this.value = option === undefined ? false : option.ekey;
},
update_dom: function() {
this._super.apply(this, arguments);
this.$element.find('select').attr('disabled', this.readonly);
},
validate: function() {
this.invalid = this.required && this.$element.find('select').val() === "";
var ikey = this.$element.find('select').val();
var option = _.detect(this.field_index, function(x) {return x.ikey === ikey;});
this.invalid = this.required && (option === undefined || option.ekey === false);
},
focus: function() {
this.$element.find('select').focus();
@ -1187,13 +1267,10 @@ openerp.base.form.FieldMany2One = openerp.base.form.Field.extend({
if (!self.value) {
return;
}
self.session.action_manager.do_action({
"res_model": self.field.relation,
"views":[[false,"form"]],
"res_id": self.value[0],
"type":"ir.actions.act_window",
"target":"new",
"context": self.build_context()
var pop = new openerp.base.form.FormOpenPopup(null, self.view.session);
pop.show_element(self.field.relation, self.value[0],self.build_context(), {});
pop.on_write_completed.add_last(function() {
self.set_value(self.value[0]);
});
};
var cmenu = this.$menu_btn.contextMenu(this.cm_id, {'leftClickToo': true,
@ -1241,10 +1318,12 @@ openerp.base.form.FieldMany2One = openerp.base.form.Field.extend({
}
this.$input.focusout(anyoneLoosesFocus);
var isSelecting = false;
// autocomplete
this.$input.autocomplete({
source: function(req, resp) { self.get_search_result(req, resp); },
select: function(event, ui) {
isSelecting = true;
var item = ui.item;
if (item.id) {
self._change_int_value([item.id, item.name]);
@ -1262,6 +1341,14 @@ openerp.base.form.FieldMany2One = openerp.base.form.Field.extend({
minLength: 0,
delay: 0
});
// used to correct a bug when selecting an element by pushing 'enter' in an editable list
this.$input.keyup(function(e) {
if (e.which === 13) {
if (isSelecting)
e.stopPropagation();
}
isSelecting = false;
});
},
// autocomplete component content handling
get_search_result: function(request, response) {
@ -1490,7 +1577,9 @@ openerp.base.form.FieldOne2Many = openerp.base.form.Field.extend({
}
self.is_started.resolve();
});
this.viewmanager.start();
setTimeout(function () {
self.viewmanager.start();
}, 0);
},
reload_current_view: function() {
var self = this;
@ -1611,6 +1700,20 @@ openerp.base.form.One2ManyListView = openerp.base.ListView.extend({
});
});
}
},
do_activate_record: function(index, id) {
var self = this;
var pop = new openerp.base.form.FormOpenPopup(null, self.o2m.view.session);
pop.show_element(self.o2m.field.relation, id, self.o2m.build_context(),{
auto_write: false,
alternative_form_view: self.o2m.field.views ? self.o2m.field.views["form"] : undefined,
parent_view: self.o2m.view
});
pop.on_write.add(function(id, data) {
self.o2m.dataset.write(id, data, function(r) {
self.o2m.reload_current_view();
});
});
}
});
@ -1643,7 +1746,9 @@ openerp.base.form.FieldMany2Many = openerp.base.form.Field.extend({
this.list_view.on_loaded.add_last(function() {
self.is_started.resolve();
});
this.list_view.start();
setTimeout(function () {
self.list_view.start();
}, 0);
},
set_value: function(value) {
value = value || [];
@ -1694,15 +1799,11 @@ openerp.base.form.Many2ManyListView = openerp.base.ListView.extend({
});
},
do_activate_record: function(index, id) {
this.m2m_field.view.session.action_manager.do_action({
"res_model": this.dataset.model,
"views": [[false,"form"]],
"res_id": id,
"type": "ir.actions.act_window",
"view_type": "form",
"view_mode": "form",
"target": "new",
"context": this.m2m_field.build_context()
var self = this;
var pop = new openerp.base.form.FormOpenPopup(null, this.m2m_field.view.session);
pop.show_element(this.dataset.model, id, this.m2m_field.build_context(), {});
pop.on_write_completed.add_last(function() {
self.reload_content();
});
}
});
@ -1727,7 +1828,8 @@ openerp.base.form.SelectCreatePopup = openerp.base.BaseWidget.extend({
this.initial_ids = this.options.initial_ids;
jQuery(this.render()).dialog({title: '',
modal: true,
minWidth: 800});
width: 960,
height: 600});
this.start();
},
start: function() {
@ -1790,7 +1892,7 @@ openerp.base.form.SelectCreatePopup = openerp.base.BaseWidget.extend({
return;
var self = this;
var wdataset = new openerp.base.DataSetSearch(this.session, this.model, this.context, this.domain);
wdataset = this.options.parent_view;
wdataset.parent_view = this.options.parent_view;
wdataset.create(data, function(r) {
self.on_select_elements([r.result]);
});
@ -1850,6 +1952,72 @@ openerp.base.form.SelectCreateListView = openerp.base.ListView.extend({
}
});
openerp.base.form.FormOpenPopup = openerp.base.BaseWidget.extend({
identifier_prefix: "formopenpopup",
template: "FormOpenPopup",
/**
* options:
* - alternative_form_view
* - auto_write (default true)
* - parent_view
*/
show_element: function(model, row_id, context, options) {
this.model = model;
this.row_id = row_id;
this.context = context || {};
this.options = _.defaults(options || {}, {"auto_write": true});
jQuery(this.render()).dialog({title: '',
modal: true,
width: 960,
height: 600});
this.start();
},
start: function() {
this._super();
this.dataset = new openerp.base.ReadOnlyDataSetSearch(this.session, this.model,
this.context);
this.dataset.ids = [this.row_id];
this.dataset.index = 0;
this.dataset.parent_view = this.options.parent_view;
this.setup_form_view();
},
on_write: function(id, data) {
this.stop();
if (!this.options.auto_write)
return;
var self = this;
var wdataset = new openerp.base.DataSetSearch(this.session, this.model, this.context, this.domain);
wdataset.parent_view = this.options.parent_view;
wdataset.write(id, data, function(r) {
self.on_write_completed();
});
},
on_write_completed: function() {},
setup_form_view: function() {
var self = this;
this.view_form = new openerp.base.FormView(null, this.session,
this.element_id + "_view_form", this.dataset, false);
if (this.options.alternative_form_view) {
this.view_form.set_embedded_view(this.options.alternative_form_view);
}
this.view_form.start();
this.view_form.on_loaded.add_last(function() {
var $buttons = self.view_form.$element.find(".oe_form_buttons");
$buttons.html(QWeb.render("FormOpenPopup.form.buttons"));
var $nbutton = $buttons.find(".oe_formopenpopup-form-save");
$nbutton.click(function() {
self.view_form.do_save();
});
var $cbutton = $buttons.find(".oe_formopenpopup-form-close");
$cbutton.click(function() {
self.stop();
});
self.view_form.do_show();
});
this.dataset.on_write.add(this.on_write);
}
});
openerp.base.form.FieldReference = openerp.base.form.Field.extend({
init: function(view, node) {
this._super(view, node);
@ -2018,7 +2186,7 @@ openerp.base.form.widgets = new openerp.base.Registry({
'reference' : 'openerp.base.form.FieldReference',
'boolean' : 'openerp.base.form.FieldBoolean',
'float' : 'openerp.base.form.FieldFloat',
'integer': 'openerp.base.form.FieldFloat',
'integer': 'openerp.base.form.FieldInteger',
'progressbar': 'openerp.base.form.FieldProgressBar',
'float_time': 'openerp.base.form.FieldFloatTime',
'image': 'openerp.base.form.FieldBinaryImage',

View File

@ -247,7 +247,12 @@ openerp.base.list.editable = function (openerp) {
this.render_row_as_form();
}
});
openerp.base.list = {form: {}};
if (!openerp.base.list) {
openerp.base.list = {};
}
if (!openerp.base.list.form) {
openerp.base.list.form = {};
}
openerp.base.list.form.WidgetFrame = openerp.base.form.WidgetFrame.extend({
template: 'ListView.row.frame'
});
@ -268,10 +273,12 @@ openerp.base.list.editable = function (openerp) {
openerp.base.list.form[key] = (form_widgets.get_object(key)).extend({
update_dom: function () {
this.$element.children().css('visibility', '');
if (this.invisible && this.node.attrs.invisible !== '1') {
if (this.invisible) {
this.$element.children().css('visibility', 'hidden');
} else {
this.invisible = !!this.modifiers.tree_invisible;
this._super();
this.invisible = false;
}
}
});

View File

@ -1,5 +1,50 @@
openerp.base.list = function (openerp) {
openerp.base.views.add('list', 'openerp.base.ListView');
openerp.base.list = {
/**
* Formats the rendring of a given value based on its field type
*
* @param {Object} row_data record whose values should be displayed in the cell
* @param {Object} column column descriptor
* @param {"button"|"field"} column.tag base control type
* @param {String} column.type widget type for a field control
* @param {String} [column.string] button label
* @param {String} [column.icon] button icon
* @param {String} [value_if_empty=''] what to display if the field's value is ``false``
*/
render_cell: function (row_data, column, value_if_empty) {
var attrs = column.modifiers_for(row_data);
if (attrs.invisible) { return ''; }
if (column.tag === 'button') {
return [
'<button type="button" title="', column.string || '', '">',
'<img src="/base/static/src/img/icons/', column.icon, '.png"',
' alt="', column.string || '', '"/>',
'</button>'
].join('')
}
var record = row_data[column.id];
if (record.value === false) {
return value_if_empty === undefined ? '' : value_if_empty;
}
switch (column.widget || column.type) {
case 'many2one':
// name_get value format
return record.value[1];
case 'float_time':
return _.sprintf("%02d:%02d",
Math.floor(record.value),
Math.round((record.value % 1) * 60));
case 'progressbar':
return _.sprintf(
'<progress value="%.2f" max="100.0">%.2f%%</progress>',
record.value, record.value);
default:
return record.value;
}
}
};
openerp.base.ListView = openerp.base.View.extend( /** @lends openerp.base.ListView# */ {
defaults: {
// records can be selected one by one
@ -147,8 +192,6 @@ openerp.base.ListView = openerp.base.View.extend( /** @lends openerp.base.ListVi
this.setup_columns(this.fields_view.fields, grouped);
if (!this.fields_view.sorted) { this.fields_view.sorted = {}; }
this.$element.html(QWeb.render("ListView", this));
// Head hook
@ -158,13 +201,20 @@ openerp.base.ListView = openerp.base.View.extend( /** @lends openerp.base.ListVi
this.$element.find('.oe-list-delete')
.attr('disabled', true)
.click(this.do_delete_selected);
this.$element.find('thead').delegate('th[data-id]', 'click', function (e) {
this.$element.find('thead').delegate('th.oe-sortable[data-id]', 'click', function (e) {
e.stopPropagation();
self.dataset.sort($(this).data('id'));
var $this = $(this);
self.dataset.sort($this.data('id'));
if ($this.find('span').length) {
$this.find('span').toggleClass(
'ui-icon-triangle-1-s ui-icon-triangle-1-n');
} else {
$this.append('<span class="ui-icon ui-icon-triangle-1-s">')
.siblings('.oe-sortable').find('span').remove();
}
// TODO: should only reload content (and set the right column to a sorted display state)
self.reload_view();
self.reload_content();
});
this.$element.find('.oe-list-pager')
@ -252,18 +302,22 @@ openerp.base.ListView = openerp.base.View.extend( /** @lends openerp.base.ListVi
var name = field.attrs.name;
var column = _.extend({id: name, tag: field.tag},
field.attrs, fields[name]);
// attrs computer
if (column.attrs) {
var attrs = JSON.parse(column.attrs);
column.attrs_for = function (fields) {
var result = {};
for (var attr in attrs) {
result[attr] = domain_computer(attrs[attr], fields);
// modifiers computer
if (column.modifiers) {
var modifiers = JSON.parse(column.modifiers);
column.modifiers_for = function (fields) {
if (!modifiers.invisible) {
return {};
}
return result;
return {
'invisible': domain_computer(modifiers.invisible, fields)
};
};
if (modifiers['tree_invisible']) {
column.invisible = '1';
}
} else {
column.attrs_for = noop;
column.modifiers_for = noop;
}
return column;
};
@ -275,10 +329,10 @@ openerp.base.ListView = openerp.base.View.extend( /** @lends openerp.base.ListVi
if (grouped) {
this.columns.unshift({
id: '_group', tag: '', string: "Group", meta: true,
attrs_for: function () { return {}; }
modifiers_for: function () { return {}; }
}, {
id: '_count', tag: '', string: '#', meta: true,
attrs_for: function () { return {}; }
modifiers_for: function () { return {}; }
});
}
@ -400,6 +454,7 @@ openerp.base.ListView = openerp.base.View.extend( /** @lends openerp.base.ListVi
this.session, this.model,
results.domain, results.context,
results.group_by);
this.groups.datagroup.sort = this.dataset._sort;
if (_.isEmpty(results.group_by) && !results.context['group_by_no_leaf']) {
results.group_by = null;
@ -409,9 +464,9 @@ openerp.base.ListView = openerp.base.View.extend( /** @lends openerp.base.ListVi
$.proxy(this, 'reload_content'));
},
/**
* Handles the signal to delete a line from the DOM
* Handles the signal to delete lines from the records list
*
* @param {Array} ids the id of the object to delete
* @param {Array} ids the ids of the records to delete
*/
do_delete: function (ids) {
if (!ids.length) {
@ -419,7 +474,7 @@ openerp.base.ListView = openerp.base.View.extend( /** @lends openerp.base.ListVi
}
var self = this;
return $.when(this.dataset.unlink(ids)).then(function () {
self.reload_content();
self.groups.drop_records(ids);
});
},
/**
@ -452,13 +507,7 @@ openerp.base.ListView = openerp.base.View.extend( /** @lends openerp.base.ListVi
return field.name === name;
});
if (!action) { return; }
this.execute_action(
action, this.dataset, this.session.action_manager,
id, function () {
if (callback) {
callback();
}
});
this.execute_action(action, this.dataset, this.session.action_manager, id, callback);
},
/**
* Handles the activation of a record (clicking on it)
@ -637,7 +686,9 @@ openerp.base.ListView.List = Class.extend( /** @lends openerp.base.ListView.List
this.$current.remove();
}
this.$current = this.$_element.clone(true);
this.$current.empty().append(QWeb.render('ListView.rows', this));
this.$current.empty().append(
QWeb.render('ListView.rows', _.extend({
render_cell: openerp.base.list.render_cell}, this)));
},
/**
* Gets the ids of all currently selected records, if any
@ -767,8 +818,27 @@ openerp.base.ListView.List = Class.extend( /** @lends openerp.base.ListView.List
options: this.options,
row: this.rows[record_index],
row_parity: (record_index % 2 === 0) ? 'even' : 'odd',
row_index: record_index
row_index: record_index,
render_cell: openerp.base.list.render_cell
});
},
/**
* Stops displaying the records matching the provided ids.
*
* @param {Array} ids identifiers of the records to remove
*/
drop_records: function (ids) {
var self = this;
_(this.rows).chain()
.map(function (record, index) {
return {index: index, id: record.data.id.value};
}).filter(function (record) {
return _(ids).contains(record.id);
}).reverse()
.each(function (record) {
self.$current.find('tr:eq(' + record.index + ')').remove();
self.rows.splice(record.index, 1);
})
}
// drag and drop
});
@ -903,10 +973,15 @@ openerp.base.ListView.Groups = Class.extend( /** @lends openerp.base.ListView.Gr
placeholder.appendChild($row[0]);
var $group_column = $('<th class="oe-group-name">').appendTo($row);
// Don't fill this if group_by_no_leaf but no group_by
if (group.grouped_on) {
// Don't fill this if group_by_no_leaf but no group_by
$group_column
.text((group.value instanceof Array ? group.value[1] : group.value));
var row_data = {};
row_data[group.grouped_on] = group;
var group_column = _(self.columns).detect(function (column) {
return column.id === group.grouped_on; });
$group_column.text(openerp.base.list.render_cell(
row_data, group_column, "Undefined"
));
if (group.openable) {
// Make openable if not terminal group & group_by_no_leaf
$group_column
@ -1013,18 +1088,23 @@ openerp.base.ListView.Groups = Class.extend( /** @lends openerp.base.ListView.Gr
var self = this;
var $element = $('<tbody>');
this.elements = [$element[0]];
this.datagroup.list(function (groups) {
$element[0].appendChild(
self.render_groups(groups));
if (post_render) { post_render(); }
}, function (dataset) {
self.render_dataset(dataset).then(function (list) {
self.children[null] = list;
self.elements =
[list.$current.replaceAll($element)[0]];
this.datagroup.list(
_(this.view.visible_columns).chain()
.filter(function (column) { return column.tag === 'field' })
.pluck('name').value(),
function (groups) {
$element[0].appendChild(
self.render_groups(groups));
if (post_render) { post_render(); }
}, function (dataset) {
self.render_dataset(dataset).then(function (list) {
self.children[null] = list;
self.elements =
[list.$current.replaceAll($element)[0]];
if (post_render) { post_render(); }
});
});
});
return $element;
},
/**
@ -1062,6 +1142,19 @@ openerp.base.ListView.Groups = Class.extend( /** @lends openerp.base.ListView.Gr
.map(function (child) {
return child.get_records();
}).flatten().value();
},
/**
* Stops displaying the records with the linked ids, assumes these records
* were deleted from the DB.
*
* This is the up-signal from the `deleted` event on groups and lists.
*
* @param {Array} ids list of identifier of the records to remove.
*/
drop_records: function (ids) {
_.each(this.children, function (child) {
child.drop_records(ids);
});
}
});
};

View File

@ -10,7 +10,7 @@ openerp.base.ActionManager = openerp.base.Controller.extend({
init: function(session, element_id) {
this._super(session, element_id);
this.viewmanager = null;
this.dialog_stack = [];
this.current_dialog = null;
// Temporary linking view_manager to session.
// Will use controller_parent to find it when implementation will be done.
session.action_manager = this;
@ -22,11 +22,11 @@ openerp.base.ActionManager = openerp.base.Controller.extend({
do_action: function(action, on_closed) {
action.flags = _.extend({
sidebar : action.target != 'new',
search_view : true,
search_view : action.target != 'new',
new_window : false,
views_switcher : true,
action_buttons : true,
pager : true
views_switcher : action.target != 'new',
action_buttons : action.target != 'new',
pager : action.target != 'new'
}, action.flags || {});
// instantiate the right controllers by understanding the action
if (!(action.type in this)) {
@ -37,26 +37,21 @@ openerp.base.ActionManager = openerp.base.Controller.extend({
},
'ir.actions.act_window': function (action, on_closed) {
var self = this;
if (!action.target && this.dialog_stack.length) {
if (!action.target && this.current_dialog) {
action.flags.new_window = true;
}
if (action.target == 'new') {
var element_id = _.uniqueId("act_window_dialog");
$('<div>', {id: element_id}).dialog({
var dialog = this.current_dialog = new openerp.base.ActionDialog(this.session, {
title: action.name,
modal: true,
width: '50%',
height: 'auto'
}).bind('dialogclose', function(event) {
// When dialog is closed with ESC key or close manually, branch to act_window_close logic
self.do_action({ type: 'ir.actions.act_window_close' });
width: '50%'
});
var viewmanager = new openerp.base.ViewManagerAction(this.session, element_id, action);
if (on_closed) {
dialog.close_callback = on_closed;
}
dialog.start(false);
var viewmanager = dialog.viewmanager = new openerp.base.ViewManagerAction(this.session, dialog.element_id, action);
viewmanager.start();
viewmanager.on_act_window_closed.add(on_closed);
viewmanager.is_dialog = true;
this.dialog_stack.push(viewmanager);
dialog.open();
} else if (action.flags.new_window) {
action.flags.new_window = false;
this.rpc("/base/session/save_session_action", { the_action : action}, function(key) {
@ -73,12 +68,10 @@ openerp.base.ActionManager = openerp.base.Controller.extend({
}
},
'ir.actions.act_window_close': function (action, on_closed) {
var dialog = this.dialog_stack.pop();
if (!action.special) {
dialog.on_act_window_closed();
if (this.current_dialog) {
this.current_dialog.stop();
this.current_dialog = null;
}
dialog.$element.dialog('destroy');
dialog.stop();
},
'ir.actions.server': function (action, on_closed) {
var self = this;
@ -108,7 +101,6 @@ openerp.base.ViewManager = openerp.base.Controller.extend({
this.flags = this.flags || {};
this.sidebar = new openerp.base.NullSidebar();
this.registry = openerp.base.views;
this.is_dialog = false;
},
/**
* @returns {jQuery.Deferred} initial view loading promise
@ -226,11 +218,6 @@ openerp.base.ViewManager = openerp.base.Controller.extend({
});
return this.searchview.start();
},
/**
* Called when this view manager has been created by an action 'act_window@target=new' is closed
*/
on_act_window_closed : function() {
},
/**
* Called when one of the view want to execute an action
*/
@ -352,6 +339,19 @@ openerp.base.ViewManagerAction = openerp.base.ViewManager.extend({
}
});
openerp.base.ActionDialog = openerp.base.Dialog.extend({
identifier_prefix: 'action_dialog',
stop: function() {
this._super(this, arguments);
if (this.close_callback) {
this.close_callback();
}
if (this.viewmanager) {
this.viewmanager.stop();
}
}
});
openerp.base.Sidebar = openerp.base.BaseWidget.extend({
template: "ViewManager.sidebar",
init: function(parent, view_manager) {
@ -406,6 +406,7 @@ openerp.base.Sidebar = openerp.base.BaseWidget.extend({
}
});
openerp.base.NullSidebar = openerp.base.generate_null_object_class(openerp.base.Sidebar);
openerp.base.Export = openerp.base.Dialog.extend({
@ -439,11 +440,15 @@ openerp.base.View = openerp.base.Controller.extend({
* @param {openerp.base.DataSet} dataset a dataset object used to communicate with the server
* @param {openerp.base.ActionManager} action_manager object able to actually execute the action, if any is fetched
* @param {Object} [record_id] the identifier of the object on which the action is to be applied
* @param {Function} on_no_action callback to execute if the action does not generate any result (no new action)
* @param {Function} on_closed callback to execute when dialog is closed or when the action does not generate any result (no new action)
*/
execute_action: function (action_data, dataset, action_manager, record_id, on_no_action, on_closed) {
execute_action: function (action_data, dataset, action_manager, record_id, on_closed) {
var self = this;
if (action_manager.current_dialog) {
on_closed = action_manager.current_dialog.close_callback;
}
var handler = function (r) {
action_manager.close_dialog();
var action = r.result;
if (action && action.constructor == Object) {
action.context = action.context || {};
@ -453,28 +458,15 @@ openerp.base.View = openerp.base.Controller.extend({
active_model: dataset.model
});
action.flags = {
sidebar : false,
search_view : false,
views_switcher : false,
action_buttons : false,
pager : false
new_window: true
};
action_manager.do_action(action, on_closed);
if (self.view_manager.is_dialog && action.type != 'ir.actions.act_window_close') {
handler({
result : { type: 'ir.actions.act_window_close' }
});
}
} else {
on_no_action(action);
} else if (on_closed) {
on_closed(action);
}
};
if (action_data.special) {
handler({
result : { type: 'ir.actions.act_window_close', special: action_data.special }
});
} else {
if (!action_data.special) {
var context = new openerp.base.CompoundContext(dataset.get_context(), action_data.context || {});
switch(action_data.type) {
case 'object':
@ -484,6 +476,8 @@ openerp.base.View = openerp.base.Controller.extend({
default:
return dataset.exec_workflow(record_id, action_data.name, handler);
}
} else {
action_manager.close_dialog();
}
},
/**

View File

@ -86,7 +86,8 @@
</tr>
<tr>
<td><label for="password">Password:</label></td>
<td><input type="password" name="password"/></td>
<td><input type="password" name="password"
t-att-value="selected_password || ''"/></td>
</tr>
<tr>
<td></td>
@ -278,17 +279,15 @@
<t t-esc="column.string"/>
</th>
</t>
<th t-if="options.selectable"/>
<th t-if="options.selectable" width="1"/>
<t t-foreach="columns" t-as="column">
<th t-if="!column.meta and column.invisible !== '1'" t-att-data-id="column.id"
t-att-class="((options.sortable and column.tag !== 'button') ? 'oe-sortable' : null)">
<t t-if="column.tag !== 'button'">
<t t-esc="column.string"/>
<span t-att-class="(fields_view.sorted.field === column.id) ? ('ui-icon' + (fields_view.sorted.reversed ? ' ui-icon-triangle-1-n' : ' ui-icon-triangle-1-s')) : ''"/>
</t>
<t t-if="column.tag !== 'button'"
><t t-esc="column.string"/></t>
</th>
</t>
<th t-if="options.deletable"/>
<th t-if="options.deletable" width="1"/>
</tr>
</thead>
<tfoot class="ui-widget-header">
@ -316,7 +315,7 @@
</td>
</t>
<th t-if="options.selectable" class="oe-record-selector">
<th t-if="options.selectable" class="oe-record-selector" width="1">
<input type="checkbox"/>
</th>
<t t-foreach="columns" t-as="column">
@ -324,23 +323,10 @@
<td t-if="!column.meta and column.invisible !== '1'" t-att-title="column.help"
t-att-class="'oe-field-cell' + (align ? ' oe-number' : '')"
t-att-data-field="column.id">
<t t-set="attrs" t-value="column.attrs_for(row.data)"/>
<t t-if="!attrs.invisible">
<t t-set="is_button" t-value="column.tag === 'button'"/>
<!-- TODO: get correct widget from form -->
<t t-if="!is_button and row['data'][column.id].value !== false">
<t t-set="value" t-value="row['data'][column.id].value"/>
<t t-esc="value instanceof Array ? value[1] : value"/>
</t>
<button type="button" t-att-title="column.string"
t-if="is_button">
<img t-att-src="'/base/static/src/img/icons/' + column.icon + '.png'"
t-att-alt="column.string"/>
</button>
</t>
<t t-raw="render_cell(row.data, column)"/>
</td>
</t>
<td t-if="options.deletable" class='oe-record-delete'>
<td t-if="options.deletable" class='oe-record-delete' width="1">
<button type="button" name="delete"></button>
</td>
</tr>
@ -432,18 +418,21 @@
</t>
<t t-name="WidgetNotebook">
<ul>
<li t-foreach="widget.pages" t-as="page">
<a t-att-href="'#' + widget.element_id + '-' + page_index">
<li t-foreach="widget.pages" t-as="page" t-att-id="page.element_tab_id">
<a t-att-href="'#' + page.element_id">
<t t-esc="page.string"/>
</a>
</li>
</ul>
<t t-foreach="widget.pages" t-as="page">
<div t-att-id="widget.element_id + '-' + page_index">
<t t-raw="page.render()"/>
</div>
<t t-raw="page.render()"/>
</t>
</t>
<t t-name="WidgetNotebookPage">
<div t-att-id="widget.element_id">
<t t-call="WidgetFrame"/>
</div>
</t>
<t t-name="WidgetSeparator">
<div t-att-class="'separator ' + (widget.node.attrs.orientation || 'horizontal')">
<t t-esc="widget.string"/>
@ -517,9 +506,9 @@
t-att-id="widget.element_id + '_field'"
t-att-class="'field_' + widget.type"
style="width: 100%">
<t t-foreach="widget.field.selection" t-as="options">
<option t-att-value="options[0]">
<t t-esc="options[1]"/>
<t t-foreach="widget.field_index" t-as="options">
<option t-att-value="options.ikey">
<t t-esc="options.label"/>
</option>
</t>
</select>
@ -532,9 +521,9 @@
<span class="oe-m2o-cm-button" t-att-id="widget.name + '_open'">
<img src="/base/static/src/img/icons/gtk-index.png"/></span>
<div t-att-id="widget.cm_id" class="contextMenu" style="display:none"><ul>
<li t-att-id="widget.cm_id + '_search'">Search...</li>
<li t-att-id="widget.cm_id + '_create'">Create New...</li>
<li t-att-id="widget.cm_id + '_open'" style="color:grey">Open...</li>
<li t-att-id="widget.cm_id + '_create'">Create and Edit...</li>
<li t-att-id="widget.cm_id + '_search'">Search...</li>
</ul></div>
</div>
</t>
@ -894,9 +883,19 @@
</t>
<t t-name="SelectCreatePopup">
<div t-att-id="element_id">
<div t-att-id="element_id + '_search'"></div>
<div t-att-id="element_id + '_view_list'"></div>
<div t-att-id="element_id + '_view_form'"></div>
<table style="width:100%">
<tr style="width:100%">
<td style="width:100%">
<div t-att-id="element_id + '_search'" style="width:100%"></div>
</td>
</tr>
<tr style="width:100%">
<td style="width:100%">
<div t-att-id="element_id + '_view_list'" style="width:100%"></div>
</td>
</tr>
</table>
<div t-att-id="element_id + '_view_form'" style="width:100%"></div>
</div>
</t>
<t t-name="SelectCreatePopup.search.buttons">
@ -907,7 +906,15 @@
<button type="button" class="oe_selectcreatepopup-form-save">Save</button>
<button type="button" class="oe_selectcreatepopup-form-close">Close</button>
</t>
<t t-name="FormOpenPopup">
<div t-att-id="element_id">
<div t-att-id="element_id + '_view_form'" style="width:100%"></div>
</div>
</t>
<t t-name="FormOpenPopup.form.buttons">
<button type="button" class="oe_formopenpopup-form-save">Save</button>
<button type="button" class="oe_formopenpopup-form-close">Close</button>
</t>
<t t-name="ListView.row.frame" t-extend="WidgetFrame">
<t t-jquery="tr">
$(document.createElement('t'))

View File

@ -6,47 +6,6 @@ to use it in not GPL project. Please contact sales@dhtmlx.com for details
(c) DHTMLX Ltd.
*/
dhtmlx = function (B) {
for (var A in B) {
dhtmlx[A] = B[A]
}
return dhtmlx
};
dhtmlx.extend_api = function (A, D, C) {
var B = window[A];
if (!B) {
return
}
window[A] = function (G) {
if (G && typeof G == "object" && !G.tagName && !(G instanceof Array)) {
var F = B.apply(this, (D._init ? D._init(G) : arguments));
for (var E in dhtmlx) {
if (D[E]) {
this[D[E]](dhtmlx[E])
}
}
for (var E in G) {
if (D[E]) {
this[D[E]](G[E])
} else {
if (E.indexOf("on") == 0) {
this.attachEvent(E, G[E])
}
}
}
} else {
var F = B.apply(this, arguments)
}
if (D._patch) {
D._patch(this)
}
return F || this
};
window[A].prototype = B.prototype;
if (C) {
dhtmlXHeir(window[A].prototype, C)
}
};
dhtmlxAjax = {
get: function (A, C) {
var B = new dtmlXMLLoaderObject(true);
@ -3732,4 +3691,4 @@ This software is allowed to use under GPL or you need to obtain Commercial or En
to use it in not GPL project. Please contact sales@dhtmlx.com for details
(c) DHTMLX Ltd.
*/
*/

View File

@ -1,42 +1,11 @@
/*
dhtmlxScheduler v.2.3
This software is allowed to use under GPL or you need to obtain Commercial or Enterise License
to use it in not GPL project. Please contact sales@dhtmlx.com for details
(c) DHTMLX Ltd.
*/
dhtmlx=function(obj){
for (var a in obj) dhtmlx[a]=obj[a];
return dhtmlx; //simple singleton
};
dhtmlx.extend_api=function(name,map,ext){
var t = window[name];
if (!t) return; //component not defined
window[name]=function(obj){
if (obj && typeof obj == "object" && !obj.tagName && !(obj instanceof Array)){
var that = t.apply(this,(map._init?map._init(obj):arguments));
//global settings
for (var a in dhtmlx)
if (map[a]) this[map[a]](dhtmlx[a]);
//local settings
for (var a in obj){
if (map[a]) this[map[a]](obj[a]);
else if (a.indexOf("on")==0){
this.attachEvent(a,obj[a]);
}
}
} else
var that = t.apply(this,arguments);
if (map._patch) map._patch(this);
return that||this;
};
window[name].prototype=t.prototype;
if (ext)
dhtmlXHeir(window[name].prototype,ext);
};
/*
dhtmlxScheduler v.2.3
This software is allowed to use under GPL or you need to obtain Commercial or Enterise License
to use it in not GPL project. Please contact sales@dhtmlx.com for details
(c) DHTMLX Ltd.
*/
dhtmlxAjax={
get:function(url,callback){
var t=new dtmlXMLLoaderObject(true);
@ -908,7 +877,7 @@ dhtmlxEventable=function(obj){
}
}
}
/**
* @desc: constructor, data processor object
* @param: serverProcessorURL - url used for update
@ -1489,7 +1458,7 @@ dataProcessor.prototype={
};
//(c)dhtmlx ltd. www.dhtmlx.com
//(c)dhtmlx ltd. www.dhtmlx.com
dataProcessor.prototype._o_init = dataProcessor.prototype.init;
dataProcessor.prototype.init=function(obj){
this._console=this._console||this._createConsole();
@ -1654,7 +1623,7 @@ dataProcessor.wrap("afterUpdateCallback",function(sid,tid,action){
/*
dhx_sort[index]=direction
dhx_filter[index]=mask
@ -1792,7 +1761,7 @@ if (window.dataProcessor){
dhtmlxError.catchError("LoadXML",function(a,b,c){
alert(c[0].responseText);
});
window.dhtmlXScheduler=window.scheduler={version:2.2};
dhtmlxEventable(scheduler);
scheduler.init=function(id,date,mode){
@ -2434,7 +2403,7 @@ scheduler.getLabel = function(property, key) {
}
}
return "";
};
};
scheduler.date={
date_part:function(date){
date.setHours(0);
@ -2568,7 +2537,7 @@ scheduler.date={
return this.getISOWeek(ndate);
}
}
scheduler.locale={
date:{
month_full:["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
@ -2609,7 +2578,7 @@ scheduler.locale={
}
}
/*
%e Day of the month without leading zeros (01..31)
%d Day of the month, 2 digits with leading zeros (01..31)
@ -2715,7 +2684,7 @@ scheduler.init_templates=function(){
}
scheduler.uid=function(){
if (!this._seed) this._seed=(new Date).valueOf();
return this._seed++;
@ -3260,7 +3229,7 @@ scheduler.getEvents = function(from,to){
result.push(ev);
}
return result;
};
};
scheduler._loaded={};
scheduler._load=function(url,from){
url=url||this._load_url;
@ -3445,7 +3414,7 @@ scheduler.attachEvent("onXLE",function(){
this.config.show_loading=true;
}
});
scheduler.ical={
parse:function(str){
var data = str.match(RegExp(this.c_start+"[^\f]*"+this.c_end,""));
@ -3510,7 +3479,7 @@ scheduler.ical={
e_start:"BEGIN:VEVENT",
e_end:"END:VEVENT",
c_end:"END:VCALENDAR"
};
};
scheduler.form_blocks={
textarea:{
render:function(sns){
@ -3850,7 +3819,7 @@ scheduler._get_lightbox=function(){
}
return this._lightbox;
}
scheduler._lightbox_template="<div class='dhx_cal_ltitle'><span class='dhx_mark'>&nbsp;</span><span class='dhx_time'></span><span class='dhx_title'></span></div><div class='dhx_cal_larea'></div><div class='dhx_btn_set'><div class='dhx_save_btn'></div><div>&nbsp;</div></div><div class='dhx_btn_set'><div class='dhx_cancel_btn'></div><div>&nbsp;</div></div><div class='dhx_btn_set' style='float:right;'><div class='dhx_delete_btn'></div><div>&nbsp;</div></div>";
scheduler._lightbox_template="<div class='dhx_cal_ltitle'><span class='dhx_mark'>&nbsp;</span><span class='dhx_time'></span><span class='dhx_title'></span></div><div class='dhx_cal_larea'></div><div class='dhx_btn_set'><div class='dhx_save_btn'></div><div>&nbsp;</div></div><div class='dhx_btn_set'><div class='dhx_cancel_btn'></div><div>&nbsp;</div></div><div class='dhx_btn_set' style='float:right;'><div class='dhx_delete_btn'></div><div>&nbsp;</div></div>";
scheduler._dp_init=function(dp){
dp._methods=["setEventTextStyle","","changeEventId","deleteEvent"];
@ -3928,4 +3897,4 @@ scheduler._update_callback = function(upd,id){
data.end_date = scheduler.templates.xml_date(data.end_date);
scheduler.addEvent(data);
};
};

View File

@ -1,33 +1,3 @@
dhtmlx=function(obj){
for (var a in obj) dhtmlx[a]=obj[a];
return dhtmlx; //simple singleton
};
dhtmlx.extend_api=function(name,map,ext){
var t = window[name];
if (!t) return; //component not defined
window[name]=function(obj){
if (obj && typeof obj == "object" && !obj.tagName && !(obj instanceof Array)){
var that = t.apply(this,(map._init?map._init(obj):arguments));
//global settings
for (var a in dhtmlx)
if (map[a]) this[map[a]](dhtmlx[a]);
//local settings
for (var a in obj){
if (map[a]) this[map[a]](obj[a]);
else if (a.indexOf("on")==0){
this.attachEvent(a,obj[a]);
}
}
} else
var that = t.apply(this,arguments);
if (map._patch) map._patch(this);
return that||this;
};
window[name].prototype=t.prototype;
if (ext)
dhtmlXHeir(window[name].prototype,ext);
};
dhtmlxAjax={
get:function(url,callback){
var t=new dtmlXMLLoaderObject(true);

View File

@ -70,7 +70,6 @@ openerp.base.form.DashBoard = openerp.base.form.Widget.extend({
// TODO: create a Dialog controller which optionally takes an action
// Should set width & height automatically and take buttons & views callback
var dialog_id = _.uniqueId('act_window_dialog');
var action_manager = new openerp.base.ActionManager(this.session, dialog_id);
var $dialog = $('<div id=' + dialog_id + '>').dialog({
modal : true,
title : 'Actions',
@ -86,8 +85,7 @@ openerp.base.form.DashBoard = openerp.base.form.Widget.extend({
}
}
});
action_manager.start();
action_manager.do_action(action);
new openerp.base.ViewManagerAction(this.session, dialog_id, action).start();
// TODO: should bind ListView#select_record in order to catch record clicking
},
do_add_widget : function(action_manager) {
@ -225,9 +223,8 @@ openerp.base.form.DashBoard = openerp.base.form.Widget.extend({
action_buttons : false,
pager: false
};
new openerp.base.ActionManager(
this.session, this.view.element_id + '_action_' + action.id)
.do_action(action);
new openerp.base.ViewManagerAction(this.session,
this.view.element_id + '_action_' + action.id, action).start();
},
render: function() {
// We should start with three columns available

View File

@ -1,33 +1,3 @@
dhtmlx=function(obj){
for (var a in obj) dhtmlx[a]=obj[a];
return dhtmlx; //simple singleton
};
dhtmlx.extend_api=function(name,map,ext){
var t = window[name];
if (!t) return; //component not defined
window[name]=function(obj){
if (obj && typeof obj == "object" && !obj.tagName){
var that = t.apply(this,(map._init?map._init(obj):arguments));
//global settings
for (var a in dhtmlx)
if (map[a]) this[map[a]](dhtmlx[a]);
//local settings
for (var a in obj){
if (map[a]) this[map[a]](obj[a]);
else if (a.indexOf("on")==0){
this.attachEvent(a,obj[a]);
}
}
} else
var that = t.apply(this,arguments);
if (map._patch) map._patch(this);
return that||this;
};
window[name].prototype=t.prototype;
if (ext)
dhtmlXHeir(window[name].prototype,ext);
};
dhtmlxAjax={
get:function(url,callback){
var t=new dtmlXMLLoaderObject(true);

View File

@ -2,37 +2,6 @@
Copyright DHTMLX LTD. http://www.dhtmlx.com
To use this component please contact sales@dhtmlx.com to obtain license
*/
dhtmlx=function(obj){
for (var a in obj) dhtmlx[a]=obj[a];
return dhtmlx; //simple singleton
};
dhtmlx.extend_api=function(name,map,ext){
var t = window[name];
if (!t) return; //component not defined
window[name]=function(obj){
if (obj && typeof obj == "object" && !obj.tagName){
var that = t.apply(this,(map._init?map._init(obj):arguments));
//global settings
for (var a in dhtmlx)
if (map[a]) this[map[a]](dhtmlx[a]);
//local settings
for (var a in obj){
if (map[a]) this[map[a]](obj[a]);
else if (a.indexOf("on")==0){
this.attachEvent(a,obj[a]);
}
}
} else
var that = t.apply(this,arguments);
if (map._patch) map._patch(this);
return that||this;
};
window[name].prototype=t.prototype;
if (ext)
dhtmlXHeir(window[name].prototype,ext);
};
dhtmlxAjax={
get:function(url,callback){
var t=new dtmlXMLLoaderObject(true);

View File

@ -0,0 +1,2 @@
#!/usr/bin/python
import controllers

View File

@ -0,0 +1,10 @@
{
"name": "Base Graph",
"version": "2.0",
"depends": ['base'],
"js": [
"static/lib/dhtmlxGraph/codebase/dhtmlxchart.js",
"static/src/js/graph.js"],
"css": ["static/lib/dhtmlxGraph/codebase/dhtmlxchart.css"],
"active": True
}

View File

@ -0,0 +1 @@
import main

View File

@ -0,0 +1,11 @@
from base.controllers.main import View
import openerpweb
class GraphView(View):
_cp_path = "/base_graph/graphview"
@openerpweb.jsonrequest
def load(self, req, model, view_id):
fields_view = self.fields_view_get(req, model, view_id, 'graph')
all_fields = req.session.model(model).fields_get()
return {'fields_view': fields_view, 'all_fields':all_fields}

View File

@ -0,0 +1,73 @@
<h1>GNU GENERAL PUBLIC LICENSE</h1>
Version 2, June 1991 </p>
</p>
<p>Copyright (C) 1989, 1991 Free Software Foundation, Inc. </p>
<p>59 Temple Place - Suite 330, Boston, MA 02111-1307, USA</p>
</p>
<p>Everyone is permitted to copy and distribute verbatim copies</p>
<p>of this license document, but changing it is not allowed.</p>
</p>
</p>
<p>TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION</p>
<p>0. This License applies to any program or other work which contains a notice placed by the copyright holder saying it may be distributed under the terms of this General Public License. The "Program", below, refers to any such program or work, and a "work based on the Program" means either the Program or any derivative work under copyright law: that is to say, a work containing the Program or a portion of it, either verbatim or with modifications and/or translated into another language. (Hereinafter, translation is included without limitation in the term "modification".) Each licensee is addressed as "you". </p>
</p>
<p>Activities other than copying, distribution and modification are not covered by this License; they are outside its scope. The act of running the Program is not restricted, and the output from the Program is covered only if its contents constitute a work based on the Program (independent of having been made by running the Program). Whether that is true depends on what the Program does. </p>
</p>
<p>1. You may copy and distribute verbatim copies of the Program's source code as you receive it, in any medium, provided that you conspicuously and appropriately publish on each copy an appropriate copyright notice and disclaimer of warranty; keep intact all the notices that refer to this License and to the absence of any warranty; and give any other recipients of the Program a copy of this License along with the Program. </p>
</p>
<p>You may charge a fee for the physical act of transferring a copy, and you may at your option offer warranty protection in exchange for a fee. </p>
</p>
<p>2. You may modify your copy or copies of the Program or any portion of it, thus forming a work based on the Program, and copy and distribute such modifications or work under the terms of Section 1 above, provided that you also meet all of these conditions: </p>
</p>
</p>
<p>a) You must cause the modified files to carry prominent notices stating that you changed the files and the date of any change. </p>
</p>
<p>b) You must cause any work that you distribute or publish, that in whole or in part contains or is derived from the Program or any part thereof, to be licensed as a whole at no charge to all third parties under the terms of this License. </p>
</p>
<p>c) If the modified program normally reads commands interactively when run, you must cause it, when started running for such interactive use in the most ordinary way, to print or display an announcement including an appropriate copyright notice and a notice that there is no warranty (or else, saying that you provide a warranty) and that users may redistribute the program under these conditions, and telling the user how to view a copy of this License. (Exception: if the Program itself is interactive but does not normally print such an announcement, your work based on the Program is not required to print an announcement.) </p>
<p>These requirements apply to the modified work as a whole. If identifiable sections of that work are not derived from the Program, and can be reasonably considered independent and separate works in themselves, then this License, and its terms, do not apply to those sections when you distribute them as separate works. But when you distribute the same sections as part of a whole which is a work based on the Program, the distribution of the whole must be on the terms of this License, whose permissions for other licensees extend to the entire whole, and thus to each and every part regardless of who wrote it. </p>
</p>
<p>Thus, it is not the intent of this section to claim rights or contest your rights to work written entirely by you; rather, the intent is to exercise the right to control the distribution of derivative or collective works based on the Program. </p>
</p>
<p>In addition, mere aggregation of another work not based on the Program with the Program (or with a work based on the Program) on a volume of a storage or distribution medium does not bring the other work under the scope of this License. </p>
</p>
<p>3. You may copy and distribute the Program (or a work based on it, under Section 2) in object code or executable form under the terms of Sections 1 and 2 above provided that you also do one of the following: </p>
</p>
<p>a) Accompany it with the complete corresponding machine-readable source code, which must be distributed under the terms of Sections 1 and 2 above on a medium customarily used for software interchange; or, </p>
</p>
<p>b) Accompany it with a written offer, valid for at least three years, to give any third party, for a charge no more than your cost of physically performing source distribution, a complete machine-readable copy of the corresponding source code, to be distributed under the terms of Sections 1 and 2 above on a medium customarily used for software interchange; or, </p>
</p>
<p>c) Accompany it with the information you received as to the offer to distribute corresponding source code. (This alternative is allowed only for noncommercial distribution and only if you received the program in object code or executable form with such an offer, in accord with Subsection b above.) </p>
<p>The source code for a work means the preferred form of the work for making modifications to it. For an executable work, complete source code means all the source code for all modules it contains, plus any associated interface definition files, plus the scripts used to control compilation and installation of the executable. However, as a special exception, the source code distributed need not include anything that is normally distributed (in either source or binary form) with the major components (compiler, kernel, and so on) of the operating system on which the executable runs, unless that component itself accompanies the executable. </p>
</p>
<p>If distribution of executable or object code is made by offering access to copy from a designated place, then offering equivalent access to copy the source code from the same place counts as distribution of the source code, even though third parties are not compelled to copy the source along with the object code. </p>
</p>
<p>4. You may not copy, modify, sublicense, or distribute the Program except as expressly provided under this License. Any attempt otherwise to copy, modify, sublicense or distribute the Program is void, and will automatically terminate your rights under this License. However, parties who have received copies, or rights, from you under this License will not have their licenses terminated so long as such parties remain in full compliance. </p>
</p>
<p>5. You are not required to accept this License, since you have not signed it. However, nothing else grants you permission to modify or distribute the Program or its derivative works. These actions are prohibited by law if you do not accept this License. Therefore, by modifying or distributing the Program (or any work based on the Program), you indicate your acceptance of this License to do so, and all its terms and conditions for copying, distributing or modifying the Program or works based on it. </p>
</p>
<p>6. Each time you redistribute the Program (or any work based on the Program), the recipient automatically receives a license from the original licensor to copy, distribute or modify the Program subject to these terms and conditions. You may not impose any further restrictions on the recipients' exercise of the rights granted herein. You are not responsible for enforcing compliance by third parties to this License. </p>
</p>
<p>7. If, as a consequence of a court judgment or allegation of patent infringement or for any other reason (not limited to patent issues), conditions are imposed on you (whether by court order, agreement or otherwise) that contradict the conditions of this License, they do not excuse you from the conditions of this License. If you cannot distribute so as to satisfy simultaneously your obligations under this License and any other pertinent obligations, then as a consequence you may not distribute the Program at all. For example, if a patent license would not permit royalty-free redistribution of the Program by all those who receive copies directly or indirectly through you, then the only way you could satisfy both it and this License would be to refrain entirely from distribution of the Program. </p>
</p>
<p>If any portion of this section is held invalid or unenforceable under any particular circumstance, the balance of the section is intended to apply and the section as a whole is intended to apply in other circumstances. </p>
</p>
<p>It is not the purpose of this section to induce you to infringe any patents or other property right claims or to contest validity of any such claims; this section has the sole purpose of protecting the integrity of the free software distribution system, which is implemented by public license practices. Many people have made generous contributions to the wide range of software distributed through that system in reliance on consistent application of that system; it is up to the author/donor to decide if he or she is willing to distribute software through any other system and a licensee cannot impose that choice. </p>
</p>
<p>This section is intended to make thoroughly clear what is believed to be a consequence of the rest of this License. </p>
</p>
<p>8. If the distribution and/or use of the Program is restricted in certain countries either by patents or by copyrighted interfaces, the original copyright holder who places the Program under this License may add an explicit geographical distribution limitation excluding those countries, so that distribution is permitted only in or among countries not thus excluded. In such case, this License incorporates the limitation as if written in the body of this License. </p>
</p>
<p>9. The Free Software Foundation may publish revised and/or new versions of the General Public License from time to time. Such new versions will be similar in spirit to the present version, but may differ in detail to address new problems or concerns. </p>
</p>
<p>Each version is given a distinguishing version number. If the Program specifies a version number of this License which applies to it and "any later version", you have the option of following the terms and conditions either of that version or of any later version published by the Free Software Foundation. If the Program does not specify a version number of this License, you may choose any version ever published by the Free Software Foundation. </p>
</p>
<p>10. If you wish to incorporate parts of the Program into other free programs whose distribution conditions are different, write to the author to ask for permission. For software which is copyrighted by the Free Software Foundation, write to the Free Software Foundation; we sometimes make exceptions for this. Our decision will be guided by the two goals of preserving the free status of all derivatives of our free software and of promoting the sharing and reuse of software generally. </p>
</p>
<p>NO WARRANTY</p>
</p>
<p>11. BECAUSE THE PROGRAM IS LICENSED FREE OF CHARGE, THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY APPLICABLE LAW. EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE. THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM IS WITH YOU. SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF ALL NECESSARY SERVICING, REPAIR OR CORRECTION. </p>
</p>
<p>12. IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MAY MODIFY AND/OR REDISTRIBUTE THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS), EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGES. </p>
</p>
<p>

View File

@ -0,0 +1,15 @@
/*
Copyright DHTMLX LTD. http://www.dhtmlx.com
You allowed to use this component or parts of it under GPL terms
To use it on other terms or get Professional edition of the component please contact us at sales@dhtmlx.com
*/
.dhx_tooltip{display:none;position:absolute;font-family:Tahoma;font-size:8pt;z-index:10000;background-color:white;padding:2px 2px 2px 2px;border:1px solid #A4BED4;}
.dhx_chart{position:relative;font-family:Verdana;font-size:13px;color:#000;overflow:hidden;}
.dhx_canvas_text{position:absolute;text-align:center;}
.dhx_map_img{width:100%;height:100%;position:absolute;top:0;left:0;border:0;filter:alpha(opacity=0);}
.dhx_axis_item_y{position:absolute;height:10px;line-height:10px;text-align:right;}
.dhx_axis_title_y{text-align:center;font-family:Verdana;-webkit-transform:rotate(-90deg);-moz-transform:rotate(-90deg);filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-o-transform:rotate(-90deg);padding-left:3px;}
.dhx_axis_item_x{text-align:right;margin-top:30px;margin-left:-14px;font-size:8pt;-webkit-transform:rotate(-60deg);-moz-transform:rotate(-60deg);filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-o-transform:rotate(-60deg);padding-left:3px;}
.dhx_axis_title_x{text-align:center;margin-top:50px;}
.dhx_chart_legend{position:absolute;}
.dhx_chart_legend_item{height:18px;line-height:18px;padding:2px;}

View File

@ -0,0 +1,131 @@
/*
Copyright DHTMLX LTD. http://www.dhtmlx.com
You allowed to use this component or parts of it under GPL terms
To use it on other terms or get Professional edition of the component please contact us at sales@dhtmlx.com
*/
window.dhtmlx||(dhtmlx={});dhtmlx.version="3.0";dhtmlx.codebase="./";dhtmlx.extend=function(a,b){for(var c in b)a[c]=b[c];b.k&&a.k();return a};
dhtmlx.proto_extend=function(){for(var a=arguments,b=a[0],c=[],d=a.length-1;d>0;d--){if(typeof a[d]=="function")a[d]=a[d].prototype;for(var e in a[d])if(e=="_init")c.push(a[d][e]);else b[e]||(b[e]=a[d][e])}a[0].k&&c.push(a[0].k);b.k=function(){for(var g=0;g<c.length;g++)c[g].apply(this,arguments)};b.base=a[1];var f=function(g){this.k(g);this.B&&this.B(g,this.defaults)};f.prototype=b;b=a=null;return f};dhtmlx.bind=function(a,b){return function(){return a.apply(b,arguments)}};
dhtmlx.require=function(a){if(!dhtmlx.ha[a]){dhtmlx.exec(dhtmlx.ajax().sync().get(dhtmlx.codebase+a).responseText);dhtmlx.ha[a]=true}};dhtmlx.ha={};dhtmlx.exec=function(a){window.execScript?window.execScript(a):window.eval(a)};dhtmlx.methodPush=function(a,b){return function(){var c=false;return c=a[b].apply(a,arguments)}};dhtmlx.isNotDefined=function(a){return typeof a=="undefined"};dhtmlx.delay=function(a,b,c,d){setTimeout(function(){var e=a.apply(b,c);a=b=c=null;return e},d||1)};
dhtmlx.uid=function(){if(!this.S)this.S=(new Date).valueOf();this.S++;return this.S};dhtmlx.toNode=function(a){if(typeof a=="string")return document.getElementById(a);return a};dhtmlx.toArray=function(a){return dhtmlx.extend(a||[],dhtmlx.PowerArray)};dhtmlx.toFunctor=function(a){return typeof a=="string"?eval(a):a};dhtmlx.j={};
dhtmlx.event=function(a,b,c,d){a=dhtmlx.toNode(a);var e=dhtmlx.uid();dhtmlx.j[e]=[a,b,c];if(d)c=dhtmlx.bind(c,d);if(a.addEventListener)a.addEventListener(b,c,false);else a.attachEvent&&a.attachEvent("on"+b,c);return e};dhtmlx.eventRemove=function(a){if(a){var b=dhtmlx.j[a];if(b[0].removeEventListener)b[0].removeEventListener(b[1],b[2],false);else b[0].detachEvent&&b[0].detachEvent("on"+b[1],b[2]);delete this.j[a]}};
dhtmlx.EventSystem={k:function(){this.j={};this.A={};this.s={}},block:function(){this.j.U=true},unblock:function(){this.j.U=false},mapEvent:function(a){dhtmlx.extend(this.s,a)},callEvent:function(a,b){if(this.j.U)return true;a=a.toLowerCase();var c=this.j[a.toLowerCase()],d=true;if(c)for(var e=0;e<c.length;e++)if(c[e].apply(this,b||[])===false)d=false;if(this.s[a]&&!this.s[a].callEvent(a,b))d=false;return d},attachEvent:function(a,b,c){a=a.toLowerCase();c=c||dhtmlx.uid();b=dhtmlx.toFunctor(b);var d=
this.j[a]||dhtmlx.toArray();d.push(b);this.j[a]=d;this.A[c]={f:b,t:a};return c},detachEvent:function(a){var b=this.A[a].t,c=this.A[a].f;b=this.j[b];b.remove(c);delete this.A[a]}};
dhtmlx.PowerArray={removeAt:function(a,b){if(a>=0)this.splice(a,b||1)},remove:function(a){this.removeAt(this.find(a))},insertAt:function(a,b){if(!b&&b!==0)this.push(a);else{var c=this.splice(b,this.length-b);this[b]=a;this.push.apply(this,c)}},find:function(a){for(i=0;i<this.length;i++)if(a==this[i])return i;return-1},each:function(a,b){for(var c=0;c<this.length;c++)a.call(b||this,this[c])},map:function(a,b){for(var c=0;c<this.length;c++)this[c]=a.call(b||this,this[c]);return this}};dhtmlx.env={};
if(navigator.userAgent.indexOf("Opera")!=-1)dhtmlx.La=true;else{dhtmlx.r=!!document.all;dhtmlx.Ka=!document.all;dhtmlx.Ma=navigator.userAgent.indexOf("KHTML")!=-1;if(navigator.appVersion.indexOf("MSIE 8.0")!=-1&&document.compatMode!="BackCompat")dhtmlx.r=8}dhtmlx.env={};
(function(){dhtmlx.env.transform=false;dhtmlx.env.transition=false;var a={};a.names=["transform","transition"];a.transform=["transform","WebkitTransform","MozTransform","oTransform"];a.transition=["transition","WebkitTransition","MozTransition","oTransition"];for(var b=document.createElement("DIV"),c=0;c<a.names.length;c++)for(;p=a[a.names[c]].pop();)if(typeof b.style[p]!="undefined")dhtmlx.env[a.names[c]]=true})();
dhtmlx.env.transform_prefix=function(){var a;if(dhtmlx.La)a="-o-";else{a="";if(dhtmlx.Ka)a="-moz-";if(dhtmlx.Ma)a="-webkit-"}return a}();dhtmlx.env.svg=function(){return document.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#BasicStructure","1.1")}();dhtmlx.zIndex={drag:1E4};
dhtmlx.html={create:function(a,b,c){b=b||{};var d=document.createElement(a);for(var e in b)d.setAttribute(e,b[e]);if(b.style)d.style.cssText=b.style;if(b["class"])d.className=b["class"];if(c)d.innerHTML=c;return d},getValue:function(a){a=dhtmlx.toNode(a);if(!a)return"";return dhtmlx.isNotDefined(a.value)?a.innerHTML:a.value},remove:function(a){if(a instanceof Array)for(var b=0;b<a.length;b++)this.remove(a[b]);else a&&a.parentNode&&a.parentNode.removeChild(a)},insertBefore:function(a,b,c){if(a)b?b.parentNode.insertBefore(a,
b):c.appendChild(a)},locate:function(a,b){a=a||event;for(var c=a.target||a.srcElement;c;){if(c.getAttribute){var d=c.getAttribute(b);if(d)return d}c=c.parentNode}return null},offset:function(a){if(a.getBoundingClientRect){var b=a.getBoundingClientRect(),c=document.body,d=document.documentElement,e=window.pageYOffset||d.scrollTop||c.scrollTop,f=window.pageXOffset||d.scrollLeft||c.scrollLeft,g=d.clientTop||c.clientTop||0,i=d.clientLeft||c.clientLeft||0,j=b.top+e-g,k=b.left+f-i;return{y:Math.round(j),
x:Math.round(k)}}else{for(k=j=0;a;){j+=parseInt(a.offsetTop,10);k+=parseInt(a.offsetLeft,10);a=a.offsetParent}return{y:j,x:k}}},pos:function(a){a=a||event;if(a.pageX||a.pageY)return{x:a.pageX,y:a.pageY};var b=dhtmlx.r&&document.compatMode!="BackCompat"?document.documentElement:document.body;return{x:a.clientX+b.scrollLeft-b.clientLeft,y:a.clientY+b.scrollTop-b.clientTop}},preventEvent:function(a){a&&a.preventDefault&&a.preventDefault();dhtmlx.html.stopEvent(a)},stopEvent:function(a){(a||event).cancelBubble=
true;return false},addCss:function(a,b){a.className+=" "+b},removeCss:function(a,b){a.className=a.className.replace(RegExp(b,"g"),"")}};(function(){var a=document.getElementsByTagName("SCRIPT");if(a.length){a=(a[a.length-1].getAttribute("src")||"").split("/");a.splice(a.length-1,1);dhtmlx.codebase=a.slice(0,a.length).join("/")+"/"}})();dhtmlx.ui={};
dhtmlx.Destruction={k:function(){dhtmlx.destructors.push(this)},destructor:function(){this.destructor=function(){};this.ib=this.v=null;this.fa&&document.body.appendChild(this.fa);this.fa=null;if(this.g){this.g.innerHTML="";this.g.v=null}this.data=this.g=this.L=null;this.j=this.A={}}};dhtmlx.destructors=[];
dhtmlx.event(window,"unload",function(){for(var a=0;a<dhtmlx.destructors.length;a++)dhtmlx.destructors[a].destructor();dhtmlx.destructors=[];for(var b in dhtmlx.j){a=dhtmlx.j[b];if(a[0].removeEventListener)a[0].removeEventListener(a[1],a[2],false);else a[0].detachEvent&&a[0].detachEvent("on"+a[1],a[2]);delete dhtmlx.j[b]}});dhtmlx.math={};dhtmlx.math.fb=["0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F"];
dhtmlx.math.toHex=function(a,b){a=parseInt(a,10);for(str="";a>0;){str=this.fb[a%16]+str;a=Math.floor(a/16)}for(;str.length<b;)str="0"+str;return str};dhtmlx.ui.Map=function(a){this.name="Map";this.q="map_"+dhtmlx.uid();this.Pa=a;this.s=[]};
dhtmlx.ui.Map.prototype={addRect:function(a,b,c){this.X(a,"RECT",b,c)},addPoly:function(a,b){this.X(a,"POLY",b)},X:function(a,b,c,d){var e="";if(arguments.length==4)e="userdata='"+d+"'";this.s.push("<area "+this.Pa+"='"+a+"' shape='"+b+"' coords='"+c.join()+"' "+e+"></area>")},addSector:function(a,b,c,d,e,f,g){var i=[];i.push(d);i.push(Math.floor(e*g));for(var j=b;j<c;j+=Math.PI/18){i.push(Math.floor(d+f*Math.cos(j)));i.push(Math.floor((e+f*Math.sin(j))*g))}i.push(Math.floor(d+f*Math.cos(c)));i.push(Math.floor((e+
f*Math.sin(c))*g));i.push(d);i.push(Math.floor(e*g));return this.addPoly(a,i)},render:function(a){var b=dhtmlx.html.create("DIV");b.style.cssText="position:absolute; width:100%; height:100%; top:0px; left:0px;";a.appendChild(b);var c=dhtmlx.r?"":"src='data:image/gif;base64,R0lGODlhEgASAIAAAP///////yH5BAUUAAEALAAAAAASABIAAAIPjI+py+0Po5y02ouz3pwXADs='";b.innerHTML="<map id='"+this.q+"' name='"+this.q+"'>"+this.s.join("\n")+"</map><img "+c+" class='dhx_map_img' usemap='#"+this.q+"'>";a.v=b;this.s=[]}};
dhtmlx.chart={};
dhtmlx.chart.area={pvt_render_area:function(a,b,c,d,e,f){var g=this.C(a,b,c,d,e),i=Math.floor(g.cellWidth/2);if(b.length){a.globalAlpha=this.e.alpha.call(this,b[0]);a.fillStyle=this.e.color.call(this,b[0]);var j=this.p(b[0],c,d,g),k=this.e.offset?c.x+g.cellWidth*0.5:c.x;a.beginPath();a.moveTo(k,d.y);a.lineTo(k,j);f.addRect(b[0].id,[k-i,j-i,k+i,j+i]);this.e.yAxis||this.renderTextAt(false,!this.e.offset?false:true,k,j-this.e.labelOffset,this.e.label(b[0]));for(var h=1;h<b.length;h++){var m=k+Math.floor(g.cellWidth*
h)-0.5,l=this.p(b[h],c,d,g);a.lineTo(m,l);f.addRect(b[h].id,[m-i,l-i,m+i,l+i]);this.e.yAxis||this.renderTextAt(false,!this.e.offset&&h==b.length-1?"left":"center",m,l-this.e.labelOffset,this.e.label(b[h]))}a.lineTo(k+Math.floor(g.cellWidth*[b.length-1]),d.y);a.lineTo(k,d.y);a.fill()}}};
dhtmlx.chart.stackedArea={pvt_render_stackedArea:function(a,b,c,d,e,f){var g=this.C(a,b,c,d,e),i=Math.floor(g.cellWidth/2),j=[];if(b.length){a.globalAlpha=this.e.alpha.call(this,b[0]);a.fillStyle=this.e.color.call(this,b[0]);var k=e?b[0].$startY:d.y,h=this.e.offset?c.x+g.cellWidth*0.5:c.x,m=this.p(b[0],c,d,g)-(e?d.y-k:0);j[0]=m;a.beginPath();a.moveTo(h,k);a.lineTo(h,m);f.addRect(b[0].id,[h-i,m-i,h+i,m+i]);this.e.yAxis||this.renderTextAt(false,true,h,m-this.e.labelOffset,this.e.label(b[0]));for(var l=
1;l<b.length;l++){var n=h+Math.floor(g.cellWidth*l)-0.5,o=this.p(b[l],c,d,g)-(e?d.y-b[l].$startY:0);j[l]=o;a.lineTo(n,o);f.addRect(b[l].id,[n-i,o-i,n+i,o+i]);this.e.yAxis||this.renderTextAt(false,true,n,o-this.e.labelOffset,this.e.label(b[l]))}a.lineTo(h+Math.floor(g.cellWidth*[b.length-1]),k);if(e)for(l=b.length-1;l>=0;l--){n=h+Math.floor(g.cellWidth*l)-0.5;var s=b[l].$startY;a.lineTo(n,s)}else a.lineTo(h+Math.floor(g.cellWidth*(length-1))-0.5,k);a.lineTo(h,k);a.fill();for(l=0;l<b.length;l++)b[l].$startY=
j[l]}}};
dhtmlx.chart.spline={pvt_render_spline:function(a,b,c,d,e){var f=this.C(a,b,c,d,e);Math.floor(f.cellWidth/2);var g=[];if(b.length){var i=this.e.offset?c.x+f.cellWidth*0.5:c.x;for(e=0;e<b.length;e++){var j=!e?i:Math.floor(f.cellWidth*e)-0.5+i,k=this.p(b[e],c,d,f);g.push({x:j,y:k})}var h=this.Ha(g);for(e=0;e<g.length-1;e++){var m=g[e].x;c=g[e].y;for(var l=g[e+1].x,n=g[e+1].y,o=m;o<l;o++)this.i(a,o,this.P(o,m,e,h.a,h.b,h.c,h.d),o+1,this.P(o+1,m,e,h.a,h.b,h.c,h.d),this.e.line.color(b[e]),this.e.line.width);this.i(a,
l-1,this.P(o,m,e,h.a,h.b,h.c,h.d),l,n,this.e.line.color(b[e]),this.e.line.width);this.M(a,m,c,b[e],this.e.label(b[e]))}this.M(a,l,n,b[e],this.e.label(b[e]))}},Ha:function(a){var b,c,d,e,f,g,i,j,k;b=[];m=[];k=a.length;for(var h=0;h<k-1;h++){b[h]=a[h+1].x-a[h].x;m[h]=(a[h+1].y-a[h].y)/b[h]}c=[];d=[];c[0]=0;c[1]=2*(b[0]+b[1]);d[0]=0;d[1]=6*(m[1]-m[0]);for(h=2;h<k-1;h++){c[h]=2*(b[h-1]+b[h])-b[h-1]*b[h-1]/c[h-1];d[h]=6*(m[h]-m[h-1])-b[h-1]*d[h-1]/c[h-1]}e=[];e[k-1]=e[0]=0;for(h=k-2;h>=1;h--)e[h]=(d[h]-
b[h]*e[h+1])/c[h];f=[];g=[];i=[];j=[];for(h=0;h<k-1;h++){f[h]=a[h].y;g[h]=-b[h]*e[h+1]/6-b[h]*e[h]/3+(a[h+1].y-a[h].y)/b[h];i[h]=e[h]/2;j[h]=(e[h+1]-e[h])/(6*b[h])}return{a:f,b:g,c:i,d:j}},P:function(a,b,c,d,e,f,g){return d[c]+(a-b)*(e[c]+(a-b)*(f[c]+(a-b)*g[c]))}};
dhtmlx.chart.barH={pvt_render_barH:function(a,b,c,d,e,f){var g,i,j,k,h=d.x-c.x,m=!!this.e.yAxis,l=this.O("h");g=l.max;i=l.min;var n=Math.floor((d.y-c.y)/b.length);e||this.$(a,b,c,d,i,g,n);if(m){g=parseFloat(this.e.xAxis.end);i=parseFloat(this.e.xAxis.start)}var o=this.z(i,g);k=o[0];j=o[1];var s=k?h/k:10;if(!m){var t=10;s=k?(h-t)/k:10}var q=parseInt(this.e.width,10);if(q*this.h.length+4>n)q=n/this.h.length-4;var v=Math.floor((n-q*this.h.length)/2),p=typeof this.e.radius!="undefined"?parseInt(this.e.radius,
10):Math.round(q/5),u=false,r=this.e.gradient;if(r&&typeof r!="function"){u=r;r=false}else if(r){r=a.createLinearGradient(c.x,c.y,d.x,c.y);this.e.gradient(r)}m||this.i(a,c.x-0.5,c.y,c.x-0.5,d.y,"#000000",1);for(d=0;d<b.length;d++){var w=parseFloat(this.e.value(b[d]));if(w>g)w=g;w-=i;w*=j;var x=c.x,y=c.y+v+d*n+(q+1)*e;if(w<0||this.e.yAxis&&w===0)this.renderTextAt("middle",true,x+10,y+q/2+v,this.e.label(b[d]));else{m||(w+=t/s);var B=r||this.e.color.call(this,b[d]);if(this.e.border){a.beginPath();a.fillStyle=
B;this.o(a,x,y,q,p,s,w,0);a.lineTo(x,0);a.fill();a.fillStyle="#000000";a.globalAlpha=0.37;a.beginPath();this.o(a,x,y,q,p,s,w,0);a.fill()}a.globalAlpha=this.e.alpha.call(this,b[d]);a.fillStyle=r||this.e.color.call(this,b[d]);a.beginPath();var z=this.o(a,x,y,q,p,s,w,this.e.border?1:0);if(r&&!u)a.lineTo(c.x+h,y+(this.e.border?1:0));a.fill();a.globalAlpha=1;if(u!=false){var A=this.G(a,c.x,y+q,c.x+s*w+2,y,u,B,"x");a.fillStyle=A.gradient;a.beginPath();z=this.o(a,x,y+A.offset,q-A.offset*2,p,s,w,A.offset);
a.fill();a.globalAlpha=1}this.renderTextAt("middle",false,z[0]+3,parseInt(y+(z[1]-y)/2,10),this.e.label(b[d]));f.addRect(b[d].id,[x,y,z[0],z[1]],e)}}},o:function(a,b,c,d,e,f,g,i){var j=0;if(e>f*g){var k=(e-f*g)/e;j=-Math.asin(k)+Math.PI/2}a.moveTo(b,c+i);var h=b+f*g-e-(e?0:i);e<f*g&&a.lineTo(h,c+i);f=c+e;e&&a.arc(h,f,e-i,-Math.PI/2+j,0,false);var m=c+d-e-(e?0:i),l=h+e-(e?i:0);a.lineTo(l,m);var n=h;e&&a.arc(n,m,e-i,0,Math.PI/2-j,false);var o=c+d-i;a.lineTo(b,o);a.lineTo(b,c+i);return[l,o]},$:function(a,
b,c,d,e,f,g){this.xa(a,b,c,d,e,f);this.ya(a,b,c,d,g)},ya:function(a,b,c,d,e){if(this.e.yAxis){var f=c.x-0.5,g=d.y+0.5,i=c.y;this.i(a,f,g,f,i,this.e.yAxis.color,1);for(a=0;a<b.length;a++)this.renderTextAt("middle",0,0,i+e/2+a*e,this.e.yAxis.template(b[a]),"dhx_axis_item_y",c.x-5);this.oa(c,d)}},xa:function(a,b,c,d,e,f){var g,i={},j=this.e.xAxis;if(j){b=d.y+0.5;var k=c.x-0.5,h=d.x-0.5;this.i(a,k,b,h,b,j.color,1);if(j.step)g=parseFloat(j.step);if(typeof j.step=="undefined"||typeof j.start=="undefined"||
typeof j.end=="undefined"){i=this.V(e,f);e=i.start;f=i.end;g=i.step;this.e.xAxis.end=f;this.e.xAxis.start=e;this.e.xAxis.step=g}if(g!==0){for(var m=(h-k)*g/(f-e),l=0,n=e;n<=f;n+=g){if(i.fixNum)n=parseFloat((new Number(n)).toFixed(i.fixNum));var o=Math.floor(k+l*m)+0.5;n!=e&&j.lines&&this.i(a,o,b,o,c.y,this.e.xAxis.color,0.2);this.renderTextAt(false,true,o,b+2,j.template(n.toString()),"dhx_axis_item_x");l++}this.renderTextAt(true,false,k,d.y+this.e.padding.bottom-3,this.e.xAxis.title,"dhx_axis_title_x",
d.x-c.x);j.lines&&this.i(a,k,c.y-0.5,h,c.y-0.5,this.e.xAxis.color,0.2)}}}};
dhtmlx.chart.stackedBarH={pvt_render_stackedBarH:function(a,b,c,d,e,f){var g,i,j,k,h=d.x-c.x,m=!!this.e.yAxis;i=this.Q(b);g=i.max;i=i.min;var l=Math.floor((d.y-c.y)/b.length);e||this.$(a,b,c,d,i,g,l);if(m){g=parseFloat(this.e.xAxis.end);i=parseFloat(this.e.xAxis.start)}j=this.z(i,g);k=j[0];j=j[1];var n=k?h/k:10;if(!m){var o=10;n=k?(h-o)/k:10}k=parseInt(this.e.width,10);if(k+4>l)k=l-4;var s=Math.floor((l-k)/2),t=0,q=false,v=this.e.gradient;q=false;if(v=this.e.gradient)q=true;m||this.i(a,c.x-0.5,c.y,
c.x-0.5,d.y,"#000000",1);for(d=0;d<b.length;d++){if(!e)b[d].$startX=c.x;var p=parseFloat(this.e.value(b[d]));if(p>g)p=g;p-=i;p*=j;var u=c.x,r=c.y+s+d*l;if(e)u=b[d].$startX||u;if(p<0||this.e.yAxis&&p===0)this.renderTextAt("middle",true,u+10,r+k/2,this.e.label(b[d]));else{m||(p+=o/n);var w=this.e.color.call(this,b[d]);if(this.e.border){a.beginPath();a.fillStyle=w;this.o(a,u,r,k,t,n,p,0);a.lineTo(u,0);a.fill();a.fillStyle="#000000";a.globalAlpha=0.37;a.beginPath();this.o(a,u,r,k,t,n,p,0);a.fill()}a.globalAlpha=
1;a.globalAlpha=this.e.alpha.call(this,b[d]);a.fillStyle=this.e.color.call(this,b[d]);a.beginPath();var x=this.o(a,u,r,k,t,n,p,this.e.border?1:0);if(v&&!q)a.lineTo(c.x+h,r+(this.e.border?1:0));a.fill();if(q!=false){w=this.G(a,u,r+k,u,r,q,w,"x");a.fillStyle=w.gradient;a.beginPath();x=this.o(a,u,r,k,t,n,p,0);a.fill();a.globalAlpha=1}this.renderTextAt("middle",true,b[d].$startX+(x[0]-b[d].$startX)/2-1,r+(x[1]-r)/2,this.e.label(b[d]));f.addRect(b[d].id,[b[d].$startX,r,x[0],x[1]],e);b[d].$startX=x[0]}}}};
dhtmlx.chart.stackedBar={pvt_render_stackedBar:function(a,b,c,d,e,f){var g,i,j,k=d.y-c.y;j=!!this.e.yAxis;var h=!!this.e.xAxis;i=this.Q(b);g=i.max;i=i.min;var m=Math.floor((d.x-c.x)/b.length);e||this.N(a,b,c,d,i,g,m);if(j){g=parseFloat(this.e.yAxis.end);i=parseFloat(this.e.yAxis.start)}g=this.z(i,g);j=g[0];g=g[1];j=j?k/j:10;var l=parseInt(this.e.width,10);if(l+4>m)l=m-4;var n=Math.floor((m-l)/2),o=this.e.gradient?this.e.gradient:false;h||this.i(a,c.x,d.y+0.5,d.x,d.y+0.5,"#000000",1);for(h=0;h<b.length;h++){var s=
parseFloat(this.e.value(b[h]));if(s){e||(s-=i);s*=g;var t=c.x+n+h*m,q=d.y;if(e)q=b[h].$startY||q;if(!(q<c.y+1))if(s<0||this.e.yAxis&&s===0)this.renderTextAt(true,true,t+Math.floor(l/2),q,this.e.label(b[h]));else{var v=this.e.color.call(this,b[h]);if(this.e.border){a.beginPath();a.fillStyle=v;this.I(a,t-1,q,l+2,j,s,0,c.y);a.lineTo(t,q);a.fill();a.fillStyle="#000000";a.globalAlpha=0.37;a.beginPath();this.I(a,t-1,q,l+2,j,s,0,c.y);a.fill()}a.globalAlpha=this.e.alpha.call(this,b[h]);a.fillStyle=this.e.color.call(this,
b[h]);a.beginPath();var p=this.I(a,t,q,l,j,s,this.e.border?1:0,c.y);a.fill();a.globalAlpha=1;if(o){v=this.G(a,t,q,t+l,p[1],o,v,"y");a.fillStyle=v.gradient;a.beginPath();p=this.I(a,t+v.offset,q,l-v.offset*2,j,s,this.e.border?1:0,c.y);a.fill();a.globalAlpha=1}this.renderTextAt(false,true,t+Math.floor(l/2),p[1]+(q-p[1])/2-7,this.e.label(b[h]));f.addRect(b[h].id,[t,p[1],p[0],b[h].$startY||q],e);b[h].$startY=this.e.border?p[1]+1:p[1]}}}},I:function(a,b,c,d,e,f,g,i){a.moveTo(b,c);f=c-e*f+g;if(f<i)f=i;a.lineTo(b,
f);e=b+d;f=f;a.lineTo(e,f);var j=b+d;a.lineTo(j,c);a.lineTo(b,c);return[j,f-2*g]}};
dhtmlx.chart.line={pvt_render_line:function(a,b,c,d,e,f){e=this.C(a,b,c,d,e);var g=Math.floor(e.cellWidth/2);if(b.length)for(var i=this.p(b[0],c,d,e),j=this.e.offset?c.x+e.cellWidth*0.5:c.x,k=j,h=1;h<=b.length;h++){var m=Math.floor(e.cellWidth*h)-0.5+k;if(b.length!=h){var l=this.p(b[h],c,d,e);this.i(a,j,i,m,l,this.e.line.color(b[h-1]),this.e.line.width)}this.M(a,j,i,b[h-1],!!this.e.offset);f.addRect(b[h-1].id,[j-g,i-g,j+g,i+g]);i=l;j=m}},M:function(a,b,c,d,e){var f=parseInt(this.e.item.radius,10);
a.lineWidth=parseInt(this.e.item.borderWidth,10);a.fillStyle=this.e.item.color(d);a.strokeStyle=this.e.item.borderColor(d);a.beginPath();a.arc(b,c,f,0,Math.PI*2,true);a.fill();a.stroke();e&&this.renderTextAt(false,true,b,c-f-this.e.labelOffset,this.e.label(d))},p:function(a,b,c,d){var e=d.minValue,f=d.maxValue,g=d.unit,i=d.valueFactor;a=this.e.value(a);i=(parseFloat(a)-e)*i;this.e.yAxis||(i+=d.startValue/g);d=c.y-Math.floor(g*i);if(i<0)d=c.y;if(a>f)d=b.y;if(a<e)d=c.y;return d},C:function(a,b,c,d,
e){var f={};f.totalHeight=d.y-c.y;f.cellWidth=Math.round((d.x-c.x)/(!this.e.offset?b.length-1:b.length));var g=!!this.e.yAxis,i=this.e.view.indexOf("stacked")!=-1?this.Q(b):this.O();f.maxValue=i.max;f.minValue=i.min;e||this.N(a,b,c,d,f.minValue,f.maxValue,f.cellWidth);if(g){f.maxValue=parseFloat(this.e.yAxis.end);f.minValue=parseFloat(this.e.yAxis.start)}b=this.z(f.minValue,f.maxValue);a=b[0];f.valueFactor=b[1];f.unit=a?f.totalHeight/a:10;f.startValue=0;if(!g){f.startValue=f.unit>10?f.unit:10;f.unit=
a?(f.totalHeight-f.startValue)/a:10}return f}};
dhtmlx.chart.bar={pvt_render_bar:function(a,b,c,d,e,f){var g,i,j,k,h=d.y-c.y,m=!!this.e.yAxis,l=!!this.e.xAxis;i=this.O();g=i.max;i=i.min;var n=Math.floor((d.x-c.x)/b.length);!e&&!(this.e.origin!="auto"&&!m)&&this.N(a,b,c,d,i,g,n);if(m){g=parseFloat(this.e.yAxis.end);i=parseFloat(this.e.yAxis.start)}j=this.z(i,g);k=j[0];j=j[1];var o=k?h/k:k;if(!m&&!(this.e.origin!="auto"&&l)){var s=10;o=k?(h-s)/k:s}!e&&this.e.origin!="auto"&&!m&&this.e.origin>i&&this.da(a,b,c,d,n,d.y-o*(this.e.origin-i));h=parseInt(this.e.width,
10);if(this.h&&h*this.h.length+4>n)h=n/this.h.length-4;k=Math.floor((n-h*this.h.length)/2);var t=typeof this.e.radius!="undefined"?parseInt(this.e.radius,10):Math.round(h/5),q=false,v=this.e.gradient;if(v&&typeof v!="function"){q=v;v=false}else if(v){v=a.createLinearGradient(0,d.y,0,c.y);this.e.gradient(v)}l||this.i(a,c.x,d.y+0.5,d.x,d.y+0.5,"#000000",1);for(var p=0;p<b.length;p++){var u=parseFloat(this.e.value(b[p]));if(u>g)u=g;u-=i;u*=j;var r=c.x+k+p*n+(h+1)*e,w=d.y;if(u<0||this.e.yAxis&&u===0&&
!(this.e.origin!="auto"&&this.e.origin>i))this.renderTextAt(true,true,r+Math.floor(h/2),w,this.e.label(b[p]));else{if(!m&&!(this.e.origin!="auto"&&l))u+=s/o;var x=v||this.e.color.call(this,b[p]);this.e.border&&this.va(a,r,w,h,i,t,o,u,x);a.globalAlpha=this.e.alpha.call(this,b[p]);var y=this.ua(a,c,r,w,h,i,t,o,u,x,v,q);a.globalAlpha=1;q&&this.wa(a,r,w,h,i,t,o,u,x,q);y[0]!=r?this.renderTextAt(false,true,r+Math.floor(h/2),y[1],this.e.label(b[p])):this.renderTextAt(true,true,r+Math.floor(h/2),y[3],this.e.label(b[p]));
f.addRect(b[p].id,[r,y[3],y[2],y[1]],e)}}},K:function(a,b,c,d,e,f,g){var i=this.e.xAxis,j=c;if(i&&this.e.origin!="auto"&&this.e.origin>g){c-=(this.e.origin-g)*e;j=c;d-=this.e.origin-g;if(d<0){d*=-1;a.translate(b+f,c);a.rotate(Math.PI);c=b=0}c-=0.5}return{value:d,x0:b,y0:c,start:j}},ua:function(a,b,c,d,e,f,g,i,j,k,h,m){a.save();a.fillStyle=k;var l=this.K(a,c,d,j,i,e,f);e=this.H(a,l.x0,l.y0,e,g,i,l.value,this.e.border?1:0);if(h&&!m)a.lineTo(l.x0+(this.e.border?1:0),b.y);a.fill();a.restore();a=l.x0;
b=l.x0!=c?c+e[0]:e[0];d=l.x0!=c?l.start-e[1]:d;c=l.x0!=c?l.start:e[1];return[a,d,b,c]},va:function(a,b,c,d,e,f,g,i,j){a.save();b=this.K(a,b,c,i,g,d,e);a.fillStyle=j;this.H(a,b.x0,b.y0,d,f,g,b.value,0);a.lineTo(b.x0,0);a.fill();a.fillStyle="#000000";a.globalAlpha=0.37;this.H(a,b.x0,b.y0,d,f,g,b.value,0);a.fill();a.restore()},wa:function(a,b,c,d,e,f,g,i,j,k){a.save();b=this.K(a,b,c,i,g,d,e);j=this.G(a,b.x0,b.y0,b.x0+d,b.y0-g*b.value+2,k,j,"y");a.fillStyle=j.gradient;this.H(a,b.x0+j.offset,b.y0,d-j.offset*
2,f,g,b.value,j.offset);a.fill();a.restore()},H:function(a,b,c,d,e,f,g,i){a.beginPath();var j=0;if(e>f*g){var k=(e-f*g)/e;j=-Math.acos(k)+Math.PI/2}a.moveTo(b+i,c);var h=c-Math.floor(f*g)+e+(e?0:i);e<f*g&&a.lineTo(b+i,h);f=b+e;e&&a.arc(f,h,e-i,-Math.PI+j,-Math.PI/2,false);g=b+d-e-(e?0:i);f=h-e+(e?i:0);a.lineTo(g,f);h=h;e&&a.arc(g,h,e-i,-Math.PI/2,0-j,false);d=b+d-i;a.lineTo(d,c);a.lineTo(b+i,c);return[d,f]}};
dhtmlx.chart.pie={pvt_render_pie:function(a,b,c,d,e,f){this.na(a,b,c,d,1,f)},na:function(a,b,c,d,e,f){var g=0,i=this.Ga(c,d);c=this.e.radius?this.e.radius:i.radius;this.max(this.e.value);for(var j=[],k=[],h=0,m=0;m<b.length;m++)g+=parseFloat(this.e.value(b[m]));for(m=0;m<b.length;m++){k[m]=parseFloat(this.e.value(b[m]));j[m]=Math.PI*2*(g?(k[m]+h)/g:1/b.length);h+=k[m]}d=this.e.x?this.e.x:i.x;var l=this.e.y?this.e.y:i.y;e==1&&this.e.shadow&&this.sa(a,d,l,c);l/=e;var n=-Math.PI/2;a.scale(1,e);for(m=
0;m<b.length;m++)if(k[m]){a.lineWidth=2;a.beginPath();a.moveTo(d,l);alpha1=-Math.PI/2+j[m]-1.0E-4;a.arc(d,l,c,n,alpha1,false);a.lineTo(d,l);var o=this.e.color.call(this,b[m]);a.fillStyle=o;a.strokeStyle=this.e.lineColor(b[m]);a.stroke();a.fill();this.e.pieInnerText&&this.ba(d,l,5*c/6,n,alpha1,e,this.e.pieInnerText(b[m],g),true);this.e.label&&this.ba(d,l,c+this.e.labelOffset,n,alpha1,e,this.e.label(b[m]));if(e!=1){this.W(a,d,l,n,alpha1,c,true);a.fillStyle="#000000";a.globalAlpha=0.2;this.W(a,d,l,n,
alpha1,c,false);a.globalAlpha=1;a.fillStyle=o}f.addSector(b[m].id,n,alpha1,d,l,c,e);n=alpha1}if(this.e.gradient){b=e!=1?d+c/3:d;f=e!=1?l+c/3:l;this.bb(a,d,l,c,b,f)}a.scale(1,1/e)},Ga:function(a,b){var c=b.x-a.x,d=b.y-a.y;b=a.x+c/2;a=a.y+d/2;var e=Math.min(c/2,d/2);return{x:b,y:a,radius:e}},W:function(a,b,c,d,e,f,g){a.lineWidth=1;if(d<=0&&e>=0||d>=0&&e<=Math.PI||d<=Math.PI&&e>=Math.PI){if(d<=0&&e>=0){d=0;g=false;this.ca(a,b,c,f,d,e)}if(d<=Math.PI&&e>=Math.PI){e=Math.PI;g=false;this.ca(a,b,c,f,d,e)}var i=
(this.e.height||Math.floor(f/4))/this.e.cant;a.beginPath();a.arc(b,c,f,d,e,false);a.lineTo(b+f*Math.cos(e),c+f*Math.sin(e)+i);a.arc(b,c+i,f,e,d,true);a.lineTo(b+f*Math.cos(d),c+f*Math.sin(d));a.fill();g&&a.stroke()}},ca:function(a,b,c,d,e,f){a.beginPath();a.arc(b,c,d,e,f,false);a.stroke()},sa:function(a,b,c,d){for(var e=["#676767","#7b7b7b","#a0a0a0","#bcbcbc","#d1d1d1","#d6d6d6"],f=e.length-1;f>-1;f--){a.beginPath();a.fillStyle=e[f];a.arc(b+2,c+2,d+f,0,Math.PI*2,true);a.fill()}},Fa:function(a){a.addColorStop(0,
"#ffffff");a.addColorStop(0.7,"#7a7a7a");a.addColorStop(1,"#000000");return a},bb:function(a,b,c,d,e,f){a.globalAlpha=0.3;a.beginPath();var g;if(typeof this.e.gradient!="function"){g=a.createRadialGradient(e,f,d/4,b,c,d);g=this.Fa(g)}else g=this.e.gradient(g);a.fillStyle=g;a.arc(b,c,d,0,Math.PI*2,true);a.fill();a.globalAlpha=1},ba:function(a,b,c,d,e,f,g,i){var j=this.renderText(0,0,g,0,1);if(j){var k=j.scrollWidth;j.style.width=k+"px";if(k>a)k=a;var h=8;if(i)h=k/1.8;var m=d+(e-d)/2;c-=(h-8)/2;var l=
-h,n=-8,o="left";if(m>=Math.PI/2&&m<Math.PI){l=-k-l+1;o="right"}if(m<=3*Math.PI/2&&m>=Math.PI){l=-k-l+1;o="right"}d=(b+Math.floor(c*Math.sin(m)))*f+n;h=a+Math.floor((c+h/2)*Math.cos(m))+l;var s=e<Math.PI/2+0.01,t=m<Math.PI/2;if(t&&s)h=Math.max(h,a+3);else if(!t&&!s)h=Math.min(h,a-k);if(!i&&f<1&&d>b*f)d+=this.e.height||Math.floor(c/4);j.style.top=d+"px";j.style.left=h+"px";j.style.width=k+"px";j.style.textAlign=o;j.style.whiteSpace="nowrap"}}};
dhtmlx.chart.pie3D={pvt_render_pie3D:function(a,b,c,d,e,f){this.na(a,b,c,d,this.e.cant,f)}};
dhtmlx.Template={J:{},empty:function(){return""},setter:function(a,b){return dhtmlx.Template.fromHTML(b)},obj_setter:function(a,b){var c=dhtmlx.Template.setter(a,b),d=this;return function(){return c.apply(d,arguments)}},fromHTML:function(a){if(typeof a=="function")return a;if(this.J[a])return this.J[a];a=(a||"").toString();a=a.replace(/[\r\n]+/g,"\\n");a=a.replace(/\{obj\.([^}?]+)\?([^:]*):([^}]*)\}/g,'"+(obj.$1?"$2":"$3")+"');a=a.replace(/\{common\.([^}\(]*)\}/g,'"+common.$1+"');a=a.replace(/\{common\.([^\}\(]*)\(\)\}/g,
'"+(common.$1?common.$1(obj):"")+"');a=a.replace(/\{obj\.([^}]*)\}/g,'"+obj.$1+"');a=a.replace(/#([a-z0-9_]+)#/gi,'"+obj.$1+"');a=a.replace(/\{obj\}/g,'"+obj+"');a=a.replace(/\{-obj/g,"{obj");a=a.replace(/\{-common/g,"{common");a='return "'+a+'";';return this.J[a]=Function("obj","common",a)}};
dhtmlx.Type={add:function(a,b){if(!a.types&&a.prototype.types)a=a.prototype;var c=b.name||"default";this.T(b);this.T(b,"edit");this.T(b,"loading");a.types[c]=dhtmlx.extend(dhtmlx.extend({},a.types[c]||this.ta),b);return c},ta:{css:"default",template:function(){return""},template_edit:function(){return""},template_loading:function(){return"..."},width:150,height:80,margin:5,padding:0},T:function(a,b){b="template"+(b?"_"+b:"");var c=a[b];if(c&&typeof c=="string"){if(c.indexOf("->")!=-1){c=c.split("->");
switch(c[0]){case "html":c=dhtmlx.html.getValue(c[1]).replace(/\"/g,'\\"');break;case "http":c=(new dhtmlx.ajax).sync().get(c[1],{uid:(new Date).valueOf()}).responseText;break;default:break}}a[b]=dhtmlx.Template.fromHTML(c)}}};
dhtmlx.SingleRender={k:function(){},eb:function(a){return this.type.Oa(a,this.type)+this.type.template(a,this.type)+this.type.Na},render:function(){if(!this.callEvent||this.callEvent("onBeforeRender",[this.data])){if(this.data)this.L.innerHTML=this.eb(this.data);this.callEvent&&this.callEvent("onAfterRender",[])}}};
dhtmlx.ui.Tooltip=function(a){this.name="Tooltip";this.version="3.0";if(typeof a=="string")a={template:a};dhtmlx.extend(this,dhtmlx.Settings);dhtmlx.extend(this,dhtmlx.SingleRender);this.B(a,{type:"default",dy:0,dx:20});this.L=this.g=document.createElement("DIV");this.g.className="dhx_tooltip";dhtmlx.html.insertBefore(this.g,document.body.firstChild)};
dhtmlx.ui.Tooltip.prototype={show:function(a,b){if(!this.Z){if(this.data!=a){this.data=a;this.render(a)}this.g.style.top=b.y+this.e.dy+"px";this.g.style.left=b.x+this.e.dx+"px";this.g.style.display="block"}},hide:function(){this.data=null;this.g.style.display="none"},disable:function(){this.Z=true},enable:function(){this.Z=false},types:{"default":dhtmlx.Template.fromHTML("{obj.id}")},template_item_start:dhtmlx.Template.empty,template_item_end:dhtmlx.Template.empty};
dhtmlx.AutoTooltip={tooltip_setter:function(a,b){var c=new dhtmlx.ui.Tooltip(b);this.attachEvent("onMouseMove",function(d,e){c.show(this.get(d),dhtmlx.html.pos(e))});this.attachEvent("onMouseOut",function(){c.hide()});this.attachEvent("onMouseMoving",function(){c.hide()});return c}};dhtmlx.DataStore=function(){this.name="DataStore";dhtmlx.extend(this,dhtmlx.EventSystem);this.setDriver("xml");this.pull={};this.order=dhtmlx.toArray();this.gb=false};
dhtmlx.DataStore.prototype={setDriver:function(a){this.driver=dhtmlx.DataDriver[a]},qa:function(a){if(a.item){if(!(a.item instanceof Array))a.item=[a.item];for(var b=0;b<a.item.length;b++){var c=a.item[b],d=this.id(c);a.item[b]=d;this.pull[d]=c;c.parent=a.id;c.level=a.level+1;this.qa(c)}}},Wa:function(a){for(var b=this.driver.getInfo(a),c=this.driver.getRecords(a),d=(b.u||0)*1,e=0,f=0;f<c.length;f++){var g=this.driver.getDetails(c[f]),i=this.id(g);if(!this.pull[i]){this.order[e+d]=i;e++}this.pull[i]=
g;if(this.gb){g.level=1;this.qa(g)}}for(f=0;f<b.w;f++)if(!this.order[f]){i=dhtmlx.uid();g={id:i,$template:"loading"};this.pull[i]=g;this.order[f]=i}this.callEvent("onStoreLoad",[this.driver,a]);this.refresh()},id:function(a){return a.id||(a.id=dhtmlx.uid())},get:function(a){return this.pull[a]},set:function(a,b){this.pull[a]=b;this.refresh()},refresh:function(a){a?this.callEvent("onStoreUpdated",[a,this.pull[a],"update"]):this.callEvent("onStoreUpdated",[null,null,null])},getRange:function(a,b){if(arguments.length){a=
this.indexById(a);b=this.indexById(b);if(a>b){var c=b;b=a;a=c}}else{a=this.min||0;b=Math.min(this.max||Infinity,this.dataCount()-1)}return this.getIndexRange(a,b)},getIndexRange:function(a,b){b=Math.min(b,this.dataCount()-1);var c=dhtmlx.toArray();for(a=a;a<=b;a++)c.push(this.get(this.order[a]));return c},dataCount:function(){return this.order.length},exists:function(a){return!!this.pull[a]},move:function(a,b){if(!(a<0||b<0)){var c=this.idByIndex(a),d=this.get(c);this.order.removeAt(a);this.order.insertAt(c,
Math.min(this.order.length,b));this.callEvent("onStoreUpdated",[c,d,"move"])}},add:function(a,b){var c=this.id(a),d=this.dataCount();if(dhtmlx.isNotDefined(b)||b<0)b=d;if(b>d)b=Math.min(this.order.length,b);if(this.callEvent("onbeforeAdd",[c,b])){if(this.exists(c))return null;this.pull[c]=a;this.order.insertAt(c,b);if(this.m){var e=this.m.length;if(!b&&this.order.length)e=0;this.m.insertAt(c,e)}this.callEvent("onafterAdd",[c,b]);this.callEvent("onStoreUpdated",[c,a,"add"]);return c}},remove:function(a){if(a instanceof
Array)for(var b=0;b<a.length;b++)this.remove(a[b]);else if(this.callEvent("onbeforedelete",[a])){if(!this.exists(a))return null;b=this.get(a);this.order.remove(a);this.m&&this.m.remove(a);delete this.pull[a];this.callEvent("onafterdelete",[a]);this.callEvent("onStoreUpdated",[a,b,"delete"])}},clearAll:function(){this.pull={};this.order=dhtmlx.toArray();this.m=null;this.callEvent("onClearAll",[]);this.refresh()},idByIndex:function(a){return this.order[a]},indexById:function(a){return a=this.order.find(a)},
next:function(a,b){return this.order[this.indexById(a)+(b||1)]},first:function(){return this.order[0]},last:function(){return this.order[this.order.length-1]},previous:function(a,b){return this.order[this.indexById(a)-(b||1)]},sort:function(a,b,c){var d=a;if(typeof a=="function")d={as:a,dir:b};else if(typeof a=="string")d={by:a,dir:b,as:c};var e=[d.by,d.dir,d.as];if(this.callEvent("onbeforesort",e)){if(this.order.length){var f=dhtmlx.sort.create(d),g=this.getRange(this.first(),this.last());g.sort(f);
this.order=g.map(function(i){return this.id(i)},this)}this.refresh();this.callEvent("onaftersort",e)}},filter:function(a,b){if(this.m){this.order=this.m;delete this.m}if(a){var c=a;if(typeof a=="string"){a=dhtmlx.Template.setter(0,a);c=function(e,f){return a(e).toLowerCase().indexOf(f)!=-1}}b=(b||"").toString().toLowerCase();var d=dhtmlx.toArray();this.order.each(function(e){c(this.get(e),b)&&d.push(e)},this);this.m=this.order;this.order=d}this.refresh()},each:function(a,b){for(var c=0;c<this.order.length;c++)a.call(b||
this,this.get(this.order[c]))},provideApi:function(a,b){b&&this.mapEvent({onbeforesort:a,onaftersort:a,onbeforeadd:a,onafteradd:a,onbeforedelete:a,onafterdelete:a});for(var c=["sort","add","remove","exists","idByIndex","indexById","get","set","refresh","dataCount","filter","next","previous","clearAll","first","last"],d=0;d<c.length;d++)a[c[d]]=dhtmlx.methodPush(this,c[d])}};
dhtmlx.sort={create:function(a){return dhtmlx.sort.dir(a.dir,dhtmlx.sort.by(a.by,a.as))},as:{"int":function(a,b){a*=1;b*=1;return a>b?1:a<b?-1:0},string_strict:function(a,b){a=a.toString();b=b.toString();return a>b?1:a<b?-1:0},string:function(a,b){a=a.toString().toLowerCase();b=b.toString().toLowerCase();return a>b?1:a<b?-1:0}},by:function(a,b){if(typeof b!="function")b=dhtmlx.sort.as[b||"string"];a=dhtmlx.Template.setter(0,a);return function(c,d){return b(a(c),a(d))}},dir:function(a,b){if(a=="asc")return b;
return function(c,d){return b(c,d)*-1}}};
dhtmlx.Group={k:function(){this.data.attachEvent("onStoreLoad",dhtmlx.bind(function(){this.e.group&&this.group(this.e.group,false)},this));this.attachEvent("onBeforeRender",dhtmlx.bind(function(a){if(this.e.sort){a.block();a.sort(this.e.sort);a.unblock()}},this));this.attachEvent("onBeforeSort",dhtmlx.bind(function(){this.e.sort=null},this))},Ja:function(a,b){a.attachEvent("onClearAll",dhtmlx.bind(function(){this.ungroup(false)},b))},sum:function(a,b){a=dhtmlx.Template.setter(0,a);b=b||this.data;
var c=0;b.each(function(d){c+=a(d)*1});return c},min:function(a,b){a=dhtmlx.Template.setter(0,a);b=b||this.data;var c=Infinity;b.each(function(d){if(a(d)*1<c)c=a(d)*1});return c*1},max:function(a,b){a=dhtmlx.Template.setter(0,a);b=b||this.data;var c=-Infinity;b.each(function(d){if(a(d)*1>c)c=a(d)*1});return c},cb:function(a){var b=function(j,k){j=dhtmlx.Template.setter(0,j);return j(k[0])},c=dhtmlx.Template.setter(0,a.by);a.map[c]||(a.map[c]=[c,b]);var d={},e=[];this.data.each(function(j){var k=c(j);
if(!d[k]){e.push({id:k});d[k]=dhtmlx.toArray()}d[k].push(j)});for(var f in a.map){var g=a.map[f][1]||b;if(typeof g!="function")g=this[g];for(var i=0;i<e.length;i++)e[i][f]=g.call(this,a.map[f][0],d[e[i].id])}this.ja=this.data;this.data=new dhtmlx.DataStore;this.data.provideApi(this,true);this.Ja(this.data,this);this.parse(e,"json")},group:function(a,b){this.ungroup(false);this.cb(a);b!==false&&this.render()},ungroup:function(a){if(this.ja){this.data=this.ja;this.data.provideApi(this,true)}a!==false&&
this.render()},group_setter:function(a,b){return b},sort_setter:function(a,b){if(typeof b!="object")b={by:b};this.n(b,{as:"string",dir:"asc"});return b}};dhtmlx.KeyEvents={k:function(){dhtmlx.event(this.g,"keypress",this.Ta,this)},Ta:function(a){a=a||event;var b=a.which||a.keyCode;this.callEvent(this.hb?"onEditKeyPress":"onKeyPress",[b,a.ctrlKey,a.shiftKey,a])}};
dhtmlx.MouseEvents={k:function(){if(this.on_click){dhtmlx.event(this.g,"click",this.Qa,this);dhtmlx.event(this.g,"contextmenu",this.Ra,this)}this.on_dblclick&&dhtmlx.event(this.g,"dblclick",this.Sa,this);if(this.on_mouse_move){dhtmlx.event(this.g,"mousemove",this.la,this);dhtmlx.event(this.g,dhtmlx.r?"mouseleave":"mouseout",this.la,this)}},Qa:function(a){return this.R(a,this.on_click,"ItemClick")},Sa:function(a){return this.R(a,this.on_dblclick,"ItemDblClick")},Ra:function(a){var b=dhtmlx.html.locate(a,
this.q);if(b&&!this.callEvent("onBeforeContextMenu",[b,a]))return dhtmlx.html.preventEvent(a)},la:function(a){if(dhtmlx.r)a=document.createEventObject(event);this.ia&&window.clearTimeout(this.ia);this.callEvent("onMouseMoving",[a]);this.ia=window.setTimeout(dhtmlx.bind(function(){a.type=="mousemove"?this.Ua(a):this.Va(a)},this),500)},Ua:function(a){this.R(a,this.on_mouse_move,"MouseMove")||this.callEvent("onMouseOut",[a||event])},Va:function(a){this.callEvent("onMouseOut",[a||event])},R:function(a,
b,c){a=a||event;for(var d=a.target||a.srcElement,e="",f=null,g=false;d&&d.parentNode;){if(!g&&d.getAttribute)if(f=d.getAttribute(this.q)){d.getAttribute("userdata")&&this.callEvent("onLocateData",[f,d]);if(!this.callEvent("on"+c,[f,a,d]))return;g=true}if(e=d.className){e=e.split(" ");e=e[0]||e[1];if(b[e])return b[e].call(this,a,f,d)}d=d.parentNode}return g}};
dhtmlx.Settings={k:function(){this.e=this.config={}},define:function(a,b){if(typeof a=="object")return this.ma(a);return this.Y(a,b)},Y:function(a,b){var c=this[a+"_setter"];return this.e[a]=c?c.call(this,a,b):b},ma:function(a){if(a)for(var b in a)this.Y(b,a[b])},B:function(a,b){var c=dhtmlx.extend({},b);typeof a=="object"&&!a.tagName&&dhtmlx.extend(c,a);this.ma(c)},n:function(a,b){for(var c in b)switch(typeof a[c]){case "object":a[c]=this.n(a[c]||{},b[c]);break;case "undefined":a[c]=b[c];break;default:break}return a},
Xa:function(a,b,c){if(typeof a=="object"&&!a.tagName)a=a.container;this.g=dhtmlx.toNode(a);if(!this.g&&c)this.g=c(a);this.g.className+=" "+b;this.g.onselectstart=function(){return false};this.L=this.g},ab:function(a){if(typeof a=="object")return this.type_setter("type",a);this.type=dhtmlx.extend({},this.types[a]);this.customize()},customize:function(a){a&&dhtmlx.extend(this.type,a);this.type.Oa=dhtmlx.Template.fromHTML(this.template_item_start(this.type));this.type.Na=this.template_item_end(this.type);
this.render()},type_setter:function(a,b){this.ab(typeof b=="object"?dhtmlx.Type.add(this,b):b);return b},template_setter:function(a,b){return this.type_setter("type",{template:b})},css_setter:function(a,b){this.g.className+=" "+b;return b}};dhtmlx.compat=function(a,b){dhtmlx.compat[a]&&dhtmlx.compat[a](b)};
(function(){if(!window.dhtmlxError){var a=function(){};window.dhtmlxError={catchError:a,throwError:a};window.convertStringToBoolean=function(c){return!!c};window.dhtmlxEventable=function(c){dhtmlx.extend(c,dhtmlx.EventSystem)};var b={getXMLTopNode:function(){},doXPath:function(c){return dhtmlx.DataDriver.xml.xpath(this.xml,c)},xmlDoc:{responseXML:true}};dhtmlx.compat.dataProcessor=function(c){var d="_sendData",e="_in_progress",f="_tMode",g="_waitMode";c[d]=function(i,j){if(i){if(j)this[e][j]=(new Date).valueOf();
if(!this.callEvent("onBeforeDataSending",j?[j,this.getState(j)]:[]))return false;var k=this,h=this.serverProcessor;this[f]!="POST"?dhtmlx.ajax().get(h+(h.indexOf("?")!=-1?"&":"?")+this.serialize(i,j),"",function(m,l){b.xml=dhtmlx.DataDriver.xml.checkResponse(m,l);k.afterUpdate(k,null,null,null,b)}):dhtmlx.ajax().post(h,this.serialize(i,j),function(m,l){b.xml=dhtmlx.DataDriver.xml.checkResponse(m,l);k.afterUpdate(k,null,null,null,b)});this[g]++}}}}})();if(!dhtmlx.attaches)dhtmlx.attaches={};
dhtmlx.attaches.attachAbstract=function(a,b){var c=document.createElement("DIV");c.id="CustomObject_"+dhtmlx.uid();c.style.width="100%";c.style.height="100%";c.cmp="grid";document.body.appendChild(c);this.attachObject(c.id);b.container=c.id;var d=this.vs[this.av];d.grid=new window[a](b);d.gridId=c.id;d.gridObj=c;d.grid.setSizes=function(){this.resize?this.resize():this.render()};var e="_viewRestore";return this.vs[this[e]()].grid};
dhtmlx.attaches.attachDataView=function(a){return this.attachAbstract("dhtmlXDataView",a)};dhtmlx.attaches.attachChart=function(a){return this.attachAbstract("dhtmlXChart",a)};dhtmlx.compat.layout=function(){};dhtmlx.ajax=function(a,b,c){if(arguments.length!==0){var d=new dhtmlx.ajax;if(c)d.master=c;d.get(a,null,b)}if(!this.getXHR)return new dhtmlx.ajax;return this};
dhtmlx.ajax.prototype={getXHR:function(){return dhtmlx.r?new ActiveXObject("Microsoft.xmlHTTP"):new XMLHttpRequest},send:function(a,b,c){var d=this.getXHR();if(typeof c=="function")c=[c];if(typeof b=="object"){var e=[];for(var f in b)e.push(f+"="+encodeURIComponent(b[f]));b=e.join("&")}if(b&&!this.post){a=a+(a.indexOf("?")!=-1?"&":"?")+b;b=null}d.open(this.post?"POST":"GET",a,!this.pa);this.post&&d.setRequestHeader("Content-type","application/x-www-form-urlencoded");if(!this.pa){var g=this;d.onreadystatechange=
function(){if(!d.readyState||d.readyState==4){if(c&&g)for(var i=0;i<c.length;i++)if(c[i])c[i].call(g.master||g,d.responseText,d.responseXML,d);c=d=g=g.master=null}}}d.send(b||null);return d},get:function(a,b,c){this.post=false;return this.send(a,b,c)},post:function(a,b,c){this.post=true;return this.send(a,b,c)},sync:function(){this.pa=true;return this}};
dhtmlx.DataLoader={k:function(){this.data=new dhtmlx.DataStore},load:function(a,b,c){this.callEvent("onXLS",[]);if(typeof b=="string"){this.data.setDriver(b);b=c}if(!this.data.feed)this.data.feed=function(d,e){if(this.F)return this.F=[d,e];else this.F=true;this.load(a+(a.indexOf("?")==-1?"?":"&")+"posStart="+d+"&count="+e,function(){var f=this.F;this.F=false;typeof f=="object"&&this.data.feed.apply(this,f)})};dhtmlx.ajax(a,[this.ka,b],this)},parse:function(a,b){this.callEvent("onXLS",[]);b&&this.data.setDriver(b);
this.ka(a,null)},ka:function(a,b){this.data.Wa(this.data.driver.toObject(a,b));this.callEvent("onXLE",[])}};dhtmlx.DataDriver={};dhtmlx.DataDriver.json={toObject:function(a){if(typeof a=="string"){eval("dhtmlx.temp="+a);return dhtmlx.temp}return a},getRecords:function(a){if(a&&!(a instanceof Array))return[a];return a},getDetails:function(a){return a},getInfo:function(a){return{w:a.total_count||0,u:a.pos||0}}};
dhtmlx.DataDriver.html={toObject:function(a){if(typeof a=="string"){var b=null;if(a.indexOf("<")==-1)b=dhtmlx.toNode(a);if(!b){b=document.createElement("DIV");b.innerHTML=a}return b.getElementsByTagName(this.tag)}return a},getRecords:function(a){if(a.tagName)return a.childNodes;return a},getDetails:function(a){return dhtmlx.DataDriver.xml.tagToObject(a)},getInfo:function(){return{w:0,u:0}},tag:"LI"};
dhtmlx.DataDriver.jsarray={toObject:function(a){if(typeof a=="string"){eval("dhtmlx.temp="+a);return dhtmlx.temp}return a},getRecords:function(a){return a},getDetails:function(a){for(var b={},c=0;c<a.length;c++)b["data"+c]=a[c];return b},getInfo:function(){return{w:0,u:0}}};
dhtmlx.DataDriver.csv={toObject:function(a){return a},getRecords:function(a){return a.split(this.row)},getDetails:function(a){a=this.stringToArray(a);for(var b={},c=0;c<a.length;c++)b["data"+c]=a[c];return b},getInfo:function(){return{w:0,u:0}},stringToArray:function(a){a=a.split(this.cell);for(var b=0;b<a.length;b++)a[b]=a[b].replace(/^[ \t\n\r]*(\"|)/g,"").replace(/(\"|)[ \t\n\r]*$/g,"");return a},row:"\n",cell:","};
dhtmlx.DataDriver.xml={toObject:function(a,b){if(b&&(b=this.checkResponse(a,b)))return b;if(typeof a=="string")return this.fromString(a);return a},getRecords:function(a){return this.xpath(a,this.records)},records:"/*/item",userdata:"/*/userdata",getDetails:function(a){return this.tagToObject(a,{})},getUserData:function(a,b){b=b||{};var c=this.xpath(a,this.userdata);for(a=0;a<c.length;a++){var d=this.tagToObject(c[a]);b[d.name]=d.value}return b},getInfo:function(a){return{w:a.documentElement.getAttribute("total_count")||
0,u:a.documentElement.getAttribute("pos")||0}},xpath:function(a,b){if(window.XPathResult){var c=a;if(a.nodeName.indexOf("document")==-1)a=a.ownerDocument;var d=[];a=a.evaluate(b,c,null,XPathResult.ANY_TYPE,null);for(b=a.iterateNext();b;){d.push(b);b=a.iterateNext()}return d}return a.selectNodes(b)},tagToObject:function(a,b){b=b||{};for(var c=a.attributes,d=0;d<c.length;d++)b[c[d].name]=c[d].value;var e=false,f=a.childNodes;for(d=0;d<f.length;d++)if(f[d].nodeType==1){var g=f[d].tagName;if(typeof b[g]!=
"undefined"){b[g]instanceof Array||(b[g]=[b[g]]);b[g].push(this.tagToObject(f[d],{}))}else b[f[d].tagName]=this.tagToObject(f[d],{});e=true}if(!c.length&&!e)return this.nodeValue(a);b.value=this.nodeValue(a);return b},nodeValue:function(a){if(a.firstChild)return a.firstChild.data;return""},fromString:function(a){if(window.DOMParser)return(new DOMParser).parseFromString(a,"text/xml");if(window.ActiveXObject){temp=new ActiveXObject("Microsoft.xmlDOM");temp.loadXML(a);return temp}},checkResponse:function(a,
b){if(b&&b.firstChild&&b.firstChild.tagName!="parsererror")return b;if(a=this.from_string(a.responseText.replace(/^[\s]+/,"")))return a}};dhtmlx.DataDriver.dhtmlxgrid={Ia:"_get_cell_value",toObject:function(a){return this.ea=a},getRecords:function(a){return a.rowsBuffer},getDetails:function(a){for(var b={},c=0;c<this.ea.getColumnsNum();c++)b["data"+c]=this.ea[this.Ia](a,c);return b},getInfo:function(){return{w:0,u:0}}};
dhtmlx.Canvas={k:function(){this.D=[]},Ya:function(a){this.l=dhtmlx.html.create("canvas",{width:a.offsetWidth,height:a.offsetHeight});a.appendChild(this.l);if(!this.l.getContext)if(dhtmlx.r){dhtmlx.require("thirdparty/excanvas/excanvas.js");G_vmlCanvasManager.init_(document);G_vmlCanvasManager.initElement(this.l)}return this.l},getCanvas:function(a){return(this.l||this.Ya(this.g)).getContext(a||"2d")},$a:function(){if(this.l){this.l.setAttribute("width",this.l.parentNode.offsetWidth);this.l.setAttribute("height",
this.l.parentNode.offsetHeight)}},renderText:function(a,b,c,d,e){if(c){a=dhtmlx.html.create("DIV",{"class":"dhx_canvas_text"+(d?" "+d:""),style:"left:"+a+"px; top:"+b+"px;"},c);this.g.appendChild(a);this.D.push(a);if(e)a.style.width=e+"px";return a}},renderTextAt:function(a,b,c,d,e,f,g){if(e=this.renderText.call(this,c,d,e,f,g)){if(a)e.style.top=a=="middle"?parseInt(d-e.offsetHeight/2,10)+"px":d-e.offsetHeight+"px";if(b)e.style.left=b=="left"?c-e.offsetWidth+"px":parseInt(c-e.offsetWidth/2,10)+"px"}return e},
clearCanvas:function(){for(var a=0;a<this.D.length;a++)this.g.removeChild(this.D[a]);this.D=[];if(this.g.v){this.g.v.parentNode.removeChild(this.g.v);this.g.v=null}this.getCanvas().clearRect(0,0,this.l.offsetWidth,this.l.offsetHeight)}};
dhtmlXChart=function(a){this.name="Chart";this.version="3.0";dhtmlx.extend(this,dhtmlx.Settings);this.Xa(a,"dhx_chart");dhtmlx.extend(this,dhtmlx.DataLoader);this.data.provideApi(this,true);dhtmlx.extend(this,dhtmlx.EventSystem);dhtmlx.extend(this,dhtmlx.MouseEvents);dhtmlx.extend(this,dhtmlx.Destruction);dhtmlx.extend(this,dhtmlx.Canvas);dhtmlx.extend(this,dhtmlx.Group);dhtmlx.extend(this,dhtmlx.AutoTooltip);for(var b in dhtmlx.chart)dhtmlx.extend(this,dhtmlx.chart[b]);this.B(a,{color:"RAINBOW",
alpha:"1",label:false,value:"{obj.value}",padding:{},view:"pie",lineColor:"#ffffff",cant:0.5,width:15,labelWidth:100,line:{},item:{},shadow:true,gradient:false,border:true,labelOffset:20,origin:"auto"});this.h=[this.e];this.data.attachEvent("onStoreUpdated",dhtmlx.bind(function(){this.render()},this));this.attachEvent("onLocateData",this.db)};
dhtmlXChart.prototype={q:"dhx_area_id",on_click:{},on_dblclick:{},on_mouse_move:{},resize:function(){this.$a();this.render()},view_setter:function(a,b){if(typeof this.e.offset=="undefined")this.e.offset=b=="area"||b=="stackedArea"?false:true;return b},render:function(){if(this.callEvent("onBeforeRender",[this.data])){this.clearCanvas();this.e.legend&&this.za(this.getCanvas(),this.data.getRange(),this.g.offsetWidth,this.g.offsetHeight);for(var a=this.Ea(this.g.offsetWidth,this.g.offsetHeight),b=new dhtmlx.ui.Map(this.q),
c=this.e,d=0;d<this.h.length;d++){this.e=this.h[d];this["pvt_render_"+this.e.view](this.getCanvas(),this.data.getRange(),a.start,a.end,d,b)}b.render(this.g);this.e=c}},value_setter:dhtmlx.Template.obj_setter,alpha_setter:dhtmlx.Template.obj_setter,label_setter:dhtmlx.Template.obj_setter,lineColor_setter:dhtmlx.Template.obj_setter,pieInnerText_setter:dhtmlx.Template.obj_setter,gradient_setter:function(a,b){if(typeof b!="function"&&b&&(b===true||b!="3d"))b="light";return b},colormap:{RAINBOW:function(a){a=
Math.floor(this.indexById(a.id)/this.dataCount()*1536);if(a==1536)a-=1;return this.Za[Math.floor(a/256)](a%256)}},color_setter:function(a,b){return this.colormap[b]||dhtmlx.Template.obj_setter(a,b)},legend_setter:function(a,b){if(typeof b!="object")b={template:b};this.n(b,{width:150,height:18,layout:"y",align:"left",valign:"bottom",template:"",marker:{type:"square",width:25,height:15}});b.template=dhtmlx.Template.setter(0,b.template);return b},item_setter:function(a,b){if(typeof b!="object")b={color:b,
borderColor:b};this.n(b,{radius:4,color:"#000000",borderColor:"#000000",borderWidth:2});b.color=dhtmlx.Template.setter(0,b.color);b.borderColor=dhtmlx.Template.setter(0,b.borderColor);return b},line_setter:function(a,b){if(typeof b!="object")b={color:b};this.n(b,{width:3,color:"#d4d4d4"});b.color=dhtmlx.Template.setter(0,b.color);return b},padding_setter:function(a,b){if(typeof b!="object")b={left:b,right:b,top:b,bottom:b};this.n(b,{left:50,right:20,top:35,bottom:40});return b},xAxis_setter:function(a,
b){if(!b)return false;if(typeof b!="object")b={template:b};this.n(b,{title:"",color:"#000000",template:"{obj}",lines:false});if(b.template)b.template=dhtmlx.Template.setter(0,b.template);return b},yAxis_setter:function(a,b){this.n(b,{title:"",color:"#000000",template:"{obj}",lines:true});if(b.template)b.template=dhtmlx.Template.setter(0,b.template);return b},N:function(a,b,c,d,e,f,g){e=this.Da(a,b,c,d,e,f);this.da(a,b,c,d,g,e);return e},da:function(a,b,c,d,e,f){if(this.e.xAxis){var g=c.x-0.5;f=parseInt(f?
f:d.y,10)+0.5;var i=d.x,j,k=true;this.i(a,g,f,i,f,this.e.xAxis.color,1);for(var h=0;h<b.length;h++){if(this.e.offset===true)j=g+e/2+h*e;else{j=g+h*e;k=!!h}var m=this.e.origin!="auto"&&this.e.view=="bar"&&parseFloat(this.e.value(b[h]))<this.e.origin;this.Ba(j,f,b[h],k,m);this.e.view_setter!="bar"&&this.Ca(a,j,d.y,c.y)}this.renderTextAt(true,false,g,d.y+this.e.padding.bottom-3,this.e.xAxis.title,"dhx_axis_title_x",d.x-c.x);this.e.xAxis.lines&&this.e.offset&&this.i(a,i+0.5,d.y,i+0.5,c.y+0.5,this.e.xAxis.color,
0.2)}},Da:function(a,b,c,d,e,f){var g;b={};if(this.e.yAxis){var i=c.x-0.5,j=d.y,k=c.y,h=d.y;this.i(a,i,j,i,k,this.e.yAxis.color,1);if(this.e.yAxis.step)g=parseFloat(this.e.yAxis.step);if(typeof this.e.yAxis.step=="undefined"||typeof this.e.yAxis.start=="undefined"||typeof this.e.yAxis.end=="undefined"){b=this.V(e,f);e=b.start;f=b.end;g=b.step;this.e.yAxis.end=f;this.e.yAxis.start=e}if(g!==0){k=(j-k)*g/(f-e);for(var m=0,l=e;l<=f;l+=g){if(b.fixNum)l=parseFloat((new Number(l)).toFixed(b.fixNum));var n=
Math.floor(j-m*k)+0.5;!(l==e&&this.e.origin=="auto")&&this.e.yAxis.lines&&this.i(a,i,n,d.x,n,this.e.yAxis.color,0.2);if(l==this.e.origin)h=n;this.renderText(0,n-5,this.e.yAxis.template(l.toString()),"dhx_axis_item_y",c.x-5);m++}this.oa(c,d);return h}}},oa:function(a,b){if(a=this.renderTextAt("middle",false,0,parseInt((b.y-a.y)/2+a.y,10),this.e.yAxis.title,"dhx_axis_title_y"))a.style.left=(dhtmlx.env.transform?(a.offsetHeight-a.offsetWidth)/2:0)+"px"},V:function(a,b){if(this.e.origin!="auto"&&this.e.origin<
a)a=this.e.origin;var c,d,e;c=(b-a)/8||1;var f=Math.floor(this.ga(c)),g=Math.pow(10,f),i=c/g;i=i>5?10:5;c=parseInt(i,10)*g;if(c>Math.abs(a))d=a<0?-c:0;else{var j=Math.abs(a),k=Math.floor(this.ga(j)),h=j/Math.pow(10,k);d=Math.ceil(h*10)/10*Math.pow(10,k)-c;if(a<0)d=-d-2*c}for(e=d;e<b;){e+=c;e=parseFloat((new Number(e)).toFixed(Math.abs(f)))}return{start:d,end:e,step:c,fixNum:Math.abs(f)}},O:function(a){var b,c;if((c=arguments.length&&a=="h"?this.e.xAxis:this.e.yAxis)&&typeof c.end!="undefied"&&typeof c.start!=
"undefied"&&c.step){b=parseFloat(c.end);c=parseFloat(c.start)}else{b=this.max(this.h[0].value);c=this.min(this.h[0].value);if(this.h.length>1)for(var d=1;d<this.h.length;d++){var e=this.max(this.h[d].value),f=this.min(this.h[d].value);if(e>b)b=e;if(f<c)c=f}}return{max:b,min:c}},ga:function(a){var b="log";return Math.floor(Math[b](a)/Math.LN10)},Ba:function(a,b,c,d,e){this.e.xAxis&&this.renderTextAt(e,d,a,b,this.e.xAxis.template(c), "dhx_axis_item_x")},Ca:function(a,b,c,d){this.e.xAxis&&this.e.xAxis.lines&&this.i(a,
b,c,b,d,this.e.xAxis.color,0.2)},i:function(a,b,c,d,e,f,g){a.strokeStyle=f;a.lineWidth=g;a.beginPath();a.moveTo(b,c);a.lineTo(d,e);a.stroke()},z:function(a,b){var c=1;if(b!=a){a=b-a;if(Math.abs(a)<1)for(;Math.abs(a)<1;){c*=10;a*=c}}else a=a;return[a,c]},Za:[function(a){return"#FF"+dhtmlx.math.toHex(a/2,2)+"00"},function(a){return"#FF"+dhtmlx.math.toHex(a/2+128,2)+"00"},function(a){return"#"+dhtmlx.math.toHex(255-a,2)+"FF00"},function(a){return"#00FF"+dhtmlx.math.toHex(a,2)},function(a){return"#00"+
dhtmlx.math.toHex(255-a,2)+"FF"},function(a){return"#"+dhtmlx.math.toHex(a,2)+"00FF"}],addSeries:function(a){var b=this.e;this.e=dhtmlx.extend({},b);this.B(a,{});this.h.push(this.e);this.e=b},db:function(a,b){this.ra=b.getAttribute("userdata");for(a=0;a<this.h.length;a++){var c=this.h[a].tooltip;c&&c.disable()}(c=this.h[this.ra].tooltip)&&c.enable()},za:function(a,b){var c=0,d=0,e=this.e.legend,f,g,i=this.e.legend.layout!="x"?"width:"+e.width+"px":"",j=dhtmlx.html.create("DIV",{"class":"dhx_chart_legend",
style:"left:"+c+"px; top:"+d+"px;"+i},"");this.g.appendChild(j);var k=[];if(e.values)for(h=0;h<e.values.length;h++)k.push(this.aa(j,e.values[h].text));else for(var h=0;h<b.length;h++)k.push(this.aa(j,e.template(b[h])));g=j.offsetWidth;f=j.offsetHeight;this.e.legend.width=g;this.e.legend.height=f;if(g<this.g.offsetWidth){if(e.layout=="x"&&e.align=="center")c=(this.g.offsetWidth-g)/2;if(e.align=="right")c=this.g.offsetWidth-g}if(f<this.g.offsetHeight)if(e.valign=="middle"&&e.align!="center"&&e.layout!=
"x")d=(this.g.offsetHeight-f)/2;else if(e.valign=="bottom")d=this.g.offsetHeight-f;j.style.left=c+"px";j.style.top=d+"px";for(h=0;h<k.length;h++){var m=k[h],l=e.values?e.values[h].color:this.e.color.call(this,b[h]);this.Aa(a,m.offsetLeft+c,m.offsetTop+d,l)}k=null},aa:function(a,b){var c="";if(this.e.legend.layout=="x")c="float:left;";b=dhtmlx.html.create("DIV",{style:c+"padding-left:"+(10+this.e.legend.marker.width)+"px","class":"dhx_chart_legend_item"},b);a.appendChild(b);return b},Aa:function(a,
b,c,d){var e=this.e.legend;a.strokeStyle=a.fillStyle=d;a.lineWidth=e.marker.height;a.lineCap=e.marker.type;a.beginPath();b+=a.lineWidth/2+5;c+=a.lineWidth/2+3;a.moveTo(b,c);b=b+e.marker.width-e.marker.height+1;a.lineTo(b,c);a.stroke()},Ea:function(a,b){var c,d,e,f;c=this.e.padding.left;d=this.e.padding.top;e=a-this.e.padding.right;f=b-this.e.padding.bottom;if(this.e.legend){a=this.e.legend;b=this.e.legend.width;var g=this.e.legend.height;if(a.layout=="x")if(a.valign=="center")if(a.align=="right")e-=
b;else{if(a.align=="left")c+=b}else if(a.valign=="bottom")f-=g;else d+=g;else if(a.align=="right")e-=b;else if(a.align=="left")c+=b}return{start:{x:c,y:d},end:{x:e,y:f}}},Q:function(a){var b,c;if(this.e.yAxis&&typeof this.e.yAxis.end!="undefied"&&typeof this.e.yAxis.start!="undefied"&&this.e.yAxis.step){b=parseFloat(this.e.yAxis.end);c=parseFloat(this.e.yAxis.start)}else{for(var d=0;d<a.length;d++){a[d].$sum=0;a[d].$min=Infinity;for(b=0;b<this.h.length;b++){c=parseFloat(this.h[b].value(a[d]));if(!isNaN(c)){a[d].$sum+=
c;if(c<a[d].$min)a[d].$min=c}}}b=-Infinity;c=Infinity;for(d=0;d<a.length;d++){if(a[d].$sum>b)b=a[d].$sum;if(a[d].$min<c)c=a[d].$min}if(c>0)c=0}return{max:b,min:c}},G:function(a,b,c,d,e,f,g,i){if(f=="light"){a=i=="x"?a.createLinearGradient(b,c,d,c):a.createLinearGradient(b,c,b,e);a.addColorStop(0,"#FFFFFF");a.addColorStop(0.9,g);a.addColorStop(1,g);g=2}else{a.globalAlpha=0.37;g=0;a=i=="x"?a.createLinearGradient(b,e,b,c):a.createLinearGradient(b,c,d,c);a.addColorStop(0,"#000000");a.addColorStop(0.5,
"#FFFFFF");a.addColorStop(0.6,"#FFFFFF");a.addColorStop(1,"#000000")}return{gradient:a,offset:g}}};dhtmlx.compat("layout");

View File

@ -0,0 +1,6 @@
/*
Copyright DHTMLX LTD. http://www.dhtmlx.com
You allowed to use this component or parts of it under GPL terms
To use it on other terms or get Professional edition of the component please contact us at sales@dhtmlx.com
*/
/*pure colors*/ /*fonts*/ /*2010 September 28*//* DHX DEPEND FROM FILE 'tooltip.css'*//*style used by tooltip's container*/ .dhx_tooltip{ display:none; position:absolute; font-family:Tahoma; font-size:8pt; z-index:10000; background-color:white; padding:2px 2px 2px 2px; border:1px solid #A4BED4; }/* DHX DEPEND FROM FILE 'chart.css'*//*chart container*/ .dhx_chart{ position:relative; font-family:Verdana; font-size:13px; color:#000000; overflow:hidden; } /*labels*/ .dhx_canvas_text{ position:absolute; text-align:center; overflow:hidden; white-space:nowrap; } /*map*/ .dhx_map_img{ width : 100%; height : 100%; position : absolute; top : 0px; left : 0px; border:0px; filter:alpha(opacity=0); } /*scales*/ .dhx_axis_item_y{ position:absolute; height:10px; line-height:10px; text-align:right; } .dhx_axis_title_x{ text-align:center; } .dhx_axis_title_y{ text-align:center; font-family:Verdana; /*safari*/ -webkit-transform: rotate(-90deg); /*firefox*/ -moz-transform: rotate(-90deg); /*IE*/ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); /*opera*/ -o-transform:rotate(-90deg); padding-left:3px; } /*legend block*/ .dhx_chart_legend{ position:absolute; } .dhx_chart_legend_item{ height:18px; line-height:18px; padding: 2px; }

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,10 @@
ExplorerCanvas
Google Open Source:
<http://code.google.com>
<opensource@google.com>
Developers:
Emil A Eklund <emil@eae.net>
Erik Arvidsson <erik@eae.net>
Glen Murphy <glen@glenmurphy.com>

View File

@ -0,0 +1,202 @@
Apache License
Version 2.0, January 2004
http://www.apache.org/licenses/
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
1. Definitions.
"License" shall mean the terms and conditions for use, reproduction,
and distribution as defined by Sections 1 through 9 of this document.
"Licensor" shall mean the copyright owner or entity authorized by
the copyright owner that is granting the License.
"Legal Entity" shall mean the union of the acting entity and all
other entities that control, are controlled by, or are under common
control with that entity. For the purposes of this definition,
"control" means (i) the power, direct or indirect, to cause the
direction or management of such entity, whether by contract or
otherwise, or (ii) ownership of fifty percent (50%) or more of the
outstanding shares, or (iii) beneficial ownership of such entity.
"You" (or "Your") shall mean an individual or Legal Entity
exercising permissions granted by this License.
"Source" form shall mean the preferred form for making modifications,
including but not limited to software source code, documentation
source, and configuration files.
"Object" form shall mean any form resulting from mechanical
transformation or translation of a Source form, including but
not limited to compiled object code, generated documentation,
and conversions to other media types.
"Work" shall mean the work of authorship, whether in Source or
Object form, made available under the License, as indicated by a
copyright notice that is included in or attached to the work
(an example is provided in the Appendix below).
"Derivative Works" shall mean any work, whether in Source or Object
form, that is based on (or derived from) the Work and for which the
editorial revisions, annotations, elaborations, or other modifications
represent, as a whole, an original work of authorship. For the purposes
of this License, Derivative Works shall not include works that remain
separable from, or merely link (or bind by name) to the interfaces of,
the Work and Derivative Works thereof.
"Contribution" shall mean any work of authorship, including
the original version of the Work and any modifications or additions
to that Work or Derivative Works thereof, that is intentionally
submitted to Licensor for inclusion in the Work by the copyright owner
or by an individual or Legal Entity authorized to submit on behalf of
the copyright owner. For the purposes of this definition, "submitted"
means any form of electronic, verbal, or written communication sent
to the Licensor or its representatives, including but not limited to
communication on electronic mailing lists, source code control systems,
and issue tracking systems that are managed by, or on behalf of, the
Licensor for the purpose of discussing and improving the Work, but
excluding communication that is conspicuously marked or otherwise
designated in writing by the copyright owner as "Not a Contribution."
"Contributor" shall mean Licensor and any individual or Legal Entity
on behalf of whom a Contribution has been received by Licensor and
subsequently incorporated within the Work.
2. Grant of Copyright License. Subject to the terms and conditions of
this License, each Contributor hereby grants to You a perpetual,
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
copyright license to reproduce, prepare Derivative Works of,
publicly display, publicly perform, sublicense, and distribute the
Work and such Derivative Works in Source or Object form.
3. Grant of Patent License. Subject to the terms and conditions of
this License, each Contributor hereby grants to You a perpetual,
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
(except as stated in this section) patent license to make, have made,
use, offer to sell, sell, import, and otherwise transfer the Work,
where such license applies only to those patent claims licensable
by such Contributor that are necessarily infringed by their
Contribution(s) alone or by combination of their Contribution(s)
with the Work to which such Contribution(s) was submitted. If You
institute patent litigation against any entity (including a
cross-claim or counterclaim in a lawsuit) alleging that the Work
or a Contribution incorporated within the Work constitutes direct
or contributory patent infringement, then any patent licenses
granted to You under this License for that Work shall terminate
as of the date such litigation is filed.
4. Redistribution. You may reproduce and distribute copies of the
Work or Derivative Works thereof in any medium, with or without
modifications, and in Source or Object form, provided that You
meet the following conditions:
(a) You must give any other recipients of the Work or
Derivative Works a copy of this License; and
(b) You must cause any modified files to carry prominent notices
stating that You changed the files; and
(c) You must retain, in the Source form of any Derivative Works
that You distribute, all copyright, patent, trademark, and
attribution notices from the Source form of the Work,
excluding those notices that do not pertain to any part of
the Derivative Works; and
(d) If the Work includes a "NOTICE" text file as part of its
distribution, then any Derivative Works that You distribute must
include a readable copy of the attribution notices contained
within such NOTICE file, excluding those notices that do not
pertain to any part of the Derivative Works, in at least one
of the following places: within a NOTICE text file distributed
as part of the Derivative Works; within the Source form or
documentation, if provided along with the Derivative Works; or,
within a display generated by the Derivative Works, if and
wherever such third-party notices normally appear. The contents
of the NOTICE file are for informational purposes only and
do not modify the License. You may add Your own attribution
notices within Derivative Works that You distribute, alongside
or as an addendum to the NOTICE text from the Work, provided
that such additional attribution notices cannot be construed
as modifying the License.
You may add Your own copyright statement to Your modifications and
may provide additional or different license terms and conditions
for use, reproduction, or distribution of Your modifications, or
for any such Derivative Works as a whole, provided Your use,
reproduction, and distribution of the Work otherwise complies with
the conditions stated in this License.
5. Submission of Contributions. Unless You explicitly state otherwise,
any Contribution intentionally submitted for inclusion in the Work
by You to the Licensor shall be under the terms and conditions of
this License, without any additional terms or conditions.
Notwithstanding the above, nothing herein shall supersede or modify
the terms of any separate license agreement you may have executed
with Licensor regarding such Contributions.
6. Trademarks. This License does not grant permission to use the trade
names, trademarks, service marks, or product names of the Licensor,
except as required for reasonable and customary use in describing the
origin of the Work and reproducing the content of the NOTICE file.
7. Disclaimer of Warranty. Unless required by applicable law or
agreed to in writing, Licensor provides the Work (and each
Contributor provides its Contributions) on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
implied, including, without limitation, any warranties or conditions
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
PARTICULAR PURPOSE. You are solely responsible for determining the
appropriateness of using or redistributing the Work and assume any
risks associated with Your exercise of permissions under this License.
8. Limitation of Liability. In no event and under no legal theory,
whether in tort (including negligence), contract, or otherwise,
unless required by applicable law (such as deliberate and grossly
negligent acts) or agreed to in writing, shall any Contributor be
liable to You for damages, including any direct, indirect, special,
incidental, or consequential damages of any character arising as a
result of this License or out of the use or inability to use the
Work (including but not limited to damages for loss of goodwill,
work stoppage, computer failure or malfunction, or any and all
other commercial damages or losses), even if such Contributor
has been advised of the possibility of such damages.
9. Accepting Warranty or Additional Liability. While redistributing
the Work or Derivative Works thereof, You may choose to offer,
and charge a fee for, acceptance of support, warranty, indemnity,
or other liability obligations and/or rights consistent with this
License. However, in accepting such obligations, You may act only
on Your own behalf and on Your sole responsibility, not on behalf
of any other Contributor, and only if You agree to indemnify,
defend, and hold each Contributor harmless for any liability
incurred by, or claims asserted against, such Contributor by reason
of your accepting any such warranty or additional liability.
END OF TERMS AND CONDITIONS
APPENDIX: How to apply the Apache License to your work.
To apply the Apache License to your work, attach the following
boilerplate notice, with the fields enclosed by brackets "[]"
replaced with your own identifying information. (Don't include
the brackets!) The text should be enclosed in the appropriate
comment syntax for the file format. We also recommend that a
file or class name and description of purpose be included on the
same "printed page" as the copyright notice for easier
identification within third-party archives.
Copyright [yyyy] [name of copyright owner]
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

View File

@ -0,0 +1,22 @@
ExplorerCanvas
Copyright 2006 Google Inc.
-------------------------------------------------------------------------------
DESCRIPTION
Firefox, Safari and Opera 9 support the canvas tag to allow 2D command-based
drawing operations. ExplorerCanvas brings the same functionality to Internet
Explorer; web developers only need to include a single script tag in their
existing canvas webpages to enable this support.
-------------------------------------------------------------------------------
INSTALLATION
Include the ExplorerCanvas tag in the same directory as your HTML files, and
add the following code to your page, preferably in the <head> tag.
<!--[if IE]><script type="text/javascript" src="excanvas.js"></script><![endif]-->
If you run into trouble, please look at the included example code to see how
to best implement this

View File

@ -0,0 +1,927 @@
// Copyright 2006 Google Inc.
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
// Known Issues:
//
// * Patterns are not implemented.
// * Radial gradient are not implemented. The VML version of these look very
// different from the canvas one.
// * Clipping paths are not implemented.
// * Coordsize. The width and height attribute have higher priority than the
// width and height style values which isn't correct.
// * Painting mode isn't implemented.
// * Canvas width/height should is using content-box by default. IE in
// Quirks mode will draw the canvas using border-box. Either change your
// doctype to HTML5
// (http://www.whatwg.org/specs/web-apps/current-work/#the-doctype)
// or use Box Sizing Behavior from WebFX
// (http://webfx.eae.net/dhtml/boxsizing/boxsizing.html)
// * Non uniform scaling does not correctly scale strokes.
// * Optimize. There is always room for speed improvements.
// Only add this code if we do not already have a canvas implementation
if (!document.createElement('canvas').getContext) {
(function() {
// alias some functions to make (compiled) code shorter
var m = Math;
var mr = m.round;
var ms = m.sin;
var mc = m.cos;
var abs = m.abs;
var sqrt = m.sqrt;
// this is used for sub pixel precision
var Z = 10;
var Z2 = Z / 2;
/**
* This funtion is assigned to the <canvas> elements as element.getContext().
* @this {HTMLElement}
* @return {CanvasRenderingContext2D_}
*/
function getContext() {
return this.context_ ||
(this.context_ = new CanvasRenderingContext2D_(this));
}
var slice = Array.prototype.slice;
/**
* Binds a function to an object. The returned function will always use the
* passed in {@code obj} as {@code this}.
*
* Example:
*
* g = bind(f, obj, a, b)
* g(c, d) // will do f.call(obj, a, b, c, d)
*
* @param {Function} f The function to bind the object to
* @param {Object} obj The object that should act as this when the function
* is called
* @param {*} var_args Rest arguments that will be used as the initial
* arguments when the function is called
* @return {Function} A new function that has bound this
*/
function bind(f, obj, var_args) {
var a = slice.call(arguments, 2);
return function() {
return f.apply(obj, a.concat(slice.call(arguments)));
};
}
var G_vmlCanvasManager_ = {
init: function(opt_doc) {
if (/MSIE/.test(navigator.userAgent) && !window.opera) {
var doc = opt_doc || document;
// Create a dummy element so that IE will allow canvas elements to be
// recognized.
doc.createElement('canvas');
doc.attachEvent('onreadystatechange', bind(this.init_, this, doc));
}
},
init_: function(doc) {
// create xmlns
if (!doc.namespaces['g_vml_']) {
doc.namespaces.add('g_vml_', 'urn:schemas-microsoft-com:vml',
'#default#VML');
}
if (!doc.namespaces['g_o_']) {
doc.namespaces.add('g_o_', 'urn:schemas-microsoft-com:office:office',
'#default#VML');
}
// Setup default CSS. Only add one style sheet per document
if (!doc.styleSheets['ex_canvas_']) {
var ss = doc.createStyleSheet();
ss.owningElement.id = 'ex_canvas_';
ss.cssText = 'canvas{display:inline-block;overflow:hidden;' +
// default size is 300x150 in Gecko and Opera
'text-align:left;width:300px;height:150px}' +
'g_vml_\\:*{behavior:url(#default#VML)}' +
'g_o_\\:*{behavior:url(#default#VML)}';
}
// find all canvas elements
var els = doc.getElementsByTagName('canvas');
for (var i = 0; i < els.length; i++) {
this.initElement(els[i]);
}
},
/**
* Public initializes a canvas element so that it can be used as canvas
* element from now on. This is called automatically before the page is
* loaded but if you are creating elements using createElement you need to
* make sure this is called on the element.
* @param {HTMLElement} el The canvas element to initialize.
* @return {HTMLElement} the element that was created.
*/
initElement: function(el) {
if (!el.getContext) {
el.getContext = getContext;
// Remove fallback content. There is no way to hide text nodes so we
// just remove all childNodes. We could hide all elements and remove
// text nodes but who really cares about the fallback content.
el.innerHTML = '';
// do not use inline function because that will leak memory
el.attachEvent('onpropertychange', onPropertyChange);
el.attachEvent('onresize', onResize);
var attrs = el.attributes;
if (attrs.width && attrs.width.specified) {
// TODO: use runtimeStyle and coordsize
// el.getContext().setWidth_(attrs.width.nodeValue);
el.style.width = attrs.width.nodeValue + 'px';
} else {
el.width = el.clientWidth;
}
if (attrs.height && attrs.height.specified) {
// TODO: use runtimeStyle and coordsize
// el.getContext().setHeight_(attrs.height.nodeValue);
el.style.height = attrs.height.nodeValue + 'px';
} else {
el.height = el.clientHeight;
}
//el.getContext().setCoordsize_()
}
return el;
}
};
function onPropertyChange(e) {
var el = e.srcElement;
switch (e.propertyName) {
case 'width':
el.style.width = el.attributes.width.nodeValue + 'px';
el.getContext().clearRect();
break;
case 'height':
el.style.height = el.attributes.height.nodeValue + 'px';
el.getContext().clearRect();
break;
}
}
function onResize(e) {
var el = e.srcElement;
if (el.firstChild) {
el.firstChild.style.width = el.clientWidth + 'px';
el.firstChild.style.height = el.clientHeight + 'px';
}
}
G_vmlCanvasManager_.init();
// precompute "00" to "FF"
var dec2hex = [];
for (var i = 0; i < 16; i++) {
for (var j = 0; j < 16; j++) {
dec2hex[i * 16 + j] = i.toString(16) + j.toString(16);
}
}
function createMatrixIdentity() {
return [
[1, 0, 0],
[0, 1, 0],
[0, 0, 1]
];
}
function matrixMultiply(m1, m2) {
var result = createMatrixIdentity();
for (var x = 0; x < 3; x++) {
for (var y = 0; y < 3; y++) {
var sum = 0;
for (var z = 0; z < 3; z++) {
sum += m1[x][z] * m2[z][y];
}
result[x][y] = sum;
}
}
return result;
}
function copyState(o1, o2) {
o2.fillStyle = o1.fillStyle;
o2.lineCap = o1.lineCap;
o2.lineJoin = o1.lineJoin;
o2.lineWidth = o1.lineWidth;
o2.miterLimit = o1.miterLimit;
o2.shadowBlur = o1.shadowBlur;
o2.shadowColor = o1.shadowColor;
o2.shadowOffsetX = o1.shadowOffsetX;
o2.shadowOffsetY = o1.shadowOffsetY;
o2.strokeStyle = o1.strokeStyle;
o2.globalAlpha = o1.globalAlpha;
o2.arcScaleX_ = o1.arcScaleX_;
o2.arcScaleY_ = o1.arcScaleY_;
o2.lineScale_ = o1.lineScale_;
}
function processStyle(styleString) {
var str, alpha = 1;
styleString = String(styleString);
if (styleString.substring(0, 3) == 'rgb') {
var start = styleString.indexOf('(', 3);
var end = styleString.indexOf(')', start + 1);
var guts = styleString.substring(start + 1, end).split(',');
str = '#';
for (var i = 0; i < 3; i++) {
str += dec2hex[Number(guts[i])];
}
if (guts.length == 4 && styleString.substr(3, 1) == 'a') {
alpha = guts[3];
}
} else {
str = styleString;
}
return {color: str, alpha: alpha};
}
function processLineCap(lineCap) {
switch (lineCap) {
case 'butt':
return 'flat';
case 'round':
return 'round';
case 'square':
default:
return 'square';
}
}
/**
* This class implements CanvasRenderingContext2D interface as described by
* the WHATWG.
* @param {HTMLElement} surfaceElement The element that the 2D context should
* be associated with
*/
function CanvasRenderingContext2D_(surfaceElement) {
this.m_ = createMatrixIdentity();
this.mStack_ = [];
this.aStack_ = [];
this.currentPath_ = [];
// Canvas context properties
this.strokeStyle = '#000';
this.fillStyle = '#000';
this.lineWidth = 1;
this.lineJoin = 'miter';
this.lineCap = 'butt';
this.miterLimit = Z * 1;
this.globalAlpha = 1;
this.canvas = surfaceElement;
var el = surfaceElement.ownerDocument.createElement('div');
el.style.width = surfaceElement.clientWidth + 'px';
el.style.height = surfaceElement.clientHeight + 'px';
el.style.overflow = 'hidden';
el.style.position = 'absolute';
surfaceElement.appendChild(el);
this.element_ = el;
this.arcScaleX_ = 1;
this.arcScaleY_ = 1;
this.lineScale_ = 1;
}
var contextPrototype = CanvasRenderingContext2D_.prototype;
contextPrototype.clearRect = function() {
this.element_.innerHTML = '';
};
contextPrototype.beginPath = function() {
// TODO: Branch current matrix so that save/restore has no effect
// as per safari docs.
this.currentPath_ = [];
};
contextPrototype.moveTo = function(aX, aY) {
var p = this.getCoords_(aX, aY);
this.currentPath_.push({type: 'moveTo', x: p.x, y: p.y});
this.currentX_ = p.x;
this.currentY_ = p.y;
};
contextPrototype.lineTo = function(aX, aY) {
var p = this.getCoords_(aX, aY);
this.currentPath_.push({type: 'lineTo', x: p.x, y: p.y});
this.currentX_ = p.x;
this.currentY_ = p.y;
};
contextPrototype.bezierCurveTo = function(aCP1x, aCP1y,
aCP2x, aCP2y,
aX, aY) {
var p = this.getCoords_(aX, aY);
var cp1 = this.getCoords_(aCP1x, aCP1y);
var cp2 = this.getCoords_(aCP2x, aCP2y);
bezierCurveTo(this, cp1, cp2, p);
};
// Helper function that takes the already fixed cordinates.
function bezierCurveTo(self, cp1, cp2, p) {
self.currentPath_.push({
type: 'bezierCurveTo',
cp1x: cp1.x,
cp1y: cp1.y,
cp2x: cp2.x,
cp2y: cp2.y,
x: p.x,
y: p.y
});
self.currentX_ = p.x;
self.currentY_ = p.y;
}
contextPrototype.quadraticCurveTo = function(aCPx, aCPy, aX, aY) {
// the following is lifted almost directly from
// http://developer.mozilla.org/en/docs/Canvas_tutorial:Drawing_shapes
var cp = this.getCoords_(aCPx, aCPy);
var p = this.getCoords_(aX, aY);
var cp1 = {
x: this.currentX_ + 2.0 / 3.0 * (cp.x - this.currentX_),
y: this.currentY_ + 2.0 / 3.0 * (cp.y - this.currentY_)
};
var cp2 = {
x: cp1.x + (p.x - this.currentX_) / 3.0,
y: cp1.y + (p.y - this.currentY_) / 3.0
};
bezierCurveTo(this, cp1, cp2, p);
};
contextPrototype.arc = function(aX, aY, aRadius,
aStartAngle, aEndAngle, aClockwise) {
aRadius *= Z;
var arcType = aClockwise ? 'at' : 'wa';
var xStart = aX + mc(aStartAngle) * aRadius - Z2;
var yStart = aY + ms(aStartAngle) * aRadius - Z2;
var xEnd = aX + mc(aEndAngle) * aRadius - Z2;
var yEnd = aY + ms(aEndAngle) * aRadius - Z2;
// IE won't render arches drawn counter clockwise if xStart == xEnd.
if (xStart == xEnd && !aClockwise) {
xStart += 0.125; // Offset xStart by 1/80 of a pixel. Use something
// that can be represented in binary
}
var p = this.getCoords_(aX, aY);
var pStart = this.getCoords_(xStart, yStart);
var pEnd = this.getCoords_(xEnd, yEnd);
this.currentPath_.push({type: arcType,
x: p.x,
y: p.y,
radius: aRadius,
xStart: pStart.x,
yStart: pStart.y,
xEnd: pEnd.x,
yEnd: pEnd.y});
};
contextPrototype.rect = function(aX, aY, aWidth, aHeight) {
this.moveTo(aX, aY);
this.lineTo(aX + aWidth, aY);
this.lineTo(aX + aWidth, aY + aHeight);
this.lineTo(aX, aY + aHeight);
this.closePath();
};
contextPrototype.strokeRect = function(aX, aY, aWidth, aHeight) {
var oldPath = this.currentPath_;
this.beginPath();
this.moveTo(aX, aY);
this.lineTo(aX + aWidth, aY);
this.lineTo(aX + aWidth, aY + aHeight);
this.lineTo(aX, aY + aHeight);
this.closePath();
this.stroke();
this.currentPath_ = oldPath;
};
contextPrototype.fillRect = function(aX, aY, aWidth, aHeight) {
var oldPath = this.currentPath_;
this.beginPath();
this.moveTo(aX, aY);
this.lineTo(aX + aWidth, aY);
this.lineTo(aX + aWidth, aY + aHeight);
this.lineTo(aX, aY + aHeight);
this.closePath();
this.fill();
this.currentPath_ = oldPath;
};
contextPrototype.createLinearGradient = function(aX0, aY0, aX1, aY1) {
var gradient = new CanvasGradient_('gradient');
gradient.x0_ = aX0;
gradient.y0_ = aY0;
gradient.x1_ = aX1;
gradient.y1_ = aY1;
return gradient;
};
contextPrototype.createRadialGradient = function(aX0, aY0, aR0,
aX1, aY1, aR1) {
var gradient = new CanvasGradient_('gradientradial');
gradient.x0_ = aX0;
gradient.y0_ = aY0;
gradient.r0_ = aR0;
gradient.x1_ = aX1;
gradient.y1_ = aY1;
gradient.r1_ = aR1;
return gradient;
};
contextPrototype.drawImage = function(image, var_args) {
var dx, dy, dw, dh, sx, sy, sw, sh;
// to find the original width we overide the width and height
var oldRuntimeWidth = image.runtimeStyle.width;
var oldRuntimeHeight = image.runtimeStyle.height;
image.runtimeStyle.width = 'auto';
image.runtimeStyle.height = 'auto';
// get the original size
var w = image.width;
var h = image.height;
// and remove overides
image.runtimeStyle.width = oldRuntimeWidth;
image.runtimeStyle.height = oldRuntimeHeight;
if (arguments.length == 3) {
dx = arguments[1];
dy = arguments[2];
sx = sy = 0;
sw = dw = w;
sh = dh = h;
} else if (arguments.length == 5) {
dx = arguments[1];
dy = arguments[2];
dw = arguments[3];
dh = arguments[4];
sx = sy = 0;
sw = w;
sh = h;
} else if (arguments.length == 9) {
sx = arguments[1];
sy = arguments[2];
sw = arguments[3];
sh = arguments[4];
dx = arguments[5];
dy = arguments[6];
dw = arguments[7];
dh = arguments[8];
} else {
throw Error('Invalid number of arguments');
}
var d = this.getCoords_(dx, dy);
var w2 = sw / 2;
var h2 = sh / 2;
var vmlStr = [];
var W = 10;
var H = 10;
// For some reason that I've now forgotten, using divs didn't work
vmlStr.push(' <g_vml_:group',
' coordsize="', Z * W, ',', Z * H, '"',
' coordorigin="0,0"' ,
' style="width:', W, 'px;height:', H, 'px;position:absolute;');
// If filters are necessary (rotation exists), create them
// filters are bog-slow, so only create them if abbsolutely necessary
// The following check doesn't account for skews (which don't exist
// in the canvas spec (yet) anyway.
if (this.m_[0][0] != 1 || this.m_[0][1]) {
var filter = [];
// Note the 12/21 reversal
filter.push('M11=', this.m_[0][0], ',',
'M12=', this.m_[1][0], ',',
'M21=', this.m_[0][1], ',',
'M22=', this.m_[1][1], ',',
'Dx=', mr(d.x / Z), ',',
'Dy=', mr(d.y / Z), '');
// Bounding box calculation (need to minimize displayed area so that
// filters don't waste time on unused pixels.
var max = d;
var c2 = this.getCoords_(dx + dw, dy);
var c3 = this.getCoords_(dx, dy + dh);
var c4 = this.getCoords_(dx + dw, dy + dh);
max.x = m.max(max.x, c2.x, c3.x, c4.x);
max.y = m.max(max.y, c2.y, c3.y, c4.y);
vmlStr.push('padding:0 ', mr(max.x / Z), 'px ', mr(max.y / Z),
'px 0;filter:progid:DXImageTransform.Microsoft.Matrix(',
filter.join(''), ", sizingmethod='clip');")
} else {
vmlStr.push('top:', mr(d.y / Z), 'px;left:', mr(d.x / Z), 'px;');
}
vmlStr.push(' ">' ,
'<g_vml_:image src="', image.src, '"',
' style="width:', Z * dw, 'px;',
' height:', Z * dh, 'px;"',
' cropleft="', sx / w, '"',
' croptop="', sy / h, '"',
' cropright="', (w - sx - sw) / w, '"',
' cropbottom="', (h - sy - sh) / h, '"',
' />',
'</g_vml_:group>');
this.element_.insertAdjacentHTML('BeforeEnd',
vmlStr.join(''));
};
contextPrototype.stroke = function(aFill) {
var lineStr = [];
var lineOpen = false;
var a = processStyle(aFill ? this.fillStyle : this.strokeStyle);
var color = a.color;
var opacity = a.alpha * this.globalAlpha;
var W = 10;
var H = 10;
lineStr.push('<g_vml_:shape',
' filled="', !!aFill, '"',
' style="position:absolute;width:', W, 'px;height:', H, 'px;"',
' coordorigin="0 0" coordsize="', Z * W, ' ', Z * H, '"',
' stroked="', !aFill, '"',
' path="');
var newSeq = false;
var min = {x: null, y: null};
var max = {x: null, y: null};
for (var i = 0; i < this.currentPath_.length; i++) {
var p = this.currentPath_[i];
var c;
switch (p.type) {
case 'moveTo':
c = p;
lineStr.push(' m ', mr(p.x), ',', mr(p.y));
break;
case 'lineTo':
lineStr.push(' l ', mr(p.x), ',', mr(p.y));
break;
case 'close':
lineStr.push(' x ');
p = null;
break;
case 'bezierCurveTo':
lineStr.push(' c ',
mr(p.cp1x), ',', mr(p.cp1y), ',',
mr(p.cp2x), ',', mr(p.cp2y), ',',
mr(p.x), ',', mr(p.y));
break;
case 'at':
case 'wa':
lineStr.push(' ', p.type, ' ',
mr(p.x - this.arcScaleX_ * p.radius), ',',
mr(p.y - this.arcScaleY_ * p.radius), ' ',
mr(p.x + this.arcScaleX_ * p.radius), ',',
mr(p.y + this.arcScaleY_ * p.radius), ' ',
mr(p.xStart), ',', mr(p.yStart), ' ',
mr(p.xEnd), ',', mr(p.yEnd));
break;
}
// TODO: Following is broken for curves due to
// move to proper paths.
// Figure out dimensions so we can do gradient fills
// properly
if (p) {
if (min.x == null || p.x < min.x) {
min.x = p.x;
}
if (max.x == null || p.x > max.x) {
max.x = p.x;
}
if (min.y == null || p.y < min.y) {
min.y = p.y;
}
if (max.y == null || p.y > max.y) {
max.y = p.y;
}
}
}
lineStr.push(' ">');
if (!aFill) {
var lineWidth = this.lineScale_ * this.lineWidth;
// VML cannot correctly render a line if the width is less than 1px.
// In that case, we dilute the color to make the line look thinner.
if (lineWidth < 1) {
opacity *= lineWidth;
}
lineStr.push(
'<g_vml_:stroke',
' opacity="', opacity, '"',
' joinstyle="', this.lineJoin, '"',
' miterlimit="', this.miterLimit, '"',
' endcap="', processLineCap(this.lineCap), '"',
' weight="', lineWidth, 'px"',
' color="', color, '" />'
);
} else if (typeof this.fillStyle == 'object') {
var fillStyle = this.fillStyle;
var angle = 0;
var focus = {x: 0, y: 0};
// additional offset
var shift = 0;
// scale factor for offset
var expansion = 1;
if (fillStyle.type_ == 'gradient') {
var x0 = fillStyle.x0_ / this.arcScaleX_;
var y0 = fillStyle.y0_ / this.arcScaleY_;
var x1 = fillStyle.x1_ / this.arcScaleX_;
var y1 = fillStyle.y1_ / this.arcScaleY_;
var p0 = this.getCoords_(x0, y0);
var p1 = this.getCoords_(x1, y1);
var dx = p1.x - p0.x;
var dy = p1.y - p0.y;
angle = Math.atan2(dx, dy) * 180 / Math.PI;
// The angle should be a non-negative number.
if (angle < 0) {
angle += 360;
}
// Very small angles produce an unexpected result because they are
// converted to a scientific notation string.
if (angle < 1e-6) {
angle = 0;
}
} else {
var p0 = this.getCoords_(fillStyle.x0_, fillStyle.y0_);
var width = max.x - min.x;
var height = max.y - min.y;
focus = {
x: (p0.x - min.x) / width,
y: (p0.y - min.y) / height
};
width /= this.arcScaleX_ * Z;
height /= this.arcScaleY_ * Z;
var dimension = m.max(width, height);
shift = 2 * fillStyle.r0_ / dimension;
expansion = 2 * fillStyle.r1_ / dimension - shift;
}
// We need to sort the color stops in ascending order by offset,
// otherwise IE won't interpret it correctly.
var stops = fillStyle.colors_;
stops.sort(function(cs1, cs2) {
return cs1.offset - cs2.offset;
});
var length = stops.length;
var color1 = stops[0].color;
var color2 = stops[length - 1].color;
var opacity1 = stops[0].alpha * this.globalAlpha;
var opacity2 = stops[length - 1].alpha * this.globalAlpha;
var colors = [];
for (var i = 0; i < length; i++) {
var stop = stops[i];
colors.push(stop.offset * expansion + shift + ' ' + stop.color);
}
// When colors attribute is used, the meanings of opacity and o:opacity2
// are reversed.
lineStr.push('<g_vml_:fill type="', fillStyle.type_, '"',
' method="none" focus="100%"',
' color="', color1, '"',
' color2="', color2, '"',
' colors="', colors.join(','), '"',
' opacity="', opacity2, '"',
' g_o_:opacity2="', opacity1, '"',
' angle="', angle, '"',
' focusposition="', focus.x, ',', focus.y, '" />');
} else {
lineStr.push('<g_vml_:fill color="', color, '" opacity="', opacity,
'" />');
}
lineStr.push('</g_vml_:shape>');
this.element_.insertAdjacentHTML('beforeEnd', lineStr.join(''));
};
contextPrototype.fill = function() {
this.stroke(true);
}
contextPrototype.closePath = function() {
this.currentPath_.push({type: 'close'});
};
/**
* @private
*/
contextPrototype.getCoords_ = function(aX, aY) {
var m = this.m_;
return {
x: Z * (aX * m[0][0] + aY * m[1][0] + m[2][0]) - Z2,
y: Z * (aX * m[0][1] + aY * m[1][1] + m[2][1]) - Z2
}
};
contextPrototype.save = function() {
var o = {};
copyState(this, o);
this.aStack_.push(o);
this.mStack_.push(this.m_);
this.m_ = matrixMultiply(createMatrixIdentity(), this.m_);
};
contextPrototype.restore = function() {
copyState(this.aStack_.pop(), this);
this.m_ = this.mStack_.pop();
};
function matrixIsFinite(m) {
for (var j = 0; j < 3; j++) {
for (var k = 0; k < 2; k++) {
if (!isFinite(m[j][k]) || isNaN(m[j][k])) {
return false;
}
}
}
return true;
}
function setM(ctx, m, updateLineScale) {
if (!matrixIsFinite(m)) {
return;
}
ctx.m_ = m;
if (updateLineScale) {
// Get the line scale.
// Determinant of this.m_ means how much the area is enlarged by the
// transformation. So its square root can be used as a scale factor
// for width.
var det = m[0][0] * m[1][1] - m[0][1] * m[1][0];
ctx.lineScale_ = sqrt(abs(det));
}
}
contextPrototype.translate = function(aX, aY) {
var m1 = [
[1, 0, 0],
[0, 1, 0],
[aX, aY, 1]
];
setM(this, matrixMultiply(m1, this.m_), false);
};
contextPrototype.rotate = function(aRot) {
var c = mc(aRot);
var s = ms(aRot);
var m1 = [
[c, s, 0],
[-s, c, 0],
[0, 0, 1]
];
setM(this, matrixMultiply(m1, this.m_), false);
};
contextPrototype.scale = function(aX, aY) {
this.arcScaleX_ *= aX;
this.arcScaleY_ *= aY;
var m1 = [
[aX, 0, 0],
[0, aY, 0],
[0, 0, 1]
];
setM(this, matrixMultiply(m1, this.m_), true);
};
contextPrototype.transform = function(m11, m12, m21, m22, dx, dy) {
var m1 = [
[m11, m12, 0],
[m21, m22, 0],
[dx, dy, 1]
];
setM(this, matrixMultiply(m1, this.m_), true);
};
contextPrototype.setTransform = function(m11, m12, m21, m22, dx, dy) {
var m = [
[m11, m12, 0],
[m21, m22, 0],
[dx, dy, 1]
];
setM(this, m, true);
};
/******** STUBS ********/
contextPrototype.clip = function() {
// TODO: Implement
};
contextPrototype.arcTo = function() {
// TODO: Implement
};
contextPrototype.createPattern = function() {
return new CanvasPattern_;
};
// Gradient / Pattern Stubs
function CanvasGradient_(aType) {
this.type_ = aType;
this.x0_ = 0;
this.y0_ = 0;
this.r0_ = 0;
this.x1_ = 0;
this.y1_ = 0;
this.r1_ = 0;
this.colors_ = [];
}
CanvasGradient_.prototype.addColorStop = function(aOffset, aColor) {
aColor = processStyle(aColor);
this.colors_.push({offset: aOffset,
color: aColor.color,
alpha: aColor.alpha});
};
function CanvasPattern_() {}
// set up externs
G_vmlCanvasManager = G_vmlCanvasManager_;
CanvasRenderingContext2D = CanvasRenderingContext2D_;
CanvasGradient = CanvasGradient_;
CanvasPattern = CanvasPattern_;
})();
} // if
if (dhtmlx && dhtmlx._modules)
dhtmlx._modules["thirdparty/excanvas/excanvas.js"] = true;

View File

@ -0,0 +1,7 @@
dhtmlxChart v.2.6 Standard edition build 100928
This component is allowed to use under GPL or you need to obtain Commercial or Enterise License
to use it in not GPL project. PLease contact sales@dhtmlx.com for details
(c) DHTMLX Ltd.

View File

@ -0,0 +1,70 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Data Loading: XML</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<style>
.dhx_chart_title{
padding-left:3px
}
</style>
<script>
var barChart;
window.onload=function(){
barChart = new dhtmlXChart({
view:"bar",
container:document.getElementById("chart_container"),
value:"#sales#",
label:"#year#",
padding:{
bottom:0,
right:0,
left:0
},
width:30,
gradient:true,
border:false
})
barChart.load("../common/sales.xml");
var barChart2 = new dhtmlXChart({
view:"pie",
container:"chart_container2",
value:"#sales#",
details:"#year#"
});
barChart2.load("../common/sales.xml");
}
function reloada(){
barChart.destructor();
barChart = new dhtmlXChart({
view:"pie",
container:"chart_container",
value:"#sales#",
details:"#year#"
})
barChart.load("../common/sales.xml");
}
</script>
</head>
<body>
<p>Chart data can be loaded from different sources: xml,json,JS array,csv<br/> This samples demonstrates loading from xml file.</p>
<div id="chart_container" style="width:450px;height:300px;border:1px solid #A4BED4;float:left;margin-right:20px"></div>
<div id="chart_container2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
<input type="button" name="some_name" value="reload" onclick="reloada()">
</body>
</html>

View File

@ -0,0 +1,63 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Data Loading: JSON</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<style>
.dhx_chart_title{
padding-left:3px
}
</style>
<script>
var data = [
{ value:"2.9", label:"2000" },
{ value:"3.5", label:"2001" },
{ value:"3.1", label:"2002" },
{ value:"4.2", label:"2003" },
{ value:"4.5", label:"2004" },
{ value:"9.6", label:"2005" },
{ value:"7.4", label:"2006" },
{ value:"9.0", label:"2007" },
{ value:"7.3", label:"2008" },
{ value:"2.8", label:"2009" }
];
window.onload = function(){
var barChart = new dhtmlXChart({
view:"bar",
container:"chart_container",
label:"#label#",
padding:{
bottom:0,
right:0,
left:0
},
width:30,
gradient:true,
border:false
})
barChart.parse(data,"json");
var barChart2 = new dhtmlXChart({
view:"pie",
container:"chart_container2",
details:"#label#"
});
barChart2.parse(data,"json");
}
</script>
</head>
<body>
<div id="chart_container" style="width:450px;height:300px;border:1px solid #A4BED4;float:left;margin-right:20px"></div>
<div id="chart_container2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
</body>
</html>

View File

@ -0,0 +1,65 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Data Loading: CSV</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<style>
.dhx_chart_title{
padding-left:3px
}
</style>
<script>
var data = "\
2.9, 2000\n\
3.5, 2001\n\
3.1, 2002\n\
4.2, 2003\n\
4.5, 2004\n\
9.6, 2005\n\
7.4, 2006\n\
9.0, 2007\n\
7.3, 2008\n\
2.8, 2009";
window.onload = function(){
var barChart = new dhtmlXChart({
view:"bar",
container:"chart_container",
value:"#data0#",
label:"#data1#",
padding:{
bottom:0,
right:0,
left:0
},
width:30,
gradient:true,
border:false
})
barChart.parse(data,"csv");
var barChart2 = new dhtmlXChart({
view:"pie",
container:"chart_container2",
value:"#data0#",
details:"#data1#"
});
barChart2.parse(data,"csv");
}
</script>
</head>
<body>
<p>When data are loaded from CSV string, you should use "data" and field index to define field in the template, for example, "#data0#","#data1#",etc.<br/>Charts in this sample represents values in the first column. Therefore, we have set value:"#data0#" in a chart contructor.</p>
<div id="chart_container" style="width:450px;height:300px;border:1px solid #A4BED4;float:left;margin-right:20px"></div>
<div id="chart_container2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
</body>
</html>

View File

@ -0,0 +1,68 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Data Loading: JS array</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<style>
.dhx_chart_title{
padding-left:3px
}
</style>
<script>
var data = [
[ "2.9", "2000" ],
[ "3.5", "2001" ],
[ "3.1", "2002" ],
[ "4.2", "2003" ],
[ "4.5", "2004" ],
[ "9.6", "2005" ],
[ "7.4", "2006" ],
[ "9.0", "2007" ],
[ "7.3", "2008" ],
[ "2.8", "2009" ]
];
window.onload = function(){
var barChart = new dhtmlXChart({
view:"bar",
container:"chart_container",
value:"#data0#",
label:"#data1#",
padding:{
bottom:0,
right:0,
left:0
},
width:30,
gradient:true,
border:false
})
barChart.parse(data,"jsarray");
var barChart2 = new dhtmlXChart({
view:"pie",
container:"chart_container2",
value:"#data0#",
details:"#data1#"
});
barChart2.parse(data,"jsarray");
}
</script>
</head>
<body>
<p>When data are loaded from JS array, you should use "data" and field index to define field in the template, for example, "#data0#","#data1#",etc.<br/>Charts in this sample represents values in the first column. Therefore, we have set value:"#data0#" in a chart contructor.</p>
<div id="chart_container" style="width:450px;height:300px;border:1px solid #A4BED4;float:left;margin-right:20px"></div>
<div id="chart_container2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
</body>
</html>

View File

@ -0,0 +1,119 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>PieChart: Initiazation</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
</head>
<body >
<h1>BarChart: Scales</h1>
<table>
<tr>
<td>Automatic vertical scale</td>
<td>Custom vertical scale</td>
</tr>
<tr>
<td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart2" style="width:350px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
<script>
var data = [
{ sales:"3.0",sales1:"3.4",sales2:"1.2",sales3:"6.9", year:"2000" },
{ sales:"3.8",sales1:"4.5",sales2:"2.5",sales3:"7.5", year:"2001" },
{ sales:"3.4",sales1:"4.7",sales2:"1.9",sales3:"5.5", year:"2002" }
];
var barChart1 = new dhtmlXChart({
view:"bar",
container:"chart1",
value:"#sales#",
label:"#sales#",
width:30,
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Sales per year",
template:"#year#"
},
yAxis:{
title:"Sales,million"
},
gradient:true,
border:false,
color: "#66cc33"
})
barChart1.addSeries({
value:"#sales1#",
color:"#ff9933",
label:"#sales1#"
});
barChart1.addSeries({
value:"#sales2#",
color:"#ffff99",
label:"#sales2#"
});
barChart1.parse(data,"json");
var barChart2 = new dhtmlXChart({
view:"bar",
container:"chart2",
value:"#sales#",
gradient:true,
border:false,
width:30,
color: "#66cc33",
label:"#sales#",
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Years",
template:"#year#"
},
yAxis:{
start: 0,
end: 10,
step: 1,
title:"Sales, mil"
}
});
barChart2.addSeries({
value:"#sales1#",
color:"#ff9933",
label:"#sales1#"
});
barChart2.addSeries({
value:"#sales2#",
color:"#ffff99",
label:"#sales2#"
});
barChart2.addSeries({
value:"#sales3#",
color:"#ccff99",
label:"#sales3#"
});
barChart2.parse(data,"json");
</script>
</body>
</html>

View File

@ -0,0 +1,66 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Colors: default</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<style>
.dhx_chart_title{
padding-left:3px
}
</style>
<script>
var data = [
{ sales:"2.9", year:"2000" },
{ sales:"3.5", year:"2001" },
{ sales:"3.1", year:"2002" },
{ sales:"4.2", year:"2003" },
{ sales:"4.5", year:"2004" },
{ sales:"9.6", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
window.onload = function(){
var barChart = new dhtmlXChart({
view:"bar",
container:"chart_container",
value:"#sales#",
label:"#year#",
padding:{
bottom:0,
right:0,
left:0
},
width:30
})
barChart.parse(data,"json");
var barChart2 = new dhtmlXChart({
view:"pie",
container:"chart_container2",
value:"#sales#",
details:"#year#"
});
barChart2.parse(data,"json");
}
</script>
</head>
<body>
<p>Chart colors are defined by color property. If it is not set, chart is colored using "rainbow" algorithm.</p>
<div id="chart_container" style="width:450px;height:300px;border:1px solid #A4BED4;float:left;margin-right:20px"></div>
<div id="chart_container2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
</body>
</html>

View File

@ -0,0 +1,67 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Colors: custom colors</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<style>
.dhx_chart_title{
padding-left:3px
}
</style>
<script>
var data = [
{ sales:"2.9", year:"2000", color:"#0000FF" },
{ sales:"3.5", year:"2001", color:"#00FF00"},
{ sales:"3.1", year:"2002", color:"#00FFFF"},
{ sales:"4.2", year:"2003", color:"#FF0000"},
{ sales:"4.5", year:"2004", color:"#FF00FF"},
{ sales:"9.6", year:"2005", color:"#FFFF00"},
{ sales:"7.4", year:"2006", color:"#880088"},
{ sales:"9.0", year:"2007", color:"#008800"},
{ sales:"7.3", year:"2008", color:"#880000"},
{ sales:"4.8", year:"2009", color:"#000088"}
];
window.onload = function(){
var barChart = new dhtmlXChart({
view:"bar",
container:"chart_container",
value:"#sales#",
label:"#year#",
color:"#color#",
padding:{
bottom:0,
right:0,
left:0
},
width:30
})
barChart.parse(data,"json");
var barChart2 = new dhtmlXChart({
view:"pie",
container:"chart_container2",
value:"#sales#",
details:"#year#",
color:"#color#"
});
barChart2.parse(data,"json");
}
</script>
</head>
<body>
<p>Colors can be defined with template. In this sample colors and defined in data by "color" field.</p>
<div id="chart_container" style="width:450px;height:300px;border:1px solid #A4BED4;float:left;margin-right:20px"></div>
<div id="chart_container2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
</body>
</html>

View File

@ -0,0 +1,77 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Colors: custom logic</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<style>
.dhx_chart_title{
padding-left:3px
}
</style>
<script>
var data = [
{ sales:"2.9", year:"2000" },
{ sales:"3.5", year:"2001" },
{ sales:"3.1", year:"2002" },
{ sales:"4.2", year:"2003" },
{ sales:"4.5", year:"2004" },
{ sales:"9.6", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
window.onload = function(){
var barChart = new dhtmlXChart({
view:"bar",
container:"chart_container",
value:"#sales#",
label:"#year#",
width:30,
padding:{
bottom:0,
right:0,
left:0
},
gradient:true,
border:false,
color:function(obj){
if (obj.sales > 5) return "#FF0000";
else return "#00FF00";
}
})
barChart.parse(data,"json");
var index = 1;
var barChart2 = new dhtmlXChart({
view:"pie",
container:"chart_container2",
value:"#sales#",
label:"#year#",
gradient:true,
color:function(obj,ratio){
index++;
if (index % 2) return "#FF0000";
return "#00FF00";
}
});
barChart2.parse(data,"json");
}
</script>
</head>
<body>
<p>Colors can be defined using function. In this sample color of bars depends on sales value, and colors of pie sectors are alternative.</p>
<div id="chart_container" style="width:450px;height:300px;border:1px solid #A4BED4;float:left;margin-right:20px""></div>
<div id="chart_container2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
</body>
</html>

View File

@ -0,0 +1,64 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Colors: color gradient</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<style>
.dhx_chart_title{
padding-left:3px
}
</style>
<script>
var data = [
{ sales:"2.9", year:"2000" },
{ sales:"3.5", year:"2001" },
{ sales:"3.1", year:"2002" },
{ sales:"4.2", year:"2003" },
{ sales:"4.5", year:"2004" },
{ sales:"9.6", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
window.onload = function(){
var barChart = new dhtmlXChart({
view:"bar",
container:"chart_container",
value:"#sales#",
label:"#year#",
padding:{
bottom:0,
right:0,
left:0
},
width:30,
gradient:function(gradient){
gradient.addColorStop(1.0,"#FF0000");
gradient.addColorStop(0.2,"#FFFF00");
gradient.addColorStop(0.0,"#00FF22");
}
})
barChart.parse(data,"json");
}
</script>
</head>
<body>
<p>The color of Bar Chart can be defined by gradient property. <br/>
In this case you should set a function that takes a gradient object as an argument. And using addColorStop you may define colors for chart.</p>
<div id="chart_container" style="width:500px;height:300px;border:1px solid #A4BED4;"></div>
</body>
</html>

View File

@ -0,0 +1,96 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Grouping and Sorting</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<style>
.dhx_chart_title{
padding-left:3px
}
</style>
<script>
var barChart;
window.onload = function(){
barChart = new dhtmlXChart({
view:"bar",
container:"chart_container",
value:"#sales#",
color:"#b3e025",
gradient:true,
border:false,
width:70,
label:"#id#",
sort:{
by:"#id#",
as:"string",
dir:"asc"
},
group:{
by:"#year#",
map:{
sales:["#sales#","sum"]
}
},
padding:{
bottom:0
}
})
barChart.load("../common/stat.xml");
}
function groupA(){
barChart.group({
by:"#company#",
map:{
sales:["#sales#","sum"]
}
});
barChart.refresh();
}
function groupB(){
barChart.group({
by:"#year#",
map:{
sales:["#sales#","sum"]
}
});
}
function groupC(){
barChart.group({
by:"#year#",
map:{
sales:["#sales#","max"]
}
});
}
</script>
</head>
<body>
<p>It's possible to group chart data by a certain property. You may use group method or group property in a chart constructor.</p>
<div id="chart_container" style="width:600px;height:300px;border:1px solid #A4BED4;"></div>
<br/>
<input type="button" name="some_name" value="Group by" onclick="window['group'+document.getElementById('groupby').value]()">
<select name="groupby" id="groupby">
<option value="A">company</option>
<option value="B" SELECTED>year (total sales)</option>
<option value="C">year (max sales)</option>
</select>
</body>
</html>

View File

@ -0,0 +1,126 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Scales and grouping</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<style>
.dhx_chart_title{
padding-left:3px
}
</style>
<script>
var barChart;
window.onload = function(){
barChart = new dhtmlXChart({
view:"bar",
container:"chart_container",
value:"#sales#",
color:"#b3e025",
gradient:true,
border:false,
width:70,
yAxis:{},
xAxis:{
template:"#id#",
title:"Sales per year (all companies)"
},
label:"#sales#",
sort:{
by:"#id#",
as:"string",
dir:"asc"
},
group:{
by:"#year#",
map:{
sales:["#sales#","sum"]
}
}
})
barChart.load("../common/stat.xml");
}
function groupA(){
barChart.define("xAxis",{
template:"#id#",
title:"Total sales per companies"
});
barChart.define("yAxis",{});
barChart.group({
by:"#company#",
map:{
sales:["#sales#","sum"]
}
});
barChart.refresh();
}
function groupB(){
barChart.define("xAxis",{
template:"#id#",
title:"Sales per year (all companies)"
});
barChart.define("yAxis",{});
barChart.group({
by:"#year#",
map:{
sales:["#sales#","sum"]
}
});
}
function groupC(){
barChart.define("xAxis",{
template:"#id#",
title:"Maximum sales per year"
});
barChart.define("yAxis",{});
barChart.group({
by:"#year#",
map:{
sales:["#sales#","max"]
}
});
}
function sort(direction){
barChart.define("sort",{
by:"#sales#",
dir:direction,
as:"int"
});
barChart.render();
}
</script>
</head>
<body>
<p>To update configuration properties after grouping you need to cal define method with new settings.</p>
<div id="chart_container" style="width:600px;height:300px;border:1px solid #A4BED4;"></div>
<br/>
<input type="button" name="some_name" value="Group by" onclick="window['group'+document.getElementById('groupby').value]()">
<select name="groupby" id="groupby">
<option value="A">company</option>
<option value="B" SELECTED>year (total sales)</option>
<option value="C">year (max sales)</option>
</select>
<br/><br/>
<input type="button" name="some_name" value="Sort by sales" onclick="sort(document.getElementById('dir').value)">
<select name="dir" id="dir">
<option value="asc" selected>asc</option>
<option value="desc" >desc</option>
</select>
</body>
</html>

View File

@ -0,0 +1,67 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Initialization</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ sales:"6300", company:"Company 1",color:"#d2ed7e" },
{ sales:"8700", company:"Company 2",color:"#b3e025" },
{ sales:"10500", company:"Company 3",color:"#9ac86d" },
{ sales:"7800", company:"Company 4",color:"#e0e56c" }
];
window.onload = function(){
var chart = new dhtmlXChart({
view:"pie",
container:"chart1",
value:"#sales#",
color:"#color#",
label:"#company#",
pieInnerText:"<b>#sales#</b>",
gradient:true
});
chart.parse(data,"json");
var chart2 = new dhtmlXChart({
view:"pie",
container:"chart2",
value:"#sales#",
color:"#color#",
label:"#company#",
pieInnerText:"<b>#sales#</b>",
gradient:true,
radius:90,
x:280,
y:150
});
chart2.parse(data,"json");
}
</script>
</head>
<body >
<table>
<tr>
<td>Pie chart with Automatic radius and center position</td>
<td>Pie chart with Custom radius and center position</td>
</tr>
<tr>
<td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
</body>
</html>

View File

@ -0,0 +1,52 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Labels</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"10.7", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
window.onload = function(){
var pieChart = new dhtmlXChart({
view:"pie",
container:"chart",
value:"#sales#",
pieInnerText:"#sales#",
label:"#year#"
});
pieChart.parse(data,"json");
}
</script>
</head>
<body >
<p>There are two properties to define sectors labels:
<li>label - defines text outside sectors</li>
<li>pieInnerText - set text inside sectors</li>
</p>
<div id="chart" style="width:450px;height:300px;"></div></td>
</body>
</html>

View File

@ -0,0 +1,48 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>3D view</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ sales:"10.5", component:"dhxGrid",color:"#c7e1f3" },
{ sales:"8.7", component:"dhxScheduler",color:"#45abf5" },
{ sales:"6.3", component:"dhxTree",color:"#3590d0" },
{ sales:"5.3", component:"dhxTabbar",color:"#BDDBF9" },
{ sales:"4.5", component:"dhxLayout",color:"#d9e5ed" },
{ sales:"4.2", component:"dhxMenu",color:"#aed7f4" }
];
window.onload = function(){
var chart = new dhtmlXChart({
view:"pie3D",
container:"chart",
value:"#sales#",
label:function(obj){
var sum = chart.sum("#sales#");
return obj.component+" ("+Math.round(parseFloat(obj.sales)/sum*100)+"%)";
},
color:"#color#",
radius:110
});
chart.parse(data,"json");
}
</script>
</head>
<body>
<div id="chart" style="width:500px;height:300px;border:1px solid #A4BED4;"></div></td>
</body>
</html>

View File

@ -0,0 +1,81 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Details Block</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"9.9", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
window.onload = function(){
var pieChart = new dhtmlXChart({
view:"pie",
container:"chart1",
value:"#sales#",
pieInnerText:"#sales#",
gradient:true,
tooltip:{
template:"#sales#"
},
legend:"#year#"
});
pieChart.parse(data,"json");
var pieChart2 = new dhtmlXChart({
view:"pie",
container:"chart2",
value:"#sales#",
pieInnerText:"#sales#",
gradient:true,
legend:{
width: 75,
align:"right",
valign:"middle",
marker:{
type:"round",
width:15
},
template:"#year#"
}
});
pieChart2.parse(data,"json");
}
</script>
</head>
<body>
<p>Pie Chart provides property "details" that displayes informationa about all sectors in a separate block.</p>
<table>
<tr>
<td>PieChart with default details block</td>
<td>PieChart with custom details block</td>
</tr>
<tr>
<td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
</body>
</html>

View File

@ -0,0 +1,55 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Initialization</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"9.9", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
window.onload = function(){
var chart = new dhtmlXChart({
view:"line",
container:"chart",
value:"#sales#",
label:"#year#",
tooltip:{
template:"#sales#"
},
item:{
borderColor: "#ffffff",
color: "#000000"
},
line:{
color:"#ff9900",
width:3
}
})
chart.parse(data,"json");
}
</script>
</head>
<body>
<div id="chart" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
</body>
</html>

View File

@ -0,0 +1,153 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Style definition</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
window.onload = function(){
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"9.9", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
var chart1 = new dhtmlXChart({
view:"line",
container:"chart1",
value:"#sales#",
label:"#year#",
tooltip:{
template:"#sales#"
},
item:{
borderColor: "#ffffff",
color: "#000000"
},
line:{
color:"#ff9900",
width:3
}
})
chart1.parse(data,"json");
var chart2 = new dhtmlXChart({
view:"line",
container:"chart2",
value:"#sales#",
label:"#year#",
tooltip:{
template:"#sales#"
},
item:{
borderColor: "#3399ff",
color: "#ffffff"
},
line:{
color:"#3399ff",
width:3
}
})
chart2.parse(data,"json");
var data2 = [
{ sales:"1.2", year:"2000" },
{ sales:"2.4", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"5.9", year:"2005" },
{ sales:"6.5", year:"2006" },
{ sales:"6.1", year:"2007" },
{ sales:"6.0", year:"2008" },
{ sales:"6.2", year:"2009" }
];
var chart3 = new dhtmlXChart({
view:"line",
container:"chart3",
value:"#sales#",
item:{
radius:0
},
line:{
color:"#b25151",
width:3
},
xAxis:{
title:"Years",
template:"#year#",
lines:true
},
yAxis:{
start: 0,
end: 10,
step: 1,
title:"Sales, mil"
},
tooltip:{
template:"#year#"
}
})
chart3.parse(data2,"json");
var chart4 = new dhtmlXChart({
view:"line",
container:"chart4",
value:"#sales#",
item:{
borderColor: "#000000",
color: "#ffffff",
borderWidth:1,
radius:3
},
line:{
color:"#3399ff",
width:3
},
xAxis:{
title:"Years",
template:"#year#"
},
yAxis:{
start: 0,
end: 10,
step: 1,
title:"Sales, mil",
lines:false
},
tooltip:{
template:"#year#"
}
})
chart4.parse(data2,"json");
}
</script>
</head>
<body >
<table>
<tr>
<td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
<tr>
<td><div id="chart3" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart4" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
</body>
</html>

View File

@ -0,0 +1,101 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Scales</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"9.9", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
window.onload = function(){
var chart1 = new dhtmlXChart({
view:"line",
container:"chart1",
value:"#sales#",
label:"#sales#",
tooltip:{
template:"#sales#"
},
item:{
borderColor: "#ffffff",
color: "#000000"
},
line:{
color:"#ff9900",
width:3
},
yAxis:{},
xAxis:{
title:"Years",
template:"#year#"
}
})
chart1.parse(data,"json");
var chart2 = new dhtmlXChart({
view:"line",
container:"chart2",
value:"#sales#",
tooltip:{
template:"#sales#"
},
item:{
borderColor: "#3399ff",
color: "#ffffff"
},
line:{
color:"#3399ff",
width:3
},
xAxis:{
title:"Years",
template:"#year#"
},
yAxis:{
start:0,
end:10,
step:1,
title:"Sales, million"
},
item:{
borderColor: "#3399ff",
color: "#ffffff"
}
})
chart2.parse(data,"json");
}
</script>
</head>
<body >
<table>
<tr>
<td>Automatic vertical scale</td>
<td>Custom vertical scale</td>
</tr>
<tr>
<td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
</body>
</html>

View File

@ -0,0 +1,57 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Initialization</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"9.9", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
window.onload = function(){
var chart = new dhtmlXChart({
view:"spline",
container:"chart",
value:"#sales#",
label:"#year#",
tooltip:{
template:"#sales#"
},
item:{
borderColor: "#ffffff",
color: "#000000"
},
line:{
color:"#ff9900",
width:3
},
padding:{
left:15
}
})
chart.parse(data,"json");
}
</script>
</head>
<body>
<div id="chart" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
</body>
</html>

View File

@ -0,0 +1,94 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Scales</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ "companyA":"-1.9", "companyB":1, year:"2000" },
{ "companyA":"-0.8", "companyB":0.8, year:"2001" },
{ "companyA":"3.4", "companyB":1.9, year:"2002" },
{ "companyA":"4.1", "companyB":2.5, year:"2003" },
{ "companyA":"4.3", "companyB":3.1, year:"2004" },
{ "companyA":"5.9", "companyB":4.5, year:"2005" },
{ "companyA":"6.1", "companyB":5.7, year:"2006" },
{ "companyA":"6.5", "companyB":7.2, year:"2007" },
{ "companyA":"5.2", "companyB":6.5, year:"2008" },
{ "companyA":"4.8", "companyB":6.8, year:"2009" }
];
window.onload = function(){
var chart1 = new dhtmlXChart({
view:"line",
container:"chart1",
value:"#companyA#",
item:{
borderColor: "#3399ff",
color: "#ffffff"
},
line:{
color:"#3399ff",
width:3
},
xAxis:{
template:"#year#"
},
yAxis:{
start:-2,
step:1,
end:8
},
padding:{
left:35,
bottom:20
},
origin:0,
legend:{
layout:"x",
width: 75,
align:"center",
valign:"bottom",
marker:{
type:"round",
width:15
},
values:[
{text:"company A",color:"#3399ff"},
{text:"company B",color:"#66cc00"}
]
}
})
chart1.addSeries({
value:"#companyB#",
item:{
borderColor: "#66cc00",
color: "#ffffff"
},
line:{
color:"#66cc00",
width:3
}
})
chart1.parse(data,"json");
}
</script>
</head>
<body >
<table>
<tr>
<td><div id="chart1" style="width:500px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
</body>
</html>

View File

@ -0,0 +1,74 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>PieChart: Initiazation</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"9.9", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
window.onload = function(){
var barChart1 = new dhtmlXChart({
view:"bar",
container:"chart1",
value:"#sales#",
label:"#year#",
width:30,
gradient:true,
border:false
})
barChart1.parse(data,"json");
var barChart2 = new dhtmlXChart({
view:"bar",
container:"chart2",
value:"#sales#",
label:"#sales#",
color:"#66ccff",
gradient:"3d",
//border:false,
width:25,
padding:{
bottom:0,
right:50,
left:50
}
});
barChart2.parse(data,"json");
}
</script>
</head>
<body >
<h1>BarChart: Initiazation</h1>
<table>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
</body>
</html>

View File

@ -0,0 +1,80 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>PieChart: Initiazation</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
</head>
<body >
<h1>BarChart: Initiazation</h1>
<table>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"9.9", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
var barChart1 = new dhtmlXChart({
view:"bar",
container:"chart1",
value:"#sales#",
label:"#sales#",
color:"#66cc33",
width:50,
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Sales per year",
template:"#year#"
}
})
barChart1.parse(data,"json");
var barChart2 = new dhtmlXChart({
view:"bar",
container:"chart2",
value:"#sales#",
label:"#sales#",
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Years",
template:"#year#"
}
});
barChart2.parse(data,"json");
</script>
</body>
</html>

View File

@ -0,0 +1,99 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>PieChart: Initiazation</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
</head>
<body >
<h1>BarChart: Scales</h1>
<table>
<tr>
<td>Custom vertical scale and origin</td>
<td>Automatic vertical scale</td>
</tr>
<tr>
<td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
<script>
var data = [
{ sales:"-2.0", year:"2000" },
{ sales:"-0.4", year:"2001" },
{ sales:"1.1", year:"2002" },
{ sales:"3.3", year:"2003" },
{ sales:"1.2", year:"2004" },
{ sales:"1.8", year:"2005" },
{ sales:"4.1", year:"2006" },
{ sales:"5.5", year:"2007" },
{ sales:"3.5", year:"2008" },
{ sales:"1.8", year:"2009" }
];
var barChart1 = new dhtmlXChart({
view:"bar",
container:"chart1",
value:"#sales#",
width:30,
tooltip:{
template:"#sales#"
},
xAxis:{
template:"#year#",
title:"Year"
},
yAxis:{
start:-3,
end:7,
step:1,
title:"Profit"
},
origin:0,
gradient:true,
border:false
})
barChart1.parse(data,"json");
var barChart2 = new dhtmlXChart({
view:"bar",
container:"chart2",
value:"#sales#",
gradient:true,
border:false,
width:30,
tooltip:{
template:"#sales#"
},
xAxis:{
template:"#year#",
title:"Year"
},
yAxis:{
title:"Profit"
}
});
barChart2.parse(data,"json");
</script>
</body>
</html>

View File

@ -0,0 +1,207 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Chart</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
</head>
<body >
<h1>Chart</h1>
<table>
<tr>
<td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart3" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
<tr>
</tr>
<tr>
<td><div id="chart4" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart5" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart6" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"9.9", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
var barChart1 = new dhtmlXChart({
view:"bar",
alpha:function(data){
return data.sales/10;
},
container:"chart1",
value:"#sales#",
label:"#sales#",
color:"#66cc33",
width:50,
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Sales per year",
template:"#year#"
},
yAxis:{
start:0,
end:10,
step:1,
title:"Sales, million"
}
})
barChart1.parse(data,"json");
var barChart2 = new dhtmlXChart({
view:"bar",
container:"chart2",
value:"#sales#",
label:"#sales#",
width:2,
border:false,
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Years",
template:"#year#"
},
yAxis:{
start:0,
end:10,
step:1,
title:"Sales,<br/>million"
}
})
barChart2.parse(data,"json");
var barChart3 = new dhtmlXChart({
view:"bar",
container:"chart3",
value:"#sales#",
label:"#sales#",
width:35,
border:false,
gradient:true,
xAxis:{
title:"Sales per year",
template:"#year#"
},
yAxis:{
start:0,
end:10,
step:1,
title:"Sales,<br/>million"
}
});
barChart3.parse(data,"json");
var barChart4 = new dhtmlXChart({
view:"bar",
alpha:function(data){
return data.sales/10;
},
container:"chart4",
value:"#sales#",
label:"#sales#",
width:50,
gradient:function(gradient){
gradient.addColorStop(1.0,"#FF0000");
gradient.addColorStop(0.3,"#FFFF00");
gradient.addColorStop(0.0,"#00FF22");
},
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Sales per year",
template:"#year#"
},
yAxis:{
start:0,
end:10,
step:1,
title:"Sales,<br/>million"
}
})
barChart4.parse(data,"json");
var barChart5 = new dhtmlXChart({
view:"bar",
container:"chart5",
value:"#sales#",
label:"#sales#",
width:35,
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Sales per year",
template:"#year#"
},
yAxis:{
start:0,
end:10,
step:1,
title:"Sales,<br/>million"
}
})
barChart5.parse(data,"json");
var barChart6 = new dhtmlXChart({
view:"bar",
alpha:function(data){
return data.sales/10;
},
container:"chart6",
value:"#sales#",
label:"#sales#",
color:"#66cc33",
border:false,
width:30,
radius:0,
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Sales per year",
template:"#year#"
},
yAxis:{
start:0,
end:10,
step:1,
title:"Sales,<br/>million"
}
})
barChart6.parse(data,"json");
</script>
</body>
</html>

View File

@ -0,0 +1,87 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>StackedBar Chart</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
</head>
<body onload="init()">
<h1>StackedBar Chart</h1>
<div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
<script>
var data = [
{ sales:"3.0",sales1:"3.4",sales2:"1.2",sales3:"6.9", year:"2000" },
{ sales:"5.0",sales1:"5.0",sales2:"5.0",sales3:"5.0", year:"2001" },
{ sales:"3.4",sales1:"4.7",sales2:"1.9",sales3:"5.5", year:"2002" }
];
function init(){
var barChart1 = new dhtmlXChart({
view:"stackedBar",
container:"chart1",
value:"#sales#",
label:"#sales#",
width:60,
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Sales per year",
template:"#year#"
},
yAxis:{
title:"Sales,million"
},
gradient:"3d",
//border:false,
color: "#66cc33",
legend:{
values:[{text:"department A",color:"#66cc33"},{text:"department B",color:"#ff9933"},{text:"department C",color:"#ffff99"},{text:"department D",color:"#66ffcc"}],
valign:"top",
align:"right",
width:120,
layout:"y",
marker:{
width:15,
type:"round"
}
}
})
barChart1.addSeries({
value:"#sales1#",
color:"#ff9933",
label:"#sales1#",
tooltip:{
template:"#sales1#"
}
});
barChart1.addSeries({
value:"#sales2#",
color:"#ffff99",
label:"#sales2#",
tooltip:{
template:"#sales2#"
}
});
barChart1.addSeries({
value:"#sales3#",
color:"#66ffcc",
label:"#sales3#",
tooltip:{
template:"#sales3#"
}
});
barChart1.parse(data,"json");
}
</script>
</body>
</html>

View File

@ -0,0 +1,81 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Series</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
</head>
<body >
<h1>Series</h1>
<div id="chart" style="width:500px;height:300px;border:1px solid #A4BED4;"></div>
<script>
var data = [
{ sales:"4.2",sales1:"3.4",sales2:"1.2", year:"2000" },
{ sales:"3.8",sales1:"4.5",sales2:"2.5", year:"2001" },
{ sales:"3.4",sales1:"4.7",sales2:"1.9", year:"2002" }
];
var barChart = new dhtmlXChart({
view:"bar",
container:"chart",
value:"#sales#",
label:"#sales#",
width:30,
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Sales per year",
template:"#year#"
},
yAxis:{
start:0,
step:1,
end:5,
title:"Sales,million"
},
gradient:true,
border:false,
color: "#66cc33",
legend:{
values:[{text:"department A",color:"#66cc33"},{text:"department B",color:"#ff9933"},{text:"department C",color:"#ffff99"}],
valign:"top",
align:"center",
width:120,
layout:"x",
marker:{
width:15,
type:"round"
}
}
})
barChart.addSeries({
value:"#sales1#",
color:"#ff9933",
label:"#sales1#"
});
barChart.addSeries({
value:"#sales2#",
color:"#ffff99",
label:"#sales2#"
});
barChart.parse(data,"json");
</script>
</body>
</html>

View File

@ -0,0 +1,120 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Horizontal bar Chart</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
</head>
<body >
<h3>Horizontal bar Chart</h3>
<table>
<tr>
<td><div id="chart1" style="width:450px;height:350px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart2" style="width:450px;height:350px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"9.9", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
var data2 = [
{ sales:"3.0",sales1:"3.4",sales2:"1.2",sales3:"6.9", year:"2007" },
{ sales:"3.8",sales1:"4.5",sales2:"2.5",sales3:"7.5", year:"2008" },
{ sales:"3.4",sales1:"4.7",sales2:"1.9",sales3:"5.5", year:"2009" }
];
var barChart1 = new dhtmlXChart({
view:"barH",
container:"chart1",
value:"#sales#",
width:50,
label: "#sales#",
gradient:"3d",
color:"#ffcc00",
xAxis:{
title:"Sales per year",
lines: true
},
yAxis:{
title:"Year",
template:"#year#"
},
padding:{
left:75,
right:30
}
})
barChart1.parse(data,"json");
var barChart2 = new dhtmlXChart({
view:"barH",
container:"chart2",
value:"#sales#",
label:"#sales#",
width:30,
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Sales per year"
},
yAxis:{
title:"Year",
template:"#year#"
},
gradient:true,
border:false,
color: "#66cc33",
legend:{
values:[{text:"department A",color:"#66cc33"},{text:"department B",color:"#ff9933"},{text:"department C",color:"#ffff99"}],
width:120,
align:"right",
valign:"middle",
marker:{
width:15,
type:"round"
}
},
padding:{
left:65
}
});
barChart2.addSeries({
value:"#sales1#",
color:"#ff9933",
label:"#sales1#"
});
barChart2.addSeries({
value:"#sales2#",
color:"#ffff99",
label:"#sales2#"
});
barChart2.parse(data2,"json");
</script>
</body>
</html>

View File

@ -0,0 +1,75 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Horizontal Stacked Bars</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ sales:"3.0",sales1:"3.4",sales2:"1.2",sales3:"6.9", year:"2007" },
{ sales:"5.0",sales1:"5.0",sales2:"5.0",sales3:"5.0", year:"2008" },
{ sales:"3.4",sales1:"4.7",sales2:"1.9",sales3:"5.5", year:"2009" }
];
window.onload = function(){
barChart = new dhtmlXChart({
view:"stackedBarH",
container:"chart",
value:"#sales#",
width:50,
label: "#sales#",
gradient:"3d",
color: "#66cc33",
xAxis:{
title:"Sales per year",
lines: false
},
yAxis:{
title:"Year",
template:"#year#"
},
padding:{left:75},
legend:{
values:[{text:"department A",color:"#66cc33"},{text:"department B",color:"#ff9933"},{text:"department C",color:"#ffff66"},{text:"department D",color:"#66ffcc"}],
valign:"top",
align:"left",
width:120,
layout:"x",
marker:{
width:15,
type:"round"
}
}
})
barChart.addSeries({
value:"#sales1#",
color:"#ff9933",
label:"#sales1#"
});
barChart.addSeries({
value:"#sales2#",
color:"#ffff66",
label:"#sales2#"
});
barChart.addSeries({
value:"#sales3#",
color:"#66ffcc",
label:"#sales3#"
});
barChart.parse(data,"json");
}
</script>
</head>
<body>
<div id="chart" style="width:480px;height:350px;border:1px solid #A4BED4;"></div></td>
</body>
</html>

View File

@ -0,0 +1,55 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Initialization</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"7.6", year:"2005" },
{ sales:"7.8", year:"2006" },
{ sales:"7.2", year:"2007" },
{ sales:"5.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
window.onload = function(){
var chart = new dhtmlXChart({
view:"area",
container:"chart",
value:"#sales#",
label:"#year#",
color:"#00ccff",
tooltip:{
template:"#sales#"
},
alpha:0.8,
padding:{
left:0,
right:0,
bottom:0
}
})
chart.parse(data,"json");
}
</script>
</head>
<body>
<div id="chart" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
</body>
</html>

View File

@ -0,0 +1,101 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Scales</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<style>
.dhx_axis_item_x{
font-size: 10px
}
.dhx_axis_item_y{
font-size: 10px
}
</style>
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"7.6", year:"2005" },
{ sales:"7.8", year:"2006" },
{ sales:"7.2", year:"2007" },
{ sales:"5.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
window.onload = function(){
var chart1 = new dhtmlXChart({
view:"area",
container:"chart1",
value:"#sales#",
color:"#00ccff",
tooltip:{
template:"#sales#"
},
padding:{
left:30
},
yAxis:{
start:0,
step:1,
end:10
},
xAxis:{
lines:true,
title:"sales per year",
template:"#year#"
}
})
chart1.parse(data,"json");
var chart2 = new dhtmlXChart({
view:"area",
container:"chart2",
value:"#sales#",
tooltip:{
template:"#sales#"
},
color:"#00ccff",
xAxis:{
title:"sales per year",
template:"#year#"
},
yAxis:{
},
padding:{
left:30
},
item:{
borderColor: "#3399ff",
color: "#ffffff"
}
})
chart2.parse(data,"json");
}
</script>
</head>
<body >
<table>
<tr>
<td>Custom vertical scale</td>
<td>Automatic vertical scale</td>
</tr>
<tr>
<td><div id="chart1" style="width:470px;height:300px;border:1px solid #A4BED4;"></div></td>
<td><div id="chart2" style="width:470px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
</body>
</html>

View File

@ -0,0 +1,90 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Scales</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<style>
.dhx_axis_item_x{
font-size: 10px
}
.dhx_axis_item_y{
font-size: 10px
}
</style>
<script>
var data = [
{ sales:3.0, sales1:2.8, sales2:3.4, year:"2000" },
{ sales:3.8, sales1:2.5, sales2:2.0, year:"2001" },
{ sales:3.4, sales1:1.7, sales2:3.1, year:"2002" },
{ sales:4.1, sales1:2.7, sales2:3.5, year:"2003" },
{ sales:4.3, sales1:3.6, sales2:4.0, year:"2004" },
{ sales:7.6, sales1:3.1, sales2:4.9, year:"2005" },
{ sales:7.8, sales1:3.9, sales2:5.2, year:"2006" },
{ sales:7.2, sales1:3.6, sales2:5.6, year:"2007" },
{ sales:5.3, sales1:2.9, sales2:4.1, year:"2008" },
{ sales:4.8, sales1:2.1, sales2:3.9, year:"2009" }
];
window.onload = function(){
var chart1 = new dhtmlXChart({
view:"area",
container:"chart",
value:"#sales#",
color:"#00ccff",
alpha:0.6,
padding:{
left:30
},
yAxis:{
start:0,
step:1,
end:8
},
xAxis:{
lines:true,
title:"sales per year",
template:"#year#"
},
legend:{
layout:"x",
width: 75,
align:"center",
valign:"top",
marker:{
type:"round",
width:15
},
values:[
{text:"company A",color:"#00ccff"},
{text:"company B",color:"#0000ff"},
{text:"company C",color:"#cc33ff"}
]
}
})
chart1.addSeries({
value:"#sales1#",
color:"#0000ff"
})
chart1.addSeries({
value:"#sales2#",
color:"#cc33ff"
})
chart1.parse(data,"json");
}
</script>
</head>
<body >
<div id="chart" style="width:470px;height:300px;border:1px solid #A4BED4;"></div></td>
</body>
</html>

View File

@ -0,0 +1,88 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Scales</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<style>
.dhx_axis_item_x{
font-size: 10px
}
.dhx_axis_item_y{
font-size: 10px
}
</style>
<script>
var data = [
{ sales:3.0, sales1:2.8, sales2:3.9, year:"2000" },
{ sales:3.8, sales1:2.5, sales2:2.0, year:"2001" },
{ sales:3.4, sales1:1.7, sales2:3.1, year:"2002" },
{ sales:4.1, sales1:2.7, sales2:3.5, year:"2003" },
{ sales:4.3, sales1:3.6, sales2:4.0, year:"2004" },
{ sales:7.6, sales1:3.1, sales2:4.9, year:"2005" },
{ sales:7.8, sales1:3.9, sales2:5.2, year:"2006" },
{ sales:7.2, sales1:3.6, sales2:5.6, year:"2007" },
{ sales:5.3, sales1:2.9, sales2:4.1, year:"2008" },
{ sales:4.8, sales1:2.1, sales2:3.9, year:"2009" }
];
window.onload = function(){
var chart1 = new dhtmlXChart({
view:"stackedArea",
container:"chart",
value:"#sales#",
color:"#00ccff",
alpha:0.6,
padding:{
left:30
},
yAxis:{
},
xAxis:{
lines:true,
title:"sales per year",
template:"#year#"
},
legend:{
layout:"x",
width: 75,
align:"center",
valign:"top",
marker:{
type:"round",
width:15
},
values:[
{text:"company A",color:"#00ccff"},
{text:"company B",color:"#0000ff"},
{text:"company C",color:"#cc33ff"}
]
}
})
chart1.addSeries({
value:"#sales1#",
color:"#0000ff"
})
chart1.addSeries({
value:"#sales2#",
color:"#cc33ff"
})
chart1.parse(data,"json");
}
</script>
</head>
<body >
<div id="chart" style="width:470px;height:300px;border:1px solid #A4BED4;"></div></td>
</body>
</html>

View File

@ -0,0 +1,83 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Adding</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"9.9", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
var barChart1;
window.onload = function(){
barChart1 = new dhtmlXChart({
view:"bar",
container:"chart1",
value:"#sales#",
label:"#sales#",
color:"#b3e025",
gradient:true,
border:false,
width:50,
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Sales per year",
template:"#year#"
},
padding:{
top:20,
left:0,
right:0
}
});
barChart1.parse(data,"json");
}
var counter = 2010;
function add_new () {
barChart1.add({
year:counter,
sales:(Math.random()*5).toFixed(2)
});
counter++;
}
function delete_first(){
barChart1.remove(barChart1.first());
}
</script>
</head>
<body>
<table>
<tr>
<td><div id="chart1" style="width:750px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
<input type="button" value="add" onclick="add_new()">
<input type="button" value="delete" onclick="delete_first()">
</body>
</html>

View File

@ -0,0 +1,96 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Events</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"9.9", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
var barChart1;
window.onload = function(){
barChart1 = new dhtmlXChart({
view:"bar",
container:"chart1",
value:"#sales#",
label:"#sales#",
color:"#b3e025",
gradient:true,
border:false,
width:50,
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Sales per year",
template:"#year#"
},
padding:{
top:20,
left:0,
right:0
}
});
barChart1.parse(data,"json");
barChart1.attachEvent("onMouseMove", function(id){
id = barChart1.get(id).year;
log("onMouseMove", id);
return true;
});
barChart1.attachEvent("onMouseOut", function(id){
log("onMouseOut", id);
return true;
});
barChart1.attachEvent("onItemClick", function(id){
id = barChart1.get(id).year;
log("onItemClick", id);
return true;
});
barChart1.attachEvent("onItemDblClick", function(id){
id = barChart1.get(id).year;
log("onItemDblClick", id);
return true;
});
}
function log(name, id){
var t = document.createElement("DIV");
t.innerHTML = name+" for element "+id;
var p = document.getElementById("log_div");
p.insertBefore(t, p.firstChild);
}
</script>
</head>
<body>
<table>
<tr>
<td><div id="chart1" style="width:750px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
<div id="log_div" style="widht:950px; height:300px; font-family:Tahoma;overflow:auto"></div>
</body>
</html>

View File

@ -0,0 +1,73 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Sorting</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"9.9", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
var barChart1;
window.onload = function(){
barChart1 = new dhtmlXChart({
view:"bar",
container:"chart1",
value:"#sales#",
label:"#sales#",
color:"#b3e025",
gradient:true,
border:false,
width:50,
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Sales per year",
template:"#year#"
},
padding:{
top:20,
left:0,
right:0
}
});
barChart1.parse(data,"json");
}
</script>
</head>
<body >
<table>
<tr>
<td><div id="chart1" style="width:750px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
<input type="button" value="sort by sales, ASC" onclick="barChart1.sort('#sales#','asc');">
<input type="button" value="sort by sales, DESC" onclick="barChart1.sort('#sales#','desc');">
<input type="button" value="sort by year, ASC" onclick="barChart1.sort('#year#','asc');">
<input type="button" value="sort by year, DESC" onclick="barChart1.sort('#year#','desc');">
</body>
</html>

View File

@ -0,0 +1,81 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Filtering</title>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"9.9", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
window.onload = function(){
barChart = new dhtmlXChart({
view:"bar",
container:"chart1",
value:"#sales#",
label:"#sales#",
color:"#b3e025",
gradient:true,
border:false,
width:50,
tooltip:{
template:"#sales#"
},
xAxis:{
title:"Sales per year",
template:"#year#"
},
padding:{
top:30,
left:0,
right:0
}
});
barChart.parse(data,"json");
}
function filter_year(){
barChart.filter(function(obj){
return obj.year >2005;
})
}
function filter_sales(){
barChart.filter(function(obj){
return obj.sales < 8;
})
}
</script>
</head>
<body>
<table>
<tr>
<td><div id="chart1" style="width:750px;height:300px;border:1px solid #A4BED4;"></div></td>
</tr>
</table>
<input type="button" value="show all" onclick="barChart.filter();">
<input type="button" value="show year > 2005" onclick="filter_year()">
<input type="button" value="show sales < 8" onclick="filter_sales()">
</body>
</html>

View File

@ -0,0 +1,70 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Integration with grid</title>
<link rel='STYLESHEET' type='text/css' href='../../../dhtmlxGrid/codebase/dhtmlxgrid.css'>
<link rel='STYLESHEET' type='text/css' href='../../../dhtmlxGrid/codebase/skins/dhtmlxgrid_dhx_skyblue.css'>
<script src='../../../dhtmlxGrid/codebase/dhtmlxcommon.js'></script>
<script src='../../../dhtmlxGrid/codebase/dhtmlxgrid.js'></script>
<script src='../../../dhtmlxGrid/codebase/dhtmlxgridcell.js'></script>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var barChart;
window.onload = function(){
barChart = new dhtmlXChart({
view:"bar",
color:"#66ccff",
gradient:"3d",
container:"chart_container",
value:"#data0#",
label:"#data0#",
radius:3,
tooltip:{
template:"#data0#"
},
width:30,
origin:0,
yAxis:{},
xAxis:{
template:function(){return ""}
},
border:false
});
function refresh_chart(){
barChart.clearAll();
barChart.parse(mygrid,"dhtmlxgrid");
};
mygrid = new dhtmlXGridObject('gridbox');
mygrid.setImagePath('../../../dhtmlxGrid/codebase/imgs/');
mygrid.setSkin("dhx_skyblue")
mygrid.loadXML("../../../dhtmlxGrid/samples/common/gridH.xml",refresh_chart);
mygrid.attachEvent("onEditCell",function(stage){
if (stage == 2)
refresh_chart();
return true;
});
}
</script>
</head>
<body>
<div id="gridbox" style="width:600px; height:270px; background-color:white;"></div>
<hr>
<div id="chart_container" style="width:500px;height:300px;"></div>
</body>
</html>

View File

@ -0,0 +1,79 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Integration with Grid and Grouping</title>
<link rel='STYLESHEET' type='text/css' href='../../../dhtmlxGrid/codebase/dhtmlxgrid.css'>
<link rel='STYLESHEET' type='text/css' href='../../../dhtmlxGrid/codebase/skins/dhtmlxgrid_dhx_skyblue.css'>
<script src='../../../dhtmlxGrid/codebase/dhtmlxcommon.js'></script>
<script src='../../../dhtmlxGrid/codebase/dhtmlxgrid.js'></script>
<script src='../../../dhtmlxGrid/codebase/dhtmlxgridcell.js'></script>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script>
var barChart;
window.onload = function(){
barChart = new dhtmlXChart({
view:"bar",
container:"chart_container",
value:"#sales#",
label:"#sales#",
sort:{
by:"#sales#",
as:"int"
},
group:{
by:"#data2#",
map:{
author:["#data2#"],
sales:["#data0#","sum"]
}
},
xAxis:{
template:"#author#"
},
padding:{
left:0,
right:0
},
color:"#45abf5",
gradient:true,
width:50,
border:false
});
function refresh_chart(){
barChart.clearAll();
barChart.parse(mygrid,"dhtmlxgrid");
};
mygrid = new dhtmlXGridObject('gridbox');
mygrid.setImagePath('../../../dhtmlxGrid/codebase/imgs/');
mygrid.setSkin("dhx_skyblue")
mygrid.loadXML("../../../dhtmlxGrid/samples/common/gridH.xml",refresh_chart);
mygrid.attachEvent("onEditCell",function(stage){
if (stage == 2)
refresh_chart();
return true;
});
}
</script>
</head>
<body>
<div id="gridbox" style="width:600px; height:270px; background-color:white;"></div>
<hr>
<div id="chart_container" style="width:600px;height:300px;"></div>
</body>
</html>

View File

@ -0,0 +1,77 @@
<!--conf
<sample>
<product version="2.6" edition="std"/>
<modifications>
<modified date="100609"/>
</modifications>
</sample>
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Integration with dhtmlxWindows</title>
<link rel="stylesheet" type="text/css" href="../../../dhtmlxWindows/codebase/dhtmlxwindows.css">
<link rel="stylesheet" type="text/css" href="../../../dhtmlxWindows/codebase/skins/dhtmlxwindows_dhx_skyblue.css">
<script src="../../../dhtmlxWindows/codebase/dhtmlxcommon.js"></script>
<script src="../../../dhtmlxWindows/codebase/dhtmlxwindows.js"></script>
<script src="../../../dhtmlxWindows/codebase/dhtmlxcontainer.js"></script>
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
</head>
<style type="text/css" media="screen">
html, body{
height:100%;
padding:0px;
margin:0px;
}
</style>
<body onload="doOnLoad();">
<script>
var dhxWins
var data = [
{ sales:"3.0", year:"2000" },
{ sales:"3.8", year:"2001" },
{ sales:"3.4", year:"2002" },
{ sales:"4.1", year:"2003" },
{ sales:"4.3", year:"2004" },
{ sales:"9.9", year:"2005" },
{ sales:"7.4", year:"2006" },
{ sales:"9.0", year:"2007" },
{ sales:"7.3", year:"2008" },
{ sales:"4.8", year:"2009" }
];
function doOnLoad() {
dhxWinsParams = {
image_path: "../../../dhtmlxWindows/codebase/imgs/",
wins: [ {id: "w1", left: 230, top: 230, width: 420, height: 340}]
};
dhxWins = new dhtmlXWindows(dhxWinsParams);
pieChart2 = dhxWins.window("w1").attachChart({
view:"pie",
value:"#sales#",
pieInnerText:"#sales#",
gradient:true,
details:{
width: 75,
align:"right",
valign:top,
marker:{
type:"round",
width:15
},
template:"#year#"
}
});
pieChart2.parse(data,"json");
};
</script>
</body>

View File

@ -0,0 +1,13 @@
<?php
/*
Copyright DHTMLX LTD. http://www.dhtmlx.com
This version of Software is free for using in non-commercial applications.
For commercial use please contact sales@dhtmlx.com to obtain license
*/
$mysql_host = "localhost";
$mysql_user = "root";
$mysql_pasw = "";
$mysql_db = "sampledb";
?>

View File

@ -0,0 +1,16 @@
<?php
$str = "<data>";
for ($i=1; $i <= 100; $i++) {
$sales = rand(100,1000);
$year = rand(1996,2009);
$company = "Company ".rand(1,3);
$str.="<item id='{$i}' sales='{$sales}' year='{$year}' company='{$company}'></item>";
}
$str .= "</data>";
file_put_contents("stat.xml",$str);
?>

View File

@ -0,0 +1,46 @@
<data>
<item id="1">
<sales>2.9</sales>
<year>2000</year>
</item>
<item id="2">
<sales>3.5</sales>
<year>2001</year>
</item>
<item id="3">
<sales>3.1</sales>
<year>2002</year>
</item>
<item id="4">
<sales>4.2</sales>
<year>2003</year>
</item>
<item id="5">
<sales>4.5</sales>
<year>2004</year>
</item>
<item id="6">
<sales>7.4</sales>
<year>2005</year>
</item>
<item id="7">
<sales>9.6</sales>
<year>2006</year>
</item>
<item id="8">
<sales>9</sales>
<year>2007</year>
</item>
<item id="9">
<sales>7.3</sales>
<year>2008</year>
</item>
<item id="10">
<sales>5.8</sales>
<year>2009</year>
</item>
<item id="11">
<sales>7.7</sales>
<year>2010</year>
</item>
</data>

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,7 @@
Next samples
08_integration\01_dhtmlxgrid.html
08_integration\02_dhtmlxgrid_group.html
08_integration\03_layout.html
requires external components ( dhtmlxgrid and dhtmlxwindow )
Its recommended to run samples through any kind of webserver.

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,471 @@
/*---------------------------------------------------------
* OpenERP base_graph
*---------------------------------------------------------*/
openerp.base_graph = function (openerp) {
var COLOR_PALETTE = [
'#cc99ff', '#ccccff', '#48D1CC', '#CFD784', '#8B7B8B', '#75507b',
'#b0008c', '#ff0000', '#ff8e00', '#9000ff', '#0078ff', '#00ff00',
'#e6ff00', '#ffff00', '#905000', '#9b0000', '#840067', '#9abe00',
'#ffc900', '#510090', '#0000c9', '#009b00', '#75507b', '#3465a4',
'#73d216', '#c17d11', '#edd400', '#fcaf3e', '#ef2929', '#ff00c9',
'#ad7fa8', '#729fcf', '#8ae234', '#e9b96e', '#fce94f', '#f57900',
'#cc0000', '#d400a8'];
QWeb.add_template('/base_graph/static/src/xml/base_graph.xml');
openerp.base.views.add('graph', 'openerp.base_graph.GraphView');
openerp.base_graph.GraphView = openerp.base.View.extend({
init: function(view_manager, session, element_id, dataset, view_id) {
this._super(session, element_id);
this.view_manager = view_manager;
this.dataset = dataset;
this.dataset_index = 0;
this.model = this.dataset.model;
this.view_id = view_id;
},
do_show: function () {
// TODO: re-trigger search
this.$element.show();
},
do_hide: function () {
this.$element.hide();
},
start: function() {
return this.rpc("/base_graph/graphview/load", {"model": this.model, "view_id": this.view_id}, this.on_loaded);
},
on_loaded: function(data) {
this.all_fields = data.all_fields;
this.fields_view = data.fields_view;
this.name = this.fields_view.name || this.fields_view.arch.attrs.string;
this.view_id = this.fields_view.view_id;
this.chart = this.fields_view.arch.attrs.type || 'pie';
this.fields = this.fields_view.fields;
this.chart_info_fields = [];
this.operator_field = '';
this.operator_field_one = '';
this.operator = [];
this.group_field = [];
this.orientation = this.fields_view.arch.attrs.orientation || '';
this.elem_id = this.$element[0]['id'];
_.each(this.fields_view.arch.children, function (field) {
if (field.attrs.operator) {
this.operator.push(field.attrs.name);
}
else if (field.attrs.group) {
this.group_field.push(field.attrs.name);
}
else {
this.chart_info_fields.push(field.attrs.name);
}
}, this);
this.operator_field = this.operator[0];
if(this.operator.length > 1){
this.operator_field_one = this.operator[1];
}
if(this.operator == ''){
this.operator_field = this.chart_info_fields[1];
}
this.chart_info = this.chart_info_fields[0];
this.x_title = this.fields[this.chart_info_fields[0]]['string'];
this.y_title = this.fields[this.operator_field]['string'];
this.load_chart();
},
load_chart: function(data) {
var self = this;
if(data){
this.x_title = this.all_fields[this.chart_info_fields]['string'];
this.y_title = this.all_fields[this.operator_field]['string'];
self.schedule_chart(data);
}else{
this.dataset.read_slice(this.fields, 0, false, function(res) {
self.schedule_chart(res);
});
}
},
schedule_chart: function(results) {
this.$element.html(QWeb.render("GraphView", {"fields_view": this.fields_view, "chart": this.chart,'elem_id': this.elem_id}));
_.each(results, function (result) {
_.each(result, function (field_value, field_name) {
if (typeof field_value == 'object') {
result[field_name] = field_value[field_value.length - 1];
}
if (typeof field_value == 'string') {
var choices = this.all_fields[field_name]['selection'];
_.each(choices, function (choice) {
if (field_value == choice[0]) {
result[field_name] = choice;
}
});
}
}, this);
}, this);
var graph_data = {};
_.each(results, function (result) {
var group_key = [];
if(this.group_field.length){
_.each(this.group_field, function (res) {
result[res] = (typeof result[res] == 'object') ? result[res][1] : result[res];
group_key.push(result[res]);
});
}else{
group_key.push(result[this.group_field]);
}
var column_key = result[this.chart_info_fields] + "_" + group_key;
var column_descriptor = {};
if (graph_data[column_key] == undefined) {
column_descriptor[this.operator_field] = result[this.operator_field];
if (this.operator.length > 1) {
column_descriptor[this.operator_field_one] = result[this.operator_field_one];
}
column_descriptor[this.chart_info_fields] = result[this.chart_info_fields];
if(this.group_field.length){
_.each(this.group_field, function (res) {
column_descriptor[res] = (typeof result[res] == 'object') ? result[res][1] : result[res];
});
}
} else {
column_descriptor = graph_data[column_key];
column_descriptor[this.operator_field] += result[this.operator_field];
if (this.operator.length > 1) {
column_descriptor[this.operator_field_one] += result[this.operator_field_one];
}
}
graph_data[column_key] = column_descriptor;
}, this);
if (this.chart == 'bar') {
return this.schedule_bar(_.values(graph_data));
} else if (this.chart == "pie") {
return this.schedule_pie(_.values(graph_data));
}
},
schedule_bar: function(results) {
var self = this;
var view_chart = '';
var group_list = [];
var legend_list = [];
var newkey = '', newkey_one;
var string_legend = '';
if((self.group_field.length) && (this.operator.length <= 1)){
view_chart = self.orientation == 'horizontal'? 'stackedBarH' : 'stackedBar';
}else{
view_chart = self.orientation == 'horizontal'? 'barH' : 'bar';
}
_.each(results, function (result) {
if ((self.group_field.length) && (this.operator.length <= 1)) {
var legend_key = '';
_.each(self.group_field, function (res) {
result[res] = (typeof result[res] == 'object') ? result[res][1] : result[res];
legend_key += result[res];
});
newkey = legend_key.replace(/\s+/g,'_').replace(/[^a-zA-Z 0-9]+/g,'_');
string_legend = legend_key;
} else {
newkey = string_legend = "val";
}
if (_.contains(group_list, newkey) && _.contains(legend_list, string_legend)) {
return;
}
group_list.push(newkey);
legend_list.push(string_legend);
if (this.operator.length > 1) {
newkey_one = "val1";
group_list.push(newkey_one);
legend_list.push(newkey_one);
}
}, this);
if (group_list.length <=1){
group_list = [];
legend_list = [];
newkey = string_legend = "val";
group_list.push(newkey);
legend_list.push(string_legend);
}
var abscissa_data = {};
_.each(results, function (result) {
var label = result[self.chart_info_fields],
section = {};
if ((self.group_field.length) && (group_list.length > 1) && (self.operator.length <= 1)){
var legend_key_two = '';
_.each(self.group_field, function (res) {
result[res] = (typeof result[res] == 'object') ? result[res][1] : result[res];
legend_key_two += result[res];
});
newkey = legend_key_two.replace(/\s+/g,'_').replace(/[^a-zA-Z 0-9]+/g,'_');
}else{
newkey = "val";
}
if (abscissa_data[label] == undefined){
section[self.chart_info_fields] = label;
_.each(group_list, function (group) {
section[group] = 0;
});
} else {
section = abscissa_data[label];
}
section[newkey] = result[self.operator_field];
if (self.operator.length > 1){
section[newkey_one] = result[self.operator_field_one];
}
abscissa_data[label] = section;
});
//for legend color
var grp_color = _.map(legend_list, function (group_legend, index) {
var legend = {color: COLOR_PALETTE[index]};
if (group_legend == "val"){
legend['text'] = self.fields[self.operator_field]['string']
}else if(group_legend == "val1"){
legend['text'] = self.fields[self.operator_field_one]['string']
}else{
legend['text'] = group_legend;
}
return legend;
});
//for axis's value and title
var max,min,step;
var maximum,minimum;
if(_.isEmpty(abscissa_data)){
max = 9;
min = 0;
step=1;
}else{
var max_min = [];
_.each(abscissa_data, function (abscissa_datas) {
_.each(group_list, function(res){
max_min.push(abscissa_datas[res]);
});
});
maximum = Math.max.apply(Math,max_min);
minimum = Math.min.apply(Math,max_min);
if (maximum == minimum){
if (maximum == 0){
max = 9;
min = 0;
step=1;
}else if(maximum > 0){
max = maximum + (10 - maximum % 10);
min = 0;
step = Math.round(max/10);
}else{
max = 0;
min = minimum - (10 + minimum % 10);
step = Math.round(Math.abs(min)/10);
}
}
}
var abscissa_description = {
template: self.chart_info_fields,
title: "<b>"+self.x_title+"</b>"
};
var ordinate_description = {
lines: true,
title: "<b>"+self.y_title+"</b>",
start: min,
step: step,
end: max
};
var x_axis, y_axis, tooltip;
if (self.orientation == 'horizontal'){
x_axis = ordinate_description;
y_axis = abscissa_description;
}else{
x_axis = abscissa_description;
y_axis = ordinate_description;
}
tooltip = self.chart_info_fields;
var bar_chart = new dhtmlXChart({
view: view_chart,
container: self.elem_id+"-barchart",
value:"#"+group_list[0]+"#",
gradient: "3d",
border: false,
width: 1024,
tooltip:{
template:"#"+tooltip+"#"+","+grp_color[0]['text']+"="+"#"+group_list[0]+"#"
},
radius: 0,
color:grp_color[0]['color'],
origin:0,
xAxis:{
template:function(obj){
if(x_axis['template']){
var val = obj[x_axis['template']];
val = (typeof val == 'object')?val[1]:(!val?'Undefined':val);
if(val.length > 12){
val = val.substring(0,12);
}
return val;
}else{
return obj;
}
},
title:x_axis['title'],
lines:x_axis['lines']
},
yAxis:{
template:function(obj){
if(y_axis['template']){
var vals = obj[y_axis['template']];
vals = (typeof vals == 'object')?vals[1]:(!vals?'Undefined':vals);
if(vals.length > 12){
vals = vals.substring(0,12);
}
return vals;
}else{
return obj;
}
},
title:y_axis['title'],
lines: y_axis['lines'],
start:y_axis['start'],
step:y_axis['step'],
end:y_axis['end']
},
padding: {
left: 75
},
legend: {
values: grp_color,
align:"left",
valign:"top",
layout: "x",
marker:{
type:"round",
width:12
}
}
});
for (var m = 1; m<group_list.length;m++){
bar_chart.addSeries({
value: "#"+group_list[m]+"#",
tooltip:{
template:"#"+tooltip+"#"+","+grp_color[m]['text']+"="+"#"+group_list[m]+"#"
},
color: grp_color[m]['color']
});
}
bar_chart.parse(_.values(abscissa_data), "json");
jQuery("#"+self.elem_id+"-barchart").height(jQuery("#"+self.elem_id+"-barchart").height()+50);
bar_chart.attachEvent("onItemClick", function(id) {
self.open_list_view(bar_chart.get(id));
});
},
schedule_pie: function(result) {
var self = this;
var chart = new dhtmlXChart({
view:"pie3D",
container:self.elem_id+"-piechart",
value:"#"+self.operator_field+"#",
pieInnerText:function(obj) {
var sum = chart.sum("#"+self.operator_field+"#");
var val = obj[self.operator_field] / sum * 100 ;
return val.toFixed(1) + "%";
},
tooltip:{
template:"#"+self.chart_info_fields+"#"+"="+"#"+self.operator_field+"#"
},
gradient:"3d",
height: 20,
radius: 200,
legend: {
width: 300,
align:"left",
valign:"top",
layout: "x",
marker:{
type:"round",
width:12
},
template:function(obj){
var val = obj[self.chart_info_fields];
val = (typeof val == 'object')?val[1]:val;
return val;
}
}
});
chart.parse(result,"json");
chart.attachEvent("onItemClick", function(id) {
self.open_list_view(chart.get(id));
});
},
open_list_view : function (id){
var self = this;
if($(".dhx_tooltip").is(":visible")) {
$(".dhx_tooltip").remove('div');
}
id = id[this.chart_info_fields];
if (typeof id == 'object'){
id = id[0];
}
var record_id = "";
this.dataset.model = this.model;
if (typeof this.chart_info_fields == 'object'){
record_id = this.chart_info_fields[0];
}else{
record_id = this.chart_info_fields;
}
this.dataset.domain = [[record_id, '=', id],['id','in',this.dataset.ids]];
var modes = !!modes ? modes.split(",") : ["list", "form", "graph"];
var views = [];
_.each(modes, function(mode) {
var view = [false, mode];
if (self.fields.views && self.fields.views[mode]) {
view.push(self.fields.views[mode]);
}
views.push(view);
});
this.session.action_manager.do_action({
"res_model" : this.dataset.model,
"domain" : this.dataset.domain,
"views" : views,
"type" : "ir.actions.act_window",
"auto_search" : true,
"view_type" : "list",
"view_mode" : "list"
});
},
do_search: function(domains, contexts, groupbys) {
var self = this;
this.rpc('/base/session/eval_domain_and_context', {
domains: domains,
contexts: contexts,
group_by_seq: groupbys
}, function (results) {
// TODO: handle non-empty results.group_by with read_group
if(results.group_by && results.group_by != ''){
self.chart_info_fields = results.group_by[0];
}else{
self.chart_info_fields = self.chart_info;
}
self.dataset.context = results.context;
self.dataset.domain = results.domain;
self.dataset.read_slice([], 0, false,function(response){
self.load_chart(response);
});
});
}
});
// here you may tweak globals object, if any, and play with on_* or do_* callbacks on them
};
// vim:et fdc=0 fdl=0:

View File

@ -0,0 +1,6 @@
<template>
<t t-name="GraphView">
<h2 class="oe_view_title"><t t-esc="fields_view.arch.attrs.string"/></h2>
<div t-att-id="elem_id+'-'+chart+'chart'" style="height:300px;position:relative;border:1px solid #A4BED4;"></div>
</t>
</template>

View File

@ -4,4 +4,5 @@
"depends": [],
"js": ["static/*/*.js", "static/*/js/*.js"],
"css": [],
'active': False,
}

View File

@ -110,6 +110,79 @@ initializing the addon.
});
}
Creating new standard roles
---------------------------
Views
+++++
Views are the standard high-level component in OpenERP. A view type corresponds
to a way to display a set of data (coming from an OpenERP model).
In OpenERP Web, views are standard objects registered against a dedicated
object registry, so the :js:class:`~openerp.base.ViewManager` knows where to
find and how to call them.
Although not mandatory, it is recommended that views inherit from
:js:class:`openerp.base.View`, which provides a view useful services to its
children.
Registering a view
~~~~~~~~~~~~~~~~~~
This is the first task to perform when creating a view, and the simplest by
far: simply call ``openerp.base.views.add(name, object_path)`` to register
the object of path ``object_path`` as the view for the view name ``name``.
The view name is the name you gave to your new view in the OpenERP server.
From that point onwards, OpenERP Web will be able to find your object and
instantiate it.
Standard view behaviors
~~~~~~~~~~~~~~~~~~~~~~~
In the normal OpenERP Web flow, views have to implement a number of methods so
view managers can correctly communicate with them:
``start()``
This method will always be called after creating the view (via its
constructor), but not necessarily immediately.
It is called with no arguments and should handle the heavy setup work,
including remote call (to load the view's setup data from the server via
e.g. ``fields_view_get``, for instance).
``start`` should return a `promise object`_ which *must* be resolved when
the view's setup is completed. This promise is used by view managers to
know when they can start interacting with the view.
``do_hide()``
Called by the view manager when it wants to replace this view by an other
one, but wants to keep this view around to re-activate it later.
Should put the view in some sort of hibernation mode, and *must* hide its
DOM elements.
``do_show()``
Called when the view manager wants to re-display the view after having
hidden it. The view should refresh its data display upon receiving this
notification
``do_search(domains: Array, contexts: Array, groupbys: Array)``
If the view is searchable, this method is called to notify it of a search
against it.
It should use the provided query data to perform a search and refresh its
internal content (and display).
All views are searchable by default, but they can be made non-searchable
by setting the property ``searchable`` to ``false``.
This can be done either on the view class itself (at the same level as
defining e.g. the ``start`` method) or at the instance level (in the
class's ``init``), though you should generally set it on the class.
Utility behaviors
-----------------
@ -423,3 +496,6 @@ Python
.. _nose:
http://somethingaboutorange.com/mrl/projects/nose/1.0.0/
.. _promise object:
http://api.jquery.com/deferred.promise/

View File

@ -16,6 +16,158 @@ Source code repository
Merge proposals
+++++++++++++++
Coding issues and coding conventions
++++++++++++++++++++++++++++++++++++
Javascript coding
~~~~~~~~~~~~~~~~~
These are a number of guidelines for javascript code. More than coding
conventions, these are warnings against potentially harmful or sub-par
constructs.
Ideally, you should be able to configure your editor or IDE to warn you against
these kinds of issues.
Use ``var`` for *all* declarations
**********************************
In javascript (as opposed to Python), assigning to a variable which does not
already exist and is not explicitly declared (via ``var``) will implicitly
create a global variable. This is bad for a number of reasons:
* It leaks information outside function scopes
* It keeps memory of previous run, with potentially buggy behaviors
* It may conflict with other functions with the same issue
* It makes code harder to statically check (via e.g. IDE inspectors)
.. note::
It is perfectly possible to use ``var`` in ``for`` loops:
.. code-block:: javascript
for (var i = 0; i < some_array.length; ++i) {
// code here
}
this is not an issue
All local *and global* variables should be declared via ``var``.
.. note:: generally speaking, you should not need globals in OpenERP Web: you
can just declare a variable local to your top-level function. This
way, if your widget/addon is instantiated several times on the same
page (because it's used in embedded mode) each instance will have its
own internal but global-to-its-objects data.
Do not leave trailing commas in object literals
***********************************************
While it is legal to leave trailing commas in Python dictionaries, e.g.
.. code-block:: python
foo = {
'a': 1,
'b': 2,
}
and it's valid in ECMAScript 5 and most browsers support it in Javascript, you
should *never* use trailing commas in Javascript object literals:
* Internet Explorer does *not* support trailing commas (at least until and
including Internet Explorer 8), and trailing comma will cause hard-to-debug
errors in it
* JSON does not accept trailing comma (it is a syntax error), and using them
in object literals puts you at risks of using them in literal JSON strings
as well (though there are few reasons to write JSON by hand)
*Never* use ``for … in`` to iterate on arrays
*********************************************
:ref:`Iterating over an object with for…in is a bit tricky already
<for-in-iteration>`, it is far more complex than in Python (where it Just
Works™) due to the interaction of various Javascript features, but to iterate
on arrays it becomes downright deadly and errorneous: ``for…in`` really
iterates over an *object*'s *properties*.
With an array, this has the following consequences:
* It does not necessarily iterate in numerical order, nor does it iterate in
any kind of set order. The order is implementation-dependent and may vary
from one run to the next depending on a number of reasons and implementation
details.
* If properties are added to an array, to ``Array.prototype`` or to
``Object.prototype`` (the latter two should not happen in well-behaved
javascript code, but you never know...) those properties *will* be iterated
over by ``for…in``. While ``Object.hasOwnProperty`` will guard against
iterating prototype properties, they will not guard against properties set
on the array instance itself (as memoizers for instance).
Note that this includes setting negative keys on arrays.
For this reason, ``for…in`` should **never** be used on array objects. Instead,
you should use either a normal ``for`` or (even better, unless you have
profiled the code and found a hotspot) one of Underscore's array iteration
methods (`_.each`_, `_.map`_, `_.filter`_, etc...).
Underscore is guaranteed to be bundled and available in OpenERP Web scopes.
.. _for-in-iteration:
Use ``hasOwnProperty`` when iterating on an object with ``for … in``
********************************************************************
``for…in`` is Javascript's built-in facility for iterating over and object's
properties.
`It is also fairly tricky to use`_: it iterates over *all* non-builtin
properties of your objects [#]_, which includes methods of an object's class.
As a result, when iterating over an object with ``for…in`` the first line of
the body *should* generally be a call to `Object.hasOwnProperty`_. This call
will check whether the property was set directly on the object or comes from
the object's class:
.. code-block:: javascript
for(var key in ob) {
if (!ob.hasOwnProperty(key)) {
// comes from ob's class
continue;
}
// do stuff with key
}
Since properties can be added directly to e.g. ``Object.prototype`` (even
though it's usually considered bad style), you should not assume you ever know
which properties ``for…in`` is going to iterate over.
An alternative is to use Underscore's iteration methods, which generally work
over objects as well as arrays:
Instead of
.. code-block:: javascript
for (var key in ob) {
if (!ob.hasOwnProperty(key)) { continue; }
var value = ob[key];
// Do stuff with key and value
}
you could write:
.. code-block:: javascript
_.each(ob, function (value, key) {
// do stuff with key and value
});
and not worry about the details of the iteration: underscore should do the
right thing for you on its own [#]_.
Writing documentation
+++++++++++++++++++++
@ -44,14 +196,18 @@ RST, using Sphinx's `Python domain`_ [#]_:
docstring, using Sphinx's `info fields`_
For parameters types, built-in and stdlib types should be using the
combined syntax::
combined syntax:
.. code-block:: restructuredtext
:param dict foo: what the purpose of foo is
unless a more extensive explanation needs to be given (e.g. the
specification that the input should be a list of 3-tuple needs to
use ``:type:`` even though all types involved are built-ins). Any
other type should be specified in full using the ``:type:`` field::
other type should be specified in full using the ``:type:`` field
.. code-block:: restructuredtext
:param foo: what the purpose of foo is
:type foo: some.addon.Class
@ -87,12 +243,16 @@ when writing javascript API documentation:
are not documented, or JsDoc will not understand what they are and
will not generate documentation for their content.
As a result, the bare minimum for a namespace is::
As a result, the bare minimum for a namespace is:
.. code-block:: javascript
/** @namespace */
foo.bar.baz = {};
while for a class it is::
while for a class it is:
.. code-block:: javascript
/** @class */
foo.bar.baz.Qux = [...]
@ -189,7 +349,6 @@ with the descriptions and irrelevant atttributes stripped):
.. code-block:: javascript
openerp.base.search.Widget = openerp.base.Controller.extend(
/** @lends openerp.base.search.Widget# */{
/**
@ -220,6 +379,30 @@ Roadmap
Release notes
+++++++++++++
.. [#] More precisely, it iterates over all *enumerable* properties. It just
happens that built-in properties (such as ``String.indexOf`` or
``Object.toString``) are set to non-enumerable.
The enumerability of a property can be checked using
`Object.propertyIsEnumeable`_.
Before ECMAScript 5, it was not possible for user-defined properties
to be non-enumerable in a portable manner. ECMAScript 5 introduced
`Object.defineProperty`_ which lets user code create non-enumerable
properties (and more, read-only properties for instance, or implicit
getters and setters). However, support for these is not fully complete
at this point, and they are not being used in OpenERP Web code anyway.
.. [#] While using underscore is generally the preferred method (simpler,
more reliable and easier to write than a *correct* ``for…in``
iteration), it is also probably slower (due to the overhead of
calling a bunch of functions).
As a result, if you profile some code and find out that an underscore
method adds unacceptable overhead in a tight loop, you may want to
replace it with a ``for…in`` (or a regular ``for`` statement for
arrays).
.. [#] Because Python is the default domain, the ``py:`` markup prefix
is optional and should be left out.
@ -252,3 +435,17 @@ Release notes
http://code.google.com/p/jsdoc-toolkit/
.. _John Resig's Class implementation:
http://ejohn.org/blog/simple-javascript-inheritance/
.. _\_.each:
http://documentcloud.github.com/underscore/#each
.. _\_.map:
http://documentcloud.github.com/underscore/#map
.. _\_.filter:
http://documentcloud.github.com/underscore/#select
.. _It is also fairly tricky to use:
https://developer.mozilla.org/en/JavaScript/Reference/Statements/for...in#Description
.. _Object.propertyIsEnumeable:
https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/propertyIsEnumerable
.. _Object.defineProperty:
https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/defineProperty
.. _Object.hasOwnProperty:
https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/hasOwnProperty

View File

@ -74,8 +74,7 @@ class OpenERPSession(object):
Used to store references to non-literal domains which need to be
round-tripped to the client browser.
"""
def __init__(self, server='127.0.0.1', port=8069,
model_factory=OpenERPModel):
def __init__(self, server='127.0.0.1', port=8069, model_factory=OpenERPModel):
self._server = server
self._port = port
self._db = False
@ -239,11 +238,7 @@ class OpenERPSession(object):
# OpenERP Web RequestHandler
#----------------------------------------------------------
class JsonRequest(object):
""" JSON-RPC2 over HTTP POST using non standard POST encoding.
Difference with the standard:
* the json string is passed as a form parameter named "request"
* method is currently ignored
""" JSON-RPC2 over HTTP.
Sucessful request::
@ -280,15 +275,20 @@ class JsonRequest(object):
self.request = request
self.params = request.get("params", {})
self.applicationsession = applicationsession
self.httprequest = cherrypy.request
self.httpresponse = cherrypy.response
self.httpsession = cherrypy.session
self.httpsession_id = "cookieid"
self.httpsession = cherrypy.session
self.session_id = self.params.pop("session_id", None) or uuid.uuid4().hex
self.session = self.httpsession.setdefault(self.session_id, OpenERPSession())
host = cherrypy.config['openerp.server.host']
port = cherrypy.config['openerp.server.port']
self.session = self.httpsession.setdefault(self.session_id, OpenERPSession(host, port))
self.context = self.params.pop('context', None)
return self.params
def dispatch(self, controller, method, requestf=None, request=None):
''' Calls the method asked for by the JSON-RPC2 request
""" Calls the method asked for by the JSON-RPC2 request
:param controller: the instance of the controller which received the request
:type controller: type
@ -301,17 +301,19 @@ class JsonRequest(object):
:returns: a string-encoded JSON-RPC2 reply
:rtype: bytes
'''
"""
# Read POST content or POST Form Data named "request"
if requestf:
request = simplejson.load(requestf, object_hook=nonliterals.non_literal_decoder)
else:
request = simplejson.loads(request, object_hook=nonliterals.non_literal_decoder)
response = {"jsonrpc": "2.0", "id": request.get('id')}
try:
print "--> %s.%s %s" % (controller.__class__.__name__, method.__name__, request)
error = None
self.parse(request)
result = method(controller, self, **self.params)
response["result"] = method(controller, self, **self.params)
except OpenERPUnboundException:
error = {
'code': 100,
@ -343,11 +345,8 @@ class JsonRequest(object):
'debug': "Client %s" % traceback.format_exc()
}
}
response = {"jsonrpc": "2.0", "id": request.get('id')}
if error:
response["error"] = error
else:
response["result"] = result
print "<--", response
print
@ -374,7 +373,9 @@ class HttpRequest(object):
self.httpsession_id = "cookieid"
self.httpsession = cherrypy.session
self.context = kw.get('context', {})
self.session = self.httpsession.setdefault(kw.pop('session_id', None), OpenERPSession())
host = cherrypy.config['openerp.server.host']
port = cherrypy.config['openerp.server.port']
self.session = self.httpsession.setdefault(kw.pop('session_id', None), OpenERPSession(host, port))
self.result = ""
if request.method == 'GET':
print "GET --> %s.%s %s %r" % (controller.__class__.__name__, f.__name__, request, kw)
@ -459,43 +460,40 @@ class Root(object):
def main(argv):
# change the timezone of the program to the OpenERP server's assumed timezone
os.environ["TZ"] = "UTC"
DEFAULT_CONFIG = {
'server.socket_port': 8002,
'server.socket_host': '0.0.0.0',
'tools.sessions.on': True,
'tools.sessions.storage_type': 'file',
'tools.sessions.storage_path': os.path.join(tempfile.gettempdir(), "cpsessions"),
'tools.sessions.timeout': 60
}
# Parse config
op = optparse.OptionParser()
op.add_option("-p", "--port", dest="server.socket_port", help="listening port",
type="int", metavar="NUMBER")
op.add_option("-s", "--session-path", dest="tools.sessions.storage_path",
help="directory used for session storage", metavar="DIR")
op.add_option("-p", "--port", dest="server.socket_port", default=8002, help="listening port", type="int", metavar="NUMBER")
op.add_option("-s", "--session-path", dest="tools.sessions.storage_path", default=os.path.join(tempfile.gettempdir(), "cpsessions"), help="directory used for session storage", metavar="DIR")
op.add_option("--server-host", dest="openerp.server.host", default='127.0.0.1', help="OpenERP server hostname", metavar="HOST")
op.add_option("--server-port", dest="openerp.server.port", default=8069, help="OpenERP server port", type="int", metavar="NUMBER")
op.add_option("--db-filter", dest="openerp.dbfilter", default='.*', help="Filter listed database", metavar="REGEXP")
(o, args) = op.parse_args(argv[1:])
o = vars(o)
for k in o.keys():
if o[k] == None:
if o[k] is None:
del(o[k])
# Setup and run cherrypy
cherrypy.tree.mount(Root())
cherrypy.config.update(config=DEFAULT_CONFIG)
if os.path.exists(os.path.join(os.path.dirname(
os.path.dirname(__file__)),'openerp-web.cfg')):
cherrypy.config.update(os.path.join(os.path.dirname(
os.path.dirname(__file__)),'openerp-web.cfg'))
if os.path.exists(os.path.join(path_root,'openerp-web.cfg')):
cherrypy.config.update(os.path.join(path_root,'openerp-web.cfg'))
if os.path.exists(os.path.expanduser('~/.openerp_webrc')):
cherrypy.config.update(os.path.expanduser('~/.openerp_webrc'))
cherrypy.config.update(o)
if not os.path.exists(cherrypy.config['tools.sessions.storage_path']):
os.mkdir(cherrypy.config['tools.sessions.storage_path'], 0700)
os.makedirs(cherrypy.config['tools.sessions.storage_path'], 0700)
cherrypy.server.subscribe()
cherrypy.engine.start()
cherrypy.engine.block()