ACTでbrunokratka-overlayを導入する方法

URLをコピーする
URLをコピーしました!
FF14 ACT brunokratka-overlay

brunokratka-overlayの導入方法をまとめました。

目次

brunokratka-overlayとは?

brunokratkaさんが作られたデザインです。
ACTのオーバーレイを通じてゲーム画面上にDPSを表示してくれます。

skin固有の名前が無かったので作者の方の名前を仮に付けさせてもらっています。

下の方にメモで残してるけど、こんな感じでカスタマイズして使ってます

FF14 ACT brunokratka-overlay
FF14 ACT brunokratka-overlay

brunokratka-overlayの導入方法

STEP
brunokratka-overlayのファイルをDLして解凍後、任意の所に設置します。
STEP
ACTの「OverlayPlugin.dll」タブで「追加」から「Preset」をCustom、「種類」をMiniParseで任意の名前を付けて保存します。
STEP
「オーバーレイを表示する」と「オーバーレイを有効にする」に✓、
「表示するURL」でTears.htmlを指定、
「オーバーレイの表示をリロード」を押します。
STEP
左上に出てくると思います。
ドラッグで任意の所に動かして右下でサイズを変えられます。

導入は以上です。

  • 表示させるとこんな感じです。

お疲れ様でした!

メモ

少しだけ自分用にTears.htmlを弄った備忘録です。
元の書式はなるべく残しつつやってるので元にも戻しやすい気がします(オリジナル再DLも良いですし)

背景を透過させたい場合

18行あたり
  • background-colorを0にした

before

    html{
        height: 100%;
        overflow: hidden;
        border-radius: 10px;
        font-family: Meiryo;
        box-sizing: border-box;
        background-repeat: no-repeat;
        background-position: bottom right;
        background-color: rgba(0, 0, 0, 0.2);
      }

after

    html{
        height: 100%;
        overflow: hidden;
        border-radius: 10px;
        font-family: Meiryo;
        box-sizing: border-box;
        background-repeat: no-repeat;
        background-position: bottom right;
        background-color: rgba(0, 0, 0, 0.0);
      }

OverHの表示位置がACCと被って見えないのでズラしたい場合

130行あたり
  • margin-leftの値を増やした

before

      li .hps{
        margin-left: 8px;
      }

after

       li .hps{
        margin-left: 80px;
      }

命中率は基本100%なのでACCは要らない場合

130行/624行あたり
  • ACCをコメントアウトさせてOverHのmargin-leftを0にした

before

      li .hps{
        margin-left: 8px;
      }
          row.querySelector('.tohit').innerHTML = 'ACC ' + combatant.tohit + '%'; // Accuracy
          // encDPS html span required
          // row.querySelector('.dps').innerHTML   = combatant.encdps;
          row.querySelector('.job-icon').innerHTML = '<img src="images/'+ imgFolder + '/' + jobName(combatant) + '.png" onerror="this.setAttribute(\'src\', \'images/error.png\');">';
          row.querySelector('.name').innerHTML = combatant.name === 'YOU' ? combatantName : combatant.name;
          row.querySelector('.encdps').innerHTML = combatant['encdps']; // Encdps
          row.querySelector('.crithit').innerHTML = 'CRIT ' + combatant['crithit%']; // Crithit
          row.querySelector('.bar').style.width = ((parseFloat(combatant.encdps) / maxdps) * 100) + '%';

after

      li .hps{
        margin-left: 0px;
      }
//          row.querySelector('.tohit').innerHTML = 'ACC ' + combatant.tohit + '%'; // Accuracy
          // encDPS html span required
          // row.querySelector('.dps').innerHTML   = combatant.encdps;
          row.querySelector('.job-icon').innerHTML = '<img src="images/'+ imgFolder + '/' + jobName(combatant) + '.png" onerror="this.setAttribute(\'src\', \'images/error.png\');">';
          row.querySelector('.name').innerHTML = combatant.name === 'YOU' ? combatantName : combatant.name;
          row.querySelector('.encdps').innerHTML = combatant['encdps']; // Encdps
          row.querySelector('.crithit').innerHTML = 'CRIT ' + combatant['crithit%']; // Crithit
          row.querySelector('.bar').style.width = ((parseFloat(combatant.encdps) / maxdps) * 100) + '%';

ACC、CRIT、OverHが要らない場合

554行/624行あたり
  • コメントアウトさせた

