{"version":3,"sources":["webpack:///./src/components/Index/Frontpage/SearchResultCards.jsx","webpack:///./src/components/Index/Frontpage/SearchContainer.jsx","webpack:///./src/components/Index/Frontpage/IntroInstallationGrid.jsx","webpack:///./src/components/Index/Frontpage/IntroMotionGrid.jsx","webpack:///./src/components/Index/Frontpage/IntroRemoteGrid.jsx","webpack:///./src/components/Index/Frontpage/IntroDeveloperGrid.jsx","webpack:///./src/components/Index/Frontpage/IntroProductsGrid.jsx","webpack:///./src/components/Index/Frontpage/IntroSoftwareGrid.jsx","webpack:///./src/components/Index/Frontpage/IntroPopularGrid.jsx","webpack:///./src/pages/index.jsx"],"names":["styles","card","display","marginBottom","paddingTop","boxShadow","border","content","flex","cover","width","height","margin","inlineList","marginTop","inlineListItem","fontSize","badgeStyle","color","presets","lightGrey","backgroundColor","verylightGrey","padding","marginLeft","borderRadius","float","alignContent","justifyContent","withStyles","props","classes","title","badge","abstract","imagesquare","sublink1","sublink2","sublink3","sublink4","subtitle1","subtitle2","subtitle3","subtitle4","Card","className","to","style","textDecoration","cursor","CardMedia","image","CardContent","Typography","variant","gutterBottom","align","placeholderText","inputStyle","brandLight","outline","client","elasticsearch","Client","host","_connectionString","log","wrapperStyle","center","tableWrap","flexGrow","SearchContainer","state","results","handleChange","bind","event","search_query","target","value","search","index","_index","type","_type","body","query","multi_match","fields","fuzziness","then","this","setState","hits","error","console","trace","message","render","onChange","writeSpeedMs","deleteSpeedMs","waitBeforeDeleteMs","placeholders","React","Component","SearchResults","map","result","i","key","_source","useStyles","makeStyles","root","intro","InstallationGrid","MotionGrid","RemoteGrid","DeveloperGrid","ProductsGrid","SoftwareGrid","PopularGrid","theme","paper","spacing","maxWidth","img","maxHeight","headmenu","overflow","whiteSpace","menubutton","textAlign","menubuttonactive","borderBottom","borderBottomWidth","borderBottomStyle","borderBottomColor","seodata","FrontGrid","data","SEOHelmet","description","location","Grid","container","item","xs","Paper","sm","allMarkdownRemark","edges","node","frontmatter","path","ButtonBase","alt","src","toc","direction","dateChanged","timeToRead"],"mappings":"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","file":"component---src-pages-index-jsx-fadab4eb78bd2eb60caf.js","sourcesContent":["import React from 'react'\nimport { Link } from \"gatsby\"\nimport PropTypes from 'prop-types'\n\nimport { withStyles } from '@material-ui/core/styles'\nimport Card from '@material-ui/core/Card'\nimport CardContent from '@material-ui/core/CardContent'\nimport CardMedia from '@material-ui/core/CardMedia'\nimport Typography from '@material-ui/core/Typography'\n\n\nimport presets from \"../../../utils/presets\"\n\nconst styles = {\n  card: {\n    display: 'flex',\n    marginBottom: 15,\n    paddingTop: 5,\n    boxShadow: `none`,\n    border: `1px solid rgba(0,0,0,0.05)`,\n  },\n  content: {\n    flex: '1',\n  },\n  cover: {\n    width: 75,\n    height: 75,\n    margin: \"15px 0 0 15px\"\n  },\n  inlineList: {\n    marginTop: `35px`,\n  },\n  inlineListItem: {\n    display: `inline`,\n    fontSize: `small`,\n  },\n  badgeStyle: {\n    color: presets.lightGrey,\n    backgroundColor: presets.verylightGrey,\n    boxShadow: `inset 0 1px 2px rgba(255,255,255,0.1),\n              inset 0 -1px 2px rgba(0,0,0,0.1),\n              0 1px 1px rgba(255,255,255,0.5)`,\n    padding: 4,\n    height: 26,\n    marginLeft: 7,\n    borderRadius: 4,\n    fontSize: `small`,\n    float: `right`,\n    display: `flex`,\n    alignContent: `center`,\n    justifyContent: `center`\n  }\n}\n\nfunction ResultCards(props) {\n  const {\n    classes,\n    title,\n    badge,\n    abstract,\n    imagesquare,\n    sublink1,\n    sublink2,\n    sublink3,\n    sublink4,\n    subtitle1,\n    subtitle2,\n    subtitle3,\n    subtitle4\n  } = props;\n\n  return (\n    <div>\n      <Card className={classes.card}>\n        <Link to={sublink1} style={{ textDecoration: 'none', color: 'white', cursor: 'pointer' }}>\n          <CardMedia\n            className={classes.cover}\n            image={imagesquare}\n            title={title}\n          />\n        </Link>\n        <CardContent className={classes.content}>\n          <Link to={sublink1} style={{ textDecoration: 'none', color: 'white' }}>\n            <span className={classes.badgeStyle}>\n              {badge}\n            </span>\n            <Typography variant=\"h5\" color=\"textPrimary\">{title}</Typography>\n            <Typography variant=\"subtitle1\" color=\"textSecondary\">\n              {abstract}\n            </Typography>\n          </Link>\n          <Typography variant=\"caption\" gutterBottom align=\"right\">\n            <ul className={classes.inlineList}>\n              <li className={classes.inlineListItem}><Link to={sublink1}>{subtitle1}</Link></li>\n              <li className={classes.inlineListItem}><Link to={sublink2}>&nbsp;{subtitle2}</Link></li>\n              <li className={classes.inlineListItem}><Link to={sublink3}>&nbsp;{subtitle3}</Link></li>\n              <li className={classes.inlineListItem}><Link to={sublink4}>&nbsp;{subtitle4}</Link></li>\n            </ul>\n          </Typography>\n        </CardContent>\n      </Card>\n    </div>\n  );\n}\n\nResultCards.propTypes = {\n  classes: PropTypes.object.isRequired,\n  // theme: PropTypes.object.isRequired,\n}\n\nexport default withStyles(styles)(ResultCards)","import React from 'react'\nimport elasticsearch from 'elasticsearch'\n\nimport InputHints from 'react-input-hints'\n\nimport presets from '../../../utils/presets'\nimport ResultTable from './SearchResultCards'\nimport { _connectionString, _index, _type } from '../ElasticParam'\n\nconst placeholderText = [\n  \"Bienvenue sur le Wiki INSTAR 2.0 !\",\n  \"Je suis votre assistant de recherche.\",\n  \"Demandez-moi tout ce qui concerne les caméras IP...\",\n  \"Youtube Tutorials\",\n  \"Portforwarding Speeport?\",\n  \"Wireless Connection?\",\n  \"8015 Technical Specifications?\",\n  \"SD Card Access?\",\n  \"Fritzbox as FTP Server?\",\n  \"CGI Commands 1080p?\",\n  \"P2P Remote Access?\",\n  \"INSTAR Cloud?\",\n  \"InstarVision iPhone?\",\n  \"Camera Lenses?\",\n  \"Power over Ethernet ?\",\n  \"VPN Connection?\"\n]\n\nconst inputStyle = {\n  width: '100%',\n  padding: '0.23rem',\n  boxShadow: 'inset 0 0 1px rgba(0,0,0,0.1), 0 0 2px rgba(0,0,0,0.1)',\n  backgroundColor: presets.brandLight,\n  outline: 'none',\n  borderRadius: 5,\n  border: '1px solid #CECECE',\n  marginTop: 15\n}\n\nconst client = new elasticsearch.Client({\n  host: _connectionString,\n  log: \"trace\"\n})\n\nconst wrapperStyle = {\n  margin: '0 auto',\n  padding: '0px 1.0875rem 1.45rem',\n  paddingTop: 20,\n  marginBottom: 20\n}\n\nconst center = {\n  display: 'flex',\n  justifyContent: 'center'\n}\n\nconst tableWrap = {\n  flexGrow: 1,\n  padding: '0px 1.0875rem 1.45rem',\n}\n\nexport class SearchContainer extends React.Component {\n  constructor(props) {\n    super(props)\n    this.state = { results: [] };\n    this.handleChange = this.handleChange.bind(this)\n  }\n\n  handleChange(event) {\n    const search_query = event.target.value;\n\n    client.search({\n      index: _index,\n      type: _type,\n      body: {\n        query: {\n          multi_match: {\n            query: search_query,\n            fields: ['title^100', 'tags^100', 'abstract^20', 'description^10', 'chapter^5', 'title2^10', 'description2^10'],\n            fuzziness: 1,\n          },\n        },\n      },\n    }).then(function (body) {\n      this.setState({ results: body.hits.hits });\n    }.bind(this),\n      function (error) {\n        console.trace(error.message);\n      }\n    );\n  }\n\n  render() {\n\n    return (\n      <div style={wrapperStyle}>\n        <div style={center}>\n          <InputHints\n            onChange={this.handleChange}\n            writeSpeedMs={120}\n            deleteSpeedMs={20}\n            waitBeforeDeleteMs={2000}\n            placeholders={placeholderText}\n            style={inputStyle} />\n        </div>\n        <br />\n        <SearchResults results={this.state.results} />\n      </div>\n    );\n  }\n}\n\nconst SearchResults = ({ results }) => (\n  <div style={center}>\n    <div style={tableWrap}>\n      {results.map((result, i) =>\n        <ResultTable key={i}\n          image={result._source.image}\n          title={result._source.title}\n          badge={result._source.badge}\n          imagesquare={result._source.imagesquare}\n          sublink1={result._source.sublink1}\n          sublink2={result._source.sublink2}\n          sublink3={result._source.sublink3}\n          sublink4={result._source.sublink4}\n          subtitle1={result._source.subtitle1}\n          subtitle2={result._source.subtitle2}\n          subtitle3={result._source.subtitle3}\n          subtitle4={result._source.subtitle4}\n          abstract={result._source.abstract}\n        />\n      )}\n    </div>\n  </div>\n)\n\nexport default SearchContainer","import React from 'react'\nimport { Link } from 'gatsby'\nimport { makeStyles } from '@material-ui/core/styles'\nimport Typography from '@material-ui/core/Typography'\n\n\nconst useStyles = makeStyles(() => ({\n  root: {\n    flexGrow: 1,\n  },\n  intro: {\n    marginBottom: 15,\n  },\n}));\n\nexport default function InstallationGrid() {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <Typography variant=\"body2\" className={classes.intro}>\n        Tout ce que vous devez savoir pour commencer à utiliser votre caméra IP INSTAR - connexion réseau et configuration de base de la caméra.  \n      </Typography>\n      <Link to=\"/Quick_Installation/How_does_an_IP_Camera_Work/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Comment fonctionne une caméra IP ?  </Typography>\n      </Link>\n      <Link to=\"/Quick_Installation/After_Unpacking/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Après le déballage  </Typography>\n      </Link>\n      <Link to=\"/Quick_Installation/First_Steps/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Premiers pas  </Typography>\n      </Link>\n      <Link to=\"/Quick_Installation/Power_over_Ethernet/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Power over Ethernet  </Typography>\n      </Link>\n      <Link to=\"/Quick_Installation/Powerline/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Powerline  </Typography>\n      </Link>\n      <Link to=\"/Quick_Installation/Direct_LAN_Connection/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Connexion directe au réseau local  </Typography>\n      </Link>\n      <Link to=\"/Quick_Installation/Alternative_IP_Scanner/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Trouvez votre caméra  </Typography>\n      </Link>\n      <Link to=\"/Quick_Installation/Language_Selection/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Sélection de la langue  </Typography>\n      </Link>\n      <Link to=\"/Quick_Installation/Live_Video/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Vidéo en direct  </Typography>\n      </Link>\n      <Link to=\"/Quick_Installation/Creating_User_Accounts/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Gestion des utilisateurs  </Typography>\n      </Link>\n      <Link to=\"/Quick_Installation/WebUI_And_Firmware_Upgrade/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Mise à jour du logiciel  </Typography>\n      </Link>\n      <Link to=\"/Quick_Installation/How_To_Clear_Your_Browsing_History/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Naviguer dans l&apos;histoire  </Typography>\n      </Link>\n      <Link to=\"/Quick_Installation/Set_Up_A_Wireless_Connection/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Connexion sans fil  </Typography>\n      </Link>\n      <Link to=\"/Quick_Installation/ONVIF/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ ONVIF</Typography>\n      </Link>\n    </div>\n  );\n}\n","import React from 'react'\nimport { Link } from 'gatsby'\nimport { makeStyles } from '@material-ui/core/styles'\nimport Typography from '@material-ui/core/Typography'\n\n\nconst useStyles = makeStyles(() => ({\n  root: {\n    flexGrow: 1,\n  },\n  intro: {\n    marginBottom: 15,\n  },\n}));\n\nexport default function MotionGrid() {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <Typography variant=\"body2\" className={classes.intro}>\n        Configurez votre caméra pour qu&apos;elle déclenche une alarme lorsqu&apos;un mouvement est détecté. Enregistrez des vidéos, informez-vous par e-mail ou par messages push et connectez votre caméra à votre environnement smarthome.  \n      </Typography>\n      <Link to=\"/Motion_Detection/Setup/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Configuration de la détection de mouvement  </Typography>\n      </Link>\n      <Link to=\"/Motion_Detection/Alarm_Notification/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Notification d&apos;alarme  </Typography>\n      </Link>\n      <Link to=\"/Motion_Detection/Alarm_Recording/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Enregistrement des alarmes  </Typography>\n      </Link>\n      <Link to=\"/Motion_Detection/SD_Card_Access/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Accès à la carte SD  </Typography>\n      </Link>\n      <Link to=\"/Motion_Detection/Alarm_FTP_Upload/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Alarme Téléchargement FTP  </Typography>\n      </Link>\n      <Link to=\"/Motion_Detection/Router_as_a_FTP_Server/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Routeur comme serveur FTP  </Typography>\n      </Link>\n      <Link to=\"/Motion_Detection/FTP_Server_Setup/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Configuration du serveur FTP  </Typography>\n      </Link>\n      <Link to=\"/Motion_Detection/Alarm_Server/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Serveur d&apos;alarme  </Typography>\n      </Link>\n      <Link to=\"/Motion_Detection/INSTAR_Cloud/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ INSTAR Cloud</Typography>\n      </Link>\n    </div>\n  );\n}\n","import React from 'react'\nimport { Link } from 'gatsby'\nimport { makeStyles } from '@material-ui/core/styles'\nimport Typography from '@material-ui/core/Typography'\n\n\nconst useStyles = makeStyles(() => ({\n  root: {\n    flexGrow: 1,\n  },\n  intro: {\n    marginBottom: 15,\n  },\n}));\n\nexport default function RemoteGrid() {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <Typography variant=\"body2\" className={classes.intro}>\n        Accédez à votre caméra via Internet - configuration de la connexion Point2Point et DNS dynamique.\n      </Typography>\n      <Link to=\"/Internet_Access/Point_to_Point/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ P2P Point-2-Point  </Typography>\n      </Link>\n      <Link to=\"/Internet_Access/The_DDNS_Service/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ INSTAR DDNS  </Typography>\n      </Link>\n      <Link to=\"/Internet_Access/Port_Forwarding/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Redirection portuaire  </Typography>\n      </Link>\n      <Link to=\"/Internet_Access/Mobile_Access/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Accès mobile  </Typography>\n      </Link>\n      <Link to=\"/Internet_Access/DDNS_Provider/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ DDNS Fournirr</Typography>\n      </Link>\n    </div>\n  );\n}\n","import React from 'react'\nimport { Link } from 'gatsby'\nimport { makeStyles } from '@material-ui/core/styles'\nimport Typography from '@material-ui/core/Typography'\n\n\nconst useStyles = makeStyles(() => ({\n  root: {\n    flexGrow: 1,\n  },\n  intro: {\n    marginBottom: 15,\n  },\n}));\n\nexport default function DeveloperGrid() {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <Typography variant=\"body2\" className={classes.intro}>\n        Contrôlez votre caméra via son API HTTP (CGI) ou MQTT et intégrez-la dans votre environnement smarthome.\n      </Typography>\n      <Link to=\"/Advanced_User/VPN_AVM_Fritzbox/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ VPN et AVM Fritzbox  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Website_Integration/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Intégration du site web  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Youtube_Videostreaming_from_your_Camera/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Youtube Videostreaming  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/CGI_Commands/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Commandes CGI  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/INSTAR_MQTT_Broker/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ INSTAR MQTT Broker  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Homebridge_INSTAR_MQTT_to_Homekit/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Homebridge INSTAR MQTT  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/FHEM_on_a_Raspberry_Pi/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ FHEM sur un Raspberry Pi  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Node-RED_and_MQTT/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Node-RED et MQTT  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Node-RED_Dashboard_Live_Video/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Node-RED Dashboard Live Video  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Alarmserver_Queries_for_your_Smarthome/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Requêtes du serveur d&apos;alarme  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Node-RED_and_SQL-Logging/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Node-RED et SQL  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Node-RED_on_Android/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Node-RED sur Android  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/OpenHAB_Home_Automation/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ OpenHAB  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/OpenHAB_IP_Camera_Binding/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ OpenHAB IP Camera Binding  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/openHABian_on_Raspberry_Pi/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ openHABian  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/IOBroker_on_Raspberry_Pi/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ IOBroker  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Homematic_CCU3_and_RedMatic/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Homematic CCU3 et RedMatic  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Alexa_Voice_Control_without_Cloud/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Alexa et Node-RED  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/IFTTT_and_INSTAR_FHD_Cameras/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ IFTTT et INSTAR FHD Cameras  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/IFTTT_as_Alarmserver/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ IFTTT comme serveur d&apos;alarme  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Node-RED_and_IFTTT/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Node-RED et IFTTT  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/XiaoMi_Home_Zigbee2MQTT/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ XiaoMi Home et Zigbee2MQTT  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/ZoneMinder_inside_a_Docker_Container/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ ZoneMinder et Docker  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Tasker/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Tasker sur Android  </Typography>\n      </Link>\n    </div>\n  );\n}\n","import React from 'react'\nimport { Link } from 'gatsby'\nimport { makeStyles } from '@material-ui/core/styles'\nimport Typography from '@material-ui/core/Typography'\n\n\nconst useStyles = makeStyles(() => ({\n  root: {\n    flexGrow: 1,\n  },\n  intro: {\n    marginBottom: 15,\n  },\n}));\n\nexport default function ProductsGrid() {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <Typography variant=\"body2\" className={classes.intro}>\n        Tous les produits INSTAR - documentation et téléchargements de logiciels.\n      </Typography>\n      <Link to=\"/Downloads/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Téléchargements  </Typography>\n      </Link>\n      <Link to=\"/Products/Usermanuals/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Manuels d&apos;utilisation  </Typography>\n      </Link>\n      <Link to=\"/Assistants/Review_Wall/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Témoignages  </Typography>\n      </Link>\n      <Link to=\"/Indoor_Cameras/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Caméras d&apos;intérieur  </Typography>\n      </Link>\n      <Link to=\"/Outdoor_Cameras/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Caméras d&apos;extérieur  </Typography>\n      </Link>\n      <Link to=\"/Products/Lenses/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Lentilles  </Typography>\n      </Link>\n      <Link to=\"/Web_User_Interface/1080p_Series/Overview/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Interface utilisateur Web  </Typography>\n      </Link>\n      <Link to=\"/Products/USB-Webcams/IN-W1/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Webcams USB  </Typography>\n      </Link>\n      <Link to=\"/Products/IN-LAN/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ IN-LAN  </Typography>\n      </Link>\n      <Link to=\"/Products/Power_over_Ethernet/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Power over Ethernet  </Typography>\n      </Link>\n      <Link to=\"/Products/IN-Route/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ IN-Route  </Typography>\n      </Link>\n    </div>\n  );\n}\n","import React from 'react'\nimport { Link } from 'gatsby'\nimport { makeStyles } from '@material-ui/core/styles'\nimport Typography from '@material-ui/core/Typography'\n\n\nconst useStyles = makeStyles(() => ({\n  root: {\n    flexGrow: 1,\n  },\n  intro: {\n    marginBottom: 15,\n  },\n}));\n\nexport default function SoftwareGrid() {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <Typography variant=\"body2\" className={classes.intro}>\n        Solutions logicielles INSTAR et logiciels tiers pour votre caméra INSTAR.\n      </Typography>\n      <Link to=\"/Software/Windows/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Logiciels pour Windows  </Typography>\n      </Link>\n      <Link to=\"/Software/macOS/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Logiciels pour macOS  </Typography>\n      </Link>\n      <Link to=\"/Software/Linux/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Logiciels pour Linux  </Typography>\n      </Link>\n      <Link to=\"/Software/Android/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Logiciels pour Android  </Typography>\n      </Link>\n      <Link to=\"/Software/iOS/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Logiciels pour iOS  </Typography>\n      </Link>\n      <Link to=\"/Software/Home_Automation/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Logiciels pour Automatisation de la maison  </Typography>\n      </Link>\n      <Link to=\"/Software/Other_Platforms/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Logiciels pour Autres plates-formes  </Typography>\n      </Link>\n    </div>\n  );\n}\n","import React from 'react'\nimport { Link } from 'gatsby'\nimport { makeStyles } from '@material-ui/core/styles'\nimport Typography from '@material-ui/core/Typography'\n\n\nconst useStyles = makeStyles(() => ({\n  root: {\n    flexGrow: 1,\n  },\n  intro: {\n    marginBottom: 15,\n  },\n}));\n\nexport default function PopularGrid() {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <Link to=\"/Advanced_User/INSTAR_MQTT_Broker/MQTT_API/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Tous les sujets du MQTT  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/INSTAR_MQTT_Broker/MQTT_vs_HTTP_API/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ MQTT contre les commandements CGI  </Typography>\n      </Link>\n      <Link to=\"/1080p_Series_CGI_List/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Commandes CGI 1080p  </Typography>\n      </Link>\n      <Link to=\"/720p_Series_CGI_List/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Commandes CGI 720p  </Typography>\n      </Link>\n      <Link to=\"/Web_User_Interface/1080p_Series/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ 1080p WebUI  </Typography>\n      </Link>\n      <Link to=\"/Web_User_Interface/720p_Series/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ 720p WebUI  </Typography>\n      </Link>\n      <Link to=\"/Software/Linux/MotionEye/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ MotionEye  </Typography>\n      </Link>\n      <Link to=\"/Quick_Installation/Alternative_IP_Scanner/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Outil de caméra IP  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/OpenHAB_IP_Camera_Binding/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ OpenHAB INSTAR Camera Binding  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Alarmserver_Queries_for_your_Smarthome/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Requêtes du serveur d&apos;alarme  </Typography>\n      </Link>\n      <Link to=\"/Motion_Detection/Router_as_a_FTP_Server/WD_MyCloud_as_FTP_Server/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ WD MyCloud comme serveur FTP  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Node-RED_and_MQTT/Projects/Live_Video/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Node-RED Live Video  </Typography>\n      </Link>\n      <Link to=\"/Software/Windows/P2P_Client/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ P2P Client  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/OpenHAB_IP_Camera_Binding/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ OpenHAB IP Camera Binding  </Typography>\n      </Link>\n      <Link to=\"/Software/Linux/Shinobi_Open_Source_CCTV/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Shinobi Open Source CCTV  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/ZoneMinder_inside_a_Docker_Container/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ ZoneMinder et Docker  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/IOBroker_on_Raspberry_Pi/motionEye/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ ioBroker et motionEye  </Typography>\n      </Link>\n      <Link to=\"/Software/Linux/Node-RED/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Node-RED  </Typography>\n      </Link>\n      <Link to=\"/Software/Linux/Home_Assistant/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Home Assistant  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/Node-RED_and_IFTTT/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ Node-RED et IFTTT  </Typography>\n      </Link>\n      <Link to=\"/Advanced_User/XiaoMi_Home_Zigbee2MQTT/\">\n        <Typography variant=\"caption\" color=\"textSecondary\">║ XiaoMi Home Zigbee2MQTT  </Typography>\n      </Link>\n    </div>\n  );\n}\n","import React from 'react'\nimport { Link, graphql } from \"gatsby\"\nimport { makeStyles } from '@material-ui/core/styles'\nimport Grid from '@material-ui/core/Grid'\nimport Paper from '@material-ui/core/Paper'\nimport Typography from '@material-ui/core/Typography'\nimport ButtonBase from '@material-ui/core/ButtonBase'\n\nimport SearchTable from '../components/Index/Frontpage/SearchContainer'\nimport InstallationGrid from '../components/Index/Frontpage/IntroInstallationGrid'\nimport MotionGrid from '../components/Index/Frontpage/IntroMotionGrid'\nimport RemoteGrid from '../components/Index/Frontpage/IntroRemoteGrid'\nimport DeveloperGrid from '../components/Index/Frontpage/IntroDeveloperGrid'\nimport ProductsGrid from '../components/Index/Frontpage/IntroProductsGrid'\nimport SoftwareGrid from '../components/Index/Frontpage/IntroSoftwareGrid'\nimport PopularGrid from '../components/Index/Frontpage/IntroPopularGrid'\n\nimport SEOHelmet from '../components/Layout/SEOHelmet'\n\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    flexGrow: 1\n  },\n  paper: {\n    padding: theme.spacing(1),\n    margin: theme.spacing(1),\n    maxWidth: 425\n  },\n  image: {\n    width: 50,\n    height: 50,\n  },\n  img: {\n    margin: 'auto',\n    display: 'block',\n    maxWidth: '100%',\n    maxHeight: '100%'\n  },\n  headmenu: {\n    overflow: `auto`,\n    whiteSpace: `nowrap`,\n    marginBottom: 35\n  },  \n  menubutton: {\n    display: `inline-block`,\n    textAlign: `center`,\n    padding: 14,\n    textDecoration: `none`\n  },\n  menubuttonactive: {\n    display: `inline-block`,\n    textAlign: `center`,\n    padding: `14px 14px 7px 14px`,\n    textDecoration: `none`,\n    borderBottom: `3px solid #2f78f9`,\n    borderBottomWidth: 3,\n    borderBottomStyle: `solid`,\n    borderBottomColor: `rgb(47, 120, 249)`\n  }\n}))\n\n\nconst seodata = {\n  title: 'INSTAR Wiki :: Base de connaissances pour les caméras IP et la surveillance des réseaux',\n  description: 'INSTAR est l une des marques les plus connues de technologie de sécurité de haute qualité développée en Allemagne. INSTAR propose des caméras IP d intérieur/extérieur/des caméras de surveillance et offre également une plateforme unique de capture des nuages, y compris les fausses alarmes et la détection d objets. Toutes les caméras INSTAR sont & quot ; not & quot ; Cloud-bound et peuvent être intégrées facilement sans Internet dans le réseau local via LAN, WLAN ou PoE. Peu importe la caméra de surveillance INSTAR que vous utilisez, toutes les caméras sont compatibles avec des systèmes tiers tels que. Synology, QNAP, Asustor, Netgear, Luxone, KNX, Homeatic et bien d autres. En tant que fournisseur de caméras réseau WLAN, de caméras IP HD, de caméras IP contrôlables, de caméras IP avec vision nocturne infrarouge ainsi que d injecteurs PoE, d injecteurs Gigabit PoE, d adaptateurs CPL, de routeurs, de commutateurs, de détecteurs de mouvement avec PIR et micro-ondes, de microphones, d objectifs, d un chauffage breveté, INSTAR propose également des accessoires supplémentaires pour votre caméra de surveillance IP.',\n  image: '/images/Search/QI_SearchThumb_SetupWizard.png'\n}\n\n\nexport default function FrontGrid({data}) {\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n\n      <SEOHelmet title={seodata.title} description={seodata.description} image={seodata.image} location=\"/fr/\" />\n\n      <div className={classes.headmenu}>\n          <Link to=\"/\" className={classes.menubuttonactive}>\n            <Typography variant=\"button\" color=\"textPrimary\">Accueil</Typography>\n          </Link>\n          <Link to=\"/Latest/\" className={classes.menubutton}>\n            <Typography variant=\"button\" color=\"textPrimary\">Dernièr</Typography>\n          </Link>\n          <Link to=\"/Popular/\" className={classes.menubutton}>\n            <Typography variant=\"button\" color=\"textPrimary\">Populaire</Typography>\n          </Link>\n          <Link to=\"/Smarthome/\" className={classes.menubutton}>\n            <Typography variant=\"button\" color=\"textPrimary\">Smarthome</Typography>\n          </Link>\n          <Link to=\"/Search/\" className={classes.menubutton}>\n            <Typography variant=\"button\" color=\"textPrimary\">Recherchez</Typography>\n          </Link>\n      </div>\n\n      <Grid container spacing={1}>\n        <Grid item xs={12}>\n          <Typography variant=\"h6\" color=\"textSecondary\">Recherchez</Typography>\n          <hr/>\n          <Paper><SearchTable /></Paper>\n        </Grid>\n      </Grid>\n\n      <Grid container spacing={1}>\n        <Grid item xs={12} sm={6}>\n          <Link to=\"/Quick_Installation/\">\n            <Typography variant=\"h6\" color=\"textSecondary\">Installation rapide</Typography>\n          </Link>\n          <hr/>\n          <Paper className={classes.paper}><InstallationGrid /></Paper>\n          <Link to=\"/Motion_Detection/\">\n            <Typography variant=\"h6\" color=\"textSecondary\">Détection de mouvement</Typography>\n          </Link>\n          <hr/>\n          <Paper className={classes.paper}><MotionGrid /></Paper>\n          <Link to=\"/Internet_Access/\">\n            <Typography variant=\"h6\" color=\"textSecondary\">Accès à distance</Typography>\n          </Link>\n          <hr/>\n          <Paper className={classes.paper}><RemoteGrid /></Paper>\n          <Link to=\"/Products/\">\n            <Typography variant=\"h6\" color=\"textSecondary\">Des produits</Typography>\n          </Link>\n          <hr/>\n          <Paper className={classes.paper}><ProductsGrid /></Paper>\n          <Link to=\"/Software/\">\n            <Typography variant=\"h6\" color=\"textSecondary\">Software</Typography>\n          </Link>\n          <hr/>\n          <Paper className={classes.paper}><SoftwareGrid /></Paper>\n          <Link to=\"/Advanced_User/\">\n            <Typography variant=\"h6\" color=\"textSecondary\">Pour les développeurs</Typography>\n          </Link>\n          <hr/>\n          <Paper className={classes.paper}><DeveloperGrid /></Paper>\n          <Typography variant=\"h6\" color=\"textSecondary\">Articles populaires</Typography>\n          <hr/>\n          <Paper className={classes.paper}><PopularGrid /></Paper>\n        </Grid>\n        <Grid item xs={12} sm={6}>\n\n            <Typography variant=\"h6\" color=\"textSecondary\">Accueil</Typography>\n            <hr/>\n\n            {data.allMarkdownRemark.edges.map(({ node }, index) => (\n              <Paper className={classes.paper} key={index}>\n                  <Grid container spacing={2}>\n                      <Grid item>\n                          <Link to={node.frontmatter.path} style={{ textDecoration: 'none', color: 'white', cursor: 'pointer' }}>\n                              <ButtonBase className={classes.image}>\n                              <img className={classes.img} alt=\"complex\" src={\"/fr\"+node.frontmatter.toc} />\n                              </ButtonBase>\n                          </Link>\n                      </Grid>\n                  <Grid item xs={12} sm container>\n                      <Grid item xs container direction=\"column\" spacing={2}>\n                          <Grid item xs>\n                            <Link to={node.frontmatter.path} style={{ textDecoration: 'none', color: 'white', cursor: 'pointer' }}>\n                              <Typography variant=\"subtitle2\" color=\"textSecondary\">\n                                  {node.frontmatter.title}\n                              </Typography>\n                              <Typography variant=\"caption\" color=\"textSecondary\">\n                                  {node.frontmatter.dateChanged}\n                              </Typography>\n                            </Link>\n                          </Grid>\n                      </Grid>\n                      <Grid item>\n                      <Typography variant=\"caption\">{node.timeToRead} Min</Typography>\n                      </Grid>\n                  </Grid>\n                  </Grid>\n              </Paper>\n            ))}\n\n        </Grid>\n      </Grid>\n    </div>\n  );\n}\n\n\n\n\n\n\nexport const FrontPageQuery = graphql`\n  query FrontPageQuery {\n    allMarkdownRemark(sort: {order: DESC, fields: frontmatter___dateChanged}, limit: 20) {\n      edges {\n        node {\n          id\n          frontmatter {\n            dateChanged\n            title\n            path\n            toc\n            chapter\n          }\n          timeToRead\n        }\n      }\n    }\n  }\n`"],"sourceRoot":""}