@Blog
日常日誌からプログラムやYOUTUBER紹介、旅日記まで日々更新中です。
TinyMCE 5.0でwindowManager.openUrl使用してコードの送受信。
2019.08.03
TinyMCE 5.0の記事が好評だったので前回に続き、windowManager.openUrl使用してコードの送受信の内容を記載します。あくまでもサンプルコードです。プログラムなので他にもやり方はあると思います。前回の記事に勘どころは記載していますので割愛します。尚、自分は英語がダメダメですが幸いコードを読む力はある程度あるので何とかなりました。サンプルコードを記載しますので解析してみてください。
PHP＆HTMLコード
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/tool/bootstrap/css/bootstrap.css">
<script src="/tool/jquery/jquery-3.4.1.js"></script>
</head>
<body>
<form method="post">
<textarea name="htmlcode1" class="form-control">
<?php
echo urldecode($_GET["sdata"]);
?>
</textarea>
<input type="button" name="submitbtn" value="htmlcode-submit"class="btn btn-primary">
</form>
<script>
var chageJson = function(data) {
console.log(data);
var JsonData = [];
for (i = 0; i < data.length; i++) {
if(/htmlcode/.test(data[i].name)){
data[i].value = encodeURIComponent(data[i].value);
}
JsonData[data[i].name] = data[i].value
}
//console.log(JSON.stringify(data));
return JsonData;
}
$("[name=submitbtn]").on("click",function(){
data = chageJson($("form").serializeArray());
window.parent.postMessage({ mceAction: 'customAction',data:data});
window.parent.postMessage({ mceAction: 'close' });
});
</script>
</body>
</html>jsコード
(function() {
tinymce.create('tinymce.plugins.btxt', {
init : function( ed, url) {
//console.log(ed);
act = function(e)
{
//console.log("e=",encodeURIComponent(e.selection.editor.getContent()));
ed.windowManager.openUrl(
{
type: 'panel',
title: 'HTMLCODE',
url:url + "/btxt.php?sdata=" + encodeURIComponent(e.selection.editor.getContent()) ,
onMessage:function(api, details){
console.log(e);
//console.log('htmlcode1',decodeURIComponent(details.data.htmlcode1));
// var editorInstance = tinymce.editors[0];
e.selection.editor.setContent(decodeURIComponent(details.data.htmlcode1));
}
}
);
};
ed.ui.registry.addButton('btxt',{
title : 'htmlcode',
text: 'htmlcode',
onAction:function(){act(ed)}
});
},
getInfo : function() {
return {
longname : 'tinymce.plugins.btxt',
author : 'taoka',
authorurl : 'https://zip358.com',
infourl : 'https://zip358.com',
version : '1.0'
};
}
});
tinymce.PluginManager.add('btxt', tinymce.plugins.btxt);
})();
著者名
@taoka_toshiaki
※この記事は著者が30代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
--, 5.0, 7, 8, ９, class, DOCTYPE, endif, gt, html, IE, if, lt, lt-ie, no-js, openUrl, php, quot, TinyMCE, windowManager, コード, サンプル, ダメダメ, プログラム, やり方, 他, 使用, 内容, 前回, 割愛, 力, 勘どころ, 好評, 自分, 英語, 解析, 記事, 記載, 送受信,
TinyMCE 5.0でオリジナルプラグイン作成するはググれば何とかなるが？
2019.07.27
TinyMCE 5.0で独自のプラグインを開発するにあたって
ググれば4.0で作成する方法は山ほど例題があるのだけど5.0は
非常に少ないtinymce.windowManager.openを使用してのプラグインは
5.0でも案外簡単に見つかるのだけど、tinymce.windowManager.openUrlを
使用しての情報はググってもない。
唯一、公式サイトが記載しています。
しかし残念なことに全て英語で書かれています。
日本語で記載しろよという話だけど・・・・。
で！！tinymce.windowManager.openUrlで
何が出来るかと言えば外部ファイルを
読み込みが出来てそのレスポンスを受け取る事が出来るのです。
英語が嫌いでも原文で英語を読め！！ですよ・・・。
答えはそのページに書いているのですね。
※ちなみに会社でこの機能（e.windowManager.openUrl）を
使用し開発中です。
たぶん、自分みたいに困っている人もいると思うので
基本的な部分を記載しています、なお自作プラグインの作り方は
理解しているという前提で記載しています。
まず例としてPHPファイルを読み込みたいのなら
自作プラグインのPHPファイルに下記の記載を行います。
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/tool/bootstrap/css/bootstrap.css">
<script src="/tool/jquery/jquery-3.4.1.js"></script>
</head>
<body>
<form method="post">
<input type="text" name="L_japan" class="form-control">
<input type="text" name="L_English" class="form-control">
<input type="button" name="submitbtn" value="恩恵を受ける"class="btn btn-primary">
</form>
<script>
var chageJson = function(data) {
console.log(data);
var JsonData = [];
for (i = 0; i < data.length; i++) {
JsonData[data[i].name] = data[i].value
}
//console.log(JSON.stringify(data));
return JsonData;
}
$("[name=submitbtn]").on("click",function(){
data = chageJson($("form").serializeArray());
window.parent.postMessage({ mceAction: 'customAction',data:data});
window.parent.postMessage({ mceAction: 'close' });
});
</script>
</body>
</html>PHPファイルはこのような感じでjavascriptが大事ここで、
submitを行っています。
当然、JSON形式で返却しましょう。公式ページにも書かれいますが
mceActionで制御しましょう。
プラグイン側のJSは下記のようになります。
(function() {
tinymce.create('tinymce.plugins.language_boon', {
init : function( ed, url) {
console.log(ed);
act =function(ed)
{
ed.windowManager.openUrl(
{
type: 'panel',
title: '恩恵を受ける',
url:url + "/language_boon.php",
onMessage:function(api, details){
console.log(api, details);
console.log('オレオレjapan', details.data.L_japan);
console.log('オレオレEnglish', details.data.L_English);
}
});
};
// window.addEventListener('message', function (event) {
// console.log(event);
// var data = event.data;
// console.log(data.data);
// if(ed.settings.id == data.data.id_){
// console.log('オレオレjapan', data.data.L_japan);
// console.log('オレオレEnglish', data.data.L_English);
// }
// });
ed.ui.registry.addButton('language_boon',{
title : '恩恵を受ける',
text: '恩恵',
onAction:function(){act(ed)}
});
},
getInfo : function() {
return {
longname : 'tinymce.plugins.language_boon',
author : 'taoka',
authorurl : 'https://zip358.com',
infourl : 'https://zip358.com',
version : '1.0'
};
}
});
tinymce.PluginManager.add('language_boon', tinymce.plugins.language_boon);
})();公式ページは下記のリンクより
https://www.tiny.cloud/docs/ui-components/urldialog/#urldialoginstanceapi
サンプルサイトはこちら
https://zip358.com/tool/editor/
著者名
@taoka_toshiaki
※この記事は著者が30代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
4.0, 5.0, open, openUrl, TinyMCE, windowMan, windowManager, オリジナル, こと, サイト, ファイル, プラグイン, ページ, レスポンス, 事, 会社, 何, 作成, 使用, 例題, 全て, 公式, 原文, 唯一, 外部, 嫌い, 山ほど, 情報, 方法, 日本語, 機能, 残念, 答え, 簡単, 英語, 記載, 話, 開発,
ANA積立で決済する方法とiPhoneでウォレット追加する方法。
2019.04.09
ANA積立航空券で決済する方法ですが、
まずWEBで予約まで行います、次に下記のサイトに
書かれているANA旅行積立プラン専用デスクに電話します。
その後、WEBへログインし支払い期限が延長されている
事を確認します。
サイトにANA航空券（旅行券）を送る住所が記載されているので
封筒にそれらを明記しANA旅行積立プラン専用デスク 行と記入した
うえで、郵便局で簡易書留＋追跡サービスで送りましょう。
※送付するときは必ず送付書を入れて送りましょう。
尚、往復の場合、余白に搭乗日時などを明記し上記の内容に
合算することを明記しましょう。
http://www.anas.co.jp/tsumitate/anaticket/use_ticket/dom_desk/index.html
iPhoneでウォレット追加する方法
下記のサイトから手順通り行うとうまく行くはずなのですが、
純正ブラウザ以外の場合、インストールできない場合があります。
なので必ずSafariを使用してウォレット追加しましょう。
https://www.ana.co.jp/ja/jp/serviceinfo/share/passbook/
著者名
@taoka_toshiaki
※この記事は著者が30代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
ANA, anas, anaticket, co, desk, dom, htmliPhone, http, index, iPhone, jp, Safa, ticket, tsumitate, use, web, www, インストール, うえ, ウォレット, こと, サービス, サイト, それら, デスク, とき, パス, ブラウザ, プラン, ログイン, 上記, 下記, 予約, 事, 住所, 余白, 内容, 合算, 場合, 封筒, 専用, 延長, 往復, 後, 手順, 搭乗, 方法, 旅行, 旅行券, 日時, 明記, 期限, 決済, 確認, 積立, 簡易書留, 純正, 航空券, 行, 記入, 記載, 追加, 追跡, 送付, 郵便局, 電話,
javascriptを勉強中
2018.12.15
var a = 3;
var b = 10;
var obj = {
hoge:function(a){
a = a + a;
return a;
},
a:a = a && 5,
b:b = b || 3
};
console.log(obj.hoge(2));
console.log(obj.a);
console.log(obj.b);上記のCodeを動かすと仕事と表示されます（笑）、4，5，10と表示されます。
何故そうなったかを考えるとキリがないのでそういうものだと
思ったほうが良いかもしれないです。
説明するとhogeはオブジェクトです。あとは変数とIF文の省略系を
記述しているだけです、実際は＝もいらないですが・・・。
わかりやすく自分なりに記載したつもりです。
javascriptライブラリってこういうのが何百行も記載して成り立っていますが
概念はこういう事です。自分は基本的に概念しか覚えないのです。
何故、そうしているか・・・自分が怠惰な人間だからです。
著者名
@taoka_toshiaki
※この記事は著者が30代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
10, 2, ３, 4，5，10, 5, amp, Code, console, function, hoge, if, javascript, log, obj, return, var, あと, オブジェクト, キリ, つもり, もいら, もの, 上記, 仕事, 勉強, 変数, 実際, 文, 省略, 自分, 表示, 記載, 記述, 説明,
datetimepicker-master：：でぃーたたいむぴっかーマスター！！日本語化
2017.10.14
datetimepicker-masterが日本語化できない。時刻だけ表示したい、カレンダーだけ表示したいなどに
実は対応しているのだけど、バージョンがアップしてからそのやり方が変わっていて
ググってもそのやり方が出てこないので、じぶんが記載してみました。
ソースを読まないと見えてこないものが有るですが、ぶっちゃけ他人のソースを読むのは面倒くさいでもプラグインは使用したい方。
下記のコードで日本語化可能です。
カレンダー非表示可能です。
時刻非表示可能です。
ちなみにソースを見るとdefault_options（でふぇるとおぷしょん）のオブジェクトで
その他、操作も可能ですのでソースを読みたい人は読んでみてください。
ちなみにちなみにdatetimepicker-masterプラグインはこちらからダウンロード可能です。
https://github.com/xdan/datetimepicker
サンプルプログラムはこちらです。
https://zip358.com/tool/datetimepicker
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>zip358.com:datetimepicker日本語</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=10.0, user-scalable=yes">
<link rel="stylesheet" href="./datetimepicker-master/jquery.datetimepicker.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="./datetimepicker-master/build/jquery.datetimepicker.full.js"></script>
<script>
$(function(){
$.datetimepicker.setLocale("ja");//にほんご
$("#dtp").datetimepicker({
format:"Y/m/d H:i",
formatTime:"H"//時間だけ(分：非表示)
});
$("#dtp2").datetimepicker({
format:"Y/m/d",
timepicker:false//時刻非表示
});
$("#dtp3").datetimepicker({
format:"H:i",
datepicker:false//カレンダー非表示
});
});
</script>
</head>
<body>
<input id="dtp" type="text">
<input id="dtp2" type="text">
<input id="dtp3" type="text">
<div id="ana">
</div>
</body>
</html>
著者名
@taoka_toshiaki
※この記事は著者が30代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
com, datetimepicker, datetimepicker-master, default, github, https, options, xdan, アップ, オブジェクト, カー, カレンダー, コード, こち, こちら, サンプル, じぶん, ソース, その他, タイム, ダウンロード, バージョン, ふぇると, プラグイン, プログラム, マスター, もの, やり方, 下記, 人, 他人, 使用, 可能, 対応, 操作, 方, 日本語化, 時刻, 表示, 記載,
9月から10月にかけて観に行くかもしれない映画。
2016.09.22
9月から10月にかけて観に行くかもしれない映画が下記になります。
上映初日に観に行くかもしれないし、そうでないかもしれないですが・・・。
今のところ7割の確率で観に行くと思われる作品を記載しときます。
また、観たら感想なんかを記載すると思います。
ハドソン川の奇跡
http://wwws.warnerbros.co.jp/hudson-kiseki/
SCOOP!
http://scoop-movie.jp/
ジェイソン・ボーン
http://bourne.jp/
何者
http://nanimono-movie.com/
スタートレックビヨンド
http://www.startrek-movie.jp/
インフェルノ
http://www.inferno-movie.jp/site/#!/
著者名
@taoka_toshiaki
※この記事は著者が30代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
10, 7, ９, bourne, co, com, http, hudson-kiseki, inferno-movie, jp, nanimono-movie, SCOOP, scoop-movie, site, startrek-movie, warnerbros, www, wwws, インフェルノ, ジェイソン, スタートレック, ところ, ハドソン川, ビヨンド, ボーン, 上映, 下記, 今, 何者, 作品, 初日, 奇跡, 感想, 映画, 確率, 観, 記載,
クロンを改良しました。前のクロンPHPは恐らくBUGってて。
2015.06.23
クロンPHPって言っても月や曜日判定はしていません。今回、その判定も行うように変えようと再度、コードを改良しました。前回のコードの約半分ぐらいのコードになってます。土曜日までには、月や曜日の対応を行うようにします。
ちなみにどういう機能をするのかと言いますと、さくらサーバではクロンの制限があります。その制限数以上、使おうとおもって考えたのが、一つのPHPを叩いてクロンがしている事を模倣することでした。
※昨日の話は撤回はしないものの、SEOよりSNSでSEOという考え方に変えました。よくよく考えてみるとアクセス数が多いほど、検索上位表示される確率も増えるのでやはり大事かなとボット。ボットらしくない振る舞いしたボットなら何とか成るかも知れないとも思ってます。
追記2022/09/06：クーロン制限突破方法を記載しています、こちらを参照ください。クーロン制限突破！
command":"cd /home/user/www/user_dir/site/; /usr/local/bin/php cron.php "cron.json"<?php
//5分刻みに対して有効な無限クローン 処理が負荷の場合どうなるかは知りません。
date_default_timezone_set('Asia/Tokyo');
class cron{
public function d_m($obj)
{
if($obj->m==="*")return true;
if(preg_match("/,/",$obj->m))return $this->comma($obj->m,date("m"));
if((int)$obj->m === (int)date("m"))return true;
return false;
}
public function d_d($obj)
{
if($obj->d==="*")return true;
if(preg_match("/,/",$obj->d))return $this->comma($obj->d,date("d"));
if((int)$obj->d === (int)date("d"))return true;
return false;
}
public function d_H($obj)
{
if(preg_match("/\*\/[0-9]{1,2}/",$obj->H)){
$H = explode("/",$obj->H);
if((int)$H[1]>0 && ((int)date("H") % (int)$H[1])===0)return true;
}else{
if($obj->H==="*")return true;
if(preg_match("/,/",$obj->H))return $this->comma($obj->H,date("H"));
if((int)$obj->H === (int)date("H"))return true;
}
return false;
}
public function d_i($obj)
{
if(preg_match("/\*\/[0-9]{1,2}/",$obj->i)){
$i = explode("/",$obj->i);
if((int)$i[1]>0 && ((int)date("i") % (int)$i[1])===0)return true;
}else{
if($obj->i==="*")return true;
if(preg_match("/,/",$obj->i))return $this->comma($obj->i,date("i"));
if((int)$obj->i === (int)date("i"))return true;
}
return false;
}
//曜日 0=日曜日 6=土曜日
public function d_w($obj)
{
if((int)$obj->w[date("w")]===1)return true;
return false;
}
public function comma($c="",$t=""){
if($c==="")return false;
if($t==="")return false;
$flg = false;
foreach(explode(",",$c) as $cc){
if((int)$cc===(int)$t)$flg = true;
}
return $flg;
}
public function d_command($obj){
if($obj->command){
exec($obj->command . " > /dev/null &");
}
return true;
}
}
if ($argv[1]) {
$filename = $argv[1];
if(is_file($filename)){
$jsn = json_decode(file_get_contents($filename));
$cron = new cron();
try {
foreach($jsn as $obj){
if($cron->d_m($obj)){
if($cron->d_d($obj)){
if($cron->d_H($obj)){
if($cron->d_i($obj)){
if($cron->d_w($obj)){
$cron->d_command($obj);//波動拳{{{{
}
}
}
}
}
}
} catch (\Throwable $th) {
print $th->getMessage();
}
}
}
mは月
dは日
Hは時
iは分
wは日曜日から土曜日 0はOFF、1はON
commandは実行コマンド[
{
"m":"*",
"d":"*",
"H":"*",
"i":"*/10",
"w":[1,1,1,1,1,1,1],
"command":"cd /home/user/www/user.com/site/; /usr/local/bin/php hoge1.php"
},
{
"m":"*",
"d":"12,23,28",
"H":"*",
"i":"*/15",
"w":[1,1,1,1,1,1,1],
"command":"cd /home/user/www/user.com/site/; /usr/local/bin/php hoge2.php"
}
]
著者名
@taoka_toshiaki
※この記事は著者が30代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
-Command, 06, 09, 2022, BUG, cd, ho, php, quot, SEO, SNS, アクセス, クーロン, クロン, コード, こちら, こと, サーバ, さくら, ボット, 一つ, 上位, 事, 今回, 再度, 判定, 制限, 前, 前回, 参照, 土曜日, 大事, 対応, 撤回, 改良, 方法, 昨日, 曜日, 月, 検索, 模倣, 機能, 確率, 突破, 約半分, 考え方, 表示, 記載, 話, 追記,
映画：時をかける少女：タイム・ウェイツ・フォー・ノー・ワン
2014.08.19
タイム・ウェイツ・フォー・ノー・ワン{time waits for no one}=過ぎ去った時間は戻らないとかいう意味らしいです。この時をかける少女というアニメ映画はよく出来ているなと思います。内容の方は記載しませんが、結構おすすめ度の高いアニメ映画です。過ぎ去った時間は戻らないけど、未来は自分で切り開けます。この映画は過去に何度もタイムスリップして過去を書き換えていますが、実際、この世界は多次元｛たぶん｝なので、タイムスリップして過去を変えたとしてもそこから、次元が分岐するというオチ｛突っ込みどころ(´Д｀)｝。過去に何度もタイムスリップするということは多次元世界（パラレルワールド）を複数つくる事になるのではないかと自分は思っています。そんな身も蓋もない事を考えて観なければ良いだけですね｛※この映画、時をかける少女、青春アニメ映画は面白かったです｝。
ちなみに、多次元世界の話でうまく説明している映画があります、ミッション: 8ミニッツ（ソースコード）と言う映画で何度も過去に戻って爆弾処理（何度も失敗する）をするというストーリーです、コレを観ると多次元世界と時間との関係をうまく説明しているように思えます。
時をかける少女もおすすめですが、映画、ミッション: 8ミニッツもおすすめ度の高い映画です。
著者名
@taoka_toshiaki
※この記事は著者が30代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
com, For, ge-CeHgimHU, https, no, one, time, waits, watch, www, youtube, アニメ, ウェイツ, おすすめ, オチ, こと, スリップ, そこ, タイム, ノー, パラレルワールド, フォー, ワン, 世界, 事, 何度, 内容, 分岐, 多次元, 実際, 少女, 意味, 方, 映, 映画, 時, 時間, 未来, 次元, 自分, 蓋, 複数, 記載, 身, 過去, 青春,