before

        if(overHeal){
          row.querySelector('.hps').innerHTML = 'OverH ' + overHeal;
        }
          row.querySelector('.tohit').innerHTML = 'ACC ' + combatant.tohit + '%'; // Accuracy
          // encDPS html span required
          // row.querySelector('.dps').innerHTML   = combatant.encdps;
          row.querySelector('.job-icon').innerHTML = '<img src="images/'+ imgFolder + '/' + jobName(combatant) + '.png" onerror="this.setAttribute(\'src\', \'images/error.png\');">';
          row.querySelector('.name').innerHTML = combatant.name === 'YOU' ? combatantName : combatant.name;
          row.querySelector('.encdps').innerHTML = combatant['encdps']; // Encdps
          row.querySelector('.crithit').innerHTML = 'CRIT ' + combatant['crithit%']; // Crithit
          row.querySelector('.bar').style.width = ((parseFloat(combatant.encdps) / maxdps) * 100) + '%';

after

//        if(overHeal){
//          row.querySelector('.hps').innerHTML = 'OverH ' + overHeal;
//        }
//          row.querySelector('.tohit').innerHTML = 'ACC ' + combatant.tohit + '%'; // Accuracy
          // encDPS html span required
          // row.querySelector('.dps').innerHTML   = combatant.encdps;
          row.querySelector('.job-icon').innerHTML = '<img src="images/'+ imgFolder + '/' + jobName(combatant) + '.png" onerror="this.setAttribute(\'src\', \'images/error.png\');">';
          row.querySelector('.name').innerHTML = combatant.name === 'YOU' ? combatantName : combatant.name;
          row.querySelector('.encdps').innerHTML = combatant['encdps']; // Encdps
//          row.querySelector('.crithit').innerHTML = 'CRIT ' + combatant['crithit%']; // Crithit
          row.querySelector('.bar').style.width = ((parseFloat(combatant.encdps) / maxdps) * 100) + '%';

Your Tearsの表記を変えたい場合

310行あたり
  • combatantNameを変えた

before

      var rows    = 10,
        row,
        rdps_max  = 0,
        combatantName = 'Your Tears',
        imgFolder = 'default';

after

      var rows    = 10,
        row,
        rdps_max  = 0,
        combatantName = 'ME',
        imgFolder = 'default';

DPSのみのコンパクトな表示にしたい場合

FF14 ACT brunokratka-overlay
FF14 ACT brunokratka-overlay

minimal-uiのジョブアイコンと置き換えても合いそう
 →置き換えてみた(右上の画像)

いろいろ
  • 上記の内容を変えた
  • フォントサイズを適当に小さめ12pxに揃えた

before

      #header{
        width: 100%;
        height: 100%;
        display: none;
        font-size: 14px;
        position: relative;
        vertical-align: middle;
      }
      li .name{
        font-size: 14px;
        overflow: hidden;
        white-space: nowrap;
        letter-spacing: 1px;
        display: inline-block;
        text-overflow: ellipsis;
      }

      li.raidheader{
        width: 100%;
        display: flex;
        font-size: 18px;
        flex-wrap: nowrap;
        margin-bottom: 16px;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
      }
      li .encountertitle{
        font-size: 18px;
        text-shadow: inset 0px 1px 1px #000;
      }
      li .current-zone{
        font-size: 14px;
        text-shadow: inset 0px 1px 1px #000;
      }

      li .raiddps{
        width: 70px;
        display: block;
        font-size: 16px;
        text-align: middle;
        letter-spacing: 7px;
        text-shadow: inset 0px 1px 1px #000; 
      }

      li .duration{
        font-size: 14px;
        text-shadow: inset 0px 1px 1px #4d4d4d;
      }

