1
Fork 0
mirror of https://github.com/Steffo99/unisteffo.git synced 2024-11-22 16:04:21 +00:00

Update a lot of things

This commit is contained in:
Steffo 2020-05-24 00:53:01 +02:00
parent 2d050bc737
commit 7139a249e2
Signed by: steffo
GPG key ID: 896A80F55F7C97F0
19 changed files with 221 additions and 245 deletions

10
src/components/Example.js Normal file
View file

@ -0,0 +1,10 @@
import style from "./Example.less";
import {Component} from "preact";
export default function(props) {
return (
<div class={style.example}>
{props.children}
</div>
);
}

View file

@ -0,0 +1,31 @@
@import "../styles/constants.less";
@eplus: fade(@example, 5%);
@eplusplus: fade(@example, 10%);
.example {
color: @example;
background-color: @eplus;
padding: 4px;
border-radius: 4px;
margin: 4px 0;
table {
border-spacing: 0;
border: 2px solid @eplusplus;
background-color: @eplus;
border-collapse: collapse;
thead, tbody {
th, td {
padding: 4px;
border: 1px solid @eplusplus;
}
}
thead {
background-color: @eplusplus;
color: @accent;
}
}
}

5
src/components/Image.js Normal file
View file

@ -0,0 +1,5 @@
export default function(props) {
return (
<a href={props.src} title={props.alt} target={"_blank"}><img src={props.src} alt={props.alt}/></a>
)
}

View file

@ -1,18 +1,29 @@
import style from './latex.css';
import style from './Latex.css';
import {useContext} from "preact/hooks";
import LatexRenderColor from "../contexts/LatexRenderColor";
import LatexDefaultInline from "../contexts/LatexDefaultInline";
export default function(props) {
let renderColor = useContext(LatexRenderColor);
// black, blue, brown, cyan, darkgray, gray, green, lightgray, lime, magenta, olive, orange, pink, purple, red, teal, violet, white, yellow
let inline = props.inline ? `\\inline` : "";
let renderColor = useContext(LatexRenderColor);
let defaultInline = useContext(LatexDefaultInline);
let is_inline;
if(props.inline === undefined) {
is_inline = defaultInline;
}
else {
is_inline = props.inline;
}
let inline = is_inline ? `\\inline` : "";
let equation = `${inline} {\\color{${renderColor}} ${props.children} }`;
return (
<img src={`https://latex.codecogs.com/svg.latex?${equation}`}
alt={props.children}
title={props.children}
class={style.latex}
/>);
/>
);
}

View file

@ -1,10 +0,0 @@
.example {
border: none;
color: #d3a1ff;
background-color: rgba(211, 161, 255, 0.1);
border-radius: 4px;
}
.example::before {
content: "♦ ";
}

View file

@ -1,12 +0,0 @@
import style from "./example.css";
import {Component} from "preact";
export default class Example extends Component {
render() {
return (
<blockquote class={style.example}>
{this.props.children}
</blockquote>
)
}
}

View file

