Browse Source

Initial commit

master
Mikanoshi 6 years ago
commit
e64b05d9e0
14 changed files with 674 additions and 0 deletions
  1. +131
    -0
      background.js
  2. +15
    -0
      config.xml
  3. BIN
      favicon.ico
  4. BIN
      icons/main.png
  5. BIN
      icons/main48.png
  6. +9
    -0
      index.html
  7. +81
    -0
      options.html
  8. +111
    -0
      options.js
  9. +23
    -0
      popup.html
  10. +35
    -0
      popup.js
  11. BIN
      style/backgr.png
  12. +269
    -0
      style/options.css
  13. BIN
      style/stlogo.jpg
  14. BIN
      style/title.jpg

+ 131
- 0
background.js View File

@@ -0,0 +1,131 @@
 var checkPeriod = 5 * 60000;
var dataurl = 'http://portal.setitagila.ru/reminder.php?ver=informst1.0';
var btn;
var storage = widget.preferences;
var iswarning = false;
var islowb = false;
var islowt = false;
//var date;
var balance = '-';
var tariffnow = '-';
var tariffthen = '-';
var tariffstatus = '-';
var tariffprice = '-';
var blinkTimer;
opera.extension.addEventListener('message', function(e)
{
switch(e.data.informst) {
case 'doNotify': doNotify(); break;
case 'fillPopup': fillPopup(e); break;
}
}, false);
function blink()
{
btn.badge.backgroundColor = '#f0ffff';
if (btn.badge.color != '#ff0000') btn.badge.color = '#ff0000'; else btn.badge.color = 'black';
}
function fillPopup(e) {
e.source.postMessage({informst_fillpopup: {balance: balance, tariffnow: tariffnow, tariffthen: tariffthen, tariffstatus: tariffstatus, tariffprice: tariffprice, iswarning: iswarning, islowb: islowb, islowt: islowt}});
}
function doNotify() {
iswarning = false;
islowb = false;
islowt = false;
if (storage.informst_notify1 == 1)
{
if (balance <= storage.informst_balanceRub)
{
islowb = true;
iswarning = true;
}
}
if (storage.informst_notify2 == 1)
{
dt = new Date();
dim = new Date(dt.getFullYear(), 1 + dt.getMonth(), 0).getDate();
if ((dim - dt.getDate()) <= storage.informst_balanceDay & (balance - (dim - dt.getDate() + 1) * 8) <= tariffprice)
{
islowt = true;
iswarning = true;
}
}
btn.title = 'Текущий баланс: ' + balance + ' руб.' + "\r\n" +
'Текущий тариф: ' + tariffnow + ' (' + (tariffstatus == 'on' ? 'включен' : 'ОТКЛЮЧЕН') + ")\r\n" +
'Тариф в след. месяце: ' + tariffthen + "\r\n" +
'Стоимость тарифа в след. месяце: ' + tariffprice + ' руб.';
btn.popup.height = 130;
if (islowb) btn.popup.height += 27;
if (islowt) btn.popup.height += 27;
if (iswarning == true)
{
if (islowb || islowt) btn.title += "\r\n";
if (islowb) btn.title += "\r\nУ Вас мало денег на счету!";
if (islowt) btn.title += "\r\nСредств не хватит на начало след. месяца!";
if (storage.informst_warn2 == 1)
{
clearInterval(blinkTimer);
blinkTimer = setInterval(blink, 1000);
} else {
clearInterval(blinkTimer);
btn.badge.color = '#FF0000';
btn.badge.backgroundColor = '#F0FFFF';
}
}
else
{
clearInterval(blinkTimer);
btn.badge.color = storage.informst_bstyle_fcolor || 'black';
btn.badge.backgroundColor = storage.informst_bstyle_bcolor || 'white';
}
}
function fetchData() {
var req = new XMLHttpRequest();
req.onreadystatechange = function()
{
if (req.readyState == 4)
{
clearTimeout(reqTimeout);
var datatag = req.responseXML.getElementsByTagName('data')[0];
//date = datatag.getElementsByTagName('date')[0].textContent;
balance = parseFloat(datatag.getElementsByTagName('balance')[0].textContent);
tariffnow = datatag.getElementsByTagName('tariffnow')[0].textContent;
tariffthen = datatag.getElementsByTagName('tariffthen')[0].textContent;
tariffstatus = datatag.getElementsByTagName('tariffstatus')[0].textContent;
tariffprice = parseInt(datatag.getElementsByTagName('tariffprice')[0].textContent);
btn.badge.display = 'block';
btn.badge.textContent = balance;
btn.disabled = false;
doNotify();
}
};
req.open('GET', dataurl + '&timerand=' + (new Date()).getTime(), true);
var reqTimeout = setTimeout(timeoutFunc, 5000);
function timeoutFunc(){
req.abort();
}
req.send(null);
}
window.addEventListener('DOMContentLoaded', function () {
checkTimer = setInterval(fetchData, checkPeriod);
fetchData();
btn = opera.contexts.toolbar.createItem({
disabled: true,
title: 'Информер баланса "СетиТагила"',
icon: 'icons/main.png',
badge: { display: 'none', textContent: '', color: 'white', backgroundColor: 'black' },
popup: { href: "popup.html", width: 670, height: 130 }
});
opera.contexts.toolbar.addItem(btn);
doNotify();
}, false);

