ShikemokuMK/tyranoscript

novel game engine for Browser, iOS, Android , etc

gotodeploy

@gotodeploy

:+1:

@bellflower2015 GitHub Pagesが一番わかりやすいんじゃないかと。Hexoはマルチバイト強そうなんで、試してみる価値はありそうです

Kikyou Akino

@bellflower2015

@geduld とりあえず今英訳されてるものってタグリファレンスくらいですよね・・・

gotodeploy

@gotodeploy

しかもメンテされてるか怪しい気が

Kikyou Akino

@bellflower2015

^^;

gotodeploy

@gotodeploy

これですよね
http://www.evanburchard.com/tyranoscript/

Kikyou Akino

@bellflower2015

いや、これですよ http://tyrano.jp/home/tag_en/

gotodeploy

@gotodeploy

おっと

メンテナさんがいらっしゃるんですよねきっと

Kikyou Akino

@bellflower2015

"Transrated by jsarcade" とありますね

gotodeploy

@gotodeploy

これって @EvanBurchard 氏では

Kikyou Akino

@bellflower2015

あ、これもEvan氏っぽいな・・・

ですね

Valery

@ValeryVS

Hi, thanks for translate and replies.
回答と翻訳をありがとう。

There was a little fix 2015-06-23, I forgot to update index.html file.
ShikemokuMK/tyranoscript#32

I'm also think about few more features.

Text animation perfomance
Adding elements to Html DOM Object is performance-costly operation.
Text animation can be maked with css animation, like I did with backgrounds. This will increase perfomance, especially for mobiles.
Something like this https://jschr.github.io/textillate/ (settings: FadeIn sequence, FadeOut sync).

User settings
I improve some code of audio tags. There is "settings" system variable witch has JS object with values for audio layers volume. Like this:
sf.settings.volume = {
main: 100,
bgm: 100,
se: 100,
ambiance: 100,
voice: 100
}
And make a popup (like menu) with html "sliders" where user can adjust volume.
I will make pull request for this in next weeks.

Aslo, I think, hotkeys and touch gestures can be set with such variables and page. This is an idea for future updates.

Question: menu, save, load, settings and other
In tyranosctipt code is pages for menu, save and load screens hard-coded in JavaScript. In some games such menus made as separate scenario scenes.
Witch way is better?

provide some way to game developers, to edit and add menus in JS
make such pages with scenarios and use [return] tag
make such pages with scenarios and use savesnap loadsnap

gotodeploy

@gotodeploy

@ValeryVS Спаси́бо!
またもや意訳ですが、誤訳等ご指摘あればぜひ

テキストアニメーションのパフォーマンス
HTML DOMオブジェクトに要素追加するのは凄いコストかかる操作。私がbackgroundsでやってるようにcss animationだったらパフォーマンスが良くなるよ、特にモバイルはね。こんな感じ https://jschr.github.io/textillate/ (settings: FadeIn sequence, FadeOut sync)

ユーザ設定
いくつかaudioタグを改善して、こんなjsオブジェクトのボリューム設定値をつくったよ。こんなかんじ:

sf.settings.volume = {
main: 100,
bgm: 100,
se: 100,
ambiance: 100,
voice: 100
}

で、ポップアップ(メニューみたいな感じ)にhtmlのスライダーがあって、ユーザが自由に調整できるようにしてみた。来週プルリク送るよ。将来的にはホットキーとかタッチジェスチャーで調整できるようになるといいよね。

質問: メニュー, セーブ, ロード, 設定等々
ティラノスクリプトだとページがメニュー項目になってて、セーブページとかロードページがjavascriptでハードコードされてるよね。メニューをシーンと切り離したいゲームではどの方法がベターかな？

ゲーム開発者がJSでメニューをいじくれるようにする
オリジナルのページを作って[return]タグで戻る
オリジナルのページを作って savesnap loadsnap

ShikemokuMK

@ShikemokuMK

有難うございます！

まず、ここまでのプルリクエストについて
一旦betaブランチにマージしてpush しました。

こちらで調整して安定動作が確認できたら
masterへmergeさせていただきます。

Text animation perfomance

テキストメッセージの表示部分についてですよね？
たしかに現在の１文字ずつDOMに追加するのは
パフォーマンスに課題があると感じています。

