Test text.

編集画面が多言語対応したモジュールのサンプルです。

(Double click to edit text)
(Double click to edit text)
1
default1
select1
radio1
Double click here to add element
Drop a module here

H1 Heading

H2 Heading

H3 Heading

H4 Heading

H5 Heading
H6 Heading

インラインCSSで大きくされた文字です。

この行には、リンクが含まれています。

この行には、が含まれています。

JavaScriptも埋め込まれています。

script element
onclick 属性が定義されています。
cell テーブルも含まれます。

Left 1 (parent locked)

Left 2

Left 3

Left 4

default1
select2
radio3
Drop a module here

Right 1 (parent locked)

Right 2

Right 3

Right 4

Drop a module here

このモジュールには入力欄が定義されていません。

1: image 1

2: image 2

3: image 3

ファイルをダウンロードするサンプル

このモジュールは、 loopフィールドの外側にあるinputフィールドの値を、 loopフィールド内のechoフィールドで参照するテストです。

Echo Sample String

Echo Sample String

Double click here to add element

custom1-2 field

custom1
custom1 value
custom2.val1
value of val1
custom2.val2
value of val2

/custom1-2 field

resource build.

デフォルトの値

ここを編集してください。

これは、PHPスクリプトによる出力です。

"; ?>

loopフィールドの中にmoduleフィールド

/loopフィールドの中にmoduleフィールド

SCRIPT (double click to write script) SCRIPT (double click to write script) SCRIPT (double click to write script) SCRIPT (double click to write script)
text
(Double click to edit text)
text required
test1@example.com
html required
test1@example.com
html_attr_text required
test1@example.com
href required
test1@example.com
markdown required

test1@example.com

multitext required

customvalidation

text
あああ
text required
あああ
html required
あああ
html_attr_text required
test1@example.com
href required
あああ
markdown required

あああ

multitext required

customvalidation

text
(Double click to edit text)
text required
(Double click to edit text)
html required
(Double click to edit HTML code)
html_attr_text required
(Double click to edit text)
href required
markdown required
(Double click to edit Markdown)
multitext required
(Double click to edit text)

(1) モジュールIDの表現形式

{$idx}:{$dir}/{$name}
たくさんの花

最小構成のモジュールのサンプル

Drop a module here

(2) モジュールテンプレートの定義場所

px-files/px2dtconfig.json に定義する。 あああああ

Markdownフィールド

  • list 1
  • list 2

再描画されます。

再描画されました。

Drop a module here

(3) Composer から呼び出す場合

  • require に、リポジトリを指定する。
  • ディレクトリのパスは ./vendor/vendorname/libname/~~~~ になるはず。

長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。長い文字コンテンツ。

まるちテキストを追加してみました。

Drop a module here

長いページを作るテスト

長いページを作ると、スクロールバーが出る。

高さ調整のためのスクリプトの実行順序を見直すと直るのではないかな。

Drop a module here

自分でコーディングする領域

HTMLコードを自分で書きます。

HTMLエンティティ変換もされないので、自分で書きます

ただのテキスト。<br />
HTMLエンティティ変換される、はず。

- でも、markdownの書式は使えない、はず。

あー、改行が反映されない、か。

スクロール位置は?

ちょうどいいじゃないですか。
Drop a module here

宿題宿題。

Yes, 宿題。

宿題やったかー?
\(^o^)/

やってるYo! \(^o^)/

会社の宿題。

module はやっぱり、input の1つでは問題がある。不便。

こいつは直しました。 moduleフィールドを追加。input type:module は廃止。

Drop a module here

loopフィールドの多階層処理のテスト用モジュール

  • loop1:

    テストテキストモジュールー!

    • loop2:

      テスト2 うふろぉぉぉぉ

      • loop3:

        だはぁぁぁぁぁ

        マルチテキスト3

      • loop3:

        どぉぉぉ

        (Double click to edit text)
      • Double click here to add element
    • loop2:

      テスト2いいいおおおお

      • loop3:

        なかなかいいと思います。

        マークダウンコード。そのままHTMLに変換されます。

        すばらしい!

        どですか?

      • loop3:

        テスト3ああああ

        (Double click to edit text)
      • loop3:

        ループして

        (Double click to edit text)
      • Double click here to add element
    • Double click here to add element
  • loop1:

    もじれつ書いてみますよ。

      Double click here to add element
  • loop1:

    テキストテキストー!

      Double click here to add element
  • Double click here to add element

/loopフィールドの多階層処理のテスト用モジュール

なかなかです。

まだ帰らなくてもいいでしょ。 もっと遊びたいんだよ。

いいじゃんかよーーーー!

Drop a module here

いい感じになってまいりました

あけましておめでとうございます。

できました

px.utils.iterate() が、オブジェクトも処理できるようになりました。

長いページを作るテスト

長いページを作ると、スクロールバーが出る。

高さ調整のためのスクリプトの実行順序を見直すと直るのではないかな。

Drop a module here

複雑な画面をつくろうと思うと・・・やっぱそこそこ大変ね。

配列処理を毎回キックしてるので、リフレッシュに時間がかかる。重い。

Drop a module here

したーーーのほうも再描画テスト。

default2
select2
radio3
Drop a module here

長いページを作るテスト

長いページを作ると、スクロールバーが出る。

コールバックチェーンがいまいち

高さ調整のためのスクリプトの実行順序を見直すと直るのではないかな。

