Skip to content

Commit

Permalink
feat: [ambient_light_on][ambient_light_off]追加: 環境光のオンオフ切り替え
Browse files Browse the repository at this point in the history
  • Loading branch information
@ogihara88sai
ogihara88sai committed Aug 12, 2022
1 parent 6df78af commit fdfa99e
Show file tree
Hide file tree
Showing 5 changed files with 154 additions and 65 deletions.
20 changes: 18 additions & 2 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
【開発環境】Windows 10 64bit OS
【製作者】荻原(おぎはら)
【連絡先】https://twitter.com/ogihara88sai
【バージョン】1.0.2
【最終更新日】2022.07.21 19:11:12
【バージョン】1.1.0
【最終更新日】2022.08.12 22:22:27
【動作デモ】https://ogihara88sai.github.io/tsp-ambient-light/latest/
【ダウンロード】https://github.com/ogihara88sai/tsp-ambient-light/releases
【ライセンス】MIT
Expand Down Expand Up @@ -173,6 +173,18 @@ name パラメータを指定することで現在画面上に出ているキャ

指定できるパラメータはありません。

### [ambient_light_off] 環境光の無効化

環境光の効果をオフにします。環境光の効果を再開するには [ambient_light_on] タグを使用してください。

指定できるパラメータはありません。

### [ambient_light_on] 環境光の有効化

環境光の効果をオンにします（プラグインを読み込んだ直後はオンの状態です）。環境光の効果を一時的にオフにしたい場合には [ambient_light_off] タグを使用してください。

指定できるパラメータはありません。

---

## 更新履歴
Expand All @@ -188,3 +200,7 @@ name パラメータを指定することで現在画面上に出ているキャ
#### v1.0.2

- v1.0.1 で Mac を一律で非サポートと判定していましたが、Mac においても Chrome なら動作可能との報告を受けましたので（ダメなのは Safari）、「iOS および Safari」でプラグインを無効化する仕様に変更しました。

### v1.1.0

- [ambient_light_on] タグおよび [ambient_light_off] タグを追加しました。
57 changes: 46 additions & 11 deletions docs/latest/data/others/plugin/ambient_light/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@
default_shadow: true,
default_shadow_size: 16,
default_shadow_opacity: 0.3,
is_enabled: true,
storage_map: {},
}

