これは、htmlとcssとJavascriptを駆使して動的に静止画の動化をしようとする、試みのスクリプトである。
実践的に、プログラムの謎解きを収録した実話で、その証拠を示すものとする。
ここまで来ると、ぺらぺらとめくるだけでは済まず、詳細な内容を検討する必要があり２部に分割して、載せる事としました。
https://qiita.com/tattyan3/items/1580a7696e3446f11ae4
2部 javascript
stdio.js
// ver. 1_00(test)
/*
2024/03/14-03/21-
///////////////////////////////
giam フリーソフト Gif animetion 使い方 https://freesoft-100.com/review/giam.html
https://qiita.com/tattyan3/questions/e5afd5ff8689534f3f48 */
//alert('studio.js');
const box_1 = document.querySelector("#box01");
const box_1_2 = document.querySelector("#box01_2");
const box_2 = document.querySelector("#box02");
const box_2_2 = document.querySelector("#box02_2");
const box_3 = document.querySelector("#box03");
const box_3_2 = document.querySelector("#box03_2");
const box_4 = document.querySelector("#box04");
const box_4_1 = document.querySelector("#box04_1");
const box_4_2 = document.querySelector("#box04_2");
const box_5 = document.querySelector("#box05");
/*
*/
/* 定義 https://qiita.com/tattyan3/items/7ef12fd94e4f71e64fdb */
let faile_ch_li = "";
var aru_arr = ['imge/cyat.png','imge/gall_1.png','imge/gall.png','imge/man1.png',];
aru_arr.push('imge/んんん.png');
var aru_arr2 = aru_arr;
faile_check();
/* faile_check */
function faile_check(){
alert('faile_check');
for(let i = 0; i < aru_arr.length; i++){
checkFileExists(aru_arr[i]);
}
}
/* checkFileExists */
function checkFileExists(url) {
var path_f = url;
var element_f = new Image();
element_f.onload = function () {
var width_f = element_f.naturalWidth;
var height_f = element_f.naturalHeight;
for(let i = 0; i < aru_arr.length; i++){
if(aru_arr2[i] == path_f){
aru_arr2.splice(i, 1);
}
}
faile_ch_li=width_f + ' * ' + height_f;//使わない変数を処理して置く
// if(!path_f){faile_ch_li="問題が解決見つかりました。";}else{faile_ch_li="問題なし。";}
// alert(faile_ch_li +aru_arr2.length+ ' * ' + path_f + ' * ' + width_f + ' * ' + height_f);
if(path_f == 'imge/んんん.png'){
if(aru_arr2.length == 0){
alert('全てのファイルが存在します。');
}else{
faile_ch_li=aru_arr2.join('\n');
alert(aru_arr2.length+'無いのは '+aru_arr2);
}
}
};
element_f.src = path_f;
}
faile_check = false;
//alert('studio.js');
//hituyou();
const my5_td5 = document.querySelector("#my5td5");
let wind_size_px = my5_td5.style.height;
let wind_size = wind_size_px.replace('px','');
stato_wid_size();
function stato_wid_size(){
if(window.innerWidth< 475 || window.innerHeight < 275){
alert("ページが小さ過ぎます。");
document.getElementById('my5d2').innerHTML = '<font class="f3" color="#f00"><b>当コンテンツの有効外です。</b></font><br>表示Windowサイズを変更してください。';
}
wind_size = my5_td5.style.height;
wind_size = wind_size.replace('px','');
//alert(screen.width + ' * ' + screen.height + '\n' +window.innerWidth + ' * ' + window.innerHeight +'\n' + wind_size + ' * ' );
let wid_siz_cont = false;
if(window.innerWidth < 1070){
wid_siz_cont = true;
let cont_win_w1 = window.innerWidth-330-32;//
alert('表示てきません。'+cont_win_w1);
if( screen.height-100 < wind_size+80){
// alert('in height');
rook_c_go(true);
document.querySelector(".content1").style.height = '1600px';
document.querySelector(".content2").style.height = '1600px';
document.getElementById('no_display').innerHTML = '<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>';
}else{
rook_c_go(true);
document.querySelector(".content1").style.height = '1230px';
document.querySelector(".content2").style.height = '1230px';
document.getElementById('no_display').innerHTML = '<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>';
// document.getElementById('no_display2').innerHTML = '<br>';
}
}
}
//alert(window.innerWidth + ' * ' + window.innerHeight);
const maxtime = 7200;
//
let my_n =0; //行数
let timerId = 0; //タイマーID 後で何とかする
let intrtim = 1000; //インターバルタイマーの時間
let timerId_1 = 1; //タイマーID demo
let intrtim_1 = 1000; //インターバルタイマーの時間
let timerId_2 = 2; //タイマーID demo
let intrtim_2 = 3000; //インターバルタイマーの時間 //00 セットアップ余裕を持たせる
let singlsyot = false;
let tim_end = false;
let mycount = -3;
let timId1 = 1;
let puleymiu = "puleymiu";
let mykyoku = "mykyoku";
let mloop = '';// 'loop ';
let video_voise_on = false;
let audio_voise_on = true;
let sonota_on = false;
let v_muted = "muted ";// ""
let a_muted = "";// "muted "
let v_url = "";
let v1_url = "";
let v2_url = "";
let v3_url = "";
let a1_url = "";
let a2_url = "";
let a3_url = "";
let my_pop_select = "#my2_2td1";//ポップアップウィンドウの選択2_2
let dis_hiritu = "16:9"
// let hiritu = '16:5';
const def_img_png = "imge/cyat.png";//初期値 "imge/cyat.png";
let my_Rnafil = def_img_png; //ファイル名初期値
text_read();//テキスト読み込みセットアップ
let readlin = ['//00/*zahyou1_1/*#my1td1/*32/*32/*640/*360/*予備/*/*16:9 box01 1_1 始まり指定 */',
'//00/*image1/*#my1/*/*/*/*<img src="imge/my_img.jpg" width="640" alt="イメージがありません">'+'/**/',
'//00/*redin_v1/*#video1/*/*imge/una00.mp4/*/*<video controls src="imge/una00.mp4" width="256"></video>/* box01 用ビデオ先読み */',
'//00/*redin_a1/*#audio1/*voise/una_kiruna.wav/*/*/*Stato Up<br><audio src="voise/una_kiruna.wav" type="audio/wev" controls></audio>/* fast music 1へ先読み */',
'//00/*table_img/*#my1_2td1/*64/*64/*/*/*/*/*/* box01 1_2 始まり指定 */',
'//-2/*zahyou2_1/*#my2td1/*32/*32/*/*/* box02_1 始まり指定 */',//スタイルより座標をとってくること。
'//-2/*image2/*#my2/*/*/*128/*128/*/*<img src="imge/gall.png" width="128" height="128"></span>/* box02 main image 女の子 */',
'//-2/*zahyou3/*#my3td1/*32/*32/*/*/*/*/* box03_1 始まり指定 */',//スタイルより座標をとってくること。
'//-2/*image2/*#my3/*/*/*128/*128/*/*<img src="imge/man1.png" width="128" height="128"></span>/* box03 main image 女の子 */'];
var read_txt = [];
let linein_arr_n = [];
var line_in_arr = ['//00/*/**/'];//下の下の方に後から追加 エラーになるので 合格審査通ったやつだけ入れる予定。
let yobi_arr = [];//予備style
let yobi_str = "";//予備style string
let yobi_tmp = [];//予備style 一時
let yobi_tmp0 = "";//予備style 一時 string
let my_rey_txt = "";//テキスト
/* 2024/04/28-29 */
let my_f_flag = false;//ファイル読み込みフラグ
var aru3_str = 'imge/んんん.png';
var faile_ch_li2 = ' * ';
let my_txtbox_text = 'ここに file address を入れてください。';
let my_img_furont = true;
let my_img_back = false;
let my_kakutyoushi = 'png';
let my_out_to_code1 = '///*image_1/*#my01';
let my_out_to_code2 = '/*32/*32/*/*/*/*/*/*/* box01 1_1 始まり指定 */';
let my_out_to_code3 = '';
let my_out_to_code4 = '/*come*/';
let my_in_the_text = 'ここにファイルの選択で選択して入れてください。';
let bor_color = "#f00";
let bor_b_color = "#66aa66";
let bor_size = 0;
let mysel1_vale = "b_none";
let mysel2_vale = "b_f00";
let mysel3_vale = "bk_none";
let mysel4_vale = "image_non";
let mysel5_vale = "omax";
var myel99 = 'ここ';
var myel102 = 'ここ';
let bor_s_op_opacity = 1.0;
let call_test = "call_test";
const box_my1 = document.querySelector("#my1td1");//my1_1座標 w0,h0
const box_my1_2 = document.querySelector("#my1_2td1");//my1_2座標 w0,h0
const box_my2 = document.querySelector("#my2td1");//my2_1座標 w0,h0
const box_my2_2 = document.querySelector("#my2_2td1");//my2_2座標 w0,h0
const box_my3 = document.querySelector("#my3td1");//my3_1座標 w0,h0
const box_my3_2 = document.querySelector("#my3_2td1");//my3_2座標 w0,h0
const box_my4 = document.querySelector("#my4td1");//my4_0座標 w0,h0
const box_my4_1 = document.querySelector("#my4_1td1");//my4_1座標 w0,h0
const box_my4_2 = document.querySelector("#my4_2td1");//my4_2座標 w0,h0
const box_my5 = document.querySelector("#my5td1"); //my5_1座標 w0,h0
const wrk_5_1 = document.querySelector('#my5_1'); //my5_1の中身w0,h0-w1,h1
const box_55 = document.querySelector("#my5td5");
//
let element_tx = document.getElementById('mytextr2');
let my_to1_w0 = document.getElementById('w0').value;
let my_to1_h0 = document.getElementById('h0').value;
let my_to1_w1 = document.getElementById('w1').value;
let my_to1_h1 = document.getElementById('h1').value;
//
const myelement20 = document.getElementsByName('checkbox2_1');//チェックボックスのチェック自体pop2
const myelement30 = document.getElementsByName('checkbox3_1');//チェックボックスのチェック自体pop3
const myelement4 = document.getElementsByName('checkbox4');//free
const myelement6 = document.getElementsByName('checkbox6');
const cim1_sty = document.querySelector(".sim1");
const cim2_sty = document.querySelector(".simtd1");
const cim_sl1_sty = document.querySelector("#my_selct");
const cim_sl2_sty = document.querySelector("#my_selct2");
const cim_sl3_sty = document.querySelector("#my_selct3");
const cim_sl4_sty = document.querySelector("#my_selct4");
const cim_sl5_sty = document.querySelector("#my_selct5");
const cim_sl6_sty = document.querySelector("#my_selct6");
var my_box_table = false;
var my_box_table2 = false;
//
//let my_in_f_name = document.getElementById('faill_in0').value;
//const myele_fs_sty = document.getElementById('lod_fs');//getElement s ById('x'); getElement ById('o');
//const myele_fs2_sty = document.getElementById('lod_fs2');//getElement s ById('x'); getElement ById('o');
//const myele_is_sty = document.getElementById('lod_is');//getElement s ById('x'); getElement ById('o');
//const myele_is2_sty = document.getElementById('lod_is2');//getElement s ById('x'); getElement ById('o');
//const myele_bs_sty = document.getElementById('lod_bs');//getElement s ById('x'); getElement ById('o');
//const myele_bs2_sty = document.getElementByid('lod_bs2');//getElement s ById('x'); getElement ById('o');
let one_syoto = "none"; //移動した。//my1_1の中身w0,h0-w1,h1
let myel100 = "ここ";
let myel101 = "ここ";
let look_button = false;
function rook_b(){
alert('rook_b');
if(look_button){
look_button = false;
rook_c_go(false);
}else{
look_button = true;
rook_c_go(true);
}
}
function my_a1_hr(){ //a1_link
if(look_button){
look_button = false;
rook_c_go(false);
}else{
look_button = true;
rook_c_go(true);
}
}
//glooe0 コントロールむ
function mystrto() {
alert(timId1);
clearInterval(timId1);
while(readlin[my_n].startsWith('//00')){
linein_arr_n = readlin[my_n].split("/*");
if( linein_arr_n[1]=="zahyou1_1"){
}
if( linein_arr_n[1]=="zahyou2_1"){
}
if( linein_arr_n[1]=="zahyou3_1"){
}
if( linein_arr_n[1]=="zahyou4_1"){
}
if( linein_arr_n[1]=="zahyou4_1_1"){
}
if( linein_arr_n[1]=="image1"){
}
if( linein_arr_n[1]=="redin_v1"){
}
my_n +=1;
}
v_url = "imge/una00.mp4";
document.querySelector('#video1').innerHTML = '<video controls src="imge/una00.mp4" width="256"></video>';// muted
a1_url = "voise/una_kiruna.wav";
document.querySelector('#audio1').innerHTML = 'Stato Up<br><audio src="voise/una_321.wav" type="audio/wev" controls></audio>';
timId1 = setInterval('demoPlay()', 1000);
}
function demoPlay() {
clearInterval(timId1);
clearInterval(timerId);
tim_end = false;
mycount = -3;
}
// gloope1_in
/*
タイプ<br>
<input type="radio" checked onchange="radio_glope1(1);">demo
<input type="radio" onchange="radio_glope1(2);">non
<input type="radio" onchange="radio_glope1(3);">readプレー<br>
*/
// Radio Button change
let int_r_no = 1; //nullを避けるため1から;
let demo_on = true;
let non_on = false; //現在の試行を行うdocument.getElementsByName(
function radio_glope1(int_r_no) { //2,3エレメントRadio noだけで良い?変わった時しか来ないから
alert(int_r_no);
if (int_r_no == 1) { // demo
document.getElementById('ra_g1_2').checked = false;
document.getElementById('ra_g1_3').checked = false;
demo_on = true;
non_on = false;
// Radio2が選択
}
if (int_r_no == 2) {
document.getElementById('ra_g1_1').checked= false;
document.getElementById('ra_g1_3').checked = false;
demo_on = false;
non_on = true;
// Radio2が選択
}
if (int_r_no == 3) {
document.getElementById('ra_g1_1').checked = false;
document.getElementById('ra_g1_2').checked = false;
demo_on = false;
non_on = false;
// Radio1が選択
}
}
/* 定義 */
let hiritu = '16:9';
// gloope2_in
// no_3-5
function radio_glope2(int_r_no){
alert(int_r_no);
if (int_r_no == 1) {
document.getElementById('ra_g2_2').checked = false;
document.getElementById('ra_g2_3').checked = false;
document.getElementById('ra_g3_6').checked = false; //g3-6
hiritu = '16:9';
}
if (int_r_no == 2) {
document.getElementById('ra_g2_1').checked = false;
document.getElementById('ra_g2_3').checked = false;
document.getElementById('ra_g3_6').checked = false;
hiritu = '9:16';
}
if (int_r_no == 3) {
document.getElementById('ra_g2_1').checked = false;
document.getElementById('ra_g2_2').checked = false;
document.getElementById('ra_g3_6').checked = false;
hiritu = '1:1';
}
}
/* 定義 */
let dis_yoko = 640;
let dis_tate = 360;
// gloope3_in
// no_6-11
function radio_glope3(int_r_no){
alert(int_r_no);
if (int_r_no == 1) { //6 <input type="radio" onchange="radio_glope3(1);">
document.getElementById('ra_g3_2').checked = false;
document.getElementById('ra_g3_3').checked = false;
document.getElementById('ra_g3_4').checked = false;
document.getElementById('ra_g3_5').checked = false;
document.getElementById('ra_g3_6').checked = false;
if(hiritu == '16:9'){
dis_yoko = 1280;
dis_tate = 720;
rook_c_go(true);
document.querySelector(".content1").style.height = '1280px';
document.querySelector(".content2").style.height = '1280px';
document.getElementById('no_display').innerHTML = '<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>';
}
if(hiritu == '9:16' || hiritu == '1:1'){
document.getElementById('ra_g2_2').checked = false;
document.getElementById('ra_g2_3').checked = false;
document.getElementById('ra_g2_1').checked = true;
dis_yoko = 1280;
dis_tate = 720;
rook_c_go(true);
document.querySelector(".content1").style.height = '1280px';
document.querySelector(".content2").style.height = '1280px';
document.getElementById('no_display').innerHTML = '<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>';
}
dis_hiritu = "16:9";
}
if (int_r_no == 2) { //7 <input type="radio" onchange="radio_glope3(2);">
document.getElementById('ra_g3_1').checked = false;
document.getElementById('ra_g3_3').checked = false;
document.getElementById('ra_g3_4').checked = false;
document.getElementById('ra_g3_5').checked = false;
document.getElementById('ra_g3_6').checked = false;
if(hiritu == '16:9'){
dis_yoko = 1088;
dis_tate = 612;
dis_hiritu = "16:9";
rook_c_go(true);
document.querySelector(".content1").style.height = '1170px';
document.querySelector(".content2").style.height = '1170px';
document.getElementById('no_display').innerHTML = '<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>';
}
if(hiritu == '9:16'){
dis_yoko = 450;
dis_tate = 800;
dis_hiritu = "9:16";
rook_c_go(true);
document.querySelector(".content1").style.height = '900px';
document.querySelector(".content2").style.height = '900px';
}
if(hiritu == '1:1'){
dis_yoko = 1040;
dis_tate = 780;
dis_hiritu = "4:3";
rook_c_go(true);
document.querySelector(".content1").style.height = '900px';
document.querySelector(".content2").style.height = '900px';
}
}
if (int_r_no == 3) { //8 <input type="radio" onchange="radio_glope3(3);">
document.getElementById('ra_g3_1').checked = false;
document.getElementById('ra_g3_2').checked = false;
document.getElementById('ra_g3_4').checked = false;
document.getElementById('ra_g3_5').checked = false;
document.getElementById('ra_g3_6').checked = false;
if(hiritu == '16:9'){
dis_yoko = 720;
dis_tate = 405;
dis_hiritu = "16:9";
}
if(hiritu == '9:16'){
dis_yoko = 405;
dis_tate = 720;
dis_hiritu = "9:16";
}
if(hiritu == '1:1'){
dis_yoko = 720;
dis_tate = 720;
dis_hiritu = "1:1";
}
}
if (int_r_no == 4) { //9 <input type="radio" checked onchange="radio_glope3(4);">
document.getElementById('ra_g3_1').checked = false;
document.getElementById('ra_g3_2').checked = false;
document.getElementById('ra_g3_3').checked = false;
document.getElementById('ra_g3_5').checked = false;
document.getElementById('ra_g3_6').checked = false;
if(hiritu == '16:9'){
dis_yoko = 640;
dis_tate = 360;
dis_hiritu = "16:9";
}
if(hiritu == '9:16'){
dis_yoko = 360;
dis_tate = 640;
dis_hiritu = "9:16";
}
if(hiritu == '1:1'){
dis_yoko = 640;
dis_tate = 640;
dis_hiritu = "1:1"
}
}
if (int_r_no == 5) { //10 <input type="radio" onchange="radio_glope3(5);">
document.getElementById('ra_g3_1').checked = false;
document.getElementById('ra_g3_2').checked = false;
document.getElementById('ra_g3_3').checked = false;
document.getElementById('ra_g3_4').checked = false;
document.getElementById('ra_g3_6').checked = false;
if(hiritu == '16:9'){
dis_yoko = 320;
dis_tate = 180;
dis_hiritu = "16:9";
}
if(hiritu == '9:16'){
dis_yoko = 180;
dis_tate = 320;
dis_hiritu = "9:16";
}
if(hiritu == '1:1'){
dis_yoko = 320;
dis_tate = 320;
dis_hiritu = "1:1";
}
}
if (int_r_no == 6) { //11 gllpe_1
document.getElementById('ra_g3_1').checked = false;
document.getElementById('ra_g3_2').checked = false;
document.getElementById('ra_g3_3').checked = false;
document.getElementById('ra_g3_4').checked = false;
document.getElementById('ra_g3_5').checked = false;
document.getElementById('ra_g2_1').checked = false;
document.getElementById('ra_g2_2').checked = false;
document.getElementById('ra_g2_3').checked = false;
hiritu = "furee";
dis_yoko = 100;
dis_tate = 100;
dis_hiritu = "furee";
}
Chend_dsp_wh();
}
// テキストボックスからテキストを得て数字にする
/*const mystr = "a-9-b-1234-c-55555-d";
const result = mystr.match(/\d{2,4}/);
console.log( result[0] );*/
let non_nmu = "";
function text_3_w(){
if(hiritu != "furee"){
alert('フリーサイズで使ってください');
return;
}
let str_in_text = document.getElementById('tx_wid').value;
if(str_in_text.length < 3 || str_in_text.length > 4){
alert('間違っています。');
return;
}
non_nmu = str_in_text;
non_nmu = non_nmu.replace(/[0-9]/g, '');
if (non_nmu != ""){
alert('数字だけを入れてください['+non_nmu+']');
return;
}else{
let int_value_t = parseInt(str_in_text);
if(int_value_t>99 && int_value_t < 1281){
//値を入れる
alert('width値を'+int_value_t+'にします。');
dis_yoko = int_value_t;
Chend_dsp_wh();
}else{
alert('100 ~999までてす');
}
}
}
function text_3_h(){
if(hiritu != "furee"){
alert('フリーサイズで使ってください');
return;
}
let str_in_text = document.getElementById('tx_hi').value;
if(str_in_text.length != 3){
alert('間違っています。');
return;
}
non_nmu = str_in_text;
non_nmu = non_nmu.replace(/[0-9]/g, '');
if (non_nmu != ""){
alert('数字だけを入れてください['+non_nmu+']');
return;
}else{
let int_value_t = parseInt(str_in_text);
if(int_value_t>99 && int_value_t < 801){
//値を入れる
alert('hight値を'+int_value_t+'にします。');
dis_tate = int_value_t ;
Chend_dsp_wh();
}else{
alert('100 ~999までてす');
}
}
}
/* サイズ <span id="dis_size_wh">640 * 200</span><br> */
function Chend_dsp_wh(){
document.querySelector('#my5d3').innerHTML = dis_hiritu;
document.querySelector('#dis_size_wh').innerHTML = dis_yoko + ' * ' + dis_tate;
document.querySelector('#my1').style.width = dis_yoko + 'px';
document.querySelector('#my1').style.height = dis_tate + 'px';
box_55.style.width = dis_yoko + 'px';
box_55.style.height = dis_tate + 'px';
stato_wid_size();
}
// gloope4_in
/*
再生<br>
<input type="checkbox" checked onchange="chec_g4_1(checked);">Video S off
<input type="checkbox" onchange="chec_g4_2(checked);">audio S off
<input type="checkbox" onchange="chec_g4_3(checked);">予備
*/
function chec_g4_1(in_this) {
if (in_this) {
video_voise_on = false;
v_muted = "muted ";
} else {
video_voise_on = true;
v_muted = "";
}
alert(video_voise_on);
}
function chec_g4_2(in_this) {
if (in_this) {
audio_voise_on = false;
a_muted = "muted ";
} else {
audio_voise_on = true;
a_muted = "";
}
alert(audio_voise_on);
}
function chec_g4_3(in_this) {
if (in_this) {
sonota_on = true;
} else {
sonota_on = false;
}
alert(sonota_on);
}
// gloop_in end
/* stylsyto 変更 */
let my_width = document.documentElement.clientWidth;
let myNewWidth = my_width - 250 //styleで横幅を250pxと指定しているから
let my_x = 0;
let my_y = 0;
let my_w = 150;
let my_h = 150;
let my_w0 = 0;
let my_h0 = 0;
let my_w1 = 0;
let my_h1 = 0;
let yobi = "予備";///*yobi*yobi1*yobi2/*の様の形式で入れる
document.querySelector('#popup').style.left = '55%';//`${myNewWidth}px`;
let myset_pop = false;
let myset_pop3 = false;
document.querySelector('#popup2').style.top = '10%';
let myset_pop2 = false;
//document.querySelector('#popup2').style.left = '60%';//`${myNewWidth}px`;
document.querySelector('#popup3').style.top = '20%';
//document.querySelector('#popup3').style.left = '30%';
/* */
function chk0() {
// alert('test chk0 it ok');
if(document.getElementsByName('checkbox1')[0].checked == false){
myset_pop = false;
}else{
myset_pop = true;
}
}
/*
*/
function chk1() {
my_width = document.documentElement.clientWidth;
myNewWidth = my_width - 250
document.querySelector('#popup').style.left ='55%';// `${myNewWidth}px`;
document.querySelector("#my_i_01").innerHTML = '<img src="'+my_Rnafil+'" width="'+String(my_w)+'" height="'+String(my_h)+'">';
}
function chk2() {
let myelement = document.getElementsByName('checkbox2');
if (myelement[0].checked == true){
document.querySelector('#popup').style.top = '0';
}else{
document.querySelector('#popup').style.top = '30%';
}
document.querySelector("#my_i_01").innerHTML = '<img src="'+my_Rnafil+'" width="'+String(my_w)+'" height="'+String(my_h)+'">';
}
/* マウスイベント */
window.addEventListener("click", e => {
//alert('click');
chk0();
let myelement3 = document.getElementsByName('checkbox3');
let myelement21 = document.getElementsByName('dis_pop2'); //name="dis_pop2"
// alert(myelement21[0].checked);
let myelement31 = document.getElementsByName('dis_pop3'); //name="dis_pop3"
// alert(myelement31[0].checked);
if(myelement21[0].checked == true && myelement3[0].checked == false && myelement31[0].checked == false){
my_x = e.clientX;
my_y = e.clientY;
const my_box_x_pop = 530;//ポップ
if(my_width < my_x+my_box_x_pop){
// alert('右端です。');
my_x = my_width - my_box_x_pop;
}
document.querySelector('#popup2').style.left = my_x+'px';//`${myNewWidth}px`;
document.querySelector('#popup2').style.top = my_y+'px';
}
if(myset_pop == true && document.getElementsByName('checkbox1')[0].checked == true){
my_x = e.clientX;
my_y = e.clientY;
//let myelement6 = document.getElementsByName('checkbox6');//table
//var my_box_table = false;/* */
chec_table_check();
if(myelement6[0].checked == true && my_box_table == false){
my_pop_select = document.getElementById('ray_selct').value;
if(myel100 == "ここ" || myel101 == "ここ"){
call_test = "back_front";
mypop_test();
myel100 = "ここ";
myel101 = "ここ";
return;
}
if(myset_pop == true && my_box_table == false){
my_box_table = true;
}
if(1==0){ //test
myelement4[0].checked = false;
my_to1_w0 = 64;
document.getElementById('w0').value = my_to1_w0;//x0
my_to1_h0 = 64;
document.getElementById('h0').value = my_to1_h0;//y0
my_to1_w1 = 500;
document.getElementById('w1').value = my_to1_w1;//x1
my_to1_h1 = 320;
document.getElementById('h1').value = my_to1_h1;//y1
my_w1 = my_to1_w0 + my_to1_w1;// 参考
my_h1 = my_to1_h0 + my_to1_h1;// 参考
my_rey_txt = ' <font class="f3">t e s t</font><br> <font size="4" class="mk1"><i>it test</i></font><br>'; //仮入れ テキスト
// my_Rnafil = "imge/gall_1.png"; //仮入れ 画像ファイル名 .im3にて固定変更する
var class_im = "im3";
yobi_arr[0] = "class=."+class_im;//予備style
yobi_arr[1] = 'border="1"';//予備style
yobi_arr[2] = 'background="'+my_Rnafil+'"';//予備style
yobi_tmp[0] = "background-color: #0f0;";//予備style 画像指定で意味がない
yobi_tmp[1] = "border: 5px solid #f0f;";//予備style
yobi_tmp[2] = "opacity: 0.7;"; //予備style
yobi_tmp0 = yobi_tmp.join(' ');
yobi_arr[3] = yobi_tmp0;
yobi_str = yobi_arr.join('**');
alert(yobi_str+".my2_2td1" +my_box_table);//test
var box_my = document.querySelector(my_pop_select);
var serct_rey_patu3 = "#my2_2";
if(my_pop_select == "#my1td1"){
serct_rey_patu3 = "#my1";
}
if(my_pop_select == "#my1_2td1"){
serct_rey_patu3 = "#my1_2";
}
if(my_pop_select == "#my2td1"){
serct_rey_patu3 = "#my2";
}
if(my_pop_select == "#my2_2td1"){
serct_rey_patu3 = "#my2_2";
}
if(my_pop_select == "#my3td1"){
serct_rey_patu3 = "#my3";
}
if(my_pop_select == "#my3_2td1"){
serct_rey_patu3 = "#my3_2";
}
if(my_pop_select == "#my4td1"){
serct_rey_patu3 = "#my4";
}
if(my_pop_select == "#my4_1td1"){
serct_rey_patu3 = "#my4_1";
}
if(my_pop_select == "#my4_2td1"){
serct_rey_patu3 = "#my4_2";
}
box_my.style.width = my_to1_w0 + 'px';
box_my.style.height = my_to1_h0 + 'px';
var my_my1= '<table border="1" background="'+my_Rnafil+'" class="im3" style="'+yobi_tmp0+'"width="'+my_to1_w1+'" height="'+my_to1_h1+'">';
document.getElementById('myf4_1').value = my_my1;
var my_my2 = '<tr><td width="'+my_to1_w1+'" height="'+my_to1_h1+'">'+my_rey_txt+'</td></tr></table>';
document.getElementById('myf4_2').value = my_my2;
var my_my3 = "";
document.getElementById('myf4_3').value = yobi_str;
document.getElementById('myf4_4').value = my_rey_txt;
document.getElementById('myf4_5').value = readlin[my_n]
document.querySelector(serct_rey_patu3).innerHTML = my_my1+my_my2;
}
}
if(myelement6[0].checked == false && my_box_table == true){
my_box_table = false;
}
//it test
if(myelement4[0].checked == true){
let myelement5 = document.getElementsByName('checkbox5');
if(myelement5[0].checked != true){
document.getElementById('w0').value =my_x;
document.getElementById('h0').value =my_y;
}else{
document.getElementById('w1').value =my_x - document.getElementById('w0').value;
document.getElementById('h1').value =my_y - document.getElementById('h0').value;
}
}
if (myelement3[0].checked == true && myelement21[0].checked == false && myelement31[0].checked == false){
//const box_pop = document.querySelector("#popup");
const my_box_x_pop = 340;//ポップ
if(my_width < my_x+my_box_x_pop){
// alert('右端です。');
my_x = my_width - my_box_x_pop;
}
document.querySelector('#popup').style.left = my_x+'px';//`${myNewWidth}px`;
document.querySelector('#popup').style.top = my_y+'px';
}
if (myelement31[0].checked == true && myelement3[0].checked == false && myelement21[0].checked == false){
//const box_pop = document.querySelector("#popup");
const my_box_x_pop = 530;//ポップ
if(my_width < my_x+my_box_x_pop){
alert('右端です。');
my_x = my_width - my_box_x_pop;
}
document.querySelector('#popup3').style.left = my_x+'px';//`${myNewWidth}px`;
document.querySelector('#popup3').style.top = my_y+'px';
}
}
if(myelement3[0].checked == true || myelement21[0].checked == true || myelement31[0].checked == true){
alert('ポップアップウィンドウ移動が表示されています。');
}
pop3_show();
});
function pop3_show(){
//alert(myelement30[0].checked+' test pop3_show');
if (myelement30[0].checked == true) { //popup3が表示されているか
if(one_syoto == "none"){
document.getElementById('my3_pop').value = my_Rnafil;
document.getElementById('mod_no').value = String(my_n);
my_pop_select = document.getElementById('ray_selct').value;
document.getElementById('my3_pop_raydis').innerHTML = my_pop_select;
document.getElementById('mod_come').value = "it is test no.4 my_no="+String(my_n);
if(to_value1 == "none"){
document.getElementById('mod_s').innerHTML = '選択してください。';
}
one_syoto = "no_syoto";
}
} else {
if (one_syoto == "no_syoto") {
one_syoto = "none";
}
}
}
function chec_table_check(){
if(document.getElementsByName('checkbox1')[0].checked == true){
if(myelement6[0].checked == true && my_box_table2 == false){
my_box_table2 = true;
alert('テーブルが表示されています。');
cim1_sty.style.border="3px #00f solid";
cim_sl1_sty.style.color = "#000";
cim_sl1_sty.style.backgroundColor = "#fff";
cim_sl3_sty.style.color = "#000";
cim_sl3_sty.style.backgroundColor = "#fff";
cim_sl5_sty.style.color = "#000";
cim_sl5_sty.style.backgroundColor = "#fff";
cim_sl6_sty.style.color = "#000";
cim_sl6_sty.style.backgroundColor = "#fff";
cim2_sty.style.backgroundColor = bor_b_color;
if (myset_pop == true) {
// my_in_f_name = document.getElementById('faill_in0').value;
// if(my_in_f_name == "ここ"){
alert('ファイル名を入れてください。');
/*
document.getElementByid('lod_bs').style.color = 'yerrow';
myele_fs2_sty.style.color = 'red';
myele_bs2_sty.style.color = 'red'; */
// }
}
}
if(myelement6[0].checked == false && my_box_table2 == true){
my_box_table2 = false;
alert('テーブルが非表示です。');
cim1_sty.style.border="0px";
cim_sl1_sty.style.color = "#aaa";
cim_sl1_sty.style.backgroundColor = "#666";
cim_sl3_sty.style.color = "#aaa";
cim_sl3_sty.style.backgroundColor = "#666";
cim_sl5_sty.style.color = "#aaa";
cim_sl5_sty.style.backgroundColor = "#666";
cim_sl6_sty.style.color = "#aaa";
cim_sl6_sty.style.backgroundColor = "#666";
bor_b_color = "#a0ffa0"
cim2_sty.style.backgroundColor = "#66aa66";
}
}
}
function mypop_test(){
alert('test'+myel100+' '+myel101);
document.querySelector('#my_1v').checked = false;// 動かすcheck
var get_test = document.querySelector("#my_selct8").value;
if(get_test == "spare"){
myel100 = "ここ";
myel101 = "ここ";
myel102 = "ここ";
document.getElementById('lod_fs2').innerHTML = "ここ";
document.getElementById('lod_is2').innerHTML = "ここ";
document.getElementById('lod_bs2').innerHTML = "ここ";
document.getElementById('faill_in0').value = "ここ";
document.getElementById("video1").innerHTML = "Vide01";
document.getElementById("video2").innerHTML = "Video2";
document.getElementById("video3").innerHTML = "Video3";
if(a1_url != ""){
document.querySelector('#audio1').innerHTML ='1<br><audio src="'+a1_url+'" controls stop-play></audio>'
}
if(a2_url != ""){
document.querySelector('#audio2').innerHTML ='2<br><audio src="'+a2_url+'" controls stop-play></audio>'
}
if(a3_url != ""){
document.querySelector('#audio3').innerHTML ='3<br><audio src="'+a3_url+'" controls stop-play></audio>'
}
document.querySelector('#my_1v').checked = true;
return;
}
if(get_test == "none"){
box_my1.style.width = "34px";
box_my1.style.height = "34px";
document.querySelector("#my1").style.width = dis_yoko + 'px';
document.querySelector("#my1").style.height = dis_tate + 'px';
document.querySelector("#my1").style.backgroundColor = '#0ff';
document.querySelector("#my1").innerHTML = "";
box_my1_2.style.width = '32px';
box_my1_2.style.height = '32px';
document.querySelector("#my1_2").innerHTML = "";
box_my2.style.width = '32px';
box_my2.style.height = '32px';
document.querySelector("#my2").innerHTML = "";
box_my2_2.style.width = '32px';
box_my2_2.style.height = '32px';
document.querySelector("#my2_2").innerHTML = "";
box_my3.style.width = '32px';
box_my3.style.height = '32px';
document.querySelector("#my3").innerHTML = "";
box_my3_2.style.width = '32px';
box_my3_2.style.height = '32px';
document.querySelector("#my3_2").innerHTML = "";
box_my4.style.width = '32px';
box_my4.style.height = '32px';
document.querySelector("#my4").innerHTML = "";
box_my4_1.style.width = '32px';
box_my4_1.style.height = '32px';
document.querySelector("#my4_1").innerHTML = "";
box_my4_2.style.width = '32px';
box_my4_2.style.height = '32px';
document.querySelector("#my4_2").innerHTML = "";
box_55.innerHTML = "";
document.querySelector('#my_1v').checked = true;
alert('処理を終わりました。');
}
if(get_test == "table_only"){
alert('テーブルが表示されます。');
document.getElementById('w0').value = 64;
document.getElementById('h0').value = 64;
document.getElementById('w1').value = 640-64;
document.getElementById('h1').value = 360-64;
my_pop_select = document.getElementById('ray_selct').value;
alert(my_pop_select + ' ですが #my4(#my4td1)に変更してテストします。');
my_pop_select = "#my4td1";
my_to1_w0 = 64;
my_to1_h0 = 64;
my_to1_w1 = 640-64;
my_to1_h1 = 360-64;
my_img_rey = 'tebul_4'; // テーブル２#my2td1 #my2_1
box_my4.style.width = my_to1_w0 + 'px';
box_my4.style.height = my_to1_h0 + 'px';
my_out_to_code1 = '///*'+my_img_rey+'/*'+my_pop_select;
document.getElementById('myf4_1').value = my_out_to_code1;
my_out_to_code2 = '/*'+my_to1_w0+'/*'+my_to1_h0+'/*'+my_to1_w1+'/*'+my_to1_h1+'/*/*/*/*';
document.getElementById('myf4_2').value = my_out_to_code2;
my_in_the_text = ' t e s t<br> <font size="5" class="f3"><b><i>it test</i></b></font><br>';
document.getElementById('myf4_3').value = my_in_the_text;
my_out_to_code3 = '<table><tr><td border="1" width="'+my_to1_w1+'" height="'+my_to1_h1+'" class="t_box4" style="background-color: '+bor_b_color+';border: '+bor_size+'px solid '+bor_color+';opacity: '+bor_s_op_opacity+';">'+my_in_the_text+'\n</td></tr></table>';
document.getElementById('myf4_4').value = my_out_to_code3;
my_out_to_code4 = '/* box04 指定 */';
document.getElementById('myf4_5').value = my_out_to_code4;
document.querySelector("#my4").innerHTML = my_out_to_code3;
alert('処理を終わりました。');
}
if(get_test == "back_img"){
alert('テーブルが表示されます。');
document.getElementById('w0').value = 64;
document.getElementById('h0').value = 64;
document.getElementById('w1').value = 640-64;
document.getElementById('h1').value = 360-64;
my_pop_select = document.getElementById('ray_selct').value;
alert(my_pop_select + ' ですが #my4_1(#my4_1td1)に変更してテストします。');
myel101 = 'imge/gall_1.png';
my_pop_select = "#my4_1td1";
my_to1_w0 = 64;
my_to1_h0 = 64;
my_to1_w1 = 640-64;
my_to1_h1 = 360-64;
my_img_rey = 'tebul_4_1'; // テーブル２#my2td1 #my2_1
box_my4_1.style.width = my_to1_w0 + 'px';
box_my4_1.style.height = my_to1_h0 + 'px';
my_out_to_code1 = '///*'+my_img_rey+'/*'+my_pop_select;
document.getElementById('myf4_1').value = my_out_to_code1;
my_out_to_code2 = '/*'+my_to1_w0+'/*'+my_to1_h0+'/*'+my_to1_w1+'/*'+my_to1_h1+'/*/*/*/*';
document.getElementById('myf4_2').value = my_out_to_code2;
my_in_the_text = '<font color="#00f"> t e s t</font><br> <font size="5" class="f3"><b><i>it test</i></b></font><br>';
document.getElementById('myf4_3').value = my_in_the_text;
my_out_to_code3 = '<table><tr><td border="1" background="'+myel101+'" width="'+my_to1_w1+'" height="'+my_to1_h1+'" class="t_box4" style="background-color: '+bor_b_color+';border: '+bor_size+'px solid '+bor_color+';opacity: '+bor_s_op_opacity+';">'+my_in_the_text+'\n</td></tr></table>';
document.getElementById('myf4_4').value = my_out_to_code3;
my_out_to_code4 = '/* box04_1 指定 */';
document.getElementById('myf4_5').value = my_out_to_code4;
document.querySelector("#my4_1").innerHTML = my_out_to_code3;
alert('処理を終わりました。');
}
if(get_test == "back_front" || call_test == "back_front"){
call_test = "call_test";
alert('テーブルが表示されます。3_2');
document.getElementById('w0').value = 64;
document.getElementById('h0').value = 64;
document.getElementById('w1').value = 640-64;
document.getElementById('h1').value = 360-64;
my_pop_select = document.getElementById('ray_selct').value;
alert(my_pop_select + ' ですが #my3_2(#my3_2td1)に変更してテストします。');
myel100 = 'imge/cyat.png';
myel101 = 'imge/gall_1.png';
my_pop_select = "#my3_2td1";
my_to1_w0 = 64;
my_to1_h0 = 64;
my_to1_w1 = 640-64;
my_to1_h1 = 360-64;
my_img_rey = 'tebul_3_2'; // テーブル２#my2td1 #my2_1
box_my3_2.style.width = my_to1_w0 + 'px';
box_my3_2.style.height = my_to1_h0 + 'px';
my_out_to_code1 = '///*'+my_img_rey+'/*'+my_pop_select;
document.getElementById('myf4_1').value = my_out_to_code1;
my_out_to_code2 = '/*'+my_to1_w0+'/*'+my_to1_h0+'/*'+my_to1_w1+'/*'+my_to1_h1+'/*/*/*/*';
document.getElementById('myf4_2').value = my_out_to_code2;
my_in_the_text = '<img src="'+myel100+'" width="175" height="175" style="float:left"><table><tr><td><br><br><font color="#88f"> t e s t</font><br> <font size="5" class="f3"><b><i>ようこそ!</i></b></font></td></tr></table>';
document.getElementById('myf4_3').value = my_in_the_text;
my_out_to_code3 = '<table><tr><td border="1" background="'+myel101+'" width="'+my_to1_w1+'" height="'+my_to1_h1+'" class="t_box4" style="background-color: '+bor_b_color+';border: '+bor_size+'px solid '+bor_color+';opacity: '+bor_s_op_opacity+';">'+my_in_the_text+'\n</td></tr></table>';
document.getElementById('myf4_4').value = my_out_to_code3;
my_out_to_code4 = '/* box03_2 指定 */';
document.getElementById('myf4_5').value = my_out_to_code4;
document.querySelector("#my3_2").innerHTML = my_out_to_code3;
alert('処理を終わりました。');
}
if(get_test == "imge" || call_test == "imge"){
call_test = "call_test";
alert('テーブルが表示されます。');
document.getElementById('w0').value = 128;
document.getElementById('h0').value = 128;
document.getElementById('w1').value = 200;
document.getElementById('h1').value = 200;
my_pop_select = document.getElementById('ray_selct').value;
alert(my_pop_select + ' ですが #my2(#my2td1)に変更してテストします。');
myel100 = 'imge/gall_1.png';
my_pop_select = "#my2td1";
my_to1_w0 = 128;
my_to1_h0 = 128;
my_to1_w1 = 200;
my_to1_h1 = 200;
my_img_rey = 'image_2'; // テーブル２#my2td1 #my2_1
box_my2.style.width = my_to1_w0 + 'px';
box_my2.style.height = my_to1_h0 + 'px';
my_out_to_code1 = '///*'+my_img_rey+'/*'+my_pop_select;
document.getElementById('myf4_1').value = my_out_to_code1;
my_out_to_code2 = '/*'+my_to1_w0+'/*'+my_to1_h0+'/*'+my_to1_w1+'/*'+my_to1_h1+'/*/*/*/*';
document.getElementById('myf4_2').value = my_out_to_code2;
my_in_the_text = '<img src="'+myel100+'" width="'+ my_to1_w1 +'" height="'+ my_to1_h1 +'" style="float:left">';
document.getElementById('myf4_3').value = my_in_the_text;
my_out_to_code3 = my_in_the_text;
document.getElementById('myf4_4').value = my_out_to_code3;
my_out_to_code4 = '/* box02 指定 */';
document.getElementById('myf4_5').value = my_out_to_code4;
document.querySelector("#my2").innerHTML = my_out_to_code3;
alert('処理を終わりました。');
}
if(get_test == "text"){
alert('テーブルが表示されます。');
document.getElementById('w0').value = 128;
document.getElementById('h0').value = 128;
document.getElementById('w1').value = 500;
document.getElementById('h1').value = 200;
my_pop_select = document.getElementById('ray_selct').value;
alert(my_pop_select + ' ですが #my4_2(#my4_2td1)に変更してテストします。');
// myel100 = 'imge/gall_1.png';
my_pop_select = "#my4_2td1";
my_to1_w0 = 128;
my_to1_h0 = 128;
my_to1_w1 = 500;
my_to1_h1 = 200;
my_img_rey = 'text_4_2'; // テーブル２#my2td1 #my2_1
box_my4_2.style.width = my_to1_w0 + 'px';
box_my4_2.style.height = my_to1_h0 + 'px';
my_out_to_code1 = '///*'+my_img_rey+'/*'+my_pop_select;
document.getElementById('myf4_1').value = my_out_to_code1;
my_out_to_code2 = '/*'+my_to1_w0+'/*'+my_to1_h0+'/*'+my_to1_w1+'/*'+my_to1_h1+'/*/*/*/*';
document.getElementById('myf4_2').value = my_out_to_code2;
my_in_the_text = '<font color="#88f"> hello world !</font><br> <font size="5" class="f3"><b><i>ようこそ!</i></b></font>';
document.getElementById('myf4_3').value = my_in_the_text;
my_out_to_code3 = my_in_the_text;
document.getElementById('myf4_4').value = my_out_to_code3;
my_out_to_code4 = '/* box04_2 指定 */';
document.getElementById('myf4_5').value = my_out_to_code4;
document.querySelector("#my4_2").innerHTML = my_out_to_code3;
alert('処理を終わりました。');
}
if(get_test == "video"){//1
alert('テーブルが表示されます。');
document.getElementById('w0').value = 64;
document.getElementById('h0').value = 64;
document.getElementById('w1').value = 640-64;
document.getElementById('h1').value = 360-64;
my_pop_select = document.getElementById('ray_selct').value;
alert(my_pop_select + ' ですが #my1_2(#my1_2td1)に変更してテストします。');
myel102 = 'video/una00.mp4';
v_url = myel102;
v2_url = v_url;
my_pop_select = "#my1_2td1";
my_to1_w0 = 64;
my_to1_h0 = 64;
my_to1_w1 = 640-64;
my_to1_h1 = 360-64;
my_img_rey = 'video_1_2'; // テーブル２#my2td1 #my2_1
box_my1_2.style.width = my_to1_w0 + 'px';
box_my1_2.style.height = my_to1_h0 + 'px';
my_out_to_code1 = '///*'+my_img_rey+'/*'+my_pop_select;
document.getElementById('myf4_1').value = my_out_to_code1;
my_out_to_code2 = '/*'+my_to1_w0+'/*'+my_to1_h0+'/*'+my_to1_w1+'/*'+my_to1_h1+'/*/*/*/*';
document.getElementById('myf4_2').value = my_out_to_code2;
my_in_the_text = '';
document.getElementById('myf4_3').value = my_in_the_text;
my_out_to_code3 = '<video src="'+v_url+'" width="'+my_to1_w1+'" height="'+my_to1_h1+'" autoplay></video>';
// my_out_to_code3 = '<video src="'+v_url+'" width="'+my_to1_w1+'" muted autoplay></video>';
document.getElementById('myf4_4').value = my_out_to_code3;
my_out_to_code4 = '/* box01 指定 */';
document.getElementById('myf4_5').value = my_out_to_code4;
document.getElementById("video2").innerHTML = '<video src="'+v_url+'" width="256"</video>';;
document.querySelector("#my1_2").innerHTML = my_out_to_code3;
alert('処理を終わりました。');
}
if(get_test == "audio"){
my_img_rey = 'audio_1';
a1_url ="voise/myout2_0.wav";
my_to1_w0 = 128;
my_to1_h0 = 64;
my_to1_w1 = "";
my_to1_h1 = "";
my_out_to_code1 = '///*'+my_img_rey+'/*'+my_pop_select;
document.getElementById('myf4_1').value = my_out_to_code1;
my_out_to_code2 = '/*'+my_to1_w0+'/*'+my_to1_h0+'/*'+my_to1_w1+'/*'+my_to1_h1+'/*/*/*/*';
document.getElementById('myf4_2').value = my_out_to_code2;
my_in_the_text = '';
document.getElementById('myf4_3').value = my_in_the_text;
my_out_to_code3 = 'una_test<br><audio controls src="'+a1_url+'" autoplay></audio>';
document.getElementById('myf4_4').value = my_out_to_code3;
my_out_to_code4 = '/* box01 指定 */';
document.getElementById('myf4_5').value = my_out_to_code4;
document.querySelector('#audio1').innerHTML = my_out_to_code3;
}
}
/* 2024/05/01 */
/* owari */
//pop1から２を表示
function pop1_or_2(){
// alert('pop1_or_2');
if(myelement20[0].checked == false){
myelement20[0].checked = true;
//document.getElementsByName('checkbox3').checked = true;
}
/* ポップアップウィンドウ表示 */
}
/* ポップアップウィンドウからの取り込み */
let my_img_rey = 'imge_3';
var my_arr_no = 0;
function chk_3() { //送信
if(myel100 == "ここ"){
call_test = "imge";
myel100 = "imge/gall_1.png";
myel101 = "ここ";
myel102 = "ここ";
document.getElementById('lod_fs2').innerHTML = "imge/gall_1.png";
document.getElementById('lod_is2').innerHTML ="imge/gall_1.png";
document.getElementById('faill_in0').value = "imge/gall_1.png";
my_img_furont == false;
my_img_back == false;
bu_txt_check();
mypop_test();
my_img_furont == true;
myel100 = "imge/gall_1.png";
document.getElementById('lod_is2').innerHTML = myel100;
document.querySelector('#my_1v').checked = true;
return;
}
if(mysel4_vale == "image_none" && myelement6[0].checked == true){
my_pop_select = document.getElementById('ray_selct').value;
my_to1_w0 = document.getElementById('w0').value;
my_to1_h0 = document.getElementById('h0').value;
my_to1_w1 = document.getElementById('w1').value;
my_to1_h1 = document.getElementById('h1').value;
alert(my_pop_select+'注意 W0='+my_h+' H0='+my_to1_h0+' W1='+my_to1_w1+' H1='+my_to1_h1+'<br>'+my_Rnafil);
alert('test box02 で');
if(my_pop_select == "#my2td1"){
my_img_rey = 'tebul_2'; // テーブル２#my2td1 #my2_1
// var box_my1 = document.querySelector("#my1td1");
box_my2.style.width = my_to1_w0 + 'px';
box_my2.style.height = my_to1_h0 + 'px';
my_out_to_code1 = '///*'+my_img_rey+'/*'+my_pop_select;
my_out_to_code2 = '/*'+my_to1_w0+'/*'+my_to1_h0+'/*'+my_to1_w1+'/*'+my_to1_h1+'/*/*/*/*';
my_in_the_text = ' <font class="f3">t e s t</font><br> <font size="4" class="mk1"><i>it test</i></font><br>';
my_out_to_code3 = '<table><tr><td border="1" width="'+my_to1_w1+'" height="'+my_to1_h1+'" class="t_box2" style="background-color: '+bor_color+';border: '+bor_size+'px '+bor_color+';opacity: '+bor_s_op_opacity+';">'+my_in_the_text+'\n</td></tr></table>';
my_out_to_code4 = '/* box02 指定 */';
document.getElementById('myf4_1').value = my_out_to_code1;
document.getElementById('myf4_2').value = my_out_to_code2;
document.getElementById('myf4_3').value = my_in_the_text;
document.getElementById('myf4_4').value = my_out_to_code3;
document.getElementById('myf4_5').value = my_out_to_code4;
document.querySelector("#my2").innerHTML = my_out_to_code3;
alert('処理を終わりました。');
}
return;//test
if(my_pop_select == "#my1_2td1"){
my_img_rey = 'tebul_1_2';
// var box_my = document.querySelector("#my1_2td1");
box_my1_2.style.width = my_to1_w0 + 'px';
box_my1_2.style.height = my_to1_h0 + 'px';
document.querySelector("#my1_2").innerHTML = '<table><tr><td border="1" class="t_box1_2" style="background-color: '+bor_color+';border: '+bor_size+'px '+bor_color+';">'+my_in_the_text+'</td></tr></table>';
}
if(my_pop_select == "#my2td1"){
my_img_rey = 'tebul_2';
// var box_my = document.querySelector("#my2td1");
box_my2.style.width = my_to1_w0 + 'px';
box_my2.style.height = my_to1_h0 + 'px';
document.querySelector("#my2").innerHTML = '<table><tr><td border="1" class="t_box2" style="background-color: '+bor_color+';border: '+bor_size+'px '+bor_color+';">'+my_in_the_text+'</td></tr></table>';
}
if(my_pop_select == "#my2_2td1"){
my_img_rey = 'tebul_2_2';
// var box_my = document.querySelector("#my2_2td1");
box_my2_2.style.width = my_to1_w0 + 'px';
box_my2_2.style.height = my_to1_h0 + 'px';
document.querySelector("#my2_2").innerHTML = '<table><tr><td border="1" class="t_box2_2" style="background-color: '+bor_color+';border: '+bor_size+'px '+bor_color+';">'+my_in_the_text+'</td></tr></table>';
}
if(my_pop_select == "#my3td1"){
my_img_rey = 'tebul_3';
// var box_my = document.querySelector("#my3td1");
box_my3.style.width = my_to1_w0 + 'px';
box_my3.style.height = my_to1_h0 + 'px';
document.querySelector("#my3").innerHTML = '<table><tr><td border="1" class="t_box3" style="background-color: '+bor_color+';border: '+bor_size+'px '+bor_color+';">'+my_in_the_text+'</td></tr></table>';
}
if(my_pop_select == "#my3_2td1"){
my_img_rey = 'tebul_3_2';
// var box_my = document.querySelector("#my3_2td1");
box_my3_2.style.width = my_to1_w0 + 'px';
box_my3_2.style.height = my_to1_h0 + 'px';
document.querySelector("#my3_2").innerHTML = '<table><tr><td border="1" class="t_box3_2" style="background-color: '+bor_color+';border: '+bor_size+'px '+bor_color+';">'+my_in_the_text+'</td></tr></table>';
}
if(my_pop_select == "#my4td1"){
my_img_rey = 'tebul_4';
// var box_my = document.querySelector("#my4td1");
box_my4.style.width = my_to1_w0 + 'px';
box_my4.style.height = my_to1_h0 + 'px';
document.querySelector("#my4").innerHTML = '<table><tr><td border="1" class="t_box4" style="background-color: '+bor_color+';border: '+bor_size+'px '+bor_color+';">'+my_in_the_text+'</td></tr></table>';
}
if(my_pop_select == "#my4_1td1"){
my_img_rey = 'tebul_4_1';
// var box_my = document.querySelector("#my4_1td1");
box_my4_1.style.width = my_to1_w0 + 'px';
box_my4_1.style.height = my_to1_h0 + 'px';
document.querySelector("#my4_1").innerHTML = '<table><tr><td border="1" class="t_box4_1" style="background-color: '+bor_color+';border: '+bor_size+'px '+bor_color+';">'+my_in_the_text+'</td></tr></table>';
}
}
if(myelement6[0].checked == false){
my_pop_select = document.getElementById('ray_selct').value;
my_to1_w0 = document.getElementById('w0').value;
my_to1_h0 = document.getElementById('h0').value;
my_to1_w1 = document.getElementById('w1').value;
my_to1_h1 = document.getElementById('h1').value;
alert(my_pop_select+'注意 W0='+my_h+' H0='+my_to1_h0+' W1='+my_to1_w1+' H1='+my_to1_h1+'<br>'+my_Rnafil);
if(my_pop_select == "#my1td1"){
my_img_rey = 'imge_1';
// var box_my1 = document.querySelector("#my1td1");
inner_fc_s_pop2();
box_my1.style.width = my_to1_w0 + 'px';
box_my1.style.height = my_to1_h0 + 'px';
document.querySelector("#my2_2").innerHTML = '<img src="'+my_Rnafil+'" width="'+my_to1_w1+'" height="'+my_to1_h1+'">';
inner_fc_w_pop2();
}
if(my_pop_select == "#my1_2td1"){
my_img_rey = 'imge_1_2';
// var box_my = document.querySelector("#my1_2td1");
inner_fc_s_pop2();
box_my1_2.style.width = my_to1_w0 + 'px';
box_my1_2.style.height = my_to1_h0 + 'px';
document.querySelector("#my1_2").innerHTML = '<img src="'+my_Rnafil+'" width="'+my_to1_w1+'" height="'+my_to1_h1+'">';
inner_fc_w_pop2();
}
if(my_pop_select == "#my2td1"){
my_img_rey = 'imge_2';
// var box_my = document.querySelector("#my2td1");
inner_fc_s_pop2();
box_my2.style.width = my_to1_w0 + 'px';
box_my2.style.height = my_to1_h0 + 'px';
document.querySelector("#my2").innerHTML = '<img src="'+my_Rnafil+'" width="'+my_to1_w1+'" height="'+my_to1_h1+'">';
inner_fc_w_pop2();
}
if(my_pop_select == "#my2_2td1"){
my_img_rey = 'imge_2_2';
// var box_my = document.querySelector("#my2_2td1");
inner_fc_s_pop2();
box_my2_2.style.width = my_to1_w0 + 'px';
box_my2_2.style.height = my_to1_h0 + 'px';
document.querySelector("#my2_2").innerHTML = '<img src="'+my_Rnafil+'" width="'+my_to1_w1+'" height="'+my_to1_h1+'">';
inner_fc_w_pop2();
}
//my2_2td1
if(my_pop_select == "#my3td1"){
my_img_rey = 'imge_3';
// var box_my = document.querySelector("#my3td1");
inner_fc_s_pop2();
box_my3.style.width = my_to1_w0 + 'px';
box_my3.style.height = my_to1_h0 + 'px';
document.querySelector("#my3").innerHTML = '<img src="'+my_Rnafil+'" width="'+my_to1_w1+'" height="'+my_to1_h1+'">';
inner_fc_w_pop2();
}
////3_2?
if(my_pop_select == "#my4td1"){
my_img_rey = 'imge_4';
// var box_my = document.querySelector("#my4td1");
inner_fc_s_pop2();
box_my4.style.width = my_to1_w0 + 'px';
box_my4.style.height = my_to1_h0 + 'px';
document.querySelector("#my4").innerHTML = '<img src="'+my_Rnafil+'" width="'+my_to1_w1+'" height="'+my_to1_h1+'">';
inner_fc_w_pop2();
}
if(my_pop_select == "#my4_1td1"){
my_img_rey = 'imge_4_1';
// var box_my = document.querySelector("#my4_1td1");
inner_fc_s_pop2();
box_my4_1.style.width = my_to1_w0 + 'px';
box_my4_1.style.height = my_to1_h0 + 'px';
document.querySelector("#my4_1").innerHTML = '<img src="'+my_Rnafil+'" width="'+my_to1_w1+'" height="'+my_to1_h1+'">';
inner_fc_w_pop2();
}
////4_2?
}
}
// inner function 2f
function inner_fc_s_pop2(){
if(my_to1_w0 - Math.floor(my_to1_w1 / 2) > 0){
my_to1_w0 -= Math.floor(my_to1_w1 / 2);
}else{
my_to1_w0 = 0;
}
if(my_to1_h0 - Math.floor(my_to1_h1 / 2) > 0){
my_to1_h0 -= Math.floor(my_to1_h1 / 2);
}else{
my_to1_h0 = 0;
}
}
function inner_fc_w_pop2(){
var my_p_tim = document.getElementById('my_tim_dis').value;
my_arr_no = document.getElementById('step').value;
alert('my_arr_no='+my_arr_no+'p_t='+my_p_tim);
let myelement_1c = document.getElementsByName('my_1c');
let my_w_name = document.getElementById('in_work').value;
let my_w_n = my_w_name.split("/*");
let my_now_t =document.getElementById('my_tim_dis').value;
alert(my_w_n[1]+'it'+myelement_1c[0].checked);
if(myelement_1c[0].checked == true && my_w_n[1] == ''){
//fomat (//no[0]/*name[1]/*id[2])(/*x[3]/*y[4]/*|w[5]/*h[6]/*(/*))(script[7])(/*comment[8]*/);10要素
document.getElementById('in_work').value = '//'+my_now_t+'/*'+my_img_rey+'/*'+my_pop_select;
document.getElementById('in_work2').value = '/*'+my_to1_w0+'/*'+my_to1_h0+'/*'+my_w+'/*'+my_h+'/*'+yobi+'/*';
document.getElementById('in_value').value = '<img src="'+my_Rnafil+'" width="'+String(my_w)+'" height="'+String(my_h)+'">';
document.getElementById('in_come').value = '/*'+my_Rnafil+'*/';
var my_line_wite = '//'+my_p_tim+'/*'+my_img_rey+'/*'+my_pop_select + '/*'+my_to1_w0+'/*'+my_to1_h0+'/*'+my_w+'/*'+my_h+'/*' + '<img src="'+my_Rnafil+'" width="'+String(my_w)+'" height="'+String(my_h)+'">' + '/*'+my_Rnafil+'*/';
alert(my_line_wite);//配列に入配列に入れるなら
var my_line = document.getElementById('in_work').value + document.getElementById('in_work2').value + document.getElementById('in_value').value + document.getElementById('in_come').value;
alert(my_line);
}
}
// end inner function 2f
/* end document.getElementById("download").addEventListener("click", function() {*/
/*
function down_faile_not() { //フ無い
// alert('test down');el
if(element_tx.value == ""){
let my_w_text = readlin.join('\n');
element_tx.value = my_w_text;
}else{
alert('test down とりあえずもどる');
return;
}
alert(my_w_text)
}
*/
function down_faile() { //ファイルダウンロード textaer2 逆になってるファイルをget read in 空でも、止めようがない
document.getElementById("download").addEventListener("click", function() {
let text = element_tx.value;
if (text == "" && readlin[0].startsWith("//00/*")) { //ファイルがない時は元に戻すトップが//00/*で始まる
alert('適正ファイルがありません0');
return;
}
let blob = new Blob([text], { type: "text/plain" });
const url = URL.createObjectURL(blob);
const a = document.createElement("a");
a.href = url;
a.download = "html_downlood.txt";
a.click();
URL.revokeObjectURL(url);
});
}
function chk_4(my_Rnafil0){ //ファイル名を取得
my_Rnafil = my_Rnafil0;
alert('test chk_4'+my_Rnafil);
//document.getElementsByName('checkbox1')0.value = 'checkし'+my_Rnafil+'ました。';
//document.getElementById('my_01').value = '<img src="./imge/man1_1.png" width="200px" height="200px" alt="is not">';
//ファイルがない時はis not!! にする。拡張子が合わないのに次をするのはどうかと思う。
if(my_Rnafil.startsWith("C\:\\fakepath\\")){ //ファイル名の先頭がC:\fakepath\で始まるか
if(my_Rnafil.match(/.+\.(png|jpg|gif)$/gm)){ //ファイル名の最後がpng,jpg,gifで終わるか
my_Rnafil = my_Rnafil.replace(/C\:\\fakepath\\/gm, 'imge/');
alert('ファイル名を変更しました');
}
if(my_Rnafil.match(/.+\.(mp4)$/gm)){ //ファイル名の最後がmp4で終わるか
my_Rnafil = my_Rnafil.replace(/C\:\\fakepath\\/gm, 'video/');
alert('ファイル名を変更しました');
}
if(my_Rnafil.match(/.+\.(mp3|wav)$/gm)){ //ファイル名の最後がpng,jpg,gifで終わるか
my_Rnafil = my_Rnafil.replace(/C\:\\fakepath\\/gm, 'voice/');
alert('ファイル名を変更しました');
}
document.getElementById('lod_fs2').innerHTML = my_Rnafil;
my_f_flag = false;
document.getElementById('faill_in0').value = my_Rnafil;
bu_txt_check();
if(my_f_flag == true){
alert('directory名が違います。');
return;
}
alert('ファイル名を変更しました');
}else{
my_Rnafil = def_img_png; //違っていたら借り入れしてみゆ。imge/が付いている
return;
}
// bu_txt_check();
// if (my_Rnafil.startsWith("(\./)?imge/")){ //ファイル名の先頭がimge/で始まるか}
if(my_Rnafil.match(/.+\.(png|jpg|gif)$/gm)){ //ファイル名の最後がpng,jpg,gifで終わるか 1文字以上の文字列の後に.があり、png,jpg,gifのいずれかで終わる
alert('ファイル一致しました');
// document.getElementByid('faill_in0'). = my_Rnafil;
document.getElementById('lod_fs2').innerHTML = my_Rnafil;
document.getElementById('lod_is2').innerHTML = my_Rnafil;
document.getElementById('lod_bs2').innerHTML = 'ファイル名を取得しました。';
document.getElementById('faill_in0').value = document.getElementById('lod_fs2').innerHTML;
cim_sl4_sty.style.color = "#000"; //ファイル名
cim_sl4_sty.style.backgroundColor = "#fff";
alert('ファイル名を取得しました。'+my_Rnafil);
myel100 = my_Rnafil;
var get_img_size = new Image();
get_img_size.src = my_Rnafil;
get_img_size.onload = function () {
// プロセスが遅くなるため中で処理を完結させること
const innersunpou = 170;
var width_myp = get_img_size.naturalWidth;
var height_myp = get_img_size.naturalHeight;
alert('1 width='+width_myp+' height='+height_myp);
document.getElementById('w1').value = width_myp;
document.getElementById('h1').value = height_myp;
if (width_myp >= height_myp){
if (width_myp > innersunpou){
my_w = innersunpou;
my_h = Math.floor(innersunpou * height_myp / width_myp); //x:y=w:h 150:150=w:h 150h=150w 150=150w/h;
}else{
my_w = width_myp;
my_h = height_myp;
}
}else{
if (height_myp > innersunpou){
my_w = Math.floor(innersunpou * width_myp / height_myp); //x:y=w:h 150:150=w:h 150w=
my_h = innersunpou;
}else{
my_w = width_myp;
my_h = height_myp;
}
}
alert('width='+String(my_w)+' height='+String(my_h));//小数点以下の変数は文字列に変換しない小数点以下の変数
document.querySelector("#my_i_01").innerHTML = '<img src="'+my_Rnafil+'" width="'+String(my_w)+'" height="'+String(my_h)+'">';
};
}
}
/* pop_up 1 eria */
/* furag移動 */
function bu_txt_check() {
alert('check!');
my_f_flag = true;
if(document.getElementsByName('checkbox1')[0].checked == false){
return;
}
my_txtbox_text = document.getElementById('faill_in0').value;
if(my_txtbox_text.match(/^ここ/gm) || my_txtbox_text == '' || !my_txtbox_text.match(/.+\.(png|jpg|gif|mp4|wav|mp3)$/gm)){
document.getElementById('faill_in0').style.backgroundColor = "#f00";
if(!my_txtbox_text.match(/^(imge|video|voice)\/./gm)){
alert('アドレス指定が違います。imge/ video/ voice/ で始まるアドレスを入れてください。');
document.getElementById('faill_in0').value = 'ここに file address を入れてください。';
return;
}
alert('有効なファイルアドレスが入力されていません。');
document.getElementById('faill_in0').value = 'ここにファイルの選択で選択して入れてください。';
return;
}else{
document.getElementById('faill_in0').style.backgroundColor = "#fff";
}
if(my_txtbox_text.match(/.+\.(png|jpg|gif)$/gm)){
aru3_str = my_txtbox_text;
checkFileExists2(my_txtbox_text);
checkFileExists2('imge/んんん.png');
alert('ファイルが存在するかは、見ての通り。あるとして');//時間差があるから、ファイルが存在するかどうかは、見ての通り。ここでは判断できない。
if(my_txtbox_text.match(/.+\.(png)$/gm)){
alert('pngファイルです。');
my_kakutyoushi = 'png';
}
if(my_txtbox_text.match(/.+\.(jpg)$/gm)){
alert('jpgファイルです。');
my_kakutyoushi = 'jpg';
}
if(my_txtbox_text.match(/.+\.(gif)$/gm)){
alert('gifファイルです。');
my_kakutyoushi = 'gif';
}
}
if(my_txtbox_text.match(/.+\.(mp4|wav|mp3)$/gm)){
document.getElementById('my_selct6').style.color = "#000";
document.getElementById('my_selct6').style.backgroundColor = "#fff";
alert('あることを祈る。いいか?');
if(my_txtbox_text.match(/.+\.(mp4)$/gm)){
document.getElementById('my_selct7').style.color = "#f00";
document.getElementById('my_selct7').style.backgroundColor = "#fcc";
alert('mp4ファイルです。');
my_kakutyoushi = 'mp4';
}
if(my_txtbox_text.match(/.+\.(wav)$/gm)){
document.getElementById('my_selct7').style.color = "#00f";
document.getElementById('my_selct7').style.backgroundColor = "#ccf";
alert('wavファイルです。');
my_kakutyoushi = 'wav';
}
if(my_txtbox_text.match(/.+\.(mp3)$/gm)){
document.getElementById('my_selct7').style.color = "#00f";
document.getElementById('my_selct7').style.backgroundColor = "#ccf";
alert('mp3ファイルです。');
my_kakutyoushi = 'mp3';
}
}else{
document.getElementById('my_selct6').style.color = "#aaa";
document.getElementById('my_selct6').style.backgroundColor = "#666";
document.getElementById('my_selct7').style.color = "#aaa";
document.getElementById('my_selct7').style.backgroundColor = "#666";
}
my_Rnafil = my_txtbox_text;
document.getElementById('lod_fs2').innerHTML = my_Rnafil
if(my_img_furont == true){
document.getElementById('lod_is2').innerHTML = my_Rnafil;
}
if(my_img_back == true){
document.getElementById('lod_bs2').innerHTML = my_Rnafil;
}
my_f_flag = false;
}
//ファイルの存在確認
function checkFileExists2(url){ //ファイルの存在確認1このみ。ファイルが存在するかどうかは、見ての通り。ここでは判断できない。
var path_f2 = url;
var element_f2 = new Image();
element_f2.onload = function () {
var width_f2 = element_f2.naturalWidth;
var height_f2 = element_f2.naturalHeight;
if(aru3_str == path_f2){
alert('存在します。');
faile_ch_li2 = '';
}else{
if(faile_ch_li2 != '' && 'imge/んんん.png' == path_f2){
faile_ch_li2 = ' * ' + aru3_str;
if(document.getElementsByName('checkbox1')[0].checked == true){
document.getElementById('faill_in0').value = 'ここに正しいファイルの選択を入れてください。';
document.getElementById('faill_in0').style.backgroundColor = "#f0f";
}
alert('fileはありません。 '+aru3_str);
} else {
faile_ch_li2 = path_f2;//' * ' + aru3_str;
}
}
};
element_f2.src = path_f2;
}
/* idou */
var set_styl1 = bor_size+"px solid "+bor_color;
function my_selct() { //ボーダーの太さ設定状況
alert('no_seting__0');
if(myelement6[0].checked==false){
return;
}
mysel1_vale = cim_sl1_sty.value;
alert('test'+mysel1_vale);
if(mysel1_vale == "b_none"){
bor_size = 0;
cim_sl2_sty.style.color = "#666";
cim_sl2_sty.style.backgroundColor = "#aaa";
}else{
cim_sl2_sty.style.color = "#000";
cim_sl2_sty.style.backgroundColor = "#fff";
}
if(mysel1_vale == "b_mini"){
bor_size = 1;
}
if(mysel1_vale == "b_mide"){
bor_size = 2;
}
if(mysel1_vale == "b_rage"){
bor_size = 4;
}
set_styl1 = bor_size+"px solid "+bor_color;
alert('3test'+set_styl1);
cim2_sty.style.backgroundColor = bor_b_color;
cim2_sty.style.border = set_styl1;
cim2_sty.style.opacity = bor_s_op_opacity;
}
function my_selct2() { //ボーダーの色設定状況
alert('test'+mysel1_vale+' '+mysel2_vale)
if(myelement6[0].checked==false || mysel1_vale == "b_none"){
alert('1test'+mysel1_vale+' '+mysel2_vale)
return;
}
if(mysel1_vale != "b_none"){
cim_sl2_sty.style.color = "#000";
cim_sl2_sty.style.backgroundColor = "#fff";
}
mysel2_vale = cim_sl2_sty.value;
alert('2test'+mysel1_vale+' '+mysel2_vale)
if(mysel2_vale == "b_888"){
bor_color = "#888";
}
if(mysel2_vale == "b_fff"){
bor_color = "#fff";
}
if(mysel2_vale == "b_000"){
bor_color = "#000";
}
if(mysel2_vale == "b_f00"){
bor_color = "#f00";
}
if(mysel2_vale == "b_0f0"){
bor_color = "#0f0";
}
if(mysel2_vale == "b_00f"){
bor_color = "#00f";
}
if(mysel2_vale == "b_f0f"){
bor_color = "#f0f";
}
if(mysel2_vale == "b_0ff"){
bor_color = "#0ff";
}
if(mysel2_vale == "b_ff0"){
bor_color = "#ff0";
}
set_styl1 = bor_size+"px solid "+bor_color;
cim2_sty.style.backgroundColor = bor_b_color;
cim2_sty.style.border = set_styl1;
cim2_sty.style.opacity = bor_s_op_opacity;
}
function my_selct3() { //背景色設定状況
alert('3no_seting');
if(myelement6[0].checked==false){
return;
}
mysel3_vale = cim_sl3_sty.value;
if(mysel3_vale == "bk_none"){
bor_b_color = "#66aa66";
}
if(mysel3_vale == "bk_888"){
bor_b_color = "#888";
}
if(mysel3_vale == "transparent"){
bor_b_color = "transparent";
}
if(mysel3_vale == "bk_fff"){
bor_b_color = "#fff";
}
if(mysel3_vale == "bk_000"){
bor_b_color = "#000";
}
if(mysel3_vale == "bk_f00"){
bor_b_color = "#f00";
}
if(mysel3_vale == "bk_0f0"){
bor_b_color = "#0f0";
}
if(mysel3_vale == "bk_00f"){
bor_b_color = "#00f";
}
if(mysel3_vale == "bk_f0f"){
bor_b_color = "#f0f";
}
if(mysel3_vale == "bk_ff0"){
bor_b_color = "#ff0";
}
cim2_sty.style.backgroundColor = bor_b_color;
}
function my_selct3_5(){
alert('3_5no_seting');
if(myelement6[0].checked==false){
return;
}
}
function my_selct4() { //画像設定状況
if(document.getElementsByName('checkbox1')[0].checked == false){
return;
}
alert('4no_seting');
//document.getElementByid('lod_bs2').innerHTML = myel99;
alert('4no_seting2');
mysel4_vale = cim_sl4_sty.value;
myel99 = document.getElementById('lod_fs2').innerHTML;
if(my_img_furont == true){
document.getElementById('lod_is2').innerHTML= myel99;
}else{
document.getElementById('lod_bs2').innerHTML= 'is not';
}
if(my_img_back == true){
document.getElementById('lod_bs2').innerHTML= myel99;
}else{
document.getElementById('lod_is2').innerHTML= 'is not';
}
if(mysel4_vale == "front_only"){
if(myel99 == "ここ"){
alert('no_seting');
}else{
// document.getElementByid('lod_is2').innerHTML = myel99;
my_img_furont = true;
my_img_back = false;
myel100 = myel99;
cim_sl4_sty.style.color = "#000";
cim_sl4_sty.style.backgroundColor = "#fff";
}
}
if(mysel4_vale == "back_only"){
if(myel99 == "ここ"){
alert('no_seting');
}else{
alert(myel99)
my_img_back = true;
my_img_furont = false;
myel101 = myel99;//マスター
cim_sl4_sty.style.color = "#000";
cim_sl4_sty.style.backgroundColor = "#fff";
}
}
if(mysel4_vale == "image_none"){
alert('chnge this box color.')
my_img_furont = false;
my_img_back = false;
document.getElementById('lod_is2').innerHTML = 'ここ';
document.getElementById('lod_bs2').innerHTML = 'ここ';
// document.getElementByid('lod_is2').innerHTML = 'ここ';
// document.getElementByid('lod_bs2').innerHTML = 'ここ';
myel100 = "ここ";
myel101 = "ここ";
cim_sl4_sty.style.color = "#000";
cim_sl4_sty.style.backgroundColor = "#fff";
}
if(mysel4_vale == "front_back"){
if(myel100 == "ここ" || myel101 == "ここ"){
alert('no_seting フロントとバックの両方に画像がありません。');
}else{
my_img_furont = true;
my_img_back = true;
cim_sl4_sty.style.color = "#000";
cim_sl4_sty.style.backgroundColor = "#0f0";
}
}
}
function my_selct5() { //透明度設定状況
alert('5no_seting');
if(myelement6[0].checked==false){
return;
}
mysel5_vale = cim_sl5_sty.value;
if(mysel5_vale == "omax"){
bor_s_op_opacity = 1.0;
}
if(mysel5_vale == "o75"){
bor_s_op_opacity = 0.75;
}
if(mysel5_vale == "o50"){
bor_s_op_opacity = 0.5;
}
if(mysel5_vale == "o25"){
bor_s_op_opacity = 0.25;
}
cim2_sty.style.opacity = bor_s_op_opacity;
}
function my_selct6() { //player読込選択
alert('6no_seting');
}
function my_selct7() { //playercontrol
alert('7no_seting');
}
function my_selct8() { //player読込選択 7_5
alert('8no_seting');
}
/* pop_up 3 eria */
/* select はマウスイベント https://qiita.com/oizumi-yuta/items/52d97fb96800bc4a0ff1 */
const in_img_div1 = '<select name="mod0_pat" id="mod0_pat">\n<option value="none" selected>none</option>\n<option value="class">class</option>\n<option value="style">style</option></select><div id="my3_pop_ste1" style="display: inline;"></div>';
const in_vdo_div2 = '<select name="mod1_pat" id="mod1_pat">\n<option value="vid_1" selected>vid_1</option>\n<option value="vid_2">vid_2</option>\n<option value="vid_3">vid_3</option>\n</select><div id="my3_pop_ste2" style="display: inline;"></div>\n<select name="mod1_act" id="mod1_act">\n<option value="stop_play" selected>stop_play</option>\n<option value="play">play</option>\n<option value="pause">pause</option>\n<option value="stop">stop</option>\n</select><div id="my3_pop_ste3" style="display: inline;"></div>\n<br><input type="file" id="selfile3_1" accept="imge/.mp4" onchange="mod_fail_1(value);" />\n<div id="errmessage3">ここ</div>';
const in_aud_div3 = '<select name="mod2_pat" id="mod2_pat">\n<option value="aud_1" selected>aud_1</option>\n<option value="aud_2">aud_2</option>\n<option value="aud_3">aud_3</option>\n</select><div id="my3_pop_ste4" style="display: inline;"></div>\n<select name="mod2_act" id="mod2_act">\n<option value="read_in" selected>read_in</option>\n<option value="play">play</option>\n<option value="pause">pause</option>\n<option value="stop">stop</option>\n</select><div id="my3_pop_ste5" style="display: inline;"></div>\n<br><input type="file" id="selfile3_2" accept="voise/.mp3, voise/.wav" onchange="mod_fail_2(value);" />\n<div id="errmessage4">ここ</div>';
const in_iort_div4 = 'tabl patan<select name="tabl1_pat" id="tabl1_pat">\n<option value="tabl1_1" selected>tabl_1</option>\n<option value="tabl1_2">tabl_2</option>\n<option value="tabl1_3">tabl_3</option>\n</select><div id="my3_pop_ste6" style="display: inline;"></div>';
const in_txt_div5 = '<select name="txt_pat" id="txt_pat">\n<option value="txt_1" selected>txt_1</option>\n<option value="txt_2">txt_2</option>\n<option value="txt_3">txt_3</option>\n</selecct><div id="my3_pop_ste7" style="display: inline;"></div>';
const in_mse_div6 = '<br>select plese.';
let to_value1 = "none";// pop_main1 imge
let to_value2 = "free";// pop_main2 imge
let to_value3 = "none";// pop div1 imge パーツ
let to_value4 = "vid_1"; // pop div2 video 取り込み
let to_value5 = "stop_play"; // pop div2 video アクション
let to_value6 = "aud_1"; // pop div3 audio 取り込み
let to_value7 = "read_in"; // pop div3 audio アクション
let to_value8 = "tabl1_1"; // pop div4 tabl class style 定型もジールもないの定型もジールこれから作るんやわ
let to_value9 = "txt_1"; // pop div5 text class style
let my_trget = 'mod0_pat';//pop_main1
let my_trget1 = 'mod1_pat';//pop div2 video
let my_trget2 = 'mod2_act';//pop div2 video
let my_trget3 = 'mod2_pat';//pop div3 audio
let my_trget4 = 'mod2_act';//pop div3 audio
let my_trget5 = 'tabl1_pat';//pop div4 tabl
let my_trget6 = 'txt_pat';//pop div5 text
const def_fop3_mp4 = "una00.mp4"; ; //ファイル名初期値mp4 imge/una00.mp4
const def_fop3_mp3 = "una_321.wav"; //ファイル名初期値mp3 voise/una_321.wav
let my_Rnafi_pop3_1 = def_fop3_mp4; //ファイル名初期値mp4
let my_Rnafi_pop3_2 = def_fop3_mp3; //ファイル名初期値mp3
const selectValue = document.getElementById('selectValue');
const my_ste = document.getElementById('my3_pop_ste0');
const pop3_delet = document.querySelector("#pop3_d");
const selectValue8 = document.getElementById('my3_pop_ste7');
let pop3_my_del = pop3_delet.style.value;//this_del表示は変わらないが、値は変わる
/* test 本番は全表示を消す */
//to_value1 = "all";
//pop3_dis_chnge(to_value1);
selectValue.innerHTML = to_value1+" "+to_value2;
const select = document.getElementById('model_sel');
select.addEventListener('change', (e) => {
selectValue.innerHTML = e.target.value + " "+to_value2;
to_value1 = e.target.value;
pop3_dis_chnge(to_value1);
my_ste.innerHTML = to_value1;
});
function pop3_dis_chnge(to_value1){
document.getElementById('my3_pop').value = my_Rnafil;
document.getElementById('mod_no').value = my_arr_no;
if(to_value1 == "imge"){
document.getElementById('mod_s').innerHTML = '画像を選択しました。'+to_value2+'<br>'+in_img_div1+in_mse_div6;
my_trget = 'mod0_pat';
chege_div_0();
alert('test imge ok');
}
if(to_value1 == "video"){
document.getElementById('mod_s').innerHTML = '動画を選択しました。'+to_value2+'<br>'+in_vdo_div2+in_mse_div6;
my_trget1 = 'mod1_pat';
chege_div_1();
my_trget2 = 'mod1_act';
chege_div_1_2();
alert('test video ok');
}
if(to_value1 == "audio"){
document.getElementById('mod_s').innerHTML = '音声を選択しました。'+to_value2+'<br>'+in_aud_div3+in_mse_div6;
my_trget3 = 'mod2_pat';
chege_div_2();
my_trget4 = 'mod2_act';
chege_div_2_2();
alert('test audio ok');
}
if(to_value1 == "img_tex"){
document.getElementById('mod_s').innerHTML = 'tablを選択しました。'+to_value2+'<br>'+in_iort_div4+in_mse_div6;
my_trget5 = 'tabl1_pat';
chege_div_3();
alert('test img_tex ok');
}
if(to_value1 == "txt_only"){
document.getElementById('mod_s').innerHTML = 'textを選択しました。'+to_value2+'<br>'+in_txt_div5+in_mse_div6;
my_trget6 = 'txt_pat';
chege_div_4();
alert('test txt ok');}
if(to_value1 == "all"){
document.getElementById('mod_s').innerHTML = '全てを選択しました。'+to_value2+'<br>'+in_img_div1+'<br>'+in_vdo_div2+in_aud_div3+in_iort_div4+'<br>'+in_txt_div5+in_mse_div6;
my_trget = 'mod0_pat';
chege_div_0();
my_trget1 = 'mod1_pat';
chege_div_1();
my_trget2 = 'mod1_act';
chege_div_1_2();
my_trget3 = 'mod2_pat';
chege_div_2();
my_trget4 = 'mod2_act';
chege_div_2_2();
my_trget5 = 'tabl1_pat';
chege_div_3();
my_trget6 = 'txt_pat';
chege_div_4();
alert('test all ok');
}
if(to_value1 == "none"){
document.getElementById('mod_s').innerHTML = '選択してください。'+in_mse_div6;
}
pop3_delet.style.value = "this_del";
pop3_delet.style.border = "3px solid #a00";
}
///pop3_dis_chnge(to_value1);stato
const select1 = document.getElementById('mo_size');
select1.addEventListener('change', (e) => {
selectValue.innerHTML = to_value1+" "+e.target.value;
to_value2 = e.target.value;
pop3_dis_chnge(to_value1);
my_ste.innerHTML = to_value2;
});
//pop3_dis_chnge(to_value1);patan 0;image
function chege_div_0() {
let select2 = document.getElementById(my_trget);
let selectValue2 = document.getElementById('my3_pop_ste1');
if (my_trget == 'mod0_pat'){
my_ste.innerHTML = to_value3;
selectValue2.innerHTML = to_value3;
}
if(select2){
select2.addEventListener('change', (e) => {
selectValue2.innerHTML = e.target.value;
to_value3 = e.target.value;
document.getElementById('my3_pop_ste0').innerHTML = to_value3;
my_ste.innerHTML = to_value3;
})
}else{
my_ste.innerHTML = "select2 is null";
}
// 処理をする
if(to_value3 == "none"){
document.getElementById('mod_t1').value = '';
document.getElementById('mod_t2').value = '';
}
}//patan 1;video
function chege_div_1() {
let select3 = document.getElementById(my_trget1);
let selectValue3 = document.getElementById('my3_pop_ste2');
if (my_trget1 == 'mod1_pat'){
my_ste.innerHTML = to_value4;
selectValue3.innerHTML = to_value4;
}
if(select3){
select3.addEventListener('change', (e) => {
selectValue3.innerHTML = e.target.value;
to_value4 = e.target.value;
document.getElementById('my3_pop_ste0').innerHTML = to_value4;
})
}else{
my_ste.innerHTML = "select3 is null";
}
}
function chege_div_1_2() {
let select4 = document.getElementById(my_trget2);
let selectValue4 = document.getElementById('my3_pop_ste3');
if (my_trget2 == 'mod1_act'){
my_ste.innerHTML = to_value5;
selectValue4.innerHTML = to_value5;
}
if(select4){
select4.addEventListener('change', (e) => {
selectValue4.innerHTML = e.target.value;
to_value5 = e.target.value;
document.getElementById('my3_pop_ste0').innerHTML = to_value5;
})
}else{
my_ste.innerHTML = "select4 is null";
}
}//patan 2;audio;
function chege_div_2() {
let select5 = document.getElementById(my_trget3);
let selectValue5 = document.getElementById('my3_pop_ste4');
if (my_trget3 == 'mod2_pat'){
my_ste.innerHTML = to_value6;
selectValue5.innerHTML = to_value6;
}
if(select5){
select5.addEventListener('change', (e) => {
selectValue5.innerHTML = e.target.value;
to_value6 = e.target.value;
document.getElementById('my3_pop_ste0').innerHTML = to_value6;
})
}else{
my_ste.innerHTML = "select5 is null";
}
}
function chege_div_2_2() {
let select6 = document.getElementById(my_trget4);
let selectValue6 = document.getElementById('my3_pop_ste5');
if (my_trget4 == 'mod2_act'){
my_ste.innerHTML = to_value7;
selectValue6.innerHTML = to_value7;
}
if(select6){
select6.addEventListener('change', (e) => {
selectValue6.innerHTML = e.target.value;
to_value7 = e.target.value;
document.getElementById('my3_pop_ste0').innerHTML = to_value7;
})
}else{
my_ste.innerHTML = "select6 is null";
}
}//patan 3;tabl
function chege_div_3() {
let select7 = document.getElementById('tabl1_pat');
let selectValue7 = document.getElementById('my3_pop_ste6');
if(my_trget5 == 'tabl1_pat'){
my_ste.innerHTML = to_value8;
selectValue7.innerHTML = to_value8;
}
if(select7){
select7.addEventListener('change', (e) => {
selectValue7.innerHTML = e.target.value;
to_value8 = e.target.value;
document.getElementById('my3_pop_ste0').innerHTML = to_value8;
})
}else{
my_ste.innerHTML = "select7 is null";
}
}//patan 4;text
var test_flag = 0;
var test_flag2 = "0";
function chege_div_4() {
test_flag +=1;
let select8 = document.getElementById('txt_pat');
if(my_trget6 == 'txt_pat'){
my_ste.innerHTML = to_value9;
selectValue8.innerHTML = to_value9; ///* koko error no display */
}
if(select8){
select8.addEventListener('change', (e) => {
selectValue8.innerHTML = e.target.value;
to_value9 = e.target.value;
document.getElementById('my3_pop_ste0').innerHTML = to_value9;
})
}else{
my_ste.innerHTML = "select8 is null";
}
}
// pop3 faile select1,2
function mod_fail_1(my_Rnafil_0){ //ファイル名を取得
my_Rnafi_pop3_1 = my_Rnafil_0;
document.getElementById('errmessage3').innerHTML = 'checkし'+my_Rnafi_pop3_1+'ました。';
//document.getElementById('my_01').value = '<img src="./imge/man1_1.png" width="200px" height="200px" alt="is not">';
//ファイルがない時はis not!! にする。拡張子が合わないのに次をするのはどうかと思う。
if(my_Rnafi_pop3_1.startsWith("C\:\\fakepath\\")){ //ファイル名の先頭がC:\fakepath\で始まるか
my_Rnafi_pop3_1 = my_Rnafi_pop3_1.replace(/C\:\\fakepath\\/gm, 'imge/');
// alert('ファイル名を変更しました');
}else{
my_Rnafi_pop3_1 = 'imge/'+def_fop3_mp4; //違っていたら借り入れしてみゆ。
return;
}
// if (my_Rnafi_pop3_1.startsWith("(\./)?imge/")){ //ファイル名の先頭がimge/で始まるか}
if(my_Rnafi_pop3_1.match(/.+\.(mp4)$/gm)){ //ファイル名の最後がmp4で終わるか 1文字以上の文字列の後に.があり、mp4のいずれかで終わる
// alert('ファイル一致しました');
document.getElementById('errmessage3').innerHTML = my_Rnafi_pop3_1;
}
}
function mod_fail_2(my_Rnafil_1){ //ファイル名を取得
my_Rnafi_pop3_2 = my_Rnafil_1;
document.getElementById('errmessage4').innerHTML = 'checkし'+my_Rnafi_pop3_2+'ました。';
//document.getElementById('my_01').value = '<img src="./imge/man1_1.png" width="200px" height="200px" alt="is not">';
//ファイルがない時はis not!! にする。拡張子が合わないのに次をするのはどうかと思う。
if(my_Rnafi_pop3_2.startsWith("C\:\\fakepath\\")){ //ファイル名の先頭がC:\fakepath\で始まるか
my_Rnafi_pop3_2 = my_Rnafi_pop3_2.replace(/C\:\\fakepath\\/gm, 'voise/');
alert('ファイル名を変更しました');
}else{
my_Rnafi_pop3_2 = 'voise'+def_fop3_mp3; //違っていたら借り入れしてみゆ。
return;
}
// if (my_Rnafi_pop3_2.startsWith("(\./)?voise/")){ //ファイル名の先頭がvoise/で始まるか}
if(my_Rnafi_pop3_2.match(/.+\.(mp3|wav)$/gm)){ //ファイル名の最後がmp3,wavで終わるか 1文字以上の文字列の後に.があり、mp3,wavのいずれかで終わる
alert('ファイル一致しました');
document.getElementById('errmessage4').innerHTML = my_Rnafi_pop3_2;
}
}
/// pop3 end 処理 work
/* */
function pop3_work() {
alert('test pop3_w');
if(to_value1 == "all" || to_value1 == "none"){
alert('it 1 selct please.');
// return;
}
//
document.getElementById('mod_s').innerHTML = 'textを選択しました。'+to_value2+'<br>'+in_txt_div5;
my_trget6 = 'txt_pat';
alert(test_flag+'"<-1,2->"'+test_flag2);
chege_div_4();
alert(test_flag);
alert(to_value9+'"<-to,tg6->"'+my_trget6);
if(document.getElementById('txt_pat')){alert('表示されてる');}else{alert('表示されてない');}
}
//
function pop3_del() {
pop3_my_del = pop3_delet.style.value;//なんか動いていたぞ
if(pop3_my_del == "del_ok"){
pop3_delet.style.value = "this_del";
pop3_delet.style.border = "3px solid #a00";
// ここで消す
alert('もう遅い、消します!');
}else{
pop3_delet.style.value = "del_ok";
pop3_delet.style.border = "6px solid #f00";
}
}
/* // 再生
audio.play();
*/
/* // 一時停止
audio.pause();
*/
function stp0() { // クリヤー０
my_n=0;
step_to();
}
function stp1() { //セットカウンター
my_n = document.getElementById('step').value;
if(my_n < 0 || my_n > readlin.length-1){
alert('範囲外です。');
return;
}
step_to();
}
function stp2() { // プロセスタイマーセット
var my_tim = document.getElementById('my_you_dis').value;
if(readlin.length == 0){
alert('データがありません。');
return;
}
var l_end = readlin.length-1;
if(readlin[l_end]==""){
alert('まったくからのラインです');
return;
}
var linein_arr_e = readlin[l_end].split("/*");
var nambring_e = linein_arr_e[0].replace(/\/\//g, "");
alert('my_tim='+my_tim+' nambring_e='+nambring_e);
if(my_tim =="00"){my_tim = -2;}
if(my_tim < -2 || my_tim > nambring_e){ //-2のセット以下は無い
alert('タイマーがありません。');
return;
}
my_n = 0;
while(readlin[my_n].startsWith('//00'||'//'+my_tim-1)){
my_n +=1;
if(my_n > readlin.length-1){
alert('最後です。');
return;
}
}
step_to();
}
function stp3() { // Play
}
let cont_pous = false;
function stp4() { // pause
cont_pous = true;
}
//
function step_up() {
// alert('test up');
if(my_n == readlin.length-1){
alert('最後です。');
return;
}else{
my_n +=1;
}
step_to();
}
function step_down() {
// alert('test down');
if(my_n == 0){
alert('最初です。');
return;
}else{
my_n -=1;
}
step_to();
}
function step_end() {
// alert('test end');
my_n = readlin.length-1;
step_to();
}
// mster ruutin
function step_to() {
document.getElementById('step').value = my_n;
// fomat (//no[0]/*name[1]/*id[2])(/*x[3]/*y[4]/*|w[5]/*h[6]/*)(script[7])(/*comment[8]*/);9要素
linein_arr_n = readlin[my_n].split("/*");
var nambring = linein_arr_n[0].replace(/\/\//g, "");
// console.log(nambring); // "This is a comment."
document.getElementById('my_tim_dis').value = nambring;
if(linein_arr_n.length == 10 || linein_arr_n == 9 || linein_arr_n.length == 7){
document.getElementById('my_you_dis').innerHTML ='要素数 '+ linein_arr_n.length;
}else{
document.getElementById('my_you_dis').innerHTML = '<font color="red"><b>'+'要素数 '+linein_arr_n.length+'</b></font>';
}
document.getElementById('in_work').value = '//'+nambring+'/*'+linein_arr_n[1]+'/*'+linein_arr_n[2];
document.getElementById('in_work2').value = '/*'+linein_arr_n[3]+'/*'+linein_arr_n[4]+'/*';
if(linein_arr_n.length >= 9){
if(linein_arr_n.length == 9){
document.getElementById('in_work2').value += linein_arr_n[5]+linein_arr_n[6];
}else{
if(linein_arr_n.length == 10){
document.getElementById('in_work2').value += linein_arr_n[5]+'/*'+linein_arr_n[6]+'/*'+linein_arr_n[7]+'/*';
yobi_arr = linein_arr_n[7].split("*");
}
} //後ろから二つ見ている
}
document.getElementById('in_value').value = linein_arr_n[linein_arr_n.length-2];
var comring = linein_arr_n[linein_arr_n.length-1].replace(/\*\//g, "");
document.getElementById('in_come').value = '/*'+comring+'*/';
// in_work + in_value + in_come = readlin[my_n]
}
function step_ok() { //セット上書き
alert('test ok');
let my_no_in = document.getElementById('step').value;
let in_wor1 = document.getElementById('in_work').value;
let in_wor2 = document.getElementById('in_work2').value;
let in_valu = document.getElementById('in_value').value;
let in_come = document.getElementById('in_come').value;
in_come = in_come.replace(/\/\*/g, "");
in_come = in_come.replace(/\*\//g, "");
in_come = "/*"+in_come+"*/";
readlin[my_no_in] = in_wor1 + in_wor2 + in_valu + in_come;
}
function step_del() { //削除
alert('test del');
let in_wor1 = document.getElementById('in_work').value;
let in_wor2 = document.getElementById('in_work2').value;
let in_valu = document.getElementById('in_value').value;
let in_come = document.getElementById('in_come').value;
let my_tim = document.getElementById('my_tim_dis').value;
if(in_wor1 =='//'+my_tim+'/*/*' && in_wor2 == '/*/*/*/*/*/*' && in_valu == '' && in_come == '/**/'){
my_n = document.getElementById('step').value;
if(my_n == readlin.length-1){
if(my_n == 0){
alert('最後の行です。');
return;
}else{
readlin.pop();
step_down()
}
return;
}else{
// alert('最後の行ではありません。');
var ii = 0;
for(var i = 0; i < readlin.length; i++){
if(ii >= my_n) {
var iii =ii+1;
readlin[ii] = readlin[iii];
}
ii +=1;
}
readlin.pop();
step_to();
return;
}
}else{
document.getElementById('in_work').value = '//'+my_tim+'/*/*';
document.getElementById('in_work2').value = '/*/*/*/*/*/*';
document.getElementById('in_value').value = '';
document.getElementById('in_come').value = '/**/';
}
}
let no_step = 0; //数字にしておく
function step_ins() { //挿入
alert('test ins');
no_step = document.getElementById('step').value;
my_tim = document.getElementById('my_tim_dis').value;
alert('1st '+readlin.length+' '+readlin[readlin.length-1]+' '+my_tim);
let tmp_my_n = readlin.length[readlin.length-1];
readlin.push(tmp_my_n);//最後の行をコピー
alert('2nd '+readlin.length+' '+readlin[readlin.length-1]+' '+my_tim);
for(var i = readlin.length-1; i > no_step; i--){
readlin[i] = readlin[i-1];
}
readlin[no_step] = '//'+my_tim+'/*/*/*/*/*/*/*/*/**/';
my_n = no_step;
step_to();
}
function step_add() { //追加
alert('test add');
var my_tim = document.getElementById('my_tim_dis').value;
var my_tim1 = 0;
if(my_tim != '00' && my_tim > -4 && isNaN(my_tim)==false){
my_tim1 = parseInt(my_tim);
my_tim1 +=1;
my_tim = String(my_tim1);
}else{
my_tim = '00';
document.getElementById('my_tim_dis').value=my_tim;
}
readlin.push('//'+my_tim+'/*/*/*/*/*/*/*/*/**/');
my_n = readlin.length-1;
step_to();
}
let rook_bol = false;
function rook_c() {
alert('rook1');
if(rook_bol == false){
rook_bol = true;
}else{
rook_bol = false;
}
rook_c_go(rook_bol);
}
function rook_c_go(rook_bol) {
alert('rook2'+rook_bol);
if (rook_bol == true){
alert('rook3');
box_1.style.position = 'absolute';
box_1_2.style.position = 'absolute';
box_2.style.position = 'absolute';
box_2_2.style.position = 'absolute';
box_3.style.position = 'absolute';
box_3_2.style.position = 'absolute';
box_4.style.position = 'absolute';
box_4_1.style.position = 'absolute';
box_4_2.style.position = 'absolute';
box_5.style.position = 'absolute';
}else{
box_1.style.position = 'fixed';
box_1_2.style.position = 'fixed';
box_2.style.position = 'fixed';
box_2_2.style.position = 'fixed';
box_3.style.position = 'fixed';
box_3_2.style.position = 'fixed';
box_4.style.position = 'fixed';
box_4_1.style.position = 'fixed';
box_4_2.style.position = 'fixed';
box_5.style.position = 'fixed';
}
}
// ここまでで、配列に入れることができる。テキスターに入れることができる。後は他の書き込みの処理をするだけ。pythonでの処理をするだけ。
// 2021/04/16
/* end pop_up 2 */
function Pause() {
alert('test Pause');
clearInterval(timerId);
clearInterval(timerId_1);
clearInterval(timerId_2);
return;//出来てから
var video1 = document.getElementById('my1_1');//video1再生areaにおいてないplayしていない。
video1.pause();
var audio1 = document.getElementById('audio1');
audio1.pause();
var audio2 = document.getElementById('audio2');
audio2.pause();
var audio3 = document.getElementById('audio3');
audio3.pause();
}
let t_2_up = false;
function t_2_up_time() {
t_2_up = true;
clearInterval(timerId_2);
}
function my_demo_play() {
alert('test play');
t_2_up = false;
clearInterval(timerId_1);
timerId_1 = setInterval('my_play_on()', intrtim_1);
}
//
function step_editer() {
document.getElementsByName('checkbox1')[0].checked = true;//pop_up1
myelement30[0].checked = true;//pop_up3
}
// 2024/04/23
function my_play_on() {
alert('test play');
if(t_2_up == false){
alert('test play 2');
clearInterval(timerId_2);
timerId_2 = setInterval('t_2_up_time()', intrtim_2);
my_n = 0;
if (element_check() == true){return;}
if ( play_00() == true){return;}
my_n +=1; // time -2が最低StartTime
// これで//００が終わっている
}else{return;}//3secか、処理が終わるまで待つ
if (my_n > readlin.length-1){
alert('最後です。');
clearInterval(timerId_1);
return;
}
if(element_check() == true){return;}
alert('まだできていないわ my_play_on()');
my_n +=1;
if(element_check() == true){
return;
}
return;
//////////////////////////////////////////
if (my_n == no_in && mycount == no_in && cont_pous == false) {
while(my_n == no_in){
if (line_in_arr[1].startsWith("imge")){
}
if (line_in_arr[1].startsWith("oudi")){
}
if (line_in_arr[1].startsWith("vido")){
}
if (line_in_arr[1].startsWith("text")){
}
// 未使用設定になる
my_n +=1;
if(element_check() == true){
return;
}
}
}
}
function element_check() {
var line_in_arr = readlin[my_n].split("/*");
var no_in = line_in_arr[0].replace(/\/\//g, "");
if(!(line_in_arr.length == 10 || line_in_arr == 9 || line_in_arr.length == 7)){
//パネルにエラー表示して止める
alert('要素数が違います。');
clearInterval(timerId_1);//止める
return true;
}
}
function init_stato(){
timerId = setInterval('mytfunc()', 1000);
timerId_1 = setInterval('my_play_on()', 1000);
timerId_2 = setInterval('t_2_up_time()', 1000);
clearInterval(timerId);
clearInterval(timerId_1);
clearInterval(timerId_2); //再設定して0にしている。
my_n = 0;
mycount = 0;
tim_end = false;
cont_pous = false;
t_2_up = false;
rook_bol = false;
no_step = 0;
no_in = 0;
box_my1.style.width = "32px";
box_my1.style.height = "32px";
document.querySelector("#my1").innerHTML = '<table style="background-color: #8ff;"><tr><td width="640" height="360">\n</td></tr></table>';
box_my1_2.style.width = "64px";
box_my1_2.style.height = "64px";
document.querySelector("#my1_2").innerHTML = '<table border="1" class="im2" style="width: 400px;height: 300px;opacity: 1;"><tr><td>\n<br><br></td></tr></table></div></td></tr></table>';//background="imge/R (1).jpg"
box_my2.style.width = "60px";
box_my2.style.height = "270px";
document.querySelector("#my2").innerHTML = '<img src="imge/gall.png" width="128" height="128">';
box_my2_2.style.width = "1px";
box_my2_2.style.height = "1px";
document.querySelector("#my2_2").innerHTML = '';
box_my3.style.width = "550px";
box_my3.style.height = "270px";
document.querySelector("#my3").innerHTML = '<img src="imge/man1.png" width="128" height="128">';
box_my3_2.style.width = "1px";
box_my3_2.style.height = "1px";
document.querySelector("#my3_2").innerHTML = '';
box_my4.style.width = "168px";
box_my4.style.height = "250px";
document.querySelector("#my4").innerHTML = '<table background="imge/frame00443_mini.png" style="width: 400px;height: 150px;opacity: 0.5;"><tr><td>\n<br><br></td></tr></table></div></td></tr></table>';
box_my4_1.style.width = "170px";
box_my4_1.style.height = "300px";
document.querySelector("#my4_1").innerHTML = ' <mark><font size="6"><b>テキスト</b>を<font color="#f00"><b>変</b>え</font><font size="5">られる。</font></font></mark>';
box_my4_2.style.width = "375px";
box_my4_2.style.height = "220px";
document.querySelector("#my4_2").innerHTML = 'やまぐちさん';
box_my5.style.width = "32px";
box_my5.style.height = "32px";
wrk_5_1.innerHTML = '<table border="0"><tr><td width="330"></td><td><img src="imge/man1_1.png" width="100" height="128"></td></tr><tr><td height="128"></td><td></td></tr></table>';
// ここまでで、初期化が終わる。
// if (element_check() == true){return;}
// if ( play_00() == true){return;}
}
function play_00() {
alert('まだできていないわ play_00()');
my_n +=1;
if(element_check() == true){
return true;
}
return;
/////////////////////////////
if (my_n == no_in) {
while(my_n == no_in){
if (line_in_arr[1].startsWith("imge")){
}
if (line_in_arr[1].startsWith("oudi")){
}
if (line_in_arr[1].startsWith("vido")){
}
if (line_in_arr[1].startsWith("text")){
}
// 未使用設定になる
my_n +=1;
if(element_check() == true){
return true;
}
}
}
}
function Stato1() {
alert('test Stato1');
if (demo_on == true) {
alert('test Stato1_1');
clearInterval(timerId);
my_demo_play();
return;
}
if(v_url !=""){
document.querySelector('#my1').innerHTML = '<video controls src="'+v_url+'" stop-play width="640"></video>';// muted
}
if(a1_url !=""){
document.querySelector('#audio1').innerHTML = '1<br><audio src="'+a1_url+'" controls stop-play></audio>';
}
if(a1_url !=""){
document.querySelector('#audio2').innerHTML = '2<br><audio src="'+a2_url+'" controls stop-play></audio>';
}
if(a1_url !=""){
document.querySelector('#audio3').innerHTML = '3<br><audio src="'+a3_url+'" controls stop-play></audio>';
}
mycount = -3;
tim_end = false;
if (video_voise_on) {
document.querySelector('#my1').innerHTML = '<video src="imge/una00.mp4" width="640" autoplay></video>';
}else {
document.querySelector('#my1').innerHTML = '<video src="imge/una00.mp4" width="640" muted autoplay></video>';
}
if (audio_voise_on) {
document.querySelector('#audio1').innerHTML = 'una_kiruna<br><audio controls src="voise/una_321.wav" autoplay></audio>';
} else {
document.querySelector('#audio1').innerHTML = 'una_kiruna<br><audio controls src="voise/una_321.wav" muted autoplay></audio>';
}
timerId = setInterval('mytfunc()', intrtim);
}
let bol_mymy = "false";
function mytfunc() {
// 訳の分らん割り込みが発生している
mycount += 1;
// alert('リード'+String(mycount));
if (mycount == 0) {
// document.querySelector('#my1').innerHTML = '<video controls src="imge/una00.mp4" width="640" autoplay muted></video>';// muted
// document.querySelector('#audio0').innerHTML = `${puleymiu} ${mykyoku}<br><audio controls src="voise/myout2_0.wav" type="audio/wev" autoplay></audio>`;//myout2_0 // una_kiruna
a2_url = "voise/myout2_0.wav";
document.querySelector('#audio2').innerHTML = puleymiu+" "+mykyoku+'<br><audio controls src="voise/myout2_0.wav" '+a_muted+'autoplay></audio>';
}
if(mycount==4){
document.querySelector('#img_viw1').innerHTML = '<img src="imge/man2_1.png" width="100" height="128">';
}
if(mycount==6){
document.querySelector('#my3').innerHTML = '<img src="imge/man2_1.png" width="100" height="128">';
}
if (mycount == 8) {
// alert('5==5');終わった後なんで出てくるんや。
document.querySelector('#my4_1').innerHTML = ' <font size="7" color="#f0f">あ</font><font size="1">っ</font><mark class="mk2"><font size="3">かわった</font></mark> ';
}
if(mycount == 9){
document.querySelector('#video2').innerHTML = '<video controls src="imge/rec_2023_07_30_1.mp4" width="256"></video>';// muted
}
if (mycount == 12) { //プリロード\\\\ stop-play v_url = "imge/una00.mp4";
document.querySelector('#my1').innerHTML = '<video controls src="'+v_url+'" stop-play width="640"></video>';// muted
v_url = "imge/rec_2023_07_30_1.mp4";
document.querySelector('#my1').innerHTML = '<video controls src="imge/rec_2023_07_30_1.mp4" width="640"' + v_muted + 'autoplay></video>';// muted
}
if (mycount == 20) {
document.querySelector('#audio1').innerHTML = puleymiu + " " + mykyoku +'<br><audio controls src="voise/una_kiruna.wav" '+a_muted+'autoplay></audio>';
}
if (mycount == 22) {
//
document.querySelector('#my4_1').innerHTML = ' 男を、<br>いつ変えた? ';
}
if (mycount == 23) {
//
box_my4_2.style.width = "400px";
box_my4_2.style.height = "320px";
document.querySelector('#my4_2').innerHTML = ' 鈴木と申します。 ';
}
if (mycount == 61) { //タイムアウト
tim_end = true;
}
if(mycount >= 0){
let sec = mycount;
let hour = Math.floor(sec / 3600);
let min = Math.floor(sec % 3600 / 60);
const min00 = `0${min}`.slice(-2);
let rem = sec % 60;
const rem00 = `0${rem}`.slice(-2);
document.querySelector('#my5d6').innerHTML = " " + mycount.toString().padStart(4, '0')+'<font size="2"><br> '+`${hour}:${min00}:${rem00}`+'</font>';//("00000" + num1).slice(-5);`${hour}時間${min}分${rem}秒`
}else{
document.querySelector('#my5d6').innerHTML = " " + mycount.toString().padStart(4, '0')+'<font size="2"><br> 0:00:00</font>';
}
if (mycount > maxtime) {
tim_end = true;
}
if (tim_end==true) {
bol_mymy = "true";
} else {
bol_mymy = "false";
}
// alert(bol_mymy);
if (tim_end==true) {
mycount = 0;
clearInterval(timerId);
// alert('終わり' + String(mycount));
}
// clearInterval(timerId);
}
function Relode() {
location.reload();
}
function Re_Stato() {
// alert('fast');
if (demo_on == true) {
alert('test Stato1_1');
clearInterval(timerId);
my_demo_play();
return;
// 仮入れ
}
if(v_url !=""){
document.querySelector('#my1').innerHTML = '<video controls src="'+v_url+'" stop-play width="640"></video>';// muted
}
if(a1_url !=""){
document.querySelector('#audio1').innerHTML = '1<br><audio src="'+a1_url+'" controls stop-play></audio>';
}
if(a1_url !=""){
document.querySelector('#audio2').innerHTML = '2<br><audio src="'+a2_url+'" controls stop-play></audio>';
}
if(a1_url !=""){
document.querySelector('#audio3').innerHTML = '3<br><audio src="'+a3_url+'" controls stop-play></audio>';
}
mystrto(); //これで何で動くのかが理解出来ていない。
Stato1();
}
const my_texter = document.querySelector('#mytextr');
let rede_texter = my_texter.value;
function button_fail_1(){
alert('失敗');//ファイル名にマークを付けるかテキストにマークを付けるかまたは、両方。
rede_texter = my_texter.value;
alert(rede_texter);
if (rede_texter == "") { return; }
document.querySelector('#mytextr2').value = rede_texter;
// text_read();
}
function button_fail_2(){
alert('失敗2');//evt.target.files[0].name
rede_texter = my_texter.value;
alert(rede_texter);
if (rede_texter == "") { return; }
document.querySelector('#mytextr3').value = rede_texter;
// text_read();
}
// text_read(); //一回だけ実行してやれば常駐して消すまで有効に成る 毎回実行すると得られない。
//let this_file = "";
function text_read() {
alert('テキストリード');
var obj1 = document.getElementById("selfile");
obj1.addEventListener("change", function(evt) { //"change"
var file = evt.target.files;
var reader = new FileReader();
reader.readAsText(file[0]);
reader.onload = function(ev) {
document.myfile.texta.value = reader.result;
}
//エラー処理
reader.onerror = function(e) {
//エラーメッセージを配列に格納する
var errmes = new Array(
"",
"ファイルが見つかりません！",
"セキュリティエラーが検出されました！",
"ファイルの読込が中断されました！",
"ファイルの読み込み権限がありません！",
"ファイルサイズが大き過ぎます！"
);
//エラーをinnerHTMLで書き出す
var obj2 = document.getElementById("errmessage");
obj2.innerHTML = errmes[reader.error];// obj2.innerHTML = errmes[reader.error.code];
}
}, false);
}
// form end
function read() {
alert("my_mese");
let redotext = document.querySelector('#mytextr').value;
alert(redotext);
if (redotext == "") { return; }
// document.querySelector('#mfl').innerHTML = redotext.replace(/\n/g, '<br>');
// let readlin = []; let readlin 先頭へ持って行った
readlin[0] = '';
/*
let ii = 0;
for (let i = 0; i < redotext.length; i++) {
if (!redotext[i].includes('\n')) {
readlin[ii] += redotext[i];
} else {
ii++;
readlin[ii] = '';
}
}
画像ファイルも\n=><br>に変換するとエラーになるので、\nを残す。
*/
// redotext = redotext.replace(/<br>|<br>/g, "\n"); text<br>使うtextr内は<br>は"<br>"として出る改行は"\n"とし改行は\nである。
readlin = redotext.split('\n');
//document.querySelector('#mfl').innerHTML = readlin;
//let element_txt = document.getElementById('mytextr2');
element_txt.value = readlin.join('\n');
}
function read2() {
alert("my_mese3");
let redotext = document.querySelector('#mytextr3').value;
if (redotext == "") { return; }
//read_txt[0] = '';
var read_txt = redotext.split('\n');
let element_txt2 = document.getElementById('my_in_a_text');
element_txt2.innerHTML = read_txt[0];
if (read_txt.length > 1) {
element_txt2.innerHTML += "<br>"+read_txt[1];
}
if (read_txt.length > 2) {
element_txt2.innerHTML += "<br>"+read_txt[2];
}
if (read_txt.length > 3) {
element_txt2.innerHTML += "<br>"+read_txt[3];
}
if (read_txt.length > 4) {
element_txt2.innerHTML += "<br>"+read_txt[4];
}
if (read_txt.length > 5) {
element_txt2.innerHTML += "<br>"+read_txt[5];
}
}
2ふ