kirilllive

README.md

@@ -1,4 +1,4 @@
-![Tuesday js visual novels engine](https://img.itch.zone/aW1nLzU1MDg0NTkuanBn/original/mYr%2BBb.jpg)
+![Tuesday js visual novels engine](https://repository-images.githubusercontent.com/233020914/1b3240ff-9db8-4163-92ba-f86e81d10967)
 
 # Tuesday JS web visual novel engine 
 is a simple web-based, free and open-source visual novel editor that can be used in a web browser. It is written in JavaScript without using any third party libraries and thus does not require additional software installation. The engine uses standard HTML5 document elements such as div and img. This allows the use of any media format supported by browsers including vector graphics svg, gif animations and css styles.

example/example_unlock_input.json

@@ -0,0 +1,142 @@
+{
+ "parameters": {
+ "text_panel": {
+ "size": [
+ "95%",
+ "25%"
+ ],
+ "position": [],
+ "color": "#efefff",
+ "color_text": "#000",
+ "indent_text": "8px",
+ "indent_bottom": "32px",
+ "size_text": "20px",
+ "style": "border-radius:16px;",
+ "dialog_speed": "10",
+ "art": {
+ "en": ""
+ }
+ },
+ "name_panel": {
+ "size": [
+ "222px",
+ "48px"
+ ],
+ "position": [
+ "0",
+ "0",
+ "-48px",
+ "0"
+ ],
+ "indent_text": "8px",
+ "size_text": "18px",
+ "color_text": "#000",
+ "align": [
+ "flex-start",
+ "center"
+ ],
+ "art": {
+ "en": ""
+ }
+ },
+ "title": {
+ "en": "new novel"
+ },
+ "launch_story": "block_1",
+ "key": {
+ "next": "",
+ "back": "",
+ "save": "",
+ "load": "",
+ "full_screen": "",
+ "launch_story": "",
+ "load_autosave": ""
+ },
+ "languares": [
+ "en"
+ ],
+ "buttons": [
+ {
+ "name": "tue_back",
+ "style": "border-radius:26px;",
+ "position": [
+ "2.5%",
+ "0",
+ "0",
+ "32px"
+ ],
+ "size": [
+ "38px",
+ "38px"
+ ],
+ "color": "",
+ "color_text": "#000",
+ "size_text": "28px",
+ "text": "<",
+ "art": {
+ "en": ""
+ },
+ "sound": {
+ "en": ""
+ },
+ "hotspot": [
+ "0%",
+ "0%"
+ ]
+ },
+ {
+ "name": "tue_next",
+ "style": "border-radius:26px;",
+ "position": [
+ "0",
+ "2.5%",
+ "0",
+ "32px"
+ ],
+ "size": [
+ "38px",
+ "38px"
+ ],
+ "color": "",
+ "color_text": "#000",
+ "size_text": "28px",
+ "text": ">",
+ "art": {
+ "en": ""
+ },
+ "sound": {
+ "en": ""
+ },
+ "hotspot": [
+ "0%",
+ "0%"
+ ]
+ }
+ ],
+ "style_file": "",
+ "autosave": false,
+ "font": "Arial",
+ "font_size": "18px",
+ "plugins": [],
+ "variables": {},
+ "characters": {}
+ },
+ "blocks": {
+ "block_1": [
+ "86px",
+ "96px",
+ "block",
+ false
+ ]
+ },
+ "block_1": [
+ {
+ "dialogs": [
+ {
+ "html": "<p style='color:#000;'>hello</p>\n<input type='text' value='hello'>",
+ "js": "window.onmousedown=window.onselectstart(()=>{return true;});"
+ }
+ ]
+ }
+ ]
+}

index.html

@@ -5,7 +5,7 @@
 <link rel="shortcut icon" href="icon.jpg" type="image/x-icon">
 <meta content="#5f5196" name="theme-color" charset="UTF-8">
 <meta name="description" content="simple web-based free and open source visual novel editor, it can be used in web browser. The engine uses standard HTML elements DOM this allows the use any media format supported by browsers, including vector graphics svg, gif animations and css styles.">
-<meta name="keywords" content="Editor, Maker, Interactive Fiction, Visual Novel, Fairy Tale, Kinetic Novel, Open Source,">
+<meta name="keywords" content="วิชวลโนเวลเอ็นจิ้น,웹 비주얼 노벨 노블 엔진,Interactive Fiction,Visual Novel,Fairy Tale,Kinetic Novel,Open Source,视觉小说引擎,ビジュアルノベル・エンジン,движок визуальных новелл,motor de novelas visuales,moteur de roman visuel">
 <meta name='viewport' content='width=device-width, initial-scale=1'/>
 <meta name="author" content="Kirill Live">
 <script async src="https://www.googletagmanager.com/gtag/js?id=UA-166622340-2"></script>
@@ -742,7 +742,11 @@
  ["screen_2", "튜즈데이JS(TuesdayJS)는 스토리를 다른 언어로 현지화하기 위한 광범위한 적응 기능을 제공한다.<br>텍스트 및 그래픽을 포함하여 프로젝트의 거의 모든 요소에 대해 현지화된 번역을 설정할 수 있다. 미리보기 기능을 사용하면 선택한 언어로 프로젝트를 실행할 수 있고, 다른 편집기에서 현지화를 편집하거나 추가하기 위해 모든 언어 텍스트를 csv 파일로 추출할 수 있다."],
  ["title_6", "씬 에디터"],
  ["screen_6", "씬 에디터(장면 편집기)는 모든 요소를 ​​제자리에 정렬할 수 있다. 다른 화면에서는 장면이 어떻게 변하는지 보여주며, 씬 레이아웃에서 백분율 픽셀 또는 센티미터 단위의 표준 HTML 단위를 사용하여 씬을 다른 화면에 더 잘 적응하도록 할 수 있다."],
- ]
+ ],
+ "th": [
+ ["title", "Tuesday JS วิชวลโนเวลเอ็นจิ้น"],
+ ["description", "Tuesday JS เป็นโปรแกรมแก้ไขแบบ WYSIWYG ที่ฟรีและใช้งานง่าย เพื่อสร้างเรื่องราวเชิงโต้ตอบและนิยายภาพซึ่งเน้นที่ HTML5 โดยใช้</p><br><p>The editor is designed to create interactive fiction, graphic or kinetic novels without knowledge of programming languages. It uses a drag and drop interface for scene editing and to make interfaces. The story script is displayed as a flowchart node with all plot elements and branches. This makes it easier to navigate and helps you create a great story with many plot options.</p><br><p>The editor is available as a standalone application for Android devices and desktops. All versions are fully compatible with each other and have the same interface.</p>"]
+ ],
 }
 function getLang(){
  if (window.location.hash.length!=0 && translation[window.location.hash.slice(1,3)]){

tuesday.js

@@ -76,10 +76,10 @@ function name_block_update(){
  if(tue_name_block.style.width=story_json.parameters.name_panel.size[0]!=0){tue_name_block.style.width=story_json.parameters.name_panel.size[0];}
  tue_name_block.style.height=story_json.parameters.name_panel.size[1];
  tue_name_block.style.lineHeight=story_json.parameters.name_panel.size[1];tue_name_block.style.top="0px"
- if(story_json.parameters.name_panel.position[0]!=0){tue_name_block.style.left=story_json.parameters.name_panel.position[0];}
- if(story_json.parameters.name_panel.position[1]!=0){tue_name_block.style.right=story_json.parameters.name_panel.position[1];}
- if(story_json.parameters.name_panel.position[2]!=0){tue_name_block.style.top=story_json.parameters.name_panel.position[2];}
- if(story_json.parameters.name_panel.position[3]!=0){tue_name_block.style.bottom=story_json.parameters.name_panel.position[3];}
+ tue_name_block.style.left=(story_json.parameters.name_panel.position[0]==""||story_json.parameters.name_panel.position[0]=="0")?null:story_json.parameters.name_panel.position[0];
+ tue_name_block.style.right=(story_json.parameters.name_panel.position[1]==""||story_json.parameters.name_panel.position[1]=="0")?null:story_json.parameters.name_panel.position[1];
+ tue_name_block.style.top=(story_json.parameters.name_panel.position[2]==""||story_json.parameters.name_panel.position[2]=="0")?null:story_json.parameters.name_panel.position[2];
+ tue_name_block.style.bottom=(story_json.parameters.name_panel.position[3]==""||story_json.parameters.name_panel.position[3]=="0")?null:story_json.parameters.name_panel.position[3];
  tue_name_block.style.zIndex=1001;
 } function base_creation(){
  get_lang();
@@ -110,15 +110,22 @@ function name_block_update(){
  tue_text_block.style.height=story_json.parameters.text_panel.size[1];
  }
  if(story_json.parameters.text_panel.position){
- tue_text_block.style.left=(story_json.parameters.text_panel.position[0] != 0)?story_json.parameters.text_panel.position[0]:"0";
- tue_text_block.style.right=(story_json.parameters.text_panel.position[1] != 0)?story_json.parameters.text_panel.position[1]:"0";
- if(story_json.parameters.text_panel.position[2] != 0){tue_text_block.style.top=story_json.parameters.text_panel.position[2];}
- if(story_json.parameters.text_panel.position[3] != 0){tue_text_block.style.bottom=story_json.parameters.text_panel.position[3];}
+ if((!story_json.parameters.text_panel.position[0]||story_json.parameters.text_panel.position[0]=="0")&&(!story_json.parameters.text_panel.position[1]||story_json.parameters.text_panel.position[1]=="0")){
+ tue_text_block.style.marginLeft="auto";
+ tue_text_block.style.marginRight="auto";
+ tue_text_block.style.left=0;
+ tue_text_block.style.right=0;
+ }else{
+ tue_text_block.style.left=(story_json.parameters.text_panel.position[0]!="0")?story_json.parameters.text_panel.position[0]:null;
+ tue_text_block.style.right=(story_json.parameters.text_panel.position[1]!="0")?story_json.parameters.text_panel.position[1]:null;
+ tue_text_block.style.margin=null;
+ }
+ tue_text_block.style.top=(story_json.parameters.text_panel.position[2]!="0")?story_json.parameters.text_panel.position[2]:null;
  }else{
- tue_text_block.style.left="0";
- tue_text_block.style.right="0";
+ tue_text_block.style.left=0;
+ tue_text_block.style.right=0;
  }
- if(story_json.parameters.text_panel.indent_bottom){tue_text_block.style.bottom=story_json.parameters.text_panel.indent_bottom;}
+ tue_text_block.style.bottom=(story_json.parameters.text_panel.indent_bottom!="0")?story_json.parameters.text_panel.indent_bottom:null;
  tue_text_block.style.zIndex=1000;
  tue_text_block.style.borderSpacing=0;
  tue_text_view=document.getElementById("tue_text_view");
@@ -159,7 +166,7 @@ function name_block_update(){
  function bg_art(arr_u,tue_id){
  tue_id=document.getElementById(tue_id);
  tue_id.style.backgroundRepeat="no-repeat";
- tue_id.style.backgroundPosition="center";
+ tue_id.style.backgroundPosition=((arr_u.art_align)?arr_u.art_align[0]+" "+arr_u.art_align[1]:"center");
  if(arr_u.art){
  var a=art_data(arr_u.art)
  if(a.length>0){tue_id.style.backgroundImage="url('"+art_data(arr_u.art)+"')";}
@@ -341,7 +348,7 @@ function name_block_update(){
  if(arr_dialog.name.className){ tue_name_block.className=arr_dialog.name.className}
  } else if(story_json.parameters.characters){
  if(story_json.parameters.characters[arr_dialog.name]){
- if(story_json.parameters.characters[arr_dialog.name].style){tue_name_block.style=story_json.parameters.characters[arr_dialog.name].style;name_block_update();} else if(story_json.parameters.name_panel.style){tue_name_block.style=story_json.parameters.name_panel.style;name_block_update();}
+ if(story_json.parameters.characters[arr_dialog.name].style){tue_name_block.style=story_json.parameters.characters[arr_dialog.name].style;name_block_update();}
  tue_name_block.innerHTML=story_json.parameters.characters[arr_dialog.name][languare]
  tue_name_block.style.backgroundColor=story_json.parameters.characters[arr_dialog.name].color;
  tue_name_block.style.color=story_json.parameters.characters[arr_dialog.name].color_text;