ご提示のCSSアニメーションはすごく良さそうですね。
私の方で実装を試してみたいと思います。
（表示方法もユーザが選択できると良さそうです）

User settings
I improve some code of audio tags. There is "settings" system >variable witch has JS

ありがとうございます！
音楽のボリュームについては要望がたくさん出ているので助かります。
ただ、音楽はPC・スマホブラウザ・スマホアプリなどの際に
挙動にバラつきがあるので、なかなか難しいところです。
プルリクを参考にマルチプラットフォームで利用できるように私の方でも確認してみます。

Question: menu, save, load, settings and other

これは悩みどころですね。

↑初心者
・設定ファイルの変更でセーブ画面をカスタマイズ
・CSSでテーマの変更のみで見た目を変えれる
・JS+ CSS + HTMLをフルカスタマイズ
↓上級者

のように製作者の技術レベルによって
ある程度、カスタマイズできるレイヤを分割できればと思っています。

デザインプラグインのような形で外部ファイル化して取り込めると最高ですね。（ユーザーどうしでデザインの共有）

gotodeploy

@gotodeploy

:+1:

これ全然関係ないジャストアイデアなんですが、readmeをmarkdown化しませんか？もちろん、私が適当にやってプルリク送ってもいいですが

ShikemokuMK

@ShikemokuMK

いいですね！

っというかreadme自体あまり更新できておらず、申し訳ないです。
お手すきの際で結構ですので、作成頂けると嬉しく思います。

gotodeploy

@gotodeploy

了解です！Tagをきちんと切っておいていただけるとreadmeの更新は抑えられそうな気がします。あと適当なタイミングでreleaseきるとか

ShikemokuMK

@ShikemokuMK

了解しました！

ShikemokuMK

@ShikemokuMK

CSSアニメーションまわりの処理で transの動作がおかしくなっていますね。

ひとつずつマージしていきます。

gotodeploy

@gotodeploy

@ValeryVS Sorry for late reply. Below are what he said.

Thank you so much. As of now, I merged your pull requests to beta branch. I will merge that to master branch if I confirmed stability.

Text animation perfomance

