From 1109132f09d75da9a28b649c7677bb6ce07c40c0 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:45 -0500 Subject: initial commit --- files/fi/_redirects.txt | 6 + files/fi/_wikihistory.json | 360 +++++++++++++++ files/fi/archive/api/index.html | 13 + files/fi/archive/api/navigator/index.html | 8 + .../api/navigator/moznotification/index.html | 53 +++ files/fi/archive/b2g_os/api/index.html | 14 + files/fi/archive/b2g_os/api/navigator/index.html | 18 + .../b2g_os/api/navigator/mozapps/index.html | 77 ++++ .../b2g_os/api/navigator/moztelephony/index.html | 40 ++ files/fi/archive/b2g_os/api/telephony/index.html | 105 +++++ files/fi/archive/b2g_os/index.html | 229 +++++++++ files/fi/archive/index.html | 21 + files/fi/demos/detail/index.html | 5 + files/fi/demos/index.html | 5 + files/fi/dom/index.html | 90 ++++ files/fi/dom/navigator.donottrack/index.html | 73 +++ files/fi/dom/navigator.id/index.html | 43 ++ files/fi/dom/navigator.mozsocial/index.html | 45 ++ files/fi/dom/smsmanager/index.html | 88 ++++ .../fi/dom/window.navigator.appcodename/index.html | 23 + files/fi/dom/window.navigator.appname/index.html | 27 ++ .../fi/dom/window.navigator.appversion/index.html | 32 ++ files/fi/dom/window.navigator.battery/index.html | 137 ++++++ files/fi/dom/window.navigator.buildid/index.html | 21 + .../fi/dom/window.navigator.connection/index.html | 100 ++++ .../dom/window.navigator.cookieenabled/index.html | 99 ++++ files/fi/dom/window.navigator.language/index.html | 82 ++++ files/fi/dom/window.navigator.mimetypes/index.html | 22 + files/fi/dom/window.navigator.mozsms/index.html | 49 ++ files/fi/dom/window.navigator.online/index.html | 101 ++++ files/fi/dom/window.navigator.oscpu/index.html | 70 +++ files/fi/dom/window.navigator.platform/index.html | 22 + files/fi/dom/window.navigator.plugins/index.html | 39 ++ files/fi/dom/window.navigator.product/index.html | 36 ++ .../fi/dom/window.navigator.productsub/index.html | 29 ++ files/fi/dom/window.navigator.useragent/index.html | 42 ++ files/fi/dom/window.navigator.vendor/index.html | 24 + files/fi/dom/window.navigator/index.html | 110 +++++ files/fi/fi/index.html | 21 + .../index.html | 97 ++++ files/fi/html/canvas/index.html | 73 +++ files/fi/html/index.html | 84 ++++ files/fi/learn/index.html | 122 +++++ .../javascript/ensimmaiset_askeleet/index.html | 54 +++ files/fi/learn/javascript/index.html | 53 +++ files/fi/mozilla/add-ons/index.html | 83 ++++ files/fi/mozilla/add-ons/webextensions/index.html | 85 ++++ .../what_are_webextensions/index.html | 60 +++ files/fi/mozilla/command_line_options/index.html | 269 +++++++++++ .../helppok\303\244ytt\303\266isyys/index.html" | 13 + files/fi/mozilla/index.html | 10 + .../persona/browser_compatibility/index.html | 80 ++++ files/fi/mozilla/persona/index.html | 141 ++++++ .../index.html" | 59 +++ .../aloittaminen/index.html | 49 ++ files/fi/skinin_luominen_firefoxiin/index.html | 28 ++ files/fi/teemat/index.html | 81 ++++ files/fi/web/api/aeskeygenparams/index.html | 48 ++ files/fi/web/api/index.html | 10 + files/fi/web/api/intersectionobserver/index.html | 87 ++++ files/fi/web/api/webgl_api/index.html | 229 +++++++++ files/fi/web/api/webvr_api/index.html | 250 ++++++++++ .../api/webvr_api/using_the_webvr_api/index.html | 438 ++++++++++++++++++ files/fi/web/api/window/index.html | 509 +++++++++++++++++++++ files/fi/web/guide/events/index.html | 53 +++ files/fi/web/guide/index.html | 58 +++ files/fi/web/html/element/body/index.html | 166 +++++++ files/fi/web/html/element/head/index.html | 108 +++++ files/fi/web/html/element/index.html | 109 +++++ files/fi/web/html/element/title/index.html | 122 +++++ files/fi/web/html/index.html | 99 ++++ files/fi/web/html/reference/index.html | 23 + files/fi/web/index.html | 162 +++++++ files/fi/web/javascript/index.html | 129 ++++++ files/fi/web/reference/index.html | 29 ++ 75 files changed, 6449 insertions(+) create mode 100644 files/fi/_redirects.txt create mode 100644 files/fi/_wikihistory.json create mode 100644 files/fi/archive/api/index.html create mode 100644 files/fi/archive/api/navigator/index.html create mode 100644 files/fi/archive/api/navigator/moznotification/index.html create mode 100644 files/fi/archive/b2g_os/api/index.html create mode 100644 files/fi/archive/b2g_os/api/navigator/index.html create mode 100644 files/fi/archive/b2g_os/api/navigator/mozapps/index.html create mode 100644 files/fi/archive/b2g_os/api/navigator/moztelephony/index.html create mode 100644 files/fi/archive/b2g_os/api/telephony/index.html create mode 100644 files/fi/archive/b2g_os/index.html create mode 100644 files/fi/archive/index.html create mode 100644 files/fi/demos/detail/index.html create mode 100644 files/fi/demos/index.html create mode 100644 files/fi/dom/index.html create mode 100644 files/fi/dom/navigator.donottrack/index.html create mode 100644 files/fi/dom/navigator.id/index.html create mode 100644 files/fi/dom/navigator.mozsocial/index.html create mode 100644 files/fi/dom/smsmanager/index.html create mode 100644 files/fi/dom/window.navigator.appcodename/index.html create mode 100644 files/fi/dom/window.navigator.appname/index.html create mode 100644 files/fi/dom/window.navigator.appversion/index.html create mode 100644 files/fi/dom/window.navigator.battery/index.html create mode 100644 files/fi/dom/window.navigator.buildid/index.html create mode 100644 files/fi/dom/window.navigator.connection/index.html create mode 100644 files/fi/dom/window.navigator.cookieenabled/index.html create mode 100644 files/fi/dom/window.navigator.language/index.html create mode 100644 files/fi/dom/window.navigator.mimetypes/index.html create mode 100644 files/fi/dom/window.navigator.mozsms/index.html create mode 100644 files/fi/dom/window.navigator.online/index.html create mode 100644 files/fi/dom/window.navigator.oscpu/index.html create mode 100644 files/fi/dom/window.navigator.platform/index.html create mode 100644 files/fi/dom/window.navigator.plugins/index.html create mode 100644 files/fi/dom/window.navigator.product/index.html create mode 100644 files/fi/dom/window.navigator.productsub/index.html create mode 100644 files/fi/dom/window.navigator.useragent/index.html create mode 100644 files/fi/dom/window.navigator.vendor/index.html create mode 100644 files/fi/dom/window.navigator/index.html create mode 100644 files/fi/fi/index.html create mode 100644 files/fi/how_to_get_a_stacktrace_for_a_bug_report/index.html create mode 100644 files/fi/html/canvas/index.html create mode 100644 files/fi/html/index.html create mode 100644 files/fi/learn/index.html create mode 100644 files/fi/learn/javascript/ensimmaiset_askeleet/index.html create mode 100644 files/fi/learn/javascript/index.html create mode 100644 files/fi/mozilla/add-ons/index.html create mode 100644 files/fi/mozilla/add-ons/webextensions/index.html create mode 100644 files/fi/mozilla/add-ons/webextensions/what_are_webextensions/index.html create mode 100644 files/fi/mozilla/command_line_options/index.html create mode 100644 "files/fi/mozilla/helppok\303\244ytt\303\266isyys/index.html" create mode 100644 files/fi/mozilla/index.html create mode 100644 files/fi/mozilla/persona/browser_compatibility/index.html create mode 100644 files/fi/mozilla/persona/index.html create mode 100644 "files/fi/mozilla_developer_centerin_sis\303\244ll\303\266t/index.html" create mode 100644 files/fi/skinin_luominen_firefoxiin/aloittaminen/index.html create mode 100644 files/fi/skinin_luominen_firefoxiin/index.html create mode 100644 files/fi/teemat/index.html create mode 100644 files/fi/web/api/aeskeygenparams/index.html create mode 100644 files/fi/web/api/index.html create mode 100644 files/fi/web/api/intersectionobserver/index.html create mode 100644 files/fi/web/api/webgl_api/index.html create mode 100644 files/fi/web/api/webvr_api/index.html create mode 100644 files/fi/web/api/webvr_api/using_the_webvr_api/index.html create mode 100644 files/fi/web/api/window/index.html create mode 100644 files/fi/web/guide/events/index.html create mode 100644 files/fi/web/guide/index.html create mode 100644 files/fi/web/html/element/body/index.html create mode 100644 files/fi/web/html/element/head/index.html create mode 100644 files/fi/web/html/element/index.html create mode 100644 files/fi/web/html/element/title/index.html create mode 100644 files/fi/web/html/index.html create mode 100644 files/fi/web/html/reference/index.html create mode 100644 files/fi/web/index.html create mode 100644 files/fi/web/javascript/index.html create mode 100644 files/fi/web/reference/index.html (limited to 'files/fi') diff --git a/files/fi/_redirects.txt b/files/fi/_redirects.txt new file mode 100644 index 0000000000..7ea90f0549 --- /dev/null +++ b/files/fi/_redirects.txt @@ -0,0 +1,6 @@ +# FROM-URL TO-URL +/fi/docs/Apps /fi/docs/Web/Apps +/fi/docs/Etusivu /fi/docs/Web +/fi/docs/Skinin_luominen_Firefoxiin:Aloittaminen /fi/docs/Skinin_luominen_Firefoxiin/Aloittaminen +/fi/docs/WebGL /fi/docs/Web/API/WebGL_API +/fi/docs/en /en-US/ diff --git a/files/fi/_wikihistory.json b/files/fi/_wikihistory.json new file mode 100644 index 0000000000..aa82164fce --- /dev/null +++ b/files/fi/_wikihistory.json @@ -0,0 +1,360 @@ +{ + "DOM": { + "modified": "2019-03-23T23:35:02.223Z", + "contributors": [ + "teoli" + ] + }, + "DOM/navigator.doNotTrack": { + "modified": "2019-03-23T23:34:48.293Z", + "contributors": [ + "khalid32", + "Karvjorm" + ] + }, + "DOM/window.navigator": { + "modified": "2019-03-23T23:34:56.542Z", + "contributors": [ + "fscholz", + "khalid32", + "Karvjorm" + ] + }, + "DOM/window.navigator.appCodeName": { + "modified": "2019-03-23T23:34:50.037Z", + "contributors": [ + "AshfaqHossain", + "Karvjorm" + ] + }, + "DOM/window.navigator.appName": { + "modified": "2019-03-23T23:34:51.570Z", + "contributors": [ + "khalid32", + "Karvjorm" + ] + }, + "DOM/window.navigator.appVersion": { + "modified": "2019-03-23T23:34:48.787Z", + "contributors": [ + "arunpandianp", + "Karvjorm" + ] + }, + "DOM/window.navigator.battery": { + "modified": "2019-03-23T23:34:51.352Z", + "contributors": [ + "AshfaqHossain", + "Karvjorm" + ] + }, + "DOM/window.navigator.buildID": { + "modified": "2019-03-23T23:34:47.974Z", + "contributors": [ + "khalid32", + "Karvjorm" + ] + }, + "DOM/window.navigator.connection": { + "modified": "2019-03-23T23:34:50.817Z", + "contributors": [ + "khalid32", + "Karvjorm" + ] + }, + "DOM/window.navigator.cookieEnabled": { + "modified": "2019-03-23T23:34:44.696Z", + "contributors": [ + "valtlai", + "khalid32", + "Karvjorm" + ] + }, + "DOM/window.navigator.language": { + "modified": "2019-03-23T23:34:47.370Z", + "contributors": [ + "AshfaqHossain", + "Karvjorm" + ] + }, + "DOM/window.navigator.mimeTypes": { + "modified": "2019-03-23T23:34:46.573Z", + "contributors": [ + "khalid32", + "Karvjorm" + ] + }, + "DOM/window.navigator.onLine": { + "modified": "2019-03-23T23:34:35.718Z", + "contributors": [ + "khalid32", + "Karvjorm" + ] + }, + "DOM/window.navigator.oscpu": { + "modified": "2019-03-23T23:34:33.342Z", + "contributors": [ + "khalid32", + "Karvjorm" + ] + }, + "DOM/window.navigator.platform": { + "modified": "2019-03-23T23:34:40.545Z", + "contributors": [ + "jsx", + "Karvjorm" + ] + }, + "DOM/window.navigator.plugins": { + "modified": "2019-03-23T23:34:30.762Z", + "contributors": [ + "khalid32", + "Karvjorm" + ] + }, + "DOM/window.navigator.product": { + "modified": "2019-03-23T23:34:35.892Z", + "contributors": [ + "khalid32", + "Karvjorm" + ] + }, + "DOM/window.navigator.productSub": { + "modified": "2019-03-23T23:34:36.834Z", + "contributors": [ + "khalid32", + "Karvjorm" + ] + }, + "DOM/window.navigator.userAgent": { + "modified": "2019-03-23T23:34:27.801Z", + "contributors": [ + "khalid32", + "Karvjorm" + ] + }, + "DOM/window.navigator.vendor": { + "modified": "2019-03-23T23:34:28.021Z", + "contributors": [ + "khalid32", + "Karvjorm" + ] + }, + "HTML": { + "modified": "2019-03-23T23:34:49.523Z", + "contributors": [ + "Prasanth" + ] + }, + "HTML/Canvas": { + "modified": "2019-03-23T23:34:49.838Z", + "contributors": [ + "Karvjorm" + ] + }, + "Learn": { + "modified": "2020-07-16T22:43:40.977Z", + "contributors": [ + "SphinxKnight", + "chrisdavidmills" + ] + }, + "Learn/JavaScript": { + "modified": "2020-07-16T22:29:38.464Z", + "contributors": [ + "dartvaneri" + ] + }, + "Learn/JavaScript/Ensimmaiset_askeleet": { + "modified": "2020-07-16T22:29:50.029Z", + "contributors": [ + "dartvaneri" + ] + }, + "Mozilla": { + "modified": "2019-03-23T23:26:12.710Z", + "contributors": [ + "Sheppy" + ] + }, + "Mozilla/Add-ons": { + "modified": "2020-10-05T13:27:56.684Z", + "contributors": [ + "rebloor" + ] + }, + "Mozilla/Add-ons/WebExtensions": { + "modified": "2020-12-04T09:31:07.373Z", + "contributors": [ + "Zearin_Galaurum" + ] + }, + "Mozilla/Add-ons/WebExtensions/What_are_WebExtensions": { + "modified": "2020-10-12T08:31:12.121Z", + "contributors": [ + "SphinxKnight", + "halttunen.jarkko1" + ] + }, + "Mozilla_Developer_Centerin_sisällöt": { + "modified": "2019-03-23T23:43:43.976Z", + "contributors": [ + "Melter" + ] + }, + "Skinin_luominen_Firefoxiin": { + "modified": "2019-01-16T16:12:14.893Z", + "contributors": [ + "Melter" + ] + }, + "Skinin_luominen_Firefoxiin/Aloittaminen": { + "modified": "2019-03-23T23:43:46.736Z", + "contributors": [ + "Melter" + ] + }, + "Teemat": { + "modified": "2019-03-23T23:43:19.026Z", + "contributors": [ + "fscholz", + "Melter" + ] + }, + "Web": { + "modified": "2019-08-08T04:26:04.971Z", + "contributors": [ + "mirorauhala", + "ethertank" + ] + }, + "Web/API": { + "modified": "2019-03-23T22:48:44.475Z", + "contributors": [ + "teoli", + "fscholz" + ] + }, + "Web/API/AesKeyGenParams": { + "modified": "2019-04-08T13:29:19.556Z", + "contributors": [ + "mirorauhala" + ] + }, + "Web/API/IntersectionObserver": { + "modified": "2020-10-15T22:28:19.927Z", + "contributors": [ + "tvaisanen" + ] + }, + "Web/API/WebGL_API": { + "modified": "2019-03-23T23:34:46.240Z", + "contributors": [ + "fscholz", + "Karvjorm" + ] + }, + "Web/API/WebVR_API": { + "modified": "2019-03-23T22:01:46.926Z", + "contributors": [ + "laitinent", + "chrisdavidmills" + ] + }, + "Web/API/WebVR_API/Using_the_WebVR_API": { + "modified": "2019-03-23T22:01:50.838Z", + "contributors": [ + "laitinent" + ] + }, + "Web/API/Window": { + "modified": "2020-10-15T22:09:21.465Z", + "contributors": [ + "Sheppy" + ] + }, + "Web/Guide": { + "modified": "2020-06-01T01:14:35.609Z", + "contributors": [ + "chrisdavidmills" + ] + }, + "Web/Guide/Events": { + "modified": "2019-03-18T21:37:53.387Z", + "contributors": [ + "gportioli" + ] + }, + "Web/HTML": { + "modified": "2019-09-10T15:19:38.441Z", + "contributors": [ + "SphinxKnight", + "mirorauhala" + ] + }, + "Web/HTML/Element": { + "modified": "2020-12-07T13:30:47.690Z", + "contributors": [ + "SphinxKnight" + ] + }, + "Web/HTML/Element/body": { + "modified": "2020-10-15T22:11:12.460Z", + "contributors": [ + "mirorauhala" + ] + }, + "Web/HTML/Element/head": { + "modified": "2020-10-15T22:11:11.385Z", + "contributors": [ + "mirorauhala" + ] + }, + "Web/HTML/Element/title": { + "modified": "2020-10-15T22:11:11.927Z", + "contributors": [ + "mirorauhala" + ] + }, + "Web/HTML/Reference": { + "modified": "2019-09-09T07:16:57.959Z", + "contributors": [ + "SphinxKnight", + "mirorauhala" + ] + }, + "Web/JavaScript": { + "modified": "2020-03-22T23:19:55.226Z", + "contributors": [ + "ashley", + "tvaisanen" + ] + }, + "Web/Reference": { + "modified": "2019-03-18T21:22:48.091Z", + "contributors": [ + "mirorauhala" + ] + }, + "demos": { + "modified": "2019-01-16T13:28:20.845Z", + "contributors": [ + "Nzon" + ] + }, + "demos/detail": { + "modified": "2019-01-16T13:28:09.443Z", + "contributors": [ + "Nzon" + ] + }, + "fi": { + "modified": "2019-03-24T00:08:59.851Z", + "contributors": [ + "teoli", + "syssgx", + "techexpert", + "Melter" + ] + } +} \ No newline at end of file diff --git a/files/fi/archive/api/index.html b/files/fi/archive/api/index.html new file mode 100644 index 0000000000..5a3f7413cb --- /dev/null +++ b/files/fi/archive/api/index.html @@ -0,0 +1,13 @@ +--- +title: API +slug: Archive/API +tags: + - API + - Archive + - NeedsTranslation + - TopicStub +translation_of: Archive/API +--- +

Archived documentation about obsolete web standards APIs.

+ +

{{SubpagesWithSummaries}}

diff --git a/files/fi/archive/api/navigator/index.html b/files/fi/archive/api/navigator/index.html new file mode 100644 index 0000000000..69d23d39fc --- /dev/null +++ b/files/fi/archive/api/navigator/index.html @@ -0,0 +1,8 @@ +--- +title: Navigator +slug: Archive/API/Navigator +translation_of: Archive/API/Navigator +--- +

In progress. Features that used to hang off the {{domxref("Navigator")}} interface, but have since been removed.

+ +

{{SubpagesWithSummaries}}

diff --git a/files/fi/archive/api/navigator/moznotification/index.html b/files/fi/archive/api/navigator/moznotification/index.html new file mode 100644 index 0000000000..49e829c258 --- /dev/null +++ b/files/fi/archive/api/navigator/moznotification/index.html @@ -0,0 +1,53 @@ +--- +title: navigator.mozNotification +slug: Archive/API/Navigator/mozNotification +translation_of: Archive/API/Navigator/mozNotification +--- +

{{ non-standard_header() }}

+ +

Tarjoaa tuen {{ domxref("notification") }} -objektien luomiseksi, joita käytetään käyttäjän hälyttämiseksi näyttämällä työpöytäilmoituksia. Nykyisin niitä tuetaan vain Firefox Mobile -selaimessa. Katso esimerkkinä Ilmoitusten näyttäminen.

+ +

Metodi-yhteenveto

+ + + + + + + +
notification createNotification(in DOMString title, in DOMString description, in DOMString iconURL {{ optional_inline() }});
+ +

Metodit

+ +

createNotification()

+ +

Luo ja palauttaa ilmoitusobjektin, jota voidaan käyttää määritellyn viestin näyttämiseen valinnaisella verkko-osoitteella.

+ +
notification createNotification(
+  in DOMString title,
+  in DOMString description,
+  in DOMString iconURL {{ optional_inline() }}
+);
+
+ +
Parametrit
+ +
+
title
+
Ilmoituksen otsikko.
+
description
+
Ilmoituksessa näytettävä teksti.
+
iconURL {{ optional_inline() }}
+
Verkko-osoite ilmoituksessa näytettävän kuvan tunnistamiseksi.
+
+ +
Paluuarvo
+ +

Uusi {{ domxref("notification") }} -objekti.

+ +

Katso myös

+ + diff --git a/files/fi/archive/b2g_os/api/index.html b/files/fi/archive/b2g_os/api/index.html new file mode 100644 index 0000000000..d71360a2fa --- /dev/null +++ b/files/fi/archive/b2g_os/api/index.html @@ -0,0 +1,14 @@ +--- +title: B2G OS APIs +slug: Archive/B2G_OS/API +tags: + - API + - B2G API + - NeedsTranslation + - TopicStub + - b2g os api's +translation_of: Archive/B2G_OS/API +--- +

List of B2G OS APIs

+ +

{{APIListAlpha('/en-US/docs/Archive/B2G_OS/API')}}

diff --git a/files/fi/archive/b2g_os/api/navigator/index.html b/files/fi/archive/b2g_os/api/navigator/index.html new file mode 100644 index 0000000000..4b68621aed --- /dev/null +++ b/files/fi/archive/b2g_os/api/navigator/index.html @@ -0,0 +1,18 @@ +--- +title: Navigator (Firefox OS extensions) +slug: Archive/B2G_OS/API/Navigator +tags: + - API + - Firefox OS + - Interface + - Navigator + - NeedsTranslation + - Non-standard + - TopicStub +translation_of: Archive/B2G_OS/API/Navigator +--- +

The Navigator interface represents the state and the identity of the user agent. It allows scripts to query it and to register themselves to carry on some activities. This page represents the list of properties and methods added to Navigator on Firefox OS devices. For the list of properties and methods available to any Web sites, consult {{domxref("Navigator")}}.

+ +

A Navigator object can be retrieved using the read-only {{domxref("Window.navigator")}} property.

+ +

{{subpageswithsummaries}}

diff --git a/files/fi/archive/b2g_os/api/navigator/mozapps/index.html b/files/fi/archive/b2g_os/api/navigator/mozapps/index.html new file mode 100644 index 0000000000..cc5e8ba440 --- /dev/null +++ b/files/fi/archive/b2g_os/api/navigator/mozapps/index.html @@ -0,0 +1,77 @@ +--- +title: window.navigator.mozApps +slug: Archive/B2G_OS/API/Navigator/mozApps +translation_of: Archive/B2G_OS/API/Navigator/mozApps +--- +

(fi translation)

+ +

{{ non-standard_header() }}

+ +

Yhteenveto

+ +

Palauttaa {{ domxref("Apps") }} -objektin, jota voit käyttää Open Web apps-sovellusten asentamiseen, hallinnointiin ja ohjaamiseen selaimessa.

+ +

Syntaksi

+ +
var apps = window.navigator.mozApps;
+
+ +

Arvo

+ +

navigator.mozApps on {{ domxref("Apps") }} -objekti, jota voit käyttää Open Web apps-sovellusten asentamiseen, hallinnointiin ja ohjaamiseen selaimessa.

+ +

Spesifikaatio

+ +

Ei ole minkään spesifikaation osa; toteutettu Gecko-alustalla ohjelmointivirheen {{ Bug("697383") }} vuoksi.

+ +

Selainyhteensopivuus

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
OminaisuusChromeFirefox (Gecko)Internet ExplorerOperaSafari
Perustuki---{{ CompatGeckoDesktop("11.0") }}---------
+
+ +
+ + + + + + + + + + + + + + + + + + + +
OminaisuusAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Perustuki---{{ CompatGeckoDesktop("11.0") }}---------
+
+ +

 

diff --git a/files/fi/archive/b2g_os/api/navigator/moztelephony/index.html b/files/fi/archive/b2g_os/api/navigator/moztelephony/index.html new file mode 100644 index 0000000000..eb7db87649 --- /dev/null +++ b/files/fi/archive/b2g_os/api/navigator/moztelephony/index.html @@ -0,0 +1,40 @@ +--- +title: window.navigator.mozTelephony +slug: Archive/B2G_OS/API/Navigator/MozTelephony +translation_of: Archive/B2G_OS/API/Navigator/MozTelephony +--- +

{{ non-standard_header() }}

+

Yhteenveto

+

Palauttaa {{ domxref("Telephony") }} -objektin, jota voit käyttää puheluiden aloittamiseen ja ohjaamiseen selaimesta.

+

Syntaksi

+
var phone = window.navigator.mozTelephony;
+
+

Arvo

+

navigator.mozTelephony on {{ domxref("Telephony") }} -objekti, jota voit käyttää ohjaamaan sen laitteen puhelinomaisuuksia, jossa selain on toiminnassa.

+

Spesifikaatio

+

Ei ole minkään spesifikaation osa; Ehdotuksen otaksutaan kuitenkin perustuvan asiakirjaan WebTelephony design document.

+

Selainyhteensopivuus

+

Ilmeisistä syistä tukea odotetaan pääasiassa mobiiliselaimissa.

+
+ + + + + + + + + + + + + + + + + + + +
OminaisuusAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Perustuki{{ CompatNo() }}{{ CompatGeckoMobile("12.0") }}{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+
+

 

diff --git a/files/fi/archive/b2g_os/api/telephony/index.html b/files/fi/archive/b2g_os/api/telephony/index.html new file mode 100644 index 0000000000..9fc3f3bfc8 --- /dev/null +++ b/files/fi/archive/b2g_os/api/telephony/index.html @@ -0,0 +1,105 @@ +--- +title: Telephony +slug: Archive/B2G_OS/API/Telephony +translation_of: Archive/B2G_OS/API/Telephony +--- +

{{ Apiref() }}

+

Tarjoaa tuen puhelintoimintaa tukevalle laitteelle puhelujen valinnassa, vastaamisessa ja hallinoinnissa.

+

Attribuutit

+
+
+ {{ domxref("Telephony.active") }}
+
+ Objekti {{ domxref("TelephonyCall") }} osoittaa puhelun, joka on parhaillaan käynnissä. Aktiivi puhelu on se, joka vastaanottaa syötteen mikrofonista ja kaikki {{ domxref("Telephony.startTone()") }} -metodin tuottamat äänet.
+
+ {{ domxref("Telephony.calls") }}
+
+ {{ domxref("TelephonyCall") }} -objektien taulukko, yksi jokaiselle puhelulle, joka on parhaillaan yhdistettynä.
+
+ {{ domxref("Telephony.muted") }}
+
+ Asetetaan arvoon true mikrofonin mykistämiseksi tai false mikrofonin ottamiseksi käyttöön.
+
+ {{ domxref("Telephony.oncallschanged") }}
+
+ Käsittelijä "callschanged"-tapahtumalle; tämä {{ domxref("CallEvent") }} -tapahtuma lähetetään aina kun {{ domxref("Telephony.calls", "calls") }} -luettelo muuttuu.
+
+ {{ domxref("Telephony.onincoming") }}
+
+ Käsittelijä "incoming"-tapahtumalle; tämä {{ domxref("CallEvent") }} lähetetään aina kun uusi puhelu on tulossa.
+
+ {{ domxref("Telephony.speakerEnabled") }}
+
+ Aseta arvoon true kaiutintoiminnallisuuden käyttöönottamiseksi tai arvoon false sen ottamiseksi pois käytöstä.
+
+

Metodit

+
+
+ {{ domxref("Telephony.dial()") }}
+
+ Soittaa määriteltyyn puhelinnumeroon, joka on määritelty merkkijonona.
+
+ {{ domxref("Telephony.startTone()") }}
+
+ Aloittaa määrätyn DTMF-äänen tuottamisen.
+
+ {{ domxref("Telephony.stopTone()") }}
+
+ Lopettaa parhaillaan kuuluvan DTMF-äänen.
+
+

Spesifikaatio

+

Ei ole minkään spesifikaation osa; ehdotuksen otaksutaan kuitenkin perustuvan asiakirjaan WebTelephony design document.

+

Selainyhteensopivuus

+

Ilmeisestä syystä tukea odotetaan pääasiassa mobiiliselamille.

+

{{ CompatibilityTable() }}

+
+ + + + + + + + + + + + + + + + + + + +
OminaisuusChromeFirefox (Gecko)Internet ExplorerOperaSafari
Perustuki{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+
+
+ + + + + + + + + + + + + + + + + + + +
OminaisuusAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Perustuki{{ CompatNo() }}{{ CompatGeckoMobile("12.0") }}{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+
+

Katso myös

+ diff --git a/files/fi/archive/b2g_os/index.html b/files/fi/archive/b2g_os/index.html new file mode 100644 index 0000000000..79d37af630 --- /dev/null +++ b/files/fi/archive/b2g_os/index.html @@ -0,0 +1,229 @@ +--- +title: B2G OS +slug: Archive/B2G_OS +tags: + - B2G + - B2G OS + - Basic + - Beginner + - Gaia + - Gecko + - Gonk + - Mozilla + - NeedsTranslation + - Overview + - TopicStub + - b2g smartphone os + - getting started with b2gos + - web based os from mozilla + - web os gecko +translation_of: Archive/B2G_OS +--- +
B2G OS is (was) a complete, standalone operating system for the open web. It is an open source project developed by the Mozilla community and forms the basis of Firefox OS products. As of 2017 it is no longer maintained.
+ +

B2G OS is a community maintained open source operating system for smartphones, tablets, smart TVs and other connected devices. The project was started in 2011 and is based on the Linux kernel and Gecko rendering engine. The entire user interface is built using web technologies (HTML, CSS and JavaScript) and can be used to launch and use web applications. Since Mozilla discontinued their commercial Firefox OS smartphone program the smartphone part of the project is entirely maintained by Mozilla's volunteer community, and branded as B2G OS.

+ +

+ +

Index of pages

+ +
+
Automated Testing of B2G OS
+
This page offers articles that provide information about various aspects of testing B2G OS, including running different tests, automation, and result reporting and tracking.
+
B2G OS add-ons
+
You should follow the below steps to get set up to start developing extensions.
+
B2G OS APIs
+
List of B2G OS APIs
+
B2G OS architecture
+
This article is a high-level overview of the architecture of the B2G OS platform, introducing key concepts and explaining how its components interact at a basic level.
+
B2G OS build prerequisites
+
Before obtaining the code to build B2G OS, even if you are simply trying to build Gaia, you need a properly configured build system — this page shows you how. You can currently build on 64-bit Linux distributions and OS X.
+
B2G OS phone guide
+
This section contains developer information relevant to specific phones that run B2G OS — both developer and consumer devices.
+
Building and installing B2G OS
+
The articles listed on this page will guide you through building and installing B2G OS on an emulator or compatible device, or the Gaia user interface in the Firefox browser.
+
Building B2G OS
+
Once you've set up your build system and performed your initial pull and configure the code, you can build Boot to Gecko. This guide explains how.
+
Building the B2G OS Simulator
+
Just like Firefox Nightlies, the B2G OS simulator desktop client (identified by b2g-) is automatically built every day from the latest source code. The latest build is available from the Mozilla FTP server. Be sure to pick the latest version and the right archive for your operating system. This lets you bypass having to build it yourself. In addition, you don't have to download Gaia on your own either.
+
Choosing how to run Gaia or B2G
+
Depending on your specific needs, you have an assortment of options to consider when experimenting with Firefox OS or the Gaia user interface. You can choose among the following options; each has its advantages and disadvantages to consider, and some are more flexible than others.
+
Crash Reporting Guide for Firefox OS Partners
+
Mozilla has a world-class system for collecting, analyzing, and fixing crashes and other stability issues such as hangs. Firefox OS partners need to work with Mozilla to correctly enable crash reporting and upload symbols.
+
Customization with the .userconfig file
+
The .userconfig file isn't checked into source code control, so your changes won't be overwritten when you update your source tree. It needs to be created in the root of the B2G tree; that is, in the same directory as flash.sh, build.sh, and so forth. You should add this before you run your config and build steps.
+
Debugging on Firefox OS
+
There are two main types of debugging you'll want to with Firefox OS: debugging apps, and debugging other aspects of the system.
+
Developer Mode
+
The current Firefox OS permissions model precludes modification and installation of certified/internal apps, which makes some device APIs completely unavailable to Marketplace and web apps. Developer Mode (DM) allows the user to indicate that they would like to relax the permissions model and expose all device APIs to content, as well as setting a group of related preferences. This article provides a high-level overview.
+
Developing Firefox OS
+
This section provides useful documentation covering different ways in which Firefox OS (codename Boot2Gecko, or B2G) can be modified/customized during the build process, and how you can help to develop the low level platform areas such as Gecko and Gonk.
+
Firefox OS apps
+
This section of the Firefox OS docs covers the specific techniques required — and available tools — for building Firefox OS apps. You'll find a number of details below, from Firefox OS building blocks/web components, to device APIs and App installation.
+
Firefox OS board guide
+
This section contains developer information relevant to specific phones that run Firefox OS — both developer and consumer devices.
+
Firefox OS developer release notes
+
This section provides articles covering each new release of Gaia and Gecko for Firefox OS, explaining what features were added and bugs eliminated in each update. There is also a linked summary table showing what APIs are supported by each version of Firefox OS.
+
Firefox OS security
+
The following articles cover security-related topics about Firefox OS. This includes overall security features as well as application security and how the install process is kept secure.
+
Firefox OS Simulator
+
The Firefox OS Simulator is a version of the higher layers of Firefox OS that simulates a Firefox OS device, but runs on the desktop. This means that in many cases, you don't need a real device to test and debug your app. It runs in a window the same size as a Firefox OS device, includes the Firefox OS user interface and built-in apps, and simulates many of the Firefox OS device APIs.
+
Firefox OS usage tips
+
Explains all of the developer features on the phone and what they do (Settings > Device information > More information > Developer)
+
Gaia
+
Gaia is B2G OS's user interface and suite of default apps: it includes the lock screen, home screen, dialer, and other applications. Essentially, Gaia is a set of complex web apps that runs on top of the B2G OS platform. This set of articles covers all you need to know to contribute to the Gaia project.
+
Installing B2G OS on a mobile device
+
Once you've built Boot to Gecko for a supported mobile device, you can install it. This article will guide you through the process.
+
Introduction to Firefox OS
+
This set of documentation is aimed mainly at web developers and platform developers who want to learn how Firefox OS works, how to contribute to the project, and how to build their own custom versions of the software and install it on devices. For those who want to create and distribute their own web apps, the App Center and Marketplace Zone are good places to go.
+
Mulet
+
Following this guide you're going to run Gaia inside of a special build of Firefox called Firefox Mulet. This gives you the advantages of having a rapid development cycle, as well as standard web development tools and debuggers available to work with. First of all, you need to have the Gaia repo cloned on your machine and build your own profile. Then, you have to install mulet and run it, passing your Gaia profile as the profile to use.
+
Open web apps quickstart
+
Quickstart information on coding Open Web Apps.
+
Pandaboard
+
This is a guide to setting up Firefox OS on a PandaBoard. The PandaBoard is a low-cost OMAP 4 based development board for developing mobile operating systems.
+
PasscodeHelper Internals
+
PasscodeHelper is a Gaia helper library for modifying and checking the Firefox OS lockscreen passcode (i.e., pin) from within Gaia, performing functions such as checking whether an entered passcode is correct, and changing the code. This article documents how PasscodeHelper works.
+
Porting B2G OS
+
This page lists the available resources for porting B2GOS.
+
Preparing for your first B2G build
+
Depending on your internet connection, the configuration steps may take several hours to download everything you need to build B2G OS. Waiting is not as fun as doing, so after you have read through this page and have kicked off the configure script, consider using the time to set up and try out the B2G OS simulator, begin familiarizing yourself with Documentation for app developers including Designing and Building an App, or familiarize yourself with the information on upcoming steps.
+
Resources
+
Resources for App hackers, as generated from our workshops
+
Running tests on Firefox OS: A guide for developers
+
If you are a Gecko developer, then you should review the Firefox OS-specific documentation for the test automation you are already familar with: mochitest, reftest, and xpcshell.
+
The B2G OS platform
+
The B2G OS platform consists of many components. While you don't need to understand its architecture in order to build applications that run on B2G OS, if you're working on developing or porting the platform — or are simply curious — the following documentation may be of interest to you.
+
Troubleshooting B2G OS
+
This article provides tips for resolving common problems you may have while using B2G OS.
+
Using the App Manager
+
The App Manager is a tool for Firefox Desktop which provides a number of useful tools to help developers test, deploy and debug HTML5 web apps on Firefox OS phones & Simulator, directly from Firefox browser. This page documents how to use the App Manager.
+
Using the B2G emulators
+
This article provides a brief guide to some key things you should know when using the boot to Gecko emulators. This doesn't appear to be a complete user manual; instead, it simply tells you a few useful things that you might not learn on your own.
+
Web applications
+
This page is intended to be a first, non thorough, attempt to collect web apps.
+
Web Bluetooth API (Firefox OS)
+
The Web Bluetooth API lets an open web app discover, pair with, and connect to Bluetooth devices. As it is a completely experimental and non-standard API, the Bluetooth API is currently available for certified applications only. However, there is some traction to have such an API available for regular Web content; this will be discussed as part of the W3C's System Applications Working Group.
+
Web Telephony API
+
Web Telephony is an API that makes it possible for web content to handle voice phone calls using JavaScript.
+
+ +

Old page content

+ +
+

Note: Call for contribution & Call for App adoption has been made to gather more people, feel free to share it !

+
+ +
+
+

How you can help

+ +
    +
  • File & fix bugs (meta bug is bug 1252143)
    • +
  • Help us fix failing tests
    • +
  • Port a gaia smartphone app: +
      +
    1. Turn it into a webapp (or)
      2. +
    2. Turn it into chrome:// (why?) & report back
      3. +
    +
    • +
  • Port B2G OS to your phone or help us to maintain a port
    • +
  • Help improve translate this documentation & wiki
    • +
  • Propose & implement new smartphone features
    • +
+
+ +
+

Get involved

+ + + +

To participate in meetings and community Working Groups meetings, register on this Calendar. They are announced on Discourse, where you can find information about how to attend & notes.

+
+ +
+

Compatible devices

+ + + +

For more information see this page.
+ Flash you device easily with B2G installer.
+ Your device is not in the list ? Try Mulet on desktop.

+ +

*WIP = Work In Progress.

+
+
+ + diff --git a/files/fi/archive/index.html b/files/fi/archive/index.html new file mode 100644 index 0000000000..4f4a70c023 --- /dev/null +++ b/files/fi/archive/index.html @@ -0,0 +1,21 @@ +--- +title: Archive of obsolete content +slug: Archive +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive +--- +

Here at MDN, we try to avoid outright deleting content that might be useful to people targeting legacy platforms, operating systems, and browsers. Perhaps your target audience is people that are using older hardware, for example, and can't upgrade to the latest and greatest browsers. Or for "reasons," your company is required to use very old software and you need to build Web content that runs on that software. Or perhaps you're just curious about the history of an obsolete feature or API, and how it worked.

+ +

There are many reasons older documentation can be useful. So, we've established this area into which we can archive older documentation. Material in this Archived content zone should not be used for building new Web sites or apps for modern browsers. It's here for historical reference only.

+ +
+

Note to writers: We need to try to keep the subpages here organized instead of all dumped into one large folder. Try to create subtrees for categories of material. Also, only move pages here that are extremely obsolete. If anyone might realistically need the information in a living product, it may not be appropriate to move it here. In general, it may be best to discuss it in the MDN Web Docs chat room before moving content here.

+
+ +

{{SubpagesWithSummaries}}

+ + + +

{{ListSubpages("/en-US/docs/Archive", 2, 0, 1)}}

diff --git a/files/fi/demos/detail/index.html b/files/fi/demos/detail/index.html new file mode 100644 index 0000000000..1f9d7dfbe2 --- /dev/null +++ b/files/fi/demos/detail/index.html @@ -0,0 +1,5 @@ +--- +title: detail +slug: demos/detail +--- +This page was auto-generated because a user created a sub-page to this page. diff --git a/files/fi/demos/index.html b/files/fi/demos/index.html new file mode 100644 index 0000000000..c357e7ac63 --- /dev/null +++ b/files/fi/demos/index.html @@ -0,0 +1,5 @@ +--- +title: demos +slug: demos +--- +This page was auto-generated because a user created a sub-page to this page. diff --git a/files/fi/dom/index.html b/files/fi/dom/index.html new file mode 100644 index 0000000000..9475de14d5 --- /dev/null +++ b/files/fi/dom/index.html @@ -0,0 +1,90 @@ +--- +title: Document Object Model (DOM) +slug: DOM +tags: + - DOM + - NeedsTranslation + - References + - TopicStub +translation_of: Web/API/Document_Object_Model +--- +
+
+ Using the W3C DOM Level 1 Core
+ Introduction to the W3C DOM.
+
+
+

The Document Object Model (DOM) is an API for HTML and XML documents. It provides a structural representation of the document, enabling you to modify its content and visual presentation by using a scripting language such as JavaScript.

+
+
+
+

Documentation about the DOM

+
+
+ Gecko DOM Reference
+
+ The Gecko Document Object Model Reference.
+
+ About the Document Object Model
+
+ A short introduction to the DOM.
+
+ The DOM and JavaScript
+
+ What is the DOM? What is JavaScript? How do I use them together on my web page? This document answers these questions and more.
+
+ Using dynamic styling information
+
+ How to obtain information on and manipulate styling via the DOM.
+
+ DOM event reference
+
+ Lists all the DOM events and their meanings.
+
+ History API: Manipulating the browser history
+
+ Demonstrates the HTML5-introduced DOM {{ domxref("window.history") }} object, allowing dynamic changes to the browser history.
+
+ File API: Using files from web applications
+
+ Describes the HTML5-introduced capability to select a local file and read data from it.
+
+ Using the Page Visibility API
+
+ Explains how to detect and use information about a web page being in the foreground or in the background.
+
+ Fullscreen API: Using the fullscreen mode
+
+ Describes how to set up a page that use the whole screen, without any browser UI around it.
+
+ Determining the dimensions of elements
+
+ How to figure out the right way to determine the dimensions of elements, given your needs.
+
+ Dynamically modifying XUL-based user interface
+
+ The basics of manipulating the XUL UI with DOM methods.
+
+

View All...

+
+
+

Getting help from the community

+

You need help on a DOM-related problem and can't find the solution in the documentation?

+
    +
  • Consult the dedicated Mozilla forum: {{ DiscussionList("dev-tech-dom", "mozilla.dev.tech.dom") }}
    • +
+

Tools easing working with the DOM

+ +

View All...

+ + +
+
+

 

diff --git a/files/fi/dom/navigator.donottrack/index.html b/files/fi/dom/navigator.donottrack/index.html new file mode 100644 index 0000000000..c331048a10 --- /dev/null +++ b/files/fi/dom/navigator.donottrack/index.html @@ -0,0 +1,73 @@ +--- +title: navigator.doNotTrack +slug: DOM/navigator.doNotTrack +translation_of: Web/API/Navigator/doNotTrack +--- +

{{ ApiRef() }}

+

Yhteenveto

+

Palauttaa käyttäjän do-not-track -asetuksen. Tämä on "yes", jos käyttäjä on pyytänyt, että hänen vierailemiaan webbisivuja, sisältöä tai mainoksia ei seurata.

+

Syntaksi

+
dnt = navigator.doNotTrack;
+
+

Huomaa, että navigator.doNotTrack ei ole do-not-track -otsakkeessa lähetettävä arvo.  Kun the do-not-track otsake lähettää "1", navigator.doNotTrack on "yes".  Kun otsaketta ei ole asetettu, navigator.doNotTrack on "unspecified".  Kun otsake lähettää "0" (ei tueta nykyisin Firefoxissa), navigator.doNotTrack on "no".

+

Esimerkki

+
dump(window.navigator.doNotTrack);
+// tulostaa "yes" jos DNT ei ole käytössä; muussa tapauksessa tämä on "unspecified" Firefoxissa
+
+

Spesifikaatio

+

Tracking Preference Expression (Working Draft) perustuu tämän spesifikaation aikaisempaan versioon josssa navigator.doNotTrack on do-not-track -otsakkeessa lähetettävä arvo.

+

Katso myös

+ +

Selainyhteensopivuus

+

{{CompatibilityTable() }}

+
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Perustuki{{ CompatUnknown() }}{{ CompatGeckoDesktop("9.0") }}9125.1 käyttöjärjestelmässä OS X 10.7
+
+
+ + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Perustuki{{ CompatUnknown() }}{{ CompatGeckoMobile("9.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+ +

{{ languages( { "zh-cn": "zh-cn/DOM/navigator.doNotTrack" } ) }}

diff --git a/files/fi/dom/navigator.id/index.html b/files/fi/dom/navigator.id/index.html new file mode 100644 index 0000000000..98287f72cb --- /dev/null +++ b/files/fi/dom/navigator.id/index.html @@ -0,0 +1,43 @@ +--- +title: navigator.id +slug: DOM/navigator.id +translation_of: Archive/Navigator-id +--- +
+ {{ ApiRef() }} {{ non-standard_header() }}
+
+ Huomaa: Tukea tälle toiminnallisuudelle ei ole vielä rakennettu yhteenkään selaimeen. Personaa käyttävien webbisivustojen on sisällytettävä omille sivustoilleen polyfill-kirjasto, jota ylläpidetään osoitteessa https://login.persona.org/include.js.
+

Yhteenveto

+

BrowserID-yhteyskäytäntö määrittää uuden id-ominaisuuden {{ domxref ("window.navigator")}}-objektiin, jonka kautta se paljastaa BrowserID-sovellusohjelmointirajapinnan (API). Tämä API on läpikäynnyt useita merkittäviä korjausversioita. Jokainen sukupolvi on lueteltu erikseen alla.

+

"Observer" API (nykyinen)

+

Observer API esittelee paljon pyydettyjä ominaisuuksia, kuten parannetun jälkitodennuskokemuksen ensikertalaiskäyttäjille, automaattiset pysyväiskirjautumiset ja helpomman integroinnin kotoperäisiin sovelluksiin.

+
+
+ {{ domxref("navigator.id.watch()")}}
+
+ Rekisteröi kutsuttavan callback-funktion, kun käyttäjä kirjautuu sisään tai ulos webbisivustosta.
+
+ {{ domxref("navigator.id.request()")}}
+
+ Pyytää allekirjoitetun tunnistusvakuutuksen käyttäjältä.
+
+ {{ domxref("navigator.id.logout()")}}
+
+ Sulkee käyttäjän pois webbisivulta ja estää onlogin-toiminnon automaattisesta käynnistymisestä heidän seuraavalla vierailullaan.
+
+

Callback" API (nykyinen)

+

Callback API esiteltiin marraskuussa 2011. Se paransi sovellusohjelmointirajapinnan (API) alustusta sallimalla valitsimien välittämisen kohteelle navigator.id.get() ja tarjoamalla kokeellisen tuen BrowserID-hallituille pysyville istunnoille.

+
+
+ {{ domxref("navigator.id.get()")}}
+
+ Hakee käyttäjän BrowserID:n allekirjoitetussa vakuutuksessa.
+
+

"VerifiedEmail" API (vanhentunut)

+

VerifiedEmail API oli BrowserID:n ensimmäinen sovellusohjelmointirajapinta (API). Se vanheni vuoden 2011 lopussa.

+
+
+ {{ domxref("navigator.id.getVerifiedEmail()")}} {{ deprecated_inline() }}
+
+ Hakee käyttäjän BrowserID:n allekirjoitetussa vakuutuksessa. Tämä metodi on vanhentunut; {{ domxref("navigator.id.get()")}} on taaksepäin yhteensopiva ja sitä voidaan käyttää sen sijasta.
+
diff --git a/files/fi/dom/navigator.mozsocial/index.html b/files/fi/dom/navigator.mozsocial/index.html new file mode 100644 index 0000000000..069119ac3d --- /dev/null +++ b/files/fi/dom/navigator.mozsocial/index.html @@ -0,0 +1,45 @@ +--- +title: navigator.mozSocial +slug: DOM/navigator.mozSocial +translation_of: Archive/mozSocial +--- +
+ {{Apiref}}{{non-standard_header}}{{fx_minversion_header("17.0")}}
+

Ominaisuuden navigator.mozSocial property palauttama MozSocial -objekti on käytettävissä sosiaalisen median tarjoajien paneelin sisällä ja tarjoaa toiminnallisuutta, jota se ehkä voi tarvita.

+
+

Huomaa: Vaikka Mozilla toivoo lähetävänstä tämän API:n standardisoitavaksi, se ei ole vielä tehnyt sitä.

+
+

Attribuutit

+
+
+ {{domxref("MozSocial.isVisible")}}
+
+ Palauttaa Boolean-arvon; tulos on true, jos sisältö on näkyvä, muutoin se on false.
+
+

Metodit

+
+
+ {{domxref("MozSocial.closePanel()")}}
+
+ Sulkee parhaillaan auki olevan flyout-paneelin.
+
+ {{domxref("MozSocial.getAttention()")}}
+
+ Suorittaa joitakin toimintoja, jotka suunniteltiin saamaan käyttäjän huomio; tarkka käyttäytyminen voi vaihdella alustalta alustalle. Tämä saattaa näyttää visuaalisen tehosteen, soittaa ääni-ilmoituksen, vilkuttaa näyttöä tai käyttää jotain muuta tekniikkaa.
+
+ {{domxref("MozSocial.getWorker()")}}
+
+ Palauttaa viitteen palvelutekijälle; kun sisälöllä on tämä viite, se voi kutsua sen postMessage()-metodia ja viestiä palvelun kanssa.
+
+ {{domxref("MozSocial.openChatWindow()")}}
+
+ Avaa jutteluikkunan, joka on ankkuroitu selainikkunan pohjalle. Jokainen selainikkuna otaksutaan olevan yksittäistä juttelua varten, mutta toiminnallisuus saattaa vaihdella tarjoajasta riippuen.
+
+ {{domxref("MozSocial.openPanel()")}}
+
+ Avaa sivupalkkiin tiettyyn pystysiirrososoitteeseen kiinnitetyn flyout-paneelin. Tämä saattaa olla esimerkiksi sivupalin ilmoituksessa viitattu todellinen keskustelu.
+
+

Katso myös

+ diff --git a/files/fi/dom/smsmanager/index.html b/files/fi/dom/smsmanager/index.html new file mode 100644 index 0000000000..8738d33711 --- /dev/null +++ b/files/fi/dom/smsmanager/index.html @@ -0,0 +1,88 @@ +--- +title: SmsManager +slug: DOM/SmsManager +translation_of: Archive/B2G_OS/API/MozSmsManager +--- +

{{ ApiRef() }}

+

{{ non-standard_header() }}

+

Tarjoaa tuen lähettää ja hallinnoida SMS-viestejä laitteella, jossa on WebSMS. Nykyisin toteutettu objektina MozSmsManager.

+

Metodit

+
+
+ delete(jsval param)
+
+ Poistaa viestin ja palauttaa {{ domxref("SmsRequest") }} -objektin (jossa SmsRequest.result on Boolean-arvo, joka kertoo, onko viesti poistettu). Viestitunnistetta tai {{ domxref("SmsMessage") }} -objektia voidaan käyttää parametrina.
+
+ getMessage(long id)
+
+ Hakee id-tunnisteella määritellyn viestin ja palauttaa {{ domxref("SmsRequest") }} -objektin, jossa SmsRequest.result on {{ domxref("SmsMessage") }}.
+
+ getMessages(SmsFilter filter, boolean reverse)
+
+ Hakee viestit, jotka on määritelty käyttäen {{ domxref("SmsFilter") }} -objektia. Järjestys voidaan kääntää päinvastaiseksi käyttämällä boolean-muuttujaa toisena parametrina. Palautetaan {{ domxref("SmsRequest") }} -objekti, jossa SmsRequest.result on {{ domxref("SmsCursor") }}.
+
+ getNumberOfMessagesForText(DOMString text)
+
+ Palauttaa tietyn moniosaisen SMS-viestien lukumäärän (160-merkkiä yksittäinen SMS-viesti).
+
+ markMessageRead(long id, boolean aValue)
+
+ Merkitsee määritellyllä id-tunnisteella varustetun viestin luetuksi tai lukemattomaksi riippuen aValue-boolean-arvosta. Palautetaan {{ domxref("SmsRequest") }} -objekti.
+
+ send(DOMString[] number, DOMString message)
+
+ Lähettää viestin määriteltyyn numeroon. Jos number on {{ domxref("DOMString") }} (vain yksi numero), palautetaan {{ domxref("SmsRequest") }} -objekti. Jos number on {{ domxref("DOMString", "DOMStrings") }} -taulukko (useita numeroita), palautetaan {{ domxref("SmsRequest") }} -objektien taulukko.
+
+

Tapahtumat

+
+
+ ondelivered
+
+ Käsittelijä "delivered"-tapahtumalle; tämä {{ domxref("SMSEvent") }} aina kun SMS-viesti on toimitettu vastaanottajalle.
+
+ onreceived
+
+ Käsittelijä "received"-tapatumalle; tämä {{ domxref("SMSEvent") }} lähetetään aina kun SMS-viesti vastaanotetaan.
+
+ onsent
+
+ Käsittelijä "sent"-tapahtumalle; tämä {{ domxref("SMSEvent") }} lähetetään aina kun SMS-viesti lähetetään.
+
+

Selainyhteensopivuus

+

Ilmeisestä syystä tukea odotetaan pääasiassa mobiiliselaimilta.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
OminaisuusAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Perustuki{{ CompatNo() }}{{ CompatGeckoMobile("12.0") }} {{ property_prefix("moz") }}{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
markMessageRead method{{ CompatNo() }}{{ CompatGeckoMobile("15.0") }}{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+
+

Spesifikaatio

+

Ei ole minkään spesifikaation osa; ehdotuksen otaksutaan kuitenkin perustuvatn asiakirjaan WebSMS design document.

+

Katso myös

+ diff --git a/files/fi/dom/window.navigator.appcodename/index.html b/files/fi/dom/window.navigator.appcodename/index.html new file mode 100644 index 0000000000..23c36d88b1 --- /dev/null +++ b/files/fi/dom/window.navigator.appcodename/index.html @@ -0,0 +1,23 @@ +--- +title: window.navigator.appCodeName +slug: DOM/window.navigator.appCodeName +translation_of: Web/API/NavigatorID/appCodeName +--- +

{{ ApiRef() }}

+

Yhteenveto

+

Palauttaa nykyisen selaimen sisäisen "code"-nimen.

+

Syntaksi

+
codeName = window.navigator.appCodeName
+
+

Parametrit

+ +

Esimerkki

+
dump(window.navigator.appCodeName);
+
+

Kommentit

+

Mozilla, Netscape 6, jad IE5 kaikki käyttävät sisäistä nimeä "Mozilla."

+

Spesifikaatio

+

DOM Level 0. Ei ole spesifikaation osa.

+

{{ languages( { "zh-cn": "zh-cn/DOM/window.navigator.appCodeName","ja": "ja/DOM/window.navigator.appCodeName", "pl": "pl/DOM/window.navigator.appCodeName" } ) }}

diff --git a/files/fi/dom/window.navigator.appname/index.html b/files/fi/dom/window.navigator.appname/index.html new file mode 100644 index 0000000000..c7c263d226 --- /dev/null +++ b/files/fi/dom/window.navigator.appname/index.html @@ -0,0 +1,27 @@ +--- +title: window.navigator.appName +slug: DOM/window.navigator.appName +translation_of: Web/API/NavigatorID/appName +--- +

{{ ApiRef() }}

+

Yhteenveto

+

Palauttaa selaimen nimen. HTML5-spesifikaatio sallii kaikkien selainten myös palauttaa tässä "Netscape" yhteensopivuussyistä.

+
+ Huomaa: Älä nojaa tähän ominaisuuteen oikean selainnimen palauttamiseksi. Gecko-perustaisissa selaimissa (kuten Firefox) ja WebKit-perustaisissa selaimissa (kuten Chrome ja Safari) palautettu arvo on "Netscape".
+

Syntaksi

+
appName = window.navigator.appName
+
+

Palautettu arvo

+ +

Esimerkki

+
alert(window.navigator.appName);
+// shows the name of the browser
+
+

Spesifikaatio

+ +

Tämä oli alunperin osa DOM-tasoa 0, mutta on sen jälkeen sisällytetty HTML5-spesifikaatioon.

+

{{ languages( { "ja": "ja/DOM/window.navigator.appName", "pl": "pl/DOM/window.navigator.appName", "zh-cn": "zh-cn/DOM/window.navigator.appName" } ) }}

diff --git a/files/fi/dom/window.navigator.appversion/index.html b/files/fi/dom/window.navigator.appversion/index.html new file mode 100644 index 0000000000..f4a0377ec2 --- /dev/null +++ b/files/fi/dom/window.navigator.appversion/index.html @@ -0,0 +1,32 @@ +--- +title: window.navigator.appVersion +slug: DOM/window.navigator.appVersion +translation_of: Web/API/NavigatorID/appVersion +--- +
+ {{APIRef}}
+
+  
+
+ Yhteenveto
+

Palauttaa selaimen version merkkijonona. Se voi olla joko pelkkä versionumero, kuten "5.0", tai versionumero, jota seuraa yksityiskohtaisempia tietoja. HTML5-spesifikaatio sallii myös kaikkien selainten palauttaa tässä "4.0" yhteensopivuussyistä.

+
+ Huomaa: Älä nojaa tähän ominaisuuteen oikean selainversion palauttamiseksi. Gecko-perustaisissa selaimissa (kuten Firefox) ja WebKit-perustaisissa selaimissa (kuten Chrome ja Safari) palautettu arvo alkaa merkkiyhdistelmällä "5.0", jota seuraa alustatiedot. Opera 10 ja uudemmissa selaimissa palautettu versio ei myöskään täsmää oikeaan selainversioon.
+

Syntaksi

+
window.navigator.appVersion
+
+

Palautettu arvo

+ +

Esimerkki

+
alert("Your browser version is reported as " + navigator.appVersion);
+
+

Kommentit

+

Ominaisuus window.navigator.userAgent voi myös ehkä sisältää versionumeron (esimerkki: "Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.2) Gecko/20010725 Netscape 6/6.1"), mutta sinun tulisi olla tietoinen, kuinka helposti user agent -merkkijonoa voi muuttaa ja "huijata" muita selaimia, alustoja tai user agent -ohjelmia ja kuinka kavereita toimittajat itse ovat näiden ominaisuuksien kanssa.

+

Ominaisuuksia window.navigator.appVersion, window.navigator.appName ja window.navigator.userAgent on käytetty "selainnuuhkimis"-koodissa: skripteissä, jotka yrittävät havaita, minkälaista selainta käytät ja säätävät sivut sen mukaiseksi. Tämä johti nykyiseen tilanteeseen, joissa selainten on palautettava vääriä arvoja näissä ominaisuuksissa, jotta niitä ei voitaisi lukita ulos joiltakin webbisivustoilta.

+

Spesifikaatio

+ +

Tämä oli alunperin osa DOM-taso 0:aa, mutta on sittemmin sisällytettty HTML5-spesifikaatioon.

diff --git a/files/fi/dom/window.navigator.battery/index.html b/files/fi/dom/window.navigator.battery/index.html new file mode 100644 index 0000000000..4a04e78520 --- /dev/null +++ b/files/fi/dom/window.navigator.battery/index.html @@ -0,0 +1,137 @@ +--- +title: window.navigator.battery +slug: DOM/window.navigator.battery +translation_of: Web/API/Navigator/battery +--- +

{{ ApiRef() }}

+

Battery Status API, useimmiten lyhennettynä Battery API, tarjoaa tietoa järjestelmän akun lataustasosta ja sallii sinulle ilmoitettavan muutaman akkutasomuutostapahtuman kautta. Tätä voitaisiin käyttää lataamaan vähemmän suoritinintensiiviset tehtävät sivustollasi, jos akkuvirta on vähissä ja tallentaa muutokset ennen akkuvirran loppumista, jotta estetään tietojen häviäminen.

+

Battery Status API laajentaa {{domxref("window.navigator")}}-objektin metodilla battery. Se määrittää myös muutamia uusia tapahtumia.

+

Attribuutit

+
+
+ charging
+
+ Kirjoitussuojattu. Boolean-arvo edustaa järjestelmän akun lataustilaa. Palauttaa arvon true, jos akkua ladataan, jos järjestelmän akun tila ei ole määriteltävissä, tai jos akkua ei ole liitetty järjestelmään. Palauttaa arvon false, jos akkua puretaan.
+
+ chargingTime
+
+ Kirjoitussuojattu. Double-arvo edustaa jäljellä olevaa sekuntimäärää siihen kun järjestelmän akku ladattu täyteen. Palauttaa arvon 0, jos akku on ladattu täyteen.
+ Palauttaa positiivisen äärettämän arvon, jos akkua puretaan tai jos toteutus ei kykene ilmoittamaan jäljellä olevaa latausaikaa.
+
+ dischargingTime
+
+ Kirjoitussuojattu. Double-arvo edustaa jäljellä olevaa sekuntimäärää siihen kun järjestelmän akku on täysin purettu ja järjestelmä keskeytetään. Palauttaa positiivisen äärettömän arvon, jos akkua ladataan, jos toteutus ei kykene ilmoittamaan purkamisaikaa, tai jos järjestelmään ei ole liitetty akkua.
+
+ level
+
+ Kirjoitussuojattu. Double-arvo edustaa järjestelmän akun lataustasoa skaalalla 0 ... 1.0. Palauttaa arvon 0, jos akku on tyhjä ja järjestelmä on siirtymässä keskeytystilaan. Palauttaa arvon 1.0, jos akku on täynnä, jos toteutus ei kykene ilmoittamaan akun tasoa, tai jos akkua ei ole liitetty järjestelmään.
+
+

Tapahtumat

+
+
+ chargingchange
+
+ Laukeaa, kun akun lataustilaa päivitetään.
+
+ chargingtimechange
+
+ Laukeaa, kun akun latausaikaa päivitetään.
+
+ dischargingtimechange
+
+ Laukeaa, kun akun purkausaikaa päivitetään.
+
+ levelchange
+
+ Laukeaa, kun akun tasoa päivitetään.
+
+

Esimerkki

+

Katso myös esimerkkiä spesifikaatiossa.

+
var battery = navigator.battery || navigator.mozBattery || navigator.webkitBattery;
+
+function updateBatteryStatus() {
+  alert("Battery status: " + battery.level * 100 + " %");
+
+  if (battery.charging) {
+    alert("Battery is charging");
+  }
+}
+
+battery.addEventListener("chargingchange", updateBatteryStatus);
+battery.addEventListener("levelchange", updateBatteryStatus);
+updateBatteryStatus();
+
+

Spesifikaatiot

+ + + + + + + + + + + + + + + +
SpesifikaatioTilaKommentti
{{SpecName('Battery API')}}{{Spec2('Battery API')}}Alustava spesifikaatio.
+

Selainyhteensopivuus

+

{{ CompatibilityTable() }}

+
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Perustuki20 {{ property_prefix("webkit") }}{{CompatGeckoDesktop("10")}} {{ property_prefix("moz") }} [1]
+ {{CompatGeckoDesktop("16")}} (without prefix) [2]		{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+
+
+ + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Perustuki20 {{ property_prefix("webkit") }}{{CompatGeckoMobile("10")}} {{ property_prefix("moz") }} [1]
+ {{CompatGeckoMobile("16")}} (without prefix) [2]		{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+
+

Gecko-kommentit

+

[1] Disabled by default in Firefox 10.0, but can be enabled setting the preference dom.battery.enabled to true. Starting with Firefox 11.0, mozBattery is enabled by default.

+

[2] The Battery API is currently supported on Android, Windows, and Linux with UPower installed. Support for MacOS is available starting with Gecko 18.0 {{geckoRelease("18.0")}}.

+

Katso myös

+ diff --git a/files/fi/dom/window.navigator.buildid/index.html b/files/fi/dom/window.navigator.buildid/index.html new file mode 100644 index 0000000000..a7bdf2efba --- /dev/null +++ b/files/fi/dom/window.navigator.buildid/index.html @@ -0,0 +1,21 @@ +--- +title: window.navigator.buildID +slug: DOM/window.navigator.buildID +translation_of: Web/API/Navigator/buildID +--- +

{{ ApiRef() }}

+

Yhteenveto

+

Palauttaa selaimen rakentamistunnisteen.

+

Syntaksi

+
buildID = navigator.buildID;
+
+

buildID on sovelluksen rakentamistunniste merkkijonona. Tämä rakentamistunniste on muotoa YYYYMMDDHH.

+

Esimerkki

+
dump(window.navigator.buildID);
+// prints "2006090803" to the console
+
+

Huomaa

+

Käytettävissä selaimessa Firefox 2 (Gecko 1.8.1) ja uudemmissa. Toteutettu kohteessa {{ Bug(345993) }}.

+

Spesifikaatio

+

Ei kuulu mihinkään standardiin.

+

{{ languages( { "ja": "ja/DOM/window.navigator.buildID", "zh-cn": "zh-cn/DOM/window.navigator.buildID", "pl": "pl/DOM/window.navigator.buildID" } ) }}

diff --git a/files/fi/dom/window.navigator.connection/index.html b/files/fi/dom/window.navigator.connection/index.html new file mode 100644 index 0000000000..da01bbcdc7 --- /dev/null +++ b/files/fi/dom/window.navigator.connection/index.html @@ -0,0 +1,100 @@ +--- +title: window.navigator.connection +slug: DOM/window.navigator.connection +translation_of: Web/API/Navigator/connection +--- +

{{ Apiref() }}

+

{{ SeeCompatTable() }}

+

Network Information API tarjoaa tietoa järjestelmän verkkoyhteydestä, kuten käyttäjän laitteen nykyisestä kaistanleveydestä tai onko yhteys mitattu. Tätä voitaisiin käyttää valitsemaan HD-sisältö tai LD-sisältö käyttäjän yhteyteen perustuen.

+

Attribuutit

+
+
+ bandwidth
+
+ Kirjoitussuojattu. Double-arvo edustaa arvioitua nykyisen yhteyden latauskaistanleveyttä (arvona MB/s). 0 jos käyttäjä ei ole parhaillaan verkkoyhteydessä ja infinity jos kaistanleveys on tuntematon.
+
+ metered
+
+ Kirjoitussuojattu. Boolean-arvo palauttaen true, jos yhteys on mitattu (esim.: pay-per-use).
+
+

Tapahtumat

+
+
+ onchange
+
+ Laukeaa, kun yhteys muuttuu.
+
+

Esimerkki

+
var connection = navigator.connection || navigator.mozConnection || navigator.webkitConnection;
+
+function updateConnectionStatus() {
+  alert("Connection bandwidth: " + connection.bandwidth + " MB/s");
+  if (connection.metered) {
+    alert("The connection is metered!");
+  }
+}
+
+connection.addEventListener("change", updateConnectionStatus);
+updateConnectionStatus();
+
+

Selainyhteensopivuus

+

{{ CompatibilityTable() }}

+
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Perustuki20? {{ property_prefix("webkit") }}12.0 {{ property_prefix("moz") }} (katso kommentit){{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+
+
+ + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Perustuki{{ CompatNo() }}12.0 {{ property_prefix("moz") }} (katso kommentit){{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+
+

Gecko-kommentit

+ +

Spesifikaatio

+ +

Katso myös

+ diff --git a/files/fi/dom/window.navigator.cookieenabled/index.html b/files/fi/dom/window.navigator.cookieenabled/index.html new file mode 100644 index 0000000000..46a49e6eae --- /dev/null +++ b/files/fi/dom/window.navigator.cookieenabled/index.html @@ -0,0 +1,99 @@ +--- +title: Navigator.cookieEnabled +slug: DOM/window.navigator.cookieEnabled +tags: + - API + - DOM + - Ominaisuus +translation_of: Web/API/Navigator/cookieEnabled +--- +

{{ ApiRef("HTML DOM") }}

+ +

Palauttaa totuusarvon, joka osoittaa, ovatko evästeet käytössä vai eivät.

+ +

Syntaksi

+ +
var cookieEnabled = navigator.cookieEnabled;
+
+ + + +

Esimerkki

+ +
if (!navigator.cookieEnabled) {
+  // kerrotaan käyttäjälle, että evästeiden käyttöönotto tekee sivusta paljon hyödyllisemmän
+}
+
+ +

Määrittelyt

+ + + + + + + + + + + + + + + + +
MäärittelyTilaKommentti
{{SpecName("HTML WHATWG", "webappapis.html#dom-navigator-cookieenabled", "Navigator.cookieEnabled")}}{{Spec2("HTML WHATWG")}}Alkuperäinen määrittely
+ +

Selainyhteensopivuus

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
OminaisuusChromeFirefox (Gecko)Internet ExplorerOperaSafari
Perustuki{{ CompatVersionUnknown() }}{{ CompatGeckoDesktop(1.0) }}{{ CompatVersionUnknown() }}[1]{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
+
+ +
+ + + + + + + + + + + + + + + + + + + +
OminaisuusAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Perustuki{{ CompatUnknown() }}{{ CompatGeckoMobile(1.0) }}[1]{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+ +

[1] Ennen Gecko 8.0:aa {{ geckoRelease("8.0") }}, window.navigator.cookieEnabled ilmoittaa väärän tuloksen, jos sivulle, jolle tarkistus suoritetaan, on asetettu sivustopoikkeus. Tämä on korjattu.

diff --git a/files/fi/dom/window.navigator.language/index.html b/files/fi/dom/window.navigator.language/index.html new file mode 100644 index 0000000000..7fde093ceb --- /dev/null +++ b/files/fi/dom/window.navigator.language/index.html @@ -0,0 +1,82 @@ +--- +title: window.navigator.language +slug: DOM/window.navigator.language +translation_of: Web/API/NavigatorLanguage/language +--- +

{{ ApiRef() }}

+

Yhteenveto

+

Palauttaa selaimen kieliversiota edustavan merkkijonon.

+

Syntaksi

+
lang = window.navigator.language
+
+

Parametrit

+ +

Esimerkki

+
if ( window.navigator.language != "en" ) {
+ doLangSelect(window.navigator.language);
+}
+
+

Selainyhteensopivuus

+

{{ CompatibilityTable() }}

+
+ + + + + + + + + + + + + + + + + + + +
OminaisuusChromeFirefox (Gecko)Internet ExplorerOperaSafari
Perustuki +

{{ CompatVersionUnknown() }}

+

Selaimesta Chrome 0.3.154 alkaen tämä ominaisuus perustuu Accept-Language HTTP header-otsakkeen arvoon.

+ 		+

{{ CompatGeckoDesktop(1.0) }}

+

Ennen Gecko 2.0 {{ geckoRelease("2.0") }} -selainversiota tämän ominaisuuden arvo oli osa user agent -merkkijonoa, jonka {{ domxref("window.navigator.userAgent", "navigator.userAgent") }} ilmoitti.

+

Selaimesta Gecko 5.0 {{ geckoRelease("5.0") }} alkaen tämän ominaisuuden arvo perustuu Accept-Language HTTP header-otsakkeen arvoon.

+ 		+

{{ CompatNo() }}

+

Lähimmät käytettävissä olevat (ei-standardit) ominaisuudet ovat userLanguage ja browserLanguage.

+ 		{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
+
+
+ + + + + + + + + + + + + + + + + + + +
OminaisuusAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Perustuki{{ CompatVersionUnknown() }}{{ CompatGeckoMobile(1.0) }} +

{{ CompatNo() }}

+

Lähimmät käytettävissä olevat (ei-standardit) ominaisuudet ovat userLanguage ja browserLanguage.

+ 		{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
+
+

Spesifikaatio

+

DOM Level 0. Ei ole spesifikaation osa.

+

{{ languages( { "ja": "ja/DOM/window.navigator.language","zh-cn": "zh-cn/DOM/window.navigator.language", "pl": "pl/DOM/window.navigator.language", "fi": "fi/DOM/window.navigator.language" } ) }}

diff --git a/files/fi/dom/window.navigator.mimetypes/index.html b/files/fi/dom/window.navigator.mimetypes/index.html new file mode 100644 index 0000000000..52298d1eb1 --- /dev/null +++ b/files/fi/dom/window.navigator.mimetypes/index.html @@ -0,0 +1,22 @@ +--- +title: window.navigator.mimeTypes +slug: DOM/window.navigator.mimeTypes +translation_of: Web/API/NavigatorPlugins/mimeTypes +--- +

{{ ApiRef() }}

+

Yhteenveto

+

Palauttaa MimeTypeArray-objektin, joka sisältää MimeType-objektien luettelon, joka edustaa selaimen tunnistamia MIME-tyyppejä.

+

Syntaksi

+
mimeTypes = navigator.mimeTypes;
+
+

mimeTypes on MimeTypeArray-objekti, jolla on length-ominaisuus samoin kuin metodit item(index) ja namedItem(name).

+

Esimerkki

+
  alert(window.navigator.mimeTypes.item(0).description); // alerts "Mozilla Default Plug-in"
+
+

Kommentit

+

Nollanella elementillä mimeTypes-määrittelyssä ("Mozilla Default Plug-in" MimeType object) on *-ominaisuus type eikä tyypilinen MIME-muoto kuten "image/x-macpaint"

+

Spesifikaatio

+

{{ DOM0() }}

+
+  
+

{{ languages( { "ja": "ja/DOM/window.navigator.mimeTypes", "pl": "pl/DOM/window.navigator.mimeTypes" } ) }}

diff --git a/files/fi/dom/window.navigator.mozsms/index.html b/files/fi/dom/window.navigator.mozsms/index.html new file mode 100644 index 0000000000..131c90f2d2 --- /dev/null +++ b/files/fi/dom/window.navigator.mozsms/index.html @@ -0,0 +1,49 @@ +--- +title: window.navigator.mozSms +slug: DOM/window.navigator.mozSms +translation_of: Archive/B2G_OS/API/Navigator/mozSms +--- +

{{ ApiRef() }}

+

{{ non-standard_header() }}

+

Yhteenveto

+

Palauttaa {{ domxref("SmsManager") }} -objektin, jota voit käyttää SMS-viestien vastaanottamiseen ja lähettämiseen.

+

Syntaksi

+
var sms = window.navigator.mozSms;
+
+

Selainyhteensopivuus

+

Ilmeisistä syistä tuke otaksutaan pääasiassa mobiiliselaimissa.

+ + + + + + + + + + + + + + + + + + + +
OminaisuusAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Perustuki{{ CompatNo() }}{{ CompatGeckoMobile("12.0") }}{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+

 

+

Asetukset & saatavuus

+ +

Spesifikaatio

+

Ei ole minkään spesifikaation osa; On kuitenkin odotettu WebSMS-suunnitteluasiakirjaan perustuvaa ehdotusta.

+

Katso myös

+ diff --git a/files/fi/dom/window.navigator.online/index.html b/files/fi/dom/window.navigator.online/index.html new file mode 100644 index 0000000000..e3faca86f5 --- /dev/null +++ b/files/fi/dom/window.navigator.online/index.html @@ -0,0 +1,101 @@ +--- +title: window.navigator.onLine +slug: DOM/window.navigator.onLine +translation_of: Web/API/NavigatorOnLine/onLine +--- +
+ {{ApiRef}}
+

Yhteenveto

+

Palauttaa selaimen verkkotilan. Ominaisuus palauttaa boolean-arvon, joka on true, kun verkkoyhteys on päällä ja false, kun selain toimii erillissovelluksena. Ominaisuus lähettää päivityksiä aina kun selaimen kyky yhdistyä verkkoon muuttuu. Päivitys tapahtuu, kun käyttäjä seuraa linkkiä tai kun skripti pyytää etäsivua. Esimerkiksi ominaisuuden pitäisi palauttaa false, kun käyttäjä napsauttaa linkkiä pian internet-yhteyden katkeamisen jälkeen.

+

Selaimet toteuttavat tätä ominaisuutta eri tavoin.

+

Chrome- ja Safari-selaimissa, jos selain ei kykene yhdistämään paikallisverkkoon (LAN) tai reitittimeen, se on erillissovellus; kaikki muut tilat palauttavat arvon true. Joten samalla kun voit otaksua, että selain on erillissovelluksena, kun sa palauttaa arvon false, et voi olettaa, että pääset internettiin, kun se palauttaa arvon true. Voisit saada vääriä positiivisia, sellaisissa tapauksissa, kun tietokone käyttää virtuaalisointiohjelmistoa, jolla on virtuaalisia ethernet-adaptereja, jotka ovat aina "yhdistettynä". Jos haluat todella määrittää selaimen verkkotilan, niin sinun olisi sikis kehitettävä muita keinoja tarkistamiseen. Lisäoppia varten katso HTML5 Rocks article, Working Off the Grid.

+

Firefox- ja Internet Explorer-selaimissa selaimen kytkeminen offline-tilaan lähettää arvon false. Kaikki muut tilat palauttavat arvon true.

+

Voit nähdä verkkotilan muutokset kuuntelemalla tapahtumia kohteissa window.onOnline ja window.onOffline.

+

Syntaksi

+
online = window.navigator.onLine;
+
+

online on boolean-arvo true tai false.

+

Esimerkki

+

Katso live-esimerkki.

+

Sen tarkistamiseksi, että oletko verkossa, kysele window.navigator.onLine, kuten seuraavassa esimerkissä:

+
if (navigator.onLine) {
+  alert('online')
+} else {
+  alert('offline');
+}
+

Verkkotila-arvojen muutosten näkemiseksi kuuntele (käyttäen addEventListener) tapatumia kohteessa window.onOnline ja window.onOffline, kuten seuraavassa esimerkissä:

+
window.addEventListener("offline", function(e) {alert("offline");})
+
+window.addEventListener("online", function(e) {alert("online");})
+
+

Selainyhteensopivuus

+

{{CompatibilityTable}}

+
+ + + + + + + + + + + + + + + + + + + +
OminaisuusChrome**Firefox (Gecko)*Internet ExplorerOpera*Safari (WebKit)
Perustuki +

Windows: 11
+ Mac: 14
+ Chrome OS: 13
+ Linux: Palauttaa aina arvon true

+

Historiaa varten katso crbug.com/7469

+ 		+

{{CompatNo}}
+ {{bug("336359")}}
+ {{bug("426932")}}
+ {{bug("620472")}}

+

{{bug("654579")}}

+ 		8***{{CompatNo}}5.0.4
+
+
+ + + + + + + + + + + + + + + + + + + +
OminaisuusAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
PerustukiAndroid 2.2 (Vika WebView-komponentissa, katso julkaisu 16760){{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+

* Firefox 4, ja Opera 11.10 palauttaa arvon true, kun "Work Offline"-tila on pois käytöstä ja false, kun se on käytössä riippumatta todellisesta yhteydestä.

+

** Chrome-selaimen aiemmat versiot palattavat virheellisesti true kun selain ensin avataa, mutta se alkaa ilmoittaa oiken yhteysarvon ensimmäisen verkkotapahtuman jälkeen.

+

*** Selaimessa IE 8 "online"- ja "ofline"-tapahtumat nostettiin kohteessa document.body, selaimessa IE 9 - sekä kohteessa document.body että kohteessa window

+

Kommentit

+

Katso yksityiskohtaisempaa kuvausta tästä ominaisuudesta asiakirjasta Online/Offline Events‎ samoin kuin uusista offline-kohtaisista ominaisuuksista, jotka esiteltiin selaimessa Firefox 3.

+

Spesifikaatio

+

Kuvattu asiakirjassa HTML 5 Working draft

+

Katso myös

+ diff --git a/files/fi/dom/window.navigator.oscpu/index.html b/files/fi/dom/window.navigator.oscpu/index.html new file mode 100644 index 0000000000..da15e79c7d --- /dev/null +++ b/files/fi/dom/window.navigator.oscpu/index.html @@ -0,0 +1,70 @@ +--- +title: window.navigator.oscpu +slug: DOM/window.navigator.oscpu +translation_of: Web/API/Navigator/oscpu +--- +

{{ ApiRef() }}

+

Yhteenveto

+

Palauttaaa merkkijonon, joka identifioi nykyisen käyttäjärjestelmän.

+

Syntaksi

+
oscpuInfo = window.navigator.oscpu
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
KäyttöjärjestelmäoscpuInfo-merkkijonomuoto
OS/2OS/2 Warp x (joko 3, 4 tai 4.5)
Windows CEWindowsCE x.y1
Windows 64-bit (64-bit build)Windows NT x.y; Win64; x64
Windows 64-bit (32-bit build)Windows NT x.y; WOW64
Windows 32-bitWindows NT x.y
Mac OS X (PPC build)PPC Mac OS X x.y
Mac OS X (i386/x64 build)Intel Mac OS X x.y
Linux 64-bit (32-bit build)Output of uname -s plus "i686 on x86_64"
LinuxOutput of uname -sm
+

1x.y viittaa käyttöjärjestelmän versioon

+

Esimerkki

+
function osInfo() {
+  alert(window.navigator.oscpu);
+}
+// palauttaa esimerkiksi: "Windows NT 6.0"
+
+

Kommentit

+

Jollei koodi ole etuoikeutettu (chrome tai ainakin on UniversalBrowserRead-etuoikeus), se voi saada general.oscpu.override-asetusarvon eikä todellista alustaa.

+

Spesifikaatio

+

{{ DOM0() }}

+

{{ languages( { "ja": "ja/DOM/window.navigator.oscpu", "zh-cn": "zh-cn/DOM/window.navigator.oscpu", "pl": "pl/DOM/window.navigator.oscpu" } ) }}

diff --git a/files/fi/dom/window.navigator.platform/index.html b/files/fi/dom/window.navigator.platform/index.html new file mode 100644 index 0000000000..af2888a91f --- /dev/null +++ b/files/fi/dom/window.navigator.platform/index.html @@ -0,0 +1,22 @@ +--- +title: window.navigator.platform +slug: DOM/window.navigator.platform +translation_of: Web/API/NavigatorID/platform +--- +

{{ ApiRef() }}

+

Yhteenveto

+

Palauttaa selaimen alustaa edustavan merkkijonon.

+

Syntaksi

+
platform = navigator.platform
+
+

platform on merkkijono, joka on yksi seuraavista arvoista: "Win32", "Linux i686", "MacPPC", "MacIntel", tai jokin muu.

+

Esimerkki

+
alert(navigator.platform);
+

Kommentit

+

Jollei koodisi ole etuoikeutettu (chrome tai vähintään UniversalBrowserRead-etuoikeus), se voi ehkä saada general.platform.override-asetusarvon eikä oikean alustan.

+

Spesifikaatio

+ +

Tämä oli alunperin osa DOM Level 0-määrittelyä, mutta on sittemmin sisällytetty HTML5-spesifikaatioon.

+

{{ languages( {"ja": "ja/DOM/window.navigator.platform", "zh-cn": "zh-cn/DOM/window.navigator.platform", "pl": "pl/DOM/window.navigator.platform" } ) }}

diff --git a/files/fi/dom/window.navigator.plugins/index.html b/files/fi/dom/window.navigator.plugins/index.html new file mode 100644 index 0000000000..993d145809 --- /dev/null +++ b/files/fi/dom/window.navigator.plugins/index.html @@ -0,0 +1,39 @@ +--- +title: window.navigator.plugins +slug: DOM/window.navigator.plugins +translation_of: Web/API/NavigatorPlugins/plugins +--- +

{{ ApiRef() }}

+

Yhteenveto

+

Palauttaa {{ domxref("PluginArray") }} -objektin, joka luettelee sovellukseen asennetut lisäosat.

+

Syntaksi

+
plugins = navigator.plugins;
+
+

plugins on PluginArray, sisältäen {{ domxref("Plugin") }} -objektit asennetuille lisäosille.

+

Palautettu arvo ei ole JavaScript-taulukko, vaan siinä on length-ominaisuus ja se tukee yksittäisten alkoiden lukemista käyttäen hakasulkuesitysmuotoa (plugins{{ mediawiki.external(2) }}), samoin kuin item(index)- ja namedItem("name")-metodien kautta.

+

Esimerkki

+

Seuraava esimerkki tulostaa tietoa asennetuista lisäosista ylemmän tason asiakirjaan. Huomaa Plugin-objektissa saatavilla olevat ominaisuudet: name, filename, description, ja version.

+

{{ gecko_minversion_note("1.9.2", "Ominaisuus version lisättiin selaimeen Gecko 1.9.2.") }}

+
<script type="text/javascript">
+   var L = navigator.plugins.length;
+   document.write(L.toString().bold() + " Plugin(s)".bold());
+   document.write("<br>");
+   document.write("Name | Filename | description".bold());
+   document.write("<br>");
+   for(var i=0; i<L; i++) {
+     document.write(navigator.plugins[i].name);
+     document.write(" | ");
+     document.write(navigator.plugins[i].filename);
+     document.write(" | ");
+     document.write(navigator.plugins[i].description);
+     document.write(" | ");
+     document.write(navigator.plugins[i].version);
+     document.write("<br>");
+   }
+</script>
+
+

Kommentit

+

Objekti {{ domxref("Plugin") }} paljastaa pienen käyttöliittymän, josta saa tietoa selaimeesi asennetuista eri lisäosista. Lisäosien luettelo on saatavissa myös kirjoittamalla about:plugins selaimen sijaintipalkkiin.

+

Spesifikaatio

+

{{ DOM0() }}

+

{{ languages( { "ja": "ja/DOM/window.navigator.plugins","zh-cn": "zh-cn/DOM/window.navigator.plugins", "pl": "pl/DOM/window.navigator.plugins" } ) }}

diff --git a/files/fi/dom/window.navigator.product/index.html b/files/fi/dom/window.navigator.product/index.html new file mode 100644 index 0000000000..743d09ba0d --- /dev/null +++ b/files/fi/dom/window.navigator.product/index.html @@ -0,0 +1,36 @@ +--- +title: window.navigator.product +slug: DOM/window.navigator.product +translation_of: Web/API/NavigatorID/product +--- +

{{ ApiRef() }}

+

Yhteenveto

+

Tämä ominaisuus palauttaa nykyisen selaimen tuotenimen.

+
+ Huomaa: Älä nojaa tähän ominaisuuteen oikean tuotenimen palauttamiseksi. Sekä Gecko- että WebKit-selaimet palauttavat "Gecko" tämän ominaisuuden arvona.
+

Syntaksi

+
productName = window.navigator.product
+
+

Palautettu arvo

+ +

Esimerkki

+
<script>
+function prod() {
+  dt = document.getElementById("d");
+  dt.innerHTML = window.navigator.product;
+}
+</script>
+<button onclick="prod();">product</button>
+<div id="d"> </div>
+// palauttaa merkkijonon "Gecko"
+
+

Kommentit

+

Gecko-perustaisissa selaimissa product täsmää siihen osaan user agent -merkkijonoon, joka tulee heti alustan jälkeen. Esimerkiksi Netscape 6.1-selaimen user agent -merkkijonossa tuote on "Gecko" ja koko agent-merkkijono on seuraava: Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.2) Gecko/20010725 Netscape6/6.1.

+

WebKit-perustaisten selainten product-merkkijono palauttaa arvon "Gecko" vaikka koko user agent -merkkijonon heti alustan jälkeinen merkkijono on itse asiassa seuraava: (KHTML, like Gecko).

+

Spesifikaatio

+

DOM Level 0. Ei ole spesifikaation osa.

+
+  
+

{{ languages( { "ja": "ja/DOM/window.navigator.product", "pl": "pl/DOM/window.navigator.product" } ) }}

diff --git a/files/fi/dom/window.navigator.productsub/index.html b/files/fi/dom/window.navigator.productsub/index.html new file mode 100644 index 0000000000..af2f4646c1 --- /dev/null +++ b/files/fi/dom/window.navigator.productsub/index.html @@ -0,0 +1,29 @@ +--- +title: window.navigator.productSub +slug: DOM/window.navigator.productSub +translation_of: Web/API/Navigator/productSub +--- +
+ {{ApiRef}} {{non-standard_header}}
+

Yhteenveto

+

productSub palauttaa nykyisen selaimen rakentamisnumeron.

+

Syntaksi

+
prodSub = window.navigator.productSub
+ +

Esimerkki

+
<script>
+function prodsub() {
+  var dt = document.getElementById("d").childNodes[0];
+  dt.data = window.navigator.productSub;
+}
+</script>
+
+<button onclick="prodsub();">productSub</button>
+// palauttaa: 20010725
+

Kommentit

+

IE-selaimessa tämä ominaisuus palauttaa määrittelemättömän.

+

Apple Safari- ja Google Chrome-selaimissa tämä ominaisuus palauttaa aina 20030107.

+

Spesifikaatio

+

{{dom0}}

diff --git a/files/fi/dom/window.navigator.useragent/index.html b/files/fi/dom/window.navigator.useragent/index.html new file mode 100644 index 0000000000..e9e9f95084 --- /dev/null +++ b/files/fi/dom/window.navigator.useragent/index.html @@ -0,0 +1,42 @@ +--- +title: window.navigator.userAgent +slug: DOM/window.navigator.userAgent +translation_of: Web/API/NavigatorID/userAgent +--- +
+ {{ApiRef}}
+

Yhteenveto

+

Palauttaa nykyisen selaimen user agent -merkkijonon.

+

Syntaksi

+
var ua = window.navigator.userAgent;
+
+

Arvo

+

ua tallentaa nykyisen selaimen user agent -merkkijonarvon.

+

Ominaisuus window.navigator.userAgent on read-write-arvo; sillä ei ole oletusarvoa.

+

Merkkijono user agent rakennetaan muotorakenteeseen, joka koostuu useasta tieto-osiosta. Jokainen näistä osista tulee muista navigator-ominaisuuksista, jotka käyttäjä voi myös asettaa. Gecko-perustaiset selaimet noudattavat seuraavaa rakennetta:

+
userAgent = appCodeName/appVersion number (Platform; Security; OS-or-CPU;
+Localization; rv: revision-version-number) product/productSub
+Application-Name Application-Name-version
+
+

Esimerkki

+
alert(window.navigator.userAgent)
+// alerts "Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.2) Gecko/20010725 Netscape6/6.1"
+
+

Kommentit

+

Selaintunnistus, joka perustuu user agent -merkkijono havainnointiin epäluotetttava ja sitä ei suositella, koska käyttäjä voi asettaa user agent -merkkijonon. Esimerkiksi:

+ +

Spesifikaatio

+

{{DOM0}}

+

Katso myös

+ diff --git a/files/fi/dom/window.navigator.vendor/index.html b/files/fi/dom/window.navigator.vendor/index.html new file mode 100644 index 0000000000..b0f88079ce --- /dev/null +++ b/files/fi/dom/window.navigator.vendor/index.html @@ -0,0 +1,24 @@ +--- +title: window.navigator.vendor +slug: DOM/window.navigator.vendor +translation_of: Web/API/Navigator/vendor +--- +

{{ ApiRef() }}

+

Yhteenveto

+

Palauttaa nykyisen selaimen selaintoimittajan nimen.

+

Syntaksi

+
venString = window.navigator.vendor
+
+

Parametrit

+ +

Esimerkki

+
window.navigator.vendor
+// returns "Netscape6"
+
+

Kommentit

+

toimittaja on toinen userAgent-merkkijonon osa. Tuote ja toimittaja voivat olla erilaisia--kuten kun Netscape 6.1 käyttää Gecko-tuotetta tehdäkseen oman renderointinsa. Katso myös navigator.product, navigator.userAgent

+

Spesifikaatio

+

DOM Level 0. Ei ole spesifikaation osa.

+

{{ languages( { "ja": "ja/DOM/window.navigator.vendor" ,"zh-cn": "zh-cn/DOM/window.navigator.vendor" } ) }}

diff --git a/files/fi/dom/window.navigator/index.html b/files/fi/dom/window.navigator/index.html new file mode 100644 index 0000000000..3851727b18 --- /dev/null +++ b/files/fi/dom/window.navigator/index.html @@ -0,0 +1,110 @@ +--- +title: window.navigator +slug: DOM/window.navigator +translation_of: Web/API/Window/navigator +--- +
{{ApiRef}}
+ +

Yhteenveto

+ +

Palauttaa viitteen navigaattori-objektiin, jolta voidaan kysellä tietoja skriptiä suorittavasta sovelluksesta.

+ +

Esimerkki

+ +
+
alert("You're using " + navigator.appName);
+
+
+ +

Ominaisuudet

+ +
+
{{domxref("window.navigator.appCodeName", "navigator.appCodeName")}} {{non-standard_inline}}
+
Palauttaa nykyisen selaimen sisäisen "code"-nimen. Älä nojaa tähän ominaisuuteen oikean arvon palauttamiseksi.
+
{{domxref("window.navigator.appName", "navigator.appName")}}
+
Palauttaa selaimen virallisen nimen. Älä nojaa tähän ominaisuuteen oikean arvon palauttamiseksi.
+
{{domxref("window.navigator.appVersion", "navigator.appVersion")}}
+
Palauttaa selaimen version merkkijonona. Älä nojaa tähän ominaisuuteen oikean arvon palauttamiseksi.
+
{{domxref("window.navigator.battery", "navigator.battery")}} {{gecko_minversion_inline("10.0")}}
+
Palauttaa {{domxref("window.navigator.battery", "battery")}}-objektin, jota voit käyttää tietojen saamiseksi akun lataustilasta.
+
{{domxref("window.navigator.buildID", "navigator.buildID")}} {{non-standard_inline}}
+
Palauttaa selaimen rakentamistunnisteen (esim.: "2006090803")
+
{{domxref("window.navigator.connection", "navigator.connection")}}
+
Tarjoaa tietoa laitteen verkkoyhteydestä.
+
{{domxref("window.navigator.cookieEnabled", "navigator.cookieEnabled")}}
+
Palauttaa boolean-arvon, joka kertoo, että ovatko evästeet käytössä selaimessa vai eivät.
+
{{domxref("navigator.doNotTrack")}} {{non-standard_inline}}
+
Ilmoittaa käyttäjän do-not-track -asetuksen. Kun tämä arvo on "yes", webbisivustosi tai sovelluksesi ei pitäisi seurata käyttäjää.
+
{{domxref("navigator.id")}} {{non-standard_inline}}
+
Palauttaa {{domxref("window.navigator.id", "id")}}-objektin, jota voit käyttää BrowserID-tuen lisäämiseksi webbisivustollesi.
+
{{domxref("window.navigator.language", "navigator.language")}}
+
Palauttaa selaimen kieliversiota edustavan merkkijonon.
+
{{domxref("window.navigator.mimeTypes", "navigator.mimeTypes")}}
+
Palauttaa selaimen tukemien MIME-tyypien luettelon.
+
{{domxref("window.navigator.mozApps", "navigator.mozApps")}} {{non-standard_inline}}
+
Palauttaa {{domxref("window.navigator.mozApps", "Apps")}}-objektin, jota voit käyttää Open Web apps-sovellusten asentamiseen, hallinnointiin ja ohjaamiseen.
+
{{domxref("navigator.mozNotification")}} {{non-standard_inline}}
+ {{domxref("navigator.webkitNotification")}}
+
Palauttaa {{domxref("navigator.mozNotification", "notification")}}-objektin, jota voit käyttää toimittamaan ilmoituksia käyttäjältä webbisovelluksellesi.
+
{{domxref("window.navigator.mozSms", "navigator.mozSms")}}  {{gecko_minversion_inline("12.0")}} {{non-standard_inline}}
+
Palauttaa {{domxref("SmsManager")}}-objektin, jota voit käyttää SMS-viestinnän hallinnointiin webbisovelluksessasi.
+
{{domxref("navigator.mozSocial")}} {{non-standard_inline}}
+
{{todo("NeedsText")}}
+
{{domxref("window.navigator.mozTelephony", "navigator.mozTelephony")}} {{non-standard_inline}}
+
Palauttaa {{domxref("Telephony")}}-objektin, jota voit käyttää luomaan ja hallinnoimaan puheluja.
+
{{domxref("window.navigator.onLine", "navigator.onLine")}}
+
Palauttaa boolean-arvon, joka osoittaa, että onko selaimesi verkkoyhteydessä vai ei.
+
{{domxref("window.navigator.oscpu", "navigator.oscpu")}}
+
Palauttaa nykyistä käyttäjärjestelmää edustavan merkkijonon.
+
{{domxref("window.navigator.platform", "navigator.platform")}}
+
Palauttaa selainalustaa edustavan merkkijonon.
+
{{domxref("window.navigator.plugins", "navigator.plugins")}}
+
Palauttaa selaimeen asennettujen lisäosien taulukon.
+
{{domxref("window.navigator.product", "navigator.product")}} {{non-standard_inline}}
+
Palauttaa nykyisen selaimen tuotenimen. (esim.: "Gecko")
+
{{domxref("window.navigator.productSub", "navigator.productSub")}} {{non-standard_inline}}
+
Palauttaa nykyisen selaimen rakennusnumeron (esim.: "20060909")
+
{{domxref("window.navigator.securitypolicy", "navigator.securitypolicy")}} {{non-standard_inline}}
+
Palauttaa tyhjän merkkijonon. Netscape 4.7x-selaimessa palauttaa merkkijonon "US & CA domestic policy" tai "Export policy".
+
{{domxref("window.navigator.standalone", "navigator.standalone")}} {{non-standard_inline}}
+
Palauttaa boolean-arvon, joka osoittaa, että suoritetaanko selainta erillistilassa. Käytettävissä vain Apple:n iOS Safari -selaimessa.
+
{{domxref("window.navigator.userAgent", "navigator.userAgent")}}
+
Palauttaa nykyisen selaimen user agent -merkkijonon.
+
{{domxref("window.navigator.vendor", "navigator.vendor")}} {{non-standard_inline}}
+
Palauttaa nykyisen selaimen toimittajanimen (esim.: "Netscape6")
+
{{domxref("window.navigator.vendorSub", "navigator.vendorSub")}} {{non-standard_inline}}
+
Palauttaa toimittajaversionumeron (esim.: "6.1")
+
navigator.webkitPointer {{non-standard_inline}}
+
Palauttaa PointerLock-objektin Mouse Lock API:a varten.
+
+ +

Metodit

+ +
+
{{domxref("window.navigator.javaEnabled", "navigator.javaEnabled")}}
+
Osoittaa, että onko tietokoneen selaimen Java käytössä vai ei.
+
{{domxref("window.navigator.mozIsLocallyAvailable", "navigator.mozIsLocallyAvailable")}} {{non-standard_inline}}
+
Sallii koodin tarkistaa verkkoa käyttämättä, että onko tietyssä URI-osoitteessa oleva asiakirja olemassa.
+
{{domxref("window.navigator.preference", "navigator.preference")}} {{obsolete_inline("2.0")}} {{non-standard_inline}}
+
Asettaa käyttäjäasetuksen. Tämä methodi on käytettävissä vain privileged-koodille ja on vanhentunut; sinun pitäisi käyttää sen sijasta XPCOM Preferences API:a.
+
{{domxref("window.navigator.registerContentHandler", "navigator.registerContentHandler")}}
+
Sallii webbisivuston rekisteröidä itsensä tietyn MIME-tyypin mahdollisena käsittelijänä.
+
{{domxref("navigator.registerProtocolHandler", "navigator.registerProtocolHandler")}}
+
Sallii webbisivuston rekisteröidä itsensä tietyn yhteyskäytännön mahdollisena käsittelijänä.
+
{{domxref("window.navigator.taintEnabled", "navigator.taintEnabled")}} {{deprecated_inline("1.7.8")}} {{obsolete_inline("9.0")}} {{non-standard_inline}}
+
Palauttaa arvon false. JavaScript taint/untaint -funktiot poistettu JavaScript 1.2:ssa.
+
{{domxref("window.navigator.vibrate", "navigator.vibrate()")}} {{gecko_minversion_inline("11.0")}}
+
Aiheuttaa värähtelyä laitteissa, jotka tukevat sitä. Ei tee mitään, jos värähtelytuki ei ole käytettävissä.
+
+ +

Spesifikaatio

+ + + +

Katso myös

+ + diff --git a/files/fi/fi/index.html b/files/fi/fi/index.html new file mode 100644 index 0000000000..853468da46 --- /dev/null +++ b/files/fi/fi/index.html @@ -0,0 +1,21 @@ +--- +title: Etusivu +slug: fi +tags: + - Kaikki_luokat +--- +
+ + + + + + +
+

Image:Firefoxlogo2.png

+

Firefox 2 kehittäjille

+

Firefox 2 on julkaistu, ja on ladattavissa. Katso Firefox 2 kehittäjille (osin suomennettu) saadaksesi lisätietoa

+
+

Categories Interwiki Language Links

+
+

 

diff --git a/files/fi/how_to_get_a_stacktrace_for_a_bug_report/index.html b/files/fi/how_to_get_a_stacktrace_for_a_bug_report/index.html new file mode 100644 index 0000000000..4816a85621 --- /dev/null +++ b/files/fi/how_to_get_a_stacktrace_for_a_bug_report/index.html @@ -0,0 +1,97 @@ +--- +title: Kuinka saadaan pinovedos vikailmoitusta varten +slug: How_to_get_a_stacktrace_for_a_bug_report +tags: + - Bugzilla +translation_of: Mozilla/How_to_get_a_stacktrace_for_a_bug_report +--- +

Jos lähetät Bugzillalla vikailmoituksen kaatumisesta, siihen tulisi myös liittää pinovedos (stacktrace, call stack). Pinovedos kertoo Mozillan kehittäjille, mikä kaatui ja tarjoaa lähtökohdan kaatumisen syyn selvittämiseksi. Tässä artikkelissa kuvataan, kuinka Mozillan kaatumisenilmoitusohjelmalla (Crash Reporter, Breakpad) hankitaan kaatumistunnus (Crash ID), jonka avulla kehittäjämme voivat hankkia pinovedoksen. Tässä artikkelissa kerrotaan myös vaihtoehtoisia tapoja pinovedoksen hankkimiseen, jos et pysty hankkimaan kaatumistunnusta.

+ +

Vaatimukset

+ +

Tarvitset binääripaketin Firefoxista Mozilla.org:sta. Myös SeaMonkey ja Thunderbird tukevat kaatumisilmoitusta.

+ +

Mozillan kaatumisilmoitusten palvelimella on nykyisellään virheenkorjaustietoja (debug information) ainoastaan Mozillan jakeluista ja siksi kaatumisilmoitus ei toimi, jos käytät esimerkiksi Linux-jakelun mukana tullutta versiota tai olet itse kääntänyt ohjelman lähdekoodista. Näissä tapauksissa on käytettävä yhtä alla luetelluista vaihtoehtoisista tavoista.

+ +
Huomaa: Kun täytät kaatumisilmoitusta, on tärkeää tietää, tapahtuuko kaatuminen myös Firefoxin vikasietotilassa. Tämä auttaa kehittäjiä päättelemään, aiheuttaako kaatumisen mahdollisesti jokin laajennus tai liitännäinen.
+ +

Kaatumistunnuksen hankkiminen Mozillan kaatumisilmoitusohjelmalla

+ + + + + + + + +
+

1. Lähetä kaatumisen jälkeen ilmoitus järjestelmäämme.

+ +

Mozillan kaatumisilmoitusohjelman ikkunan pitäisi ilmestyä automaattisesti, kun Firefox kaatuu. Jos sinulla on mitään lisätietoja kaatumisesta, kuten mitä olit tekemässä kun kaatuminen tapahtui, kirjoita nämä lisätietokenttään. Varmista, että valintaruutu "Lähetä Mozillalle kaatumisilmoitus, jotta ongelma voidaan korjata" on valittu ja napsauta uudelleenkäynnistys-painiketta. Kaatumisenilmoitusohjelman pitäisi nyt lähettää kaatumisilmoitus ja Firefoxin tulisi käynnistyä uudelleen.

+ +
"Lisätietoja"-painikketta napsauttamalla saat lisää informaatiota kaatumisesta. Nämä tietot eivät kuitenkaan ole hyödyllisiä vikailmoituksessa.
+ 		+

reporter.jpg

+
+ + + + + + + + +
+

2. Kerro meille lähettämäsi kaatumisilmoituksen kaatumistunnus (Crash ID).

+ +

Voit tarkastella kaikkia lähetettyjä ilmoituksia kirjoittamalla "about:crashes" Firefox osoitepalkkiin ja painamalla enter. Firefox avaa luettelon lähetetyistä kaatumisilmoituksista, jossa näkyy myös kaatumistunnus. Kopioi kaksi tai kolme kaatumisen ajankohtaan parhaiten sopivista kaatumistunnuksista ja liitä ne Bugzillan vikailmoitukseen. Tarkistathan, että ilmoituksen lähetysaika ajoittuu kaatumisen ajankohtaan, jottta et turhaan lähetä kaatumistunnuksia, joilla ei ole mitään tekemistä tämän kaatumisen kanssa.

+ +
Voit liittää kaatumistunnuksen alkuun "bp-", jolloin Bugzilla muodostaa tunnuksista linkit: bp-a70759c6-1295-4160-aa30-bc4772090918
+ 		+

crashlist.jpg

+
+ +

Kaatumistunnuksen hankkiminen jos Firefox kaatuu jo käynnistyksessä

+ +

Jos Firefox kaatuu jo käynnistyessään voit silti tarkastella lähetettyjä kaatumisilmoituksia. Kaatumisilmoituksia pääsee tarkastelemaan kaikilla Firefoxin profiileilla, joten jos uusi profiili ei kaada Firefoxia, voit tarkastella sen avulla kaatumisilmoituksia "about:crashes" -sivulla yllä kuvatulla tavalla.

+ +

Kaatumistunnuksen löytäminen Firefoxin ollessa suljettu

+ +

Jos et voi käynnistää Firefoxia ollenkaan, löydät kaatumisilmoitukset käyttöjärjestelmästäsi riippuen jostain seuraavista sijainneista:

+ +

Windows : %APPDATA%\Mozilla\Firefox\Crash Reports\submitted\
+ OS X : ~/Library/Application Support/Firefox/Crash Reports/submitted/
+ Linux : ~/.mozilla/firefox/Crash Reports/submitted/

+ +

Kansion jokainen tiedosto sisältää yhden lähetetyn kaatumisilmoituksen kaatumistunnuksen. Voit tarkastella tiedoston luonti- tai muokkausaikaa päätelläksesi, mitkä kaatumisilmoitukset liittyvät vikailmoitukseesi.

+ +

Vaihtoehtoisia tapoja pinovedoksen hankkimiseen

+ +

Jos Mozillan kaatumisenilmoitusohjelma ei ilmesty tai ei ole käytetävissä, on pinovedos hankittava käsin:

+ +

Windows

+ +

Pinovedoksen hankkimiseen löydät ohjeet artikkelista Create a stacktrace with Windbg.

+ +

Prosessin täydellisen tilannevedoksen hankkiminen kuvataan artikkelissa How to get a process dump with Windows Task Manager [en-US]

+ +

OS X

+ +

Suorita /Applications/Utilities/Console.app.  Laajenna "~/Library/Logs" ja "CrashReporter". Etsi sitten "firefox-bin" -lokeja.

+ +

Linux

+ +

Huomaa, että useimmissa distroissa pakkaus, jolle on löydettävä symbolit, on jotain sen tyyppistä kuin "xulrunner", ei "firefox".

+ +

Kaatumisilmoitustiedostot koneellasi

+ +

Kun kaatumisilmoitusohjelma (Breakpad) havaitsee kaatumisen, se ensin kirjoittaa kaatumisilmoitustiedostot (esim. .dump ja .extra -tiedostot) 'Crash Reports' -kansion alikansioon 'pending'.

+ +

Jos Breakpad onnistuu lähettämään kaatumisilmoituksen palvelimelle, oletusarvoisesti 'pending' kansiossa olevat kaatumiseen liittyvät tiedostot poistetaan ja 'submitted' kansioon lisätään tekstitiedosto (.txt), joka sisältää kaatumistunnuksen, jolla palvelin tallensi kaatumisilmoituksen. Jos haluat, että Breakpad jättää .dump ja .extra -tiedostot koneellesi, jotta voit tarkastella niitä paikallisesti, aseta ympäristömuuttuja MOZ_CRASHREPORTER_NO_DELETE_DUMP arvoon 1.

+ + diff --git a/files/fi/html/canvas/index.html b/files/fi/html/canvas/index.html new file mode 100644 index 0000000000..bbef096b3d --- /dev/null +++ b/files/fi/html/canvas/index.html @@ -0,0 +1,73 @@ +--- +title: Canvas +slug: HTML/Canvas +translation_of: Web/API/Canvas_API +--- +

HTML5:een lisätty HTML {{HTMLElement("canvas")}}-elementti on elementti, jota voidaan käyttää grafiikan piirtämiseen skriptaamalla (tavallisesti JavaScript-kielellä). Sitä voidaan käyttää esimerkiksi diagrammojen piirtämiseen, valokuvayhdistelmien tekemiseen, animaatioiden luomiseen ja jopa ajantasaiseen video-käsittelyyn.

+

Mozilla-sovellukset saivat <canvas>-tuen Gecko 1.8-versiosta alkaen (toisin sanoen Firefox 1.5:stä lähtien). Elementin esitteli alunperin Apple OS X-käyttöjärjestelmä Dashboard- ja Safari-sovelluksissa. Internet Explorer tukee <canvas>:ia versiosta 9 lähtien; IE-selaimen aiemmissa versioissa webbisivulle voidaan tehokkaasti lisätä <canvas>-tuki Googlen Explorer Canvas-hankkeen skriptillä. Google Chrome ja Opera 9 tukevat myös <canvas>:ia.

+

WebGL käyttää myös <canvas>-elementtiä 3D-grafiikan laitteistokiihdytykseen webbisivuilla.

+
+
+

Dokumentaatio

+
+
+ Spesifikaatio
+
+ Elementti <canvas> on osa WhatWG Web applications 1.0 -spesifikaatiota, joka tunnetaan myös nimellä HTML5.
+
+ Canvas-oppikurssi
+
+ Laaja oppikurssi, joka kattaa sekä <canvas>-peruskäytön että sen edistyneemmät ominaisuudet.
+
+ Koodikatkelma:Canvas
+
+ Joitakin <canvas>:iin liittyviä koodikatkelmia.
+
+ Canvas-esimerkkejä
+
+ Muutama <canvas>-esittelyohjelma.
+
+ DOM-objektien piirtäminen canvas-elementtiin
+
+ Kuinka piirtää canvas-komponenttiin DOM-sisältö, kuten HTML-elementit.
+
+ Perussädeheittäjä
+
+ Canvasia käyttävä sädejäljitysanimaation esittelyohjelma.
+
+ Canvas DOM -rajapinnat
+
+ Canvas DOM -rajapinnat Gecko-alustalla.
+
+

Katso kaikkia...

+
+
+

Yhteisö

+ +

Resurssit

+ +

Kirjastot

+
    +
  • libCanvas on tehokas ja kevyt canvas-ympäristö
    • +
  • Processing.js on toiseen käyttöympäristöön siirretty Prosessin visualisointikieli
    • +
  • EaselJS on kirjasto, jossa on Flash-tyyppinen sovellusohjelmointirajapinta (API)
    • +
  • PlotKit on taulukko- ja grafiikkakirjasto
    • +
  • Rekapi on avainkehys-animaatioympäristön sovellusohjelmointirajapinta Canvasille
    • +
  • PhiloGL on WebGL-ympäristö datan visualisointiin, luovaan koodaukseen ja pelikehitykseen.
    • +
  • JavaScript InfoVis Toolkit luo vuorovaikutteisia 2D Canvas -datavisualisointeja webbiin.
    • +
  • Frame-Engine on sovellusten ja pelin kehitysympäristö
    • +
+ + +
+
+
+ {{HTML5ArticleTOC()}}
diff --git a/files/fi/html/index.html b/files/fi/html/index.html new file mode 100644 index 0000000000..dd02719a98 --- /dev/null +++ b/files/fi/html/index.html @@ -0,0 +1,84 @@ +--- +title: HTML +slug: HTML +tags: + - HTML + - NeedsTranslation + - References + - TopicStub +translation_of: Web/HTML +--- +
+
+ HTML5 Demos
+

A collection of demos showing the latest HTML technologies in action.

+

The logo of HTML

+
+

HyperText Markup Language (HTML) is the language used to create web pages and other types of documents viewable in a browser. More precisely, HTML is the language that describes the structure and the semantic of a document. The content is tagged with HTML elements like <img>, <title>, <p>, <div>, …

+

HTML is an international standard whose specifications are maintained by the World Wide Web Consortium and the WHATWG.

+

HTML is considered a living standard and is technically under continuous development. That always-current version of the HTML specification is referred to as HTML5.

+
+
+

Documentation about HTML

+
+
+ Introduction to HTML
+
+ This page provides basic information on syntax and semantics of an HTML page (document). This will provide basic information required to develop HTML documents.
+
+ HTML element reference
+
+ Get details about each element supported by different browsers.
+
+ HTML attributes list
+
+ See all attributes and what elements they are associated with.
+
+ HTML5
+
+ Learn about the new HTML5 APIs and elements along with their support.
+
+ HTML Forms Guide
+
+ HTML forms are a complex part of HTML. This guide will help you mastering them, from structure to styling, from browser support to custom controls.
+
+ Bad copy-pasting habits
+
+ Web technologies are very often learned by viewing sources of other pages and copy-pasting. However, this often means that bad habits perpetuate. This page lists some of these bad patterns and show you can achieve their goal the right way.
+
+ Drawing Graphics with Canvas
+
+ A new HTML element for programmable graphics. <canvas> can be used for rendering graphs, UI elements, and other custom graphics on the client.
+
+ Tips for Authoring Fast-loading HTML Pages
+
+ An optimized web page not only provides for a more responsive site for your visitors, but also reduces the load on your web servers and internet connection.
+
+

View All...

+
+
+

Getting help from the community

+

You need help on a HTML-related problem and can't find the solution in the documentation?

+
    +
  • Consult the dedicated Mozilla forum : {{DiscussionList("dev-tech-html", "mozilla.dev.tech.html")}}
    • +
  • Go to Stack Overflow, a collaboratively built and maintained Q&A site and look if you can find the answer to your quetion. If not you will be able to ask your question there.
    • +
+

Don't forget about the netiquette...

+

Tools easing HTML development

+ +

View All...

+ + +
+
+

 

diff --git a/files/fi/learn/index.html b/files/fi/learn/index.html new file mode 100644 index 0000000000..151d18edcc --- /dev/null +++ b/files/fi/learn/index.html @@ -0,0 +1,122 @@ +--- +title: Learn web development +slug: Learn +tags: + - Beginner + - Index + - Landing + - Learn + - NeedsTranslation + - TopicStub + - Web +translation_of: Learn +--- +

{{LearnSidebar}}

+ +

Welcome to the MDN learning area. This set of articles aims to provide complete beginners to web development with all that they need to start coding simple websites.

+ +

The aim of this area of MDN is not to take you from "beginner" to "expert" but to take you from "beginner" to "comfortable". From there you should be able to start making your own way, learning from the rest of MDN and other intermediate to advanced resources that assume a lot of previous knowledge.

+ +

If you are a complete beginner, web development can be challenging — we will hold your hand and provide enough detail for you to feel comfortable and learn the topics properly. You should feel at home whether you are a student learning web development (on your own or as part of a class), a teacher looking for class materials, a hobbyist, or someone who just wants to understand more about how web technologies work.

+ +
+

Important: The content in the learning area is being added to regularly. If you have questions regarding topics you'd like to see covered or feel are missing, see the {{anch("Contact us")}} section below for information on how to get in touch.

+
+ +

Where to start

+ + + +
+

Note: Our glossary provides terminology definitions.

+
+ +

{{LearnBox({"title":"Random glossary entry"})}}

+ +

Topics covered

+ +

The following is a list of all the topics we cover in the MDN learning area.

+ +
+
Getting started with the web
+
Provides a practical introduction to web development for complete beginners.
+
HTML — Structuring the web
+
HTML is the language that we use to structure the different parts of our content and define what their meaning or purpose is. This topic teaches HTML in detail.
+
CSS — Styling the web
+
CSS is the language that we can use to style and lay out our web content, as well as adding behavior like animation. This topic provides comprehensive coverage of CSS.
+
JavaScript — Dynamic client-side scripting
+
JavaScript is the scripting language used to add dynamic functionality to web pages. This topic teaches all the essentials needed to become comfortable with writing and understanding JavaScript.
+
Accessibility — make the web usable by everyone
+
Accessibility is the practice of making web content available to as many people as possible regardless of disability, device, locale, or other differentiating factors. This topic gives you all you need to know.
+
Web Performance — making websites fast and responsive
+
Web performance is the art of making sure web applications download fast and are responsive to user interaction, regardless of a users bandwidth, screen size, network, or device capabilities.
+
Tools and testing
+
This topic covers the tools developers use to facilitate their work, such as cross browser testing tools.
+
Server-side website programming
+
Even if you are concentrating on client-side web development, it is still useful to know how servers and server-side code features work. This topic provides a general introduction to how the server-side works, and detailed tutorials showing how to build up a server-side app using two popular frameworks — Django (Python) and Express (node.js).
+
+ +

Getting our code examples

+ +

The code examples you'll encounter in the Learning Area are all available on GitHub. If you want to copy them all to your computer, the easiest way is to download a ZIP of the latest master code branch.

+ +

If you'd rather copy the repo in a more flexible way that allows for automatic updates, you can follow the more complex instructions:

+ +
    +
  1. Install Git on your machine. This is the underlying version control system software that GitHub works on top of.
    2. +
  2. Sign up for a GitHub account.
    3. +
  3. Once you've signed up, log in to github.com with your username and password.
    4. +
  4. Open your computer's command prompt (Windows) or terminal (Linux, macOS)
    5. +
  5. To copy the learning area repo to a folder called learning-area in the current location your command prompt/terminal is pointing to, use the following command: + 
    git clone https://github.com/mdn/learning-area
    +
    6. +
  6. You can now enter the directory and find the files you are after (either using your finder/file explorer or the cd command).
    7. +
+ +

You can update the learning-area repository with any changes made to the master version on GitHub with the following steps:

+ +
    +
  1. In your command prompt/terminal, go inside the learning-area directory using cd. For example, if you were in the parent directory: + + 
    cd learning-area
    +
    2. +
  2. Update the repository using the following command: + 
    git pull
    +
    3. +
+ +

Contact us

+ +

If you want to get in touch with us about anything, the best way is to drop us a message on our learning area discourse thread or IRC channels. We'd like to hear from you about anything you think is wrong or missing on the site, requests for new learning topics, requests for help with items you don't understand, or any other questions or concerns.

+ +

If you're interested in helping develop/improve the content, take a look at how you can help, and get in touch! We are more than happy to talk to you, whether you are a learner, teacher, experienced web developer, or someone else interested in helping to improve the learning experience.

+ +

See also

+ +
+
Mozilla developer newsletter
+
Our newsletter for web developers, which is a great resource for all levels of experience.
+
Web demystified
+
A great series of videos explaining web fundamentals, aimed at complete beginners to web development. Created by Jérémie Patonnier.
+
Codecademy
+
A great interactive site for learning programming languages from scratch.
+
BitDegree
+
Basic coding theory with a gamified learning process. Mainly focused on beginners.
+
Code.org
+
Basic coding theory and practice, mainly aimed at children/complete beginners.
+
EXLskills
+
Free and open courses for learning tech skills, with mentorship and project-based learning
+
freeCodeCamp.org
+
Interactive site with tutorials and projects to learn web development.
+
Web literacy map
+
A framework for entry-level web literacy & 21st Century skills, which also provides access to teaching activities sorted by category.
+
Teaching activities
+
A series of teaching activities for teaching (and learning) created by the Mozilla Foundation, covering everything from basic web literacy and privacy to JavaScript and hacking Minecraft.
+
Edabit
+
Hundreds of free interactive coding challenges in various languages.
+
diff --git a/files/fi/learn/javascript/ensimmaiset_askeleet/index.html b/files/fi/learn/javascript/ensimmaiset_askeleet/index.html new file mode 100644 index 0000000000..44a95ed91f --- /dev/null +++ b/files/fi/learn/javascript/ensimmaiset_askeleet/index.html @@ -0,0 +1,54 @@ +--- +title: JavaScript ensimmäiset askeleet +slug: Learn/JavaScript/Ensimmaiset_askeleet +translation_of: Learn/JavaScript/First_steps +--- +
{{LearnSidebar}}
+ +

Meidän ensimmäisessä JavaScript moduulissa vastaamme muutamiin perus-kysymyksiin, kuten "mitä JavaScript on?", "miltä se näyttää?", ja "mitä se voi tehdä?", ennen kuin saat ensimmäisen käytännön kokemuksen JavaScriptin kirjoittamisesta. Tämän jälkeen me pohdimme joitakin keskeisiä rakennuspalkioita yksityiskohtaisesti, kuten muuttujat, merkkijonot, numerot ja taulukot.

+ +

Edellytykset

+ +

Ennen tämän moduulin aloittamista sinulla ei tarvitse olla yhtään aikasempaa kokemusta JavaScriptistä, mutta sinun tulisi olla perehetynyt jonkin verran HTML:ään ja CSS:ään. Suosittelemme, että käyt läpi seuraavat moduulite ennen kuin aloitat JavaScriptin:

+ + + +

 

+ +
+

Huomio: Jos työskentelet tietokoneella/tabletilla/muulla laitteella, missä et voi luoda omia tiedostoja, sinä voit kokeilla (useimpia) koodi esimerkkejä online-koodausohjelmilla kuten  JSBin tai Thimble.

+
+ +

Oppaat

+ +
+
Mitä JavaScript on?
+
Tervetuloa MDN:n aloittelijoiden JavaScript kurssille! Ensimmäisessä artikkelissa katsomme JavaScriptiä korkealta tasolta, vastaten kysymyksiin kuten "mikä se on?" ja "mitä se tekee?", ja varmistamme että olet tyytyväinen JavaScriptin tarkoitukseen.such problems by providing
+
Ensimmäinen sukellus JavaScriptiin
+
Nyt olet oppinut jotain JavaScriptin teoriasta, ja mitä voit tehdä sillä. Aiomme antaa sinulle tehokurssin JavaScriptin perusominaisuuksista täysin käytännönläheisen oppaan kautta. Täällä sinä tulet rakentamaan yksinkeraisen "Arvaa numero" pelin, askel askeleelta.
+
Mitä meni väärin? JavaScriptin vianmääritys
+
Kun rakensit "Arvaa numero" pelin edellisessä artikkelissa, saatoit huomata ettei se toiminut. Ole huoleti — tämän artikkelin tavoitteena on säästää sinut hiusten repimiseltä tällaisissa ongelmissa tarjoamalla muutamia neuvoja kuinka löytää ja korjata virhee JavaScript ohjelmassa.
+
Tallennetaan tarvitsemasi tiedot — muuttujat
+
Kun olet lukenut pari edellistä artikkelia, sinun pitäisi tietää mitä JavaScript on, mitä se voi tehdä sinulle, kuinka käyttää sitä muiden web-tekniikoiden rinnalla, ja mitkä on se n pää ominaisuudet katsottuna korkealta tasolta. Tässä artikkelissa menemme alas todellisiin perusteisiin, katsotaan kuinka työskennellään kaikkein yksinkertaisimpien JavaScriptin rakennuspalikoiden kanssa — Muuttujat.
+
Perus matematikkaa JavaScriptillä — numerot ja operaattorit
+
Tässä vaiheessa kurssia pohdimme matematikkaa JavaScriptissä — kuinka voimme yhdistää operaattoreita ja muita ominaisuuksia onnistuaksemme manipuloimaan numeroita komonnoissamme.
+
Tekstin käsittely — merkkijonot JavaScriptssä
+
Seuraavaksi käännämme huomiomme merkkijonoihin — tällä nimellä tekstin pätkiä kutsutaan ohjelmoinnissa. In this article we'll look at all the common things that you really ought to know about strings when learning JavaScript, such as creating strings, escaping quotes in string, and joining them together.
+
Hyödyllisiä merkkijono metodeja
+
Now we've looked at the very basics of strings, let's move up a gear and start thinking about what useful operations we can do on strings with built-in methods, such as finding the length of a text string, joining and splitting strings, substituting one character in a string for another, and more.
+
Taulukot
+
In the final article of this module, we'll look at arrays — a neat way of storing a list of data items under a single variable name. Here we look at why this is useful, then explore how to create an array, retrieve, add, and remove items stored in an array, and more besides.
+
+ +

Arviointi

+ +

The following assessment will test your understanding of the JavaScript basics covered in the guides above.

+ +
+
Typerä tarina generaattori
+
In this assessment you'll be tasked with taking some of the knowledge you've picked up in this module's articles and applying it to creating a fun app that generates random silly stories. Have fun!
+
diff --git a/files/fi/learn/javascript/index.html b/files/fi/learn/javascript/index.html new file mode 100644 index 0000000000..bb376953cd --- /dev/null +++ b/files/fi/learn/javascript/index.html @@ -0,0 +1,53 @@ +--- +title: JavaScript +slug: Learn/JavaScript +translation_of: Learn/JavaScript +--- +
{{LearnSidebar}}
+ +

{{Glossary("JavaScript")}} on ohjelmointikieli, joka mahdollistaa monimutkaisten asioiden toteuttamisen web-sivuille — web-sivut tekevät aina enemmän, kuin vain ovat siellä ja näyttävät muutumatonta sisältöä katsottavaksesi — näyttävät ajankohtaisia sisältöpäivityksiä, vuorovaikutteisia karttoja, animoituja 2D/3D grafiikoita tai vierittävät video jukebokseja, jne, — voit lyödä vetoa, että JavaScript on todennäköisesti osallisena tähän.

+ +

Oppimispolku

+ +

JavaScript on luultavasti vaikeampi oppia, kuin siihen liittyvät tekniikat, kuten HTML ja CSS. Ennen kuin yrität opetella JavaScriptiä, sinun kannattaa ehdottomasti ensin tutustua ainakin näihin kahteen teknikkaan, ja ehkä muihinkin. Aloita seuraavista moduuleista:

+ + + +

Aiempi kokemus muista ohjelmointikielistä voi myös auttaa.

+ +

JavaScriptin perusteiden tultua tutuiksi, sinun pitäisi olla kykeneväinen oppimaan lisää edistyneemmistä aiheista, esimerkiksi:

+ + + +

Moduulit

+ +

Tämä aihe sisältää seuraavat moduulit, ehdotetussa opiskelujärjestyksessä.

+ +
+
JavaScript ensimmäiset askeleet
+
Ensimmäisessä JavaScript-moduulissamme, vastaamme ensiksi joihinkin peruskysymyksiin, kuten “Mikä on JavaScript”, “Miltä se näyttää?” ja “Mitä se voi tehdä?”, ennen kuin annamme sinulle ensimmäisen käytännön kokemuksen JavaScriptin kirjoittamisesta. Tämän jälkeen me käsittelemme joitakin keskeisiä JavaScriptin ominaisuuksia yksityiskohtaisesti, kuten muuttujat, merkkijonot, luvut ja taulukot.
+
JavaScriptin rakenneosat
+
+

Tässä moduulissa jatkamme kattavaa JavaScriptin keskeisten perusominaisuuksien läpikäyntiä, kääntäen huomiomme yleisimmin käytettyihin koodilohkojen tyyppeihin, kuten ehtolauseet, silmukat, funktiot ja tapahtumat. Olet nähnyt nämä jutut jo tällä kurssilla, mutta vain ohimennen - tässä käsitellään erityisesti niitä.

+
+
Esittelyssä JavaScript objektit
+
JavaScriptissä useimmat keskeiset ominaisuudet ovat objekteja, merkkijonoista ja taulukoista JavaScriptin päälle rakennettuihin selain API:hin. Voit jopa tehdä omia olioita yhdistämään toisiinsa liittyvät funktiot ja muuttujat tehokkaaksi paketiksi. Sinun on tärkeää ymmärtää JavaScriptin oliopohjainen luonne, jos haluat viedä eteenpäin tietämystäsi kielestä ja kirjoittaa tehokasta koodia, siksi olemme tehneet tämän moduulin, auttamaan sinua. Täällä opetamme olioiden teoriaa ja syntaksia yksityiskohtaisesti, katsomme kuinka luoda oma olio ja selitämme mitä JSON-tieto on ja kuinka työskennellä sen kanssa.
+
Asiakas-puolen web API:t
+
Kun kirjoitetaan asiakas-puolen JavaScriptiä web-sivuille tai sovelluksiin, et mene kovin pitkälle, ennen kuin aloitat käyttämään API:ja - rajapintoja selaimen ja käyttöjärjestelmään eri osioiden käsittelemiseen sivuston ollessa käynnissä, tai jopa toiselta web-sivulta tai palvelusta tulevan tiedon käsittelemiseen. Tässä moduulissa tutkimme mitä API:t ovat ja kuinka käyttää joitakin yleisimpiä API:ja, joihin tulet törmäämään usein kehitystyössä.
+
+ +

Katso myös

+ +
+
MDN JavaScript
+
Tärkein tuloportti MDN:n JavaScript-dokumentaation ytimeen - täältä löydät laajat referenssiasiakirjat kaikkiin JavaScript-kielen osiin, ja joitakin edistyneitä tutoriaaleja, jotka on suunnattu kokeneille JavaScriptareille.
+
Koodauksen matematiikka
+
Erinomainen videotutoriaalien sarja oppia matematiikkaa, jota sinun tulee ymmärtää, ollaksesi tehokas ohjelmoija, tehnyt Keith Peters.
+
diff --git a/files/fi/mozilla/add-ons/index.html b/files/fi/mozilla/add-ons/index.html new file mode 100644 index 0000000000..45157d094f --- /dev/null +++ b/files/fi/mozilla/add-ons/index.html @@ -0,0 +1,83 @@ +--- +title: Add-ons +slug: Mozilla/Add-ons +tags: + - Add-ons + - Extension + - Extensions + - Landing + - Mozilla + - NeedsTranslation + - TopicStub +translation_of: Mozilla/Add-ons +--- +

{{AddonSidebarMain}}

+ +

Add-ons allow developers to extend and modify the functionality of Firefox. They are written using standard Web technologies - JavaScript, HTML, and CSS - plus some dedicated JavaScript APIs.

+ +

Among other things, an add-on could:

+ + + +

There are several types of add-ons, but the most common type are extensions.

+ +

Developing extensions

+ +

In the past, there were several toolsets for developing Firefox extensions, but as of November 2017, extensions must be built using WebExtensions APIs. Other toolsets, such as overlay add-ons, bootstrapped add-ons, and the Add-on SDK, are no longer supported.

+ +

Extensions written using WebExtensions APIs for Firefox are designed to be cross-browser compatible. In most cases, it will run in Chrome, Edge, and Opera with few if any changes. They are also fully compatible with multiprocess Firefox. You can see the APIs currently supported in Firefox and other browsers.

+ +

Extension Workshop

+ +

The Firefox Extension Workshop can help you develop extensions for Firefox and give your users simple, yet powerful ways to customize their browsing experience. You’ll find:

+ + + +

Extensions for Firefox for Android

+ +

In 2020, Mozilla will release a new Firefox for Android experience. This new, high-performance browser for Android has been rebuilt from the ground up using GeckoView, Mozilla’s mobile browser engine. We are currently building support for the WebExtensions API on GeckoView.

+ +

Migrate an existing extension

+ +

If you maintain a legacy extension, such as an XUL overlay, bootstrapped, or Add-on SDK-based extension, you can still port it to use WebExtension APIs.  There are some porting resources on Firefox Extension Workshop, our site for Firefox-specific development resources.

+ +

For more information about transition support, please visit our wiki page.

+ +

Publishing add-ons

+ +

Addons.mozilla.org, commonly known as "AMO," is Mozilla's official site for developers to list add-ons, and for users to discover them. By uploading your add-on to AMO, you can participate in our community of users and creators and find an audience for your add-on.

+ +

You are not required to list your add-on on AMO, but your add-on must be signed by Mozilla else users will not be able to install it.

+ +

For an overview for the process of publishing your add-on see Signing and distributing your add-on.

+ +

Other types of add-ons

+ +

In addition to extensions, there are a few other add-on types that allow users to customize Firefox. Those add-ons include:

+ + + +

Contact us

+ +

Check out the contact us page for details on how to get help, keep up to date with add-ons news, and give us feedback.

+ +
diff --git a/files/fi/mozilla/add-ons/webextensions/index.html b/files/fi/mozilla/add-ons/webextensions/index.html new file mode 100644 index 0000000000..a6444fc083 --- /dev/null +++ b/files/fi/mozilla/add-ons/webextensions/index.html @@ -0,0 +1,85 @@ +--- +title: Browser Extensions +slug: Mozilla/Add-ons/WebExtensions +tags: + - Add-ons + - Landing + - NeedsTranslation + - TopicStub + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions +--- +
{{AddonSidebar}}
+ +

Extensions, or add-ons, can modify and enhance the capability of a browser. Extensions for Firefox are built using the WebExtensions API cross-browser technology.

+ +

The technology for extensions in Firefox is, to a large extent, compatible with the extension API supported by Chromium-based browsers (such as Google Chrome, Microsoft Edge, Opera, Vivaldi). In most cases, extensions written for Chromium-based browsers run in Firefox with just a few changes.

+ +
+ + +

If you have ideas or questions or need help, you can reach us on the dev-addons mailing list or in the Add-ons Room on Matrix.

+ +
+
+

Get started

+ +

Discover what extensions can do before building your first extension. Learn about the anatomy of an extension and get an overview of the extension development and publication workflow, Firefox style. Explore a little deeper with a comprehensive selection of example extensions that you can run right in Firefox.

+ +

Concepts

+ +

Get detailed information on the concept that underpin extensions from an overview of the JavaScript API, through content scripts, match patterns, working with files, internationalization, and content security policy, to more advanced subjects such as native messaging, using the devtools APIs, and native manifests.

+ +

User interface

+ +

Discover all the user interface components you can use in your extensions, with coding examples and tips.

+ +

How to

+ +

From patterns you’ll regularly use such as work with the Tabs API and adding a button to the toolbar to more advanced topics such as intercepting HTTP requests and working with contextual identities, you’ll find a range of tutorials to get you started.

+ +
    +
+ +

Firefox workflow

+ +

When you are ready to create your extension for Firefox or port your Chrome extension head over to Extension Workshop. It has details on:

+ + +
+ +
+

Reference

+ +

JavaScript APIs

+ +

Get comprehensive details about the methods, properties, types, and events for all the JavaScript APIs. There is also detailed information about the compatibility of each API with the major browsers. Most reference pages also include coding examples and links to the extension examples that use the API.

+ +

Manifest keys

+ +

Get full details about the manifest keys, including all their properties and settings. There’s also detailed information on the compatibility of each key with the major browsers.

+
+
+ + +
diff --git a/files/fi/mozilla/add-ons/webextensions/what_are_webextensions/index.html b/files/fi/mozilla/add-ons/webextensions/what_are_webextensions/index.html new file mode 100644 index 0000000000..8a1eddb4b3 --- /dev/null +++ b/files/fi/mozilla/add-ons/webextensions/what_are_webextensions/index.html @@ -0,0 +1,60 @@ +--- +title: What are extensions? +slug: Mozilla/Add-ons/WebExtensions/What_are_WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/What_are_WebExtensions +--- +
{{AddonSidebar}}
+ +
+

Jos olet jo perehtynyt selainlaajennusten peruskäsitteisiin, ohita tämä osa nähdäksesi, kuinka laajennustiedostot kootaan . Käytä sitten lähdeteos alkaa rakentaa laajennus. Käy Firefox Extension Workshopissa saadaksesi lisätietoja Firefoxin testauksen, julkaisemisen ja laajennusten työnkulusta.

+
+ +

Laajennus lisää ominaisuuksia ja toimintoja selaimeen. Se on luotu käyttämällä tuttuja verkkopohjaisia ​​tekniikoita - HTML, CSS ja JavaScript. Se voi hyödyntää samoja web-sovellusliittymiä kuin verkkosivun JavaScript, mutta laajennuksella on myös pääsy omiin JavaScript-sovellusliittymiensä sarjoihin. Tämä tarkoittaa, että voit tehdä paljon enemmän laajennuksessa kuin koodilla verkkosivulla. Tässä on vain muutama esimerkki asioista, joita voit tehdä:

+ +

Paranna tai täydennä verkkosivustoa : Käytä lisäosaa toimittaa lisää selaimen sisäisiä ominaisuuksia tai tietoja verkkosivustoltasi. Anna käyttäjien kerätä tietoja vierailemiltasi sivuilta parantamaan tarjoamaasi palvelua.

+ +

+ +

Esimerkkejä: Amazon Assistant Firefoxille , OneNote Web Clipper ja Grammarly Firefoxille

+ +

Anna käyttäjien näyttää persoonallisuutensa : Selainlaajennukset voivat manipuloida verkkosivujen sisältöä; esimerkiksi antaa käyttäjien lisätä suosikkilogonsa tai -kuvansa taustaksi jokaiselle vierailemalleen sivulle. Laajennusten avulla käyttäjät voivat myös päivittää Firefox-käyttöliittymän ulkoasun samalla tavalla kuin erilliset teeman lisäosat  .

+ +

+ +

Esimerkkejä: MyWeb New Tab , Tabliss ja VivaldiFox

+ +

Lisää tai poista sisältöä verkkosivuilta : Voit auttaa käyttäjiä estämään häiritseviä mainoksia verkkosivuilta, tarjoamaan pääsyn matkaoppaaseen aina, kun maa tai kaupunki mainitaan verkkosivulla, tai alustamaan sivun sisältö uudelleen yhtenäisen lukukokemuksen tarjoamiseksi. Kyky käyttää ja päivittää sekä sivun HTML: ää että CSS: ää laajennusten avulla käyttäjät voivat nähdä verkon haluamallaan tavalla.

+ +

+ +

Esimerkkejä: uBlock Origin , Reader ja Toolbox for Google Play Store ™

+ +

Lisää työkaluja ja uusia selausominaisuuksia: Lisää uusia ominaisuuksia tehtäväpalkkiin tai luo QR-koodikuvia URL-osoitteista, hyperlinkeistä tai sivutekstistä. Joustavien käyttöliittymäasetusten ja WebExtensions-sovellusliittymien tehon avulla voit helposti lisätä uusia ominaisuuksia selaimeen. Ja voit parantaa melkein minkä tahansa verkkosivuston ominaisuuksia tai toimintoja, sen ei tarvitse olla verkkosivustosi.

+ +

+ +

Esimerkkejä: Trello- ja tomaattikellon uimarannat

+ +

Pelit : Tarjoa perinteisiä tietokonepelejä offline-pelitoiminnoilla tai tutustu uusiin pelimahdollisuuksiin; esimerkiksi sisällyttämällä pelattavuus jokapäiväiseen selaamiseen.

+ +

 

+ +

Esimerkkejä: Asteroidit ponnahdusikkunassa , pasianssin korttipeli Uusi välilehti ja 2048 Prime .

+ +

Lisää kehitystyökaluja : Voit tarjota verkkokehitystyökaluja yrityksesiä tai kehittää hyödyllisen tekniikan tai lähestymistavan verkkokehitykseen, jonka haluat jakaa. Joko niin, voit parantaa sisäänrakennettuja Firefox-kehittäjätyökaluja lisäämällä uuden välilehden kehittäjän työkalupalkkiin.

+ +

+ +

Esimerkkejä: Web Developer , Web React Developer Tools ja ax Developer Tools

+ +

Firefoxin laajennukset rakennetaan WebExtensions API: illa , joka on selainten välinen järjestelmä laajennusten kehittämiseksi. Suurelta osin sovellusliittymä on yhteensopiva laajennussovellusliittymän kanssa, jota Google Chrome ja Opera tukevat. Näille selaimille kirjoitetut laajennukset toimivat useimmissa tapauksissa Firefoxissa tai Microsoft Edgessä vain muutamalla muutoksella . API on myös täysin yhteensopiva moniprosessisen Firefoxin kanssa .

+ +

Jos sinulla on ideoita tai kysyttävää tai tarvitset apua vaeltavien legacy lisäosa WebExtensions API , pääsette on dev-lisät postituslistalle tai lisäosat huoneen päälle Matrix .

+ +

Mitä seuraavaksi?

+ + diff --git a/files/fi/mozilla/command_line_options/index.html b/files/fi/mozilla/command_line_options/index.html new file mode 100644 index 0000000000..a9aa17a467 --- /dev/null +++ b/files/fi/mozilla/command_line_options/index.html @@ -0,0 +1,269 @@ +--- +title: Komentorivivalitsimet +slug: Mozilla/Command_Line_Options +tags: + - Komentorivi + - Kysymykset ja vastaukset + - Käyttäjän dokumentit + - Laajennukset + - Lisäosat + - Mozillan kehittäminen + - Tarvitsee päivitystä + - XULRunner + - Ylläpito +translation_of: Mozilla/Command_Line_Options +--- +

Komentorivivalitsimia käytetään Mozillan sovelluksissa määrittämään erilaisia käynnistysvaihtoehtoja. Voit esimerkiksi käyttää komentorivivalitsimia ohittamaan Profiilinhallinnan ja avata tietyn profiilin, jos käytössä on useita profiileja. Voit myös määrittää, kuinka Mozillan sovellukset käynnistyvät, mitä komponentteja avataan ja mitä komponentit tekevät, kun ne avautuvat. Tällä sivulla kuvaillaan yleisesti käytetyt komentorivivalitsimet sekä niiden käyttäminen.

+

Syntaksi

+

Kerrotaan alkuun säännöt, jotka koskevat kaikkia komentorivivalitsimia.

+ +

Komentorivivalitsimien käyttäminen

+

Komentorivivalitsimet syötetään sovelluksen käynnistävän komennon jälkeen. Joillakin valitsimilla on argumentteja. Argumentit syötetään komentorivivalitsimen jälkeen. Joillakin valitsimilla on myös lyhenteitä. Esimerkiksi komentorivivalitsin "-editor" voidaan lyhentää "-edit". Kun lyhenteitä on käytettävissä, ne mainitaan tässä tekstissä. Joissakin tapauksissa valitsimen argumentit on suljettava lainausmerkkeihin, jolloin tämä mainitaan valitsimen kuvauksessa. Myös useampia komentorivivalitsimia voidaan käyttää. Yleisesti valitsimien syntaksi on seuraava:

+
sovellus -valitsin -valitsin "argumentti" -valitsin argumentti
+
+

Esimerkkejä

+

Seuraava esimerkki näyttää, kuinka "-ProfileManager" valitsinta käytetään avaamaan Profiilin Hallinta ennen Firefoxin käynnistämistä:

+

Windows

+

Valitse Windowsin Käynnistä-valikosta Suorita. Kirjoita:

+
firefox -ProfileManager
+
+

Mac OS X

+

Avaa Ohjelmat > Lisäohjelmat. Avaa Pääte ja kirjoita:

+
cd /Applications/Firefox.app/Contents/MacOS
+./firefox -ProfileManager
+
+

Linux

+

Avaa Terminal (Pääte) ja kirjoita:

+
cd Thunderbird_ohjelma_hakemisto
+./thunderbird -ProfileManager
+
+

Yllä oleva esimerkki liittää "-ProfileManager" -valitsimen Mozillan Thunderbird-sähköpostiohjelmaan.

+

Käyttäjäprofiili

+

-CreateProfile profiilin_nimi

+

Luo uuden profiilin, jonka nimi on profiilin_nimi, mutta ei käynnistä itse sovellusta. profiilin_nimi ei saa sisältää välilyöntejä ( ).

+
firefox -CreateProfile SeppoSurfaaja
+
+

-CreateProfile "profiilin_nimi profiilin_kansio"

+

Luo uuden profiilin_nimi -nimisen profiilin kansioon profiilin_kansio, mutta ei käynnistä itse sovellusta. Huomaa, että profiilin_nimi ja profiilin_kansio on suljettu lainausmerkkeihin.

+

HUOMAA: profiilin_kansio ei saa olla olemassa oleva kansio eikä ennestään saa olla olemassa profiilia profiilin_nimi.

+
firefox -CreateProfile "SeppoSurfaaja c:\internet\moz-profile"
+
+

-ProfileManager

+

Käynnistä Profiilin Hallinta. Lyhyt muoto: -P ilman profiilin nimeä.

+

-P "profiilin_nimi"

+

Ohita Profiilin Hallinta ja käynnistä sovellus käyttäen profiilia profiilin_nimi. Käytännöllinen vaihtoehto, kun työskennellään useiden profiilien kanssa. Huomaa, että profiilin_nimi on kirjainkokoriippuvainen. Jos profiilia ei määritellä argumenttina, käynnistyy Profiilien hallinta. Linuxeissa, joissa on ohjelman versio 7.x tai vanhempi, on käytettävä isoa P-kirjainta (P), sillä pieni P-kirjain (p) käynnistää ohjelman Puhdistustilassa (muistin ja muistivuotojen tutkimiseen). Muilla alustoilla käyvät molemmat vaihtoehdot.

+
firefox -P "Seppo Surfaaja"
+
+

-profile "profiilin_polku"

+

Käynnistä käyttäen profiilia, joka löytyy polusta "profiilin_polku". Vain Firefox, Thunderbird ja SeaMonkey2.x.

+

"profiilin_polku" voi olla joko absoluuttinen polku ("/path/to/profile") tai suhteellinen polku ("path/to/profile").

+
+ Huomaa: Käyttöjärjestelmässä Mac OS X suhteellisen polun määrittämistä ei tueta Firefoxin versiossa 4.0 tai uudemmissa. Katso  {{ bug(673955) }}.
+

-no-remote

+ +

Salli sovelluksen useamman kopioin olla avoimena yhtaikaa.

+
firefox -no-remote -P "ToinenProfiili"
+
+
+ Huomaa: Firefoxin versiosta 9 alkaen tämä ei kaikilla alustoilla todella tarkoita sitä, mitä nimi antaa ymmärtää. Esimerkiksi tällä valitsimella käynnistetty instanssi ei hyväksy tai lähetä etäkomentoja, katso  {{ bug(650078) }}. Tämä tarkoittaa sitä, että tällaisia instansseja ei voi uudelleenkäyttää. Myös kun tätä valitsinta käytetään, uusi instanssi luodaan joka tapauksessa.
+ +

-migration

+

Käynnistää ohjelman alussa Ohjatun Tuonnin.

+

-override /path/to/override.ini

+

Lataa määritetyn override.ini -tiedoston, ja ohittaa tiedoston application.ini ({{ Source("browser/app/application.ini") }}). Tätä voidaan käyttää estämään Ohjattu Tuonti ohjelman käynnistyksessä lataamalla override.ini. Vain Firefox.

+
[XRE]
+EnableProfileMigrator=0
+
+

Selain

+

-browser

+

Käynnistä sovellus käyttäen selain-komponenttia. Vain Firefox ja SeaMonkey.

+

-url URL

+

Avaa URL uudessa välilehdessä tai ikkunassa, riippuen selaimen asetuksista. -url -valitsinta ei välttämättä tarvitse käyttää. Voit listata useita URL:ia, kun ne erotetaan välilyönnillä. Vain Firefox ja SeaMonkey.

+
+ Huomaa: Kun avaat useita URL:ia, Firefox avaa ne aina välilehtinä uudessa ikkunassa.
+
firefox www.mozilla.com
+firefox www.mozilla.com developer.mozilla.org
+
+

-private

+

Avaa luotavan Firefox-istunnon pysyvästi Yksityinen Selaus -tilassa. Vain Firefox 3.6 ja uudemmat.

+

Ei ole käytettävissä Ubuntussa Firefoxin versiossa 20 ja uudemmissa.

+

-private-window

+

Avaa uuden ikkunan Yksityinen Selaus -tilassa käynnissä olevaan Firefoxin instanssiin. Vain Firefox 20 ja uudemmat.

+

-private-window URL

+

Avaa URL:n uudessa Yksityinen Selaus -ikkunassa. Jos Yksityinen Selaus -ikkuna on jo avoinna, avataan uusi välilehti olemassa olevaan ikkunaan. Vain Firefox 29 ja uudemmat. Ei toimi Firefox 31:ssä linux mint 17:llä - aiheuttaa sivun avautumisen normaaliin selausikkunaan.

+

-new-tab URL

+

Avaa URL:n uudessa välilehdessä. Vain Firefox ja SeaMonkey2.x.

+

-new-window URL

+

Avaa URL:n uudessa ikkunassa. Vain Firefox ja SeaMonkey2.x.

+

-search hakulauseke

+

Etsi merkkijonoa hakulauseke oletushakukoneellasi. Vain Firefox ja SeaMonkey 2.1 ja uudemmat.

+

-preferences

+

Avaa Asetukset -ikkunan. Vain Firefox ja SeaMonkey2.x.

+

-setDefaultBrowser

+

Asettaa sovelluksen järjestelmän oletusselaimeksi. Vain Firefox.

+

Sähköposti/Uutiset

+

-mail

+

Käynnistää Sähköposti-komponentin. Vain Thunderbird ja SeaMonkey.

+

-news uutisten_URL

+

Käynnistää Uutiset-komponentin. Jos uutisen_URL (vapaaehtoinen) on määritelty, avaa määritellyn uutisryhmän. Vain Thunderbird ja SeaMonkey.

+
thunderbird -news news://palvelin/ryhmä
+
+

-compose viestin_asetukset

+

Käynnistää Kirjoita-komponentin . Katso Syntaksi. Vain Thunderbird ja SeaMonkey.

+
thunderbird -compose "to=foo@nowhere.net"
+
+

-addressbook

+

Käynnistää Osoitekirja-komponentin. Vain Thunderbird ja SeaMonkey.

+

-options

+

Käynnistää Asetukset-ikkunan. Vain Thunderbird.

+

-offline

+

Käynnistää sovelluksen yhteydettömässä tilassa. Vain Thunderbird ja SeaMonkey.

+

-setDefaultMail

+

Asettaa sovelluksen järjestelmän oletussähköpostiohjelmaksi. Vain Thunderbird.

+

Kalenteri

+

-calendar

+

Avaa sovelluksen Kalenteri-komponentin. Vain Sunbird.

+

-subscribe URL tai -url URL

+

Tilaa annetun URL:n. Vain Sunbird.

+

-showdate päivämäärä

+

Näyttää määritetyn päivän kalenterin. Vain Sunbird.

+
sunbird -showdate 08/04/2008
+
+

Muut komponentit

+

-editor URL tai -edit URL

+

Avaa editorin (Composer) annetulle URL.lle (missä URL on vapaaehtoinen). Vain SeaMonkey.

+
seamonkey -edit www.mozilla.org
+
+

-jsconsole

+

Käynnistää sovelluksen ja avaa Virhekonsolin.

+
+

Virhekonsoli on poistettu käytöstä Firefoxissa, ja sen saa esiin vain, jos asettaa ominaisuuden devtools.errorconsole.enabled arvoon true. Käytä sen sijaan Web konsolia web-sisällölle, tai  Selainkonsolia chrome-sisällölle.

+

Alkaen Firefoxin versiosta 28, -jsconsole käynnistää Firefoxin ja avaa Selainkonsolin.

+
+

-inspector URL

+

Käynnistää sovelluksen DOM Inspectorin kanssa, jos se on asennettu, ja tutkii määritetyn URL:n (missä URL on vapaaehtoinen).

+

-venkman

+

Käynnistää sovelluksen JavaScript debuggeri Venkmanin kanssa, jos se on asennettu.

+

-purgecaches

+

Geckolla (layout-moottorilla) on javascript-välimuisti, jota ei resetoida käynnistyksessä. Tämä valitsin tyhjentää sen.

+

-chat

+

Käynnistää sevelluksen IRC-asiakkaan, ChatZillan kanssa, jos se on asennettu.

+

XULRunner

+

-app /path/to/application.ini

+

Käynnistää uuden prosessin XULRunner sovelluksesta polussa  path/to. Toimii myös Firefoxin versiolla 3 ja uudemmilla.

+

--register-global

+

Rekisteröi XULRunnerin järjestelmään kaikille käyttäjille. Komento on suoritettava Järjestelmänvalvoja / admin / root -oikeuksilla.

+

--register-user

+

Rekisteröi XULRunnerin yksittäiselle käyttäjälle.

+

--unregister-global

+

Poistaa XULRunnerin rekisteröinnin kaikilta käyttäjiltä.

+

--unregister-user

+

Poistaa XULRunnerin rekisteröinnin yksittäiseltä käyttäjältä.

+

--install-app path/to/myapplication.(xpi|xulapp)

+

Asentaa XULRunner-sovelluksen järjestelmän polkuun path/to. Sovellukset asennetaan järjestelmäsi oletussijaintiin (program files|Applications|usr/lib) polkuun julkaisijannimi/SovelluksenNimi. Sovellukset voidaan poistaa järjestelmäsi tavanomaisilla menetelmillä.

+
"C:\Program Files\Mozilla XULRunner\1.8.0.4\xulrunner\xulrunner.exe" --install-app "C:\Users\Billdo\Desktop\myapplication.xpi"
+
/opt/xulrunner/1.8.0.4/xulrunner/xulrunner --install-app ~/Desktop/myapplication.xulapp
+
​/Library/Frameworks/XUL.framework/xulrunner-bin --install-app ~/Desktop/myapplication.xpi
+

Chrome

+

-chrome chrome_URL

+

Lataa määritetyn chromen.

+
firefox -chrome chrome://inspector/content
+
+

-register chrome_URL

+

Rekisteröi määritetyn chromen, mutta ei käynnistä sovellusta.

+

Lisäosat

+

{{ gecko_minversion_note("1.9.2", "-install-global-extension ja -install-global-theme on poistettu Geckon versiosta 1.9.2 ja uudemmista.") }}

+

-install-global-extension /path/to/extension

+

Asentaa laajennuksen sovelluksen hakemistoon. Parametri on polku laajennukseen. Komennon suoritus vaatii järjestelmänvalvojan oikeudet.

+

-install-global-theme /path/to/theme

+

Sama kuin edellinen, mutta teemoille. Komennon suoritus vaatii järjestelmänvalvojan oikeudet.

+
+

Huomaa: Firefoxin versiosta 2.0.0.7, on -install-global-extension ja -install-global-theme valitsimien argumentit rajoitettu sallimaan asennuksen vain paikallisilta levyiltä tai liitetyistä asemista. Asentaminen suoraan verkkojaosta ei enää onnistu.

+
+

-safe-mode

+

Käynnistää sovelluksen tämän käynnistyskerran kaikki laajennukset estettyinä (Laajennuksia ei ladata, mutta niitä ei pysyvästi estetä).

+

Kieliversio

+

-UILocale kieliversio

+

Käynnistää sovelluksen käyttäen kieliversio-parametrilla määritettyjä kieliresursseja.

+
firefox -UILocale en-US
+
+

Etähallinta

+

-remote etä_komento

+

Suorittaa komennon etä_komento jo käynnissä olevassa sovelluksen prosessissa (katso remote control).

+
firefox -remote "openURL(www.mozilla.org, new-tab)"
+
+

Sekalaiset

+

-tray

+

Käynnistää sovelluksen pienennettynä ilmaisinalueelle (system tray). Käytännöllinen automaattisen käynnistyksen yhteydessä.

+

-silent

+

Ei avaa oletusikkunaa. Käytännöllinen niiden komentorivivalitsimien kanssa, jotka avaavat oman ikkunan, mutta eivät estä oletusikkunaa aukeamasta. Vain Firefox, Thunderbird3.x ja SeaMonkey2.x.

+

-console

+

Käynnistää sovelluksen ja avaa Debugging consolen. Huomaa: Vain Windows.

+
+

Jos haluat konsolisanomien ilmestyvän siihen konsoliin, jota käytit ohjelman käynnistämiseen, voit käyttää Gecko Console Redirectoria. Esikäännetyt binääritiedostot ovat saatavilla zip-pakettina: https://github.com/matthewkastor/Redirector/archive/master.zip kansiossa Redirector-master\Gecko\Console Redirector\bin\Release Kopioi kaikki dll:t ja exe-tiedosto haluamaasi paikkaan. Suorita sen jälkeen Console Redirector.exe /?

+
+

-h tai -help tai -?

+

Tulostaa luettelon käytettävissä olevista komentorivivalitsimista. Huomaa, että Windowsissa tämä toimii vain edelleenohjauksen, kuten |more , kanssa ({{ Bug(355889) }}). Tämä valitsin toimii ainoastaan komentorivillä.

+

-v tai -version

+

Tulostaa sovelluksen version. Huomaa, että Windowsissa tämää toimii vain edelleenohjauksen, kuten |more , kanssa ({{ Bug(355889) }}). Tämä valitsin toimii ainoastaan komentorivillä.

+

-osint

+

Kertoo sovellukselle,että se käynnistetään tietystä käyttöjärjestelmän käyttöliittymästä (OS shell). Tätä ei tulisi määritellä, ellei kutsuja tarjoa kaikkia käyttöliittymän toiminnallisuuksia, kun sovellus käynnistetään ({{ Bug(384384) }}).

+

-requestPending

+

Kertoo sovellukselle, että Windows DDE -pyyntö tulee pyytämään saman url:n avaamista, kuin mikä on määritelty komentorivillä. Tätä ei tulisi määritellä, ellei kutsuja tarjoa kaikkia käyttöliittymän toiminnallisuuksia, kun sovellus käynnistetään ({{ Bug(354005) }}).

+

X11 valitsimet

+

Nämä valitsimet ovat käytössä ainoastaan sovelluksessa, joka on koottu ja jota ajetaan X11/X.org näyttö- ja ikkunointijärjestelmässä, joita on käytössä Linuxissa ja muissa Unix-pohjaisissa järjestelmissä.

+

--display=DISPLAY

+

Aseta käytettäväksi X-näyttö.

+

--class=WM_CLASS

+

Aseta sovelluksen luoma X11 -ikkunan WM_CLASS -resurssiluokka.

+

--sync

+

Aseta X-kutsut synkronisiksi.

+

--g-fatal-warnings

+

Aseta kaikki varoitukset fataaleiksi.

+

Muita valitsimia, jotka tarvitsevat dokumentointia

+ +

Referenssit

+ +
+

Alkuperäisen dokumentitn tiedot

+ +
+

 

diff --git "a/files/fi/mozilla/helppok\303\244ytt\303\266isyys/index.html" "b/files/fi/mozilla/helppok\303\244ytt\303\266isyys/index.html" new file mode 100644 index 0000000000..33dcc87a3f --- /dev/null +++ "b/files/fi/mozilla/helppok\303\244ytt\303\266isyys/index.html" @@ -0,0 +1,13 @@ +--- +title: Helppokäyttöisyys ja Mozilla +slug: Mozilla/Helppokäyttöisyys +tags: + - Finnish - Suomi + - Helppokäyttöisyys + - Mozilla + - localozation +translation_of: Mozilla/Accessibility +--- +

Helppokäyttöisyys - ajattelutapa jonka mukaan ohjelmistot (ja samankaltaiset) tulisi suunnitella käytännölliseksi sekä yksinkertaiseksi käyttää myös ihmisille joilla on invaliditeetistä tai oppimishäiriöistä johtuvia vaikeuksia ohjelmien käytössä. Mozilla pyrkii valmistamaan ohjelmistonsa mahdollisimman yksinkertaiseksi käyttää; allaolevissa dokumenteissa kuvataan erilaisia tapoja tämän päämäärän toteuttamiseksi. Nämä esitelmät antavat lukijalle Mozilla-kohtaisia näkemyksiä helppokäyttöisyydestä.

+ +

{{LandingPageListSubpages}}

diff --git a/files/fi/mozilla/index.html b/files/fi/mozilla/index.html new file mode 100644 index 0000000000..edba954db8 --- /dev/null +++ b/files/fi/mozilla/index.html @@ -0,0 +1,10 @@ +--- +title: Mozilla +slug: Mozilla +tags: + - NeedsTranslation + - TopicStub +translation_of: Mozilla +--- +

The articles below include content about downloading and building Mozilla code. In addition, you'll find helpful articles about how the code works, how to build add-ons for Mozilla applications, and the like.

+

{{LandingPageListSubpages}}

diff --git a/files/fi/mozilla/persona/browser_compatibility/index.html b/files/fi/mozilla/persona/browser_compatibility/index.html new file mode 100644 index 0000000000..f5ae812ee0 --- /dev/null +++ b/files/fi/mozilla/persona/browser_compatibility/index.html @@ -0,0 +1,80 @@ +--- +title: Selainyhteensopivuus +slug: Mozilla/Persona/Browser_compatibility +tags: + - BrowserID + - Persona + - tuetut + - tuetut selaimet +translation_of: Archive/Mozilla/Persona/Browser_compatibility +--- +

Tuetut selaimet

+

Persona kehitetään, testataan ja on tuettu seuraavilla selaimilla. Personan alustariippumattoman JavaScript-kirjaston ansiosta käyttäjien ei tarvitse asentaa lisäosia Personan käyttämiseksi.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Työpöytäselaimet
Internet Explorer8.0*, 9.0†
FirefoxUusin vakaa, Beta-, Aurora-, Nightly- ja laajennetun tuen versiot
+ Edellinen vakaa versio
ChromeUusin vakaa versio
SafariUusin vakaa versio
OperaUusin vakaa versio ‡
iOS-selaimet
Mobile SafariiOS 5.x
Android-selaimet
+

Oletusselain

+ 		2.x — 4.x
FirefoxUusin vakaa, Beta-, Aurora-, Nightly- ja laajennetun tuen versiot
+ Edellinen vakaa versio
ChromeUusin vakaa versio
+

*: Windows XP. †: Windows Vista ja Windows 7. ‡: Kunhan aika sallii.

+

Selaimet, joita ei tueta

+ +

Muut selaimet

+

Vaikka selain ei olisi virallisesti tuettu, mikä tahansa selain, joka tukee sekä {{ domxref("window.postMessage()") }} että {{ domxref("Storage", "localStorage") }} -tekniikoita pitäisi toimia. Nämä sovellusrajapinnat ovat olleet kenen tahansa saatavilla maaliskuusta 2010 lähtien.

+

Tunnettuja ongelmia

+ diff --git a/files/fi/mozilla/persona/index.html b/files/fi/mozilla/persona/index.html new file mode 100644 index 0000000000..d240b55052 --- /dev/null +++ b/files/fi/mozilla/persona/index.html @@ -0,0 +1,141 @@ +--- +title: Persona +slug: Mozilla/Persona +translation_of: Archive/Mozilla/Persona +--- +
+

Pysy kosketuksessa ja hae opastusta!

+

Seuraa blogiamme, liity sähköpostituslistallemme, tai löydä meidät osoitteessa #identity IRC:ssä.

+
+

Mozilla Persona on eri webbiselaimissa toimiva webbikirjautumisjärjestelmä, joka on helposti käytettävä ja käyttöönotettava. Se toimii kaikissa tunnetuissa selaimissa, ja voit aloittaa tänään.

+

Miksi sinun tulisi käyttää Personaa webbisivullasi?

+
    +
  1. Persona poistaa täysin tarpeen sivustokohtaisiin salasanoihin vapauttaen käyttäjät ja webbisivustot salasanojen luomisen, hallinnoinnin ja turvallisen tallentamisen taakasta.
    2. +
  2. Persona on helppo käyttää. Vain kahdella napsautuksella Persona-käyttäjä voi kirjautua uudelle sivustolle kuten Voost tai The Times Crossword ohittaen tilin luomiseen liittymän hankauksen.
    3. +
  3. Persona on helposti toteutettava. Kehittäjät voivat lisätä Personan sivustolle yhtenä iltapäivänä.
    4. +
  4. Parasta kaikista, ei mitään sisäänlukitusta. Kehittäjät saavat vahvistetut sähköpostiosoitteet kaikista käyttäjistään, ja käyttäjät voivat käyttää sähköpostiosoitteita Personan kanssa.
    5. +
+

Plus, Personasta tulee aina parempi: sen rakenne perustuu avoimeen, hajautettuun yhteyskäytäntöön joka on suunniteltu sallimaan suoran vuorovaikutuksen selaimiin ja se on sähköpostitarjoajien aktiivisesti tukema. Sivustot, jotka käyttävät Personaa tänään, kokevat automaattisesti nuo parannukset ilman, että koodia tarvitsee mitenkään vaihtaa.

+
+ Huomaa: Persona on aktiivissa kehitysvaiheessa. Seuraa blogiamme oppiaksesi uusista ominaisuuksista, tai liity postituslistallemme ja tarjoa palautettasi!
+

Personan käyttäminen webbisivustollasi

+
+
+
+

Kuinka aloitetaan

+
+
+ Miksi Persona?
+
+ Opettele perusteet Personan käytölle sivustollasi ja millainen se on vertailtaesa muihin tunnistus- ja todennusjärjestelmiin.
+
+ Pika-asennus
+
+ Nopea läpikäynti näyttää kuinka Persona lisätään webbisivustollesi.
+
+
+
+

Persona API -lähdeviite

+
+
+ Navigator.id API -lähdeviite
+
+ Viite navigator.id-objektiin, jota web-kehittäjät voivat käyttää Personan integroimiseksi sivustoihinsa.
+
+ Verification API -lähdeviite
+
+ Viite etätodentamissovellusohjelmointiliittymään (API) osoitteessa https://verifier.login.persona.org/verify.
+
+
+
+
+
+

Oppaita

+
+
+ Turvallisuusarviointeja
+
+ Käytäntöjä ja tekniikoita Persona-käyttösi tekemiseksi turvalliseksi.
+
+ Selainyhteensopivuus
+
+ Opi tarkkaan, että mitkä selaimet tukevat Personaa.
+
+ Kotoistaminen
+
+ Opi kuinka Persona käsittelee eri kieliä.
+
+
+
+

Resurssit

+
+
+ Kirjastot ja lisäosat
+
+ Löydä suosikkiohjelmointikielesi paikalleen pudotettavan kirjasto, webbiympäristö, blogi, tai sisältöhallintajärjestelmä.
+
+ Persona-keittokirja
+
+ Esimerkkikoodia Persona-sivustoille. Sisältää koodipätkiä ohjelmointikielisssä C# (MVC3), PHP, Node.JS, ja muissa.
+
+ Tavaramerkkiresurssit
+
+ Kirjautumispainikkeet ja muu grafiikka, joka auttaa esittelemään Personan käyttäjillesi.
+
+
+
+
+
+
+

Tietoa tunnistustarjoajille

+

Jos olet sähköpostipalvelutarjoaja tai toinen tunnistuspalvelutarjoaja, tarkista alla olevat linkit siitä, kuinka tulla Persona-tunnistuspalvelutarjoajaksi.

+
+
+ IdP-yleiskatsaus
+
+ Ylemmän tason näkymä Persona-tunnistuspalvelutarjoajiin.
+
+ IdP:n toteuttaminen
+
+ Yksityiskohtainen opas IdP-tarjoajaksi tulemisen teknisistä yksityiskohdista.
+
+ .well-known/browserid
+
+ Yleiskatsaus .well-known/browserid-tiedoston rakenteeseen ja käyttöön, jota tiedostoa IdP-palvelutarjoajat käyttävät mainostamaan tukeaan yhteyskäytännölle.
+
+
+
+

Persona-hanke

+
+
+ Sanasto
+
+ BrowserID- ja Persona-terminologia määriteltynä.
+
+ UKK
+
+ Vastauksia tavallisiin kysymyksiin.
+
+ Yleiskatsaus yhteyskäytäntöön
+
+ Keskitason tekninen yleiskatsaus pohjana olevaan BrowserID-yhteyskäytäntöön.
+
+ Salaus
+
+ Tutustu Personan ja BrowserID:n taustalla olevaan salauskonseptiin.
+
+ Spesifikaatio
+
+ Syvät tekniset yksityiskohdat ovat täällä.
+
+ Persona-sivusto
+
+ Personan saamiseksi käyttöön ylläpidämme kolmea palvelua osoitteessa https://login.persona.org: Tunnistustarjoajan varmistus, siirrettävien {{ domxref("navigator.id") }}-sovellusohjelmointirajapintojen (API) toteutus, ja tunnistusvakuutustodentamispalvelu.
+
+ Persona-lähdekoodi
+
+ Persona-sivuston koodi on GitHub-lähdekoodivarastossa. Olet tervetullut lataamaan sen!
+
+
+
+

 

diff --git "a/files/fi/mozilla_developer_centerin_sis\303\244ll\303\266t/index.html" "b/files/fi/mozilla_developer_centerin_sis\303\244ll\303\266t/index.html" new file mode 100644 index 0000000000..95ece065d8 --- /dev/null +++ "b/files/fi/mozilla_developer_centerin_sis\303\244ll\303\266t/index.html" @@ -0,0 +1,59 @@ +--- +title: Mozilla Developer Centerin sisällöt +slug: Mozilla_Developer_Centerin_sisällöt +tags: + - Kaikki_luokat +--- + + + +
+

Aiheet

+ + + +

Mozilla internals

+ +

Mozilla Developer Center

+ +		 +

Teknologiat

+
  • AJAX - Asynchronous JavaScript and XML +
  • CSS - Cascading Style Sheets +
  • DOM - Document Object Model +
  • HTML - Hypertext Markup Language +
  • JavaScript +
  • XML - Extensible Markup Language +
  • SVG - Scalable Vector Graphics +
  • XUL - XML User Interface Language +
  • XBL - Extensible Binding Language +
  • RDF - Resource Description Framework +
  • RSS - Really Simple Syndication +
  • XForms - XML Forms +
  • XPath - XML Path Language +
  • XSLT - Extensible Stylesheet Language Transformations +
  • XML Web Services - SOAP, XML-RPC, etc. +
+

Ohjelmisto ja komponentti runko

+ +
+


+

diff --git a/files/fi/skinin_luominen_firefoxiin/aloittaminen/index.html b/files/fi/skinin_luominen_firefoxiin/aloittaminen/index.html new file mode 100644 index 0000000000..cb07cb11e4 --- /dev/null +++ b/files/fi/skinin_luominen_firefoxiin/aloittaminen/index.html @@ -0,0 +1,49 @@ +--- +title: Aloittaminen +slug: Skinin_luominen_Firefoxiin/Aloittaminen +--- +

Alkutoimet

+

Lataa uusin versio Firefoxista ja asenna se. Varmista, että laajennus DOM Inspector asentui myös. +

+

Pura teema

+

Vaikka teoriassa voit aloittaa minkä tahansa jo tehdyn teeman kanssa, yhtäläisyyksien vuoksi kerromme kuin kaikki muokkaisivat Winstripe:ä (Firefox:in oletusteemaa). Tämä teema sijaitsee tiedostossa <tt>classic.jar</tt> Firefox:in asennushakemistossa. JAR-teidosto on todellisuudessa uudelleennimetty ZIP-tiedosto, jonka voi avata ZIP-tiedostoja käsittelevässä ohjelmassa. Jos pakkausohjelma jostain syystä ajattelee, että tiedosto ei ole oikeassa muodossa, nimeä tiedosto <tt>classic.zip</tt>:ksi ja pura tiedosto. +

+
Classic.jar sijainnit
+

Linux: /usr/lib/MozillaFirefox/chrome/classic.jar +

Windows: \Program Files\Mozilla Firefox\chrome\classic.jar +

For Mac OS X: +

+ +

Kopioi <tt>classic.jar</tt> muuhun helposti siirryttävään kansioon (<tt>classic</tt> on suositeltava) pura paketti sinne varmistaaksesi, että hakemistorakenne säilyy. +

Huomaa: Voit vaihtaa <tt>.jar</tt> tiedostopäätteen <tt>.jar.zip</tt>:ksi ja sitten purkaa tiedoston sisältö hakemistoon! +

+

Hakemistot

+

Tiedoston <tt>classic.jar</tt> sisällä on hakemisto <tt>skin</tt> ja tiedostot <tt>preview.png</tt> ja <tt>icon.png</tt>. +

+
<tt>skin</tt> +
<tt>skin</tt> yksinkertaisesti sisältää hakemiston <tt>classic</tt>, joka sisältää kaiken hyvän tavaran. +
<tt>classic</tt> +
<tt>classic</tt> sisältää seuraavat hakemistot: +
<tt>browser</tt> +
<tt>browser</tt> sisältää kaikki työkalurivin ikonit sekä myöskin ikonit kirjanmerkkien hallitsijalle ja asetusten ikkunalle. +
<tt>global</tt> +
<tt>global</tt> sisältää melkein kaikki tärkeät CSS-tiedostot, jotka määrittelevät selaimen ulkoasua. Tämä on kaikkein kriittisin hakemisto teemassa. +
<tt>mozapps</tt> +
<tt>mozapps</tt> sisältää kaikki tyylit ja ikonit selaimen periphrials?, kuten laajennus hallitsija ja päivitys velho. +
<tt>help</tt> +
<tt>help</tt> sisältää kaikki tidostot avun hankkimis -ikkunan muotoilemiseen. +
<tt>communicator</tt> +
Ei tee oikeastaan mitään ja voidaan yleisesti unohtaa. +
+

Asenna uusi teemasi

+

Ennenkuin pystyt näkemään muutokset, joita teit Firefox:in teemaan (since live edits are restrictively difficult to set up?) sinun pitää ensin oppia uudelleenpaketoimaan perusteema, jotta se voidaan asentaa. Nimeämme teemasi "My_Theme":ksi, mutta voit nimetä sen aivan miksi tahansa. +

+
Välttämättömien tiedostojen kopioiminen
+
Asennustiedostojen luominen
+
Contents.rdf
+
install.rdf
+

CSS tiedostot

+

JAR-tiedoston uudelleenpakkaaminen

+

Asennuksen käynnistäminen webistä

diff --git a/files/fi/skinin_luominen_firefoxiin/index.html b/files/fi/skinin_luominen_firefoxiin/index.html new file mode 100644 index 0000000000..4bc1631dee --- /dev/null +++ b/files/fi/skinin_luominen_firefoxiin/index.html @@ -0,0 +1,28 @@ +--- +title: Skinin luominen Firefoxiin +slug: Skinin_luominen_Firefoxiin +tags: + - Teemat +--- +

Edited 4.12.2006 +

+

Johdanto

+

Jotta voi tehdä skinin Firefoxiin on kolme asiaa, jotka pitää tietää: miten muokkaat kuvia, miten purat ZIP-tiedostoja ja miten muokkaat CSS:ää. +<ol><li>miten muokkaat kuvia</li> <li>miten purat ZIP-tiedostoja ja</li> <li>miten muokkaat CSS:ää.</li></ol> +Firefox käyttää standardeja GIF-, PNG-, ja JPEG-kuvia nappuloissa ja CSS:ää muotoiltaessa kaikea muuta. +

Mikä on skini? +

Skini ei varsinaisesti muuta käyttöliittymää, vaan se ainoastaan määrittää, että miltä käyttöliittymä näyttää. Et voi muuttaa esim. sitä, että mitä tapahtuu, kun käyttäjä klikkaa kuvaa oikealla hiiren näppäimellä, mutta voit muuttaa oikealla hiiren näppäimellä aukeavan valikon ulkonäköä. Jos haluat muuttaa Firefoxin toimintoja, sinun täytyy perehtyä cromen muuttamiseen, joka ei kuulu tämän dokumentin aiheeseen. +

+

Sisältö

+ +<hr> +
+

Alkuperäisen dokumentin tietoja

+ +
+{{ languages( { "fr": "fr/Cr\u00e9er_un_th\u00e8me_pour_Firefox", "pl": "pl/Tworzenie_sk\u00f3rek_dla_Firefoksa" } ) }} diff --git a/files/fi/teemat/index.html b/files/fi/teemat/index.html new file mode 100644 index 0000000000..565b10ff7f --- /dev/null +++ b/files/fi/teemat/index.html @@ -0,0 +1,81 @@ +--- +title: Teemat +slug: Teemat +tags: + - Teemat +--- +
Aloitus
+Johdanto teemojen kehittämiseen Firefoxille.
+ +
Teemat ovat nahkoja monille Mozilla ohjelmille. Teemat tarjoavat näkymän ja tunnun muuttamisen käyttöliittymässä ja personoivat sen makusi mukaan. Teema voi yksinkertaisesti muuttaa UI:n värejä tai muuttaa jokaisen osan ulkoasua.
+ + + + + + + + +
+

Dokumentaatio

+ +
+
Skinin luominen Firefoxiin
+
Johdanto uusien teemojen kehittämiseksi Firefoxiin.
+
+ +
+
Teemojen paketointi
+
Kuinka paketoit teemat Firefoxille ja Thunderbirdille.
+
+ +
+
Teemojen muutokset Firefox 1.0:sta 1.5:een (forum post)
+
A forum post at MozillaZine outlining the basic theme-related changes between Firefox 1.0 and 1.5.
+
+ +
+
Theme Development
+
Syventävä artikkeli niille, jotka ovat kiinnostuneet suunnittelemaan ja kehittämään teemoja XUL-perustaisiin ohjelmiin.
+
+ +
+
Ensiasekeleet teemojen suunnittelussa
+
Jonkin verran vanhentunut artikkeli, jossa keskustellaan teemojen suunnittelusta Firefoxille.
+
+ +

Katso kaikki...

+ 		+

Yhteisö

+ +
    +
  • Katso Mozilla foorumit...
    • +
+ +

{{ DiscussionList("dev-themes", "mozilla.dev.themes") }}

+ + + +

Työkalut

+ + + +

Katso kaikki...

+ +

Läheinen aihe

+ +
+
CSS
+
+
+ +

Categories

+ +

Interwiki Language Links

diff --git a/files/fi/web/api/aeskeygenparams/index.html b/files/fi/web/api/aeskeygenparams/index.html new file mode 100644 index 0000000000..8e7efcc5d5 --- /dev/null +++ b/files/fi/web/api/aeskeygenparams/index.html @@ -0,0 +1,48 @@ +--- +title: AesKeyGenParams +slug: Web/API/AesKeyGenParams +translation_of: Web/API/AesKeyGenParams +--- +

{{ APIRef("Web Crypto API") }}AesKeyGenParams hakemisto Web Crypto API:sta edustaa objektia joka tulisi siirtää algorithm parametrina metodiin {{domxref("SubtleCrypto.generateKey()")}}, kun luodaan AES avainta: silloin kun algoritmiksi tunnistetaan joksikin seuraavista: AES-CBC, AES-CTR, AES-GCM, tai AES-KW.

+ +

Ominaisuudet

+ +
+
name
+
{{domxref("DOMString")}}. Tämän tulisi olla asetettuna joksikin seuraavista: AES-CBC,  AES-CTR, AES-GCM, ta AES-KW, riippuen siitä mitä algoritmia haluat käyttää.
+
length
+
+

Numero — generoitavan avaimen bittien pituus. Tämän täytyy olla jokin näistä: 128, 192, tai 256.

+
+
+ +

Esimerkkejä

+ +

Katso {{domxref("SubtleCrypto.generateKey()")}}:n esimerkit.

+ +

Tekniset tiedot

+ + + + + + + + + + + + + + +
MääritelmäTilaKommentti
{{ SpecName('Web Crypto API', '#dfn-AesKeyGenParams', 'SubtleCrypto.AesKeyGenParams') }}{{ Spec2('Web Crypto API') }} 
+ +

Selainyhteensopivuus

+ +

Selaimet jotka tukevat jotain AES-pohjaista algoritmia jota {{domxref("SubtleCrypto.generateKey()")}} metodi tukee.

+ +

Katso myös

+ + diff --git a/files/fi/web/api/index.html b/files/fi/web/api/index.html new file mode 100644 index 0000000000..98bda55ac9 --- /dev/null +++ b/files/fi/web/api/index.html @@ -0,0 +1,10 @@ +--- +title: Web API Interfaces +slug: Web/API +tags: + - Web +translation_of: Web/API +--- +

When writing code for the Web using JavaScript, there are a great many APIs available. Below is a list of all the interfaces (that is, types of objects) that you may be able to use while developing your Web app or site.

+ +
{{APIListAlpha}}
diff --git a/files/fi/web/api/intersectionobserver/index.html b/files/fi/web/api/intersectionobserver/index.html new file mode 100644 index 0000000000..e62bd8b216 --- /dev/null +++ b/files/fi/web/api/intersectionobserver/index.html @@ -0,0 +1,87 @@ +--- +title: IntersectionObserver +slug: Web/API/IntersectionObserver +translation_of: Web/API/IntersectionObserver +--- +
{{APIRef("Intersection Observer API")}}
+ +

Intersection Observer API:n  rajapinta IntersectionObserver tarjoaa asynkronisen keinon tarkkailla muutoksia kohde-elementin ja sen esi-isäelementin tai ylätason dokumentin {{Glossary('viewport')}}:n kanssa. Näihin korkeamman tason DOM -elementteihin viitataan nimellä "root".

+ +

Kun IntersectionObserver luodaan, se konfiguroidaan tarkkailemaan DOM-elementtien näkyvyyttä suhteessa root:tiin. Tätä konfiguraatiota ei voida muuttaa sen jälkeen, kun se on initialisoitu, eli käytännössä yhdellä instanssilla tarkkaillaan elementtien näkyvyyttä yhden root -tason elementin suhteen. Yhdellä IntersectionObserver:lla voidaan kuitenkin tarkkailla monen elementin näkyvyyttä tämän suhteen.

+ +

Constructor

+ +
+
{{domxref("IntersectionObserver.IntersectionObserver()")}}
+
Luo uuden IntersectionObserver -instanssin, joka suorittaa annetun "callback" -function kun se havaitsee, että kohde-elementin näkyvyys on ylittänyt annetun kynnyksen.
+
+ +

Properties

+ +
+
{{domxref("IntersectionObserver.root")}} {{readonlyinline}}
+
Tietty elementin esi-isä -elementti, jonka suhteen kohteen {{domxref("element")}} näkyvyyttä tarkkaillaan. Jos tätä ei erityiesti määritellä, käytetään koko dokumentin juuren viewport:ia.
+
{{domxref("IntersectionObserver.rootMargin")}} {{readonlyinline}}
+
An offset rectangle applied to the root's {{Glossary('bounding box')}} when calculating intersections, effectively shrinking or growing the root for calculation purposes. The value returned by this property may not be the same as the one specified when calling the constructor as it may be changed to match internal requirements. Each offset can be expressed in pixels (px) or as a percentage (%). The default is "0px 0px 0px 0px".
+
{{domxref("IntersectionObserver.thresholds")}} {{readonlyinline}}
+
A list of thresholds, sorted in increasing numeric order, where each threshold is a ratio of intersection area to bounding box area of an observed target. Notifications for a target are generated when any of the thresholds are crossed for that target. If no value was passed to the constructor, 0 is used.
+
+ +

Methods

+ +
+
{{domxref("IntersectionObserver.disconnect()")}}
+
Stops the IntersectionObserver object from observing any target.
+
{{domxref("IntersectionObserver.observe()")}}
+
Tells the IntersectionObserver a target element to observe.
+
{{domxref("IntersectionObserver.takeRecords()")}}
+
Returns an array of {{domxref("IntersectionObserverEntry")}} objects for all observed targets.
+
{{domxref("IntersectionObserver.unobserve()")}}
+
Tells the IntersectionObserver to stop observing a particular target element.
+
+ +

Examples

+ +
var intersectionObserver = new IntersectionObserver(function(entries) {
+  // If intersectionRatio is 0, the target is out of view
+  // and we do not need to do anything.
+  if (entries[0].intersectionRatio <= 0) return;
+
+  loadItems(10);
+  console.log('Loaded new items');
+});
+// start observing
+intersectionObserver.observe(document.querySelector('.scrollerFooter'));
+ +

Specifications

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName("IntersectionObserver", "#intersection-observer-interface", "IntersectionObserver")}}{{Spec2('IntersectionObserver')}}
+ +

Browser compatibility

+ + + +

{{Compat("api.IntersectionObserver")}}

+ +

See also

+ + diff --git a/files/fi/web/api/webgl_api/index.html b/files/fi/web/api/webgl_api/index.html new file mode 100644 index 0000000000..e7153d4db5 --- /dev/null +++ b/files/fi/web/api/webgl_api/index.html @@ -0,0 +1,229 @@ +--- +title: WebGL +slug: Web/API/WebGL_API +tags: + - WebGL +translation_of: Web/API/WebGL_API +--- +
{{WebGLSidebar}}
+ +

WebGL tuo 3D-grafiikan Webbin esittelemällä sovellusohjelmointirajapinnan (API), joka on läheisesti yhteensovpiva HTML5 canvas-elementissä käytetttävän OpenGL ES 2.0 -määrittelyn kanssa. Tuki WebGL:lle on nykyisin Firefox 4+ -selaimissa, Google Chrome 9+ -selaimissa, Opera 12+ -selaimissa ja Safari 5.1+ -selaimissa.

+ +
+
+

Kehitysaiheita

+ +
+
Kuinka aloittaa WebGL-asennus
+
Kuinka asettaa WebGL-ympäristö.
+
Lisätään 2D-sisältöä WebGL-ympäristöön
+
Kuinka renderoidaan yksinkertaisia litteitä muotoja WebGL:tä käyttäen.
+
Varjostimien käyttäminen värien toteuttamisessa WebGL:ssä
+
Esittelee, kuinka lisätä väri varjoja käyttäviin muotoihin.
+
Objektien animointi WebGL:ssä
+
Näyttää kuin kiertää ja muuntaa objekteja yksinkertaisten animaatioiden luomiseksi.
+
3D-objektien luominen käyttäen WebGL:ää
+
Näyttää, kuinka luoda ja animoida 3D-objekti (tässä tapauskessa kuutio).
+
Using textures in WebGL
+
Demonstrates how to map textures onto the faces of an object.
+
Lighting in WebGL
+
How to simulate lighting effects in your WebGL context.
+
Animating textures in WebGL
+
Shows how to animate textures; in this case, by mapping an Ogg video onto the faces of a rotating cube.
+
Parhaimmat WebGL-käytännöt
+
Vihjeitä ja suosituksia WebGL-sisällön luomiseksi.
+
Cross-domain textures
+
Information about loading textures from domains other than the one from which your content was loaded.
+
Using extensions
+
How to use extensions that are available in WebGL.
+
+
+ +
+ + +
+
WebGL-spesifikaatio
+
WebGL-spesifikaatio.
+
Khronos WebGL site
+
The main web site for WebGL at the Khronos Group.
+
Learning WebGL
+
A site with tutorials on how to use WebGL.
+
The WebGL Cookbook
+
A web site with handy recipes for writing WebGL code.
+
Planet WebGL
+
A feed aggregator for people involved in the WebGL community.
+
ewgl-matrices
+
A blazing fast matrix library for WebGL
+
glMatrix
+
JavaScript Matrix and Vector library for High Performance WebGL apps
+
mjs
+
A JavaScript vector and matrix math library, optimized for WebGL usage.
+
Sylvester
+
An open source library for manipulating vectors and matrices. Not optimized for WebGL but extremely robust.
+
WebGL playground
+
An online tool for creating and sharing WebGL projects. Good for quick prototyping and experimenting.
+
+
+
+ +

Browser compatibility

+ +

{{CompatibilityTable()}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Basic support{{CompatGeckoDesktop("2.0")}}9{{CompatNo()}}125.1
Context nameexperimental-webglexperimental-webgln/aexperimental-webglexperimental-webgl
OES_texture_float{{CompatGeckoDesktop("6.0")}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}
OES_standard_derivatives{{CompatGeckoDesktop("10.0")}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}
EXT_texture_filter_anisotropic{{CompatGeckoDesktop("13.0")}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}
WEBGL_compressed_texture_s3tc{{CompatGeckoDesktop("15.0")}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}
drawingBufferWidth and drawingBufferHeight attributes{{CompatGeckoDesktop("9.0")}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureFirefox Mobile (Gecko)AndroidIE MobileOpera MobileSafari Mobile
Basic support{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}
Context name{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}
OES_texture_float{{CompatGeckoMobile("6.0")}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}
OES_standard_derivatives{{CompatGeckoMobile("10.0")}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}
EXT_texture_filter_anisotropic{{CompatGeckoMobile("13.0")}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}
WEBGL_compressed_texture_s3tc{{CompatGeckoMobile("15.0")}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}
drawingBufferWidth and drawingBufferHeight attributes{{CompatGeckoMobile("9.0")}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}
+
+ +

Gecko notes

+ +

WebGL debugging and testing

+ +

Starting with Gecko 10.0 {{geckoRelease("10.0")}}, there are two preferences available which let you control the capabilities of WebGL for testing purposes:

+ +
+
webgl.min_capability_mode
+
A Boolean property that, when true, enables a minimum capability mode. When in this mode, WebGL is configured to only support the bare minimum feature set and capabilities required by the WebGL specification. This lets you ensure that your WebGL code will work on any device or browser, regardless of their capabilities. This is false by default.
+
webgl.disable_extensions
+
A Boolean property that, when true, disables all WebGL extensions. This is false by default.
+
+ +
{{HTML5ArticleTOC()}}
diff --git a/files/fi/web/api/webvr_api/index.html b/files/fi/web/api/webvr_api/index.html new file mode 100644 index 0000000000..e3b73598f2 --- /dev/null +++ b/files/fi/web/api/webvr_api/index.html @@ -0,0 +1,250 @@ +--- +title: WebVR API +slug: Web/API/WebVR_API +tags: + - API + - Experimental + - Expérimental(2) + - Landing + - NeedsTranslation + - Reference + - Référence(2) + - TopicStub + - VR + - Virtual Reality + - WebVR +translation_of: Web/API/WebVR_API +--- +

{{SeeCompatTable}}{{APIRef("WebVR API")}}

+ +

WebVR -rajapinta tarjoaa tuen VR-laitteiden — kuten Oculus Rift tai HTC Vive -silmikoiden — käyttämiseen webbisovelluksille, jolloin kehittäjät voivat muuttaa silmikolta saadun sijainti- ja liiketiedon 3D-skenessä liikkumistiedoksi. Tämä mahdollistaa useita kiinnostavia sovellusmahdollisuuksia aina virtuaalisista tuote-esittelyistä ja interaktiivisista treenisovelluksista immersiivisiin FPS-räiskintäpeleihin.

+ +

Perusperiaatteet ja käyttö

+ +

Metodi {{domxref("Navigator.getVRDisplays()")}} hakee kaikki tietokoneeseen liitetyt VR-laitteet; jokaista näistä vastaa {{domxref("VRDisplay")}} -tyyppinen objekti.

+ +

Sketch of a person in a chair with wearing goggles labelled "Head mounted display (HMD)" facing a monitor with a webcam labelled "Position sensor"

+ +

{{domxref("VRDisplay")}} on perusrajapinta WebVR API:in — sen ominaisuuksien ja metodien avulla voit esimerkiksi:

+ + + +

Tyypillinen (yksinkertainen) WebVR-sovellus toimisi esimerkiksi näin:

+ +
    +
  1. {{domxref("Navigator.getVRDisplays()")}} -metodilla haetaan viittaus VR-näyttöön.
    2. +
  2. {{domxref("VRDisplay.requestPresent()")}} -metodilla käynnistetään näyttäminen.
    3. +
  3. WebVR:n omalla versiolla {{domxref("VRDisplay.requestAnimationFrame()")}} -methodista suoritetaan sovelluksen renderöintisilmukkaa näytölle sopivalla virkistystaajuudella.
    4. +
  4. Renderöintisilmukassa haetaan ruudun näyttämiseen tarvittavat tiedot ({{domxref("VRDisplay.getFrameData()")}}) -metodilla, piirretään näytettävä skene kaksi kertaa — siis kerran molemmille silmille, ja sen jälkeen toimitetaan renderöity näkymä näytölle käyttäjälle näytettäväksi metodilla ({{domxref("VRDisplay.submitFrame()")}}).
    5. +
+ +

Tämän lisäksi WebVR 1.1 lisää useita tapahtumia (event) {{domxref("Window")}} -objektiin, jolloin JavaScriptillä voidaan reagoida näytön tilan muutoksiin.

+ +

Huom: APIn toiminnasta löytyy paljon lisätietoa artikkeleista Using the WebVR API ja WebVR Concepts.

+ +

Ohjaimien käyttö: WebVR:n yhdistäminen Gamepad API:in

+ +

Useissa WebVR-laitekokoonpanoissa silmikon mukana on käytettävissä erillinen ohjain. Ohjaimia voidaan käyttää WebVR-sovelluksissa Gamepad API:n kautta, ja erityisesti Gamepad Extensions API:n, joka lisää mukaan ohjaimen asentotiedon (controller pose), tuntoperusteiset laitteet (haptic actuators) ja muita vastaavia.

+ +

Huom: Artikkeli Using VR controllers with WebVR selittää perusteet VR-ohjaimien käytöstä WebVR-sovelluksissa.

+ +

WebVR rajapinnat

+ +
+
{{domxref("VRDisplay")}}
+
Edustaa mitä tahnsa APIn tukemaa VR-laitetta. Siinä on mukana yleistiedot laittesta, kuten laitteen tunnisteet (ID) ja kuvaukset sekä metodit VR-skenen esittämisen käynnistämiseen, silmäparametrien ja näytön ominaisuuksien hakemiseen ja muut olennaiset toiminnat.
+
{{domxref("VRDisplayCapabilities")}}
+
Esittää {{domxref("VRDisplay")}}:n ominaisuudet — näillä voidaan testata, saako laitteelta esimerkiksi sijaintitietoa.
+
{{domxref("VRDisplayEvent")}}
+
Edustaa WebVR-kohtaisen tapahtuman tapahtumaobjektia (kts. {{anch("Window", "window object extensions")}} alempana).
+
{{domxref("VRFrameData")}}
+
Vastaa kaikkea tietoa, mitä yksittäisen VR-skenen ruudun renderöintiin tarvitaan; metodi {{domxref("VRDisplay.getFrameData()")}} hakee nämä tiedot.
+
{{domxref("VRPose")}}
+
Edustaa tietyllä ajanhetkellä vallitsevaa sijaintitietoa (johon kuuluvat suunta, sijainti, nopeus ja kiihtyvyys.)
+
{{domxref("VREyeParameters")}}
+
Tarjoaa pääsyn kaikkeen tietoon, joka tarvitaan skenen renderöintiin oikein kullekin silmälle, esimerkiksi näkökentän laajuuden.
+
{{domxref("VRFieldOfView")}}
+
Näkökenttätieto, joka on määritelty keskipisteestä katsottuna neljällä asteluvulla.
+
{{domxref("VRLayerInit")}}
+
Tämä on {{domxref("VRDisplay")}}-näytöllä esitettävä kuvan eräs taso (layer).
+
{{domxref("VRStageParameters")}}
+
Huoneskaalaa tukevien laitteiden kanssa käytettävissä sovelluksissa "näyttämöalueen" tiedot löytyvät tästä.
+
+ +

Laajennukset muihin rajapintoihin

+ +

WebVR API laajentaa joitakin API-rajapintoja lisäten seuraavat ominaisuudet.

+ +

Gamepad

+ +
+
{{domxref("Gamepad.displayId")}} {{readonlyInline}}
+
Palauttaa liitetyn {{domxref("VRDisplay")}} tunnisteen {{domxref("VRDisplay.displayId")}} — VRDisplay , jonka skeneä gamepad ohjaa.
+
+ + + +
+
{{domxref("Navigator.activeVRDisplays")}} {{readonlyInline}}
+
Palauttaa taulukon, jossa on mukana jokainen {{domxref("VRDisplay")}}, joka esittää parhaillaan ({{domxref("VRDisplay.ispresenting")}} on true).
+
{{domxref("Navigator.getVRDisplays()")}}
+
Palauttaa promise-objektin, joka sisältää taulukon {{domxref("VRDisplay")}} objekteja, jotka vastaavat kaikkia tietokoneeseen liitettyjä VR-näyttöjä.
+
+ +

Window-tapahtumat

+ +
+
{{domxref("Window.onvrdisplaypresentchange")}}
+
Edustaa tapahtumankäsittelijää (event handler), joka suoritetaan, kun VR_näytön esittämistila muuttuu — esimerkiksi tilasta 'esittää' tilaan 'ei esitä' tai päinvastoin (kun tapahtuma {{event("vrdisplaypresentchange")}} signaloidaan).
+
{{domxref("Window.onvrdisplayconnect")}}
+
Tämä tapahtumankäsittelijä suoritetaan, kun yhteensopiva VR-näyttö on kytketty tietokoneeseen (tapahtuma {{event("vrdisplayconnect")}} ).
+
{{domxref("Window.onvrdisplaydisconnect")}}
+
Tämä tapahtumankäsittelijä suoritetaan, kun yhteensopiva VR-näyttö irrotetaan tietokoneesta (kun tapahtuma {{event("vrdisplaydisconnect")}} signaloidaan).
+
{{domxref("Window.onvrdisplayactivate")}}
+
Edustaa taphtumaa, joka suoritetaan, kun näyttö on valmis esittämään sisältöä (tapahtuma {{event("vrdisplayactivate")}} ),esimerkiksi kun silmikko aktivoituu virransäästötilasta tai puetaan päälle.
+
{{domxref("Window.onvrdisplaydeactivate")}}
+
Tämä tapahtumankäsittelijä suoritetaan, kun näytölle ei voi enää esittää sisältöä (kun tapahtuma {{event("vrdisplaydeactivate")}} signaloidaan), esimerkiksi syystä, että silmikkonäyttö on siirtynyt virransäästötilaan käyttämättömyyden vuoksi.
+
+ +

Window:n tapahtumat, jotka eivät ole käytettävissä

+ +

Seuraavat tapahtumat löytyvät APIn määrittelystä, mutta niiden toteutusta ei tunnu vielä löytyvän mistään selaimista.

+ +
+
{{domxref("Window.onvrdisplayblur")}}
+
Edustaa tapahtumankäsittelijää, joka suoritetaan kun selain, käyttöjärjestelmä tai VR-laitteisto on keskeyttänyt esittämisen näytölle jostain syystä (tapahtuman {{event("vrdisplayblur")}} johdosta) — esimerkiksi käytettäessä järjestelmän valikkoa tai selainta. Tarkoitus on estää seurantaa tai VR-kokemuksen menetystä.
+
{{domxref("Window.onvrdisplayfocus")}}
+
Tämä tapahtumankäsittelijä suoritetaan, kun esittäminen näytöllä palautuu edellisen tapahtuman jälkeen (tapahtumasta {{event("vrdisplayfocus")}} ).
+
+ +

Esimerkkejä

+ +

Näiltä sivustoilta töydät useita esimerkkejä:

+ + + +

Spesifikaatiot

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName("GamepadExtensions")}}{{Spec2("GamepadExtensions")}}Määrittää Experimental Gamepad extensions.
{{SpecName('WebVR 1.1')}}{{Spec2('WebVR 1.1')}}Alkuperäinen
+ +

Selainyhteensopivuus

+ +

{{CompatibilityTable}}

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
OminaisuusChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Perus{{CompatNo}}[1]{{CompatVersionUnknown}}{{CompatGeckoDesktop(55)}}[2]{{CompatNo}}{{CompatNo}}{{CompatNo}}
Gamepad -laajennukset{{CompatNo}}{{CompatNo}}{{CompatNo}}[4]{{CompatNo}}{{CompatNo}}{{CompatNo}}
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidEdgeFirefox Mobile (Gecko)IE PhoneOpera MobileSafari MobileChrome for AndroidSamsung Internet for GearVR
Basic support{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatVersionUnknown}}[3]{{CompatVersionUnknown}}
+  
Gamepad extensions{{CompatNo}}{{CompatNo}}{{CompatNo}}[4]{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+ +

[1] API käytettävissä (Available) kaikilla alustoilla lipulla, mutta tällä hetkellä toimii ainoastaan kokeellisessa työpöytäversiossa (experimental version of Chrome) (muut versiot eivät palauta yhtään laitetta metodia {{domxref("Navigator.getVRDisplays()")}} kutsuttaessa).

+ +

[2] Tällä hetkellä ainoastaan Windows ja Mac OSX tuki on oletuksena päällä.

+ +

[3] Nyt ainoastaan laitteella Google Daydream.

+ +

[4] Päällä Firefox Nightly ja Beta -versioissa 55 ja uudempi. Käytetään valinnalla dom.gamepad-extensions.enabled.

+ +

Katso myös

+ + diff --git a/files/fi/web/api/webvr_api/using_the_webvr_api/index.html b/files/fi/web/api/webvr_api/using_the_webvr_api/index.html new file mode 100644 index 0000000000..b4cf17e315 --- /dev/null +++ b/files/fi/web/api/webvr_api/using_the_webvr_api/index.html @@ -0,0 +1,438 @@ +--- +title: Using the WebVR API +slug: Web/API/WebVR_API/Using_the_WebVR_API +translation_of: Web/API/WebVR_API/Using_the_WebVR_API +--- +
{{APIRef("WebVR API")}}
+ +

WebVR API on hieno lisä webkehittäjän työkaluihin. Sen avulla WebGL- näkymä (scene) voidaan esittää Oculus Riftin and HTC Viven tapaisissa VR-näytöissä. Mutta miten pääset alkuun VR appsien tekemiseen webbiin? Tämä juttu opastaa sinut perusteisiin.

+ +
+

Huom: WebVR APIn vakain versio — 1.1 — on vasta implementoitu Firefox 55:een (Windowsin release-versio, Mac OS X :ssa vain 'Nightly'), ja sen saa myös Chrome:en käytettäessä Google Daydream -laitteistoa. Speksistä on myös tuoreempi versio — 2.0 — mutta se on kovin keskeneräinen. Lisätietoja viimeisimmästä speksistä löytyy linkistä WebVR Spec Version List.

+
+ +

Aloitus

+ +

Päästäksesi alkuun tarvitset:

+ + + +

Kun laitteisto ja ohjelmistot on asennettu, voit testata, toimiiko kokoonpanosi WebVR:n kanssa tästä linkistä - simple A-Frame demo, ja näet, saadaanko näkymä näkyviin ja pääsetkö VR-moodiin oikean alareunan painikkeella.

+ +

A-Frame on paras vaihtoehto päästä tekemään nopeasti WebVR-yhteensopivia 3D-näkymiä, ilman että tarvitsee ymmärtää rivikaupalla uutta JavaScript -koodia. Se ei kuitenkaan opeta, kuinka raaka WebVR API toimii ja siihen paneudummekin seuraavaksi.

+ +

Demon esittely

+ +

WebVR API :n toiminnan esdittelemiseksi tutustumme puhtaasti webgl:ää sisältävään esimerkkiimme, joka näyttää vähän tältä:

+ +

+ +
+

Huom: Demon lähdekoodi - source code - löytyy GitHubista ja livelinkki siihen on tässä: view it live.

+
+ +
+

Huom: Ellei WebVR ei ala toimia selaimessa, varmista, että sitä ajetaan grafiikkakortin kautta. Esimerkiksi NVIDIA :lla sen omassa ohjauspaneelissa on pikavalikkovalinta Firefox, josta valitaan Run with graphics processor > High-performance NVIDIA processor.

+
+ +

Demossa on kaikkien WebGL-demojen äiti — pyörivä  3D-kuutio. Toteutimme sen puhtaasti WebGL API :n koodilla. Tässä ei käsitellä perus JavaScriptiä tai WebGL:ää, vaan pelkästään WebVR osia.

+ +

Demosta löytyy myös:

+ + + +

Kun tutustut lähdekoodin päätiedostoon - main JavaScript file - löydät WebVR-osat koodista kommenttien "WebVR" tekstien avulla.

+ +
+

Huom: JavaScriptin ja WebGL:n perusteista lisätietoja löytyy tutoriaaleista JavaScript learning material ja WebGL Tutorial.

+
+ +

Miten se toimii?

+ +

Tässä vaiheessa katsotaan koodin WebVR-osien toiminta.

+ +

Tyypillinen (yksinkertainen) WebVR sovellus toimii näin:

+ +
    +
  1. {{domxref("Navigator.getVRDisplays()")}} hakee viittauksen VR-näyttöösi.
    2. +
  2. {{domxref("VRDisplay.requestPresent()")}} :ä käytetään käynnistämään esittäminen VR-näytölle.
    3. +
  3. WebVR:n omaa {{domxref("VRDisplay.requestAnimationFrame()")}} -metodia käytetään suorittamaan sovelluksen renderöintisilmukkaa näytölle sopivalla virkistystaajuudella.
    4. +
  4. Renderöintisilmukassa haet ruudun näyttämiseen vaaditun datan ({{domxref("VRDisplay.getFrameData()")}}), piirrät näytettävän skenen kahdesti — molemmille silmille — ja toimitat renderöidyn näkymän näytölle käyttäjälle näytettäväksi metodilla ({{domxref("VRDisplay.submitFrame()")}}).
    5. +
+ +

Alla olevissa kappaleissa tutustutaan webgl-demoihimme yksityiskohtaisemmin ja nähdään tarkemmin, missä edellä mainittuja ominaisuuksia käytetään.

+ +

Aloitetaan muuttujilla

+ +

Ensimmäinen esimerkki WebVR:n käytöstä näkyy alla olevassa koodissa:

+ +
// WebVR variables
+
+var frameData = new VRFrameData();
+var vrDisplay;
+var btn = document.querySelector('.stop-start');
+var normalSceneFrame;
+var vrSceneFrame;
+
+var poseStatsBtn = document.querySelector('.pose-stats');
+var poseStatsSection = document.querySelector('section');
+poseStatsSection.style.visibility = 'hidden'; // hide it initially
+
+var posStats = document.querySelector('.pos');
+var orientStats = document.querySelector('.orient');
+var linVelStats = document.querySelector('.lin-vel');
+var linAccStats = document.querySelector('.lin-acc');
+var angVelStats = document.querySelector('.ang-vel');
+var angAccStats = document.querySelector('.ang-acc');
+var poseStatsDisplayed = false;
+ +

Lyhyet selitykset ovat siis tarpeen:

+ + + +

VR-näytön hakeminen

+ +

Koodimme tärkeimpiä metodeja on start() — tämä suoritetaan, kun sivun body-osa on ladattu valmiiksi:

+ +
// start
+//
+// Called when the body has loaded is created to get the ball rolling.
+
+document.body.onload = start;
+ +

Aluksistart() hakee webbisivumme - our HTML - {{htmlelement("canvas")}} -osaan renderöitävään 3D-grafiikkaan tarvitun WebGL -ympäristön. Sitten tarkistetaan, että gl -ympäristö on käytettävissä — jos on, suoritetaan muutama metodi näytettävän skenen alustamiseksi.

+ +
function start() {
+  canvas = document.getElementById("glcanvas");
+
+  initWebGL(canvas);      // Initialize the GL context
+
+  // WebGL setup code here
+ +

Seuraavaksi aloitetaan varsinainen näyttöprosessi. Siinä asetetaan canvas-elementti näyttämään selaimen koko näytettävä ala ja suorittamalla renderöintisilmukka(drawScene()) ensimmäisen kerran. Tässä siis ei-WebVR osuus— se normaali renderöintisilmukka.

+ +
    // draw the scene normally, without WebVR - for those who don't have it and want to see the scene in their browser
+
+    canvas.width = window.innerWidth;
+    canvas.height = window.innerHeight;
+    drawScene();
+ +

Seuraavaksi tulee sitten ensimmäinen pala WebVR-koodia. Aluksi tarkistetaan, onko VR-näyttöjä edes käytettävissä {{domxref("Navigator.getVRDisplays")}}  — tästä alkaa API:n käyttö ja tämä on hyvä paikka WebVR:n ominaisuuksien tarkistamiseen. Koodilohkon lopussa (else -osassa) näkyy, että ellei sopivia näyttöjä ole, näytetään viesti, ettei selain tue WebVR 1.1 :ää.

+ +
    // WebVR: Check to see if WebVR is supported
+    if(navigator.getVRDisplays) {
+      console.log('WebVR 1.1 supported');
+ +

if() { ... } koodilohkossa suoritetaan {{domxref("Navigator.getVRDisplays()")}} metodi. Tämä palauttaa promise-olion, jonka sisältönä on lista tietokoneeseen kytketyistä VR-näytöistä. Se on tyhjä, ellei näyttöjä ole..

+ +
      // Then get the displays attached to the computer
+      navigator.getVRDisplays().then(function(displays) {
+ +

Promise-olion then() -lohkossa tarkistetaan, että listan pituus on suurempi kuin 0; näin ollessa asetetaan vrDisplay -muuttujamme arvoksi listan ensimmäisen -indeksistä 0 löytyvän - alkion arvo. vrDisplay sisältää nyt {{domxref("VRDisplay")}} olion, joka vastaa laitteeseen liitettyä näyttöä!

+ +
        // If a display is available, use it to present the scene
+        if(displays.length > 0) {
+          vrDisplay = displays[0];
+          console.log('Display found');
+ +
+

Huom: On epätavallista, että tietokoneeseen olisi kytketty useita VR-näyttöjä, joten tätä yksinkertaista demoa varten usean näytön vaihtoehtoa ei huomioida.

+
+ +

VR-esityksen käynnistys ja pysäytys

+ +

Nyt kun käytössä on {{domxref("VRDisplay")}} olio, sen avulla voidaan tehdä useita juttuja. Seuraavaksi haluamme käynnistää toiminnot WebGL-sisällön näyttämisen aloittamiseksi ja lopettamiseksi.

+ +

Jatkaaksemme edellisestä koodilohkosta, lisäämme käynnistys/pysäytys -painikkeeseemme (btn) tapahtumankuuntelijan (event listener) — ja painiketta klikattaessa halutaan tarkistaa, joko esitys näytölle on käynnissä (toteutus tälle on hieman kökkö ja perustuu painikkeen tekstin, textContent, tutkimiseen).

+ +

Ellei esitys näyttöön ole vielä käynnissä, käytetään {{domxref("VRDisplay.requestPresent()")}} -metodia pyytämään selainta käynnistämään esitys näytölle. Parametrinä metodille annetaan lista {{domxref("VRLayerInit")}} olioita, jotka vastaavat näytettäväksi haluttuja näyttötasoja.

+ +

Koska tällä hetkellä on mahdollista esittää vain yksi näyttötaso, ja ainoa vaadittu olion jäsen on {{domxref("VRLayerInit.source")}} -ominaisuus (joka viittaa tuossa näyttötasossa näytettäväksi tarkoitettuun {{htmlelement("canvas")}} :iin; annetaan muille parametreille järkevät oletusarvot — kts. {{domxref("VRLayerInit.leftBounds", "leftBounds")}} ja {{domxref("VRLayerInit.rightBounds", "rightBounds")}})), parametri on yksinkertaisesti [{ source: canvas }].

+ +

requestPresent() palauttaa promise-olion, joka saa sisällön, kun esittäminen käynnistyy onnistuneesti.

+ +
          // Starting the presentation when the button is clicked: It can only be called in response to a user gesture
+          btn.addEventListener('click', function() {
+            if(btn.textContent === 'Start VR display') {
+              vrDisplay.requestPresent([{ source: canvas }]).then(function() {
+                console.log('Presenting to WebVR display');
+ +

Nyt kun esittämispyyntö oli ok, halutaan seuraavaksi asettaa renderöintisisältö esitettäväksi VR-näytölle. Aivan ensimmäiseksi asetetaan canvas samankokoiseksi VR-näytön näyttöalueen kanssa. Tämä onnistuu hakemalla {{domxref("VREyeParameters")}} molemmille silmille käyttäen metodia {{domxref("VRDisplay.getEyeParameters()")}}.

+ +

Sen jälkeen lasketaan yksinkertaisesti VR-näytön kokonaisala silmän ominaisuuksien {{domxref("VREyeParameters.renderWidth")}} ja {{domxref("VREyeParameters.renderHeight")}} avulla.

+ +
                // Set the canvas size to the size of the vrDisplay viewport
+
+                var leftEye = vrDisplay.getEyeParameters('left');
+                var rightEye = vrDisplay.getEyeParameters('right');
+
+                canvas.width = Math.max(leftEye.renderWidth, rightEye.renderWidth) * 2;
+                canvas.height = Math.max(leftEye.renderHeight, rightEye.renderHeight);
+ +

Seuraavaksi pysäytetään renderöintisilmukka {{domxref("Window.cancelAnimationFrame()", "cancel the animation loop")}}, joka aiemmin käynnistyi {{domxref("Window.requestAnimationFrame()")}} kutsulla drawScene() -metodista ja sen sijaan kutsutaandrawVRScene():ä. Tämä metodi renderöi saman skenen kuin aiempikin käyttäen nyt VR-kohtaisia temppuja. Tämän renderöintisilmukan hallinta on nyt vastaavalla WebVR-versiolla, {{domxref("VRDisplay.requestAnimationFrame")}} -metodilla.

+ +
                // stop the normal presentation, and start the vr presentation
+                window.cancelAnimationFrame(normalSceneFrame);
+                drawVRScene();
+ +

Lopuksi päivitetään painikkeen teksti, jolloin seuraavalla klikkauskerralla painike tuleekin pysäyttämään esityksen VR-näytöllä.

+ +
                btn.textContent = 'Exit VR display';
+              });
+ +


+ VR-näytöllä esittämisen pysäyttämiseksi painikkeen seuraavalla klikkauksella kutsutaan {{domxref("VRDisplay.exitPresent()")}} -metodia. Painikkeen teksti vaihdetaan taas toiseksi ja requestAnimationFrame -kutsut vaihdetaan taas keskenään. Tästä näkyy, että käytetään metodia {{domxref("VRDisplay.cancelAnimationFrame")}} VR-renderöintisilmukan pysäyttämiseen ja normaalin skenen renderöinti käynnistyy drawScene()-metodilla.

+ +
            } else {
+              vrDisplay.exitPresent();
+              console.log('Stopped presenting to WebVR display');
+
+              btn.textContent = 'Start VR display';
+
+              // Stop the VR presentation, and start the normal presentation
+              vrDisplay.cancelAnimationFrame(vrSceneFrame);
+              drawScene();
+            }
+          });
+        }
+      });
+    } else {
+      console.log('WebVR API not supported by this browser.');
+    }
+  }
+}
+ +

Kun esittäminen käynnistyy, selaimessa näkyy stereoskooppinen näkymä:

+ +

+ +

Seuraavasta opitaan, miten stereonäkymä varsinaisesti tehdään.

+ +

Miksi WebVR:llä on oma requestAnimationFrame()?

+ +

Tämä on hyvä kysymys. Perussyy on sulava renderöinti VR-näytössä, joka saadaan aikaan käyttämällä VR-näytön omaa näytönpäivitysnopeutta eikä tietokoneen. VR-näytön päivitysnopeudet ovat tietokonetta suurempia, yleisesti jopa  90fps. Tämä poikkeaa tietokoneen peruspäivitysnopeudesta.

+ +

Huomaa, että kun VR-näytössä ei esitetä, {{domxref("VRDisplay.requestAnimationFrame")}} toimii identtisesti {{domxref("Window.requestAnimationFrame")}}:n kanssa, joten halutessasi voisit käyttää vain yhtä renderöintisilmukkaa tekemämme sovelluksen kahden silmukan sijaan. Sovelluksessa käytetään kahta, koska VR-esityksen ollessa päällä halutaan tehdä hieman eri asioita kuin ilman sitä, ja nämä halutaan selkeyden vuoksi erottaa.

+ +

Renderöinti ja näyttäminen

+ +

Tässä vaiheessa on nähty kaikki koodi, mikä tarvitaan VR-laitteiston hakemiseen, skenen näyttöpyynnön lähettämiseen ja renderöintisilmukan käynnistämiseen. Seuraavaksi kurkataan renderöintisilmukan sisälle ja selitetään, miten sen WebVR-spesifiset osat toimivat.

+ +

Aluksi tarkastellaan renderöintisilmukkametodin  — drawVRScene() määrittelyä. Ensimmäinen tehtävä on kutsua {{domxref("VRDisplay.requestAnimationFrame()")}} -metodia silmukan toiston jatkamiseksi ensimmäisen kutsukerran jälkeen (tämä tehtiin aiemmin koodissa, kun VR-näytölle esittäminen aloitettiin). Tämä metodikutsu asetetaan globaalin vrSceneFrame -muuttujan arvoksi, jotta silmukka saadaan keskeytettyä {{domxref("VRDisplay.cancelAnimationFrame()")}} -metodilla, kun VR-esitys loppuu.

+ +
function drawVRScene() {
+  // WebVR: Request the next frame of the animation
+  vrSceneFrame = vrDisplay.requestAnimationFrame(drawVRScene);
+ +

Seuraavaksi kutsutaan metodia {{domxref("VRDisplay.getFrameData()")}}, joka saa parametriksi muuttujanimen, johon ruudun tiedot halutaan. Tämähän alustettiin jo aiemmin nimellä  frameData. Metodin suorittamisen jälkeen tässä muuttujassa on tarpeelliset tiedot seuraavan ruudun renderöintiin VR -laitteelle pakattuna {{domxref("VRFrameData")}} -olioon. Mukana on tieto projektio- ja näkymämatriiseista, joiden avulla skene saadaan renderöityä oikein vasemmalle ja oikealle silmälle sekä ajantasainen {{domxref("VRPose")}} -olio, jossa on mm. VR-näytön suunta- ja sijaintitiedot.

+ +

Tätä tulee kutsua joka ruudun kohdalla, jotta renderöity näkymä olisi ajantasainen.

+ +
  // Populate frameData with the data of the next frame to display
+  vrDisplay.getFrameData(frameData);
+ +

Seuraavaksi haetaan senhetkinen {{domxref("VRPose")}} ominaisuudesta {{domxref("VRFrameData.pose")}}, tallennetaan sijainti ja suunta myöhempää käyttöä varten ja lähetetään pose-tieto näytettäväksi sivun tilatietoruutuun, siis mikäli poseStatsDisplayed -muuttuja on saanut arvon true.

+ +
  // You can get the position, orientation, etc. of the display from the current frame's pose
+
+  var curFramePose = frameData.pose;
+  var curPos = curFramePose.position;
+  var curOrient = curFramePose.orientation;
+  if(poseStatsDisplayed) {
+    displayPoseStats(curFramePose);
+  }
+ +

  Seuraavaksi canvas:in sisältö tyhjennetään ennen uuden piirron aloittamista, jotta seuraava ruutu piirrettäisiin puhtaalle pohjalle, eikä aiempi ruutu olisi alla sotkemassa:

+ +
  // Clear the canvas before we start drawing on it.
+
+  gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
+ +

Nyt renderöidään molempien silmien näkymä. Aluksi tarvitaan projektion ja näkymän sijainti renderöintiä varten. Nämä ovat {{domxref("WebGLUniformLocation")}} -olioita, jotka on luotu {{domxref("WebGLRenderingContext.getUniformLocation()")}} -metodilla käyttäen parametreinä shader-ohjelman tunnusta ja nimitunnistetta.

+ +
  // WebVR: Create the required projection and view matrix locations needed
+  // for passing into the uniformMatrix4fv methods below
+
+  var projectionMatrixLocation = gl.getUniformLocation(shaderProgram, "projMatrix");
+  var viewMatrixLocation = gl.getUniformLocation(shaderProgram, "viewMatrix");
+ +

Seuraava renderöintivaihe sisältää:

+ + + +
  // WebVR: Render the left eye’s view to the left half of the canvas
+  gl.viewport(0, 0, canvas.width * 0.5, canvas.height);
+  gl.uniformMatrix4fv(projectionMatrixLocation, false, frameData.leftProjectionMatrix);
+  gl.uniformMatrix4fv(viewMatrixLocation, false, frameData.leftViewMatrix);
+  drawGeometry();
+ +

Ja sama oikealle silmälle:

+ +
  // WebVR: Render the right eye’s view to the right half of the canvas
+  gl.viewport(canvas.width * 0.5, 0, canvas.width * 0.5, canvas.height);
+  gl.uniformMatrix4fv(projectionMatrixLocation, false, frameData.rightProjectionMatrix);
+  gl.uniformMatrix4fv(viewMatrixLocation, false, frameData.rightViewMatrix);
+  drawGeometry();
+ +

Seuraavaksi määritelläändrawGeometry() funktio. Suurin osa siitä koostuu tavallisesta WebGL -koodista, jolla saadaan piirrettyä 3D-kuutio. WebVR-spesifisiä osia löytyy mvTranslate() jamvRotate() funktiokutsuista — ne välittävät matriisit WebGL-ohjelmalle, joka määrittää sen hetkiselle ruudulle kuution sijainnin ja kierron.

+ +

Kuten huomaat, näitä arvoja muokataan {{domxref("VRPose")}} -oliolta saaduilla VR-näytön sijainti- (curPos) ja kiertotiedoilla (curOrient). Sen seurauksena esimerkiksi päätä vasemmalle käännettäessä kuvassa näkyvä kuutio siirtyy aivan odotetustikin oikealle, kun  x-sijaintitieto (curPos[0]) ja y-kiertotieto ([curOrient[1]) lisätään x-translaatioarvoon.

+ +

Tämä on 'quick and dirty' -tapa käyttää VR pose-tietoa, mutta se näyttänee kuitenkin perusidean.

+ +
  function drawGeometry() {
+    // Establish the perspective with which we want to view the
+    // scene. Our field of view is 45 degrees, with a width/height
+    // ratio of 640:480, and we only want to see objects between 0.1 units
+    // and 100 units away from the camera.
+
+    perspectiveMatrix = makePerspective(45, 640.0/480.0, 0.1, 100.0);
+
+    // Set the drawing position to the "identity" point, which is
+    // the center of the scene.
+
+    loadIdentity();
+
+    // Now move the drawing position a bit to where we want to start
+    // drawing the cube.
+
+    mvTranslate([
+                  0.0 - (curPos[0] * 25) + (curOrient[1] * 25),
+                  5.0 - (curPos[1] * 25) - (curOrient[0] * 25),
+                  -15.0 - (curPos[2] * 25)
+               ]);
+
+    // Save the current matrix, then rotate before we draw.
+
+    mvPushMatrix();
+    mvRotate(cubeRotation, [0.25, 0, 0.25 - curOrient[2] * 0.5]);
+
+    // Draw the cube by binding the array buffer to the cube's vertices
+    // array, setting attributes, and pushing it to GL.
+
+    gl.bindBuffer(gl.ARRAY_BUFFER, cubeVerticesBuffer);
+    gl.vertexAttribPointer(vertexPositionAttribute, 3, gl.FLOAT, false, 0, 0);
+
+    // Set the texture coordinates attribute for the vertices.
+
+    gl.bindBuffer(gl.ARRAY_BUFFER, cubeVerticesTextureCoordBuffer);
+    gl.vertexAttribPointer(textureCoordAttribute, 2, gl.FLOAT, false, 0, 0);
+
+    // Specify the texture to map onto the faces.
+
+    gl.activeTexture(gl.TEXTURE0);
+    gl.bindTexture(gl.TEXTURE_2D, cubeTexture);
+    gl.uniform1i(gl.getUniformLocation(shaderProgram, "uSampler"), 0);
+
+    // Draw the cube.
+
+    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, cubeVerticesIndexBuffer);
+    setMatrixUniforms();
+    gl.drawElements(gl.TRIANGLES, 36, gl.UNSIGNED_SHORT, 0);
+
+    // Restore the original matrix
+
+    mvPopMatrix();
+  }
+
+ +

Seuraava koodipalanen ei liity mitenkään WebVR:ään — siinä vain kierretään kuutiota joka ruudun osalta:

+ +
  // Update the rotation for the next draw, if it's time to do so.
+
+  var currentTime = (new Date).getTime();
+  if (lastCubeUpdateTime) {
+    var delta = currentTime - lastCubeUpdateTime;
+
+    cubeRotation += (30 * delta) / 1000.0;
+  }
+
+  lastCubeUpdateTime = currentTime;
+ +

Renderöintisilmukan viimeiseen osaan kuuluu {{domxref("VRDisplay.submitFrame()")}} -metodin kutsuminen — kaikki tarpeellinen on nyt tehty ja näyttö on renderöity {{htmlelement("canvas")}} :iin, tämä metodi sitten toimittaa ruudun VR-näytölle, jolloin se ruutu näkyy myös siinä.

+ +
  // WebVR: Indicate that we are ready to present the rendered frame to the VR display
+  vrDisplay.submitFrame();
+}
+ +

Pose (sijainti, kierto, ym.) -tiedon näyttäminen

+ +

Tässä osassa tutustutaan displayPoseStats() -funktioon, joka näyttää kunkin ruudun päivitetyt pose-tiedot. Kyseinen funktio on melko yksinkertainen.

+ +

Aluksi tallennetaan {{domxref("VRPose")}}-oliolta saadut kuusi ominaisuutta omiin muuttujiin — ne ovat tyyppiä {{domxref("Float32Array")}}.

+ +
function displayPoseStats(pose) {
+  var pos = pose.position;
+  var orient = pose.orientation;
+  var linVel = pose.linearVelocity;
+  var linAcc = pose.linearAcceleration;
+  var angVel = pose.angularVelocity;
+  var angAcc = pose.angularAcceleration;
+ +

Sitten tiedot kirjoitetaan tietolaatikkoon ja päivitetään ne joka ruudun kohdalla. Arvot on pyöristetty toFixed() -metodilla luettavuuden vuoksi.

+ +

Huomaa ehtolause lineaarisen ja kulmakiihtyvyyden vektorien arvojen tarkastamisessa - siinä varmistetaan ennen näyttämistä, että arvot on tosiaan saatu luettua. Useimmilta VR-laitteistolta näitä arvoja ei vielä saada, joten ilman tarkistamista seuraisi virhetoiminta (ellei arvoja saada, vektorien arvoksi tulee null).

+ +
  posStats.textContent = 'Position: x ' + pos[0].toFixed(3) + ', y ' + pos[1].toFixed(3) + ', z ' + pos[2].toFixed(3);
+  orientStats.textContent = 'Orientation: x ' + orient[0].toFixed(3) + ', y ' + orient[1].toFixed(3) + ', z ' + orient[2].toFixed(3);
+  linVelStats.textContent = 'Linear velocity: x ' + linVel[0].toFixed(3) + ', y ' + linVel[1].toFixed(3) + ', z ' + linVel[2].toFixed(3);
+  angVelStats.textContent = 'Angular velocity: x ' + angVel[0].toFixed(3) + ', y ' + angVel[1].toFixed(3) + ', z ' + angVel[2].toFixed(3);
+
+  if(linAcc) {
+    linAccStats.textContent = 'Linear acceleration: x ' + linAcc[0].toFixed(3) + ', y ' + linAcc[1].toFixed(3) + ', z ' + linAcc[2].toFixed(3);
+  } else {
+    linAccStats.textContent = 'Linear acceleration not reported';
+  }
+
+  if(angAcc) {
+    angAccStats.textContent = 'Angular acceleration: x ' + angAcc[0].toFixed(3) + ', y ' + angAcc[1].toFixed(3) + ', z ' + angAcc[2].toFixed(3);
+  } else {
+    angAccStats.textContent = 'Angular acceleration not reported';
+  }
+}
+ +

WebVR -tapahtumat

+ +

The WebVR spesifikaatiossa on määritetty useita liipaistavia tapahtumia (event), ja näin koodilla voidaan reagoida VR-näytön tilan muutoksiin (vrt. Window events). Esimerkiksi:

+ + + +

Demossa on seuraava esimerkki tapahtumista:

+ +
window.addEventListener('vrdisplaypresentchange', function(e) {
+  console.log('Display ' + e.display.displayId + ' presentation has changed. Reason given: ' + e.reason + '.');
+});
+ +

Kuten näet {{domxref("VRDisplayEvent", "event object")}} tarjoaa kaksi hyödyllistä ominaisuutta — {{domxref("VRDisplayEvent.display")}}, joka viittaa {{domxref("VRDisplay")}} tapahtuman tuottajaan, ja {{domxref("VRDisplayEvent.reason")}}, jossa on selkokielinen syy tapahtumaan.

+ +

Tämä on hyvin käyttökelpoinen tapahtuma; sitä voidaan käyttää huomaan yllättävä näytön irrotus, joka estäää tarpeettomat virheviestit ja kertoo tilanteen käyttäjälle. Googlen Webvr.info -esitysdemossa tapahtumaa käytetään suorittamaan onVRPresentChange() funktio, joka päivittää käyttöliittymän kontrollit tilannetta vastaaviksi ja muuttaa canvasin kokoa.

+ +

Yhteenveto

+ +

Tässä artikkelissa kerrottiin hyvin yksinkertaisen WebVR 1.1 sovelluksen tekemisestä, jonka avulla pääset alkuun sovellusten kehittämisessä.

diff --git a/files/fi/web/api/window/index.html b/files/fi/web/api/window/index.html new file mode 100644 index 0000000000..70b807464b --- /dev/null +++ b/files/fi/web/api/window/index.html @@ -0,0 +1,509 @@ +--- +title: Window +slug: Web/API/Window +tags: + - API + - DOM + - Interface + - JavaScript + - NeedsTranslation + - Reference + - Tab + - TopicStub + - Window +translation_of: Web/API/Window +--- +
{{APIRef("DOM")}}
+ +

The Window interface represents a window containing a DOM document; the document property points to the DOM document loaded in that window. A window for a given document can be obtained using the {{domxref("document.defaultView")}} property.

+ +

A global variable, window, representing the window in which the script is running, is exposed to JavaScript code.

+ +

The Window interface is home to a variety of functions, namespaces, objects, and constructors which are not necessarily directly associated with the concept of a user interface window. However, the Window interface is a suitable place to include these items that need to be globally available. Many of these are documented in the  JavaScript Reference and the DOM Reference.

+ +

In a tabbed browser, each tab is represented by its own Window object; the global window seen by JavaScript code running within a given tab always represents the tab in which the code is running. That said, even in a tabbed browser, some properties and methods still apply to the overall window that contains the tab, such as {{Domxref("Window.resizeTo", "resizeTo()")}} and {{Domxref("Window.innerHeight", "innerHeight")}}. Generally, anything that can't reasonably pertain to a tab pertains to the window instead.

+ +

{{InheritanceDiagram}}

+ +

Properties

+ +

This interface inherits properties from the {{domxref("EventTarget")}} interface and implements properties from the {{domxref("WindowOrWorkerGlobalScope")}} and {{domxref("WindowEventHandlers")}} mixins.

+ +

Note that properties which are objects (e.g.,. for overriding the prototype of built-in elements) are listed in a separate section below.

+ +
+
{{domxref("Window.closed")}} {{Non-standard_inline}} {{readOnlyInline}}
+
This property indicates whether the current window is closed or not.
+
{{domxref("Window.console")}} {{ReadOnlyInline}}
+
Returns a reference to the console object which provides access to the browser's debugging console.
+
{{domxref("Window.content")}} and Window._content {{Non-standard_inline}} {{obsolete_inline}} {{ReadOnlyInline}}
+
Returns a reference to the content element in the current window. Since Firefox 57 (initially Nightly-only), both versions are only available from chrome (privileged) code, and not available to the web anymore.
+
{{domxref("Window.controllers")}} {{non-standard_inline}} {{ReadOnlyInline}}
+
Returns the XUL controller objects for the current chrome window.
+
{{domxref("Window.customElements")}} {{ReadOnlyInline}}
+
returns a reference to the {{domxref("CustomElementRegistry")}} object, which can be used to register new custom elements and get information about previously registered custom elements.
+
{{domxref("Window.crypto")}} {{readOnlyInline}}
+
Returns the browser crypto object.
+
{{domxref("Window.defaultStatus")}} {{Obsolete_inline("gecko23")}}
+
Gets/sets the status bar text for the given window.
+
{{domxref("Window.devicePixelRatio")}} {{non-standard_inline}} {{ReadOnlyInline}}
+
Returns the ratio between physical pixels and device independent pixels in the current display.
+
{{domxref("Window.dialogArguments")}} {{Fx_minversion_inline(3)}} {{ReadOnlyInline}}
+
Gets the arguments passed to the window (if it's a dialog box) at the time {{domxref("window.showModalDialog()")}} was called. This is an {{Interface("nsIArray")}}.
+
{{domxref("Window.directories")}} {{obsolete_inline}}
+
Synonym of {{domxref("window.personalbar")}}
+
{{domxref("Window.document")}} {{ReadOnlyInline}}
+
Returns a reference to the document that the window contains.
+
{{domxref("Window.DOMMatrix")}} {{readOnlyInline}} {{experimental_inline}}
+
Returns a reference to a {{domxref("DOMMatrix")}} object, which represents 4x4 matrices, suitable for 2D and 3D operations.
+
{{domxref("Window.DOMMatrixReadOnly")}} {{readOnlyInline}} {{experimental_inline}}
+
Returns a reference to a {{domxref("DOMMatrixReadOnly")}} object, which represents 4x4 matrices, suitable for 2D and 3D operations.
+
{{domxref("Window.DOMPoint")}} {{readOnlyInline}} {{experimental_inline}}
+
Returns a reference to a {{domxref("DOMPoint")}} object, which represents a 2D or 3D point in a coordinate system.
+
{{domxref("Window.DOMPointReadOnly")}} {{readOnlyInline}} {{experimental_inline}}
+
Returns a reference to a {{domxref("DOMPointReadOnly")}} object, which represents a 2D or 3D point in a coordinate system.
+
{{domxref("Window.DOMQuad")}} {{readOnlyInline}} {{experimental_inline}}
+
Returns a reference to a {{domxref("DOMQuad")}} object, which provides represents a quadrilaterial object, that is one having four corners and four sides.
+
{{domxref("Window.DOMRect")}} {{readOnlyInline}} {{experimental_inline}}
+
Returns a reference to a {{domxref("DOMRect")}} object, which represents a rectangle.
+
{{domxref("Window.DOMRectReadOnly")}} {{readOnlyInline}} {{experimental_inline}}
+
Returns a reference to a {{domxref("DOMRectReadOnly")}} object, which represents a rectangle.
+
{{domxref("Window.event")}} {{ReadOnlyInline}}
+
Returns the current event, which is the event currently being handled by the JavaScript code's context, or undefined if no event is currently being handled. The {{domxref("Event")}} object passed directly to event handlers should be used instead whenever possible.
+
{{domxref("Window.frameElement")}} {{readOnlyInline}}
+
Returns the element in which the window is embedded, or null if the window is not embedded.
+
{{domxref("Window.frames")}} {{readOnlyInline}}
+
Returns an array of the subframes in the current window.
+
{{domxref("Window.fullScreen")}} {{gecko_minversion_inline("1.9")}}
+
This property indicates whether the window is displayed in full screen or not.
+
{{domxref("Window.globalStorage")}} {{gecko_minversion_inline("1.8.1")}} {{Non-standard_inline}} {{Obsolete_inline("gecko13")}}
+
Unsupported since Gecko 13 (Firefox 13). Use {{domxref("Window.localStorage")}} instead.
+ Was: Multiple storage objects that are used for storing data across multiple pages.
+
{{domxref("Window.history")}} {{ReadOnlyInline}}
+
Returns a reference to the history object.
+
{{domxref("Window.innerHeight")}} {{readOnlyInline}}
+
Gets the height of the content area of the browser window including, if rendered, the horizontal scrollbar.
+
{{domxref("Window.innerWidth")}} {{readOnlyInline}}
+
Gets the width of the content area of the browser window including, if rendered, the vertical scrollbar.
+
{{domxref("Window.isSecureContext")}} {{experimental_inline}} {{readOnlyInline}}
+
Indicates whether a context is capable of using features that require secure contexts.
+
{{domxref("Window.length")}} {{readOnlyInline}}
+
Returns the number of frames in the window. See also {{domxref("window.frames")}}.
+
{{domxref("Window.location")}}
+
Gets/sets the location, or current URL, of the window object.
+
{{domxref("Window.locationbar")}} {{ReadOnlyInline}}
+
Returns the locationbar object, whose visibility can be toggled in the window.
+
{{domxref("Window.localStorage")}} {{readOnlyInline}} {{gecko_minversion_inline("1.9.1")}}
+
Returns a reference to the local storage object used to store data that may only be accessed by the origin that created it.
+
{{domxref("Window.menubar")}} {{ReadOnlyInline}}
+
Returns the menubar object, whose visibility can be toggled in the window.
+
{{domxref("Window.messageManager")}} {{gecko_minversion_inline("2.0")}}
+
Returns the message manager object for this window.
+
{{domxref("Window.mozAnimationStartTime")}} {{ReadOnlyInline}} {{gecko_minversion_inline("2.0")}} {{Deprecated_inline}}
+
The time in milliseconds since epoch at which the current animation cycle began. Use {{domxref("Animation.startTime")}} instead.
+
{{domxref("Window.mozInnerScreenX")}} {{ReadOnlyInline}} {{non-standard_inline}} {{gecko_minversion_inline("1.9.2")}}
+
Returns the horizontal (X) coordinate of the top-left corner of the window's viewport, in screen coordinates. This value is reported in CSS pixels. See mozScreenPixelsPerCSSPixel in {{interface("nsIDOMWindowUtils")}} for a conversion factor to adapt to screen pixels if needed.
+
{{domxref("Window.mozInnerScreenY")}} {{ReadOnlyInline}} {{non-standard_inline}} {{gecko_minversion_inline("1.9.2")}}
+
Returns the vertical (Y) coordinate of the top-left corner of the window's viewport, in screen coordinates. This value is reported in CSS pixels. See mozScreenPixelsPerCSSPixel for a conversion factor to adapt to screen pixels if needed.
+
{{domxref("Window.mozPaintCount")}} {{non-standard_inline}} {{ReadOnlyInline}} {{gecko_minversion_inline("2.0")}}
+
Returns the number of times the current document has been rendered to the screen in this window. This can be used to compute rendering performance.
+
{{domxref("Window.name")}}
+
Gets/sets the name of the window.
+
{{domxref("Window.navigator")}} {{readOnlyInline}}
+
Returns a reference to the navigator object.
+
{{domxref("Window.opener")}}
+
Returns a reference to the window that opened this current window.
+
{{domxref("Window.orientation")}} {{non-standard_inline}} {{deprecated_inline}} {{readOnlyInline}}
+
Returns the orientation in degrees (in 90 degree increments) of the viewport relative to the device's natural orientation.
+
{{domxref("Window.outerHeight")}} {{readOnlyInline}}
+
Gets the height of the outside of the browser window.
+
{{domxref("Window.outerWidth")}} {{readOnlyInline}}
+
Gets the width of the outside of the browser window.
+
{{domxref("Window.scrollX","Window.pageXOffset")}} {{readOnlyInline}}
+
An alias for {{domxref("window.scrollX")}}.
+
{{domxref("Window.scrollY","Window.pageYOffset")}} {{readOnlyInline}}
+
An alias for {{domxref("window.scrollY")}}
+
{{domxref("Window.parent")}} {{readOnlyInline}}
+
Returns a reference to the parent of the current window or subframe.
+
{{domxref("Window.performance")}} {{readOnlyInline}}
+
Returns a {{domxref("Performance")}} object, which includes the {{domxref("Performance.timing", "timing")}} and {{domxref("Performance.navigation", "navigation")}} attributes, each of which is an object providing performance-related data. See also Using Navigation Timing for additional information and examples.
+
{{domxref("Window.personalbar")}} {{readOnlyInline}}
+
Returns the personalbar object, whose visibility can be toggled in the window.
+
{{domxref("Window.pkcs11")}} {{obsolete_inline(29)}}
+
Formerly provided access to install and remove PKCS11 modules.
+
{{domxref("Window.returnValue")}} {{Fx_minversion_inline(3)}}
+
The return value to be returned to the function that called {{domxref("window.showModalDialog()")}} to display the window as a modal dialog.
+
{{domxref("Window.screen")}} {{readOnlyInline}}
+
Returns a reference to the screen object associated with the window.
+ +
{{domxref("Window.screenX")}} {{readOnlyInline}}
+
Returns the horizontal distance of the left border of the user's browser from the left side of the screen.
+
{{domxref("Window.screenY")}} {{readOnlyInline}}
+
Returns the vertical distance of the top border of the user's browser from the top side of the screen.
+
{{domxref("Window.scrollbars")}} {{readOnlyInline}}
+
Returns the scrollbars object, whose visibility can be toggled in the window.
+
{{domxref("Window.scrollMaxX")}} {{non-standard_inline}} {{ReadOnlyInline}}
+
The maximum offset that the window can be scrolled to horizontally, that is the document width minus the viewport width.
+
{{domxref("Window.scrollMaxY")}} {{non-standard_inline}} {{ReadOnlyInline}}
+
The maximum offset that the window can be scrolled to vertically (i.e., the document height minus the viewport height).
+
{{domxref("Window.scrollX")}} {{readOnlyInline}}
+
Returns the number of pixels that the document has already been scrolled horizontally.
+
{{domxref("Window.scrollY")}} {{readOnlyInline}}
+
Returns the number of pixels that the document has already been scrolled vertically.
+
{{domxref("Window.self")}} {{ReadOnlyInline}}
+
Returns an object reference to the window object itself.
+
{{domxref("Window.sessionStorage")}}
+
Returns a reference to the session storage object used to store data that may only be accessed by the origin that created it.
+
{{domxref("Window.sidebar")}} {{non-standard_inline}} {{ReadOnlyInline}}
+
Returns a reference to the window object of the sidebar.
+
{{domxref("Window.speechSynthesis")}} {{ReadOnlyInline}}
+
Returns a {{domxref("SpeechSynthesis")}} object, which is the entry point into using Web Speech API speech synthesis functionality.
+
{{domxref("Window.status")}}
+
Gets/sets the text in the statusbar at the bottom of the browser.
+
{{domxref("Window.statusbar")}} {{readOnlyInline}}
+
Returns the statusbar object, whose visibility can be toggled in the window.
+
{{domxref("Window.toolbar")}} {{readOnlyInline}}
+
Returns the toolbar object, whose visibility can be toggled in the window.
+
{{domxref("Window.top")}} {{readOnlyInline}}
+
Returns a reference to the topmost window in the window hierarchy. This property is read only.
+
{{domxref("Window.visualViewport")}} {{readOnlyInline}}
+
Returns a {{domxref("VisualViewport")}} object which represents the visual viewport for a given window.
+
{{domxref("Window.window")}} {{ReadOnlyInline}}
+
Returns a reference to the current window.
+
window[0], window[1], etc.
+
Returns a reference to the window object in the frames. See {{domxref("Window.frames")}} for more details.
+
+ +

Properties implemented from elsewhere

+ +
+
{{domxref("WindowOrWorkerGlobalScope.caches")}} {{readOnlyinline}}
+
Returns the {{domxref("CacheStorage")}} object associated with the current context. This object enables functionality such as storing assets for offline use, and generating custom responses to requests.
+
{{domxref("WindowOrWorkerGlobalScope.indexedDB")}} {{readonlyInline}}
+
Provides a mechanism for applications to asynchronously access capabilities of indexed databases; returns an {{domxref("IDBFactory")}} object.
+
{{domxref("WindowOrWorkerGlobalScope.isSecureContext")}} {{readOnlyinline}}
+
Returns a boolean indicating whether the current context is secure (true) or not (false).
+
{{domxref("WindowOrWorkerGlobalScope.origin")}} {{readOnlyinline}}
+
Returns the global object's origin, serialized as a string. (This does not yet appear to be implemented in any browser.)
+
+ +

Methods

+ +

This interface inherits methods from the {{domxref("EventTarget")}} interface and implements methods from {{domxref("WindowOrWorkerGlobalScope")}} and {{domxref("EventTarget")}}.

+ +
+
{{domxref("Window.alert()")}}
+
Displays an alert dialog.
+ +
{{domxref("Window.back()")}} {{Non-standard_inline}} {{obsolete_inline}}
+
Moves back one in the window history. This method is obsolete; you should instead use {{domxref("History.back", "window.history.back()")}}.
+
{{domxref("Window.blur()")}}
+
Sets focus away from the window.
+
{{domxref("Window.cancelAnimationFrame()")}} {{experimental_inline}}
+
Enables you to cancel a callback previously scheduled with {{domxref("Window.requestAnimationFrame")}}.
+
{{domxref("Window.cancelIdleCallback()")}} {{experimental_inline}}
+
Enables you to cancel a callback previously scheduled with {{domxref("Window.requestIdleCallback")}}.
+
{{domxref("Window.captureEvents()")}} {{Deprecated_inline}}
+
Registers the window to capture all events of the specified type.
+
{{domxref("Window.clearImmediate()")}}
+
Cancels the repeated execution set using setImmediate.
+
{{domxref("Window.close()")}}
+
Closes the current window.
+
{{domxref("Window.confirm()")}}
+
Displays a dialog with a message that the user needs to respond to.
+
{{domxref("Window.disableExternalCapture()")}} {{obsolete_inline(24)}}
+
{{todo("NeedsContents")}}
+
{{domxref("Window.dispatchEvent()")}}
+
Used to trigger an event.
+
{{domxref("Window.dump()")}} {{Non-standard_inline}}
+
Writes a message to the console.
+
{{domxref("Window.enableExternalCapture()")}} {{obsolete_inline(24)}}
+
{{todo("NeedsContents")}}
+
{{domxref("Window.find()")}}
+
Searches for a given string in a window.
+
{{domxref("Window.focus()")}}
+
Sets focus on the current window.
+
{{domxref("Window.forward()")}} {{Non-standard_inline}} {{obsolete_inline}}
+
Moves the window one document forward in the history. This method is obsolete; you should instead use {{domxref("History.forward", "window.history.forward()")}}.
+
{{domxref("Window.getAttention()")}} {{Non-standard_inline}} {{obsolete_inline}}
+
Flashes the application icon.
+
{{domxref("Window.getAttentionWithCycleCount()")}}
+
{{todo("NeedsContents")}}
+
{{domxref("Window.getComputedStyle()")}}
+
Gets computed style for the specified element. Computed style indicates the computed values of all CSS properties of the element.
+
{{domxref("Window.getDefaultComputedStyle()")}} {{Non-standard_inline}}
+
Gets default computed style for the specified element, ignoring author stylesheets.
+
{{domxref("Window.getSelection()")}}
+
Returns the selection object representing the selected item(s).
+
{{domxref("Window.home()")}} {{Non-standard_inline}} {{obsolete_inline}}
+
Returns the browser to the home page.
+
{{domxref("Window.matchMedia()")}} {{gecko_minversion_inline("6.0")}}
+
Returns a {{domxref("MediaQueryList")}} object representing the specified media query string.
+
{{domxref("Window.maximize()")}}
+
{{todo("NeedsContents")}}
+
{{domxref("Window.minimize()")}} (top-level XUL windows only)
+
Minimizes the window.
+
{{domxref("Window.moveBy()")}}
+
Moves the current window by a specified amount.
+
{{domxref("Window.moveTo()")}}
+
Moves the window to the specified coordinates.
+
{{domxref("Window.open()")}}
+
Opens a new window.
+
{{domxref("Window.openDialog()")}} {{Non-standard_inline}} {{obsolete_inline}}
+
Opens a new dialog window.
+
{{domxref("Window.postMessage()")}} {{Fx_minversion_inline(3)}}
+
Provides a secure means for one window to send a string of data to another window, which need not be within the same domain as the first.
+
{{domxref("Window.print()")}}
+
Opens the Print Dialog to print the current document.
+
{{domxref("Window.prompt()")}}
+
Returns the text entered by the user in a prompt dialog.
+
{{domxref("Window.releaseEvents()")}} {{Non-standard_inline}} {{Deprecated_inline}}
+
Releases the window from trapping events of a specific type.
+
{{domxref("Window.requestAnimationFrame()")}} {{gecko_minversion_inline("2.0")}}
+
Tells the browser that an animation is in progress, requesting that the browser schedule a repaint of the window for the next animation frame.
+
{{domxref("Window.requestIdleCallback()")}}  {{experimental_inline}}
+
Enables the scheduling of tasks during a browser's idle periods.
+
{{domxref("Window.resizeBy()")}}
+
Resizes the current window by a certain amount.
+
{{domxref("Window.resizeTo()")}}
+
Dynamically resizes window.
+
{{domxref("Window.restore()")}} {{Non-standard_inline}} {{obsolete_inline}}
+
{{todo("NeedsContents")}}
+
{{domxref("Window.routeEvent()")}} {{obsolete_inline(24)}}
+
{{todo("NeedsContents")}}
+
{{domxref("Window.scroll()")}}
+
Scrolls the window to a particular place in the document.
+
{{domxref("Window.scrollBy()")}}
+
Scrolls the document in the window by the given amount.
+
{{domxref("Window.scrollByLines()")}} {{Non-standard_inline}}
+
Scrolls the document by the given number of lines.
+
{{domxref("Window.scrollByPages()")}} {{Non-standard_inline}}
+
Scrolls the current document by the specified number of pages.
+
{{domxref("Window.scrollTo()")}}
+
Scrolls to a particular set of coordinates in the document.
+
{{domxref("Window.setCursor()")}} {{Non-standard_inline}} (top-level XUL windows only)
+
Changes the cursor for the current window
+
{{domxref("Window.setImmediate()")}}
+
Executes a function after the browser has finished other heavy tasks
+
{{domxref("Window.setResizable()")}} {{Non-standard_inline}}
+
Toggles a user's ability to resize a window.
+
{{domxref("Window.sizeToContent()")}} {{Non-standard_inline}}
+
Sizes the window according to its content.
+
{{domxref("Window.stop()")}}
+
This method stops window loading.
+
{{domxref("Window.updateCommands()")}} {{Non-standard_inline}}
+
Updates the state of commands of the current chrome window (UI).
+
+ +

Methods implemented from elsewhere

+ +
+
{{domxref("EventTarget.addEventListener()")}}
+
Register an event handler to a specific event type on the window.
+
{{domxref("WindowOrWorkerGlobalScope.atob()")}}
+
Decodes a string of data which has been encoded using base-64 encoding.
+
{{domxref("WindowOrWorkerGlobalScope.btoa()")}}
+
Creates a base-64 encoded ASCII string from a string of binary data.
+
{{domxref("WindowOrWorkerGlobalScope.clearInterval()")}}
+
Cancels the repeated execution set using {{domxref("WindowOrWorkerGlobalScope.setInterval()")}}.
+
{{domxref("WindowOrWorkerGlobalScope.clearTimeout()")}}
+
Cancels the delayed execution set using {{domxref("WindowOrWorkerGlobalScope.setTimeout()")}}.
+
{{domxref("WindowOrWorkerGlobalScope.createImageBitmap()")}}
+
Accepts a variety of different image sources, and returns a {{domxref("Promise")}} which resolves to an {{domxref("ImageBitmap")}}. Optionally the source is cropped to the rectangle of pixels originating at (sx, sy) with width sw, and height sh.
+
{{domxref("WindowOrWorkerGlobalScope.fetch()")}}
+
Starts the process of fetching a resource from the network.
+
{{domxref("EventTarget.removeEventListener")}}
+
Removes an event listener from the window.
+
{{domxref("WindowOrWorkerGlobalScope.setInterval()")}}
+
Schedules a function to execute every time a given number of milliseconds elapses.
+
{{domxref("WindowOrWorkerGlobalScope.setTimeout()")}}
+
Schedules a function to execute in a given amount of time.
+
+ +

Obsolete methods

+ +
+
{{domxref("Window.showModalDialog()")}} {{obsolete_inline}}
+
Displays a modal dialog. This method was removed completely in Chrome 43, and Firefox 55.
+
+ +

Event handlers

+ +

These are properties of the window object that can be set to establish event handlers for the various things that can happen in the window that might be of interest.

+ +

This interface inherits event handlers from the {{domxref("EventTarget")}} interface and implements event handlers from {{domxref("WindowEventHandlers")}}.

+ +
+

Note: Starting in {{Gecko("9.0")}}, you can now use the syntax if ("onabort" in window) to determine whether or not a given event handler property exists. This is because event handler interfaces have been updated to be proper web IDL interfaces. See DOM event handlers for details.

+
+ +
+
{{domxref("Window.onappinstalled")}}
+
Called when the page is installed as a webapp. See {{event('appinstalled')}} event.
+
{{domxref("Window.onbeforeinstallprompt")}}
+
An event handler property dispatched before a user is prompted to save a web site to a home screen on mobile.
+
{{domxref("Window.ondevicelight")}}
+
An event handler property for any ambient light levels changes
+
{{domxref("Window.ondevicemotion")}} {{gecko_minversion_inline("6.0")}}
+
Called if accelerometer detects a change (For mobile devices)
+
{{domxref("Window.ondeviceorientation")}} {{gecko_minversion_inline("6.0")}}
+
Called when the orientation is changed (For mobile devices)
+
{{domxref("Window.ondeviceorientationabsolute")}} {{non-standard_inline}} Chrome only
+
An event handler property for any device orientation changes.
+
{{domxref("Window.ondeviceproximity")}}
+
An event handler property for device proximity event
+
{{domxref("Window.ongamepadconnected")}}
+
Represents an event handler that will run when a gamepad is connected (when the {{event('gamepadconnected')}} event fires).
+
{{domxref("Window.ongamepaddisconnected")}}
+
Represents an event handler that will run when a gamepad is disconnected (when the {{event('gamepaddisconnected')}} event fires).
+
{{domxref("Window.onmozbeforepaint")}} {{gecko_minversion_inline("2.0")}}
+
An event handler property for the MozBeforePaint event, which is sent before repainting the window if the event has been requested by a call to the {{domxref("Window.mozRequestAnimationFrame()")}} method.
+
{{domxref("Window.onpaint")}}
+
An event handler property for paint events on the window.
+
{{domxref("Window.onrejectionhandled")}} {{experimental_inline}}
+
An event handler for handled {{jsxref("Promise")}} rejection events.
+
{{domxref("Window.onuserproximity")}}
+
An event handler property for user proximity events.
+
{{domxref("Window.onvrdisplayconnect")}}
+
Represents an event handler that will run when a compatible VR device has been connected to the computer (when the {{event("vrdisplayconnected")}} event fires).
+
{{domxref("Window.onvrdisplaydisconnect")}}
+
Represents an event handler that will run when a compatible VR device has been disconnected from the computer (when the {{event("vrdisplaydisconnected")}} event fires).
+
{{domxref("Window.onvrdisplayactivate")}}
+
Represents an event handler that will run when a display is able to be presented to (when the {{event("vrdisplayactivate")}} event fires), for example if an HMD has been moved to bring it out of standby, or woken up by being put on.
+
{{domxref("Window.onvrdisplaydeactivate")}}
+
Represents an event handler that will run when a display can no longer be presented to (when the {{event("vrdisplaydeactivate")}} event fires), for example if an HMD has gone into standby or sleep mode due to a period of inactivity.
+
{{domxref("Window.onvrdisplayblur")}}
+
Represents an event handler that will run when presentation to a display has been paused for some reason by the browser, OS, or VR hardware (when the {{event("vrdisplayblur")}} event fires) — for example, while the user is interacting with a system menu or browser, to prevent tracking or loss of experience.
+
{{domxref("Window.onvrdisplayfocus")}}
+
Represents an event handler that will run when presentation to a display has resumed after being blurred (when the {{event("vrdisplayfocus")}} event fires).
+
{{domxref("Window.onvrdisplaypresentchange")}}
+
represents an event handler that will run when the presenting state of a VR device changes — i.e. goes from presenting to not presenting, or vice versa (when the {{event("vrdisplaypresentchange")}} event fires).
+
+ +

Event handlers implemented from elsewhere

+ +
+
{{domxref("GlobalEventHandlers.onabort")}}
+
Called when the loading of a resource has been aborted, such as by a user canceling the load while it is still in progress
+
{{domxref("WindowEventHandlers.onafterprint")}}
+
Called when the print dialog box is closed. See {{event("afterprint")}} event.
+
{{domxref("WindowEventHandlers.onbeforeprint")}}
+
Called when the print dialog box is opened. See {{event("beforeprint")}} event.
+
{{domxref("WindowEventHandlers.onbeforeunload")}}
+
An event handler property for before-unload events on the window.
+
{{domxref("GlobalEventHandlers.onblur")}}
+
Called after the window loses focus, such as due to a popup.
+
{{domxref("GlobalEventHandlers.onchange")}}
+
An event handler property for change events on the window.
+
{{domxref("GlobalEventHandlers.onclick")}}
+
Called after the ANY mouse button is pressed & released
+
{{domxref("GlobalEventHandlers.ondblclick")}}
+
Called when a double click is made with ANY mouse button.
+
{{domxref("GlobalEventHandlers.onclose")}}
+
Called after the window is closed
+
{{domxref("GlobalEventHandlers.oncontextmenu")}}
+
Called when the RIGHT mouse button is pressed
+
{{domxref("GlobalEventHandlers.onerror")}}
+
Called when a resource fails to load OR when an error occurs at runtime. See {{event("error")}} event.
+
{{domxref("GlobalEventHandlers.onfocus")}}
+
Called after the window receives or regains focus. See {{event("focus")}} events.
+
{{domxref("WindowEventHandlers.onhashchange")}} {{gecko_minversion_inline("1.9.2")}}
+
An event handler property for {{event('hashchange')}} events on the window; called when the part of the URL after the hash mark ("#") changes.
+
{{domxref("GlobalEventHandlers.oninput")}}
+
Called when the value of an <input> element changes
+
{{domxref("GlobalEventHandlers.onkeydown")}}
+
Called when you begin pressing ANY key. See {{event("keydown")}} event.
+
{{domxref("GlobalEventHandlers.onkeypress")}}
+
Called when a key (except Shift, Fn, and CapsLock) is in pressed position. See {{event("keypress")}} event.
+
{{domxref("GlobalEventHandlers.onkeyup")}}
+
Called when you finish releasing ANY key. See {{event("keyup")}} event.
+
{{domxref("WindowEventHandlers.onlanguagechange")}}
+
An event handler property for {{event("languagechange")}} events on the window.
+
{{domxref("GlobalEventHandlers.onload")}}
+
Called after all resources and the DOM are fully loaded. WILL NOT get called when the page is loaded from cache, such as with back button.
+
{{domxref("WindowEventHandlers.onmessage")}}
+
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("message")}} event is raised.
+
{{domxref("GlobalEventHandlers.onmousedown")}}
+
Called when ANY mouse button is pressed.
+
{{domxref("GlobalEventHandlers.onmousemove")}}
+
Called continously when the mouse is moved inside the window.
+
{{domxref("GlobalEventHandlers.onmouseout")}}
+
Called when the pointer leaves the window.
+
{{domxref("GlobalEventHandlers.onmouseover")}}
+
Called when the pointer enters the window
+
{{domxref("GlobalEventHandlers.onmouseup")}}
+
Called when ANY mouse button is released
+
{{domxref("WindowEventHandlers.onoffline")}}
+
Called when network connection is lost. See {{event("offline")}} event.
+
{{domxref("WindowEventHandlers.ononline")}}
+
Called when network connection is established. See {{event("online")}} event.
+
{{domxref("WindowEventHandlers.onpagehide")}}
+
Called when the user navigates away from the page, before the onunload event. See {{event("pagehide")}} event.
+
{{domxref("WindowEventHandlers.onpageshow")}}
+
Called after all resources and the DOM are fully loaded. See {{event("pageshow")}} event.
+
{{domxref("WindowEventHandlers.onpopstate")}} {{gecko_minversion_inline("2.0")}}
+
Called when a back button is pressed.
+
{{domxref("GlobalEventHandlers.onreset")}}
+
Called when a form is reset
+
{{domxref("GlobalEventHandlers.onresize")}}
+
Called continuously as you are resizing the window.
+
{{domxref("GlobalEventHandlers.onscroll")}}
+
Called when the scroll bar is moved via ANY means. If the resource fully fits in the window, then this event cannot be invoked
+
{{domxref("GlobalEventHandlers.onwheel")}}
+
Called when the mouse wheel is rotated around any axis
+
{{domxref("GlobalEventHandlers.onselect")}}
+
Called after text in an input field is selected
+
{{domxref("GlobalEventHandlers.onselectionchange")}}
+
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("selectionchange")}} event is raised.
+
{{domxref("WindowEventHandlers.onstorage")}}
+
Called when there is a change in session storage or local storage. See {{event("storage")}} event
+
{{domxref("GlobalEventHandlers.onsubmit")}}
+
Called when a form is submitted
+
{{domxref("WindowEventHandlers.onunhandledrejection")}} {{experimental_inline}}
+
An event handler for unhandled {{jsxref("Promise")}} rejection events.
+
{{domxref("WindowEventHandlers.onunload")}}
+
Called when the user navigates away from the page.
+
+ +

Constructors

+ +

See also the DOM Interfaces.

+ +
+
{{domxref("DOMParser")}}
+
DOMParser can parse XML or HTML source stored in a string into a DOM Document. DOMParser is specified in DOM Parsing and Serialization.
+
{{domxref("Window.GeckoActiveXObject")}}
+
{{todo("NeedsContents")}}
+
{{domxref("Image")}}
+
Used for creating an {{domxref("HTMLImageElement")}}.
+
{{domxref("Option")}}
+
Used for creating an {{domxref("HTMLOptionElement")}}
+
{{domxref("Window.QueryInterface")}}
+
{{todo("NeedsContents")}}
+
{{domxref("Window.StaticRange")}} {{experimental_inline}} {{readonlyinline}}
+
Returns a {{domxref('StaticRange.StaticRange','StaticRange()')}} constructor which creates a {{domxref('StaticRange')}} object.
+
{{domxref("Worker")}}
+
Used for creating a Web worker
+
{{domxref("Window.XMLSerializer")}}
+
{{todo("NeedsContents")}}
+
{{domxref("Window.XPCNativeWrapper")}}
+
{{todo("NeedsContents")}}
+
{{domxref("Window.XPCSafeJSObjectWrapper")}}
+
{{todo("NeedsContents")}}
+
+ +

Interfaces

+ +

See DOM Reference

+ +

Browser compatibility

+ + + +

{{Compat("api.Window")}}

+ +

See also

+ + diff --git a/files/fi/web/guide/events/index.html b/files/fi/web/guide/events/index.html new file mode 100644 index 0000000000..0196a78f5a --- /dev/null +++ b/files/fi/web/guide/events/index.html @@ -0,0 +1,53 @@ +--- +title: Event developer guide +slug: Web/Guide/Events +tags: + - DOM + - Event + - Guide + - NeedsTranslation + - NeedsUpdate + - TopicStub + - events +translation_of: Web/Guide/Events +--- +

{{draft()}}

+ +

Events refers both to a design pattern used for the asynchronous handling of various incidents which occur in the lifetime of a web page and to the naming, characterization, and use of a large number of incidents of different types.

+ +

The overview page provides an introduction to the design pattern and a summary of the types of incidents which are defined and reacted to by modern web browsers.

+ +

The custom events page describes how the event code design pattern can be used in custom code to define new event types emitted by user objects, register listener functions to handle those events, and trigger the events in user code.

+ +

The remaining pages describe how to use events of different kinds defined by web browsers. Unfortunately, these events have been defined piece by piece as web browsers have evolved so that there is no satisfying systematic characterization of the events built-in or defined by modern web browsers.

+ +

The device on which the web browser is running can trigger events, for example due to a change in its position and orientation in the real world, as discussed partially by the page on orientation coordinate systems and the page on the use of 3D transforms. That is different, but similar, to the change in device vertical orientation. 

+ +

The window in which the browser is displayed can trigger events; for example, change size if the user maximizes the window or otherwise changes it.

+ +

The process loading of a web page can trigger events in response to the completion of different steps in the downloading, parsing, and rendering of the web page for display to the user.

+ +

The user interaction with the web page contents can trigger events. The events triggered by user interaction evolved during the early years of browser design and include a complicated system defining the sequence in which events will be called and the manner in which that sequence can be controlled. The different types of user interaction-driven events include:

+ + + +

The modification of the web page in structure or content might trigger some events, as explained in the mutation events page, but the use of these events has been deprecated in favour of the lighter Mutation Observer approach.

+ +

The media streams embedded in the HTML documents might trigger some events, as explained in the media events page.

+ +

The network requests made by a web page might trigger some events.

+ +

There are many other sources of events defined by web browsers for which pages are not yet available in this guide.

+ +
+

Note: This Event Developer Guide needs substantial work. The structure needs to be reorganized and the pages rewritten. Our hope is that everything you need to know about events will go under here.

+
+ +

Docs

+ +

{{LandingPageListSubpages}}

diff --git a/files/fi/web/guide/index.html b/files/fi/web/guide/index.html new file mode 100644 index 0000000000..d87f4e3108 --- /dev/null +++ b/files/fi/web/guide/index.html @@ -0,0 +1,58 @@ +--- +title: Web developer guides +slug: Web/Guide +tags: + - Guide + - Landing + - NeedsTranslation + - TopicStub + - Web +translation_of: Web/Guide +--- +

This article provides how-to information to help make use of specific technologies & APIs.

+ +
+
+
+
HTML Learning Area
+
HyperText Markup Language (HTML) is the core language of nearly all Web content. Most of what you see on screen in your browser is described, fundamentally, using HTML.
+
CSS Learning Area
+
Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of a document written in HTML.
+
Events developer guide
+
Events refers both to a design pattern used for the asynchronous handling of various incidents which occur in the lifetime of a web page and to the naming, characterization, and use of a large number of incidents of different types.
+
AJAX
+
AJAX is a term that defines a group of technologies allowing web applications to make quick, incremental updates to the user interface without reloading the entire browser page. This makes the application faster and more responsive to user actions.
+
Graphics on the Web
+
Modern Web sites and applications often need to present graphics of varying sophistication.
+
Guide to Web APIs
+
A list of all Web APIs and what they do.
+
JavaScript
+
JavaScript is the powerful scripting language used to create applications for the Web.
+
Localizations and character encodings
+
Browsers process text as Unicode internally. However, a way of representing characters in terms of bytes (character encoding) is used for transferring text over the network to the browser. The HTML specification recommends the use of the UTF-8 encoding (which can represent all of Unicode), and regardless of the encoding used requires Web content to declare that encoding.
+
Mobile Web Development
+
This page provides an overview of some of the main techniques needed to design web sites that work well on mobile devices. If you're looking for information on Mozilla's Firefox OS project, see the Firefox OS page. Or you might be interested in details about Firefox for Android.
+
+
+ +
+
+
Optimization and performance
+
When building modern Web apps and sites, it's important to make your content work quickly and efficiently. This lets it perform effectively for both powerful desktop systems and weaker handheld devices.
+
Parsing and serializing XML
+
The Web platform provides different methods of parsing and serializing XML, each with its own pros and cons.
+
The Web Open Font Format (WOFF)
+
WOFF (Web Open Font Format) is a font file format that is free for anyone to use on the web.
+
Using FormData Objects
+
The FormData object lets you compile a set of key/value pairs to send using XMLHttpRequest. It's primarily intended for sending form data, but can be used independently from forms in order to transmit keyed data. The transmission is in the same format that the form's submit() method would use to send the data if the form's encoding type were set to "multipart/form-data".
+
Glossary
+
Defines numerous technical terms related to the Web and Internet.
+
+
+
+ +

See also

+ + diff --git a/files/fi/web/html/element/body/index.html b/files/fi/web/html/element/body/index.html new file mode 100644 index 0000000000..d4470f538b --- /dev/null +++ b/files/fi/web/html/element/body/index.html @@ -0,0 +1,166 @@ +--- +title: ': Dokumentin Body elementti' +slug: Web/HTML/Element/body +tags: + - Elementti + - HTML + - Osioiva pääelementti + - Osiot + - Referenssi + - Web +translation_of: Web/HTML/Element/body +--- +

{{HTMLRef}}

+ +

HTML <body> elementti edustaa HTML-asiakirjan sisältöä. Dokumentissa voi olla vain yksi <body> elementti.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SisältökategoriatSectioning root.
Sallittu sisältöVirtaussisältö.
Tagin pois jättäminenAloitustagi voidaan jättää pois jos ensimmäinen asia elementin sisällä ei ole välilyönti, kommentti, {{HTMLElement("script")}} elementti tai {{HTMLElement("style")}} elementti. Lopetustagi voidaan jättää pois jos body elementillä on sisältöä tai on aloitustagi ja kommentti ei ole välittömästi sen jälkeen.
Sallitut vanhemmatSen on oltava jälkimmäinen elementti {{HTMLElement("html")}} elementistä.
Sallitut ARIA roolitEi mitään.
DOM rajapinta{{domxref("HTMLBodyElement")}} +
    +
  • <body> elementti paljastaa {{domxref("HTMLBodyElement")}} rajapinnan.
    • +
  • Voit käyttää body elementtiä {{domxref("document.body")}} ominaisuuden kautta.
    • +
+
+ +

Ominaisuudet

+ +

Tämä elementti sisältää globaalit ominaisuudet.

+ +
+
{{htmlattrdef("alink")}} {{obsolete_inline}}
+
Tekstin väri hyperlinkeille kun valittuna. Tämä menetelmä on epäyhdenmukainen, käytä CSS {{cssxref("color")}} ominaisuutta yhdessä {{cssxref(":active")}} pseudoluokan kanssa sen sijaan.
+
{{htmlattrdef("background")}} {{obsolete_inline}}
+
Taustakuvan URI. Tämä menetelmä on epäyhdenmukainen, käytä CSS {{cssxref("background")}} ominaisuutta elementissä sen sijaan.
+
{{htmlattrdef("bgcolor")}} {{obsolete_inline}}
+
Taustaväri dokumentille. Tämä menetelmä on epäyhdenmukainen, käytä CSS {{cssxref("background-color")}} ominaisuutta elementissä sen sijaan.
+
{{htmlattrdef("bottommargin")}} {{obsolete_inline}}
+
Kehon pohjamarginaali. Tämä menetelmä on epäyhdenmukainen, käytä CSS {{cssxref("margin-bottom")}} ominaisuutta elementissä sen sijaan.
+
{{htmlattrdef("leftmargin")}} {{obsolete_inline}}
+
Kehon vasen marginaali. Tämä menetelmä on epäyhdenmukainen, käytä CSS {{cssxref("margin-left")}} ominaisuutta elementissä sen sijaan.
+
{{htmlattrdef("link")}} {{obsolete_inline}}
+
Tekstin väri avaamattomille hyperlinkeille. Tämä menetelmä on epäyhdenmukainen, käytä CSS {{cssxref("color")}} ominaisuutta yhdessä {{cssxref(":link")}} pseudoluokan kanssa sen sijaan.
+
{{htmlattrdef("onafterprint")}}
+
Funktio, jota kutsua kun käyttäjä on tulostanut dokumentin.
+
{{htmlattrdef("onbeforeprint")}}
+
Funktio, jota kutsua kun käyttäjä pyytää tulostusta dokumentista.
+
{{htmlattrdef("onbeforeunload")}}
+
Funktio, jota kutsua kun dokumentti aiotaan purkaa.
+
{{htmlattrdef("onblur")}}
+
Funktio, jota kutsua kun dokumentti menettää kohdistuksen.
+
{{htmlattrdef("onerror")}}
+
Funktio, jota kutsua kun dokumentti ei lataudu kunnolla.
+
{{htmlattrdef("onfocus")}}
+
Funktio, jota kutsua kun dokumentti vastaanottaa kohdistuksen.
+
{{htmlattrdef("onhashchange")}}
+
Funktio, jota kutsua kun dokumentin fragmenttitunnisteosa (alkaen ('#') risuaitamerkillä) dokumentin nykyisestä osoitteessa on muuttunut.
+
{{htmlattrdef("onlanguagechange")}} {{experimental_inline}}
+
Funktio, jota kutsua kun haluttu kieli muuttuu.
+
{{htmlattrdef("onload")}}
+
Funktio, jota kutsua kun dokumentti on lopettanut lataamisen.
+
{{htmlattrdef("onmessage")}}
+
Funktio, jota kutsua kun dokumentti on vastaaottanut viestin.
+
{{htmlattrdef("onoffline")}}
+
Funktio, jota kutsua kun verkkoyhteys on epäonnistunut.
+
{{htmlattrdef("ononline")}}
+
Funktio, jota kutsua kun verkkoyhteys on palautunut.
+
{{htmlattrdef("onpopstate")}}
+
Funktio, jota kutsua kun läyttäjä on navigoinut istuntohistoriaa.
+
{{htmlattrdef("onredo")}}
+
Funktio, jota kutsua kun käyttäjä on liikkunut eteenpäin kumoa transaktiohistoriassa.
+
{{htmlattrdef("onresize")}}
+
Funktio, jota kutsua kun dokumentin kokoa on muutettu.
+
{{htmlattrdef("onstorage")}}
+
Funktio, jota kutsua kun tallennusalue on muuttunut.
+
{{htmlattrdef("onundo")}}
+
Funktio, jota kutsua kun käyttäjä on liikkunut taaksepäin kumoa transaktiohistoriassa.
+
{{htmlattrdef("onunload")}}
+
Funktio, jota kutsua kun dokumentti on menossa pois.
+
{{htmlattrdef("rightmargin")}} {{obsolete_inline}}
+
Kehon oikea marginaali. Tämä menetelmä on epäyhdenmukainen, käytä CSS {{cssxref("margin-right")}} ominaisuutta elementissä sen sijaan.
+
{{htmlattrdef("text")}} {{obsolete_inline}}
+
Tekstin etualan väri. Tämä menetelmä on epäyhdenmukainen, käytä CSS {{cssxref("color")}} ominaisuutta elementissä sen sijaan.
+
{{htmlattrdef("topmargin")}} {{obsolete_inline}}
+
Kehon ylämarginaali. Tämä menetelmä on epäyhdenmukainen, käytä CSS {{cssxref("margin-top")}} ominaisuutta elementissä sen sijaan.
+
{{htmlattrdef("vlink")}} {{obsolete_inline}}
+
Tekstin väri vierailluille hyperlinkeille. Tämä menetelmä on epäyhdenmukainen, käytä CSS {{cssxref("color")}} ominaisuutta yhdessä {{cssxref(":visited")}} pseudoluokan kanssa sen sijaan.
+
+ +

Esimerkki

+ +
<html>
+  <head>
+    <title>Dokumentin otsikko</title>
+  </head>
+  <body>
+    <p>Tämä on kappale</p>
+  </body>
+</html>
+
+ +

Tekniset tiedot

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
MääritelmäTilaKommentti
{{SpecName('HTML WHATWG', 'semantics.html#the-body-element', '<body>')}}{{Spec2('HTML WHATWG')}}Muutetu listaa epäyhdenmukaisista ominaisuuksista.
{{SpecName('HTML5 W3C', 'sections.html#the-body-element', '<body>')}}{{Spec2('HTML5 W3C')}}Poistettu käytöstä aikaisemmin vanhentuneet ominaisuudet. Määritelty epäyhdenmukaisten käyttäytymienen ja ei-koskaan standardoitu margintop, marginleft, marginright ja marginbottom. Lisätty on* ominaisuudet.
{{SpecName('HTML4.01', 'struct/global.html#h-7.5.1', '<body>')}}{{Spec2('HTML4.01')}}Vanhennutettu alink, background, bgcolor, link, text ja vlink ominaisuudet.
+ +

Selainyhteensopivuus

+ + + +

{{Compat("html.elements.body")}}

+ +

Katso myös

+ + diff --git a/files/fi/web/html/element/head/index.html b/files/fi/web/html/element/head/index.html new file mode 100644 index 0000000000..165583a167 --- /dev/null +++ b/files/fi/web/html/element/head/index.html @@ -0,0 +1,108 @@ +--- +title: ': Dokumentin metadata (Header) elementti' +slug: Web/HTML/Element/head +tags: + - Elementti + - HTML + - 'HTML:Metadata sisältö' + - Referenssi + - Web +translation_of: Web/HTML/Element/head +--- +
{{HTMLRef}}
+ +

HTML <head> elemetti tarjoaa yleisen informaation (metadatan) dokumentista, mukaan lukien sen otsikon sekä linkit skripteihin ja tyylitiedostoihin.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SisältökategoriatEi mitään.
Sallittu sisältöJos dokumentti on {{HTMLElement("iframe")}} {{htmlattrxref("srcdoc", "iframe")}} dokumentti, tai jos otsikkoinformaatio on saatavilla korkeamman tason protokollasta, nolla tai enemmän metadata elementtejä.
+ Muutoin, yksi tai enemmän metadata elementtejä missä täsmälleen yksi on {{HTMLElement("title")}} elementti.
Tagin pois jättäminenAloitusmerkki voidaan jättää pois jos ensimmäinen asia head elementin sisällä on elementti.
+ Päätymerkki voidaan jättää pois jos head elementin jälkeen ensimmäinen asia ei ole välilyönti tai kommentti.
Sallitut vanhemmat{{HTMLElement("html")}} elementti, jonka ensimmäisenä lapsena.
Sallitut ARIA roolitEi mitään.
DOM rajapinta{{domxref("HTMLHeadElement")}}
+ +

Ominaisuudet

+ +

Tämä elementti sisältää globaalit ominaisuudet.

+ +
+
{{htmlattrdef("profile")}} {{obsolete_inline}}
+
Metadata profiilien URI osoitteet välilyöntien erottamana.
+
+ +

Esimerkki

+ +
<html>
+  <head>
+    <title>Dokumentin otsikko</title>
+  </head>
+</html>
+
+ +

Huomatukset

+ +

Modernit, HTML5-yhteensopivat selaimet automaattisesti rakentavat <head> elementin jos tagit on jätetty merkitsemättä. Tätä käytöstä ei voida taata muinaisissa selaimissa.

+ +

Tekniset tiedot

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
MäärittelyTilaKommentti
{{SpecName('HTML WHATWG', 'semantics.html#the-head-element', '<head>')}}{{Spec2('HTML WHATWG')}}Ei muutosta viimeisestä snapshotista
{{SpecName('HTML5 W3C', 'document-metadata.html#the-head-element', '<head>')}}{{Spec2('HTML5 W3C')}}Käytöstä poistettiin profile
{{SpecName('HTML4.01', 'struct/global.html#h-7.4.1', '<head>')}}{{Spec2('HTML4.01')}} 
+ +

Selainyhteensopivuus

+ + + +

{{Compat("html.elements.head")}}

+ +

Katso myös

+ + diff --git a/files/fi/web/html/element/index.html b/files/fi/web/html/element/index.html new file mode 100644 index 0000000000..7d2c18afaa --- /dev/null +++ b/files/fi/web/html/element/index.html @@ -0,0 +1,109 @@ +--- +title: HTML elements reference +slug: Web/HTML/Element +tags: + - Basic + - Element + - HTML + - NeedsTranslation + - Reference + - TopicStub + - Web + - 'l10n:priority' +translation_of: Web/HTML/Element +--- +
{{HTMLSidebar("Elements")}}
+ +

This page lists all the {{Glossary("HTML")}} {{Glossary("Element","elements")}}, which are created using {{Glossary("Tag", "tags")}}. They are grouped by function to help you find what you have in mind easily. An alphabetical list of all elements is provided in the sidebar on every element's page as well as this one.

+ +
+

For more information about the basics of HTML elements and attributes, see the section on elements in the Introduction to HTML article.

+
+ +

Main root

+ +

{{HTMLRefTable("HTML Root Element")}}

+ +

Document metadata

+ +

Metadata contains information about the page. This includes information about styles, scripts and data to help software ({{Glossary("search engine", "search engines")}}, {{Glossary("Browser","browsers")}}, etc.) use and render the page. Metadata for styles and scripts may be defined in the page or link to another file that has the information. 

+ +

{{HTMLRefTable("HTML Document Metadata")}}

+ +

Sectioning root

+ +

{{HTMLRefTable("Sectioning Root Element")}}

+ +

Content sectioning

+ +

Content sectioning elements allow you to organize the document content into logical pieces. Use the sectioning elements to create a broad outline for your page content, including header and footer navigation, and heading elements to identify sections of content.   

+ +

{{HTMLRefTable("HTML Sections")}}

+ +

Text content

+ +

Use HTML text content elements to organize blocks or sections of content placed between the opening {{HTMLElement("body")}} and closing </body> tags. Important for {{Glossary("accessibility")}} and {{Glossary("SEO")}}, these elements identify the purpose or structure of that content.     

+ +

{{HTMLRefTable("HTML Grouping Content")}}

+ +

Inline text semantics

+ +

Use the HTML inline text semantic to define the meaning, structure, or style of a word, line, or any arbitrary piece of text.

+ +

{{HTMLRefTable("HTML Text-Level Semantics")}}

+ +

Image and multimedia

+ +

HTML supports various multimedia resources such as images, audio, and video.

+ +

{{HTMLRefTable("multimedia")}}

+ +

Embedded content

+ +

In addition to regular multimedia content, HTML can include a variety of other content, even if it's not always easy to interact with.

+ +

{{HTMLRefTable({"include":["HTML embedded content"], "exclude":["multimedia"]})}}

+ +

Scripting

+ +

In order to create dynamic content and Web applications, HTML supports the use of scripting languages, most prominently JavaScript. Certain elements support this capability.

+ +

{{HTMLRefTable("HTML Scripting")}}

+ +

Demarcating edits

+ +

These elements let you provide indications that specific parts of the text have been altered.

+ +

{{HTMLRefTable("HTML Edits")}}

+ +

Table content

+ +

The elements here are used to create and handle tabular data.

+ +

{{HTMLRefTable("HTML tabular data")}}

+ +

Forms

+ +

HTML provides a number of elements which can be used together to create forms which the user can fill out and submit to the Web site or application. There's a great deal of further information about this available in the HTML forms guide.

+ +

{{HTMLRefTable({"include": ["HTML forms"], "exclude":["Deprecated"]})}}

+ +

Interactive elements

+ +

HTML offers a selection of elements which help to create interactive user interface objects.

+ +

{{HTMLRefTable("HTML interactive elements")}}

+ +

Web Components

+ +

Web Components is an HTML-related technology which makes it possible to, essentially, create and use custom elements as if it were regular HTML. In addition, you can create custom versions of standard HTML elements.

+ +

{{HTMLRefTable({"include":["Web Components"],"elements":["shadow"]})}}

+ +

Obsolete and deprecated elements

+ +
+

Warning: These are old HTML elements which are deprecated and should not be used. You should never use them in new projects, and should replace them in old projects as soon as you can. They are listed here for informational purposes only.

+
+ +

{{HTMLRefTable({"include":["Deprecated","Obsolete"]})}}

diff --git a/files/fi/web/html/element/title/index.html b/files/fi/web/html/element/title/index.html new file mode 100644 index 0000000000..d53e81e109 --- /dev/null +++ b/files/fi/web/html/element/title/index.html @@ -0,0 +1,122 @@ +--- +title: ': Dokumentin otsikkoelementti' +slug: Web/HTML/Element/title +tags: + - Elementti + - HTML + - HTML dokumentin metadata + - 'HTML:Metadata sisältö' + - Ikkunan nimi + - Ikkunan otsikko + - Otsikko + - Referenssi + - Sivun nimi + - Sivun otsikko + - Välilehden nimi + - Välilehden otsikko + - Web +translation_of: Web/HTML/Element/title +--- +<div>{{HTMLRef}}</div> + +<p><span class="seoSummary"><strong>HTML otsikkoelementti</strong> (<strong><code><title></code></strong>) määrittelee dokumentin otsikon, joka näkyy selaimen otsikkopalkissa tai sivun välilehdessä. Se usein sisältää tekstiä ja tagit sen sisällä on jätetty huomiotta.</span></p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row"><a href="/fi/docs/Web/HTML/Content_categories">Sisältökategoriat</a></th> + <td><a href="/en-US/docs/Web/HTML/Content_categories#Metadata_content">Metadata sisältö</a>.</td> + </tr> + <tr> + <th scope="row">Sallittu sisältö</th> + <td>Teksti, joka ei ole elementtien välinen välilyönti.</td> + </tr> + <tr> + <th scope="row">Tagin pois jättäminen</th> + <td>Molemmat avaus- ja sulkumerkit ovat pakollisia. Huomaa, että selainten pitäisi jättää loput sivusta huomiotta, jos <code></title></code> on jäänyt merkitsemättä.</td> + </tr> + <tr> + <th scope="row">Sallitut vanhemmat</th> + <td>{{ HTMLElement("head") }} elementti joka ei sisällä toisia {{ HTMLElement("title") }} elementtejä.</td> + </tr> + <tr> + <th scope="row">Sallitut ARIA roolit</th> + <td>Ei mitään.</td> + </tr> + <tr> + <th scope="row">DOM rajapinta</th> + <td>{{domxref("HTMLTitleElement")}}</td> + </tr> + </tbody> +</table> + +<h2 id="Ominaisuudet">Ominaisuudet</h2> + +<p>Tämä elementti sisältää vain <a href="/en-US/docs/Web/HTML/Global_attributes">globaalit ominaisuudet</a>.</p> + +<h2 id="Käyttöohjeet">Käyttöohjeet</h2> + +<p><code><title></code> elementtiä käytetään aina sivun {{HTMLElement("head")}} lohkossa.</p> + +<h2 id="Esimerkki">Esimerkki</h2> + +<pre class="brush: html"><title>Mahtava sivun otsikko</title> +</pre> + +<h2 id="Koskien_esteettömyyttä">Koskien esteettömyyttä</h2> + +<p>On tärkeää antaa <code>title</code> elementille arvo joka kuvaa sivun tarkoitusta. </p> + +<p>Avustavan tekniikan käyttäjille tarkoitettu tavallinen navigointitekniikka on lukea sivun otsikko ja päätellä, mitä sisältöä se sisältää. Tämä johtuu siitä, että sivun navigoiminen sen sisällön määrittelemiseksi voi olla aikaa vievää ja mahdollisesti sekavaa.</p> + +<h4 id="Esimerkki_2">Esimerkki</h4> + +<pre><title>Valikko - Kiinalainen ravintola - RuokaNam: Verkko-ostoksia tänään!</title> +</pre> + +<p>Voit auttaa käyttäjiä päivittämällä sivun <code>title</code> arvon vastaamaan merkittäviä sivun tilamuutoksia (kuten lomakkeiden vahvistusongelmia).</p> + +<h4 id="Esimerkki_3">Esimerkki</h4> + +<pre><title>2 virhettä - Tilauksesi - Kiinalainen ravintola - RuokaNam: Verkko-ostoksia tänään!</title> +</pre> + +<ul> + <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG/Operable#Guideline_2.4_—_Navigable_Provide_ways_to_help_users_navigate_find_content_and_determine_where_they_are">MDN Understanding WCAG, Guideline 2.4 explanations</a></li> + <li><a href="https://www.w3.org/TR/UNDERSTANDING-WCAG20/navigation-mechanisms-title.html">Understanding Success Criterion 2.4.2  | W3C Understanding WCAG 2.0</a></li> +</ul> + +<h2 id="Tekniset_tiedot">Tekniset tiedot</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Määrittely</th> + <th scope="col">Tila</th> + <th scope="col">Kommentti</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', 'semantics.html#the-title-element', '<title>')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'document-metadata.html#the-title-element', '<title>')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', 'struct/global.html#h-7.4.2', '<title>')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Selainyhteensopivuus">Selainyhteensopivuus</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("html.elements.title")}}</p> diff --git a/files/fi/web/html/index.html b/files/fi/web/html/index.html new file mode 100644 index 0000000000..5f508bf107 --- /dev/null +++ b/files/fi/web/html/index.html @@ -0,0 +1,99 @@ +--- +title: 'HTML: HyperText Markup Language' +slug: Web/HTML +translation_of: Web/HTML +--- +<div>{{HTMLSidebar}}</div> + +<p class="summary"><span class="seoSummary"><strong>HTML</strong> (HyperText Markup Language) on verkon yksinkertaisin rakennuspalikka. Se määrittelee merkityksen ja rakenteen verkkosisällölle. Muita teknologioita käytetään yleisesti kuvailemaan verkkosivun ulkonäkö/tyyli (<a href="/fi/docs/Web/CSS">CSS</a>) tai toiminnallisuus/käyttäytyminen (<a href="/fi/docs/Web/JavaScript">JavaScript</a>).</span></p> + +<p>"HyperText" viittaa linkkeihin, jotka yhdistävät verkkosivut toisiin, joko yhden sivuston sisällä tai toiselle sivustolle. Linkit ovat keskeisiä verkolle. Kun lataat sisältöä Internetiin ja yhdistät sen muiden käyttäjien luomiin sivuihin, sinusta tilee aktiivinen osallistuja World Wide Websissä.</p> + +<p>HTML käyttää merkintää (eng. markup) tekstin, kuvien, ja muun sisällön merkitsemiseen Web-selaimessa. HTML-merkintä sisältää erityisiä "elementtejä", kuten {{HTMLElement("head")}}, {{HTMLElement("title")}}, {{HTMLElement("body")}}, {{HTMLElement("header")}}, {{HTMLElement("footer")}}, {{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("p")}}, {{HTMLElement("div")}}, {{HTMLElement("span")}}, {{HTMLElement("img")}}, {{HTMLElement("aside")}}, {{HTMLElement("audio")}}, {{HTMLElement("canvas")}}, {{HTMLElement("datalist")}}, {{HTMLElement("details")}}, {{HTMLElement("embed")}}, {{HTMLElement("nav")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}}, {{HTMLElement("video")}} ja monia muita.</p> + +<p>HTML tagit toimivat samoin kirjainkoosta riippumatta. Eli nei voidaan kirjoittaa isoilla kirjaimilla, pienillä kirjaimilla, tai näiden seoksella. Esimerkiksi <strong><title> </strong>tagi voidaan kirjoittaa myös <Title>,<TITLE> tai muulla tapaa.</p> + +<p>Artikkelit alla kertovat sinulle lisää HTML:sta.</p> + +<section class="cleared" id="sect1"> +<ul class="card-grid"> + <li><span>HTML esittely</span> + + <p>Mikäli olet uusi Web-kehityksessä, muista lukea <a href="/fi/docs/Learn/Getting_started_with_the_web/HTML_basics">HTML perusteet</a> artikkeli oppiaksesi mitä HTML on ja miten sitä käytetään.</p> + </li> + <li><span>HTML oppaat</span> + <p>HTML-oppimateriaalia käsitteleviä artikkeleita, oppaita, sekä täydellisiä esimerkkejä löytyy <a href="/fi/docs/Learn/HTML">HTML oppimisalueestamme</a>.</p> + </li> + <li><span>HTML referenssit</span> + <p>Laajassa <a href="/fi/docs/Web/HTML/Reference">HTML referenssi</a>osiossamme löydät HTML-elementtien ja attribuuttien yksityiskohdat.</p> + </li> +</ul> + +<div class="row topicpage-table"> +<div class="section"> +<h2 class="Tools" id="Aloittelijan_oppaat">Aloittelijan oppaat</h2> + +<p>Our <a href="/fi/docs/Learn/HTML">HTML oppimisalueemme</a> sisältää useita moduuleja, jotka opettavat HTML:n alusta loppuun — aikaisempaa osaamista ei vaadita.</p> + +<dl> + <dt><a href="/fi/docs/Learn/HTML/Introduction_to_HTML">HTML esittely</a></dt> + <dd>Tämä moduuli totuttaa sinut tärkeisiin konsepteihin ja syntakseihin kuten HTML-koodin soveltamista tekstiin, miten luoda hyperlinkkejä, sekä kuinka käyttää HTML:ää verkkosivun rakenteeseen.</dd> + <dt><a href="/fi/docs/Learn/HTML/Multimedia_and_embedding">Multimedia ja upottaminen</a></dt> + <dd>Tämä moduuli tutkii HTML:n käyttöä multimedian sisällyttämiseen verkkosivuihin, mukaan lukien eri tavat, joilla kuvia voidaan sisällyttää, ja miten videoita, ääntä, ja jopa toisia verkkosivuja upotetaan.</dd> + <dt><a href="/fi/docs/Learn/HTML/Tables">HTML taulukot</a></dt> + <dd>Verkkosivun taulukkotietojen esittäminen ymmärrettävällä, helposti saatavilla olevilla tavoilla voi olla haaste. Tämä moduuli kattaa perustaulukon merkinnän sekä monimutkaisempia ominaisuuksia kuten kuvaukset ja tiivistelmät.</dd> + <dt><a href="/fi/docs/Learn/HTML/Forms">HTML lomakkeet</a></dt> + <dd>Lomakkeet ovat erittäin tärkeä osa verkkoa — ne tarjoavat paljon toimintoja, joita tarvitset vuorovaikuttaaksesi verkkkosivuja, kuten rekisteröidä ja kirjautua sisään, lähettää palautetta, ostaa tuotteta, ja paljon muuta. Tämän moduulin avulla pääset alkuun asiakaspuolen lomakkeiden luomisessa. </dd> + <dt><a href="https://developer.mozilla.org/fi/docs/Learn/HTML/Howto">Use HTML to solve common problems</a></dt> + <dd>Provides links to sections of content explaining how to use HTML to solve very common problems when creating a web page: dealing with titles, adding images or videos, emphasizing content, creating a basic form, etc.</dd> +</dl> + +<h2 id="Edistyneet_aiheet">Edistyneet aiheet</h2> + +<dl> + <dt class="landingPageList"><a href="/fi/docs/Web/HTML/CORS_enabled_image">CORS enabled image</a></dt> + <dd class="landingPageList">The <code><a href="/fi/docs/Web/HTML/Element/img#attr-crossorigin">crossorigin</a></code> attribute, in combination with an appropriate <a class="glossaryLink" href="/fi/docs/Glossary/CORS">CORS</a> header, allows images defined by the {{HTMLElement("img")}} element to be loaded from foreign origins and used in a {{HTMLElement("canvas")}} element as if they were being loaded from the current origin.</dd> + <dt class="landingPageList"><a href="/fi/docs/Web/HTML/CORS_settings_attributes">CORS settings attributes</a></dt> + <dd class="landingPageList">Some HTML elements that provide support for <a href="/fi/docs/HTTP/Access_control_CORS">CORS</a>, such as {{HTMLElement("img")}} or {{HTMLElement("video")}}, have a <code>crossorigin</code> attribute (<code>crossOrigin</code> property), which lets you configure the CORS requests for the element's fetched data.</dd> + <dt class="landingPageList"><a href="/fi/docs/Web/HTML/Focus_management_in_HTML">Focus management in HTML</a></dt> + <dd class="landingPageList">The <code><a href="/fi/docs/Web/API/Document/activeElement">activeElement</a></code> DOM attribute and the <code><a href="/fi/docs/Web/API/Document/hasFocus">hasFocus()</a></code> DOM method help you track and control a user's interactions with elements on a web page.</dd> + <dt class="landingPageList"><a href="/fi/docs/Web/HTML/Using_the_application_cache">Using the application cache</a></dt> + <dd class="landingPageList">Application caching lets web-based applications run offline. You can use the <strong>Application Cache</strong> (<em>AppCache</em>) interface to specify resources that the browser should cache and make available to offline users. Applications that are cached load and work correctly even if users click the refresh button when they are offline.</dd> + <dt class="landingPageList"><a href="https://developer.mozilla.org/fi/docs/Web/HTML/Preloading_content">Preloading content with rel="preload"</a></dt> + <dd class="landingPageList">The <code>preload</code> value of the {{htmlelement("link")}} element's {{htmlattrxref("rel", "link")}} attribute allows you to write declarative fetch requests in your HTML {{htmlelement("head")}}, specifying resources that your pages will need very soon after loading, which you therefore want to start preloading early in the lifecycle of a page load, before the browser's main rendering machinery kicks in. This ensures that they are made available earlier and are less likely to block the page's first render, leading to performance improvements. This article provides a basic guide to how <code>preload</code> works.</dd> +</dl> +</div> + +<div class="section"> +<h2 class="Documentation" id="Referenssit">Referenssit</h2> + +<dl> + <dt class="landingPageList"><a href="/fi/docs/Web/HTML/Reference">HTML reference</a></dt> + <dd class="landingPageList">HTML consists of <strong>elements</strong>, each of which may be modified by some number of <strong>attributes</strong>. HTML documents are connected to each other with <a href="/fi/docs/Web/HTML/Link_types">links</a>.</dd> + <dt class="landingPageList"><a href="/fi/docs/Web/HTML/Element">HTML element reference</a></dt> + <dd class="landingPageList">Lista kaikista <a class="glossaryLink" href="/fi/docs/Glossary/HTML">HTML</a> <a class="glossaryLink" href="/fi/docs/Glossary/Element">elementeistä</a>.</dd> + <dt class="landingPageList"><a href="/fi/docs/Web/HTML/Attributes">HTML attribute reference</a></dt> + <dd class="landingPageList">Elements in HTML have <strong>attributes</strong>. These are additional values that configure the elements or adjust their behavior in various ways.</dd> + <dt class="landingPageList"><a href="/fi/docs/Web/HTML/Global_attributes">Global attributes</a></dt> + <dd class="landingPageList">Global attributes may be specified on all <a href="/fi/docs/Web/HTML/Element">HTML elements</a>, <em>even those not specified in the standard</em>. This means that any non-standard elements must still permit these attributes, even though those elements make the document HTML5-noncompliant.</dd> + <dt class="landingPageList"><a href="/fi/docs/Web/HTML/Inline_elements">Inline elements</a> and <a href="/fi/docs/Web/HTML/Block-level_elements">block-level elements</a></dt> + <dd class="landingPageList">HTML elements are usually "inline" or "block-level" elements. An inline element occupies only the space bounded by the tags that define it. A block-level element occupies the entire space of its parent element (container), thereby creating a "block."</dd> + <dt class="landingPageList"><a href="/fi/docs/Web/HTML/Link_types">Link types</a></dt> + <dd class="landingPageList">In HTML, various link types can be used to establish and define the relationship between two documents. Link elements that types can be set on include <a href="/fi/docs/Web/HTML/Element/a"><code><a></code></a>, <a href="/fi/docs/Web/HTML/Element/area"><code><area></code></a> and <a href="/fi/docs/Web/HTML/Element/link"><code><link></code></a>.</dd> + <dt class="landingPageList"><a href="/fi/docs/Web/HTML/Supported_media_formats">Media formats supported by the HTML audio and video elements</a></dt> + <dd class="landingPageList">The <a href="/fi/docs/Web/HTML/Element/audio"><code><audio></code></a> and <a href="/fi/docs/Web/HTML/Element/video"><code><video></code></a> elements allow you to play audio and video media. These elements provide a browser-native alternative to similar capabilities found in Adobe Flash and other plug-ins.</dd> + <dt class="landingPageList"><a href="/fi/docs/Web/HTML/Kinds_of_HTML_content">Kinds of HTML content</a></dt> + <dd class="landingPageList">HTML is comprised of several kinds of content, each of which is allowed to be used in certain contexts and is disallowed in others. Similarly, each has a set of other content categories they can contain and elements which can or can't be used in them. This is a guide to these categories.</dd> + <dt class="landingPageList"><a href="/fi/docs/Web/HTML/Quirks_Mode_and_Standards_Mode">Quirks mode and standards mode</a></dt> + <dd class="landingPageList">Historical information on quirks mode and standards mode.</dd> +</dl> + +<h2 class="landingPageList" id="Liittyvät_aiheet">Liittyvät aiheet</h2> + +<dl> + <dt><a href="/fi/docs/Web/HTML/Applying_color">Applying color to HTML elements using CSS</a></dt> + <dd>This article covers most of the ways you use CSS to add color to HTML content, listing what parts of HTML documents can be colored and what CSS properties to use when doing so. Includes examples, links to palette-building tools, and more.</dd> +</dl> +</div> +</div> +<span class="alllinks"><a href="/fi/docs/tag/HTML">View All...</a></span></section> diff --git a/files/fi/web/html/reference/index.html b/files/fi/web/html/reference/index.html new file mode 100644 index 0000000000..2e7444a505 --- /dev/null +++ b/files/fi/web/html/reference/index.html @@ -0,0 +1,23 @@ +--- +title: HTML referenssi +slug: Web/HTML/Reference +translation_of: Web/HTML/Reference +--- +<div>{{HTMLSidebar}}</div> + +<p>Tämä <a href="/fi-fi/docs/Web/HTML">HTML</a> referenssi kuvaa kaikki <strong>elementit</strong> ja <strong>ominaisuudet</strong> HTML:stä, mukaan lukien <strong>globaalit ominaisuudet</strong> jotka koskevat kaikkia elementtejä.</p> + +<dl> + <dt><a href="/fi-fi/docs/Web/HTML/Element">HTML elementtireferenssi</a></dt> + <dd>Tällä sivulla luetellaan kaikki HTML elementit, jotka on luotu tageilla.</dd> + <dt><a href="/fi-fi/docs/Web/HTML/Attributes">HTML ominaisuusreferenssi</a></dt> + <dd>HTML-elementeissä on ominaisuuksia. Nämä ovat lisäarvoja, jotka <span class="tlid-translation translation"><span title="">määrittävät elementit tai säätävät niiden käyttäytymistä eri tavoin käyttäjien haluamiin kriteereihin.</span></span></dd> + <dt><a href="/fi-fi/docs/Web/HTML/Global_attributes">Globaalit ominaisuudet</a></dt> + <dd><span class="tlid-translation translation"><span title="">Globaalit ominaisuudet ovat ominaisuuksia, jotka ovat yhteisiä kaikille HTML-elementeille;</span> <span title="">niitä voidaan käyttää kaikissa elementeissä, vaikka niillä ei ehkä ole vaikutusta joihinkin elementteihin.</span></span></dd> + <dt><a href="/fi-fi/docs/Web/HTML/Link_types">Linkkityypit</a></dt> + <dd><span class="tlid-translation translation"><span title="">HTML:ssä seuraavat linkityypit osoittavat kahden asiakirjan välistä suhdetta, jossa toinen linkkaa toiseen asiakirjaan käyttämällä <a>, <area> tai <link> -elementtiä.</span></span></dd> + <dt><a href="/fi-fi/docs/Web/Guide/HTML/Content_categories">Sisältökategoriat</a></dt> + <dd><span class="tlid-translation translation"><span title="">Jokainen HTML-elementti on yhden tai useamman sisältökategorian jäsen - nämä kategoriat ryhmittävät elementtejä, jotka jakavat yhteisiä ominaisuuksia</span></span>.</dd> +</dl> + +<p><span class="alllinks"><a href="/fi-fi/docs/tag/HTML" title="Article tagged: HTML">Katso kaikki sivut tagilla "HTML"...</a></span></p> diff --git a/files/fi/web/index.html b/files/fi/web/index.html new file mode 100644 index 0000000000..0fb75fc460 --- /dev/null +++ b/files/fi/web/index.html @@ -0,0 +1,162 @@ +--- +title: Web teknologia kehittäjille +slug: Web +tags: + - Landing + - NeedsTranslation + - TopicStub + - Web +translation_of: Web +--- +<section id="Quick_Links"> +<ol> + <li><strong><a href="/fi/docs/Web">Web-teknologiat kehittäjille</a></strong></li> + <li class="toggle"> + <details><summary>Perusteet</summary> + <ol> + <li><a href="/fi/docs/Web/HTML">HTML</a></li> + <li><a href="/fi/docs/Web/CSS">CSS</a></li> + <li><a href="/fi/docs/Web/HTTP">HTTP</a></li> + </ol> + </details> + </li> + <li class="toggle"> + <details open><summary>Skriptaus</summary> + <ol> + <li><a href="/fi/docs/Web/JavaScript">JavaScript</a></li> + <li><a href="/fi/docs/Web/API">Web-rajapinnat</a></li> + <li><a href="/fi/docs/Web/Events">Eventit</a></li> + <li><a href="/fi/docs/Web/Web_components">Web-komponentit</a></li> + </ol> + </details> + </li> + <li class="toggle"> + <details open><summary>Grafiikka</summary> + <ol> + <li><a href="/fi/docs/Web/HTML/Canvas">Canvas</a></li> + <li><a href="/fi/docs/Web/SVG">SVG</a></li> + <li><a href="/fi/docs/Web/API/WebGL_API">WebGL</a></li> + </ol> + </details> + </li> + <li class="toggle"> + <details open><summary>Muuta</summary> + <ol> + <li><a href="/fi/docs/Web/Media">Web-media teknologiat</a></li> + <li><a href="/fi/docs/WebAssembly">WebAssembly</a></li> + <li><a href="/fi/docs/Web/MathML">MathML</a></li> + <li><a href="/fi/docs/Web/XSLT">XSLT</a></li> + <li><a href="/fi/docs/Web/EXSLT">EXSLT</a></li> + <li><a href="/fi/docs/Web/XPath">XPath</a></li> + </ol> + </details> + </li> +</ol> +</section> + +<p class="summary">Avoin verkko esittää uskomattomia mahdollisuuksia kehittäjille, jotka haluavat luoda verkkosivuja tai verkkosovelluksia. Hyödyntääksesi näitä teknologioita, sinun täytyy tietää kuinka niitä käytetään. Tutki alla olevia linkkejä oppiaksesi lisää eri web-teknologioista.</p> + +<div class="row topicpage-table"> +<div class="section"> +<h2 class="Documentation" id="Web-teknologiat">Web-teknologiat</h2> + +<h3 id="Perusteet">Perusteet</h3> + +<dl> + <dt><a href="/fi/docs/Web/HTML">HTML</a></dt> + <dd><strong>HyperText Markup Language</strong> eli <strong>HTML</strong> käytetään kuvaamaan verkkosivun <em>sisältö.</em></dd> + <dt><a href="/fi/docs/Web/CSS">CSS</a></dt> + <dd><strong>Cascading Style Sheets</strong> eli <strong>CSS</strong> käytetään kuvaamaan verkkosivun sisällön ulkonäkö tai esitys.</dd> + <dt><a href="/fi/docs/Web/HTTP">HTTP</a></dt> + <dd><strong><dfn>Hypertext Transfer Protocol</dfn></strong><dfn> eli </dfn><strong><dfn>HTTP</dfn></strong><dfn> käytetään toimittamaan HTML ja muut hypermediatiedostot verkossa.</dfn></dd> +</dl> + +<h3 id="Skriptaus">Skriptaus</h3> + +<dl> + <dt><a href="/fi/docs/Web/JavaScript">JavaScript</a></dt> + <dd><strong>JavaScript </strong>on ohjelmointikieli, joka suoritetaan selaimessasi. Voit käyttää sitä lisäämään interaktiivisuutta tai muita dynaamisia ominaisuuksia verkkosivustollesi tai sovellukseesi.</dd> + <dd>With the advent of <a href="/fi/docs/Glossary/Node.js">Node.js</a>, you can also run JavaScript on the server.</dd> + <dt><a href="/fi/docs/Web/Reference/API">Web APIs</a></dt> + <dd><strong>Web Application Programming Interfaces (Web APIs)</strong> are used to perform a variety of tasks, such as manipulating the <a href="/fi/docs/DOM">DOM</a>, playing audio or video, or generating 3D graphics. + <ul> + <li>The <a href="/fi/docs/Web/API">Web API interface reference</a> lists all the object types you can use while developing for the web.</li> + <li>The <a href="/fi/docs/WebAPI">WebAPI page</a> lists all the communication, hardware access, and other APIs you can use in web applications.</li> + <li>The <a href="/fi/docs/Web/Events">Event reference</a> lists all the events you can use to track and react to interesting things that have taken place in your webpage or application.</li> + </ul> + </dd> + <dt><a href="/fi/docs/Web/Web_components">Web-komponentit</a></dt> + <dd>Web Components is a suite of different technologies allowing you to create reusable custom elements — with their functionality encapsulated away from the rest of your code — and utilize them in your web apps.</dd> +</dl> + +<h3 id="Grafiikka">Grafiikka</h3> + +<dl> + <dt><a href="/fi/docs/Web/HTML/Canvas">Canvas</a></dt> + <dd>The {{HTMLElement("canvas")}} element provides APIs to draw 3D graphics using TextScript.</dd> + <dt><a href="/fi/docs/Web/SVG">SVG</a></dt> + <dd><strong>Scalable Vector Graphics (SVG)</strong> lets you use lines, curves, and other geometric shapes to render graphics. With vectors, you can create images that scale cleanly to any size.</dd> + <dt><a href="/fi/docs/Web/API/WebGL_API">WebGL</a></dt> + <dd><strong>WebGL</strong> is a JavaScript API that lets you draw 3D or 2D graphics using the HTML {{HTMLElement("canvas")}} element. This technology lets you use standard OpenGL ES in Web content.</dd> +</dl> + +<h3 id="Ääni_video_ja_multimedia">Ääni, video, ja multimedia</h3> + +<dl> + <dt><a href="/fi/docs/Web/Media">Web media technologies</a></dt> + <dd>A list of media-related APIs with links to the documentation you'll need for each.</dd> + <dt><a href="/fi/docs/Web/Media/Overview">Overview of media technology on the web</a></dt> + <dd>A general look at the open web technologies and APIs that provide support for audio and video playback, manipulation, and recording. If you're not sure which API you should use, this is the place to start.</dd> + <dt><a href="/fi/docs/Web/API/Media_Streams_API">Media capture and streams API</a></dt> + <dd>A reference for the API that makes it possible to stream, record, and manipulate media both locally and across a network. This includes using local cameras and microphones to capture video, audio, and still images.</dd> + <dt><a href="/fi/docs/Web/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content">Using HTML audio and video</a></dt> + <dd>Embedding video and/or audio in a web page and controlling its playback.</dd> + <dt><a href="/fi/docs/Web/API/WebRTC_API">WebRTC</a></dt> + <dd>The RTC in WebRTC stands for Real-Time Communications, technology that enables audio/video streaming and data sharing between browser clients (peers).</dd> +</dl> + +<h3 id="Muut">Muut</h3> + +<dl> + <dt><a href="/fi/docs/Web/MathML">MathML</a></dt> + <dd><strong>Mathematical Markup Language (MathML)</strong> lets you display complex mathematical equations and syntax.</dd> + <dt><a href="/fi/docs/Web/XSLT">XSLT</a></dt> + <dd><strong>Extensible Stylesheet Language Transformations (XSLT)</strong> let you convert XML documents into more human readable HTML.</dd> + <dt><a href="/fi/docs/Web/EXSLT">EXSLT</a></dt> + <dd>Extra functions which provide additional features to XSLT.</dd> + <dt><a href="/fi/docs/Web/XPath">XPath</a></dt> + <dd><strong>XPath</strong> lets you select DOM nodes in a document using a more powerful syntax than what is currently provided by <a href="/fi/docs/Web/CSS/CSS_Selectors">CSS selectors</a>.</dd> +</dl> +</div> + +<div class="section"> +<h2 class="Documentation" id="Oppimisalue">Oppimisalue</h2> + +<dl> + <dt><a href="/fi/docs/Learn">Learning web development</a></dt> + <dd>This set of articles provides beginners with everything they need to start coding simple websites.</dd> + <dt><a href="https://developer.mozilla.org/fi/Apps/Progressive">Progressive web apps</a></dt> + <dd>Progressive web apps use modern web APIs along with traditional progressive enhancement strategy to create cross-platform web applications. These apps work everywhere and provide several features that give them the same user experience advantages as native apps. This set of docs and guides tell you all you need to know about PWAs.</dd> +</dl> + +<dl> +</dl> + +<h2 id="Muut_aiheet">Muut aiheet</h2> + +<dl> + <dt><a href="/fi/docs/Web/Apps">Developing web applications</a></dt> + <dd>This set of articles explains the techniques used in developing web apps for mobile and desktop environments.</dd> + <dt><a href="/fi/docs/Web/Accessibility">Accessibility</a></dt> + <dd>Accessible websites enable as many people as possible to use the web, including those whose visual, auditory, or other abilities are limited in some way. This set of articles provides information about accessible web development.</dd> + <dt><a href="/fi/docs/Web/Localization">Localization (L10n) and Internationalization (I18n)</a></dt> + <dd>The web is a global community! Make sure your site is part of it by keeping in mind the need to provide content in the language and layout expected by everyone that might want to use your site or app.</dd> + <dt><a href="/fi/docs/Web/Security">Security</a></dt> + <dd>Don't let your website or app leak private data to the bad guys. Use this set of articles to make sure your projects are secure.</dd> + <dt><a href="/fi/docs/WebAssembly">WebAssembly</a></dt> + <dd>WebAssembly is a new type of code that can be run in modern web browsers — it is a low-level assembly-like language with a compact binary format that runs with near-native performance and provides languages such as C/C++ with a compilation target so that they can run on the web.</dd> +</dl> +</div> +</div> + +<p><span class="alllinks"><a href="/fi/docs/tag/Web">Katso kaikki...</a></span></p> diff --git a/files/fi/web/javascript/index.html b/files/fi/web/javascript/index.html new file mode 100644 index 0000000000..d8a689c886 --- /dev/null +++ b/files/fi/web/javascript/index.html @@ -0,0 +1,129 @@ +--- +title: JavaScript +slug: Web/JavaScript +translation_of: Web/JavaScript +--- +<div>{{JsSidebar}}</div> + +<p class="summary"><span class="seoSummary"><strong>JavaScript</strong> (<strong>JS</strong>) on kevyt, tulkattu, tai <a href="https://en.wikipedia.org/wiki/Just-in-time_compilation">juuri-ajallaan</a> käännetty ohjelmointikieli, joka pitää funktioita "<a href="/en-US/docs/Glossary/First-class_Function">ensimmäisen luokan kansalaisina"</a>. Vaikka se tunnetaan parhaiten verkkoselaimessa toimivana skriptauskielenä, sitä käyttävät myös monet <a class="external" href="https://en.wikipedia.org/wiki/JavaScript#Uses_outside_Web_pages">ei-selainpohjaiset ympäristöt</a>, kuten <a href="/en-US/docs/Glossary/Node.js">Node.js</a>, <a class="external" href="https://couchdb.apache.org/">Apache CouchDB</a> ja <a class="external" href="http://www.adobe.com/devnet/acrobat/javascript.html">Adobe Acrobat</a>.</span> JavaScript on  <a href="/en-US/docs/Glossary/Prototype-based_programming">prototyyppipohjainen</a>, yksisäikeinen, dynaaminen ohjelmointikieli, joka tukee monia eri ohjelmintitapoja, kuten olio-ohjelmointi-, imperatiivista sekä funktionaalista ohjelmointityyliä. Lue lisää<a href="/en-US/docs/Web/JavaScript/About_JavaScript"> JavaScript</a>istä.</p> + +<p>Tämä osa on omistettu pelkästään JavaScriptille ohjelmointikielenä huomioimatta ominaisuuksia, jotka ovat eritysiä verkkosivuille tai muille ajoympäristöille. Tarkempaa tietoa selainten <a href="/en-US/docs/Glossary/API">ohjelmointirajapinnoista</a>, joita käytetään verkkosivujen kehittämisessä löytyy <a href="/en-US/docs/Web/API">Web API</a>- ja <a href="/en-US/docs/Glossary/DOM">DOM</a>-osioista.</p> + +<p>JavaScriptin käyttämä standardi on <a href="/en-US/docs/Web/JavaScript/Language_Resources">ECMAScript</a>. Vuodesta 2012 lähtien kaikki <a href="https://kangax.github.io/compat-table/es5/">modernit selaimet</a> tukevat täysin ECMAScript 5.1:tä ja sitä vanhemmat selaimet tukevat vähintään ECMAScript 3:sta. 17. kesäkuuta 2015 <a href="https://www.ecma-international.org">ECMA International</a> julkaisi kuudennen version ECMAScriptistä, jonka virallinen nimitys on ECMAScript 2015, tätä kutsuttiin alunperin ECMAScript 6 tai ES6:ksi. Siitä lähtien, ECMAScript-standardia on päivitetty vuosittain. Tämä dokumentaatio viittaa tämänhetkiseen vedokseen, mikä on tällä hetkellä <a href="https://tc39.github.io/ecma262/">ECMAScript 2020</a>.</p> + +<p>JavaScriptiä ei kannata sekoittaa <a href="https://en.wikipedia.org/wiki/Java_(programming_language)">Java-ohjelmointikieleen</a>. Molemmat "Java" ja "JavaScript" ovat Oraclen tuotemerkkejä Yhdysvalloissa ja muissa maissa, mutta siitä huolimatta näillä kahdella ohjelmointikielellä on hyvin erilainen syntaksi, semantiikka ja käyttökohteet.</p> + +<div class="column-container"> +<div class="column-half"> +<h2 id="Oppaita">Oppaita</h2> + +<p>Opi JavaScriptiä oppaiden avulla.</p> + +<h3 id="Aloittelijoille">Aloittelijoille</h3> + +<p>Suuntaa <a href="/en-US/docs/Learn/JavaScript">JavaScriptin opiskeluosioon</a> jos haluat oppia JavaScriptiä mutta sinulla ei ole aikaisempaa kokemusta JavaScript-ohjelmoinnista. Sieltä löydät seuraavat itseopiskelumoduulit:</p> + +<dl> + <dt><a href="/en-US/docs/Learn/JavaScript/First_steps">JavaScript-ensiaskeleet</a></dt> + <dd>Tämä osio vastaa kysymyksiin "mitä JavaScript on?", "miltä se näyttää" ja "mitä sillä voi tehdä?". Samalla kuvataan myös kielen perusominaisuudet kuten muuttujat ja erilaiset perustietotyypit.</dd> + <dt><a href="/en-US/docs/Learn/JavaScript/Building_blocks">JavaScript-osakokonaisuudet</a></dt> + <dd>Jatkaa JavaScriptin perustavien ominaisuuksien läpikäymimistä ja esittelee yleisimmät ohjausrakenteet kuten ehdolliset lausunnot, silmukat, funktiot ja tapahtumat.</dd> + <dt><a href="/en-US/docs/Learn/JavaScript/Objects">Esittelyssä JavaScript-oliot</a></dt> + <dd>On tärkeää ymmärtää JavaScriptin oliopohjainen luonne jos haluat ymmärtää JavaScriptiä paremmin ja kehittyä taidoissasi kirjoittaa tehokasta JavaScript-koodia.</dd> + <dt><a href="/en-US/docs/Learn/JavaScript/Asynchronous">Asynkroninen JavaScript</a></dt> + <dd>Mitä on asynkroninen JavaScript, miksi se on tärkeää ja kuinka sitä voidaan käyttää tehokkaasti, esimerkiksi pitämällä suoritussäie vapaana suorittaessa säikeen pysäyttäviä operaatioita kuten noudettaessa resursseja verkkopalvelimelta.</dd> + <dt><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs">Käyttäjäpuolen web ohjelmointirajapinnat (API:t)</a></dt> + <dd>Mitä API:t ovat ja kuinka käyttää joitain kaikista yleisimmistä API:sta, joihin törmätään yleisesti web-kehityksessä.</dd> +</dl> + +<h3 id="JavaScript-opas">JavaScript-opas</h3> + +<dl> + <dt><a href="/en-US/docs/Web/JavaScript/Guide">JavaScript-opas</a></dt> + <dd>Yksityiskohtaisempi opas JavaScript-ohjelmointikieeleen, joka on suunnattu lukijoille, joilla on aikaisempaa kokemusta ohjelmoinnista, jollain muulla ohjelmointikielellä.</dd> +</dl> + +<h3 id="Keskitaso">Keskitaso</h3> + +<dl> + <dt><a href="/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript">JavaScript uudelleen esiteltynä</a></dt> + <dd>Yleiskatsaus heille, jotka <em>luulevat</em> tuntevansa JavaScriptin.</dd> +</dl> + +<dl> + <dt><a href="/en-US/docs/Web/JavaScript/Data_structures">JavaScript-tietorakenteet</a></dt> + <dd>Yleiskatsaus JavaScriptin tietorakenteista.</dd> + <dt><a href="/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness">Yhtä kuin -vertailu ja samankaltaisuus</a></dt> + <dd>JavaScript tarjoaa kolme erilaista arvonvertailuoperaattoria: tiukka yhdenvertaisuus <code>===</code>-operaattoria käyttämällä, väljä yhdenvertaisuus <code>==</code>-operaattoria käyttämällä sekä {{jsxref("Global_Objects/Object/is", "Object.is()")}}-metodi.</dd> + <dt><a href="/en-US/docs/Web/JavaScript/Closures">Sulkeumat</a></dt> + <dd> + <p>Sulkeuma on yhdistelmä funktiota sekä kirjoitusympäristöä, jossa kyseinen funktio määriteltiin.</p> + </dd> +</dl> + +<h3 id="Edistyneet">Edistyneet</h3> + +<dl> + <dt><a href="/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain">Periytyminen ja prototyyppiketjut</a></dt> + <dd>Kuvaus laajasti väärinkäsitetystä ja aliarvioidusta prototyyppipohjaisesta periytymismallista.</dd> + <dt><a href="/en-US/docs/Web/JavaScript/Reference/Strict_mode">Strict-tila</a></dt> + <dd>Strict-tila määritelee sen, että muuttujia ei pysty käyttämään ennen kuin ne ovat alustettu. Se on rajoitettu variaatio ECMAScript 5:stä, jolla on parempi suorituskyky ja jota on helpompi "debugata".</dd> + <dt><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScriptin tyypitetyt taulukot</a></dt> + <dd>JavaScriptin tyypitetyt taulukot mahdollistavat pääsyn raakaan binääridataan.</dd> + <dt><a href="/en-US/docs/Web/JavaScript/Memory_Management">Muistinhallinta</a></dt> + <dd>Muistin elämänkaari ja roskien keruu JavaScriptissä.</dd> + <dt><a href="/en-US/docs/Web/JavaScript/EventLoop">Samanaikaisuusmalli ja tapahtumasilmukka</a></dt> + <dd>JavaScriptin samankaltaisuusmalli perustuu "tapahtumasilmukkaan".</dd> +</dl> +</div> + +<div class="column-half"> +<h2 id="Viite">Viite</h2> + +<p>Selaa täydellistä <a href="/en-US/docs/Web/JavaScript/Reference">JavaScript-viitedokumentaatiota</a>.</p> + +<dl> + <dt><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects">Vakio-oliot</a></dt> + <dd>Tutustu vakiona sisäänrakennettuihin olioihin {{jsxref("Array")}}, {{jsxref("Boolean")}}, {{jsxref("Date")}}, {{jsxref("Error")}}, {{jsxref("Function")}}, {{jsxref("JSON")}}, {{jsxref("Math")}}, {{jsxref("Number")}}, {{jsxref("Object")}}, {{jsxref("RegExp")}}, {{jsxref("String")}}, {{jsxref("Map")}}, {{jsxref("Set")}}, {{jsxref("WeakMap")}}, {{jsxref("WeakSet")}} sekä muihin.</dd> + <dt><a href="/en-US/docs/Web/JavaScript/Reference/Operators">Expressions and operators</a></dt> + <dd>Learn more about the behavior of JavaScript's operators {{jsxref("Operators/instanceof", "instanceof")}}, {{jsxref("Operators/typeof", "typeof")}}, {{jsxref("Operators/new", "new")}}, {{jsxref("Operators/this", "this")}}, the <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence">operator precedence</a>, and more.</dd> + <dt><a href="/en-US/docs/Web/JavaScript/Reference/Statements">Statements and declarations</a></dt> + <dd>Learn how {{jsxref("Statements/do...while", "do-while")}}, {{jsxref("Statements/for...in", "for-in")}}, {{jsxref("Statements/for...of", "for-of")}}, {{jsxref("Statements/try...catch", "try-catch")}}, {{jsxref("Statements/let", "let")}}, {{jsxref("Statements/var", "var")}}, {{jsxref("Statements/const", "const")}}, {{jsxref("Statements/if...else", "if-else")}}, {{jsxref("Statements/switch", "switch")}}, and more JavaScript statements and keywords work.</dd> + <dt><a href="/en-US/docs/Web/JavaScript/Reference/Functions">Funktiot</a></dt> + <dd>Opi työskentelemään JavaScriptin funktioiden kanssa kehittääksesi sovelluksiasi.</dd> +</dl> + +<h2 id="Työkalut_resurssit">Työkalut & resurssit</h2> + +<p>Helpful tools for writing and debugging your <strong>JavaScript </strong>code.</p> + +<dl> + <dt><a href="/en-US/docs/Tools">Firefox Developer Tools</a></dt> + <dd><a href="/en-US/docs/Tools/Web_Console">Web Console</a>, <a href="/en-US/docs/Tools/Profiler">JavaScript Profiler</a>, <a href="/en-US/docs/Tools/Debugger">Debugger</a>, and more.</dd> + <dt><a href="/en-US/docs/Web/JavaScript/Shells">JavaScript Shells</a></dt> + <dd>A JavaScript shell allows you to quickly test snippets of JavaScript code.</dd> + <dt><a href="https://togetherjs.com/">TogetherJS</a></dt> + <dd>Collaboration made easy. By adding TogetherJS to your site, your users can help each other out on a website in real time!</dd> + <dt><a href="https://stackoverflow.com/questions/tagged/javascript">Stack Overflow</a></dt> + <dd>Stack Overflow questions tagged with "JavaScript".</dd> + <dt><a href="/en-US/docs/Web/JavaScript/New_in_JavaScript">JavaScript versions and release notes</a></dt> + <dd>Browse JavaScript's feature history and implementation status.</dd> + <dt><a href="https://jsfiddle.net/">JSFiddle</a></dt> + <dd>Edit JavaScript, CSS, HTML and get live results. Use external resources and collaborate with your team online.</dd> + <dt><a href="https://plnkr.co/">Plunker</a></dt> + <dd>Plunker is an online community for creating, collaborating on and sharing your web development ideas. Edit your JavaScript, CSS, HTML files and get live results and file structure.</dd> + <dt><a href="https://jsbin.com/">JSBin</a></dt> + <dd> + <p>JS Bin is an open source collaborative web development debugging tool.</p> + </dd> + <dt><a href="https://codepen.io/">Codepen</a></dt> + <dd> + <p>Codepen is another collaborative web development tool used as a live result playground.</p> + </dd> + <dt><a href="https://stackblitz.com/">StackBlitz</a></dt> + <dd> + <p>StackBlitz is another online playground/debugging tool, which can host and deploy full stack applications using React, Angular, etc.</p> + </dd> +</dl> +</div> +</div> diff --git a/files/fi/web/reference/index.html b/files/fi/web/reference/index.html new file mode 100644 index 0000000000..45b6594981 --- /dev/null +++ b/files/fi/web/reference/index.html @@ -0,0 +1,29 @@ +--- +title: Web-teknologian referenssi +slug: Web/Reference +tags: + - Landing + - Reference + - Web +translation_of: Web/Reference +--- +<p>{{draft()}}<br> + The open web is built using a number of technologies that require an adequate knowledge in order to use them. Below you'll find the links to our reference material for each of them.</p> + +<h2 class="Documentation" id="Web-teknologiat">Web-teknologiat</h2> + +<p>It is recommended that you already <a href="https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web">got started with the web</a>, however it isn't absolutely necessary.</p> + +<dl> + <dt><strong><a href="/en-US/docs/Glossary/HTML">HTML</a></strong> — Verkon jäsentäminen</dt> + <dd><strong>HyperText Markup Language</strong> is used to define and describe semantically the content (<a href="/en-US/docs/Glossary/markup">markup</a>) of a web page in a well-structured format. HTML provides a means to create structured documents made up of blocks called <a href="/en-US/docs/Web/HTML/Element">HTML elements</a> that are delineated by <em><a href="/en-US/docs/Glossary/Tag">tags</a></em>, written using angle brackets. Some introduce content into the page directly, others provide information about document text and may include other tags as sub-elements. Obviously, browsers do not display them, since they are used to interpret the content of the page.<br> + <br> + <a href="/en-US/Learn/HTML/Introduction_to_HTML">Introduction to HTML</a> | <a href="/en-US/Learn/HTML">Learn HTML</a> | <a href="/en-US/docs/Web/Guide/HTML/HTML5">HTML5</a> | <a href="/en-US/docs/Web/Guide/HTML">Developer guide</a> | <a href="/en-US/docs/Web/HTML/Element">Element reference</a> | <a href="/en-US/docs/Web/HTML/Reference">Reference</a></dd> + <dt><strong><a href="/en-US/docs/Glossary/CSS">CSS</a></strong> — Verkon muotoilu</dt> + <dd><strong>Cascading Style Sheets</strong> are used to describe the appearance of web content.<br> + <br> + <a href="/en-US/Learn/CSS/Introduction_to_CSS">Introduction to CSS</a>  | <a href="/en-US/docs/Web/Guide/CSS/Getting_started">Getting started with CSS</a> | <a href="/en-US/Learn/CSS">Learn CSS</a> | <a href="/en-US/docs/Web/CSS/CSS3">CSS3 </a>| <a href="/en-US/docs/Web/Guide/CSS">Developer guide</a> | <a href="/en-US/docs/Web/CSS/Common_CSS_Questions">Common CSS questions</a> | <a href="/en-US/docs/Web/CSS/Reference">Reference</a></dd> + <dt><strong><a href="/en-US/docs/Glossary/JavaScript">JavaScript</a></strong> — Dynaaminen asiakaspuolen skriptaus</dt> + <dd>The <strong>JavaScript </strong>programming language is used to add interactivity and other dynamic features to web sites.</dd> + <dd><a href="/en-US/docs/Learn/JavaScript">Learn JavaScript</a> | <a href="/en-US/docs/Web/JavaScript/Guide">Developer guide</a> | <a href="/en-US/docs/Web/JavaScript/Reference">Reference</a></dd> +</dl> -- cgit v1.2.3-54-g00ecf