Web Interface

This commit is contained in:
2021-05-17 23:38:10 +05:00
parent f2fb4bcb8e
commit 13e6f59d44
40 changed files with 52394 additions and 0 deletions

View File

@@ -0,0 +1,110 @@
function BlinkStatus(x, y, w, h) {
//Основной прямоугольник
var rAll = new Rectangle(x, y, w, h);
//Массив цветов статусов
var statColor = [];
//Текущий статус
var status = 0;
/*Проценты поднимаются снизу вверх (false)
*или слева направо (true)*/
var rotate = false;
/*Функции для работы с координатами
* основного прямоугольника */
this.X = function (val) {
if (val === undefined) return rAll().X();
rAll().X(val);
};
this.Y = function (val) {
if (val === undefined) return rAll().Y();
rAll().Y(val);
};
this.W = function (val) {
if (val === undefined) return rAll().W();
rAll().W(val);
};
this.H = function (val) {
if (val === undefined) return rAll().H();
rAll().H(val);
};
//Установка статуса от -1 до (кол-во элементов в массиве статусов - 1)
this.Status = function (val) {
if (val === undefined) return status;
var v = parseInt(val);
status = (isNaN(v) || v < -1) ? -1 :
v >= statColor.length ? (statColor.length - 1) : v;
};
//Количество статусов
this.StatCount = function () {
return statColor.length;
};
//Функция изменения начальной координаты и размеров прямоугольника
this.RectParam = function (_x, _y, _w, _h) {
rAll.RectParam(_x, _y, _w, _h);
};
//Функция изменения прямоугольника по другому прямоугольнику
this.Rect = function (val) {
if (val === undefined) return rAll;
rAll.Rect(val);
};
//Изменение направления отрисовки текста
this.Rotate = function (val) {
if (val === undefined) return rotate;
rotate = (typeof val === 'boolean') ? val : false;
};
//Установка нового статуса
this.AddStatus = function (index, color) {
if (color === undefined) color = '#000';
var c = color.match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i);
c = (c === null) ? '#000000' : c[0];
var idx = parseInt(index);
if (isNaN(idx) || idx < 0 || idx > statColor.length - 1)
statColor.push(c);
else
statColor.splice(idx, 0, c);
};
//Изменение статуса
this.ChangeStatus = function (index, color) {
if (color === undefined) color = '#000';
var c = color.match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i);
c = (c === null) ? '#000000' : c[0];
var idx = parseInt(index);
if (!isNaN(idx) && idx >= 0 && idx < statColor.length)
statColor.splice(idx, 1, c);
};
//Удаление статуса
this.DelStatus = function (index) {
var idx = parseInt(index);
if (!isNaN(idx) && idx >= 0 && idx < statColor.length)
statColor.splice(idx, 1);
else if (statColor.length > 0)
statColor.pop();
};
//Заполнение мигалки по умолчанию
this.BuildDefault = function () {
var defaultColor = ['#00f', '#f00', '#0f0'];
for (var i = 0; i < defaultColor.length; i++)
this.AddStatus(0, defaultColor[i]);
};
//Печать мигалки
this.Print = function (ctx) {
ctx.fillStyle = status >= 0 && status < statColor.length ? statColor[status] : '#ddd';
ctx.fillRect(rAll.X(), rAll.Y(), rAll.W(), rAll.H());
ctx.strokeStyle = '#000'; //'#333'
ctx.strokeRect(rAll.X(), rAll.Y(), rAll.W(), rAll.H());
};
//Печать текста мигалки
this.PrintText = function (ctx) {
ctx.save();
ctx.translate(rAll.X() + rAll.W() / 2, rAll.Y() + rAll.H() / 2);
if (rotate) ctx.rotate(3 * Math.PI / 2);
ctx.fillStyle = '#888';
ctx.textAlign = 'center';
ctx.textBaseline = 'middle';
if (rotate)
ctx.font = (rAll.W() - 2 < 0 ? 0 : rAll.W() - 2) + 'px Arial';
else
ctx.font = (rAll.H() - 2 < 0 ? 0 : rAll.H() - 2) + 'px Arial';
ctx.fillText((status + 1) + '/' + statColor.length, 0, 0);
ctx.restore();
};
}