+ 15
- 0
config.xml View File

@@ -0,0 +1,15 @@
<?xml version='1.0' encoding='utf-8'?>
<widget xmlns="http://www.w3.org/ns/widgets" version="1.0" id="https://addons.opera.com/addons/extensions/details/informst/">
<name>Информер баланса "СетиТагила"</name>
<icon src="icons/main48.png"/>
<author href="http://code.highspec.ru/informst_about.htm" email="iam@mikanoshi.name">Mikanoshi</author>
<access origin="*"/>
<description xml:lang="ru">Отображает текущий баланс Вашего счета у интернет провайдера «СетиТагила» и предупреждает, если средства на счету заканчиваются.
Возможности:&#13;
* Отображение текущего баланса в подписи к кнопке расширения, в подсказке к кнопке информация о тарифе в текущем и следующем месяцах&#13;
* Уведомление о том, что на балансе мало средств (сумма настраивается), и что на следующий месяц не хватит средств для продления тарифа (настраивается количество дней до конца месяца, за которое уведомлять)&#13;
* Два вида уведомлений - выделение суммы в подписи красным с миганием и без&#13;
* Различные стили подписи&#13;
* Всплывающее окно при нажатии на кнопку расширения, содержит те же данные, что и в подсказке, но со ссылками в кабинет и на страницу управления тарифами на portal.setitagila.ru
</description>
</widget>

BIN
favicon.ico View File

Before After

BIN
icons/main.png View File

Before After
Width: 24  |  Height: 24  |  Size: 1.6KB

BIN
icons/main48.png View File

Before After
Width: 48  |  Height: 48  |  Size: 4.5KB

+ 9
- 0
index.html View File

@@ -0,0 +1,9 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Èíôîðìåð áàëàíñà "Ñåòè Òàãèëà"</title>
<script type="text/javascript" src="background.js"></script>
</head>
<body>
</body>
</html>

+ 81
- 0
options.html View File