Drop a module here

複雑になっちゃったなぁ

なかなかさ、あれですな。

集中して構えないと手を入れられない感じ。むぅ。

Drop a module here

長いページを作るテスト

長いページを作ると、スクロールバーが出る。

高さ調整のためのスクリプトの実行順序を見直すと直るのではないかな。

長いページを作るテスト

長いページを作ると、スクロールバーが出る。

高さ調整のためのスクリプトの実行順序を見直すと直るのではないかな。

Drop a module here
テストテキスト

↑これはpng

SVG画像を読み込む練習です。

↑これはSVG

Drop a module here
階段空

マークダウン。

Drop a module here
## JSON のフォーマットを、人にやさしくしてみました。

テキストコード。
Drop a module here

JSON自体の差分を追えるようになりたい。

やっぱね、マークダウンが便利っす。

大抵のことはこれで事足りる。

ちゃんとマークアップできるし。コードもそこそこキレイにできる。

Drop a module here

こうすると、なるらしい。

var jsonStr = JSON.stringify( {"JSON":"value"}, null, 1 );
  • 増えたっていいじゃない?

  • PHP必要?

    • マークダウンをリスト編集する。
    • リストモジュールなのに、さらにリストをネストして編集してるんだからっ。
  • Double click here to add element
Drop a module here

finalized

custom1 field

あれ?

/custom1 field

- {"modId":"testMod1:dev/custom1","fields":{"main":"あれ?"},"anchor":"","dec":"","locked":{"contents":false,"children":false,"move":false,"delete":false}}

finalized

[ERROR] Unknown Module Template.

loopフィールドの多階層処理のテスト用モジュール

/loopフィールドの多階層処理のテスト用モジュール

module_js

isSingleRootElement が false になってはいけないパターン

markdown

isSingleRootElement が false になってはいけないパターン

markdown

isSingleRootElement が false になってはいけないパターン

md

Double click here to add element

Heading

Drop a module here

うまく行ってますか???

Drop a module here

表示されていますか?

Drop a module here
baseText は入力されていません。

option 1-3

option 2-2

(Double click to edit text)

body は入力されていません。

Drop a module here

ううう

えええ

あああ

いいい

Double click here to add element

テストです。

テストです。 その2。

Double click here to add element
これは編集画面にしか表示されない要素です。
Getting extra data: bar
テキスト入力しています。
<b>テキスト</b>です。
1行<b>テキスト</b>です。

HTML入力です。

HTMLソースを入力しています。

1行HTML入力です。

マークダウンです。

  • markdown 1
  • markdown 2
  • 1行マークダウンです

MultiText

マルチテキストです。

  • list 1
  • list 2
- 1行マルチテキストです。
#C09FB0
2020-04-29 00:00:00
2020-04-14 18:20:00
2024-02-07 11:18:03
2020年04月23日 00時00分00秒
2016年02月01日 22時05分00秒
2008年03月09日 12時07分01秒 = 08年3月9日 12時07分01秒 = pm PM 12時 12時
SCRIPT (double click to write script) SCRIPT (double click to write script) SCRIPT (double click to write script) SCRIPT (double click to write script)
フィールド1
フィールド2
フィールド3
This module is deprecated.
test
test
Drop a module here
  • test
  • リスト
  • Double click here to add element
Drop a module here

mod

(Double click to edit text)(Double click to edit text)(Double click to edit text)(Double click to edit text)(Double click to edit text)(Double click to edit text)(Double click to edit text)(Double click to edit text)

mod

(Double click to edit text)(Double click to edit text)(Double click to edit text)(Double click to edit text)(Double click to edit text)(Double click to edit text)(Double click to edit text)(Double click to edit text)(Double click to edit text)(Double click to edit text) (Double click to edit text)(Double click to edit text)(Double click to edit text)

mod

(Double click to edit text)(Double click to edit text)(Double click to edit text)(Double click to edit text)
Drop a module here

このモジュールには、scriptタグが含まれています。

script element

これらがGUI処理に悪影響を及ぼさないよう、無害化される必要があります。

script element
Drop a module here

画像はセットされていません。

内部の処理では testMod2:dev/module_id_fake として扱われるのが正しい。

内部の処理では testMod2:fake/mod_id_fake_2 として扱われるのが正しい。

内部の処理では testMod1:unit/module_id_fake_3 として扱われるのが正しい。

テストテキスト。

internalId の中のモジュールフィールド。

Drop a module here

内容テキスト1

internalId の中のループフィールドの中のモジュールフィールド。

内容テキストその3。

Drop a module here

内容テキストその2。

Drop a module here
Double click here to add element

内部の処理では testMod2:dev/module_id_fake として扱われるのが正しい。

内部の処理では testMod2:fake/mod_id_fake_2 として扱われるのが正しい。

Drop a module here

内部の処理では testMod1:unit/module_id_fake_3 として扱われるのが正しい。

テストテキスト

内部の処理では testMod2:dev/module_id_fake として扱われるのが正しい。

入れ子状態の中のテキスト1。

内部の処理では testMod2:fake/mod_id_fake_2 として扱われるのが正しい。

テストテキスト2

(Double click to edit text)
Double click here to add element
Drop a module here
(Double click to edit HTML code)

あとから追加されたフィールドのテスト

(Double click to edit text)
Drop a module here
Double click here to add element
Double click here to add element
Drop a module here