React: weather widget

3 years ago · 40b290f418
parent 0391077c02
commit 40b290f418
7 changed files with 1671 additions and 454 deletions
--- a/.obsidian/plugins/fantasy-calendar/data.json
+++ b/.obsidian/plugins/fantasy-calendar/data.json
@ -181,9 +181,9 @@
        "offset": 2
      },
      "current": {
-        "year": 2022,
+        "day": 9,
        "month": 0,
-        "day": 20
+        "year": 2022
      },
      "events": [
        {
--- a/.obsidian/plugins/obsidian-activity-history/data.json
+++ b/.obsidian/plugins/obsidian-activity-history/data.json
@ -13,7 +13,7 @@
    {
      "path": "/",
      "date": "2022-01-09",
-      "size": 697479
+      "size": 699997
    }
  ],
  "activityHistory": [
@ -26,7 +26,7 @@
        },
        {
          "date": "2022-01-09",
-          "value": 7249
+          "value": 12053
        }
      ]
    }
--- a/.obsidian/plugins/rss-reader/data.json
+++ b/.obsidian/plugins/rss-reader/data.json
--- a/.obsidian/workspace
+++ b/.obsidian/workspace
@ -9,7 +9,7 @@
        "state": {
          "type": "markdown",
          "state": {
-            "file": "03.01 Reading list/@Reading master.md",
+            "file": "01.02 Home/@Main Dashboard.md",
            "mode": "preview"
          }
        }
