{"id":19533312,"url":"https://github.com/andreainfufsm/evento-interacoes","last_synced_at":"2025-10-12T04:38:25.181Z","repository":{"id":198104190,"uuid":"700087531","full_name":"AndreaInfUFSM/evento-interacoes","owner":"AndreaInfUFSM","description":null,"archived":false,"fork":false,"pushed_at":"2023-10-06T09:30:39.000Z","size":33115,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-01-08T17:23:16.674Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://liascript.github.io/nightly/?https://raw.githubusercontent.com/AndreaInfUFSM/evento-interacoes/master/README.md","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/AndreaInfUFSM.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2023-10-03T23:18:51.000Z","updated_at":"2023-10-06T08:27:16.000Z","dependencies_parsed_at":null,"dependency_job_id":"a05fda98-6e94-4de2-8dfc-dd17c9cfb68c","html_url":"https://github.com/AndreaInfUFSM/evento-interacoes","commit_stats":null,"previous_names":["andreainfufsm/evento-interacoes"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AndreaInfUFSM%2Fevento-interacoes","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AndreaInfUFSM%2Fevento-interacoes/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AndreaInfUFSM%2Fevento-interacoes/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AndreaInfUFSM%2Fevento-interacoes/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/AndreaInfUFSM","download_url":"https://codeload.github.com/AndreaInfUFSM/evento-interacoes/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":240788778,"owners_count":19857695,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-11T02:06:50.891Z","updated_at":"2025-10-12T04:38:20.161Z","avatar_url":"https://github.com/AndreaInfUFSM.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003c!--\r\nauthor:   Andrea Charão\r\n\r\nemail:    andrea@inf.ufsm.br\r\n\r\nversion:  0.0.1\r\n\r\nlanguage: PT-BR\r\n\r\nnarrator: Brazilian Portuguese Female\r\n\r\ncomment: Apresentação no evento interAÇÕES\r\n\r\ntranslation: English  translations/English.md\r\n\r\nlink:     https://cdn.jsdelivr.net/chartist.js/latest/chartist.min.css\r\n\r\nlink:     custom.css\r\n          https://fonts.googleapis.com/css?family=Quattrocento%20Sans\r\n\r\nscript:   https://cdn.jsdelivr.net/chartist.js/latest/chartist.min.js\r\n\r\nscript:   https://cdn.rawgit.com/davidshimjs/qrcodejs/gh-pages/qrcode.min.js\r\n\r\n\r\nonload\r\nwindow.CodeRunner = {\r\n    ws: undefined,\r\n    handler: {},\r\n\r\n    init(url) {\r\n        this.ws = new WebSocket(url);\r\n        const self = this\r\n        this.ws.onopen = function () {\r\n            self.log(\"connections established\");\r\n            setInterval(function() {\r\n                self.ws.send(\"ping\")\r\n            }, 15000);\r\n        }\r\n        this.ws.onmessage = function (e) {\r\n            // e.data contains received string.\r\n\r\n            let data\r\n            try {\r\n                data = JSON.parse(e.data)\r\n            } catch (e) {\r\n                self.warn(\"received message could not be handled =\u003e\", e.data)\r\n            }\r\n            if (data) {\r\n                self.handler[data.uid](data)\r\n            }\r\n        }\r\n        this.ws.onclose = function () {\r\n            self.warn(\"connection closed\")\r\n        }\r\n        this.ws.onerror = function (e) {\r\n            self.warn(\"an error has occurred =\u003e \", e)\r\n        }\r\n    },\r\n    log(...args) {\r\n        console.log(\"CodeRunner:\", ...args)\r\n    },\r\n    warn(...args) {\r\n        console.warn(\"CodeRunner:\", ...args)\r\n    },\r\n    handle(uid, callback) {\r\n        this.handler[uid] = callback\r\n    },\r\n    send(uid, message) {\r\n        message.uid = uid\r\n        this.ws.send(JSON.stringify(message))\r\n    }\r\n}\r\n\r\n//window.CodeRunner.init(\"wss://coderunner.informatik.tu-freiberg.de/\")\r\n//window.CodeRunner.init(\"wss://ancient-hollows-41316.herokuapp.com/\")\r\nwindow.CodeRunner.init(\"wss://testing-coderunner.andreaschwertne.repl.co/\")\r\n//window.CodeRunner.init(\"ws://127.0.0.1:8000/\")\r\n\r\n@end\r\n\r\n\r\n@LIA.c:       @LIA.eval(`[\"main.c\"]`, `gcc -Wall main.c -o a.out`, `./a.out`)\r\n@LIA.clojure: @LIA.eval(`[\"main.clj\"]`, `none`, `clojure -M main.clj`)\r\n@LIA.cpp:     @LIA.eval(`[\"main.cpp\"]`, `g++ main.cpp -o a.out`, `./a.out`)\r\n@LIA.go:      @LIA.eval(`[\"main.go\"]`, `go build main.go`, `./main`)\r\n@LIA.haskell: @LIA.eval(`[\"main.hs\"]`, `ghc main.hs -o main`, `./main`)\r\n@LIA.java:    @LIA.eval(`[\"@0.java\"]`, `javac @0.java`, `java @0`)\r\n@LIA.julia:   @LIA.eval(`[\"main.jl\"]`, `none`, `julia main.jl`)\r\n@LIA.mono:    @LIA.eval(`[\"main.cs\"]`, `mcs main.cs`, `mono main.exe`)\r\n@LIA.nasm:    @LIA.eval(`[\"main.asm\"]`, `nasm -felf64 main.asm \u0026\u0026 ld main.o`, `./a.out`)\r\n@LIA.python:  @LIA.python3\r\n@LIA.python2: @LIA.eval(`[\"main.py\"]`, `python2.7 -m compileall .`, `python2.7 main.pyc`)\r\n@LIA.python3: @LIA.eval(`[\"main.py\"]`, `none`, `python3 main.py`)\r\n@LIA.r:       @LIA.eval(`[\"main.R\"]`, `none`, `Rscript main.R`)\r\n@LIA.rust:    @LIA.eval(`[\"main.rs\"]`, `rustc main.rs`, `./main`)\r\n@LIA.zig:     @LIA.eval(`[\"main.zig\"]`, `zig build-exe ./main.zig -O ReleaseSmall`, `./main`)\r\n\r\n@LIA.dotnet:  @LIA.dotnet_(@uid)\r\n\r\n@LIA.dotnet_\r\n\u003cscript\u003e\r\nvar uid = \"@0\"\r\nvar files = []\r\n\r\nfiles.push([\"project.csproj\", `\u003cProject Sdk=\"Microsoft.NET.Sdk\"\u003e\r\n  \u003cPropertyGroup\u003e\r\n    \u003cOutputType\u003eExe\u003c/OutputType\u003e\r\n    \u003cTargetFramework\u003enet6.0\u003c/TargetFramework\u003e\r\n    \u003cImplicitUsings\u003eenable\u003c/ImplicitUsings\u003e\r\n    \u003cNullable\u003eenable\u003c/Nullable\u003e\r\n  \u003c/PropertyGroup\u003e\r\n\u003c/Project\u003e`])\r\n\r\nfiles.push([\"Program.cs\", `@input(0)`])\r\n\r\nsend.handle(\"input\", (e) =\u003e {\r\n    CodeRunner.send(uid, {stdin: e})\r\n})\r\nsend.handle(\"stop\",  (e) =\u003e {\r\n    CodeRunner.send(uid, {stop: true})\r\n});\r\n\r\n\r\nCodeRunner.handle(uid, function (msg) {\r\n    switch (msg.service) {\r\n        case 'data': {\r\n            if (msg.ok) {\r\n                CodeRunner.send(uid, {compile: \"dotnet build -nologo\"})\r\n            }\r\n            else {\r\n                send.lia(\"LIA: stop\")\r\n            }\r\n            break;\r\n        }\r\n        case 'compile': {\r\n            if (msg.ok) {\r\n                if (msg.message) {\r\n                    if (msg.problems.length)\r\n                        console.warn(msg.message);\r\n                    else\r\n                        console.log(msg.message);\r\n                }\r\n\r\n                send.lia(\"LIA: terminal\")\r\n                console.clear()\r\n                CodeRunner.send(uid, {exec: \"dotnet run\"})\r\n            } else {\r\n                send.lia(msg.message, msg.problems, false)\r\n                send.lia(\"LIA: stop\")\r\n            }\r\n            break;\r\n        }\r\n        case 'stdout': {\r\n            if (msg.ok)\r\n                console.stream(msg.data)\r\n            else\r\n                console.error(msg.data);\r\n            break;\r\n        }\r\n\r\n        case 'stop': {\r\n            if (msg.error) {\r\n                console.error(msg.error);\r\n            }\r\n\r\n            if (msg.images) {\r\n                for(let i = 0; i \u003c msg.images.length; i++) {\r\n                    console.html(\"\u003chr/\u003e\", msg.images[i].file)\r\n                    console.html(\"\u003cimg title='\" + msg.images[i].file + \"' src='\" + msg.images[i].data + \"' onclick='window.LIA.img.click(\\\"\" + msg.images[i].data + \"\\\")'\u003e\")\r\n                }\r\n\r\n            }\r\n\r\n            send.lia(\"LIA: stop\")\r\n            break;\r\n        }\r\n\r\n        default:\r\n            console.log(msg)\r\n            break;\r\n    }\r\n})\r\n\r\n\r\nCodeRunner.send(\r\n    uid, { \"data\": files }\r\n);\r\n\r\n\"LIA: wait\"\r\n\u003c/script\u003e\r\n@end\r\n\r\n@LIA.eval:  @LIA.eval_(false,@uid,`@0`,@1,@2)\r\n\r\n@LIA.evalWithDebug: @LIA.eval_(true,@uid,`@0`,@1,@2)\r\n\r\n@LIA.eval_\r\n\u003cscript\u003e\r\nconst uid = \"@1\"\r\nvar order = @2\r\nvar files = []\r\n\r\nif (order[0])\r\n  files.push([order[0], `@'input(0)`])\r\nif (order[1])\r\n  files.push([order[1], `@'input(1)`])\r\nif (order[2])\r\n  files.push([order[2], `@'input(2)`])\r\nif (order[3])\r\n  files.push([order[3], `@'input(3)`])\r\nif (order[4])\r\n  files.push([order[4], `@'input(4)`])\r\nif (order[5])\r\n  files.push([order[5], `@'input(5)`])\r\nif (order[6])\r\n  files.push([order[6], `@'input(6)`])\r\nif (order[7])\r\n  files.push([order[7], `@'input(7)`])\r\nif (order[8])\r\n  files.push([order[8], `@'input(8)`])\r\nif (order[9])\r\n  files.push([order[9], `@'input(9)`])\r\n\r\n\r\nsend.handle(\"input\", (e) =\u003e {\r\n    CodeRunner.send(uid, {stdin: e})\r\n})\r\nsend.handle(\"stop\",  (e) =\u003e {\r\n    CodeRunner.send(uid, {stop: true})\r\n});\r\n\r\n\r\nCodeRunner.handle(uid, function (msg) {\r\n    switch (msg.service) {\r\n        case 'data': {\r\n            if (msg.ok) {\r\n                CodeRunner.send(uid, {compile: @3})\r\n            }\r\n            else {\r\n                send.lia(\"LIA: stop\")\r\n            }\r\n            break;\r\n        }\r\n        case 'compile': {\r\n            if (msg.ok) {\r\n                if (msg.message) {\r\n                    if (msg.problems.length)\r\n                        console.warn(msg.message);\r\n                    else\r\n                        console.log(msg.message);\r\n                }\r\n\r\n                send.lia(\"LIA: terminal\")\r\n                CodeRunner.send(uid, {exec: @4})\r\n\r\n                if(!@0) {\r\n                  console.clear()\r\n                }\r\n            } else {\r\n                send.lia(msg.message, msg.problems, false)\r\n                send.lia(\"LIA: stop\")\r\n            }\r\n            break;\r\n        }\r\n        case 'stdout': {\r\n            if (msg.ok)\r\n                console.stream(msg.data)\r\n            else\r\n                console.error(msg.data);\r\n            break;\r\n        }\r\n\r\n        case 'stop': {\r\n            if (msg.error) {\r\n                console.error(msg.error);\r\n            }\r\n\r\n            if (msg.images) {\r\n                for(let i = 0; i \u003c msg.images.length; i++) {\r\n                    console.html(\"\u003chr/\u003e\", msg.images[i].file)\r\n                    console.html(\"\u003cimg title='\" + msg.images[i].file + \"' src='\" + msg.images[i].data + \"' onclick='window.LIA.img.click(\\\"\" + msg.images[i].data + \"\\\")'\u003e\")\r\n                }\r\n\r\n            }\r\n\r\n            send.lia(\"LIA: stop\")\r\n            break;\r\n        }\r\n\r\n        default:\r\n            console.log(msg)\r\n            break;\r\n    }\r\n})\r\n\r\n\r\nCodeRunner.send(\r\n    uid, { \"data\": files }\r\n);\r\n\r\n\"LIA: wait\"\r\n\u003c/script\u003e\r\n@end\r\n\r\n\r\n\r\n--\u003e\r\n\u003c!--\r\nnvm use v14.21.1\r\nliascript-devserver --input README.md --port 3001 --live\r\nlink:     https://cdn.jsdelivr.net/gh/liascript/custom-style/custom.min.css\r\n          https://cdn.jsdelivr.net/gh/andreainfufsm/elc106-2023a/classes/12/custom.css\r\n\r\n--\u003e\r\n\r\n\r\n# Algoritmos, códigos e programação\r\n\r\n\r\n\r\n\u003cdiv id=\"gpt1\"\u003e\u003c/div\u003e\r\n\r\n\u003cscript\u003e\r\n  const typedText = document.getElementById('gpt1');\r\n  typedText.style.fontSize = \"32px\"; \r\n\r\n  const textToType = 'Aliados da criatividade!';\r\n  let currentIndex = 0;\r\n\r\n  function typeCharacter() {\r\n    typedText.innerHTML += textToType[currentIndex];\r\n    currentIndex += 1;\r\n\r\n    if (currentIndex \u003c textToType.length) {\r\n      setTimeout(typeCharacter, 100);\r\n    }\r\n  }\r\n\r\n  typeCharacter();\r\n\u003c/script\u003e\r\n\r\n                 {{1}}\r\n************************************************\r\n\r\nQuem?\r\n\r\n\u003e Sou professora da área de Computação no Centro de Tecnologia da UFSM\r\n\r\n************************************************\r\n\r\n\r\n                 {{2}}\r\n************************************************\r\n\r\nO quê?\r\n\r\n\u003e Um ponto de vista sobre algumas interAÇÕES na temática do evento\r\n\r\n************************************************\r\n\r\n\r\n## Programação \r\n\r\nDefinição clássica:\r\n\r\n\u003e Processo de criar algoritmos e instruções que possam ser executados por um computador para realizar tarefas.\r\n\r\n\r\n### É uma arte?!\r\n\r\nProgramação como uma arte:\r\n\r\n\u003e Dicionário Priberam: *\"Capacidade ou habilidade para a aplicação de conhecimento ou para a execução de uma ideia.*\"\r\n\r\n\r\n\t\t\t\t\t\t\t\t {{1}}\r\n************************************************\r\n\r\nDonald Knuth. The Art of Computer Programming. 1st ed. 1968, rev. 1997.\r\n\r\n![](img/shopping.png)\r\n\r\n\r\n************************************************\r\n\r\n\t\t\t\t\t\t\t\t {{2}}\r\n************************************************\r\n\r\nWinnie Soon, Geoff Cox. Aesthetic Programming: A Handbook of Software Studies\r\nhttp://www.openhumanitiespress.org/books/titles/aesthetic-programming/\r\n\r\n![](img/estetica.png)\r\n\r\n\r\n\r\n************************************************\r\n\r\n\r\n### É um superpoder!?\r\n\r\n\u003e Ações para público jovem têm apresentado programação como um \"superpoder\"\r\n\r\n                 {{1}}\r\n************************************************\r\n\r\nPoder de visão \"raio-x\":\r\n\r\n![](img/Earth2AXRayvision1-resize.png)\r\n\r\n************************************************\r\n\r\n\r\n                 {{2}}\r\n************************************************\r\n\r\nPoder de criação:\r\n\r\n![](img/superpower-creation.png)\r\n\r\n************************************************\r\n\r\n\r\n## Desafios, criações, códigos\r\n\r\n\r\n\u003cdiv id=\"gpt2\"\u003e\u003c/div\u003e\r\n\r\n\u003cscript\u003e\r\n  const typedText = document.getElementById('gpt2');\r\n  typedText.style.fontSize = \"32px\"; \r\n\r\n  const textToType = 'Dois exemplos de interAÇÕES...';\r\n  let currentIndex = 0;\r\n\r\n  function typeCharacter() {\r\n    typedText.innerHTML += textToType[currentIndex];\r\n    currentIndex += 1;\r\n\r\n    if (currentIndex \u003c textToType.length) {\r\n      setTimeout(typeCharacter, 100);\r\n    }\r\n  }\r\n\r\n  typeCharacter();\r\n\u003c/script\u003e\r\n\r\n\r\n![](img/screenshot-interacoes.png)\r\n\r\n### Games de Paradigmas de Programação\r\n\r\nUm desafio: \r\n\r\n\u003e Criar games no tema \"Ciência, Biologia e Meio Ambiente\" como projeto final de disciplina de programação.\r\n\r\n                 {{1}}\r\n************************************************\r\n\r\nVarias criações: \r\n\r\n\u003e Muitos games e uma galeria ilustrada!\r\n\r\nhttps://itch.io/jam/games-paradigmas-programacao-ufsm-2020a\r\n\r\n\r\n![](img/recording.gif)\r\n\r\n\r\n************************************************\r\n\r\n                 {{2}}\r\n************************************************\r\nUm dos games criados: \r\n\r\n\u003e Uma sereia acordou de um sono profundo só para se deparar com seu lar repleto de lixo e sem nenhum peixe à sua volta. Seu objetivo é limpar a água e assim criar um lugar que possa ter vida novamente.\r\n\r\n\r\nhttps://alegz.itch.io/syrene\r\n\r\n![](img/screen-syrene.png)\r\n\r\n************************************************\r\n\r\n\r\n                 {{3}}\r\n************************************************\r\n\r\nUm código:\r\n\r\n\u003e Apenas algumas das 5354 linhas em linguagem Java\r\n\r\n``` java\r\npackage com.alegz.mermaid;\r\n\r\nimport com.alegz.mermaid.rendering.Renderer;\r\nimport com.alegz.mermaid.rendering.material.Material;\r\nimport com.alegz.mermaid.states.GameState;\r\nimport com.alegz.mermaid.states.MenuState;\r\nimport com.alegz.mermaid.utils.GameUtils;\r\nimport com.badlogic.gdx.ApplicationListener;\r\nimport com.badlogic.gdx.Gdx;\r\nimport com.badlogic.gdx.math.Matrix4;\r\n\r\npublic class MermaidGame implements ApplicationListener\r\n{\r\n\tprivate Assets assets;\r\n\t\r\n\tprivate Renderer renderer;\r\n\tprivate float t;\r\n\t\r\n\tprivate GameState gameState;\r\n\tprivate GameState transitionState;\r\n\t\r\n\t@Override\r\n\tpublic void create () \r\n\t{\r\n\t\tassets = new Assets();\r\n\t\tassets.load();\r\n\t\t\r\n\t\trenderer = new Renderer(1);\r\n\t\trenderer.setProjectionMatrix(new Matrix4().scl(2.0f, 2.0f, 1.0f));\r\n\t\t\r\n\t\tSoundManager.init(assets);\r\n\t\tSoundManager.playMusic();\r\n\t\t\r\n\t\tchangeState(new MenuState(this, assets));\r\n\t}\r\n\r\n\t@Override\r\n\tpublic void render () \r\n\t{\r\n\t\tgameState.update();\r\n\t\tif (transitionState != null)\r\n\t\t\ttransition();\r\n\t\tSoundManager.update();\r\n\t}\r\n\t\r\n\tpublic void setState(GameState newState)\r\n\t{\r\n\t\tif (transitionState != null || newState == null)\r\n\t\t\treturn;\r\n\t\ttransitionState = newState;\r\n\t\tt = -1.0f;\r\n\t}\r\n\t\r\n\tprivate void changeState(GameState newState)\r\n\t{\r\n\t\tif (newState == null)\r\n\t\t\treturn;\r\n\t\tif (gameState != null)\r\n\t\t\tgameState.dispose();\r\n\t\tnewState.create();\r\n\t\tnewState.resize(Gdx.graphics.getWidth(), Gdx.graphics.getHeight());\r\n\t\tgameState = newState;\r\n\t}\r\n\t\r\n\tprivate void transition()\r\n\t{\r\n\t\tfloat cutout = GameUtils.easeStep(Math.abs(t));\r\n\t\tfloat flip = t \u003c 0.0f ? 0.0f : 1.0f;\r\n\t\t\r\n\t\tMaterial transition = assets.getMaterial(Assets.MATERIAL_TRANSITION);\r\n\t\ttransition.setFloat(\"u_cutout\", cutout);\r\n\t\ttransition.setFloat(\"u_flip\", flip);\r\n\t\ttransition.setVector2(\"u_size\", 6.0f * Gdx.graphics.getWidth() / Gdx.graphics.getHeight(), 6.0f);\r\n\t\t\r\n\t\trenderer.begin();\r\n\t\trenderer.setMaterial(transition);\r\n\t\trenderer.draw();\r\n\t\trenderer.end();\r\n\t\t\r\n\t\tfloat oldT = t;\r\n\t\tt += Gdx.graphics.getDeltaTime();\r\n\t\tif (oldT \u003c 0.0f \u0026\u0026 t \u003e= 0.0f)\r\n\t\t\tchangeState(transitionState);\r\n\t\telse if (oldT \u003c 1.0f \u0026\u0026 t \u003e= 1.0f)\r\n\t\t\ttransitionState = null;\r\n\t}\r\n\t\r\n\t@Override\r\n\tpublic void resize(int width, int height)\r\n\t{\r\n\t\tgameState.resize(width, height);\r\n\t}\r\n\t\r\n\t@Override\r\n\tpublic void pause()\r\n\t{\r\n\t\tgameState.pause();\r\n\t\tSoundManager.stopMusic();\r\n\t}\r\n\t\r\n\t@Override\r\n\tpublic void resume()\r\n\t{\r\n\t\tgameState.resume();\r\n\t\tSoundManager.playMusic();\r\n\t}\r\n\t\r\n\t@Override\r\n\tpublic void dispose () \r\n\t{\r\n\t\tgameState.dispose();\r\n\t\tassets.dispose();\r\n\t}\r\n}\r\n```\r\n\r\n************************************************\r\n\r\n\r\n\r\n### Visita Autoguiada ao Jardim Botânico\r\n\r\nUm desafio:\r\n\r\n\u003e Criar um app para visitantes do Jardim Botânico da UFSM\r\n\r\n                 {{1}}\r\n************************************************\r\n\r\nUma criação:\r\n\r\n\u003e Projeto de interface, equipe do Desenho Industrial UFSM\r\n\r\n![](img/app-jbsm1.png) \r\n\r\n\r\n************************************************\r\n\r\n                 {{2}}\r\n************************************************\r\n\r\nUma criação:\r\n\r\n\u003e App em desenvolvimento...\r\n\r\n![](img/recording-jb.gif)\r\n\r\n\r\n************************************************\r\n\r\n                 {{3}}\r\n************************************************\r\n\r\nUm código:\r\n\r\n\u003e Apenas algumas linhas em linguagem JavaScript\r\n\r\n``` javascript\r\nimport { defineStore } from 'pinia';\r\nimport { api } from 'boot/axios';\r\n\r\nexport const useArraysStore = defineStore('arrays', {\r\n\tstate: () =\u003e ({\r\n\t\tpointsOfInterest: [],\r\n\t\tpointsOfInterestLoaded: false,\r\n\t\tcollection: [],\r\n\t\tcollectionLoaded: false,\r\n\t\thikingTrails: [],\r\n\t\thikingTrailsLoaded: false,\r\n\t}),\r\n\r\n\tgetters: {\r\n\t},\r\n\r\n\tactions: {\r\n\t\taddToPointsOfInterest(item) {\r\n\t\t\tthis.pointsOfInterest.push(item);\r\n\t\t},\r\n\r\n\t\taddToCollection(item) {\r\n\t\t\tthis.collection.push(item);\r\n\t\t},\r\n\r\n\t\taddToHikingTrails(item) {\r\n\t\t\tthis.hikingTrails.push(item);\r\n\t\t},\r\n\r\n\t\tasync loadPointsOfInterest() {\r\n\t\t\tif (this.pointsOfInterestLoaded === true)\r\n\t\t\t\treturn;\r\n\r\n\t\t\tconst pointsOfInterest = await this.readSheet('pontos_interesse');\r\n\t\t\tthis.handlePointOfInterestSpreadsheetData(pointsOfInterest);\r\n\t\t\tthis.pointsOfInterestLoaded = true;\r\n\t\t},\r\n\r\n\t\tasync loadCollection() {\r\n\t\t\tif (this.collectionLoaded === true)\r\n\t\t\t\treturn;\r\n\r\n\t\t\tconst collection = await this.readSheet('acervo');\r\n\t\t\tthis.handleCollectionSpreadsheetData(collection);\r\n\t\t\tthis.collectionLoaded = true;\r\n\t\t},\r\n\r\n\t\tasync loadHikingTrails() {\r\n\t\t\tif (this.hikingTrailsLoaded === true)\r\n\t\t\t\treturn;\r\n\r\n\t\t\tconst hikingTrails = await this.readSheet('trilhas');\r\n\t\t\tthis.handleHikingTrailsSpreadsheetData(hikingTrails);\r\n\t\t\tthis.hikingTrailsLoaded = true;\r\n\t\t},\r\n\r\n\t\tasync loadHikingTrailPoints(hikingTraildId) {\r\n\t\t\tif (hikingTraildId == null)\r\n\t\t\t\treturn;\r\n\r\n\t\t\tvar hikingTrail = this.hikingTrails.find(hikingTrail =\u003e hikingTrail.id === hikingTraildId);\r\n\r\n\t\t\tif (hikingTrail == null || hikingTrail.pointsLoaded === true)\r\n\t\t\t\treturn;\r\n\r\n\t\t\tconst hikingTrailPoints = await this.readSheet('pontos_trilha');\r\n\t\t\tthis.handleHikingTrailPointsSpreadsheetData(hikingTrail, hikingTrailPoints);\r\n\t\t\thikingTrail.pointsLoaded = true;\r\n\t\t},\r\n\r\n\t\tasync readSheet(sheetName) {\r\n\t\t\tconst url = `https://sheets.googleapis.com/v4/spreadsheets/${process.env.VUE_APP_SPREADSHEET_ID}/values/${sheetName}?key=${process.env.VUE_APP_API_KEY}`;\r\n\t\t\tconst response = await api.get(url);\r\n\r\n\t\t\tif (response.data \u0026\u0026 response.data.values) {\r\n\t\t\t\treturn response.data.values;\r\n\t\t\t} else {\r\n\t\t\t\treturn [];\r\n\t\t\t}\r\n\t\t},\r\n\r\n\t\thandlePointOfInterestSpreadsheetData(data) {\r\n\t\t\tconst header = data[0];\r\n\t\t\tconst body = data.slice(1);\r\n\r\n\t\t\tbody.forEach(row =\u003e {\r\n\t\t\t\tconst poi = {};\r\n\t\t\t\trow.forEach((value, index) =\u003e {\r\n\t\t\t\t\tpoi[header[index]] = value;\r\n\t\t\t\t});\r\n\t\t\t\tif (poi.id == null || poi.categoria == null || poi.nome == null || poi.latitude == null || poi.longitude == null)\r\n\t\t\t\t\treturn;\r\n\r\n\t\t\t\tpoi.links = this.handleLinks(poi.generic_links, poi.drive_links);\r\n\r\n\t\t\t\tthis.addToPointsOfInterest(poi);\r\n\t\t\t});\r\n\t\t},\r\n\r\n\t\thandleCollectionSpreadsheetData(data) {\r\n\t\t\tconst header = data[0];\r\n\t\t\tconst body = data.slice(1);\r\n\r\n\t\t\tbody.forEach(row =\u003e {\r\n\t\t\t\tconst colItem = {};\r\n\t\t\t\trow.forEach((value, index) =\u003e {\r\n\t\t\t\t\tcolItem[header[index]] = value;\r\n\t\t\t\t});\r\n\t\t\t\tif (colItem.id == null || colItem.nome == null)\r\n\t\t\t\t\treturn;\r\n\r\n\t\t\t\tcolItem.links = this.handleLinks(colItem.generic_links, colItem.drive_links);\r\n\r\n\t\t\t\tthis.addToCollection(colItem);\r\n\t\t\t});\r\n\t\t},\r\n\r\n\t\thandleHikingTrailsSpreadsheetData(data) {\r\n\t\t\tconst header = data[0];\r\n\t\t\tconst body = data.slice(1);\r\n\r\n\t\t\tbody.forEach(row =\u003e {\r\n\t\t\t\tconst hikingTrail = {};\r\n\t\t\t\trow.forEach((value, index) =\u003e {\r\n\t\t\t\t\thikingTrail[header[index]] = value;\r\n\t\t\t\t});\r\n\t\t\t\tif (hikingTrail.id == null || hikingTrail.nome == null)\r\n\t\t\t\t\treturn;\r\n\r\n\t\t\t\thikingTrail.pointsLoaded = false;\r\n\t\t\t\thikingTrail.points = [];\r\n\r\n\t\t\t\tthis.addToHikingTrails(hikingTrail);\r\n\t\t\t});\r\n\t\t},\r\n\r\n\t\thandleHikingTrailPointsSpreadsheetData(hikingTrail, data) {\r\n\t\t\tconst header = data[0];\r\n\t\t\tconst body = data.slice(1);\r\n\r\n\t\t\tbody.forEach(row =\u003e {\r\n\t\t\t\tconst hikingTrailPoint = {};\r\n\t\t\t\trow.forEach((value, index) =\u003e {\r\n\t\t\t\t\thikingTrailPoint[header[index]] = value;\r\n\t\t\t\t});\r\n\t\t\t\tif ([hikingTrailPoint.trilha_id, hikingTrailPoint.latitude, hikingTrailPoint.longitude, hikingTrailPoint.ordem].some(value =\u003e value == null))\r\n\t\t\t\t\treturn;\r\n\t\t\t\tif (hikingTrailPoint.trilha_id != hikingTrail.id)\r\n\t\t\t\t\treturn;\r\n\r\n\t\t\t\thikingTrail.points.push(hikingTrailPoint);\r\n\t\t\t});\r\n\t\t\thikingTrail.points.sort((a, b) =\u003e a.ordem - b.ordem);\r\n\t\t},\r\n\r\n\t\thandleLinks(generic_links, drive_links) {\r\n\t\t\tif (generic_links == null \u0026\u0026 drive_links == null)\r\n\t\t\t\treturn null;\r\n\r\n\t\t\tlet links = [];\r\n\t\t\tif (generic_links != null) {\r\n\t\t\t\tgeneric_links.split(';').forEach(link =\u003e {\r\n\t\t\t\t\tlinks.push(link.trim());\r\n\t\t\t\t});\r\n\t\t\t}\r\n\t\t\tif (drive_links != null) {\r\n\t\t\t\tdrive_links.split(';').forEach(link =\u003e {\r\n\t\t\t\t\tlet driveId = link.split('/')[5];\r\n\t\t\t\t\tlinks.push('https://lh3.googleusercontent.com/d/' + driveId);\r\n\t\t\t\t});\r\n\t\t\t}\r\n\t\t\treturn links;\r\n\t\t},\r\n\r\n\t}\r\n})\r\n```\r\n************************************************\r\n\r\n\r\n\r\n## Um desafio, uma experiência\r\n\r\nUm desafio:\r\n\r\n\u003e Pensar em formas inovadoras de visualizar (e compartilhar) uma visita ao Jardim Botânico, usando um mapa como pano de fundo. \r\n\r\nUm QR Code:\r\n\r\n\u003cdiv id=\"qrcode\"\u003e\u003c/div\u003e\r\n\r\n\u003cscript\u003e\r\n  var qrcode = new QRCode(document.getElementById(\"qrcode\"), {\r\n    text: window.location.href,\r\n    width: 256,\r\n    height: 256\r\n  });\r\n\u003c/script\u003e\r\n\r\n\r\n\r\n                 {{1}}\r\n************************************************\r\n\r\nUm código para compartilharmos ideias (concorrente do \"mentimeter\" :-) ):\r\n\r\n``` python\r\nimport requests\r\n\r\ndata = 'minha ideia'\r\n\r\nurl = 'https://script.google.com/macros/s/AKfycbyp7nIYtEIGPmXe53f5wfgxxg7xOgAWm1oVy0jMFbzDH0vBm6-iG5CTT5Ho5R7x7hD0/exec' \r\nprint('Enviando...')\r\nresponse = requests.post(url, json=data)\r\nprint('Pronto!')\r\n```\r\n@LIA.eval(`[\"main.py\"]`, `none`, `python3 main.py`)\r\n\r\n\r\n************************************************\r\n\r\n                 {{2}}\r\n************************************************\r\n\r\nNosso \"mural\" de ideias:\r\n\r\n\r\n``` python\r\nimport requests\r\n\r\nurl = 'https://script.google.com/macros/s/AKfycbyp7nIYtEIGPmXe53f5wfgxxg7xOgAWm1oVy0jMFbzDH0vBm6-iG5CTT5Ho5R7x7hD0/exec' \r\n\r\nresponse = requests.get(url)\r\nprint('Buscando ideias geradas:')\r\nif response.status_code == 200:\r\n  json_data = response.json()\r\n  for item in json_data['values']:\r\n    print(item)\r\nelse:\r\n  print(f'HTTP Error: {response.status_code}')\r\n```\r\n@LIA.eval(`[\"main.py\"]`, `none`, `python3 main.py`)\r\n\r\n\r\n************************************************\r\n\r\n\r\n                 {{3}}\r\n************************************************\r\n\r\n![](img/theend.png)\r\n\r\n************************************************\r\n\r\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fandreainfufsm%2Fevento-interacoes","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fandreainfufsm%2Fevento-interacoes","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fandreainfufsm%2Fevento-interacoes/lists"}