@@ -0,0 +1,81 @@
<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" href="style/options.css">
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title id="widget-title">Информер баланса "СетиТагила"</title>
<script type="text/javascript" src="options.js"></script>
</head>
<body>
<div id="header">
<a href="http://setitagila.ru/" class="noborder" target="_blank"><img src="style/stlogo.jpg"></a>
<div id="widget-name"><a class="titlelink" href="http://portal.setitagila.ru/tools/cabinet/index.php" target="_blank">Информер баланса 1.0</a></div>
<br /><br />
</div>
<div>
<h3>Настройки уведомлений</h3>
<h4>
Уведомлять, если...<br />
<input type="checkbox" name="notify1" checked="checked" id="notify1"/><label for="notify1"> баланс счёта менее <input class="numField" maxlength="6" id="balanceRub" value="30" /> руб.</label>
<br />
<input type="checkbox" name="notify2" checked="checked" id="notify2"/><label for="notify2"> баланса не хватит для продления тарифа на следующий месяц, за <input class="numField" maxlength="2" id="balanceDay" value="7" /> дн.</label>
<br /><br />
Вид уведомлений<br />
<input type="radio" id="warn1" name="warnStyle"checked="checked">
<label for="warn1"> выделение баланса красным цветом <div class="badgeStyle bSw">000</div></label>
<br />
<input type="radio" id="warn2" name="warnStyle">
<label for="warn2"> мигание красным цветом <div class="badgeStyle bSw" id="warnBadge2">000</div></label>
</h4>
<h3>Стиль отображения баланса</h3>
<h4>
<input type="radio" id="badgeStyle1" name="badgeStyle" value="1">
<label for="badgeStyle1"><div class="badgeStyle bS1">000</div></label>
<input type="radio" id="badgeStyle2" name="badgeStyle" value="2" checked="checked">
<label for="badgeStyle2"><div class="badgeStyle bS2">000</div></label>
<input type="radio" id="badgeStyle3" name="badgeStyle" value="3">
<label for="badgeStyle3"><div class="badgeStyle bS3">000</div></label>
<input type="radio" id="badgeStyle4" name="badgeStyle" value="4">
<label for="badgeStyle4"><div class="badgeStyle bS4">000</div></label>
<input type="radio" id="badgeStyle5" name="badgeStyle" value="5">
<label for="badgeStyle5"><div class="badgeStyle bS5">000</div></label>
<br />
<input type="radio" id="badgeStyle6" name="badgeStyle" value="6">
<label for="badgeStyle6"><div class="badgeStyle bS6">000</div></label>
<input type="radio" id="badgeStyle7" name="badgeStyle" value="7">
<label for="badgeStyle7"><div class="badgeStyle bS7">000</div></label>
<input type="radio" id="badgeStyle8" name="badgeStyle" value="8">
<label for="badgeStyle8"><div class="badgeStyle bS8">000</div></label>
<input type="radio" id="badgeStyle9" name="badgeStyle" value="9">
<label for="badgeStyle9"><div class="badgeStyle bS9">000</div></label>
<input type="radio" id="badgeStyle10" name="badgeStyle" value="10">
<label for="badgeStyle10"><div class="badgeStyle bS10">000</div></label>
</h4>
<!--
<div id="separator"></div>
<h3>Сторонний контент</h3>
<ul>
<li></li>
</ul>
-->
</div>
<div id="footer">
<p>Идея взята из <a href="http://portal.setitagila.ru/forum/index.php?showtopic=27906" target="_blank">одноимённого расширения для FireFox</a><br />
by <a href="http://portal.setitagila.ru/forum/index.php?showuser=6781" target="_blank">Олег Козлов aka OlegNT2</a>
<br />
2012 © <a href="http://mikanoshi.name">Mikanoshi</a></p>
</div>
</body>
</html>

+ 111
- 0
options.js View File