View File

@@ -0,0 +1,295 @@
function Diagram(x, y, w, h) {
// \|/<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>\|/ //
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
var stI = 2;
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
var stE = 2;
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
var szE = 4;
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
var szB = 10;
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
var szN = 17;
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
var szP = 40;
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
var timeCycle = 1000;
// /|\<5C><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>/|\ //
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
var rAll = new Rectangle(x, y, w, h);
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
var rProc = [];
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
var rBlink = [];
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
var rNumb = [];
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
var rDStart = [];
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
var rDEnd = [];
//<2F><><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD>
var cCycle = false;
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
var wCycle = -1;
/*<2A><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD> (false)
*<2A><><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> (true)*/
var rotate = false;
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.minBoardW = function () {
return (stW + 1) * (rProc.length + 1) + (rProc.length * 5);
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.minBoardH = function () {
return (stH + 1) * 4 + szHP + szHB + szHN;
};
/*<2A><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
* <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> */
this.X = function (val) {
if (val === undefined) return rAll().X();
rAll().X(val);
};
this.Y = function (val) {
if (val === undefined) return rAll().Y();
rAll().Y(val);
};
this.W = function (val) {
if (val === undefined) return rAll().W();
rAll().W(val);
};
this.H = function (val) {
if (val === undefined) return rAll().H();
rAll().H(val);
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.RectParam = function (_x, _y, _w, _h) {
rAll.RectParam(_x, _y, _w, _h);
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.Rect = function (val) {
if (val === undefined) return rAll;
rAll.Rect(val);
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.ProcCount = function () {
return rProc.length;
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.AddProc = function (index, proc, blink, numb) {
var idx = parseInt(index);
idx = (isNaN(idx) || idx < 0 || idx >= rProc.length) ? -1 : idx;
var date = new Date();
if (idx == -1) {
rProc.push(proc);
rBlink.push(blink);
rNumb.push(numb);
rDStart.push(date);
rDEnd.push(date);
} else {
rProc.splice(idx, 0, proc);
rBlink.splice(idx, 0, blink);
rNumb.splice(idx, 0, numb);
rDStart.splice(idx, 0, date);
rDEnd.splice(idx, 0, date);
}
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.ChangeProc = function (index, proc, blink, numb) {
var idx = parseInt(index);
idx = (isNaN(idx) || idx < 0 || idx >= rProc.length) ? -1 : idx;
var date = new Date();
if (idx == -1) return;
rProc.splice(idx, 1, proc);
rBlink.splice(idx, 1, blink);
rNumb.splice(idx, 1, numb);
rDStart.splice(idx, 1, date);
rDEnd.splice(idx, 1, date);
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.DelStove = function (index) {
if (rProc.length == 0) return;
var idx = parseInt(index);
idx = (isNaN(idx) || idx < 0 || idx >= rProc.length) ? -1 : idx;
if (idx == -1) {
rProc.pop();
rBlink.pop();
rNumb.pop();
rDStart.pop();
rDEnd.pop();
} else {
rProc.splice(idx, 1);
rBlink.splice(idx, 1);
rNumb.splice(idx, 1);
rDStart.splice(idx, 1);
rDEnd.splice(idx, 1);
}
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.StartDate = function (index, date) {
var idx = parseInt(index);
idx = (isNaN(idx) || idx < 0 || idx >= rDStart.length) ? -1 : idx;
if (idx == -1) return;
rDStart[idx] = date;
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.EndDate = function (index, date) {
var idx = parseInt(index);
idx = (isNaN(idx) || idx < 0 || idx >= rDStart.length) ? -1 : idx;
if (idx == -1) return;
rDEnd[idx] = date;
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.ChangeStatProc = function (index, stat, percent) {
var idx = parseInt(index);
if (!isNaN(idx) && idx >= 0 && idx < rProc.length) {
rProc[idx].Status(stat);
rProc[idx].Percent(percent);
}
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.ChangeStatBlink = function (index, stat) {
var idx = parseInt(index);
if (!isNaN(idx) && idx >= -1 && idx < rBlink.length)
rBlink[idx].Status(stat);
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.ChangeStatNumb = function (index, prostoy) {
var idx = parseInt(index);
if (!isNaN(idx) && idx >= 0 && idx < rNumb.length)
rNumb[idx].Prostoy(prostoy);
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.Rotate = function (val) {
if (val === undefined) return rotate;
rotate = (typeof val === 'boolean') ? val : false;
for (var i = 0; i < rProc.length; i++) {
rProc[i].Rotate(rotate);
rNumb[i].Rotate(rotate);
rBlink[i].Rotate(rotate);
}
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.BuildDefault = function () {
while (rProc.length < 48) {
rProc.push(new ProcessColumn(0, 0, 0, 0));
rProc[rProc.length - 1].BuildDefault();
rBlink.push(new BlinkStatus(0, 0, 0, 0));
rBlink[rProc.length - 1].BuildDefault();
rNumb.push(new NumberColumn(0, 0, 0, 0, rProc.length));
var date = new Date;
rDStart.push(date);
rDEnd.push(date);
}
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.Rebuild = function () {
var x = rAll.X() + stE + 1;
var y = rAll.Y() + stE + 1;
var wAll = rAll.W() - (rProc.length + 1) * (stE + 1);
var hAll = rAll.H() - (rProc.length + 1) * (stE + 1);
for (var i = 0; i < rProc.length; i++) {
var xP = 0, xB = 0, xN = 0;
var yP = 0, yB = 0, yN = 0;
var wP = 0, wB = 0, wN = 0;
var hP = 0, hB = 0, hN = 0;
if (!rotate) {
xP = x; xB = x; xN = x;
var w = Math.ceil(wAll / (rProc.length - i));
w = (w < szE) ? szE : w;
wAll -= w;
wP = w; wB = w; wN = w;
hB = szB; hN = szN;
hP = rAll.H() - (stI + 1) * 4 - szB - szN;
hP = (hP < szP) ? szP : hP;
yP = y;
yB = yP + hP + (stI + 1);
yN = yB + szB + (stI + 1);
} else {
yP = y; yB = y; yN = y;
var h = Math.ceil(hAll / (rProc.length - i));
h = (h < szE) ? szE : h;
hAll -= h;
hP = h; hB = h; hN = h;
wB = szB; wN = szN;
wP = rAll.W() - (stI + 1) * 4 - szB - szN;
wP = (wP < szP) ? szP : wP;
xP = x;
xB = xP + wP + (stI + 1);
xN = xB + szB + (stI + 1);
xN = x;
xB = xN + wN + (stI + 1);
xP = xB + szB + (stI + 1);
}
rProc[i].RectParam(xP, yP, wP, hP);
rBlink[i].RectParam(xB, yB, wB, hB);
rNumb[i].RectParam(xN, yN, wN, hN);
if (!rotate)
x += wP + stE + 1;
else
y += hP + stE + 1;
}
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.Print = function (a) {
updateCycle();
this.Rotate(rotate);
this.Rebuild();
a.clearRect(rAll.X(), rAll.Y(), rAll.W(), rAll.H());
a.fillStyle = "#ddd";
a.fillRect(rAll.X(), rAll.Y(), rAll.W(), rAll.H());
for (var i = 0; i < rProc.length; i++) {
rProc[i].Print(a);
rBlink[i].Print(a);
rNumb[i].Print(a);
}
a.strokeStyle = "#333";
a.strokeRect(rAll.X(), rAll.Y(), rAll.W(), rAll.H());
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.PrintText = function (a) {
for (var i = 0; i < rProc.length; i++) {
rProc[i].PrintText(a);
rBlink[i].PrintText(a);
}
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
function updateCycle(currDate) {
var date = (currDate == undefined) ? new Date() : currDate;
var cycle = false;
for (var i = 0; i < rProc.length; i++) {
if (rDStart[i] == rDEnd[i]) continue;
var d = rDEnd[i] - rDStart[i];
var t = date - rDStart[i];
d = 100 * (date - rDStart[i]) / d;
rProc[i].Percent(d);
rNumb[i].Prostoy(d >= 100);
cycle = cycle || d < 100;
}
cCycle = cCycle && cycle;
date.setMilliseconds(date.getMilliseconds() + timeCycle);
if (cCycle)
if (currDate == undefined)
wCycle = setTimeout(updateCycle, timeCycle);
else
wCycle = setTimeout(updateCycle, timeCycle, date);
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
this.Cycle = function (start, currDate) {
if (start == undefined || !(typeof start === 'boolean')) return cCycle;
if (start) {
this.CheckDate();
clearTimeout(wCycle);
cCycle = true;
updateCycle(currDate);
}
};
//<2F><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD> <20><><EFBFBD><EFBFBD><EFBFBD>
this.CheckDate = function () {
for (var i = 0; i < rProc.length; i++) {
if (rDStart[i] > rDEnd[i]) {
var tmp = rDStart[i];
rDStart[i] = rDEnd[i];
rDEnd[i] = tmp;
}
}
};
};

View File

@@ -0,0 +1,71 @@
function NumberColumn(x, y, w, h, number) {
//Основной прямоугольник
var rAll = new Rectangle(x, y, w, h);
//Текущий статус по простою
var prostoy = false;
/*Проценты поднимаются снизу вверх (false)
*или слева направо (true)*/
var rotate = false;
/*Функции для работы с координатами
* основного прямоугольника */
this.X = function (val) {
if (val === undefined) return rAll().X();
rAll().X(val);
};
this.Y = function (val) {
if (val === undefined) return rAll().Y();
rAll().Y(val);
};
this.W = function (val) {
if (val === undefined) return rAll().W();
rAll().W(val);
};
this.H = function (val) {
if (val === undefined) return rAll().H();
rAll().H(val);
};
//Функция изменения начальной координаты и размеров прямоугольника
this.RectParam = function (_x, _y, _w, _h) {
rAll.RectParam(_x, _y, _w, _h);
};
//Функция изменения прямоугольника по другому прямоугольнику
this.Rect = function (val) {
if (val === undefined) return rAll;
rAll.Rect(val);
};
//Функция установки номера
this.Number = function (val) {
if (val === undefined) return number;
var v = parseInt(val);
number = (isNaN(v) || v < 0) ? 0 : v;
};
this.Number(number);
//Функция установки статуса по простою
this.Prostoy = function (val) {
if (val === undefined) return prostoy;
prostoy = (typeof val === 'boolean') ? val : false;
};
//Изменение направления отрисовки текста
this.Rotate = function (val) {
if (val === undefined) return rotate;
rotate = (typeof val === 'boolean') ? val : false;
};
//Печать номера
this.Print = function (ctx) {
ctx.fillStyle = (!prostoy) ? '#ff0' : '#ff8000';
ctx.fillRect(rAll.X(), rAll.Y(), rAll.W(), rAll.H());
ctx.strokeStyle = '#000';//'#333'
ctx.strokeRect(rAll.X(), rAll.Y(), rAll.W(), rAll.H());
ctx.save();
ctx.translate(rAll.X() + rAll.W() / 2, rAll.Y() + rAll.H() / 2);
if (rotate) ctx.rotate(3 * Math.PI / 2);
ctx.fillStyle = '#000';
ctx.textAlign = 'center';
ctx.textBaseline = 'middle';
var px = rAll.H() < rAll.W() ? rAll.H() - 3 : rAll.W() - 3;
px = px < 0 ? 0 : px;
ctx.font = px + 'px Arial';
ctx.fillText(number, 0, 0);
ctx.restore();
};
}

View File

@@ -0,0 +1,92 @@
function PercentColumn(x, y, w, h) {
//Основной прямоугольник
var rAll = new Rectangle(x, y, w, h);
//Прямоугольник процентов
var rPerc = new Rectangle();
/*Проценты поднимаются снизу вверх (false)
*или слева направо (true)*/
var rotate = false;
//Проценты статуса
var percent = 0;
//Цвет
var color = '#000';
/*Функции для работы с координатами
* основного прямоугольника */
this.X = function (val) {
if (val === undefined) return rAll.X();
rAll.X(val);
};
this.Y = function (val) {
if (val === undefined) return rAll.Y();
rAll.Y(val);
};
this.W = function (val) {
if (val === undefined) return rAll.W();
rAll.W(val);
};
this.H = function (val) {
if (val === undefined) return rAll.H();
rAll.H(val);
};
//Установка процента от 0 до 100
this.Percent = function (val) {
if (val === undefined) return percent;
var v = parseFloat(val);
v = (isNaN(v) || v < 0) ? 0 : (v > 100) ? 100 : v;
percent = v;
};
//Установка цвета в формате #****** или #***
this.Color = function (val) {
if (val === undefined) return color;
var c = val.match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i);
color = (c === null) ? '#000000' : c[0];
};
//Функция изменения начальной координаты и размеров прямоугольника
this.RectParam = function (_x, _y, _w, _h) {
rAll.RectParam(_x, _y, _w, _h);
};
//Функция изменения прямоугольника по другому прямоугольнику
this.Rect = function (val) {
if (val === undefined) return rAll;
rAll.Rect(val);
};
//Изменение направления отрисовки процентов
this.Rotate = function (val) {
if (val === undefined) return rotate;
rotate = (typeof val === 'boolean') ? val : false;
};
//Перерасчитываем элементы
function Rebuild() {
var size = ((!rotate) ? rAll.H() : rAll.W()) * percent / 100;
rPerc.RectParam(
rAll.X(),
(rotate) ? rAll.Y() : rAll.Y() + rAll.H() - size,
(!rotate) ? rAll.W() : size,
(rotate) ? rAll.H() : size
);
}
//Рисуем проценты
this.Print = function (ctx) {
Rebuild();
ctx.fillStyle = color;
ctx.strokeStyle = color;
ctx.fillRect(rPerc.X(), rPerc.Y(), rPerc.W(), rPerc.H());
ctx.strokeRect(rAll.X(), rAll.Y(), rAll.W(), rAll.H());
};
//Рисуем текст
this.PrintText = function (ctx) {
ctx.save();
ctx.translate(rAll.X() + rAll.W() / 2, rAll.Y() + rAll.H() / 2);
if (!rotate) ctx.rotate(3 * Math.PI / 2);
ctx.fillStyle = '#888';
ctx.textAlign = 'center';
ctx.textBaseline = 'middle';
if (!rotate)
ctx.font = (rAll.W() - 10 < 0 ? 0 : rAll.W() - 10) + 'px Arial';
else
ctx.font = (rAll.H() - 10 < 0 ? 0 : rAll.H() - 10) + 'px Arial';
ctx.fillText(Math.floor(percent * 100) / 100 + '%', 0, 0);
ctx.restore();
};
}

View File

@@ -0,0 +1,183 @@
function ProcessColumn(x, y, w, h) {
//Основной прямоугольник
var rAll = new Rectangle(x, y, w, h);
//Массив элементов под статусы
var rStat = [];
//Массив элементы под коэффициенты
var point = [];
//Проценты статуса
var percent = 0;
//Номер статуса
var status = 0;
/*Проценты поднимаются снизу вверх (false)
*или слева направо (true)*/
var rotate = false;
/*Функции для работы с координатами
* основного прямоугольника */
this.X = function (val) {
if (val === undefined) return rAll().X();
rAll().X(val);
};
this.Y = function (val) {
if (val === undefined) return rAll().Y();
rAll().Y(val);
};
this.W = function (val) {
if (val === undefined) return rAll().W();
rAll().W(val);
};
this.H = function (val) {
if (val === undefined) return rAll().H();
rAll().H(val);
};
//Установка процента от 0 до 100
this.Percent = function (val) {
if (val === undefined) return percent;
var v = parseFloat(val);
percent = (isNaN(v) || v < 0) ? 0 :
(v > 100) ? 100 : v;
};
//Установка статуса от 0 до (кол-во элементов в массиве статусов - 1)
this.Status = function (val) {
if (val === undefined) return status;
var v = parseInt(val);
status = (isNaN(v) || v < 0 || rStat.length === 0) ? 0 :
(v >= rStat.length) ? (rStat.length - 1) : v;
};
//Функция изменения начальной координаты и размеров прямоугольника
this.RectParam = function (_x, _y, _w, _h) {
rAll.RectParam(_x, _y, _w, _h);
};
//Функция изменения прямоугольника по другому прямоугольнику
this.Rect = function (val) {
if (val === undefined) return rAll;
rAll.Rect(val);
};
//Изменение направления отрисовки процентов
this.Rotate = function (val) {
if (val === undefined) return rotate;
rotate = (typeof val === 'boolean') ? val : false;
for (var i = 0; i < rStat.length; i++)
rStat[i].Rotate(rotate);
};
//Количество статусов
this.StatCount = function () {
return rStat.length;
};
//Установка коеффициента
function Point(_index, _point) {
var idx = parseInt(_index);
var pnt = parseFloat(_point);
if (!isNaN(idx)) {
while (idx >= point.length)
point.push(1);
point[idx] = isNaN(pnt) || pnt <= 0 ? 1 : pnt;
}
}
//Установка нового статуса
this.AddRStat = function (index, point, color) {
var idx = parseInt(index);
if (isNaN(idx) || idx < 0 || idx - 1 > rStat.length) {
rStat.push(new PercentColumn());
idx = rStat.length - 1;
}
else
rStat.splice(idx, 0, new PercentColumn());
rStat[idx].Color(color);
Point(idx, point);
};
//Изменение статуса
this.ChangeRStat = function (index, point, color) {
var idx = parseInt(index);
if (!isNaN(idx) && idx >= 0 && idx < rStat.length) {
rStat[idx].Color(color);
Point(idx, point);
}
};
//Удаление статуса
this.DelRStat = function (index) {
var idx = parseInt(index);
if (!isNaN(idx) && idx >= 0 && idx < rStat.length) {
rStat.splice(idx, 1);
point.splice(idx, 1);
}
else if (rStat.length > 0) {
rStat.pop();
point.pop();
}
};
//Заполнение столбца процесса по умолчанию
this.BuildDefault = function () {
var defaultPoint = [57, 49, 49, 71, 28, 49, 21, 171, 114, 103];
var defaultColor = ["#0ff", "#00f", "#f00", "#0f0", "#0ff", "#00f", "#8500b6", "#f00", "#f0f", "#0f0"];
while(rStat.length > 0)
this.DelRStat();
for (var i = 0; i < defaultPoint.length; i++)
this.AddRStat(i, defaultPoint[i], defaultColor[i]);
};
//Сумма всех коэффициентов
function AllPoint() {
var count = 0;
for (var i = 0; i < point.length; i++)
count += point[i];
return count;
}
//
function PointSize() {
var res = ((rotate) ? rAll.W() : rAll.H()) - (1 + rStat.length);
res = (res < 0) ? 0 : res;
return (AllPoint() <= 0) ? 0 : (res / AllPoint());
}
//Перерасчет статусов и процентов
function Restat() {
for (var i = 0; i < rStat.length; i++) {
rStat[i].Percent(i < status ? 100 : i == status ? percent : 0);
}
}
//Перерасчет размеров статусов
function Rebuild() {
var _x = rAll.X() + 1;
var _y = rAll.Y() + 1;
for (var i = 0; i < rStat.length; i++) {
var currStat = (rotate) ? i : rStat.length - (i + 1);
var _w = (!rotate) ? rAll.W() - 2 : point[currStat] * PointSize();
var _h = (rotate) ? rAll.H() - 2 : point[currStat] * PointSize();
rStat[currStat].RectParam(_x, _y, _w, _h);
_x = (!rotate) ? _x : _x + 1 + _w;
_y = (rotate) ? _y : _y + 1 + _h;
}
}
//Печать столбца процесса
this.Print = function (ctx) {
this.Rotate(rotate);
Restat();
Rebuild();
ctx.clearRect(rAll.X(), rAll.Y(), rAll.W(), rAll.H());
ctx.fillStyle = '#ddd';
ctx.fillRect(rAll.X(), rAll.Y(), rAll.W(), rAll.H());
for (var i = 0; i < rStat.length; i++)
if (i <= status)
rStat[i].Print(ctx);
ctx.strokeStyle = '#000'; //'#333'
ctx.strokeRect(rAll.X(), rAll.Y(), rAll.W(), rAll.H());
};
//Печать текста столбца процесса
this.PrintText = function (ctx) {
this.Rotate(rotate);
Restat();
Rebuild();
ctx.save();
ctx.translate(rAll.X() + rAll.W() / 2, rAll.Y() + rAll.H() / 2);
if (!rotate) ctx.rotate(3 * Math.PI / 2);
ctx.fillStyle = '#888';
ctx.textAlign = 'center';
ctx.textBaseline = 'middle';
if (!rotate)
ctx.font = (rAll.W() - 10 < 0 ? 0 : rAll.W() - 10) + 'px Arial';
else
ctx.font = (rAll.H() - 10 < 0 ? 0 : rAll.H() - 10) + 'px Arial';
ctx.fillText((Math.floor(percent * 100) / 100) + '% ' + (status + 1) + '/' + rStat.length, 0, 0);
ctx.restore();
};
}

View File

@@ -0,0 +1,46 @@
//Объявление класса прямоугольника
function Rectangle(x, y, w, h) {
/*Функции для работы с координатами
* основного прямоугольника */
function chkVal(val) {
var a = parseFloat(val);
return (isNaN(a) || a < 0) ? 0 : a;
}
this.X = function (val) {
if (val === undefined) return x;
x = chkVal(val);
};
this.Y = function (val) {
if (val === undefined) return y;
y = chkVal(val);
};
this.W = function (val) {
if (val === undefined) return w;
w = chkVal(val);
};
this.H = function (val) {
if (val === undefined) return h;
h = chkVal(val);
};
//Функция изменения начальной координаты и размеров прямоугольника
this.RectParam = function (_x, _y, _w, _h) {
this.X(_x);
this.Y(_y);
this.W(_w);
this.H(_h);
};
//Функция изменения прямоугольника по другому прямоугольнику
this.Rect = function (val) {
if (val === undefined) return this;
this.RectParam(val.X(), val.Y(), val.W(), val.H());
};
//Первая инициализация
if (x === undefined) x = 0;
else this.X(x);
if (y === undefined) y = 0;
else this.Y(y);
if (w === undefined) w = 0;
else this.W(w);
if (h === undefined) h = 0;
else this.H(h);
}