備忘録 – ページ 25 – 東京発、雲に乗って

2017年6月15日2017年6月15日

【TCPDF】HTMLからのPDF出力で社印（角印）を会社情報にかぶせたい

PHPからPDF出力が簡単にできるTCPDFですが、
その中でもさらに、HTMLタグでPDFが作成できる機能は
WEBアプリの開発者にとっては
とても簡単に成形されたPDFが作成できるので便利です。

最近のバージョンではHTMLのタグだけではなく、
スタイルシートもある程度は反映してくれます。
ただ、さすがにブラウザとは違うので
すべてのHTMLやスタイルの表現が使えるわけではありません。

WEBでPDF出力がよく使われるもののひとつに
「領収証の出力」
がありますが、
このとき紙の領収証と同じように
会社情報に社印（角印）を少しかぶせて表示させたいですよね。

ブラウザ上ならスタイルでいろんなやり方がありますが、
TCPDFのHTML変換機能では使えないものが多いようです。
いろいろ試した結果、実現できた方法はtableタグのスタイル「padding-top」でした。

例：

<table>
  <tr>
    <td style="width:40%;text-align:right;">
      <img src="(画像のパス)"/>
      <table style="padding-top:-50px;">
        <tr>
          <td style="text-align:left;">
            <span style="text-decoration:underline;">株式会社〇〇〇〇</span>
            <br/>
            TEL : 03-xxxx-xxxx
            <br/>
            〒150-xxxx
            <br/>
            東京都渋谷区〇〇〇1-2-3〇〇〇ビル55F
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

<table>

<tr>

<tr>

<span style="text-decoration:underline;">株式会社〇〇〇〇</span>

<br/>

TEL : 03-xxxx-xxxx

<br/>

〒150-xxxx

<br/>

東京都渋谷区〇〇〇1-2-3〇〇〇ビル55F

</td>

</tr>

</table>

</td>

</tr>

</table>

2017年6月8日2017年6月8日

【Skype、LINE】各PC版チャットツールで改行する方法

SkypeやLINEにはPC版があります。
そのどちらも、PC版ではエンターキーを押すとメッセージが送信されるため、
ツール内で改行を入れることができません。

しかし、仕事で客先と長めの文章をやりとりをする際には
見やすくするために改行が必要になります。
また、技術的なやりとりをする際にコードを記述する場合も
改行ができないとマズいケースがあります。

改行する方法は、それぞれ下記のとおりです。

【Skype】
メニューの「ツール」→「設定」→「チャット＆SMS」→「チャット設定」で
「ENTERを押したときの操作」を「改行」に変更する

【LINE】
Shiftを押しながらENTERを押す
または、環境設定→「送信方法」を
Ctrl+EnterかAlter+Enterに変更する

2017年6月6日2017年11月6日

【Windows10】コントロールパネルがメニューになくてもあわてない

Windows Updateにより、スタートメニューの右クリックメニューからコントロールパネルが消えたようです。

今まで：
情シス「ではまずスタートメニューを右クリックしてコントロールパネルを選択してください」

↓

これから：
情シス「ではまずWindowsキーを押しながらRキーを押して、入力欄にcontrolと打ってEnterを押してください」

2017年6月6日

【JavaScript】scriptタグで呼ばれたjsファイル内で自身のURLを取得

scriptタグで呼ばれたjsファイル内で、
そのjs自身のURL（＝scriptタグのsrcの内容）を取得したい場合、
普通にlocationオブジェクトを使って取得しようとしても
おおもとのページのURLしか取得できません。

document.currentScriptオブジェクトに対応していれば簡単ですが、
対応していない場合はその時点で呼ばれている最新のscriptタグを
解析すれば取得できます。

var get_self_url = function() {
  var _current = (function() {
    if (document.currentScript) {
      return document.currentScript.src;
    }
    else {
      var scripts = document.getElementsByTagName('script'),
      script = scripts[scripts.length-1];
      if (script.src) {
        return script.src;
      }
    }
  })();
  return _current;
};

var get_self_url = function() {

var _current = (function() {

if (document.currentScript) {

return document.currentScript.src;

}

else {

var scripts = document.getElementsByTagName('script'),

script = scripts[scripts.length-1];

if (script.src) {

return script.src;

}

})();

return _current;

};

2017年6月6日2017年6月6日

【JavaScript】外部のCSSファイルを動的にロード

外部のCSSファイルをJavaScriptから動的にロードする関数です。

var loaded_styles = {};
var load_css = function(src) {
  if(sdl.loaded_styles[src]) {
    return;
  }
  var head = document.getElementsByTagName('head')[0];
  var link = document.createElement("link");
  link.rel = "stylesheet";
  link.type = "text/css";
  link.href = src;
  head.insertBefore(link, head.firstChild);
  var loaded_styles[src] = 1;
};

var loaded_styles = {};

var load_css = function(src) {

if(sdl.loaded_styles[src]) {

return;

}

var head = document.getElementsByTagName('head')[0];

var link = document.createElement("link");

link.rel = "stylesheet";

link.type = "text/css";

link.href = src;

head.insertBefore(link, head.firstChild);

var loaded_styles[src] = 1;

};

使い方

load_css('/libs/css/style.css');

1	load_css('/libs/css/style.css');