Expand Down Expand Up @@ -65,19 +66,22 @@
const j_svg = $(`<svg viewbox="0 0 0 0" style="visible: hidden;">
<defs>
<filter id="ambient_light_filter" width="${filter_width}" height="${filter_height}">
<feFlood id="ambient_light_feflood" flood-color="white" flood-opacity="1" />
<feComposite in="ambient_light_feflood" in2="SourceAlpha" operator="atop" result="color_1"/>
<feFlood id="ambient_light_feflood_2" flood-color="white" flood-opacity="1" />
<feComposite in="ambient_light_feflood_2" in2="SourceAlpha" operator="atop" result="color_2"/>
<feBlend id="ambient_light_feblend_1" in="color_1" in2="SourceGraphic" mode="multiply" result="blend_main"/>
<feBlend id="ambient_light_feblend_2" in="color_2" in2="SourceGraphic" mode="hard-light" result="blend_sub"/>
<feComponentTransfer id="feComponentTransfer" in="blend_sub" result="blend_sub_alpha">
<feFuncA id="ambient_light_alpha" type="linear" slope="0"/>
</feComponentTransfer>
<feBlend in="blend_sub_alpha" in2="blend_main" mode="normal"/>
<feDropShadow id="ambient_light_shadow" dx="0" dy="0" stdDeviation="12" flood-color="white" flood-opacity="0" />
</filter>
</defs>
</svg>`).appendTo('body')
Expand Down Expand Up @@ -112,14 +116,17 @@
const updateStyle = () => {
const css_map = TG.stat.ambient_light_config.css_map
let css_str = ''
for (const selector in css_map) {
css_str += selector + '{'
const style_map = css_map[selector]
for (const prop in style_map) {
const value = style_map[prop]
css_str += `${prop}:${value};`
// 有効な場合のみ。無効な場合はスタイルを空っぽにする
if (TG.stat.ambient_light_config.is_enabled) {
for (const selector in css_map) {
css_str += selector + '{'
const style_map = css_map[selector]
for (const prop in style_map) {
const value = style_map[prop]
css_str += `${prop}:${value};`
}
css_str += '}'
}
css_str += '}'
}
j_style.text(css_str)
}
Expand Down Expand Up @@ -648,7 +655,7 @@

pm: {},

start: async () => {
start: () => {
// 非サポート環境では即nextOrder
if (!is_supported) {
TG.ftag.nextOrder()
Expand All @@ -660,9 +667,37 @@
},
}

// ================================
// [ambient_light_on]タグ定義
// ================================

TG.ftag.master_tag.ambient_light_on = {
kag: TG,

start: () => {
TG.stat.ambient_light_config.is_enabled = true
restore()
TG.ftag.nextOrder()
},
}

// ================================
// [ambient_light_off]タグ定義
// ================================

TG.ftag.master_tag.ambient_light_off = {
kag: TG,

start: () => {
TG.stat.ambient_light_config.is_enabled = false
restore()
TG.ftag.nextOrder()
},
}

// TYRANO.kag.onが使えるなら使おう
if (TG.on !== undefined) {
TG.on('load:complete', () => {
TG.on('load-beforemaking', () => {
restore()
})
}
Expand Down
83 changes: 43 additions & 40 deletions docs/tyranoscript_v488/data/others/plugin/ambient_light/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@ function _asyncToGenerator(fn) { return function () { var self = this, args = ar
default_shadow: true,
default_shadow_size: 16,
default_shadow_opacity: 0.3,
is_enabled: true,
storage_map: {}
}; //
// プラグインがサポートされているかどうかを確認
Expand Down Expand Up @@ -72,7 +73,7 @@ function _asyncToGenerator(fn) { return function () { var self = this, args = ar

var link_target_tag = TG.stat.mp.link || 'bg'; // SVG Filterの追加

var j_svg = $("<svg viewbox=\"0 0 0 0\" style=\"visible: hidden;\">\n <defs>\n <filter id=\"ambient_light_filter\" width=\"".concat(filter_width, "\" height=\"").concat(filter_height, "\">\n <feFlood id=\"ambient_light_feflood\" flood-color=\"white\" flood-opacity=\"1\" />\n <feComposite in=\"ambient_light_feflood\" in2=\"SourceAlpha\" operator=\"atop\" result=\"color_1\"/>\n \n <feFlood id=\"ambient_light_feflood_2\" flood-color=\"white\" flood-opacity=\"1\" />\n <feComposite in=\"ambient_light_feflood_2\" in2=\"SourceAlpha\" operator=\"atop\" result=\"color_2\"/>\n \n <feBlend id=\"ambient_light_feblend_1\" in=\"color_1\" in2=\"SourceGraphic\" mode=\"multiply\" result=\"blend_main\"/>\n <feBlend id=\"ambient_light_feblend_2\" in=\"color_2\" in2=\"SourceGraphic\" mode=\"hard-light\" result=\"blend_sub\"/>\n <feComponentTransfer id=\"feComponentTransfer\" in=\"blend_sub\" result=\"blend_sub_alpha\">\n <feFuncA id=\"ambient_light_alpha\" type=\"linear\" slope=\"0\"/>\n </feComponentTransfer>\n <feBlend in=\"blend_sub_alpha\" in2=\"blend_main\" mode=\"normal\"/>\n <feDropShadow id=\"ambient_light_shadow\" dx=\"0\" dy=\"0\" stdDeviation=\"12\" flood-color=\"white\" flood-opacity=\"0\" />\n </filter>\n </defs>\n </svg>")).appendTo('body'); // <feFlood>, <feBlend>, <feDropShadow>への参照
var j_svg = $("<svg viewbox=\"0 0 0 0\" style=\"visible: hidden;\">\n <defs>\n <filter id=\"ambient_light_filter\" width=\"".concat(filter_width, "\" height=\"").concat(filter_height, "\">\n\n <feFlood id=\"ambient_light_feflood\" flood-color=\"white\" flood-opacity=\"1\" />\n <feComposite in=\"ambient_light_feflood\" in2=\"SourceAlpha\" operator=\"atop\" result=\"color_1\"/>\n\n\n <feFlood id=\"ambient_light_feflood_2\" flood-color=\"white\" flood-opacity=\"1\" />\n <feComposite in=\"ambient_light_feflood_2\" in2=\"SourceAlpha\" operator=\"atop\" result=\"color_2\"/>\n\n <feBlend id=\"ambient_light_feblend_1\" in=\"color_1\" in2=\"SourceGraphic\" mode=\"multiply\" result=\"blend_main\"/>\n <feBlend id=\"ambient_light_feblend_2\" in=\"color_2\" in2=\"SourceGraphic\" mode=\"hard-light\" result=\"blend_sub\"/>\n <feComponentTransfer id=\"feComponentTransfer\" in=\"blend_sub\" result=\"blend_sub_alpha\">\n <feFuncA id=\"ambient_light_alpha\" type=\"linear\" slope=\"0\"/>\n </feComponentTransfer>\n <feBlend in=\"blend_sub_alpha\" in2=\"blend_main\" mode=\"normal\"/>\n <feDropShadow id=\"ambient_light_shadow\" dx=\"0\" dy=\"0\" stdDeviation=\"12\" flood-color=\"white\" flood-opacity=\"0\" />\n\n </filter>\n </defs>\n </svg>")).appendTo('body'); // <feFlood>, <feBlend>, <feDropShadow>への参照

var e_flood_main = j_svg.find('#ambient_light_feflood').get(0);
var e_flood_sub = j_svg.find('#ambient_light_feflood_2').get(0);
Expand Down Expand Up @@ -100,18 +101,20 @@ function _asyncToGenerator(fn) { return function () { var self = this, args = ar

var updateStyle = function updateStyle() {
var css_map = TG.stat.ambient_light_config.css_map;
var css_str = '';
var css_str = ''; // 有効な場合のみ。無効な場合はスタイルを空っぽにする

for (var selector in css_map) {
css_str += selector + '{';
var style_map = css_map[selector];
if (TG.stat.ambient_light_config.is_enabled) {
for (var selector in css_map) {
css_str += selector + '{';
var style_map = css_map[selector];

for (var prop in style_map) {
var value = style_map[prop];
css_str += "".concat(prop, ":").concat(value, ";");
}
for (var prop in style_map) {
var value = style_map[prop];
css_str += "".concat(prop, ":").concat(value, ";");
}

css_str += '}';
css_str += '}';
}
}

j_style.text(css_str);
Expand Down Expand Up @@ -822,42 +825,42 @@ function _asyncToGenerator(fn) { return function () { var self = this, args = ar
TG.ftag.master_tag.ambient_light_restore = {
kag: TG,
pm: {},
start: function () {
var _start5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee8() {
return _regeneratorRuntime().wrap(function _callee8$(_context8) {
while (1) {
switch (_context8.prev = _context8.next) {
case 0:
if (is_supported) {
_context8.next = 3;
break;
}

TG.ftag.nextOrder();
return _context8.abrupt("return");

case 3:
restore();
TG.ftag.nextOrder();
start: function start() {
// 非サポート環境では即nextOrder
if (!is_supported) {
TG.ftag.nextOrder();
return;
}

case 5:
case "end":
return _context8.stop();
}
}
}, _callee8);
}));
restore();
TG.ftag.nextOrder();
}
}; // ================================
// [ambient_light_on]タグ定義
// ================================

function start() {
return _start5.apply(this, arguments);
}
TG.ftag.master_tag.ambient_light_on = {
kag: TG,
start: function start() {
TG.stat.ambient_light_config.is_enabled = true;
restore();
TG.ftag.nextOrder();
}
}; // ================================
// [ambient_light_off]タグ定義
// ================================

return start;
}()
TG.ftag.master_tag.ambient_light_off = {
kag: TG,
start: function start() {
TG.stat.ambient_light_config.is_enabled = false;
restore();
TG.ftag.nextOrder();
}
}; // TYRANO.kag.onが使えるなら使おう

if (TG.on !== undefined) {
TG.on('load:complete', function () {
TG.on('load-beforemaking', function () {
restore();
});
}
Expand Down
57 changes: 46 additions & 11 deletions docs/tyranoscript_v514b/data/others/plugin/ambient_light/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@
default_shadow: true,
default_shadow_size: 16,
default_shadow_opacity: 0.3,
is_enabled: true,
storage_map: {},
}

Expand Down Expand Up @@ -65,19 +66,22 @@
const j_svg = $(`<svg viewbox="0 0 0 0" style="visible: hidden;">
<defs>
<filter id="ambient_light_filter" width="${filter_width}" height="${filter_height}">
<feFlood id="ambient_light_feflood" flood-color="white" flood-opacity="1" />
<feComposite in="ambient_light_feflood" in2="SourceAlpha" operator="atop" result="color_1"/>
<feFlood id="ambient_light_feflood_2" flood-color="white" flood-opacity="1" />
<feComposite in="ambient_light_feflood_2" in2="SourceAlpha" operator="atop" result="color_2"/>
<feBlend id="ambient_light_feblend_1" in="color_1" in2="SourceGraphic" mode="multiply" result="blend_main"/>
<feBlend id="ambient_light_feblend_2" in="color_2" in2="SourceGraphic" mode="hard-light" result="blend_sub"/>
<feComponentTransfer id="feComponentTransfer" in="blend_sub" result="blend_sub_alpha">
<feFuncA id="ambient_light_alpha" type="linear" slope="0"/>
</feComponentTransfer>
<feBlend in="blend_sub_alpha" in2="blend_main" mode="normal"/>
<feDropShadow id="ambient_light_shadow" dx="0" dy="0" stdDeviation="12" flood-color="white" flood-opacity="0" />
</filter>
</defs>
</svg>`).appendTo('body')
Expand Down Expand Up @@ -112,14 +116,17 @@
const updateStyle = () => {
const css_map = TG.stat.ambient_light_config.css_map
let css_str = ''
for (const selector in css_map) {
css_str += selector + '{'
const style_map = css_map[selector]
for (const prop in style_map) {
const value = style_map[prop]
css_str += `${prop}:${value};`
// 有効な場合のみ。無効な場合はスタイルを空っぽにする
if (TG.stat.ambient_light_config.is_enabled) {
for (const selector in css_map) {
css_str += selector + '{'
const style_map = css_map[selector]
for (const prop in style_map) {
const value = style_map[prop]
css_str += `${prop}:${value};`
}
css_str += '}'
}
css_str += '}'
}
j_style.text(css_str)
}
Expand Down Expand Up @@ -648,7 +655,7 @@

pm: {},

start: async () => {
start: () => {
// 非サポート環境では即nextOrder
if (!is_supported) {
TG.ftag.nextOrder()
Expand All @@ -660,9 +667,37 @@
},
}

// ================================
// [ambient_light_on]タグ定義
// ================================

TG.ftag.master_tag.ambient_light_on = {
kag: TG,

start: () => {
TG.stat.ambient_light_config.is_enabled = true
restore()
TG.ftag.nextOrder()
},
}

// ================================
// [ambient_light_off]タグ定義
// ================================

TG.ftag.master_tag.ambient_light_off = {
kag: TG,

start: () => {
TG.stat.ambient_light_config.is_enabled = false
restore()
TG.ftag.nextOrder()
},
}

// TYRANO.kag.onが使えるなら使おう
if (TG.on !== undefined) {
TG.on('load:complete', () => {
TG.on('load-beforemaking', () => {
restore()
})
}
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "tsp-ambient-light",
"version": "1.0.2",
"version": "1.1.0",
"description": "",
"main": "index.js",
"scripts": {
Expand Down

0 comments on commit fdfa99e

Please sign in to comment.