    001/*
    002 * Copyright (c) 2009 The openGion Project.
    003 *
    004 * Licensed under the Apache License, Version 2.0 (the "License");
    005 * you may not use this file except in compliance with the License.
    006 * You may obtain a copy of the License at
    007 *
    008 *     http://www.apache.org/licenses/LICENSE-2.0
    009 *
    010 * Unless required by applicable law or agreed to in writing, software
    011 * distributed under the License is distributed on an "AS IS" BASIS,
    012 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND,
    013 * either express or implied. See the License for the specific language
    014 * governing permissions and limitations under the License.
    015 */
    016package org.opengion.hayabusa.taglib;
    017
    018import org.opengion.hayabusa.common.HybsSystem;
    019import org.opengion.fukurou.util.ToString;
    020import org.opengion.fukurou.util.TagBuffer;
    021
    022import static org.opengion.fukurou.util.StringUtil.nval;
    023
    024/**
    025 * jQueryのdraggableを使用したｵﾌﾞｼﾞｪｸﾄの移動を行う、View を設定します。
    026 *
    027 * viewFormType="CustomData" の BODY 部に記述された、class="dragDiv"（固定） を持った、
    028 * DIV要素をﾄﾞﾗｯｸﾞするための、各種情報を提供します。
    029 * dragViewタグは、view タグの上位に記述し、class="dragView"（固定）のﾚｲｱｳﾄのCSS とともに、
    030 * 必要な情報を出力して、JQeury の引数が受け取れる形の DIVタグを生成します。
    031 * また、ｵﾌﾞｼﾞｪｸﾄの移動は、jQueryの ajax により、リアルタイムに JSP を呼び出すことで、
    032 * データベースの書き込みをサポートします。
    033 *
    034 * og:dragView ： viewタグの上位に位置して、cssと、パラメータ用のdivタグを生成します。
    035 * og:dragDiv  ： viewタグの tbody に書き込む、簡易的な文字列生成用のタグです。
    036 * common/dragSelect.jsp  ： GE18 の select文（scope="session"）
    037 * common/dragUpdate.jsp  ： jQueryからﾄﾞﾗｯｸﾞ終了時点でajxaで呼び出される、標準のjspファイル
    038 *                           この中で、GE18(位置情報管理ﾃｰﾌﾞﾙ)に位置情報が書き込まれます。
    039 * common/jquery/dragView.js ：jQueryのdraggable 本体。$(function(){$(".dragDiv").draggable({････})});
    040 *
    041 * dragBox.js と、dragUpdate.jsp を独自に修正すれば、自前のﾃｰﾌﾞﾙに位置情報を書き込むことも可能です。
    042 *
    043 * @og.formSample
    044 * ●形式：&lt;og:dragView&gt;&lt;og:view ・・・  /&gt;&lt;/og:dragView&gt;
    045 * ●body：あり(EVAL_BODY_INCLUDE:BODYをインクルードし、{&#064;XXXX} は解析しません)
    046 *
    047 * ●Tag定義：
    048 *   &lt;og:dragView
    049 *       url                 【TAG】ﾄﾞﾗｯｸﾞ後に呼び出す jspファイルのアドレス(初期値：/jsp/common/dragUpdate.jsp)
    050 *       grid                【TAG】ﾄﾞﾗｯｸﾞ時にｵﾌﾞｼﾞｪｸﾄが動けるｸﾞﾘｯﾄﾞを指定します(初期値：10,10)
    051 *       width               【CSS】Viewを囲うdivのCSS(dragView)のwidth属性(初期値:100%)
    052 *       height              【CSS】Viewを囲うdivのCSS(dragView)のheight属性(初期値:100%)
    053 *       image               【CSS】bgImage(background-image属性)のurlの引数の値
    054 *       background          【CSS】Viewを囲うdivのCSS(dragView)のbackground属性
    055 *       bgColor             【CSS】Viewを囲うdivのCSS(dragView)のbackground-color属性
    056 *       bgSize              【CSS】Viewを囲うdivのCSS(dragView)のbackground-size属性(初期値:800px)
    057 *       bgImage             【CSS】Viewを囲うdivのCSS(dragView)のbackground-image属性
    058 *       bgRepeat            【CSS】Viewを囲うdivのCSS(dragView)のbackground-repeat属性(初期値:no-repeat)
    059 *       bgPosition          【CSS】Viewを囲うdivのCSS(dragView)のbackground-position属性
    060 *       zoom                【CSS】ﾄﾞﾗｯｸﾞ要素のCSS(dragDiv)に適用する拡大、縮小の倍率
    061 *       id                  【HTML】Viewを囲うdiv要素に対して固有の名前(id)をつける場合に設定します
    062 *       style               【HTML】Viewを囲うdiv要素に適用させるスタイルシート(style)を設定します
    063 *       optionAttributes    【TAG】Viewを囲うdiv要素にそのまま追記する属性
    064 *       caseKey             【TAG】このタグ自体を利用するかどうかの条件キーを指定します(初期値:null)
    065 *       caseVal             【TAG】このタグ自体を利用するかどうかの条件値を指定します(初期値:null)
    066 *       caseNN              【TAG】指定の値が、null/ゼロ文字列 でない場合(Not Null=NN)は、このタグは使用されます(初期値:判定しない)
    067 *       caseNull            【TAG】指定の値が、null/ゼロ文字列 の場合は、このタグは使用されます(初期値:判定しない)
    068 *       caseIf              【TAG】指定の値が、true/TRUE文字列の場合は、このタグは使用されます(初期値:判定しない)
    069 *       debug               【TAG】デバッグ情報を出力するかどうか[true/false]を指定します(初期値:false)
    070 *   &gt;   ... Body ...
    071 *   &lt;/og:dragView&gt;
    072 *
    073 * ●使用例
    074 *   ※ Select ･･･ from GE18 A {&#064;JOIN_SQL} where ･･･ をincludeします。
    075 *   &lt;og:value key="JOIN_SQL" &gt;
    076 *       left outer join DBXX B on A.LOC_GRP=B.GRP and A.LOC_KEY=B.KEY
    077 *   &lt;/og:value&gt;
    078 *   &lt;jsp:directive.include file="/jsp/common/dragSelect.jsp" /&gt;
    079 *
    080 *   ※ カラムに必要なﾏｰｶｰを追加します。ここでは、ICON にｲﾒｰｼﾞ画像を設定していますが、viewのBODY部でもかまいません。
    081 *   &lt;og:viewMarker command="{&#064;command}"&gt;
    082 *       &lt;og:columnMarker column="ICON"&gt;
    083 *           &lt;img src="image/[LOC_GRP]/[ICON]" width="50px" title="[LABEL_NAME]" /&gt;
    084 *       &lt;/og:columnMarker&gt;
    085 *   &lt;/og:viewMarker&gt;
    086 *
    087 *   ※ dragView のなかに、viewタグで、viewFormType="CustomData" のﾃﾞｰﾀを作成します。
    088 *    &lt;og:dragView&gt;
    089 *      &lt;og:view
    090 *          viewFormType        = "CustomData"
    091 *          command         = "{&#064;command}"
    092 *          writable        = "false"
    093 *          useScrollBar    = "false"
    094 *          numberType      = "delete"
    095 *          bgColorCycle    = "1"
    096 *          useHilightRow   = "false"
    097 *      &gt;
    098 *          ※ tbody のなかの、dibタグが、ドラッグ可能になり、left:[LOC_COL]px; top:[LOC_ROW]px; が位置になります。
    099 *          &lt;og:tbody rowspan="1" &gt;
    100 *              &lt;div class="dragDiv" id="[UNIQ]" style="left:[LOC_COL]px; top:[LOC_ROW]px;" &gt;[ICON]&lt;/div&gt;
    101 *          &lt;/og:tbody&gt;
    102 *      &lt;/og:view&gt;
    103 *    &lt;/og:dragView&gt;
    104 *
    105 * ●使用例
    106 *    ※ tbody の中を、og:dragDiv にした場合。
    107 *    &lt;og:dragView&gt;
    108 *      &lt;og:view
    109 *          viewFormType        = "CustomData"
    110 *          ･･･
    111 *      &gt;
    112 *          &lt;og:tbody rowspan="1" &gt;
    113 *              &lt;og:dragDiv &gt;[ICON]&lt;/og:dragDiv&gt;
    114 *          &lt;/og:tbody&gt;
    115 *      &lt;/og:view&gt;
    116 *    &lt;/og:dragView&gt;
    117 *
    118 * @og.rev 7.0.1.0 (2018/10/15) 新規作成
    119 * @og.group 画面部品
    120 *
    121 * @version  7.0
    122 * @author       Kazuhiko Hasegawa
    123 * @since    JDK11.0,
    124 */
    125public class DragViewTag extends CommonTagSupport {
    126        /** このプログラムのVERSION文字列を設定します。   {@value} */
    127        private static final String VERSION = "7.0.1.0 (2018/10/15)" ;
    128        private static final long serialVersionUID = 701020181015L ;
    129
    130        private static final String CSS_START = "<style type=\"text/css\">" ;
    131        private static final String CSS_END   = "</style>" ;
    132
    133        private String  sysJsp                  = HybsSystem.sys( "JSP" );
    134
    135        private String  url                             = sysJsp + "/common/dragUpdate.jsp";            // dragView の div要素として作成します。
    136        private String  grid                    = "10,10" ;                                                                     // dragView の div要素として作成します。
    137
    138        private String  width                   = "100%"  ;
    139        private String  height                  = "100%"  ;
    140        private String  image                   ;                                       // background-image属性の、url( 'XXXX' ) の 中身になります。
    141        private String  background              ;                                       // background属性
    142        private String  bgColor                 ;                                       // background-color属性
    143        private String  bgSize                  = "800px" ;                     // background-size属性
    144        private String  bgImage                 ;                                       // background-image属性
    145        private String  bgRepeat                = "no-repeat" ;         // background-repeat属性
    146        private String  bgPosition              ;                                       // background-position属性
    147        private String  zoom                    ;                                       // 拡大、縮小の倍率
    148        // id , style は、CommonTagSupport で定義され、get(キー) メソッドで取得可能です。
    149
    150        /**
    151         * デフォルトコンストラクター
    152         *
    153         * @og.rev 7.0.1.0 (2018/10/15) 新規作成
    154         */
    155        public DragViewTag() { super(); }               // これも、自動的に呼ばれるが、空のメソッドを作成すると警告されるので、明示的にしておきます。
    156
    157        /**
    158         * Taglibの開始タグが見つかったときに処理する doStartTag() を オーバーライドします。
    159         *
    160         * @og.rev 7.0.1.0 (2018/10/15) 新規作成
    161         *
    162         * @return      後続処理の指示( EVAL_BODY_INCLUDE )
    163         */
    164        @Override
    165        public int doStartTag() {
    166                if( useTag() ) {
    167                        jspPrint( makeStyleAndDiv() );  // style属性と、開始の divタグを出力します。
    168                        return EVAL_BODY_INCLUDE ;              // Body インクルード( extends TagSupport 時)
    169                }
    170                return SKIP_BODY ;                                      // Body を評価しない
    171        }
    172
    173        /**
    174         * Taglibの終了タグが見つかったときに処理する doEndTag() を オーバーライドします。
    175         *
    176         * @og.rev 7.0.1.0 (2018/10/15) 新規作成
    177         *
    178         * @return      後続処理の指示
    179         */
    180        @Override
    181        public int doEndTag() {
    182                debugPrint();
    183                if( useTag() ) {
    184                        jspPrint( "</div>" );   // 最後の divタグを出力します。
    185                }
    186
    187                return EVAL_PAGE ;              // ページの残りを評価する。( extends TagSupport 時)
    188        }
    189
    190        /**
    191         * タグリブオブジェクトをリリースします。
    192         * キャッシュされて再利用されるので、フィールドの初期設定を行います。
    193         *
    194         * @og.rev 7.0.1.0 (2018/10/15) 新規作成
    195         */
    196        @Override
    197        protected void release2() {
    198                super.release2();
    199                sysJsp                  = HybsSystem.sys( "JSP" );
    200                url                             = sysJsp + "/common/dragUpdate.jsp";
    201                grid                    = "10,10" ;
    202                width                   = "100%"  ;
    203                height                  = "100%"  ;
    204                image                   = null ;                        // url( 'image/{@LOC_GRP}.png' ) の 中身になります。
    205                background              = null ;
    206                bgColor                 = null ;
    207                bgSize                  = "800px" ;
    208                bgImage                 = null ;
    209                bgRepeat                = "no-repeat" ;
    210                bgPosition              = null ;
    211                zoom                    = null ;
    212        }
    213
    214        /**
    215         * style属性と、開始の divタグを生成します。
    216         *
    217         * ﾄﾞﾗｯｸﾞ処理に必要な、CSS 情報と、view を囲う DIV要素の開始タグを出力します。
    218         *
    219         * @return  style属性と、開始の divタグ
    220         */
    221        private String makeStyleAndDiv() {
    222                final String trzoom = zoom == null ? null : "scale(" + zoom + ")" ;
    223                final String origin = zoom == null ? null : "top left" ;
    224
    225                // CSS 作成
    226                final TagBuffer tagBuf = new TagBuffer()
    227                                .addBuffer( CSS_START                                           )
    228                                .startCss( ".dragDiv"                                           )
    229                                .add( "position"                        , "absolute"    )
    230                                .add( "margin"                          , "0px"                 )
    231                                .add( "padding"                         , "0px"                 )
    232                                .add( "zoom"                                    , zoom          )                       // null の場合、登録されない
    233                                .add( "transform"                               , trzoom        )                       //   同上
    234                                .add( "transform-origin"                , origin        )                       //   同上
    235                                .add( "-moz-transform"                  , trzoom        )                       //   同上
    236                                .add( "-moz-transform-origin"   , origin        )                       //   同上
    237                                .make()                                                                                                 // ここで、一旦完成
    238                                .startCss( ".dragView"                                          )
    239                                .add( "width"                           , width                 )
    240                                .add( "height"                          , height                )
    241                                .add( "background"                      , background    )
    242                                .add( "background-color"        , bgColor               )
    243                                .add( "background-size"         , bgSize                )
    244                                .add( "background-image"        , nval( bgImage , image ) )     // bgImage があれば優先されます。
    245                                .add( "background-repeat"       , bgRepeat              )
    246                                .add( "background-position"     , bgPosition    )
    247                                .make()                                                                                                 // ここで、一旦完成
    248                                .addBuffer( CSS_END                                                     )
    249                                .startTag( "div"                                                        )
    250                                .add( "class"                           , "dragView"    )
    251                                .add( "url"                                     , url                   )
    252                                .add( "grid"                            , grid                  )
    253                                .addOptions( get( "optionAttributes" )          ) ;                     // id,style など
    254
    255                return tagBuf.toBefore();                                                                               // <div ････ > まで先行して作成します。
    256        }
    257
    258        /**
    259         * 【TAG】ﾄﾞﾗｯｸﾞ後に呼び出す jspファイルのアドレス(初期値：/jsp/common/dragUpdate.jsp)。
    260         *
    261         * @og.tag
    262         * ﾄﾞﾗｯｸﾞ後に ajax で、jspファイルを呼び出します。
    263         * 初期値は、/jsp/common/dragUpdate.jsp に設定されており、GE18 ﾃｰﾌﾞﾙに状態を書き込みます。
    264         *
    265         * @param   url ﾄﾞﾗｯｸﾞ後に呼び出す jspファイル
    266         */
    267        public void setUrl( final String url ) {
    268                this.url = nval( getRequestParameter( url ),this.url );
    269        }
    270
    271        /**
    272         * 【TAG】ﾄﾞﾗｯｸﾞ時にｵﾌﾞｼﾞｪｸﾄが動けるｸﾞﾘｯﾄﾞを指定します(初期値：10,10)。
    273         *
    274         * @og.tag
    275         * ﾄﾞﾗｯｸﾞ時に、ｵﾌﾞｼﾞｪｸﾄが、このｸﾞﾘｯﾄﾞ単位で移動します。
    276         * ある程度、ｸﾞﾘｯﾄﾞで制約をかけると、縦や横に、きれいに配置させることができます。
    277         * 1,1 にすると、1ピクセル毎に滑らかに動きます。
    278         * また、10,0 を設定すると、x軸(横方向)には、10px単位で動きますが、y軸(縦方向)には動きません。
    279         * 初期値は、10,10 で、10px単位に、動きます。
    280         *
    281         * @param   grid ﾄﾞﾗｯｸﾞ時にｵﾌﾞｼﾞｪｸﾄが動けるｸﾞﾘｯﾄﾞ
    282         */
    283        public void setGrid( final String grid ) {
    284                this.grid = nval( getRequestParameter( grid ),this.grid );
    285        }
    286
    287        /**
    288         * 【CSS】Viewを囲うdivのCSS(dragView)のwidth属性(初期値:100%)。
    289         *
    290         * @og.tag
    291         * div要素のwidth属性を指定します。
    292         * これは、.dragView セレクタの style に書き込まれます。
    293         *
    294         * 初期値は、100% です。
    295         *
    296         * @param   width width属性(初期値:100%)
    297         */
    298        public void setWidth( final String width ) {
    299                this.width = nval( getRequestParameter( width ),this.width );
    300        }
    301
    302        /**
    303         * 【CSS】Viewを囲うdivのCSS(dragView)のheight属性(初期値:100%)。
    304         *
    305         * @og.tag
    306         * div要素のheight属性を指定します。
    307         * これは、.dragView セレクタの style に書き込まれます。
    308         *
    309         * 初期値は、100% です。
    310         *
    311         * @param   height height属性(初期値:100%)
    312         */
    313        public void setHeight( final String height ) {
    314                this.height = nval( getRequestParameter( height ),this.height );
    315        }
    316
    317        /**
    318         * 【CSS】Viewを囲うdivのCSS(dragView)のbackground-image属性のurlの引数の値。
    319         *
    320         * @og.tag
    321         * div要素のbackground-image属性を簡易的に指定するのに使用します。
    322         * background-image属性は、url( 'image/SAMPLE.png' ) のような書き方になりますが
    323         * ここで指定するのは、'image/SAMPLE.png' の部分です。
    324         * ｼﾝｸﾞﾙｸｵｰﾄは、タグ内で付けますので、引数につける必要はありません。
    325         * background-image と同時に指定された場合は、background-image が優先されます。
    326         *
    327         * 初期値は、ありません。
    328         *
    329         * @param   image background-image属性のurlの引数の値
    330         * @see         #setBgImage(String)
    331         */
    332        public void setImage( final String image ) {
    333                final String img = nval( getRequestParameter( image ),this.image );
    334
    335                if( img != null ) {
    336                        this.image = "url('" + img + "')" ;
    337                }
    338        }
    339
    340        /**
    341         * 【CSS】Viewを囲うdivのCSS(dragView)のbackground属性。
    342         *
    343         * @og.tag
    344         * div要素のbackground属性を指定します。
    345         * 例：background = "top left/800px url( 'image/{&#064;LOC_GRP}.png' ) no-repeat;"
    346         * これは、.dragView セレクタの style に書き込まれます。
    347         *
    348         * 初期値は、ありません。
    349         *
    350         * @param   background background属性
    351         */
    352        public void setBackground( final String background ) {
    353                this.background = nval( getRequestParameter( background ),this.background );
    354        }
    355
    356        /**
    357         * 【CSS】Viewを囲うdivのCSS(dragView)のbackground-color属性。
    358         *
    359         * @og.tag
    360         * div要素のbackground-color属性を指定します。
    361         * これは、.dragView セレクタの style に書き込まれます。
    362         *
    363         * 初期値は、ありません。
    364         *
    365         * @param   bgColor background-color属性
    366         */
    367        public void setBgColor( final String bgColor ) {
    368                this.bgColor = nval( getRequestParameter( bgColor ),this.bgColor );
    369        }
    370
    371        /**
    372         * 【CSS】Viewを囲うdivのCSS(dragView)のbackground-size属性(初期値:800px)。
    373         *
    374         * @og.tag
    375         * div要素のbackground-size属性を指定します。
    376         * これは、.dragView セレクタの style に書き込まれます。
    377         *
    378         * 初期値:800px。
    379         *
    380         * @param   bgSize background-size属性
    381         */
    382        public void setBgSize( final String bgSize ) {
    383                this.bgSize = nval( getRequestParameter( bgSize ),this.bgSize );
    384        }
    385
    386        /**
    387         * 【CSS】Viewを囲うdivのCSS(dragView)のbackground-image属性。
    388         *
    389         * @og.tag
    390         * div要素のbackground-image属性を指定します。
    391         * background-image属性は、url( 'image/SAMPLE.png' ) のような書き方になります。
    392         * これは、.dragView セレクタの style に書き込まれます。
    393         *
    394         * 初期値は、ありません。
    395         *
    396         * @param   bgImage background-image属性
    397         * @see         #setImage(String)
    398         */
    399        public void setBgImage( final String bgImage ) {
    400                this.bgImage = nval( getRequestParameter( bgImage ),this.bgImage );
    401        }
    402
    403        /**
    404         * 【CSS】Viewを囲うdivのCSS(dragView)のbackground-repeat属性(初期値:no-repeat)。
    405         *
    406         * @og.tag
    407         * div要素のbackground-repeat属性を指定します。
    408         * これは、.dragView セレクタの style に書き込まれます。
    409         *
    410         * 初期値:no-repeat。
    411         *
    412         * @param   bgRepeat background-repeat属性
    413         */
    414        public void setBgRepeat( final String bgRepeat ) {
    415                this.bgRepeat = nval( getRequestParameter( bgRepeat ),this.bgRepeat );
    416        }
    417
    418        /**
    419         * 【CSS】Viewを囲うdivのCSS(dragView)のbackground-position属性。
    420         *
    421         * @og.tag
    422         * div要素のbackground-position属性を指定します。
    423         * これは、.dragView セレクタの style に書き込まれます。
    424         *
    425         * 初期値は、ありません。
    426         *
    427         * @param   bgPosition background-position属性
    428         */
    429        public void setBgPosition( final String bgPosition ) {
    430                this.bgPosition = nval( getRequestParameter( bgPosition ),this.bgPosition );
    431        }
    432
    433        /**
    434         * 【CSS】ﾄﾞﾗｯｸﾞ要素のCSS(dragDiv)に適用する拡大、縮小の倍率。
    435         *
    436         * @og.tag
    437         * 要素を拡大、縮小するCSSを、dragDiv に書き込みます。
    438         * 1.0 が標準で、1以下が縮小、1以上が拡大になります。
    439         *
    440         *              zoom                                    : {&#064;ZOOM};
    441         *              transform                               : scale({&#064;ZOOM});
    442         *              transform-origin                : top left;
    443         *              -moz-transform                  : scale({&#064;ZOOM});
    444         *              -moz-transform-origin   : top left;
    445         *
    446         * 初期値は、ありません。
    447         *
    448         * @param   zoom ﾄﾞﾗｯｸﾞ要素の拡大、縮小の倍率
    449         */
    450        public void setZoom( final String zoom ) {
    451                this.zoom = nval( getRequestParameter( zoom ),this.zoom );
    452        }
    453
    454        /**
    455         * 【TAG】JavaScript などの HTML基本タグ以外の属性を、そのままタグとして使用します。
    456         *
    457         * @og.tag
    458         * JavaScript などの HTML基本タグ以外の属性を、そのままタグとして使用します。
    459         *
    460         * @param   optionAttributes オプション属性
    461         */
    462        public void setOptionAttributes( final String optionAttributes ) {
    463                final String optAttri = getRequestParameter( optionAttributes );
    464                if( optAttri != null && optAttri.length() > 0 ) {
    465                        set( "optionAttributes",optAttri );
    466                }
    467        }
    468
    469        /**
    470         * このオブジェクトの文字列表現を返します。
    471         * 基本的にデバッグ目的に使用します。
    472         *
    473         * @return このクラスの文字列表現
    474         * @og.rtnNotNull
    475         */
    476        @Override
    477        public String toString() {
    478                return ToString.title( this.getClass().getName() )
    479                                .println( "VERSION"                     ,VERSION        )
    480                                .println( "url"                         ,url            )
    481                                .println( "grid"                        ,grid           )
    482                                .println( "width"                       ,width          )
    483                                .println( "height"                      ,height         )
    484                                .println( "image"                       ,image          )               // url文字列と合成済み
    485                                .println( "background"          ,background )
    486                                .println( "bgColor"                     ,bgColor        )
    487                                .println( "bgSize"                      ,bgSize         )
    488                                .println( "bgImage"                     ,bgImage        )
    489                                .println( "bgRepeat"            ,bgRepeat       )
    490                                .println( "bgPosition"          ,bgPosition )
    491                                .println( "id"                          ,get("id"        ) )
    492                                .println( "style"                       ,get("style" ) )
    493                                .println( "Other..."    ,getAttributes().getAttribute() )
    494                                .fixForm().toString() ;
    495        }
    496}