KaneAI - World’s First E2E Software Testing Agent.Book a Demo Join TestMu Conference

How to use closewindow method in pyatom

Best Python code snippet using pyatom_python

tools_app.js

Source:tools_app.js

1"use strict";2class InputView extends React.Component {3    constructor(props) {4        super(props);5        this.closeWindow = this.closeWindow.bind(this);6        this.inputValue = this.inputValue.bind(this);7        this.submit = this.submit.bind(this);8    }9    closeWindow = e => {10        this.props.cannel();11        this.state = {}12    }13    submit = e => {14        this.props.then(this.state);15        this.state = {}16    }17    inputValue = e => {18        const key = e.target.getAttribute("data");19        const value = e.target.value;20        const index = e.target.getAttribute("index");21        const {argsGroup = []} = this.props;22        argsGroup[index]["val"] = value;23        this.setState({[key]: value});24    }25    renderLineHTML = ({i = 0, val, key, placeholder}, type = "input") => {26        switch (type) {27            case "input":28                return (<input index={i} placeholder={placeholder} value={val} data={key}29                               onChange={this.inputValue}30                               autoComplete="off"/>);31            case "multiline":32                return (<textarea rows="5" cols="30" index={i} placeholder={placeholder} value={val} data={key}33                                  onChange={this.inputValue}34                                  autoComplete="off"/>)35            default:36                return "";37        }38    }39    renderBodyHTML = (argsGroup = []) => {40        const that = this;41        return argsGroup.map(({42                                  label = "",43                                  key = "",44                                  val,45                                  viewOnly = false,46                                  placeholder = "è¯·è¾å¥åæ°",47                                  type = "input"48                              }, i) => (49            <div className="input-view">50                <label>{label}</label>51                {viewOnly ? (<span className="view-only">{val}</span>) : (that.renderLineHTML({52                    i,53                    val,54                    key,55                    placeholder56                }, type))}57            </div>58        ));59    }60    render = () => {61        const {showWindow = false, title = "", argsGroup = [], msg = ""} = this.props;62        return (63            <div className={showWindow ? "modal mask show" : "modal mask"}>64                <div className="content">65                    <div className="mask-header">66                        <span className="title">{title}</span>67                    </div>68                    <div className="mask-body">69                        {0 === argsGroup.length ? (70                            <div className="no-value">{msg}</div>) : this.renderBodyHTML(argsGroup)}71                    </div>72                    <div className="mask-footer">73                        <div className="btn-group">74                            <span className="submit" onClick={this.submit}>ç¡®å®</span>75                            <span className="cancel" onClick={this.closeWindow}>åæ¶</span>76                        </div>77                    </div>78                </div>79            </div>80        );81    }82}83class VideoManagerApp extends React.Component {84    constructor(props) {85        super(props);86        this.state = {87            viewContentHTML: (<div className="no-value">æªæä¿¡æ¯æ¾ç¤º</div>)88        };89        this.clickPageItem = this.clickPageItem.bind(this);90    }91    componentDidMount() {92        this.renderVideoList();93    }94    closeWindow = () => {95        this.setState({96            showScanWindow: false,97            showNewVideoWindow: false,98            showVideoDetailWindow: false,99            showModifyVideoWindow: false,100            showDeleteVideoWindow: false,101        });102    }103    openScanWindow = () => {104        this.setState({105            showScanWindow: true,106            argsGroup: [{label: "ç®å½ä½ç½®", key: "path", placeholder: "è¾å¥è¦æ«æçç®å½å°å"}],107        });108    }109    scanDir = value => {110        const that = this;111        Req({112            method: "POST",113            url: "/backend/aip/video/scan",114            data: value,115        }).then(value => {116            if (value) {117                const viewContentHTML = (118                    <div className="view">119                        <div className="title">120                            <div className="col-md-1"></div>121                            <div className="col-md-7">åç§°</div>122                            <div className="col-md-2">å¤§å°</div>123                            <div className="col-md-2">æä½</div>124                        </div>125                        <div className="values">126                            {value ? value.map(({name, path, size, mode, modifyTime}, i) =>127                                <div className="value">128                                    <div className="col-md-1">{i + 1}</div>129                                    <div className="col-md-7">{name}</div>130                                    <div className="col-md-2">{Math.round(size * 1000) / 1000 / 1000} KB</div>131                                    <div className="col-md-2 options">132                                        <span onClick={() => this.openNewVideoWindow(133                                            {name, path, size, mode, modifyTime})}>134                                            ä¸æ°135                                        </span>136                                    </div>137                                </div>) : ""}138                        </div>139                    </div>140                );141                that.setState({viewContentHTML});142            }143        });144        this.setState({showScanWindow: false});145    }146    openNewVideoWindow = ({name, path, size, mode, modifyTime}) => {147        const that = this;148        Req({149            method: "POST",150            url: "/backend/aip/video/ffmpeg",151            data: {path}152        }).then(value => {153            const {FFmpegJSON = "{}", id = 0, path = "", name = ""} = value;154            const {streams = [], format = {}} = JSON.parse(FFmpegJSON);155            const {codec_long_name, coded_width, coded_height} = streams[0];156            const {duration, size, filename} = format;157            const videoName = path.slice(path.lastIndexOf("/") + 1, path.length);158            that.setState({159                instance: {160                    id: id,161                    size: size,162                    width: coded_width,163                    height: coded_height,164                    duration: duration,165                    title: videoName166                },167                argsGroup: [168                    {label: "å¯ä¸æ è¯ç ", key: "name", val: name, viewOnly: true},169                    {label: "è§é¢åå¨è·¯å¾", key: "path", val: filename, viewOnly: true},170                    {label: "è§é¢ç¼ç ", key: "codec", val: codec_long_name, viewOnly: true},171                    {label: "å¤§å°", key: "size", val: size, viewOnly: true},172                    {label: "åè¾¨ç", key: "resolving", val: `${coded_width}*${coded_height}`, viewOnly: true},173                    {label: "æ¶é¿", key: "duration", val: parseFloat(duration), viewOnly: true},174                    {label: "è§é¢æ é¢", key: "title", placeholder: "è¾å¥è§é¢æ é¢", val: videoName},175                    {label: "æè¿°", key: "describe", placeholder: "è¾å¥è§é¢æè¿°ä¿¡æ¯", type: "multiline"},176                ],177                showNewVideoWindow: true178            });179        });180    }181    newVideo = value => {182        if (null == value) {183            return184        }185        const {instance} = this.state;186        if (value.name) {187            delete instance.name;188        }189        this.setState({showNewVideoWindow: false});190        Object.assign(instance, value);191        Req({192            method: "POST",193            url: "/backend/aip/video",194            data: instance195        }).then(() => {196            alert("åå»ºè§é¢æå");197        }).catch(({msg = ""}) => {198            alert("åå»ºè§é¢å¤±è´¥ã " + msg);199        });200    }201    clickPageItem(activeNum = 0) {202        this.setState({203            page: activeNum204        });205        this.renderVideoList();206    }207    renderVideoList = () => {208        const that = this;209        const {page = 0, count = 10} = this.state;210        Req({211            method: "GET",212            url: `/backend/aip/video/list?page=${page}&count=${count}`,213        }).then(value => {214            const {total, data = []} = value;215            that.setState({216                viewContentHTML: (217                    <div className="view">218                        <div className="title">219                            <div className="col-md-1"></div>220                            <div className="col-md-4">åç§°</div>221                            <div className="col-md-2">å¤§å°</div>222                            <div className="col-md-3">ä¿®æ¹æ¶é´</div>223                            <div className="col-md-2">æä½</div>224                        </div>225                        <div className="values">226                            {data ? data.map((v, i) => {227                                const {title, size, modifyTime} = v;228                                return (229                                    <div className="value">230                                        <div className="col-md-1">{i + 1}</div>231                                        <div className="col-md-4">{title}</div>232                                        <div233                                            className="col-md-2">{size / 1000 > 1000 ? size / 1000000 + " MB" : size / 1000 + " KB"}</div>234                                        <div className="col-md-3">{modifyTime}</div>235                                        <div className="col-md-2 options">236                                            <span onClick={() => this.showVideoDetail(v)}>è¯¦æ</span>237                                            <span onClick={() => this.showModifyVideo(v)}>ä¿®æ¹</span>238                                            <span onClick={() => this.showDeleteVideo(v)}>ä¸æ¶</span>239                                        </div>240                                    </div>)241                            }) : (<span className="no-value">æªä¸æ¶è§é¢</span>)}242                        </div>243                    </div>244                ),245                pageComponentHTML: (246                    <div className="view">247                        <PageComponent position="pull-left" activeNum={page} docCount={data ? data.length : 0}248                                       total={total}249                                       clickPageCallback={that.clickPageItem}/>250                    </div>251                )252            });253        }).catch(({code, message}) => {254            checkErrorCode(code);255        });256    }257    showVideoDetail = video => {258        const {title, name, describe, duration, height, width, size, path, createTime, modifyTime} = video;259        this.setState({260            showVideoDetailWindow: true,261            argsGroup: [262                {label: "è§é¢æ é¢", key: "title", val: title, viewOnly: true},263                {label: "ä¸æ°æ¶é´", key: "createTime", val: createTime, viewOnly: true},264                {label: "ä¸æ¶æ¶é´", key: "modifyTime", val: modifyTime, viewOnly: true},265                {label: "æè¿°", key: "describe", val: describe, type: "multiline", viewOnly: true},266                {label: "å¯ä¸æ è¯ç ", key: "name", val: name, viewOnly: true},267                {label: "è§é¢åå¨è·¯å¾", key: "path", val: path, viewOnly: true},268                {label: "å¤§å°", key: "size", val: size, viewOnly: true},269                {label: "åè¾¨ç", key: "resolving", val: `${width}*${height}`, viewOnly: true},270                {label: "æ¶é¿", key: "duration", val: duration + " ç§", viewOnly: true},271            ],272        });273    }274    videoDetail = () => {275        this.closeWindow();276    }277    showModifyVideo = video => {278        const {title, describe} = video;279        this.setState({280            showModifyVideoWindow: true,281            argsGroup: [282                {label: "è§é¢æ é¢", key: "title", val: title},283                {label: "æè¿°", key: "describe", val: describe, type: "multiline"},284            ],285            instance: video,286        });287    }288    modifyVideo = (value) => {289        const that = this;290        const {instance} = this.state;291        Object.assign(instance, value)292        Req({293            method: "POST",294            url: "/backend/aip/video",295            data: instance296        }).then(() => {297            that.renderVideoList();298        });299        this.closeWindow();300    }301    showDeleteVideo = video => {302        const {id, title} = video;303        this.setState({304            showDeleteVideoWindow: true,305            argsGroup: [],306            msg: "ç¡®è®¤ä¸æ¶è§é¢ " + title,307            instance: id,308        })309    }310    deleteVideo = () => {311        const that = this;312        const {instance} = this.state;313        Req({314            method: "DELETE",315            url: "/backend/aip/video?id=" + instance,316        }).then(() => {317            that.renderVideoList();318        });319        this.closeWindow();320    }321    render = () => {322        const {323            showScanWindow = false,324            showNewVideoWindow = false,325            showVideoDetailWindow = false,326            showModifyVideoWindow = false,327            showDeleteVideoWindow = false,328            argsGroup = [],329            viewContentHTML = "",330            pageComponentHTML = "",331            msg = ""332        } = this.state;333        return (334            <div className="main">335                <InputView showWindow={showScanWindow} title="è¾å¥æ«æç®å½" argsGroup={argsGroup}336                           then={this.scanDir} cannel={this.closeWindow}/>337                <InputView showWindow={showNewVideoWindow} title="è§é¢ä¸æ°" argsGroup={argsGroup}338                           then={this.newVideo} cannel={this.closeWindow}/>339                <InputView showWindow={showVideoDetailWindow} title="è§é¢è¯¦æ" argsGroup={argsGroup}340                           then={this.videoDetail} cannel={this.closeWindow}/>341                <InputView showWindow={showModifyVideoWindow} title="ä¿®æ¹è§é¢ä¿¡æ¯" argsGroup={argsGroup}342                           then={this.modifyVideo} cannel={this.closeWindow}/>343                <InputView showWindow={showDeleteVideoWindow} title="ç¡®è®¤ä¸æ¶è§é¢" msg={msg}344                           then={this.deleteVideo} cannel={this.closeWindow}/>345                <div className="top">346                    <div className="title">è§é¢ç®¡ç</div>347                    <div className="bar">348                        <div>349                            <div onClick={this.openScanWindow}>ç®å½æ«æ</div>350                            <div onClick={this.renderVideoList}>è§é¢åº</div>351                        </div>352                    </div>353                </div>354                {viewContentHTML}355                {pageComponentHTML}356            </div>357        );358    }359}360class NavConfigApp extends React.Component {361    constructor(props) {362        super(props);363        this.state = {};364    }365    componentDidMount() {366        this.loadData();367    }368    loadData = () => {369        let that = this;370        Req({371            method: "GET",372            url: "/backend/aip/dictionary/group",373        }).then(value => {374            if (value) {375                that.setState({nav: value});376            }377        }).catch(({code}) => {378            if (401 === code) {379                that.setState(() => ({380                    token: null,381                    who: null,382                }));383                that.setState({nav: []});384                // TODO385                alert("è¯·ç»å½");386            }387        });388    }389    renderGroupList = (dictionaryGroup = []) => dictionaryGroup.map((d, i) => {390        const {id, name, groupType, values = []} = d;391        return (392            <div>393                <div className="value" data={id}>394                    <div className="col-md-1">{i + 1}</div>395                    <div className="col-md-2">{name}</div>396                    <div className="col-md-5">{groupType}</div>397                    <div className="col-md-3 options">398                        <span index={i} onClick={this.openModifyDictionaryWindow}>ä¿®æ¹</span>399                        <span index={i} onClick={this.openDeleteDictionaryWindow}>å é¤</span>400                        <span index={i} onClick={this.openAppendDictionaryWindow}>æ°å¢åçº§</span>401                    </div>402                </div>403                {values ? values.map((v, j) => {404                    const {id, name, data} = v;405                    return (406                        <div className="value" data={id}>407                            <div className="col-md-2">{i + 1} - {j + 1}</div>408                            <div className="col-md-2">{name}</div>409                            <div className="col-md-5">{data}</div>410                            <div className="col-md-3 options">411                                <span onClick={() => this.openModifyDictionaryItemWindow(v)}>ä¿®æ¹</span>412                                <span onClick={() => this.openDeleteDictionaryItemWindow(v)}>å é¤</span>413                            </div>414                        </div>415                    );416                }) : ""}417            </div>418        )419    })420    openCreateDictionaryWindow = e => this.setState({421        showCreateDictionaryGroupWindow: true,422        argsGroup: [{label: "æ ç¾ç»å", key: "name"}, {label: "code", key: "groupType"}]423    })424    closeWindow = e => this.setState({425        showCreateDictionaryGroupWindow: false,426        showModifyDictionaryGroupWindow: false,427        showDeleteDictionaryGroupWindow: false,428        showAppendDictionaryWindow: false,429        showModifyDictionaryItemWindow: false,430        showDeleteDictionaryItemWindow: false,431    })432    createDictionaryGroup = value => {433        let that = this;434        Req({435            method: "PUT",436            url: "/backend/aip/dictionary/group",437            data: value438        }).then(data => {439            that.loadData();440        }).catch(({msg}) => {441            that.setState({err: msg});442        });443        that.setState({showCreateDictionaryGroupWindow: false});444    }445    openModifyDictionaryWindow = e => {446        const index = e.target.getAttribute("index");447        const {nav = []} = this.state;448        const {name, groupType} = nav[index] || {};449        this.setState({450            showModifyDictionaryGroupWindow: true,451            index,452            argsGroup: [{label: "æ ç¾ç»å", key: "name", val: name}, {label: "code", key: "groupType", val: groupType}]453        })454    }455    modifyDictionaryGroup = value => {456        if (null == value) {457            return458        }459        const {index, nav = []} = this.state;460        const {id, name, groupType} = nav[index] || {};461        const target = Object.assign({id, name, groupType}, value)462        let that = this;463        Req({464            method: "POST",465            url: "/backend/aip/dictionary/group",466            data: target467        }).then(data => {468            that.loadData();469        }).catch(({msg}) => {470            that.setState({err: msg});471        });472        that.setState({showModifyDictionaryGroupWindow: false});473    }474    openDeleteDictionaryWindow = e => {475        const index = e.target.getAttribute("index");476        const {nav = []} = this.state;477        this.setState({478            showDeleteDictionaryGroupWindow: true,479            msg: `ç¡®å®å é¤${nav[index].name}?`,480            index,481        });482    }483    deleteDictionaryGroup = () => {484        const {index, nav = []} = this.state;485        const {id} = nav[index] || {};486        let that = this;487        Req({488            method: "DELETE",489            url: "/backend/aip/dictionary/group?id=" + id,490        }).then(data => {491            that.loadData();492        }).catch(({msg}) => {493            that.setState({err: msg});494        });495        that.setState({showDeleteDictionaryGroupWindow: false});496    }497    openAppendDictionaryWindow = e => {498        const index = e.target.getAttribute("index");499        this.setState({500            showAppendDictionaryWindow: true,501            argsGroup: [{label: "æ ç¾å", key: "name"}, {label: "æ ç¾å¼", key: "data"}],502            index,503        });504    }505    appendDictionary = value => {506        const {index, nav = []} = this.state;507        const {id} = nav[index] || {};508        Object.assign(value, {groupID: id})509        let that = this;510        Req({511            method: "PUT",512            url: "/backend/aip/dictionary",513            data: value514        }).then(data => {515            that.loadData();516        }).catch(({msg}) => {517            that.setState({err: msg});518        });519        that.setState({showAppendDictionaryWindow: false});520    }521    openModifyDictionaryItemWindow = v => {522        this.setState({523            showModifyDictionaryItemWindow: true,524            argsGroup: [{label: "æ ç¾å", key: "name", val: v.name}, {label: "æ ç¾å¼", key: "data", val: v.data}],525            target: v,526        })527    }528    modifyDictionaryItem = value => {529        if (null == value) {530            return531        }532        const {target = {}} = this.state;533        Object.assign(target, value);534        let that = this;535        Req({536            method: "POST",537            url: "/backend/aip/dictionary",538            data: target539        }).then(() => {540            that.loadData();541        }).catch(({msg}) => {542            that.setState({err: msg});543        });544        that.setState({showModifyDictionaryItemWindow: false});545    }546    deleteDictionaryItem = () => {547        let that = this;548        const {target = {}} = this.state;549        Req({550            method: "DELETE",551            url: "/backend/aip/dictionary?id=" + target.id,552        }).then(data => {553            that.loadData();554        }).catch(({msg}) => {555            that.setState({err: msg});556        });557        that.setState({showDeleteDictionaryItemWindow: false});558    }559    openDeleteDictionaryItemWindow = v => {560        this.setState({561            showDeleteDictionaryItemWindow: true,562            msg: `ç¡®å®å é¤åæ ç¾ ${v.name}?`,563            target: v,564        });565    }566    render = () => {567        const {568            nav = [],569            showCreateDictionaryGroupWindow = false,570            showModifyDictionaryGroupWindow = false,571            showDeleteDictionaryGroupWindow = false,572            showAppendDictionaryWindow = false,573            showModifyDictionaryItemWindow = false,574            showDeleteDictionaryItemWindow = false,575            msg,576            argsGroup = []577        } = this.state;578        return (579            <div>580                <InputView showWindow={showCreateDictionaryGroupWindow} title="åå»ºæ ç¾ç»" argsGroup={argsGroup}581                           then={this.createDictionaryGroup} cannel={this.closeWindow}/>582                <InputView showWindow={showModifyDictionaryGroupWindow} title="ä¿®æ¹æ ç¾ç»" argsGroup={argsGroup}583                           then={this.modifyDictionaryGroup} cannel={this.closeWindow}/>584                <InputView showWindow={showDeleteDictionaryGroupWindow} title="å é¤æ ç¾ç»" msg={msg}585                           then={this.deleteDictionaryGroup} cannel={this.closeWindow}/>586                <InputView showWindow={showAppendDictionaryWindow} title="è¿½å åæ ç¾" argsGroup={argsGroup}587                           then={this.appendDictionary} cannel={this.closeWindow}/>588                <InputView showWindow={showModifyDictionaryItemWindow} title="ä¿®æ¹åæ ç¾" argsGroup={argsGroup}589                           then={this.modifyDictionaryItem} cannel={this.closeWindow}/>590                <InputView showWindow={showDeleteDictionaryItemWindow} title="å é¤åæ ç¾" msg={msg}591                           then={this.deleteDictionaryItem} cannel={this.closeWindow}/>592                <div className="main">593                    <div className="top">594                        <div className="title">å¯¼èªéç½®</div>595                        <div className="bar">596                            <div>597                                <div onClick={this.openCreateDictionaryWindow}>åå»ºå¯¼èª</div>598                                <div>å é¤å¯¼èª</div>599                            </div>600                        </div>601                    </div>602                    <div className="view">603                        <div className="title">604                            <div className="col-md-1"></div>605                            <div className="col-md-2">å¯¼èªåç§°</div>606                            <div className="col-md-5">æ ç¾å¼</div>607                            <div className="col-md-3">æä½</div>608                        </div>609                        <div className="values">610                            {this.renderGroupList(nav)}611                        </div>612                    </div>613                </div>614            </div>615        );616    }617}618class ToolsApp extends React.Component {619    constructor(props) {620        super(props);621        this.state = {};622    }623    renderMainView = (activeCode = 0) => {624        switch (activeCode) {625            case 0:626                return <NavConfigApp/>627            case 3:628                return <VideoManagerApp/>629        }630    };631    changeView = (activeCode = 0) => {632        this.setState({activeCode});633    }634    render() {635        const {activeCode = 0} = this.state;636        return (637            <div className="tools_app">638                <div className="left_control">639                    <div>640                        <div className="title"641                             onClick={e => window.location.href = "/video-storage/index.html"}>{"<- "}è¿åé¦é¡µ642                        </div>643                    </div>644                    <div className="line"/>645                    <div>646                        <div className="title">åå¸</div>647                        <div onClick={e => this.changeView(0)}648                             className={activeCode === 0 ? "item active" : "item"}>å¯¼èªéç½®649                        </div>650                        <div onClick={e => this.changeView(1)}651                             className={activeCode === 1 ? "item active" : "item"}>æ ç¾ç®¡ç652                        </div>653                        <div onClick={e => this.changeView(2)}654                             className={activeCode === 2 ? "item active" : "item"}>ç®å½éç½®655                        </div>656                    </div>657                    <div className="line"/>658                    <div>659                        <div className="title">åå®¹</div>660                        <div onClick={e => this.changeView(3)}661                             className={activeCode === 3 ? "item active" : "item"}>è§é¢ç®¡ç662                        </div>663                        <div onClick={e => this.changeView(4)}664                             className={activeCode === 4 ? "item active" : "item"}>å¾çç®¡ç665                        </div>666                        <div onClick={e => this.changeView(5)}667                             className={activeCode === 5 ? "item active" : "item"}>å°è¯´ç®¡ç668                        </div>669                        <div onClick={e => this.changeView(6)}670                             className={activeCode === 6 ? "item active" : "item"}>ç´æç®¡ç671                        </div>672                    </div>673                    <div className="line"/>674                    <div>675                        <div onClick={e => this.changeView(7)}676                             className={activeCode === 7 ? "item active" : "item"}>ç¨æ·677                        </div>678                        <div onClick={e => this.changeView(8)}679                             className={activeCode === 8 ? "item active" : "item"}>ç¨æ·ç®¡ç680                        </div>681                    </div>682                    <div className="bottom-view">683                        <div>684                            <div className="title">v 0.0.1</div>685                        </div>686                    </div>687                </div>688                {this.renderMainView(activeCode)}689            </div>690        );691    }692}...

liff-starter - Copy.js

Source:liff-starter - Copy.js

1window.onload = function (e) {2    liff.init(function (data) {3        initializeApp(data);4    });5};6function initializeApp(data) {7    document.getElementById('languagefield').textContent = data.language;8    document.getElementById('viewtypefield').textContent = data.context.viewType;9    document.getElementById('useridfield').textContent = data.context.userId;10    document.getElementById('utouidfield').textContent = data.context.utouId;11    document.getElementById('roomidfield').textContent = data.context.roomId;12    document.getElementById('groupidfield').textContent = data.context.groupId;13    // openWindow call14    document.getElementById('openwindowbutton').addEventListener('click', function () {15        liff.openWindow({16            url: 'https://line.me'17        });18    });19    // closeWindow call20    document.getElementById('closewindowbutton').addEventListener('click', function () {21        liff.closeWindow();22    });23    // sendMessages call24    document.getElementById('sendmessagebutton').addEventListener('click', function () {25        liff.sendMessages([{26            type: 'text',27            text: "à¸¢à¸´à¸à¹à¸à¸ª1"28        29        }]).then(function () {30            liff.closeWindow();31        }).catch(function (error) {32            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);33        });34    });35    // sendMessages call36    document.getElementById('sendmessagebutton2').addEventListener('click', function () {37        liff.sendMessages([{38            type: 'text',39            text: "à¸¢à¸´à¸à¹à¸à¸ª2"40        41        }]).then(function () {42            liff.closeWindow();43        }).catch(function (error) {44            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);45        });46    });47    // sendMessages call48    document.getElementById('sendmessagebutton3').addEventListener('click', function () {49        liff.sendMessages([{50            type: 'text',51            text: "à¸¢à¸´à¸à¹à¸à¸ª3"52        53        }]).then(function () {54            liff.closeWindow();55        }).catch(function (error) {56            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);57        });58    });59    // sendMessages call60    document.getElementById('sendmessagebutton4').addEventListener('click', function () {61        liff.sendMessages([{62            type: 'text',63            text: "à¸¢à¸´à¸à¸à¸¥à¸¸à¹à¸¡1"64        65        }]).then(function () {66            liff.closeWindow();67        }).catch(function (error) {68            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);69        });70    });71    // sendMessages call72    document.getElementById('sendmessagebutton5').addEventListener('click', function () {73        liff.sendMessages([{74            type: 'text',75            text: "à¸¢à¸´à¸à¸à¸¥à¸¸à¹à¸¡2"76        77        }]).then(function () {78            liff.closeWindow();79        }).catch(function (error) {80            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);81        });82    });83    // sendMessages call84    document.getElementById('sendmessagebutton6').addEventListener('click', function () {85        liff.sendMessages([{86            type: 'text',87            text: "à¸¢à¸´à¸à¸à¸¥à¸¸à¹à¸¡3"88        89        }]).then(function () {90            liff.closeWindow();91        }).catch(function (error) {92            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);93        });94    });95    // sendMessages call96    document.getElementById('sendmessagebutton7').addEventListener('click', function () {97        liff.sendMessages([{98            type: 'text',99            text: "/à¹à¸¡à¹à¹à¸à¸à¸à¸µà¹1"100        101        }]).then(function () {102            liff.closeWindow();103        }).catch(function (error) {104            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);105        });106    });107    // sendMessages call108    document.getElementById('sendmessagebutton8').addEventListener('click', function () {109        liff.sendMessages([{110            type: 'text',111            text: "/à¹à¸¡à¹à¹à¸à¸à¸à¸µà¹2"112        113        }]).then(function () {114            liff.closeWindow();115        }).catch(function (error) {116            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);117        });118    });119    // sendMessages call120    document.getElementById('sendmessagebutton9').addEventListener('click', function () {121        liff.sendMessages([{122            type: 'text',123            text: "/à¹à¸¡à¹à¹à¸à¸à¸à¸µà¹3"124        125        }]).then(function () {126            liff.closeWindow();127        }).catch(function (error) {128            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);129        });130    });131    // sendMessages call132    document.getElementById('sendmessagebutton10').addEventListener('click', function () {133        liff.sendMessages([{134            type: 'text',135            text: "à¸¢à¸´à¸à¹à¸à¸·à¹à¸à¸"136        137        }]).then(function () {138            liff.closeWindow();139        }).catch(function (error) {140            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);141        });142    });143    // sendMessages call144    document.getElementById('sendmessagebutton11').addEventListener('click', function () {145        liff.sendMessages([{146            type: 'text',147            text: "à¸à¸£à¸°à¸à¸²à¸¨à¹à¸à¸·à¹à¸à¸"148        149        }]).then(function () {150            liff.closeWindow();151        }).catch(function (error) {152            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);153        });154    });155    // sendMessages call156    document.getElementById('sendmessagebutton12').addEventListener('click', function () {157        liff.sendMessages([{158            type: 'text',159            text: "à¸à¸£à¸°à¸à¸²à¸¨à¸à¸²à¸¢à¸3"160        161        }]).then(function () {162            liff.closeWindow();163        }).catch(function (error) {164            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);165        });166    });167    // sendMessages call168    document.getElementById('sendmessagebutton13').addEventListener('click', function () {169        liff.sendMessages([{170            type: 'text',171            text: "à¸à¸²à¸¢à¸ªà¸´à¸à¸à¹à¸²"172        173        }]).then(function () {174            liff.closeWindow();175        }).catch(function (error) {176            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);177        });178    });179    // sendMessages call180    document.getElementById('sendmessagebutton14').addEventListener('click', function () {181        liff.sendMessages([{182            type: 'text',183            text: "à¸à¸£à¸°à¸à¸²à¸¨à¸à¸¥à¸¸à¹à¸¡2"184        185        }]).then(function () {186            liff.closeWindow();187        }).catch(function (error) {188            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);189        });190    });191    // sendMessages call192    document.getElementById('sendmessagebutton15').addEventListener('click', function () {193        liff.sendMessages([{194            type: 'text',195            text: "à¸à¸£à¸°à¸à¸²à¸¨à¸à¸¥à¸¸à¹à¸¡3"196        197        }]).then(function () {198            liff.closeWindow();199        }).catch(function (error) {200            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);201        });202    });203    // sendMessages call204    document.getElementById('sendmessagebutton16').addEventListener('click', function () {205        liff.sendMessages([{206            type: 'text',207            text: "/à¹à¸¡à¹à¹à¸à¸à¸ªà¹à¸¥à¸à¸µà¹1"208        209        }]).then(function () {210            liff.closeWindow();211        }).catch(function (error) {212            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);213        });214    });215    // sendMessages call216    document.getElementById('sendmessagebutton17').addEventListener('click', function () {217        liff.sendMessages([{218            type: 'text',219            text: "/à¹à¸¡à¹à¹à¸à¸à¸ªà¹à¸¥à¸à¸µà¹2"220        221        }]).then(function () {222            liff.closeWindow();223        }).catch(function (error) {224            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);225        });226    });227    // sendMessages call228    document.getElementById('sendmessagebutton18').addEventListener('click', function () {229        liff.sendMessages([{230            type: 'text',231            text: "/à¹à¸¡à¹à¹à¸à¸à¸ªà¹à¸¥à¸à¸µà¹3"232        233        }]).then(function () {234            liff.closeWindow();235        }).catch(function (error) {236            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);237        });238    });239    // sendMessages call240    document.getElementById('sendmessagebutton19').addEventListener('click', function () {241        liff.sendMessages([{242            type: 'text',243            text: "à¸¢à¸´à¸à¸£à¸¹à¸1"244        245        }]).then(function () {246            liff.closeWindow();247        }).catch(function (error) {248            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);249        });250    });251    // sendMessages call252    document.getElementById('sendmessagebutton20').addEventListener('click', function () {253        liff.sendMessages([{254            type: 'text',255            text: "à¸¢à¸´à¸à¸£à¸¹à¸2"256        257        }]).then(function () {258            liff.closeWindow();259        }).catch(function (error) {260            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);261        });262    });263    // sendMessages call264    document.getElementById('sendmessagebutton21').addEventListener('click', function () {265        liff.sendMessages([{266            type: 'text',267            text: "à¸¢à¸´à¸à¸£à¸¹à¸3"268        269        }]).then(function () {270            liff.closeWindow();271        }).catch(function (error) {272            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);273        });274    });275    // sendMessages call276    document.getElementById('sendmessagebutton22').addEventListener('click', function () {277        liff.sendMessages([{278            type: 'text',279            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸à¸¥à¸¸à¹à¸¡1"280        281        }]).then(function () {282            liff.closeWindow();283        }).catch(function (error) {284            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);285        });286    });287    // sendMessages call288    document.getElementById('sendmessagebutton23').addEventListener('click', function () {289        liff.sendMessages([{290            type: 'text',291            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸à¸¥à¸¸à¹à¸¡2"292        293        }]).then(function () {294            liff.closeWindow();295        }).catch(function (error) {296            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);297        });298    });299     // sendMessages call300    document.getElementById('sendmessagebutton24').addEventListener('click', function () {301        liff.sendMessages([{302            type: 'text',303            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸à¸¥à¸¸à¹à¸¡3"304        305        }]).then(function () {306            liff.closeWindow();307        }).catch(function (error) {308            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);309        });310    });311    // sendMessages call312    document.getElementById('sendmessagebutton25').addEventListener('click', function () {313        liff.sendMessages([{314            type: 'text',315            text: "/à¹à¸¡à¹à¹à¸à¸à¸£à¸¹à¸1"316        317        }]).then(function () {318            liff.closeWindow();319        }).catch(function (error) {320            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);321        });322    });323    // sendMessages call324    document.getElementById('sendmessagebutton26').addEventListener('click', function () {325        liff.sendMessages([{326            type: 'text',327            text: "/à¹à¸¡à¹à¹à¸à¸à¸£à¸¹à¸2"328        329        }]).then(function () {330            liff.closeWindow();331        }).catch(function (error) {332            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);333        });334    });335    // sendMessages call336    document.getElementById('sendmessagebutton27').addEventListener('click', function () {337        liff.sendMessages([{338            type: 'text',339            text: "/à¹à¸¡à¹à¹à¸à¸à¸£à¸¹à¸3"340        341        }]).then(function () {342            liff.closeWindow();343        }).catch(function (error) {344            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);345        });346    });347     // sendMessages call348    document.getElementById('sendmessagebutton28').addEventListener('click', function () {349        liff.sendMessages([{350            type: 'text',351            text: "à¸¢à¸´à¸01"352        353        }]).then(function () {354            liff.closeWindow();355        }).catch(function (error) {356            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);357        });358    });359    // sendMessages call360    document.getElementById('sendmessagebutton29').addEventListener('click', function () {361        liff.sendMessages([{362            type: 'text',363            text: "à¸¢à¸´à¸02"364        365        }]).then(function () {366            liff.closeWindow();367        }).catch(function (error) {368            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);369        });370    });371    // sendMessages call372    document.getElementById('sendmessagebutton30').addEventListener('click', function () {373        liff.sendMessages([{374            type: 'text',375            text: "à¸¢à¸´à¸03"376        377        }]).then(function () {378            liff.closeWindow();379        }).catch(function (error) {380            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);381        });382    });383    // sendMessages call384    document.getElementById('sendmessagebutton31').addEventListener('click', function () {385        liff.sendMessages([{386            type: 'text',387            text: "à¸ªà¸¹à¹à¸à¸¥à¸¸à¹à¸¡01"388        389        }]).then(function () {390            liff.closeWindow();391        }).catch(function (error) {392            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);393        });394    });395    // sendMessages call396    document.getElementById('sendmessagebutton32').addEventListener('click', function () {397        liff.sendMessages([{398            type: 'text',399            text: "à¸ªà¸¹à¹à¸à¸¥à¸¸à¹à¸¡02"400        401        }]).then(function () {402            liff.closeWindow();403        }).catch(function (error) {404            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);405        });406    });407    // sendMessages call408    document.getElementById('sendmessagebutton33').addEventListener('click', function () {409        liff.sendMessages([{410            type: 'text',411            text: "à¸ªà¸¹à¹à¸à¸¥à¸¸à¹à¸¡03"412        413        }]).then(function () {414            liff.closeWindow();415        }).catch(function (error) {416            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);417        });418    });419    // sendMessages call420    document.getElementById('sendmessagebutton34').addEventListener('click', function () {421        liff.sendMessages([{422            type: 'text',423            text: "/à¹à¸¡à¹à¹à¸à¸à¹à¸«à¸¡à¹1"424        425        }]).then(function () {426            liff.closeWindow();427        }).catch(function (error) {428            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);429        });430    });431    // sendMessages call432    document.getElementById('sendmessagebutton35').addEventListener('click', function () {433        liff.sendMessages([{434            type: 'text',435            text: "/à¹à¸¡à¹à¹à¸à¸à¹à¸«à¸¡à¹2"436        437        }]).then(function () {438            liff.closeWindow();439        }).catch(function (error) {440            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);441        });442    });443    // sendMessages call444    document.getElementById('sendmessagebutton36').addEventListener('click', function () {445        liff.sendMessages([{446            type: 'text',447            text: "/à¹à¸¡à¹à¹à¸à¸à¹à¸«à¸¡à¹3"448        449        }]).then(function () {450            liff.closeWindow();451        }).catch(function (error) {452            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);453        });454    });455    // sendMessages call456    document.getElementById('sendmessagebutton37').addEventListener('click', function () {457        liff.sendMessages([{458            type: 'text',459            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸ªà¹à¸¥1"460        461        }]).then(function () {462            liff.closeWindow();463        }).catch(function (error) {464            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);465        });466    });467    // sendMessages call468    document.getElementById('sendmessagebutton38').addEventListener('click', function () {469        liff.sendMessages([{470            type: 'text',471            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸ªà¹à¸¥2"472        473        }]).then(function () {474            liff.closeWindow();475        }).catch(function (error) {476            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);477        });478    });479    // sendMessages call480    document.getElementById('sendmessagebutton39').addEventListener('click', function () {481        liff.sendMessages([{482            type: 'text',483            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸ªà¹à¸¥3"484        485        }]).then(function () {486            liff.closeWindow();487        }).catch(function (error) {488            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);489        });490    });491    // sendMessages call492    document.getElementById('sendmessagebutton40').addEventListener('click', function () {493        liff.sendMessages([{494            type: 'text',495            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸à¸¥à¸¸à¹à¸¡à¸ªà¹à¸¥1"496        497        }]).then(function () {498            liff.closeWindow();499        }).catch(function (error) {500            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);501        });502    });503    // sendMessages call504    document.getElementById('sendmessagebutton41').addEventListener('click', function () {505        liff.sendMessages([{506            type: 'text',507            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸à¸¥à¸¸à¹à¸¡à¸ªà¹à¸¥2"508        509        }]).then(function () {510            liff.closeWindow();511        }).catch(function (error) {512            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);513        });514    });515    // sendMessages call516    document.getElementById('sendmessagebutton42').addEventListener('click', function () {517        liff.sendMessages([{518            type: 'text',519            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸à¸¥à¸¸à¹à¸¡à¸ªà¹à¸¥3"520        521        }]).then(function () {522            liff.closeWindow();523        }).catch(function (error) {524            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);525        });526    });527    // sendMessages call528    document.getElementById('sendmessagebutton43').addEventListener('click', function () {529        liff.sendMessages([{530            type: 'text',531            text: "/à¸¢à¸´à¸à¸£à¸¹à¸à¸ªà¹à¸¥1"532        533        }]).then(function () {534            liff.closeWindow();535        }).catch(function (error) {536            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);537        });538    });539     // sendMessages call540    document.getElementById('sendmessagebutton44').addEventListener('click', function () {541        liff.sendMessages([{542            type: 'text',543            text: "/à¸¢à¸´à¸à¸£à¸¹à¸à¸ªà¹à¸¥2"544        545        }]).then(function () {546            liff.closeWindow();547        }).catch(function (error) {548            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);549        });550    });551    // sendMessages call552    document.getElementById('sendmessagebutton45').addEventListener('click', function () {553        liff.sendMessages([{554            type: 'text',555            text: "/à¸¢à¸´à¸à¸£à¸¹à¸à¸ªà¹à¸¥3"556        557        }]).then(function () {558            liff.closeWindow();559        }).catch(function (error) {560            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);561        });562    });563    // get access token564    document.getElementById('getaccesstoken').addEventListener('click', function () {565        const accessToken = liff.getAccessToken();566        document.getElementById('accesstokenfield').textContent = accessToken;567        toggleAccessToken();568    });569    // get profile call570    document.getElementById('getprofilebutton').addEventListener('click', function () {571        liff.getProfile().then(function (profile) {572            document.getElementById('useridprofilefield').textContent = profile.userId;573            document.getElementById('displaynamefield').textContent = profile.displayName;574            const profilePictureDiv = document.getElementById('profilepicturediv');575            if (profilePictureDiv.firstElementChild) {576                profilePictureDiv.removeChild(profilePictureDiv.firstElementChild);577            }578            const img = document.createElement('img');579            img.src = profile.pictureUrl;580            img.alt = "Profile Picture";581            profilePictureDiv.appendChild(img);582            document.getElementById('statusmessagefield').textContent = profile.statusMessage;583            toggleProfileData();584        }).catch(function (error) {585            window.alert("Error getting profile: " + error);586        });587    });588}589function toggleAccessToken() {590    toggleElement('accesstokendata');591}592function toggleProfileData() {593    toggleElement('profileinfo');594}595function toggleElement(elementId) {596    const elem = document.getElementById(elementId);597    if (elem.offsetWidth > 0 && elem.offsetHeight > 0) {598        elem.style.display = "none";599    } else {600        elem.style.display = "block";601    }...

liff-starter.js

Source:liff-starter.js

1window.onload = function (e) {2    liff.init(function (data) {3        initializeApp(data);4    });5};6function initializeApp(data) {7    document.getElementById('languagefield').textContent = data.language;8    document.getElementById('viewtypefield').textContent = data.context.viewType;9    document.getElementById('useridfield').textContent = data.context.userId;10    document.getElementById('utouidfield').textContent = data.context.utouId;11    document.getElementById('roomidfield').textContent = data.context.roomId;12    document.getElementById('groupidfield').textContent = data.context.groupId;13    // openWindow call14    document.getElementById('openwindowbutton').addEventListener('click', function () {15        liff.openWindow({16            url: 'https://line.me'17        });18    });19    // closeWindow call20    document.getElementById('closewindowbutton').addEventListener('click', function () {21        liff.closeWindow();22    });23    // sendMessages call24    document.getElementById('sendmessagebutton').addEventListener('click', function () {25        liff.sendMessages([{26            type: 'text',27            text: "à¸¢à¸´à¸à¹à¸à¸ª1"28        29        }]).then(function () {30            liff.closeWindow();31        }).catch(function (error) {32            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);33        });34    });35    // sendMessages call36    document.getElementById('sendmessagebutton2').addEventListener('click', function () {37        liff.sendMessages([{38            type: 'text',39            text: "à¸¢à¸´à¸à¹à¸à¸ª2"40        41        }]).then(function () {42            liff.closeWindow();43        }).catch(function (error) {44            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);45        });46    });47    // sendMessages call48    document.getElementById('sendmessagebutton3').addEventListener('click', function () {49        liff.sendMessages([{50            type: 'text',51            text: "à¸¢à¸´à¸à¹à¸à¸ª3"52        53        }]).then(function () {54            liff.closeWindow();55        }).catch(function (error) {56            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);57        });58    });59    // sendMessages call60    document.getElementById('sendmessagebutton4').addEventListener('click', function () {61        liff.sendMessages([{62            type: 'text',63            text: "à¸¢à¸´à¸à¸à¸¥à¸¸à¹à¸¡1"64        65        }]).then(function () {66            liff.closeWindow();67        }).catch(function (error) {68            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);69        });70    });71    // sendMessages call72    document.getElementById('sendmessagebutton5').addEventListener('click', function () {73        liff.sendMessages([{74            type: 'text',75            text: "à¸¢à¸´à¸à¸à¸¥à¸¸à¹à¸¡2"76        77        }]).then(function () {78            liff.closeWindow();79        }).catch(function (error) {80            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);81        });82    });83    // sendMessages call84    document.getElementById('sendmessagebutton6').addEventListener('click', function () {85        liff.sendMessages([{86            type: 'text',87            text: "à¸¢à¸´à¸à¸à¸¥à¸¸à¹à¸¡3"88        89        }]).then(function () {90            liff.closeWindow();91        }).catch(function (error) {92            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);93        });94    });95    // sendMessages call96    document.getElementById('sendmessagebutton7').addEventListener('click', function () {97        liff.sendMessages([{98            type: 'text',99            text: "/à¹à¸¡à¹à¹à¸à¸à¸à¸µà¹1"100        101        }]).then(function () {102            liff.closeWindow();103        }).catch(function (error) {104            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);105        });106    });107    // sendMessages call108    document.getElementById('sendmessagebutton8').addEventListener('click', function () {109        liff.sendMessages([{110            type: 'text',111            text: "/à¹à¸¡à¹à¹à¸à¸à¸à¸µà¹2"112        113        }]).then(function () {114            liff.closeWindow();115        }).catch(function (error) {116            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);117        });118    });119    // sendMessages call120    document.getElementById('sendmessagebutton9').addEventListener('click', function () {121        liff.sendMessages([{122            type: 'text',123            text: "/à¹à¸¡à¹à¹à¸à¸à¸à¸µà¹3"124        125        }]).then(function () {126            liff.closeWindow();127        }).catch(function (error) {128            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);129        });130    });131    // sendMessages call132    document.getElementById('sendmessagebutton10').addEventListener('click', function () {133        liff.sendMessages([{134            type: 'text',135            text: "à¸¢à¸´à¸à¹à¸à¸·à¹à¸à¸"136        137        }]).then(function () {138            liff.closeWindow();139        }).catch(function (error) {140            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);141        });142    });143    // sendMessages call144    document.getElementById('sendmessagebutton11').addEventListener('click', function () {145        liff.sendMessages([{146            type: 'text',147            text: "à¸à¸£à¸°à¸à¸²à¸¨à¹à¸à¸·à¹à¸à¸"148        149        }]).then(function () {150            liff.closeWindow();151        }).catch(function (error) {152            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);153        });154    });155    // sendMessages call156    document.getElementById('sendmessagebutton12').addEventListener('click', function () {157        liff.sendMessages([{158            type: 'text',159            text: "à¸à¸£à¸°à¸à¸²à¸¨à¸à¸²à¸¢à¸3"160        161        }]).then(function () {162            liff.closeWindow();163        }).catch(function (error) {164            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);165        });166    });167    // sendMessages call168    document.getElementById('sendmessagebutton13').addEventListener('click', function () {169        liff.sendMessages([{170            type: 'text',171            text: "à¸à¸²à¸¢à¸ªà¸´à¸à¸à¹à¸²"172        173        }]).then(function () {174            liff.closeWindow();175        }).catch(function (error) {176            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);177        });178    });179    // sendMessages call180    document.getElementById('sendmessagebutton14').addEventListener('click', function () {181        liff.sendMessages([{182            type: 'text',183            text: "à¸à¸£à¸°à¸à¸²à¸¨à¸à¸¥à¸¸à¹à¸¡2"184        185        }]).then(function () {186            liff.closeWindow();187        }).catch(function (error) {188            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);189        });190    });191    // sendMessages call192    document.getElementById('sendmessagebutton15').addEventListener('click', function () {193        liff.sendMessages([{194            type: 'text',195            text: "à¸à¸£à¸°à¸à¸²à¸¨à¸à¸¥à¸¸à¹à¸¡3"196        197        }]).then(function () {198            liff.closeWindow();199        }).catch(function (error) {200            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);201        });202    });203    // sendMessages call204    document.getElementById('sendmessagebutton16').addEventListener('click', function () {205        liff.sendMessages([{206            type: 'text',207            text: "/à¹à¸¡à¹à¹à¸à¸à¸ªà¹à¸¥à¸à¸µà¹1"208        209        }]).then(function () {210            liff.closeWindow();211        }).catch(function (error) {212            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);213        });214    });215    // sendMessages call216    document.getElementById('sendmessagebutton17').addEventListener('click', function () {217        liff.sendMessages([{218            type: 'text',219            text: "/à¹à¸¡à¹à¹à¸à¸à¸ªà¹à¸¥à¸à¸µà¹2"220        221        }]).then(function () {222            liff.closeWindow();223        }).catch(function (error) {224            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);225        });226    });227    // sendMessages call228    document.getElementById('sendmessagebutton18').addEventListener('click', function () {229        liff.sendMessages([{230            type: 'text',231            text: "/à¹à¸¡à¹à¹à¸à¸à¸ªà¹à¸¥à¸à¸µà¹3"232        233        }]).then(function () {234            liff.closeWindow();235        }).catch(function (error) {236            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);237        });238    });239    // sendMessages call240    document.getElementById('sendmessagebutton19').addEventListener('click', function () {241        liff.sendMessages([{242            type: 'text',243            text: "à¸¢à¸´à¸à¸£à¸¹à¸1"244        245        }]).then(function () {246            liff.closeWindow();247        }).catch(function (error) {248            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);249        });250    });251    // sendMessages call252    document.getElementById('sendmessagebutton20').addEventListener('click', function () {253        liff.sendMessages([{254            type: 'text',255            text: "à¸¢à¸´à¸à¸£à¸¹à¸2"256        257        }]).then(function () {258            liff.closeWindow();259        }).catch(function (error) {260            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);261        });262    });263    // sendMessages call264    document.getElementById('sendmessagebutton21').addEventListener('click', function () {265        liff.sendMessages([{266            type: 'text',267            text: "à¸¢à¸´à¸à¸£à¸¹à¸3"268        269        }]).then(function () {270            liff.closeWindow();271        }).catch(function (error) {272            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);273        });274    });275    // sendMessages call276    document.getElementById('sendmessagebutton22').addEventListener('click', function () {277        liff.sendMessages([{278            type: 'text',279            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸à¸¥à¸¸à¹à¸¡1"280        281        }]).then(function () {282            liff.closeWindow();283        }).catch(function (error) {284            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);285        });286    });287    // sendMessages call288    document.getElementById('sendmessagebutton23').addEventListener('click', function () {289        liff.sendMessages([{290            type: 'text',291            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸à¸¥à¸¸à¹à¸¡2"292        293        }]).then(function () {294            liff.closeWindow();295        }).catch(function (error) {296            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);297        });298    });299     // sendMessages call300    document.getElementById('sendmessagebutton24').addEventListener('click', function () {301        liff.sendMessages([{302            type: 'text',303            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸à¸¥à¸¸à¹à¸¡3"304        305        }]).then(function () {306            liff.closeWindow();307        }).catch(function (error) {308            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);309        });310    });311    // sendMessages call312    document.getElementById('sendmessagebutton25').addEventListener('click', function () {313        liff.sendMessages([{314            type: 'text',315            text: "/à¹à¸¡à¹à¹à¸à¸à¸£à¸¹à¸1"316        317        }]).then(function () {318            liff.closeWindow();319        }).catch(function (error) {320            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);321        });322    });323    // sendMessages call324    document.getElementById('sendmessagebutton26').addEventListener('click', function () {325        liff.sendMessages([{326            type: 'text',327            text: "/à¹à¸¡à¹à¹à¸à¸à¸£à¸¹à¸2"328        329        }]).then(function () {330            liff.closeWindow();331        }).catch(function (error) {332            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);333        });334    });335    // sendMessages call336    document.getElementById('sendmessagebutton27').addEventListener('click', function () {337        liff.sendMessages([{338            type: 'text',339            text: "/à¹à¸¡à¹à¹à¸à¸à¸£à¸¹à¸3"340        341        }]).then(function () {342            liff.closeWindow();343        }).catch(function (error) {344            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);345        });346    });347     // sendMessages call348    document.getElementById('sendmessagebutton28').addEventListener('click', function () {349        liff.sendMessages([{350            type: 'text',351            text: "à¸¢à¸´à¸01"352        353        }]).then(function () {354            liff.closeWindow();355        }).catch(function (error) {356            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);357        });358    });359    // sendMessages call360    document.getElementById('sendmessagebutton29').addEventListener('click', function () {361        liff.sendMessages([{362            type: 'text',363            text: "à¸¢à¸´à¸02"364        365        }]).then(function () {366            liff.closeWindow();367        }).catch(function (error) {368            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);369        });370    });371    // sendMessages call372    document.getElementById('sendmessagebutton30').addEventListener('click', function () {373        liff.sendMessages([{374            type: 'text',375            text: "à¸¢à¸´à¸03"376        377        }]).then(function () {378            liff.closeWindow();379        }).catch(function (error) {380            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);381        });382    });383    // sendMessages call384    document.getElementById('sendmessagebutton31').addEventListener('click', function () {385        liff.sendMessages([{386            type: 'text',387            text: "à¸ªà¸¹à¹à¸à¸¥à¸¸à¹à¸¡01"388        389        }]).then(function () {390            liff.closeWindow();391        }).catch(function (error) {392            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);393        });394    });395    // sendMessages call396    document.getElementById('sendmessagebutton32').addEventListener('click', function () {397        liff.sendMessages([{398            type: 'text',399            text: "à¸ªà¸¹à¹à¸à¸¥à¸¸à¹à¸¡02"400        401        }]).then(function () {402            liff.closeWindow();403        }).catch(function (error) {404            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);405        });406    });407    // sendMessages call408    document.getElementById('sendmessagebutton33').addEventListener('click', function () {409        liff.sendMessages([{410            type: 'text',411            text: "à¸ªà¸¹à¹à¸à¸¥à¸¸à¹à¸¡03"412        413        }]).then(function () {414            liff.closeWindow();415        }).catch(function (error) {416            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);417        });418    });419    // sendMessages call420    document.getElementById('sendmessagebutton34').addEventListener('click', function () {421        liff.sendMessages([{422            type: 'text',423            text: "/à¹à¸¡à¹à¹à¸à¸à¹à¸«à¸¡à¹1"424        425        }]).then(function () {426            liff.closeWindow();427        }).catch(function (error) {428            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);429        });430    });431    // sendMessages call432    document.getElementById('sendmessagebutton35').addEventListener('click', function () {433        liff.sendMessages([{434            type: 'text',435            text: "/à¹à¸¡à¹à¹à¸à¸à¹à¸«à¸¡à¹2"436        437        }]).then(function () {438            liff.closeWindow();439        }).catch(function (error) {440            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);441        });442    });443    // sendMessages call444    document.getElementById('sendmessagebutton36').addEventListener('click', function () {445        liff.sendMessages([{446            type: 'text',447            text: "/à¹à¸¡à¹à¹à¸à¸à¹à¸«à¸¡à¹3"448        449        }]).then(function () {450            liff.closeWindow();451        }).catch(function (error) {452            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);453        });454    });455    // sendMessages call456    document.getElementById('sendmessagebutton37').addEventListener('click', function () {457        liff.sendMessages([{458            type: 'text',459            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸ªà¹à¸¥1"460        461        }]).then(function () {462            liff.closeWindow();463        }).catch(function (error) {464            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);465        });466    });467    // sendMessages call468    document.getElementById('sendmessagebutton38').addEventListener('click', function () {469        liff.sendMessages([{470            type: 'text',471            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸ªà¹à¸¥2"472        473        }]).then(function () {474            liff.closeWindow();475        }).catch(function (error) {476            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);477        });478    });479    // sendMessages call480    document.getElementById('sendmessagebutton39').addEventListener('click', function () {481        liff.sendMessages([{482            type: 'text',483            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸ªà¹à¸¥3"484        485        }]).then(function () {486            liff.closeWindow();487        }).catch(function (error) {488            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);489        });490    });491    // sendMessages call492    document.getElementById('sendmessagebutton40').addEventListener('click', function () {493        liff.sendMessages([{494            type: 'text',495            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸à¸¥à¸¸à¹à¸¡à¸ªà¹à¸¥1"496        497        }]).then(function () {498            liff.closeWindow();499        }).catch(function (error) {500            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);501        });502    });503    // sendMessages call504    document.getElementById('sendmessagebutton41').addEventListener('click', function () {505        liff.sendMessages([{506            type: 'text',507            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸à¸¥à¸¸à¹à¸¡à¸ªà¹à¸¥2"508        509        }]).then(function () {510            liff.closeWindow();511        }).catch(function (error) {512            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);513        });514    });515    // sendMessages call516    document.getElementById('sendmessagebutton42').addEventListener('click', function () {517        liff.sendMessages([{518            type: 'text',519            text: "à¸¢à¸´à¸à¸£à¸¹à¸à¸à¸¥à¸¸à¹à¸¡à¸ªà¹à¸¥3"520        521        }]).then(function () {522            liff.closeWindow();523        }).catch(function (error) {524            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);525        });526    });527    // sendMessages call528    document.getElementById('sendmessagebutton43').addEventListener('click', function () {529        liff.sendMessages([{530            type: 'text',531            text: "/à¸¢à¸´à¸à¸£à¸¹à¸à¸ªà¹à¸¥1"532        533        }]).then(function () {534            liff.closeWindow();535        }).catch(function (error) {536            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);537        });538    });539     // sendMessages call540    document.getElementById('sendmessagebutton44').addEventListener('click', function () {541        liff.sendMessages([{542            type: 'text',543            text: "/à¸¢à¸´à¸à¸£à¸¹à¸à¸ªà¹à¸¥2"544        545        }]).then(function () {546            liff.closeWindow();547        }).catch(function (error) {548            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);549        });550    });551    // sendMessages call552    document.getElementById('sendmessagebutton45').addEventListener('click', function () {553        liff.sendMessages([{554            type: 'text',555            text: "/à¸¢à¸´à¸à¸£à¸¹à¸à¸ªà¹à¸¥3"556        557        }]).then(function () {558            liff.closeWindow();559        }).catch(function (error) {560            window.alert("à¹à¸¡à¹à¸ªà¸²à¸¡à¸²à¸£à¸à¸ªà¹à¸à¹à¸à¹: " + error);561        });562    });563    // get access token564    document.getElementById('getaccesstoken').addEventListener('click', function () {565        const accessToken = liff.getAccessToken();566        document.getElementById('accesstokenfield').textContent = accessToken;567        toggleAccessToken();568    });569    // get profile call570    document.getElementById('getprofilebutton').addEventListener('click', function () {571        liff.getProfile().then(function (profile) {572            document.getElementById('useridprofilefield').textContent = profile.userId;573            document.getElementById('displaynamefield').textContent = profile.displayName;574            const profilePictureDiv = document.getElementById('profilepicturediv');575            if (profilePictureDiv.firstElementChild) {576                profilePictureDiv.removeChild(profilePictureDiv.firstElementChild);577            }578            const img = document.createElement('img');579            img.src = profile.pictureUrl;580            img.alt = "Profile Picture";581            profilePictureDiv.appendChild(img);582            document.getElementById('statusmessagefield').textContent = profile.statusMessage;583            toggleProfileData();584        }).catch(function (error) {585            window.alert("Error getting profile: " + error);586        });587    });588}589function toggleAccessToken() {590    toggleElement('accesstokendata');591}592function toggleProfileData() {593    toggleElement('profileinfo');594}595function toggleElement(elementId) {596    const elem = document.getElementById(elementId);597    if (elem.offsetWidth > 0 && elem.offsetHeight > 0) {598        elem.style.display = "none";599    } else {600        elem.style.display = "block";601    }...

WindowsArea.js

Source:WindowsArea.js

1import React, { useState, useContext } from "react";2//Components3import Fenetre from "../Fenetres/Fenetre";4import ContentPdt from "../Fenetres/ContentPdt";5import ContentTrash from "../Fenetres/ContentTrash";6import ContentCv from "../Fenetres/ContentCv";7import ContentProjets from "../Fenetres/ContentProjets";8import ContentInternet from "../Fenetres/ContentInternet"9import ContentImages from "../Fenetres/ContentImages";10import ContentPopup from "../Fenetres/ContentPopup";11import ContentNotepad from "../Fenetres/ContentNotepad";12import Form from "../Fenetres/Form";13import postetravail from "../../assets/5131-tOo-Postedetravail.png";14import logointernet from "../../assets/internetlogo.png";15import notepadlogo from "../../assets/Notepad_Vista_10.png"16import Piano from "./../Fenetres/Piano"17//Assets18import Icone from "../Icones/Icone";19import trashlogo from "../../assets/ModernXP-76-Trash-Full-icon.png";20import ContentFormations from "../Fenetres/ContentFormations";21import ContentCompetences from "../Fenetres/ContentCompetences";22//Context23import LangContext from "../Context/LangContext"24function WindowsArea(props) {25  const [fullScreenPdt, setFullscreenPdt] = useState(false);26  const [fullScreenPopup, setFullscreenPopup] = useState(false);27  const [fullScreenInternet, setFullScreenInternet] = useState(false);28  const [fullScreenContact, setFullScreenContact] = useState(false);29  const [fullScreenTrash, setFullScreenTrash] = useState(false);30  const [fullScreenCv, setfullScreenCv] = useState(false);31  const [fullScreenProjets, setfullScreenProjets] = useState(false);32  const [fullScreenImages, setFullscreenImages] = useState(false);33  const [fullScreenFormations, setFullscreenFormations] = useState(false);34  const [fullScreenCompetences, setFullscreenCompetences] = useState(false);35  const [fullScreenPiano, setFullscreenPiano] = useState(false);36  const [fullScreenNotepad, setFullscreenNotepad] = useState(false);37  const [pianowidth, setPianoWidth] = useState('490')38  const [scale, setScale] = useState(1)39  const lang = useContext(LangContext);40  const enTrue = lang.language === "English"41  //Augmenter l'Ã©chelle quand le cv est fullscreen42  function setthatScale() {43    fullScreenCv ? setScale(1) : setScale(1.8);44  }45  //Fullscreen state pour chaque fenetre46  function makefullScreen(win) {47    if (win === "Poste de travail" || win === "Computer") setFullscreenPdt(!fullScreenPdt);48    else if (win === "Popup") setFullscreenPopup(!fullScreenPopup);49    else if (win === "Internet Explorer") setFullScreenInternet(!fullScreenInternet);50    else if (win === "Me contacter" || win === "Contact Me") setFullScreenContact(!fullScreenContact);51    else if (win === "Mes Projets" || win === "My Projects") setfullScreenProjets(!fullScreenProjets);52    else if (win === "Corbeille" || win === "Trash") setFullScreenTrash(!fullScreenTrash);53    else if (win === "Mes Images" || win === "My Pictures") setFullscreenImages(!fullScreenImages);54    else if (win === "Mes Formations" || win === "My Education") setFullscreenFormations(!fullScreenFormations);55    else if (win === "Mes CompÃ©tences" || win === "My Skills") setFullscreenCompetences(!fullScreenCompetences);56    else if (win === "Bloc-notes" || win === "Notepad") setFullscreenNotepad(!fullScreenNotepad);57    else if (win === "Piano") { setFullscreenPiano(!fullScreenPiano); setPianoWidth(800) }58    else if ((win === "Mon Cv.pdf" || win === "Resume.pdf") && fullScreenCv === false) { setfullScreenCv(true); setthatScale() };59    if ((win === "Mon Cv.pdf" || win === "Resume.pdf") && fullScreenCv) { setfullScreenCv(false); setthatScale() }60  }61  //fermer le menu deroulant ou la fenetre langue quand le bureau est cliquÃ©62  function closeAll() {63    props.closemenu();64    props.closelang()65  }66  return (67    <div className="windows_all" onClick={() => closeAll()}>68      {props.windowsArray.map((window, index) => {69        if (window === "Poste de travail" && props.posteTravail === true)70          return (71            <Fenetre72              putOnTop={props.putOnTop}73              key={window}74              closeWindow={props.closeWindow}75              hideWindow={props.hideWindow}76              width={"65vw"}77              height={"50vh"}78              text={enTrue ? "Computer" : "Poste de travail"}79              logo={postetravail}80              content={<ContentPdt />}81              array={props.windowsArray}82              moveItem={props.moveItem}83              makefullScreen={makefullScreen}84              fullScreen={fullScreenPdt}85            />86          );87        else if (window === "Piano" && props.piano === true)88          return (89            <Fenetre90              putOnTop={props.putOnTop}91              key={window}92              content={<Piano pianowidth />}93              width={"500px"}94              height={"150px"}95              closeWindow={props.closeWindow}96              text={"Piano"}97              logo={98                "https://www.pngrepo.com/png/38467/512/piano-top-view.png"99              }100              hideWindow={props.hideWindow}101              array={props.windowsArray}102              moveItem={props.moveItem}103              makefullScreen={makefullScreen}104              fullScreen={fullScreenPiano}105            />106          );107        else if (window === "Bloc-notes" && props.notepad === true)108          return (109            <Fenetre110              putOnTop={props.putOnTop}111              key={window}112              content={<ContentNotepad />}113              width={"500px"}114              height={"350px"}115              closeWindow={props.closeWindow}116              text={enTrue ? "Notepad" : "Bloc-notes"}117              logo={118                notepadlogo119              }120              hideWindow={props.hideWindow}121              array={props.windowsArray}122              moveItem={props.moveItem}123              makefullScreen={makefullScreen}124              fullScreen={fullScreenNotepad}125            />126          );127        else if (window === "Popup" && props.popup === true)128          return (129            <Fenetre130              putOnTop={props.putOnTop}131              key={window}132              content={<ContentPopup />}133              width={"500px"}134              height={"380px"}135              closeWindow={props.closeWindow}136              text={"Popup"}137              logo={138                logointernet139              }140              hideWindow={props.hideWindow}141              array={props.windowsArray}142              moveItem={props.moveItem}143              makefullScreen={makefullScreen}144              fullScreen={fullScreenPopup}145            />146          );147        else if (window === "Mes Images" && props.mesimages === true)148          return (149            <Fenetre150              putOnTop={props.putOnTop}151              key={window}152              content={<ContentImages />}153              width={"700px"}154              height={"500px"}155              closeWindow={props.closeWindow}156              text={enTrue ? "My Pictures" : "Mes Images"}157              logo={158                "https://icons.iconarchive.com/icons/dtafalonso/modern-xp/256/ModernXP-62-Folder-Images-icon.png"159              }160              hideWindow={props.hideWindow}161              array={props.windowsArray}162              moveItem={props.moveItem}163              makefullScreen={makefullScreen}164              fullScreen={fullScreenImages}165            />166          );167        else if (window === "Mes Formations" && props.mesformations === true)168          return (169            <Fenetre170              putOnTop={props.putOnTop}171              key={window}172              content={<ContentFormations />}173              width={"700px"}174              height={"500px"}175              closeWindow={props.closeWindow}176              text={enTrue ? "My Education" : "Mes Formations"}177              logo={178                "https://icons.iconarchive.com/icons/dtafalonso/modern-xp/256/ModernXP-62-Folder-Images-icon.png"179              }180              hideWindow={props.hideWindow}181              array={props.windowsArray}182              moveItem={props.moveItem}183              makefullScreen={makefullScreen}184              fullScreen={fullScreenFormations}185            />186          );187        else if (window === "Mes CompÃ©tences" && props.mescompetences === true)188          return (189            <Fenetre190              putOnTop={props.putOnTop}191              key={window}192              content={<ContentCompetences />}193              width={"700px"}194              height={"500px"}195              closeWindow={props.closeWindow}196              text={enTrue ? "My Skills" : "Mes CompÃ©tences"}197              logo={198                "https://iconarchive.com/download/i95231/dtafalonso/modern-xp/ModernXP-16-Folder-Documents.ico"199              }200              hideWindow={props.hideWindow}201              array={props.windowsArray}202              moveItem={props.moveItem}203              makefullScreen={makefullScreen}204              fullScreen={fullScreenCompetences}205            />206          );207        else if (window === "Internet Explorer" && props.internet === true)208          return (209            <Fenetre210              putOnTop={props.putOnTop}211              key={window}212              content={<ContentInternet />}213              width={"800px"}214              height={"600px"}215              closeWindow={props.closeWindow}216              text={"Internet Explorer"}217              logo={218                logointernet219              }220              hideWindow={props.hideWindow}221              array={props.windowsArray}222              moveItem={props.moveItem}223              makefullScreen={makefullScreen}224              fullScreen={fullScreenInternet}225            />226          );227        else if (window === "Me contacter" && props.mail === true)228          return (229            <Fenetre230              putOnTop={props.putOnTop}231              key={window}232              content={<Form />}233              width={"550px"}234              height={"350px"}235              closeWindow={props.closeWindow}236              text={enTrue ? "Contact Me" : "Me contacter"}237              logo={238                "https://upload.wikimedia.org/wikipedia/fr/5/53/Outlook_express_logo-200-200.jpg"239              }240              hideWindow={props.hideWindow}241              array={props.windowsArray}242              moveItem={props.moveItem}243              makefullScreen={makefullScreen}244              fullScreen={fullScreenContact}245            />246          );247        else if (window === "Mes Projets" && props.mesprojets === true)248          return (249            <Fenetre250              putOnTop={props.putOnTop}251              key={window}252              content={<ContentProjets />}253              width={"50vw"}254              height={"50vh"}255              closeWindow={props.closeWindow}256              text={enTrue ? "My Projects" : "Mes Projets"}257              logo={258                "https://icons.iconarchive.com/icons/dtafalonso/modern-xp/512/ModernXP-38-Folder-Music-icon.png"259              }260              hideWindow={props.hideWindow}261              array={props.windowsArray}262              moveItem={props.moveItem}263              makefullScreen={makefullScreen}264              fullScreen={fullScreenProjets}265            />266          );267        else if (window === "Corbeille" && props.trash === true)268          return (269            <Fenetre270              putOnTop={props.putOnTop}271              key={window}272              content={<ContentTrash />}273              width={"550px"}274              height={"300px"}275              closeWindow={props.closeWindow}276              text={enTrue ? "Trash" : "Corbeille"}277              logo={trashlogo}278              hideWindow={props.hideWindow}279              array={props.windowsArray}280              moveItem={props.moveItem}281              makefullScreen={makefullScreen}282              fullScreen={fullScreenTrash}283            />284          );285        else if (window === "Mon Cv.pdf" && props.cv === true)286          return (287            <Fenetre288              putOnTop={props.putOnTop}289              key={window}290              content={<ContentCv scale={scale} />}291              width={"706px"}292              height={"500px"}293              closeWindow={props.closeWindow}294              text={enTrue ? "Resume.pdf" : "Mon Cv.pdf"}295              logo={296                "https://seeklogo.com/images/A/adobe-pdf-logo-1480D328A9-seeklogo.com.png"297              }298              hideWindow={props.hideWindow}299              array={props.windowsArray}300              moveItem={props.moveItem}301              makefullScreen={makefullScreen}302              fullScreen={fullScreenCv}303              scale={scale}304            />305          );306      })}307      <div className="icones">308        <Icone309          showWindow={props.showWindow}310          name={enTrue ? "Trash" : "Corbeille"}311          logo={trashlogo}312          bottom={"71px"}313          right={"44px"}314        />315        <Icone316          showWindow={props.showWindow}317          name={enTrue ? "Resume.pdf" : "Mon Cv.pdf"}318          logo={319            "https://seeklogo.com/images/A/adobe-pdf-logo-1480D328A9-seeklogo.com.png"320          }321          bottom={"40px"}322          top={"20px"}323          left={"45px"}324        />325      </div>326    </div>327  );328}...

Automation Testing Tutorials

Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.