@@ -0,0 +1,111 @@
window.addEventListener('DOMContentLoaded', function () {
function isNumeric(string) {
var numericExpression = /^[0-9]+$/;
if(string.match(numericExpression)) { return true; } else { return false; }
}
var storage = widget.preferences;
var notify1 = document.getElementById('notify1');
var notify2 = document.getElementById('notify2');
var warn1 = document.getElementById('warn1');
var warn2 = document.getElementById('warn2');
var balanceRub = document.getElementById('balanceRub');
var balanceDay = document.getElementById('balanceDay');
switch (storage.informst_notify1) {
case '0': notify1.checked = false; break;
case '1': notify1.checked = true; break;
default: notify1.checked = true;
}
switch (storage.informst_notify2) {
case '0': notify2.checked = false; break;
case '1': notify2.checked = true; break;
default: notify2.checked = true;
}
switch (storage.informst_warn2) {
case '0': warn1.checked = true; break;
case '1': warn2.checked = true; break;
default: warn1.checked = true;
}
if (storage.informst_balanceRub) balanceRub.value = storage.informst_balanceRub; else balanceRub.value = 30;
if (storage.informst_balanceDay) balanceDay.value = storage.informst_balanceDay; else balanceDay.value = 7;
notify1.addEventListener('change', function(e) {
if (notify1.checked) storage.informst_notify1 = 1; else storage.informst_notify1 = 0;
opera.extension.postMessage({informst: 'doNotify'});
}, true);
notify2.addEventListener('change', function(e) {
if (notify2.checked) storage.informst_notify2 = 1; else storage.informst_notify2 = 0;
opera.extension.postMessage({informst: 'doNotify'});
}, true);
warn1.addEventListener('change', function(e) {
if (warn1.checked) storage.informst_warn2 = 0;
opera.extension.postMessage({informst: 'doNotify'});
}, true);
warn2.addEventListener('change', function(e) {
if (warn2.checked) storage.informst_warn2 = 1;
opera.extension.postMessage({informst: 'doNotify'});
}, true);
balanceRub.addEventListener('change', function(e) {
if (isNumeric(balanceRub.value)) storage.informst_balanceRub = balanceRub.value;
opera.extension.postMessage({informst: 'doNotify'});
}, true);
balanceDay.addEventListener('change', function(e) {
if (isNumeric(balanceDay.value)) storage.informst_balanceDay = balanceDay.value;
opera.extension.postMessage({informst: 'doNotify'});
}, true);
var bstyle = storage.informst_bstyle;
if (bstyle != null)
document.getElementById('badgeStyle' + bstyle).checked = true;
else
document.getElementById('badgeStyle2').checked = true;
function varScope(i)
{
document.getElementById('badgeStyle' + i).addEventListener('change', function(e) {
storage.informst_bstyle = i;
var cl, bcl;
switch (i)
{
case 0: cl = ''; bcl = ''; break;
case 1: cl = 'white'; bcl = 'black'; break;
case 2: cl = 'black'; bcl = 'white'; break;
case 3: cl = '#1B392C'; bcl = 'white'; break;
case 4: cl = '#7499B2'; bcl = 'white'; break;
case 5: cl = '#555555'; bcl = '#F5EED3'; break;
case 6: cl = '#3E0A02'; bcl = '#F1DADA'; break;
case 7: cl = '#023E1F'; bcl = '#DBF1DA'; break;
case 8: cl = '#DEDEE7'; bcl = '#464959'; break;
case 9: cl = '#E3DEE7'; bcl = '#4F435C'; break;
case 10: cl = '#DEE7DE'; bcl = '#3F5446'; break;
default: cl = 'white'; bcl = 'black';
}
storage.informst_bstyle_bcolor = bcl;
storage.informst_bstyle_fcolor = cl;
opera.extension.postMessage({informst: 'doNotify'});
}, true);
};
for (var i = 1; i <= 10; i++) varScope(i);
function blink()
{
text = document.getElementById('warnBadge2');
if (text.style.color != 'rgb(255, 0, 0)') text.style.color = '#FF0000'; else text.style.color = 'black';
}
setInterval(blink, 1000);
}, false );

+ 23
- 0
popup.html View File