after

      #header{
        width: 100%;
        height: 100%;
        display: none;
        font-size: 12px;
        position: relative;
        vertical-align: middle;
      }
      li .name{
        font-size: 12px;
        overflow: hidden;
        white-space: nowrap;
        letter-spacing: 1px;
        display: inline-block;
        text-overflow: ellipsis;
      }

      li.raidheader{
        width: 100%;
        display: flex;
        font-size: 12px;
        flex-wrap: nowrap;
        margin-bottom: 16px;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
      }
      li .encountertitle{
        font-size: 12px;
        text-shadow: inset 0px 1px 1px #000;
      }
      li .current-zone{
        font-size: 12px;
        text-shadow: inset 0px 1px 1px #000;
      }

      li .raiddps{
        width: 70px;
        display: block;
        font-size: 12px;
        text-align: middle;
//        letter-spacing: 7px;
        text-shadow: inset 0px 1px 1px #000; 
      }

      li .duration{
        font-size: 12px;
        text-shadow: inset 0px 1px 1px #4d4d4d;
      }
  • ゲーミングマウス
  • ゲーミングキーボード
  • PCゲーム
  • Switch
  • マンガ
  1. ゲーミングマウス
  2. ゲーミングマウス
  3. ゲーミングマウス
  4. ゲーミングマウス
  5. ゲーミングマウス
  6. ゲーミングマウス
  7. ゲーミングマウス
  8. ゲーミングマウス
  9. ゲーミングマウス
  10. ゲーミングマウス
  11. ゲーミングマウス
  12. ゲーミングマウス
  13. ゲーミングキーボード
  14. ゲーミングキーボード
  15. ゲーミングマウス
  16. ゲーミングキーボード
  17. ゲーミングマウス
  18. ゲーミングマウス
  19. ゲーミングマウス
  20. ゲーミングキーボード
  1. ゲーミングキーボード
  2. ゲーミングキーボード
  3. ゲーミングキーボード
  4. ゲーミングキーボード
  5. ゲーミングキーボード
  6. ゲーミングキーボード
  7. ゲーミングキーボード
  8. ゲーミングキーボード
  9. ゲーミングキーボード
  10. ゲーミングキーボード
  11. ゲーミングマウスパッド
  12. ゲーミングキーボード
  13. ゲーミングキーボード
  14. ゲーミングキーボード
  15. ゲーミングキーボード
  16. ゲーミングキーボード
  17. ゲーミングキーボード
  18. ゲーミングキーボード
  19. ゲーミングキーボード
  20. ゲームパッド
  1. ゲーミングマウス
  2. PCゲーム
  3. ゲーミングマウスパッド
  4. ゲーミングマウス
  5. ゲーミングマウス
  6. ゲーミングキーボード
  7. ゲームパッド
  8. ゲーミングマウス
  9. ゲーミングキーボード
  10. ゲーミングマウス
  11. コントローラー(ハンドル・ジョイスティック)
  12. ゲーミングマウスパッド
  13. PCゲーム
  14. ゲーミングマウス
  15. ゲーミングマウス
  16. PCゲーム
  17. ゲーミングマウス
  18. 周辺機器・アクセサリ
  19. ゲーミングマウス
  20. コントローラー(ハンドル・ジョイスティック)
  1. ゲームソフト
  2. ゲームソフト
  3. ゲーム機本体
  4. ゲームソフト
    発売日 : 2019年10月18日
    価格 : ¥7,473
    新品最安値 :
    ¥12,960
  5. ゲーム機本体
  6. ゲームソフト
    発売日 : 2021年10月29日
    価格 : ¥5,409
    新品最安値 :
    ¥5,000
  7. コントローラー
  8. ゲームソフト
  9. ゲームソフト
    発売日 : 2017年04月28日
    価格 : ¥5,318
    新品最安値 :
    ¥4,729
  10. ゲームソフト
  11. ゲームソフト
    発売日 : 2022年03月25日
    価格 : ¥5,664
    新品最安値 :
    ¥5,664
  12. ゲームソフト
    発売日 : 2020年03月20日
    価格 : ¥5,628
    新品最安値 :
    ¥11,840
  13. ゲームソフト
  14. ゲームソフト
  15. ゲームソフト
    発売日 : 2020年11月19日
    価格 : ¥5,120
    新品最安値 :
    ¥10,560
  16. ゲームソフト
    発売日 : 2018年06月21日
    価格 : ¥3,490
    新品最安値 :
    ¥3,141
  17. ゲームソフト
  18. Nintendo Switch
  19. ゲームソフト
  20. ゲームソフト
  1. コミック
  2. コミック
  3. コミック
  4. コミック
  5. コミック
  6. コミック
  7. コミック
  8. コミック
  9. コミック
  10. コミック
  11. コミック
  12. コミック
  13. コミック
  14. コミック
  15. コミック
  16. コミック
  17. コミック
  18. コミック・ラノベ・BL
    発売日 : 2022年01月15日
    価格 : ¥673
    新品最安値 :
    ¥673
  19. コミック
  20. コミック
よかったらシェアしてね!
URLをコピーする
URLをコピーしました!

オススメ記事

この記事を書いた人

小学生の時にPCを買って頂いてからのPCゲーマーです。
元々はFPS民でCS:S、SF1、AVA、CS:GO、PUBG、APEXを触りました。いくつかのタイトルで大会も出たんですがさくっと負けたのが良い思い出です。

FPS以外は罪と罰++ 二律背反、アスガルド、LuviniaSaga、TERA、マビノギ英雄伝、FF14、Blade&Soul、TreeofSavior、PSO2、Satisfactory、Kurtzpel、ShadowArena、FallGuys、Craftopiaなどを触ってた雑食です。FF14を長くやっていて邂逅編の頃にガチ廃人でした。

最近はFF14で不定期にインしてのんびりギャザクラやってる感じの人です。課金はお布施みたいにずっと切らしていないんですがイン出来ない事が多いので宝くじ当てて廃プレイしたいなあって思ってます。

コメント

コメント一覧 (12件)

コメントする

トップへ
目次
閉じる