@zigbang/honeyfarm-dashboard/.next/cache/next-babel-loader/ec2da021df180e0d542e4e873671df19.json

HoneyFarm Node에 등록 되어 있는 안드로이드 단말을 웹페이지에서 실시간으로 확인 및 사용 할수 있도록 구현된 웹

{"ast":null,"code":"import { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nimport React from \"react\";\nimport Head from \"next/head\";\nimport api from \"../src/api\";\nimport { argsParser } from \"../src/utils\";\nexport const getServerSideProps = async context => {\n  const endpoint = argsParser(process.argv, \"--endpoint\");\n  return {\n    props: {\n      endpoint: endpoint\n    }\n  };\n};\nexport default class Dashboard extends React.Component {\n  constructor(props) {\n    super(props);\n\n    _defineProperty(this, \"state\", {\n      dashboad: []\n    });\n\n    _defineProperty(this, \"api\", void 0);\n  }\n\n  render() {\n    return /*#__PURE__*/_jsxs(\"div\", {\n      style: {\n        height: \"100%\",\n        width: \"100%\"\n      },\n      children: [/*#__PURE__*/_jsx(Head, {\n        children: /*#__PURE__*/_jsx(\"title\", {\n          children: \"dashboard\"\n        })\n      }), /*#__PURE__*/_jsx(\"div\", {\n        style: page,\n        children: this.state.dashboad\n      })]\n    });\n  }\n\n  async componentDidMount() {\n    this.api = new api(this.props.endpoint);\n    await this.makeChild();\n  }\n\n  async makeChild() {\n    try {\n      const result = await this.api.getDevices();\n      if (!result) return null;\n      const data = result.data;\n\n      if (data) {\n        const views = [];\n        Object.entries(data).filter(([key, value]) => {\n          const nodeAddress = key.split(\":\")[0];\n          const status = value.showInDashboard ? \"DASHBOARD\" : value.status;\n\n          if (value.platform === \"android\" && nodeAddress) {\n            const view = /*#__PURE__*/_jsxs(\"div\", {\n              style: page_view,\n              children: [/*#__PURE__*/_jsx(\"div\", {\n                style: {\n                  width: \"fit-content\",\n                  height: \"fit-content\"\n                },\n                children: /*#__PURE__*/_jsxs(\"div\", {\n                  children: [value.name, \" [\", status, \"]\"]\n                })\n              }), /*#__PURE__*/_jsx(\"iframe\", {\n                height: \"750px\",\n                width: \"500px\",\n                src: `http://${nodeAddress}:8000/#!action=stream&udid=${value.udid}&player=mse&ws=ws%3A%2F%2F${nodeAddress}%3A8000%2F%3Faction%3Dproxy-adb%26remote%3Dtcp%253A8886%26udid%3D${value.udid}`,\n                frameBorder: \"0\"\n              })]\n            }, `${value.udid}`);\n\n            views.push(view);\n          }\n        });\n        this.setState({\n          dashboad: views\n        });\n      }\n    } catch (e) {\n      console.error(e);\n    }\n  }\n\n}\nconst page = {\n  backgroundColor: \"rgb(248, 248, 248)\",\n  height: \"auto\",\n  width: \"auto\",\n  display: \"inline\"\n};\nconst page_view = {\n  height: \"fit-content\",\n  width: \"500px\",\n  display: \"inline-block\",\n  paddingTop: \"40px\",\n  alignItems: \"center\"\n};","map":{"version":3,"sources":["/Users/showstop/work/zigbang/honeyfarm/packages/dashboard/pages/dashboard.tsx"],"names":["React","Head","api","argsParser","getServerSideProps","context","endpoint","process","argv","props","Dashboard","Component","constructor","dashboad","render","height","width","page","state","componentDidMount","makeChild","result","getDevices","data","views","Object","entries","filter","key","value","nodeAddress","split","status","showInDashboard","platform","view","page_view","name","udid","push","setState","e","console","error","backgroundColor","display","paddingTop","alignItems"],"mappings":";;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,IAAP,MAAiB,WAAjB;AAGA,OAAOC,GAAP,MAAgB,YAAhB;AACA,SAASC,UAAT,QAA2B,cAA3B;AAEA,OAAO,MAAMC,kBAAsC,GAAG,MAAOC,OAAP,IAAmB;AACrE,QAAMC,QAAQ,GAAGH,UAAU,CAACI,OAAO,CAACC,IAAT,EAAe,YAAf,CAA3B;AACA,SAAO;AAACC,IAAAA,KAAK,EAAE;AAAEH,MAAAA,QAAQ,EAAEA;AAAZ;AAAR,GAAP;AACH,CAHM;AAIP,eAAe,MAAMI,SAAN,SAAwBV,KAAK,CAACW,SAA9B,CAA6D;AAMxEC,EAAAA,WAAW,CAACH,KAAD,EAAY;AACnB,UAAMA,KAAN;;AADmB,mCALd;AACLI,MAAAA,QAAQ,EAAE;AADL,KAKc;;AAAA;AAEzB;;AAEEC,EAAAA,MAAM,GAAG;AACL,wBACI;AAAK,MAAA,KAAK,EAAE;AAACC,QAAAA,MAAM,EAAE,MAAT;AAAiBC,QAAAA,KAAK,EAAE;AAAxB,OAAZ;AAAA,8BACI,KAAC,IAAD;AAAA,+BACI;AAAA;AAAA;AADJ,QADJ,eAII;AAAK,QAAA,KAAK,EAAIC,IAAd;AAAA,kBACK,KAAKC,KAAL,CAAWL;AADhB,QAJJ;AAAA,MADJ;AAUH;;AAED,QAAMM,iBAAN,GAA0B;AACtB,SAAKjB,GAAL,GAAY,IAAIA,GAAJ,CAAQ,KAAKO,KAAL,CAAWH,QAAnB,CAAZ;AACA,UAAM,KAAKc,SAAL,EAAN;AACH;;AAED,QAAcA,SAAd,GAA0B;AACtB,QAAI;AACA,YAAMC,MAAM,GAAG,MAAM,KAAKnB,GAAL,CAASoB,UAAT,EAArB;AACA,UAAI,CAACD,MAAL,EAAa,OAAO,IAAP;AAEb,YAAME,IAAI,GAAGF,MAAM,CAACE,IAApB;;AAEA,UAAIA,IAAJ,EAAU;AACN,cAAMC,KAAoB,GAAG,EAA7B;AAEAC,QAAAA,MAAM,CAACC,OAAP,CAAeH,IAAf,EAAqBI,MAArB,CAA4B,CAAC,CAACC,GAAD,EAAMC,KAAN,CAAD,KAAkB;AAC9C,gBAAMC,WAAW,GAAGF,GAAG,CAACG,KAAJ,CAAU,GAAV,EAAe,CAAf,CAApB;AACA,gBAAMC,MAAM,GAAGH,KAAK,CAACI,eAAN,GAAwB,WAAxB,GAAsCJ,KAAK,CAACG,MAA3D;;AAEA,cAAGH,KAAK,CAACK,QAAN,KAAmB,SAAnB,IAAgCJ,WAAnC,EAAgD;AAC5C,kBAAMK,IAAI,gBACN;AAAK,cAAA,KAAK,EAAEC,SAAZ;AAAA,sCACI;AAAK,gBAAA,KAAK,EAAE;AAAEpB,kBAAAA,KAAK,EAAE,aAAT;AAAwBD,kBAAAA,MAAM,EAAE;AAAhC,iBAAZ;AAAA,uCACI;AAAA,6BAAMc,KAAK,CAACQ,IAAZ,QAAoBL,MAApB;AAAA;AADJ,gBADJ,eAIjB;AAAQ,gBAAA,MAAM,EAAC,OAAf;AAAuB,gBAAA,KAAK,EAAC,OAA7B;AAAqC,gBAAA,GAAG,EAAG,UAASF,WAAY,8BAA6BD,KAAK,CAACS,IAAK,6BAA4BR,WAAY,oEAAmED,KAAK,CAACS,IAAK,EAA9N;AAAiO,gBAAA,WAAW,EAAC;AAA7O,gBAJiB;AAAA,eAA6B,GAAET,KAAK,CAACS,IAAK,EAA1C,CADJ;;AAQAd,YAAAA,KAAK,CAACe,IAAN,CAAWJ,IAAX;AACH;AACA,SAfD;AAiBA,aAAKK,QAAL,CAAc;AAAC3B,UAAAA,QAAQ,EAAEW;AAAX,SAAd;AACH;AAEJ,KA7BD,CA6BE,OAAMiB,CAAN,EAAS;AACPC,MAAAA,OAAO,CAACC,KAAR,CAAcF,CAAd;AACH;AACJ;;AA7DuE;AAgE5E,MAAMxB,IAAI,GAAG;AACT2B,EAAAA,eAAe,EAAE,oBADR;AAET7B,EAAAA,MAAM,EAAE,MAFC;AAGTC,EAAAA,KAAK,EAAE,MAHE;AAIT6B,EAAAA,OAAO,EAAE;AAJA,CAAb;AAOA,MAAMT,SAAS,GAAE;AACbrB,EAAAA,MAAM,EAAE,aADK;AAEbC,EAAAA,KAAK,EAAE,OAFM;AAGb6B,EAAAA,OAAO,EAAE,cAHI;AAIbC,EAAAA,UAAU,EAAE,MAJC;AAKbC,EAAAA,UAAU,EAAE;AALC,CAAjB","sourcesContent":["import React from \"react\"\nimport Head from \"next/head\"\nimport { GetServerSideProps } from 'next'\n\nimport api from \"../src/api\"\nimport { argsParser } from \"../src/utils\"\n\nexport const getServerSideProps: GetServerSideProps = async (context) => {\n    const endpoint = argsParser(process.argv, \"--endpoint\")\n    return {props: { endpoint: endpoint }}\n}\nexport default class Dashboard extends React.Component<{endpoint?: string}> {\n    state =  {\n        dashboad: []\n    }\n    private api\n\n    constructor(props: {}) {\n        super(props)\n\t}\n\n    render() {\n        return (\n            <div style={{height: \"100%\", width: \"100%\"}}>\n                <Head>\n                    <title>dashboard</title>\n                </Head>\n                <div style = {page}>\n                    {this.state.dashboad}\n                </div>\n            </div>\n        )\n    }\n\n    async componentDidMount() {\n        this.api  = new api(this.props.endpoint)\n        await this.makeChild()\n    }\n\n    private async makeChild() {\n        try {\n            const result = await this.api.getDevices()\n            if (!result) return null\n            \n            const data = result.data as { [key: string]: { showInDashboard?: boolean, status: string, platform: string, name: string, udid: string } }\n\n            if (data) {\n                const views: JSX.Element[] = []\n\n                Object.entries(data).filter(([key, value]) => {\n                const nodeAddress = key.split(\":\")[0]\n                const status = value.showInDashboard ? \"DASHBOARD\" : value.status\n\n                if(value.platform === \"android\" && nodeAddress) {\n                    const view = (\n                        <div style={page_view} key={`${value.udid}`}>\n                            <div style={{ width: \"fit-content\", height: \"fit-content\"}}>\n                                <div>{value.name} [{status}]</div>\n                            </div>\n\t\t\t\t\t\t\t<iframe height=\"750px\" width=\"500px\" src={`http://${nodeAddress}:8000/#!action=stream&udid=${value.udid}&player=mse&ws=ws%3A%2F%2F${nodeAddress}%3A8000%2F%3Faction%3Dproxy-adb%26remote%3Dtcp%253A8886%26udid%3D${value.udid}`} frameBorder=\"0\"></iframe>\n                        </div>\n                    )\n                    views.push(view)\n                }\n                })\n\n                this.setState({dashboad: views})\n            }\n        \n        } catch(e) {\n            console.error(e)\n        }\n    }\n}\n\nconst page = {\n    backgroundColor: \"rgb(248, 248, 248)\",\n    height: \"auto\",\n    width: \"auto\",\n    display: \"inline\"\n}\n\nconst page_view= {\n    height: \"fit-content\",\n    width: \"500px\",\n    display: \"inline-block\",\n    paddingTop: \"40px\",\n    alignItems: \"center\"\n}\n"]},"metadata":{},"sourceType":"module"}