{"id":24429214,"url":"https://github.com/peterk/sitevision-geoform","last_synced_at":"2026-01-28T16:31:27.855Z","repository":{"id":66470435,"uuid":"13448988","full_name":"peterk/sitevision-geoform","owner":"peterk","description":"Några skriptrader för att skapa geopositionering i ett mobilformulär i Sitevision.","archived":false,"fork":false,"pushed_at":"2013-10-10T20:37:17.000Z","size":524,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-06-04T05:10:34.760Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/peterk.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2013-10-09T17:32:37.000Z","updated_at":"2013-10-10T20:37:19.000Z","dependencies_parsed_at":"2023-02-20T06:45:50.262Z","dependency_job_id":null,"html_url":"https://github.com/peterk/sitevision-geoform","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/peterk/sitevision-geoform","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/peterk%2Fsitevision-geoform","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/peterk%2Fsitevision-geoform/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/peterk%2Fsitevision-geoform/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/peterk%2Fsitevision-geoform/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/peterk","download_url":"https://codeload.github.com/peterk/sitevision-geoform/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/peterk%2Fsitevision-geoform/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28847015,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-28T15:15:36.453Z","status":"ssl_error","status_checked_at":"2026-01-28T15:15:13.020Z","response_time":57,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":"2025-01-20T13:33:52.249Z","updated_at":"2026-01-28T16:31:27.838Z","avatar_url":"https://github.com/peterk.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"Sitevision mobilformulär\n========================\n\n\u003cdiv style=\"float:right\"\u003e\u003cimg width=\"220\" src=\"https://raw.github.com/peterk/sitevision-geoform/master/screens/ios.png\" alt=\"iPhone som visar ett formulär med en karta i. Koden använder telefonens GPS för att positionera användaren.\" width\u003e\u003c/div\u003e\n\nEn miniguide för att skapa ett mobilformulär med geopositionering och bifoga\nbild i Sitevision. Testat i Sitevision version 3.5.3 men bör fungera från 3.0.\nMålet är att skapa ett formulär som fingerar i de flesta moderna mobiltelefoner\nmed stöd för positionering.\n\nInnehåll:\n\n1. Skapa en responsiv mall med ett fast flexibelt grid (om du inte redan har en)\n2. Skapa en ny sida\n3. Skapa ett e-postformulär med fält för positionering\n4. Några småfixar\n\n\n### \u003ca id=\"h1\"\u003e\u003c/a\u003e1. Skapa en responsiv mall med ett grid\n\nOm du inte redan har en responsiv mall skapar du en ny tom mall baserad på \"Blank mall\". Se till att du först har aktiverat grids på webbplatsen ([se manualen om grids](http://help.sitevision.se/SiteVision_3_0/gridConfigRepository.html) för mer info) och slagit på responsive design.\n\nI denna mall har jag skapat en gridrad och två gridspalter om 6 kolumner vardera. Då kan man ha instruktioner eller liknande till höger om formuläret.\n\n![Översikt över delarna i en mall i Sitevision](https://raw.github.com/peterk/sitevision-geoform/master/screens/00_grid-template.png)\n\n\n### \u003ca id=\"h2\"\u003e\u003c/a\u003e2. Skapa en sida\n\nSkapa en ny sida baserad på föregående mall. Ställ in \"Tillägg i head\" på sidan och peka ut denna stilmallsfil: https://netdna.bootstrapcdn.com/bootswatch/2.3.2/cerulean/bootstrap.min.css - den gör knappar lite tydligare. Lägg till en logotyp och en inledande text på sidan.\n\n![Inlänkning av extern CSS fil under egenskaper på sidan](https://raw.github.com/peterk/sitevision-geoform/master/screens/02_head-css.png)\n\n\n### \u003ca id=\"h3\"\u003e\u003c/a\u003e3. Skapa ett e-postformulär med fält för positionering\n\nFörst ska vi skapa ett skriptfält med namnet \"Plats\" och två delfält som ska lagra latitud och longitud. Dessa sätts automatiskt via GPS:en i användarens telefon. Lägg till skriptfältet så här:\n\n![Skriptfält i modulen E-postformulär](https://raw.github.com/peterk/sitevision-geoform/master/screens/01_skript-plats.png)\n\nLägg till delfälten med namnet \"lat\" och \"lon\":\n\n![Delfråga med namnet lat](https://raw.github.com/peterk/sitevision-geoform/master/screens/02_screen_lat.png)\n\nUnder fliken \"Skript\" för skriptfältet klickar du på \"Velocity\" och klistrar in [koden för fälten från denna fil](https://github.com/peterk/sitevision-geoform/blob/master/skriptfaltkod.vm). Koden anropar Google Maps API och ritar upp en liten karta med aktuell position.\n\nSkapa de fält du vill ha utöver platsangivelsen. Förslagsvis skapar du ett beskrivningsfält, ett bifoga fil-fält samt namn och kontaktuppgifter till den som rapporterar med formuläret. Fält för att bifoga fil brukar öppna kameran eller galleriet på de flesta mobiler.\n\nStäll in övriga saker för formuläret (e-postmottagare etc).\n\n\n### \u003ca id=\"h4\"\u003e\u003c/a\u003e4. Några småfixar\n\nFör några sista fixar lägger vi en HTML-modul sist på sidan i vilken vi klistrar in följande kod:\n\n```html\n\u003cscript type=\"text/javascript\"\u003e\n  //Sätt lite stilar på Sitevisions standardknapp\n  document.querySelector(\"input[type='submit']\").setAttribute(\"class\", \"btn btn-large btn-primary\");\n\u003c/script\u003e\n```\n\nAnge även lite CSS-tweaks för att snygga upp Sitevisions standardgenerering av formulärfält genom att i egenskaper på sidan ange följande CSS:\n\n```css\ntextarea, input {\n    width:97%;\n}\nform div br {\n    display:none;\n}\nlabel {\n    font-weight:bold;\n    clear:both;\n}\n```\n\n![Egen stil på sidan](https://raw.github.com/peterk/sitevision-geoform/master/screens/03_egen-stil.png)\n\nKlart! Du har nu byggt ett mobilanpasat formulär med positionering som kan användas för t.ex. felrapportering.\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpeterk%2Fsitevision-geoform","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpeterk%2Fsitevision-geoform","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpeterk%2Fsitevision-geoform/lists"}