@ -1,4 +1,4 @@
import style from "./panel.css";
import style from "./panel.less";
import { Component } from 'preact';
export default class Panel extends Component {

View file

@ -1,6 +1,8 @@
@import "../../styles/constants.less";
.panel {
background-color: rgba(62.7%, 80%, 100%, 0.1);
padding: 4px;
background-color: @plus;
padding: 8px;
border-radius: 4px;
margin: 4px;
height: calc(100% - 8px);

View file

@ -0,0 +1,3 @@
import {createContext} from "preact";
export default createContext(true);

View file

@ -1,4 +1,4 @@
@import "./styles/constants.less";
@import "styles/constants.less";
* {
box-sizing: border-box;
@ -14,10 +14,12 @@ h1, h2, h3, h4, h5, h6 {
margin-top: 4px;
margin-bottom: 4px;
color: @accent;
font-family: @title;
font-weight: normal;
text-align: center;
}
// By default h1 are as large as h2
h1 {
font-size: xx-large;
}
@ -27,46 +29,45 @@ a {
text-decoration: none;
&:hover {
color: #4affff;
color: @linkhover;
}
&:active {
color: #ffffff;
color: @linkactive;
}
}
img {
img, iframe {
max-width: 100%;
max-height: 300px;
border-radius: 4px;
}
b {
color: @accent;
}
code {
pre, code {
font-family: @mono;
font-size: 14px;
}
blockquote {
color: @fg;
border-left: 3px solid @fg;
background-color: fade(@fg, 10%);
border-left: 3px solid @plusplusplusplus;
background-color: @plus;
padding: 4px 4px 4px 8px;
margin: 8px;
margin: 8px 0;
}
input[type="text"], input[type="password"] {
color: @fg;
background-color: @bg;
border: 1px solid @bg-lighter;
border: 1px solid @plusplus;
border-radius: 4px;
padding: 4px;
font-size: medium;
&:disabled {
color: grey;
background-color: #1f1f1f;
&:disabled, &.disabled {
color: @disabledfg;
background-color: @disabledbg;
border-style: dotted;
cursor: not-allowed;
}
}
@ -74,52 +75,53 @@ input[type="text"], input[type="password"] {
button {
color: @fg;
background-color: @bg;
border: 1px solid @bg-lighter;
border: 1px solid @plusplus;
border-radius: 4px;
padding: 4px;
font-size: medium;
&:hover {
background-color: @bg-light;
&:hover, &.hover {
background-color: @plusplus;
border: 1px solid @fg;
color: @fg;
}
&:active {
background-color: @bg-lighter;
border: 1px solid @fg;
&:active, &.active {
background-color: fade(@accent, 20%);
border: 1px solid @accent;
color: @accent;
}
&.disabled {
color: grey;
background-color: #1f1f1f;
&:disabled, &.disabled {
color: @disabledfg;
background-color: @disabledbg;
border-style: dotted;
cursor: not-allowed;
}
}
hr {
border: 1px solid @bg-light;
border: 1px solid @plusplusplusplus;
margin-top: 24px;
margin-bottom: 24px;
}
table {
border-spacing: 0;
border: 2px solid @bg-lighter;
background-color: @bg-light;
border-radius: 4px;
border: 2px solid @plusplus;
background-color: @plus;
border-collapse: collapse;
thead, tbody {
th, td {
padding: 4px;
border: 1px solid @bg-lighter;
border: 1px solid @plusplus;
}
}
thead {
background-color: @bg-lighter;
background-color: @plusplus;
color: @accent;
border-radius: 4px 4px 0 0;
}
}
@ -127,14 +129,10 @@ li {
margin: 10px 0;
}
.left {
text-align: left;
p:first-child {
margin-top: 0;
}
.center {
text-align: center;
}
.right {
text-align: right;
p:last-child {
margin-bottom: 0;
}

View file

@ -1,9 +1,7 @@
import {Component} from 'preact'
import Split from "../components/old/split";
import Latex from "../components/latex";
import Panel from "../components/old/panel";
import Example from "../components/old/example";
import Todo from "../components/old/todo";
import Example from "../components/example";
import Code from "../components/old/code";
const r = String.raw;

View file

@ -1,9 +1,6 @@
import {Component} from 'preact'
import Split from "../components/old/split";
import Latex from "../components/latex";
import Panel from "../components/old/panel";
import Example from "../components/old/example";
import Todo from "../components/old/todo";
import Timer from "../components/old/timer";
const r = String.raw;

View file

@ -1,8 +1,8 @@
import {Component} from 'preact'
import Split from "../components/old/split";
import Latex from "../components/latex";
import Latex from "../components/Latex";
import Panel from "../components/old/panel";
import Example from "../components/old/example";
import Example from "../components/example";
import Todo from "../components/old/todo";
import Timer from "../components/old/timer";

View file

@ -1,16 +1,18 @@
import { Component } from 'preact';
import Latex from '../components/latex';
import Latex from '../components/Latex';
import Panel from '../components/old/panel';
import Split from '../components/old/split';
import Plus from '../components/old/plus';
import Minus from '../components/old/minus';
import Todo from '../components/old/todo';
import LatexDefaultInline from "../contexts/LatexDefaultInline";
const r = String.raw;
export default class Fisica extends Component {
render() {
return (
<LatexDefaultInline.Provider value={false}>
<div>
<h1>Fisica</h1>
<Split title="Vettori">
@ -1187,6 +1189,7 @@ export default class Fisica extends Component {
</Panel>
</Split>
</div>
</LatexDefaultInline.Provider>
)
}
}

View file

@ -1,12 +1,14 @@
import {Component} from 'preact'
import Split from "../components/old/split";
import Latex from "../components/latex";
import Latex from "../components/Latex";
import Panel from "../components/old/panel";
import Example from "../components/old/example";
import Example from "../components/example";
import Todo from "../components/old/todo";
import Minus from "../components/old/minus";
import Plus from "../components/old/plus";
import Code from "../components/old/code";
import Timer from "../components/old/timer";
import Image from "../components/Image";
const r = String.raw;
@ -15,7 +17,7 @@ export default class OttimizzazioneLineare extends Component {
return (
<div>
<h1>Ottimizzazione lineare intera</h1>
<Split title={"Materiale"}>
<Split title={"Unimore"}>
<Panel title={"Videolezioni su YouTube"}>
<p>
Ho rimosso il rumore in sottofondo da tutti i video di Ricerca Operativa!
@ -24,6 +26,13 @@ export default class OttimizzazioneLineare extends Component {
<b><a href={"https://www.youtube.com/playlist?list=PLh93e8qjTszffkHNn-19CqUOhHFbhBlBh"}>Guardate i video qui!</a></b>
</p>
</Panel>
<Panel title={"Prossimi appelli"}>
<ol>
<li><Timer to={"2020-06-08"}/></li>
<li><Timer to={"2020-06-25"}/></li>
<li><Timer to={"2020-07-14"}/></li>
</ol>
</Panel>
</Split>
<Split title={"Le basi"}>
<Panel title={"Funzione obiettivo"}>
@ -112,67 +121,73 @@ export default class OttimizzazioneLineare extends Component {
Un modo per rappresentare sistemi in forma standard, anche noto come <b>matrice equivalente completa</b> del sistema.
</p>
<Example>
Il sistema:<br/><br/>
<Latex>{r`
\begin{cases}
2000A + 1000B = z\\
1A \leq 3\\
1B \leq 3\\
2A + 2B \leq 7
\end{cases}
`}</Latex><br/><br/>
Diventa in forma di tableau:<br/><br/>
<table class={"right"}>
<thead>
<tr>
<th><abbr title={"Termine noto"}>TN</abbr></th>
<th><Latex>A</Latex></th>
<th><Latex>B</Latex></th>
<th><Latex>s_1</Latex></th>
<th><Latex>s_2</Latex></th>
</tr>
</thead>
<tbody>
<tr>
<td><Latex>z</Latex></td>
<td><Latex>2000</Latex></td>
<td><Latex>1000</Latex></td>
<td><Latex>0</Latex></td>
<td><Latex>0</Latex></td>
</tr>
<tr>
<td><Latex>3</Latex></td>
<td><Latex>1</Latex></td>
<td><Latex>0</Latex></td>
<td><Latex>1</Latex></td>
<td><Latex>0</Latex></td>
</tr>
<tr>
<td><Latex>3</Latex></td>
<td><Latex>0</Latex></td>
<td><Latex>1</Latex></td>
<td><Latex>0</Latex></td>
<td><Latex>1</Latex></td>
</tr>
<tr>
<td><Latex>7</Latex></td>
<td><Latex>2</Latex></td>
<td><Latex>2</Latex></td>
<td><Latex>0</Latex></td>
<td><Latex>0</Latex></td>
</tr>
</tbody>
</table>
Il sistema:<br/><br/>
<Latex>{r`
\begin{cases}
2000A + 1000B = z\\
1A \leq 3\\
1B \leq 3\\
2A + 2B \leq 7
\end{cases}
`}</Latex><br/><br/>
Diventa in forma di tableau:<br/><br/>
<table class={"right"}>
<thead>
<tr>
<th><abbr title={"Termine noto"}>TN</abbr></th>
<th><Latex>x_1</Latex></th>
<th><Latex>x_2</Latex></th>
<th><Latex>s_1</Latex></th>
<th><Latex>s_2</Latex></th>
</tr>
</thead>
<tbody>
<tr>
<td><Latex>z</Latex></td>
<td><Latex>2000</Latex></td>
<td><Latex>1000</Latex></td>
<td><Latex>0</Latex></td>
<td><Latex>0</Latex></td>
</tr>
<tr>
<td><Latex>3</Latex></td>
<td><Latex>1</Latex></td>
<td><Latex>0</Latex></td>
<td><Latex>1</Latex></td>
<td><Latex>0</Latex></td>
</tr>
<tr>
<td><Latex>3</Latex></td>
<td><Latex>0</Latex></td>
<td><Latex>1</Latex></td>
<td><Latex>0</Latex></td>
<td><Latex>1</Latex></td>
</tr>
<tr>
<td><Latex>7</Latex></td>
<td><Latex>2</Latex></td>
<td><Latex>2</Latex></td>
<td><Latex>0</Latex></td>
<td><Latex>0</Latex></td>
</tr>
</tbody>
</table>
</Example>
</Panel>
<Panel title={"Variabili di base"}>
<p>
<Todo>TODO: come spiegarla?</Todo>
Variabili che hanno tutti 0 e un 1 nella loro colonna del tableu.
</p>
<p>
La loro controparte sono le <i>variabili fuori base</i>.
</p>
<p>
Un sistema lineare è risolto quando tutte le variabili originali (<Latex>x_n</Latex>) sono nella base.
</p>
</Panel>
</Split>
<Split title={"Simplex"}>
<Panel title={"Simplex"}>
<Panel title={"Cos'è?"}>
<p>
Un algoritmo per massimizzare efficientemente variabili di sistemi lineari, derivato da Gauss-Jordan.
</p>
@ -186,7 +201,7 @@ export default class OttimizzazioneLineare extends Component {
<li>Finchè ci sono variabili con coefficienti positivi nella funzione obiettivo:
<ol>
<li><b>Scegli</b> una variabile della funzione obiettivo, chiamandola <i>variabile entrante</i>. <Example>Come? Vedi nel prossimo pannello.</Example></li>
<li>Trova la variabile di base (detta <i>variabile uscente</i>) con il <b>valore minore</b> per questo rapporto: <Code>termine noto / coeff. variabile entrante</Code></li>
<li>Trova la variabile di base (detta <i>variabile uscente</i>) con il <b>valore minore</b> per il rapporto <Latex>{r`\frac{termine\ noto}{coeff.\ variabile\ entrante}`}</Latex></li>
<li><b>Riscrivi</b> tutte le funzioni del sistema in termini della variabile entrante.</li>
</ol>
</li>
@ -203,9 +218,17 @@ export default class OttimizzazioneLineare extends Component {
<li>Coefficiente maggiore nella funzione obiettivo.</li>
<li>Incremento maggiore della funzione obiettivo.</li>
<li>A caso.</li>
<li><i>Regola di Bland</i>: scegli variabili entranti e uscenti con indice minore. <Example>Impedisce cicli infiniti!</Example></li>
<li><i>Regola di Bland</i>: scegli variabili entranti e uscenti con indice minore (ovvero, prendi le prime possibili). <Example>È usato nella teoria perchè impedisce i cicli infiniti!</Example></li>
</ul>
</Panel>
<Panel title={"Esempio"}>
<Example>
Ho risolto il problema 3 del file <a href={"https://dolly.fim.unimore.it/2019/mod/resource/view.php?id=2716"}><code>Ex_LP_testo</code></a> con il Simplex:
<p>
<Image src={"https://i.imgur.com/1r405Mb.jpg"}/>
</p>
</Example>
</Panel>
</Split>
<Split title={"Metodo delle due fasi"}>
<Panel title={"Metodo delle due fasi"}>

View file

@ -1,118 +1,18 @@
import { Component } from 'preact';
import Latex from '../components/latex';
import Latex from '../components/Latex';
import Panel from '../components/old/panel';
import Split from '../components/old/split';
import Todo from '../components/old/todo';
import Theorem from "../components/old/theorem";
import Hypothesis from "../components/old/hypothesis";
import Thesis from "../components/old/thesis";
import Proof from "../components/old/proof";
import Example from "../components/old/example";
import Example from "../components/example";
import Plus from "../components/old/plus";
import Minus from "../components/old/minus";
import LatexDefaultInline from "../contexts/LatexDefaultInline";
const r = String.raw;
export default class Statistica extends Component {
render() {
/*
<Split title={"Popolazioni"}>
<Panel title={"Popolazione"} id={"popolazione"}>
<p>
Gruppo <b>intero</b> di oggetti di cui si cercano informazioni.
</p>
</Panel>
<Panel title={"Popolazione tangibile"}>
<p>
Popolazione finita di oggetti concreti che possono essere campionati ciascuno solo una volta.
</p>
</Panel>
<Panel title={"Popolazione concettuale"}>
<p>
Popolazione di valori ottenuti da prove sperimentali indipendenti ripetute più volte.
</p>
</Panel>
</Split>
<Split title={"Campionamento"}>
<Panel title={"Campione"}>
<p>
Sottoinsieme della <a href={"#popolazione"}>popolazione</a> che contiene gli oggetti che si sono osservati.
</p>
</Panel>
<Panel title={<i>Simple random sample</i>}>
<p>
Campione di una data dimensione in cui qualsiasi selezione di <i>n</i> elementi ha la stessa probabilità di costituire il campione.
</p>
</Panel>
<Panel title={<i>Sample of convenience</i>}>
<p>
Campione ottenuto in un modo casuale non ben definito.
</p>
</Panel>
<Panel title={<i>Sample with replacement</i>}>
<p>
Campione ottenuto sostituendo nella popolazione gli elementi estratti con dei nuovi elementi.
</p>
<p>
Dire che un campione è ottenuto <i>with replacement</i> è equivalente a dire che la popolazione che si sta campionando è infinita, e quindi che tutti gli elementi sono indipendenti.
</p>
</Panel>
<Panel title={"Campione pesato"}>
<p>
Campione ottenuto da una popolazione in cui certi elementi hanno più probabilità di essere stati selezionati di altri.
</p>
</Panel>
<Panel title={<i>Stratified random sample</i>}>
<p>
Campione ottenuto da un sottoinsieme della popolazione detto <i>strato</i>.
</p>
</Panel>
<Panel title={<i>Cluster sample</i>}>
<p>
Campione ottenuto selezionando più <i>cluster</i> di elementi alla volta.
</p>
</Panel>
</Split>
<Split>
<Panel title={<i>Sampling variation</i>}>
<p>
Differenza di informazioni presente tra due campioni diversi della stessa popolazione.
</p>
</Panel>
<Panel title={"Indipendenza"}>
<p>
Gli elementi in un campione sono indipendenti se gli elementi estratti in precedenza non influsicono <small>significativamente</small> sulle probabilità di estrazione dell'elemento successivo.
</p>
</Panel>
</Split>
<Split title={"Tipi di prove sperimentali"}>
<Panel title={"A campione singolo"}>
<p>
Esperimento in cui c'è una sola popolazione da cui vengono estratti campioni.
</p>
<p>
Serve per verificare delle condizioni.
</p>
</Panel>
<Panel title={"Multicampione"}>
<p>
Esperimento in cui sono presenti più popolazioni (aventi caratteristiche differenti una dall'altra dette <i>fattori</i>) da cui vengono estratti campioni.
</p>
<p>
Serve per capire quali fattori influenzano il risultato dell'esperimento.
</p>
</Panel>
</Split>
<Split title={"Tipi di dato"}>
<Panel title={<span>Numerico<small> o quantitativo</small></span>}>
Il dato descrive un valore numerico relativo all'elemento, come ad esempio una quantità fisica.
</Panel>
<Panel title={<span>Categorico<small> o qualitativo</small></span>}>
Il dato indica una categoria a cui appartiene l'elemento, come ad esempio il suo colore.
</Panel>
</Split>
*/
return (
<LatexDefaultInline.Provider value={false}>
<div>
<h1>Statistica ed Elementi di Probabilità</h1>
<Split title={"Tipi di probabilità"}>
@ -2095,6 +1995,7 @@ export default class Statistica extends Component {
</Panel>
</Split>
</div>
</LatexDefaultInline.Provider>
)
}
}

View file

@ -1,9 +1,18 @@
@bg: #0d193b;
@bg-light: #1c2b4f;
@bg-lighter: #2a3d62;
@bg-light: #142245;
@bg-lighter: #1c2b4f;
@bg-lightest: #233358;
@fg: #a0ccff;
@accent: #ffffff;
@link: #00caca;
@linkhover: #00ffff;
@linkactive: #a0ffff;
@plus: fade(@fg, 5%);
@plusplus: fade(@fg, 10%);
@plusplusplus: fade(@fg, 15%);
@plusplusplusplus: fade(@fg, 20%);
@red: #ff7d7d;
@orange: #ffbb7d;
@ -13,5 +22,12 @@
@blue: #7d7dff;
@magenta: #ff7dff;
@sans: sans-serif;
@disabledfg: #808080;
@disabledbg: #1f1f1f;
@sans: "Arial", sans-serif;
@text: "Calibri", sans-serif;
@title: "Arial", sans-serif;
@mono: "Consolas", "SFMono-Regular", "Liberation Mono", "Menlo", monospace;
@example: #d3a1ff;

View file

@ -1,4 +1,4 @@
@import "./constants.less";
@import "constants.less";
.CodeMirror {
font-family: "Consolas", monospace !important;