@ -76,7 +76,7 @@
        "state": {
          "type": "backlink",
          "state": {
-            "file": "03.01 Reading list/@Reading master.md",
+            "file": "01.02 Home/@Main Dashboard.md",
            "collapseAll": false,
            "extraContext": false,
            "sortOrder": "alphabetical",
@ -141,7 +141,7 @@
        "state": {
          "type": "outgoing-link",
          "state": {
-            "file": "03.01 Reading list/@Reading master.md",
+            "file": "01.02 Home/@Main Dashboard.md",
            "linksCollapsed": false,
            "unlinkedCollapsed": true
          }
@ -151,15 +151,15 @@
  },
  "active": "0204ce7a98b762a7",
  "lastOpenFiles": [
-    "03.01 Reading list/@Reading master.md",
    "01.02 Home/@Main Dashboard.md",
-    "00.02 Inbox/Civilizations.md",
-    "03.01 Reading list/Dans les forêts de Sibérie.md",
+    "01.02 Home/@Shopping list.md",
    "00.03 News/News.md",
-    "05.01 Computer setup/Storage and Syncing.md",
-    "00.01 Admin/Obsidian plugins.md",
    "00.01 Admin/Test sheet.md",
    "00.01 Admin/React/Weather.md",
-    "00.01 Admin/React/Clock.md"
+    "03.01 Reading list/@Reading master.md",
+    "03.01 Reading list/Le jour où j'ai appris à vivre.md",
+    "03.01 Reading list/L'ombre du vent.md",
+    "00.02 Inbox/Civilizations.md",
+    "03.01 Reading list/Dans les forêts de Sibérie.md"
  ]
 }
--- a/Inbox/Civilizations.md
+++ b/Inbox/Civilizations.md
@ -50,7 +50,13 @@ id Save
 ```ad-abstract
 title: Summary
 collapse: open
-Lien : On a bien envie d'en savoir plus, après s'être un peu ennuyé sur la partie invasion des Vikings, et beaucoup sur les aventures de Christophe Colomb.
+Vers l'an mille : la fille d’Erik le Rouge met cap au sud avec son mari, quelques hommes, du bétail et des chevaux.  
+1492 : Colomb ne découvre pas l'Amérique.  
+1531 : les Incas envahissent l'Europe.
+
+Ce qui a manqué aux Incas pour résister aux conquistadors : le cheval, le fer, les anticorps. Dans Civilizations, les Vikings les leur ont apportés. Quelques siècles plus tard, Atahualpa débarque dans l'Europe de Charles Quint. Il trouve un continent déchiré par les querelles religieuses et dynastiques. Mais surtout, des populations brimées, affamées, au bord du soulèvement – des alliés.
+
+Voici le récit d’une autre mondialisation, telle qu'au fond il s'en est fallu d'un rien pour qu'elle l'emporte et devienne réalité.
 ```

 &emsp;
--- a/Dashboard.md
+++ b/Dashboard.md
@ -42,39 +42,64 @@ id Save
 &emsp;

 ```jsx:
-import { Canvas, useFrame } from 'https://cdn.skypack.dev/@react-three/fiber'
-
-function Box(props) {
-
- const mesh = useRef()
-
- const [hovered, setHover] = useState(false)
- const [active, setActive] = useState(false)
-
- useFrame((state, delta) => (mesh.current.rotation.x += 0.01))
-
- return (
-  <mesh
-   {...props}
-   ref={mesh}
-   scale={active ? 1.5 : 1}
-   onClick={(event) => setActive(!active)}
-   onPointerOver={(event) => setHover(true)}
-   onPointerOut={(event) => setHover(false)}
- >
-  <boxGeometry args={[1, 1, 1]} />
-  <meshStandardMaterial color={hovered ?   'hotpink' : 'orange'} />
-  </mesh>  
- )
+const C = props=>{
+	const ref = useRef();
+	useEffect(()=>{
+		(async ()=>{
+		let iframe = ref.current;
+			//replace outdated api keys
+    const response =await fetch("https://unpkg.com/vue-weather-widget@3.0.2/dist/js/vue-weather-widget.js");
+    let js  = await response.text();
+    js = js.replaceAll("c3bb8aa0a56b21122dea6a2a8ada70c8", "7f9c71310f410847fceb9537a83f3882");
+	const dataUri = 'data:text/javascript;charset=utf-8,'
+  + encodeURIComponent(js);
+			
+		var html = `
+<!-- Requirements -->
+<script
+  src="https://code.jquery.com/jquery-3.2.1.min.js"
+  integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
+  crossorigin="anonymous"
+></script>
+<script
+  type="text/javascript"
+  src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.0/vue.js"
+></script>
+
+<!-- vue-weather-widget -->
+<script type="text/javascript" src="${dataUri}"></script>
+<link href="https://unpkg.com/vue-weather-widget@3.0.2/dist/css/vue-weather-widget.css" rel="stylesheet" /> 
+
+<!-- Vue app -->
+<div id="app">
+  <weather
+  	api-key="e20753dfcaae902ab091fbb4925d432a" 
+    latitude="47.3667"
+    longitude="8.55"
+    language="en"
+    units="ca"
+  > 
+  </weather>
+</div>
+ 
+<script>
+  new Vue({
+    el: "#app",
+    components: {
+      weather: VueWeatherWidget, 
+    },
+  });
+</script>
+
+`;
+		iframe.contentWindow.document.open();
+		iframe.contentWindow.document.write(html);
+		iframe.contentWindow.document.close();
+})()
+	})
+	return <iframe ref={ref} width="100%" height="250" frameBorder="0"/>
 }
-<Canvas>
- <ambientLight />
- <pointLight position={[10, 10, 10]} />
- <Box position={[-3.2, 0, 0]} />
- <Box position={[-1.2, 0, 0]} />
- <Box position={[1.2, 0, 0]} />
- <Box position={[3.2, 0, 0]} />
-</Canvas>
+<C />
 ```

 &emsp;
--- a/vivre.md
+++ b/vivre.md
@ -0,0 +1,88 @@
+---
+
+Tag: ["Novel", "Introspection", "LifeChange"]
+Date: 2022-01-09
+DocType: "Source"
+Hierarchy: "NonRoot"
+TimeStamp:
+location:
+CollapseMetaTable: yes
+Source:
+ Type: "Book"
+ Author: "Laurent Gounelle"
+ Language: FR
+ Published: 2014
+ Link: http://livre.fnac.com/a9321508/Laurent-Gounelle-Le-jour-ou-j-ai-appris-a-vivre
+ Read: 2021-02
+ Cover: https://librairiepleinciel.ma/4274-large_default/le-jour-ou-j-ai-appris-a-vivre-laurent-gounelle.jpg
+
+---
+
+Parent:: [[@Reading master|Reading list]]
+
+---
+
+&emsp;
+
+```button
+name Edit Source parameters
+type command
+action MetaEdit: Run MetaEdit
+id EditMetaData
+```
+^button-SourceEdit
+
+```button
+name Save
+type command
+action Save current file
+id Save
+```
+^button-TNSave
+
+&emsp;
+
+# Le jour où j'ai appris à vivre
+
+&emsp;
+
+```ad-abstract
+title: Summary
+collapse: open
+Belle leçon de vie! Alors qu'il se balade sur les baies du San Francisco, Jonathan croise le chemin d'une bohémienne qui lui révèle sa mort imminente! Déboussolé, il décide de faire une pause dans sa vie professionnelle.
+```
+
+&emsp;
+
+```toc
+style: number
+```
+
+&emsp;
+
+---
+
+&emsp;
+
+### Cover
+
+&emsp;
+
+```dataviewjs
+dv.el("span", "![](" + dv.current().Source.Cover + ")")
+```
+
+&emsp;
+
+---
+
+&emsp;
+
+### Notes
+
+&emsp;
+
+Loret ipsum
+
+&emsp;
+&emsp;