@@ -0,0 +1,23 @@
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>GeoData for IP</title>
<script type="text/javascript" src="popup.js"></script>
<style>
* { font-family: Verdana, Arial; color: #000; font-size: 14px; overflow: hidden }
body { padding-bottom: 0; margin-bottom: 0 }
table { width: 650px; }
table td { padding: 0 5px; height: 27px }
table td:nth-child(2n) { text-align: right }
table td:nth-child(2n+1) { white-space: nowrap; padding-right: 5px }
table tr:nth-child(1) td:nth-child(2) { font-weight: bold }
table tr:nth-child(2n) { background-color: #FFFBF2 }
</style>
</head>
<body>
<table style="display: table" cellpadding="0" cellspacing="0" id="infotable"></table>
</body>
</html>

+ 35
- 0
popup.js View File

@@ -0,0 +1,35 @@
window.addEventListener('DOMContentLoaded', function () {
var storage = widget.preferences;
var infotable = document.getElementById('infotable');
opera.extension.onmessage = function(e)
{
if (e.data.informst_fillpopup) {
var data = e.data.informst_fillpopup;
var xbody = document.createElement("tbody");
infotable.appendChild(xbody);
infotable = xbody;
if (data.iswarning)
infotable.innerHTML = '<tr><td>Текущий баланс</td><td><span><a style="color: #FF0000" href="http://portal.setitagila.ru/tools/cabinet/index.php?item=mainData">' + data.balance + ' руб.</a></span></td></tr>';
else
infotable.innerHTML = '<tr><td>Текущий баланс</td><td><span><a href="http://portal.setitagila.ru/tools/cabinet/index.php?item=mainData">' + data.balance + ' руб.</a></span></td></tr>';
infotable.innerHTML += '\
<tr><td>Текущий тариф</td><td><span><a href="http://portal.setitagila.ru/tools/cabinet/index.php?item=bezlimit">' + data.tariffnow + '</a> (' + (data.tariffstatus == 'on' ? 'включен' : 'ОТКЛЮЧЕН') + ')</span></td></tr>\
<tr><td>Тариф в след. месяце</td><td><span>' + data.tariffthen + '</span></td></tr>\
<tr><td>Стоимость тарифа в след. месяце</td><td><span>' + data.tariffprice + ' руб.</span></td></tr>\
';
if (data.islowb)
infotable.innerHTML += '<tr><td colspan="2" style="text-align: right; color: #FF0000">У Вас мало денег на счету!</td></td></tr>';
if (data.islowt)
infotable.innerHTML += '<tr><td colspan="2" style="text-align: right; color: #FF0000">Средств не хватит на начало след. месяца!</td></td></tr>';
return;
}
}
opera.extension.postMessage({informst: 'fillPopup'});
}, false);

BIN
style/backgr.png View File

Before After
Width: 1  |  Height: 381  |  Size: 144B

+ 269
- 0
style/options.css View File

@@ -0,0 +1,269 @@
html {
background: #FFFFFF url(backgr.png) repeat-x;
}
body {
font: 13px/24px Segoe UI, Arial, MS Sans Serif, Verdana;
color: #1B392C;
width: 700px;
max-width: 700px;
min-width: 700px;
overflow-x: hidden;
background: rgba(255,255,255,1);
margin: 50px auto;
border: 1px solid rgba(255,255,255,0.8);
box-shadow: 0 0 10px #CCCCCC;
border-radius: 20px;
}
#header {
display: block;
text-align: center;
padding: 30px 50px 5px 50px;
margin: 20px 0 20px 0;
border-bottom: 1px dotted #AAA;
box-shadow: 0 1px #fff;
}
#footer {
display: block;
text-align: center;
padding: 0 50px;
margin: 50px 50px 0 50px;
border-top: 1px dotted #AAA;
}
div {
display: block;
text-align: left;
padding: 0 10px;
margin: 10px 50px 0 50px;
}
h1 {
margin: 0;
font-size: 24px;
}
h2 {
margin-top: -3px;
font-weight: normal;
font-size: 16px;
}
h3 {
font-weight: bold;
margin-top: 20px;
}
h4 {
margin-bottom: 0;
margin-top: 15px;
margin-left: 25px;
font-weight: normal;
}
option, select {
padding: 2px 0;
}
a {
color: #3B594C;
padding: 0;
letter-spacing: 0pt;
font-style: normal;
text-decoration: none;
}
a:visited {
color: #3B594C;
text-decoration: none;
}
a:link {
color: #3B594C;
text-decoration: none;
}
a:hover {
border-bottom: 1px dashed #5B796C;
color: #5B796C;
text-decoration: none;
}
a:active {
border-bottom: 1px dashed #5B796C;
color: #5B796C;
text-decoration: none;
}
a:focus {
border-bottom: 1px dashed #5B796C;
color: #5B796C;
text-decoration: none;
}
input {
font-family: Verdana, "Lucida Grande", "Lucida Sans Unicode", Tahoma, Verdana, sans-serif;
padding: 2px 2px;
border: none;
font-size: 13px;
border: 1px solid #AAAAAA;
text-decoration: none;
}
.picker {
height: 48px;
width: 48px;
background-color: #FFFFFF;
display: inline;
clear: none;
border: 1px solid #AAAAAA;
}
.badgeStyle {
display: inline-block;
text-align: center;
vertical-align: middle;
width: 19px;
height: 11px;
line-height: 11px;
font-size: 11px;
font-weight: bold;
margin: 0;
margin-right: 25px;
padding: 1px;
padding-left: 2px;
border-radius: 5px;
overflow: hidden;
}
.bS0 {
width: auto;
}
.bS1 {
box-shadow: inset 0 0 4px #666;
background-color: black;
border: 1px solid transparent;
color: white;
}
.bS2 {
box-shadow: inset 0 0 4px #ccc;
background-color: white;
color: black;
border: 1px solid #d7d7d7;
}
.bS3 {
box-shadow: inset 0 0 4px #ccc;
background-color: white;
color: #1B392C;
border: 1px solid #d7d7d7;
}
.bS4 {
box-shadow: inset 0 0 4px #ccc;
background-color: white;
color: #7499B2;
border: 1px solid #d7d7d7;
}
.bS5 {
box-shadow: inset 0 0 4px #ccc;
background-color: #F5EED3;
color: #555555;
border: 1px solid #d7d7d7;
}
.bS6 {
box-shadow: inset 0 0 4px #ccc;
background-color: #F1DADA;
color: #3E0A02;
border: 1px solid #d7d7d7;
}
.bS7 {
box-shadow: inset 0 0 4px #ccc;
background-color: #DBF1DA;
color: #023E1F;
border: 1px solid #d7d7d7;
}
.bS8 {
box-shadow: inset 0 0 4px #ccc;
background-color: #464959;
border: 1px solid transparent;
color: #DEDEE7;
}
.bS9 {
box-shadow: inset 0 0 4px #ccc;
background-color: #4F435C;
border: 1px solid transparent;
color: #E3DEE7;
}
.bS10 {
box-shadow: inset 0 0 4px #ccc;
background-color: #3F5446;
color: #DEE7DE;
}
.bSw {
box-shadow: inset 0 0 4px #ccc;
background-color: #F0FFFF;
color: #FF0000;
border: 1px solid #d7d7d7;
}
#separator {
display: block;
height: 20px;
width: 100%;
margin: 0;
padding: 0;
border-bottom: 1px dotted #AAA;
}
#plugintable td {
vertical-align: middle;
}
.input_btn {
border-radius: 7px;
padding: 5px;
margin-bottom: 10px;
}
.input_btn:hover {
cursor: pointer;
}
#widget-name {
width: 286px;
height: 64px;
background: url(title.jpg) 3px -2px no-repeat;
font-size: 18px;
font-weight: bold;
line-height: 64px;
color: #EEE;
vertical-align: middle;
text-align: center;
margin: 0 0 0 20px;
padding-left: 3px;
float: right;
}
.numField {
width: 50px;
}
.titlelink, .titlelink:link {
color: #F3F3F3;
padding: 0;
letter-spacing: 0pt;
font-style: normal;
text-decoration: none;
}
.titlelink:hover, .titlelink:focus {
color: #FFF;
border: 0;
}
.noborder:hover, .noborder:focus {
border: 0;
}

BIN
style/stlogo.jpg View File

Before After
Width: 259  |  Height: 58  |  Size: 9.3KB

BIN
style/title.jpg View File

Before After
Width: 283  |  Height: 64  |  Size: 11KB

Loading…
Cancel
Save