Is it about text rendering? Yes, I have an awereness of the issue you mentioned. I suppose CSS animation is great idea and I would like to try to implement it. (It's better if Users can select the way)

User settings
I improve some code of audio tags. There is "settings" system variable witch has JS

Thank you very much. That's very helpful. I've received many requests for volume control from users. However, there are PC, smartphone browsers and native applications. So it is defficult to play music equally on multiplatforms. I'm going to confirm it workable on multiplatforms.

Question: menu, save, load, settings and other

I worry about the skill level of users.

↑Beginner

Able to customize with config file only
Able to modify CSS
Able to full customize all HTML+CSS+JS

↓Expert

I think customizable layers should be divided. It's the best if we can handle external files as plugin like "design plugin". e.g. it makes users can share own designs

P.S. I found CSS animation codes break [trans] tag behavior. I will merge your pull requests one by one.

Valery

@ValeryVS

Can you provide more information about [trans] tag breaking?
May be video of that error? Browser/node-webkit/Android/iOS version?

Is that z-index issue?
I found that "-webkit-transform" works wrong with "z-index".
For example, menu button hides, when something animated.
The solution is addiing

-webkit-transform: translate3d(0,0,0);

to elements with z-index.

I saw your changes here, in beta branch
https://github.com/ShikemokuMK/tyranoscript/blob/7c749423cbced950701ccdc4b9c58d87892d0ffc/tyrano/libs.js
but that broke something in last chrome.

Aslo why

children : true

in [trans] tag
and all layers from this.kag.layer.map_layer_fore animated?

Valery

@ValeryVS

Okay, I see somthing. Some layers don't shows up when I add multiple images and start [trans] tag. Working on it.

Valery

@ValeryVS

Hmm... I found something.

This isn't issue with css animations. But becouse of this css animations was failed.

kag.layer.js
forelay:function

...
    backlay:function(layer){
...
    forelay:function(layer){
...

For example started with

layer=message0

var fore_class_name = this.map_layer_fore[key].attr("class");
// there fore_class_name = "layer message0_fore layer_fore"

then

//削除
$("."+fore_class_name).remove();
// $(".layer message0_fore layer_fore").remove();
// removes nothing
//追加
this.appendLayer(this.map_layer_fore[key]);
// append new layer without removeig old

There was a few copies of layers. And "animationend" event binding fails.

ShikemokuMK/tyranoscript#43

Kikyou Akino

@bellflower2015

How was layer order? Just is hidden in other one maybe?

Sorry for my broken english.

Valery

@ValeryVS

There was that duplicates.

<div class="layer 0_fore layer_fore" l_visible="true" style="width: 640px; height: 480px; position: absolute; display: none; z-index: 10;"></div>
https://yadi.sk/i/gb5YWPNmhgUGk
Can you open this screenshot?

I checking is there other issuess with [trans] and css animations.

Kikyou Akino

@bellflower2015

I open now...BINGO

How about this https://gist.github.com/bellflower2015/8943cecdb827159dc87c

usage: [iscript]$.getScript('chrome_bug_fix.js');[endscript]

Kikyou Akino

@bellflower2015

I clearly specified for create layer when [forelay] and replace layer when [backlay], also [trans].

It may not only just a workaround, but work fine.

Kikyou Akino

@bellflower2015

Can you open my gist?

Valery

@ValeryVS

Yes.
You are right.

This strings also switch classes 'layer_back', 'layer_fore'.

this.map_layer_back[key].removeClass(fore_class_name);
this.map_layer_back[key].addClass(back_class_name);

I missed this in my fix.

Kikyou Akino

@bellflower2015

Thanks ;)

Recent Chrome sorting is ignore the order of the hasharray, so need to divide clearly base, message and others.

Kikyou Akino

@bellflower2015

I think that it is not a problem unique to your improved version (also original).

Valery

@ValeryVS

There is another issue.

forelay for message layers strats imidiatly
and for other after animation stops.

message_fore layers show before base_fore layer because of this

var _trans = function(key) {
    var layer_fore = that.kag.layer.map_layer_fore[key];
    var layer_back = that.kag.layer.map_layer_back[key];

    //メッセージレイヤの場合、カレント以外はトランスしない。むしろ非表示
    if (key.indexOf("message") != -1 && layer_back.attr("l_visible") == "false") {

        comp_num++;
        that.kag.layer.forelay(key)

    } else {

        $.trans(pm.method, layer_fore, parseInt(pm.time), "hide", function() {});

        layer_back.css("display", "none");

        $.trans(pm.method, layer_back, parseInt(pm.time), "show", function() {
            comp_num++;
            that.kag.layer.forelay(key);

            //すべてのトランジション完了
            if (layer_num <= comp_num) that.kag.ftag.completeTrans();

            that.kag.ftag.hideNextImg()
        })

    }
};

".message_outer" and ".message_inner" has high "z-index"
so their content still at top.

But... if I fix "transform" and "z-index" conflic in chrome with

* {
  /* transform and z-index conflict fix */
  -webkit-transform: translate3d(0px,0px,0px);
  transform: translate3d(0px,0px,0px);
}

then base layer will be above ".message_outer" and ".message_inner" too.

Valery

@ValeryVS

Found the way.
We can use jQuery's replaceWith function instead of remove and add layer.

$("." + back_class_name.replace(/ +/g, '.')).replaceWith(this.map_layer_back[key]);
...
$("." + fore_class_name.replace(/ +/g, '.')).replaceWith(this.map_layer_fore[key]);

Valery

@ValeryVS

ShikemokuMK/tyranoscript#43

Kikyou Akino

@bellflower2015

This message was deleted

sorry
please add my gist URL to your code

Valery

@ValeryVS

To code? To comment in .js file or to pull request message?

Kikyou Akino

@bellflower2015

github comment or code, either ok, thanks

Valery

@ValeryVS

I edit pull request message
ShikemokuMK/tyranoscript#43

Kikyou Akino

@bellflower2015

yep, thank you very much :)

Valery

@ValeryVS

I also merge our fixed with css animate branch
ShikemokuMK/tyranoscript#40
because it wont work without them
and remove this line

if (key.indexOf("message") != -1) this.map_layer_fore[key].css("opacity", "")

in css animate branch.
I think it isn't used with css transitions.

And update main request
ShikemokuMK/tyranoscript#32

Where communities thrive

People

Repo info

Activity