Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Permutacije #1

Open
wants to merge 1 commit into
base: gh-pages
Choose a base branch
from
Open

Permutacije #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
150 changes: 150 additions & 0 deletions p/permutacije.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,150 @@
<!DOCTYPE html>
<html lang="sl">
<head>
<meta charset="utf-8" />
<meta content="OPIS PREDSTAVITVE" name="description" />
<title>PERMUTACIJE</title>
<link href="../remark-style.css" rel="stylesheet" type="text/css">

<style>
body{font-family:'Yanone Kaffeesatz';color:white}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

od kje pa da pride tale font? če hočeš uporabljat custom fonte, jih moraš zloadat zraven (poglej v remark-style.css za primer). praktično ne morš predvidevat, da kerkol font-family, ki ni serif, sans-serif, monospace, obstaja na nekem računalniku.

.remark-container{background-color:#D7D8D2}
.remark-slide-content{background-color:#272822}
div{border-radius:5px;}
span{padding:3px;border-radius:10px;}
.red{background-color:red; color:white; font-weight:bold;}
.green{background-color:green; color:white; font-weight:bold}
.orange{background-color:orange; color:white; font-weight:bold}
</style>
</head>

<body>
<noscript>Če <b>omogočite JavaScript</b>, ta stran postane poučna prezentacija.</noscript>


<textarea id="source">
class: center, middle
# Permutacije
---
class: bottom
# Permutacije? Kombinacije?
## Kaj bi lahko bila razlika?
---
# Solata:
- .green[zelena solata], .red[paradižnik], .orange[korenje]


- .red[paradižnik], .orange[korenje], .green[zelena solata]
<img src = "../resources/permutacije/salad.png" style="position:absolute; float:right"/>
---
# Solata:
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

to ponavljanje cele vsebine slajdov ni kul. poglej pri mojih dveh primerih, kako narediš, da se slajd "nadaljuje v naslednjega": -- separator namesto ---.

- .green[zelena solata], .red[paradižnik], .orange[korenje]


- .red[paradižnik], .orange[korenje], .green[zelena solata]
<img src = "../resources/permutacije/salad.png" style="position:absolute; float:right"/>
<div style="color:white; padding:40px; margin:50px; border-style:solid; border-color:white; border-radius:30px;" >
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

tole pri meni ne izgleda lepo, solata je že na desni, ampak tisto besedilo mi pa v celoti centrira in pol, ker nimam ne vem kake diagonale, ga solata pol prekrije. se lahko besedilo mogoče da float:left al pa relative %-positioning al neki?

.center[.green[zelena solata], .red[paradižnik], .orange[korenje]]
.center[=]
.center[.red[paradižnik], .orange[korenje], .green[zelena solata]]
</div>
---
# Solata:
- .green[zelena solata], .red[paradižnik], .orange[korenje]


- .red[paradižnik], .orange[korenje], .green[zelena solata]
<img src = "../resources/permutacije/salad.png" style="position:absolute; float:right"/>
<div style="color:white; padding:40px; margin:50px; border-style:solid; border-color:white; border-radius:30px;" >
.center[.green[zelena solata], .red[paradižnik], .orange[korenje]]
.center[=]
.center[.red[paradižnik], .orange[korenje], .green[zelena solata]]
</div>
## Vrstni red ni pomemben = KOMBINACIJE
---
# Permutacije?

## Ključavnica za kolo
<img src="../resources/permutacije/combinationlock.jpg" style="width:50%; float:left;"/>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

mogoče bi blo fajn narest stil .w50 in potem .w50[.left[![alt text kar je na sliki](relative url)]] ?
take generične stvari, pa če se velik ponavljajo, so ziher za common styles imho.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

al pa .col2[] je tut kul ideja za width:50%? samo nardi se, da je default brez borderja, .col2b pa z borderjem al neki..col2 in .col2b (isto 3) že dodal v remark-style.css, to pa še ne vem, če dela: in pol gre .col2[![alt](url)] za levo-plavajoče in .right[.col2[...]] za desno.

---
# Permutacije?

## Ključavnica za kolo
<img src="../resources/permutacije/combinationlock.jpg" style="width:50%; float:left;"/>

<p style="float:right; font-weight:bold; margin-top:100px;margin-right:15px;">1,2,3 ni enako kot 3,2,1</p>
---
# Permutacije?
## Ključavnica za kolo
<img src="../resources/permutacije/combinationlock.jpg" style="width:50%; float:left;"/>

<p style="float:right; font-weight:bold; margin-top:100px;margin-right:15px;">1,2,3 ni enako kot 3,2,1</p>
<div style="border-style:solid; border-color:white;margin-top:200px;margin-left:450px; padding:10px;text-align:center;">
Z razliko od solate je vrstni red oziroma pozicija važna!
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ta primer s ključavnico se mi zdi dbest. zelo nazorno. a bi šlo mogoče, da bi namesto slajda za vsak stavek imel več primerov, kot je ključavnica, na tem slajdu?

</div>
---
# Permutacije s ponavljanjem:

<div id = "threejsDIV">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

kul bi blo, če je predstavitev ala kepice sladoleda, da nekje samo napišeš "sladoled" al neki. :)

</div>
---
# Permutacije brez ponavljanja?

---
# Permutacije brez ponavljanja?
* Ne želimo enakih okusov sladoleda

---
# Permutacije brez ponavljanja?
* Ne želimo enakih okusov sladoleda

# Kombinacije brez ponavljanja?
---
# Permutacije brez ponavljanja?
* Ne želimo enakih okusov sladoleda
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

tukaj se mi tudi zdi odveč za vsak stavek svoj slajd. za vsako temo že, a vsak stavek?? boš samo sedel in naprej pritiskal. :P


<img src = "../resources/permutacije/salad.png" style="position:absolute; float:right; padding-left:50%"/>

# Kombinacije brez ponavljanja?
* Prejšnji primer solate

---
# Permutacije brez ponavljanja?
* Ne želimo enakih okusov sladoleda

<img src = "../resources/permutacije/salad.png" style="position:absolute; float:right; padding-left:50%"/>

# Kombinacije brez ponavljanja?
* Prejšnji primer solate

# Kombinacije s ponavljanjem?
---
# Permutacije brez ponavljanja?
* Ne želimo enakih okusov sladoleda

<img src = "../resources/permutacije/salad.png" style="position:absolute; float:right; padding-left:50%"/>

# Kombinacije brez ponavljanja?
* Prejšnji primer solate

# Kombinacije s ponavljanjem?
* Spomnimo se primera s solato:
* .green[zelena solata], .green[zelena solata], .green[zelena solata]
* .green[zelena solata], .green[zelena solata], .red[paradižnik]

In tako dalje


Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

na koncu manjka še en zanimiv slajd:

---
# Permutacije in računski problemi
Določene probleme rešujemo s **preiskovanjem prostora stanj**:
generiramo vse možne potencialne rešitve (vse možnosti, npr. vse permutacije)
in za vsako preverimo, če je dejansko pravilna rešitev.

Npr. [Einsteinova "Zebra" uganka](http://sl.wikipedia.org/wiki/Einsteinova_uganka):
> Imamo pet hiš, vsaka v drugi barvi. V vsaki hiši je oseba druge narodnosti, vsak pije vsak svojo vrsto pijač, kadi svojo znamko cigaret in ima svojega hišnega ljubljenčka. Vsaka od lastnosti (narodnost, barva hiše, znamka cigaret, pijača in žival) se pojavi natanko enkrat.
> 1. Britanec živi v rdeči hiši.
> 2. Šved ima psa.
> ...
> 14. Norvežan živi poleg modre hiše.
> 15. Oseba, ki kadi Blend ima, soseda, ki pije vodo.
>
> Kdo je lastnik zebre?

Preprosta [rešitev v Pythonu](https://gist.github.com/JuanitoFatas/2653290)
([razlaga](https://youtu.be/Qd84SEf6GbM)).
Rešitev v [ostalih programskih jezikih](http://rosettacode.org/wiki/Zebra_puzzle).

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Namesto Einsteinove uganke mogoče kakšna taka bolj primerna:

Štirje otroci (Ana, Bor, Cene, Deni) imajo doma različne živali (muca, pes, ptica, riba).
Ugotovi, čigava je katera žival.

  1. Borova žival ne zna leteti.
  2. Žival Ceneta in Denija ima dlako.
  3. Denijeva žival ne laja.
# coding: utf-8
import itertools

animals = 'muca pes ptica riba'.split()
names = 'Ana Bor Cene Deni'.split()

def solve():
    def owns(Name, animal): return Name == animal
    permutations = list(itertools.permutations(animals))  # generiramo vse možnosti
    return next((Ana, Bor, Cene, Deni)
            for (Ana, Bor, Cene, Deni) in permutations  # preverimo vsako možnost
            # če ustreza naslednjim podanim pogojem
            if not owns(Bor, 'ptica')  # 1. Borova žival ne zna leteti
            if not owns(Deni, 'pes')   # 3. Denijeva žival ne laja
            if ((owns(Cene, 'muca') or owns(Cene, 'pes')) and
                (owns(Deni, 'muca') or owns(Deni, 'pes'))))

print(zip(names, solve()))
[('Ana', 'ptica'), ('Bor', 'riba'), ('Cene', 'pes'), ('Deni', 'muca')]

</textarea>

<script src="../remark.min.js"></script>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

si že preveril, če mogoče ne pride do zamika, če daš ta script v head?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Če dam v head mi remark sploh ne premelje stvari ki so v textarea. Mal mi je to čudno, ampak bo očitno treba met kar na koncu body-ja.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

niti ni nujno, da bo kaj hitreje zrenderiralo. najprej prebere html dokument in potem (si predstavljam), ga v eni niti zrenderira, z drugo pa zahteva ostale resource. v tem primeru bo vedno timedelta med prikazanim textarea in polno-zrenderanim remarkom. bo @ddksr najbrž vedel več.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Trenutno je najboljša praksa, da je v nogi. Žal ni tako lepo, da bi renderiral in vlekel spremembe isto časno. Je pa res, da nato dobljen rezultat (recimo velik minimiziran css) lahko renderira nekaj trenutkov vzporedno in ti pokvari stran za nekaj sekund. Ampak za css predpostavljamo, da nima kode, ki bi se izvajala in ga zato damo v head, da se pripravlja, medtem ko mogoče (odvisno od brskalnika) on že isto časno kaj naloži.

Pri scriptu je pa problem, da se navadno nalaga dlje, prav tako pa je potrebno zagotovit, da bodo vsi html resursi, ki jih JS potrebuje, na voljo.

To sta možna samo dva načina: torej script tag na dnu strani, ali pa v head:
$(document).ready(function () { POZENI_REMARK(); });

To je to.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

kaj pa <script src="../remark.min.js"></script> v <head> in <script src="../remark-script.js"></script> (ki inicializira remark) na dnu? to bi moralo delati, ne? saj si tako poskušal, @JernejB ?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Res je, moja napaka. Oboje sm dal v head in valda da ni delal. V tvojem
primeru pa stvar dela tko kot more (ne prika¾e za moment golega texta).

On Tue, Apr 1, 2014 at 2:57 PM, kernc [email protected] wrote:

In p/permutacije.html:

+
+
+# Kombinacije brez ponavljanja?
+* Prej¹nji primer solate
+
+# Kombinacije s ponavljanjem?
+* Spomnimo se primera s solato:

  • * .green[zelena solata], .green[zelena solata], .green[zelena solata]
  • * .green[zelena solata], .green[zelena solata], .red[paradi¾nik]
  •   In tako dalje
    +</textarea>
    +
    +<script src="../remark.min.js"></script>

kaj pa <script src="../remark.min.js"></script> v in <script src="../remark-script.js"></script> (ki inicializira remark) na dnu? to
bi moralo delati, ne? saj si tako posku¹al, @JernejBhttps://github.com/JernejB?

Reply to this email directly or view it on GitHubhttps://github.com//pull/1/files#r11158244
.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pi*** github po*** po pomoti sem klikno Close form in mi je zbriso vse, kar sem napiso.

Torej skrajšana verzija moje uničene razlage.
Če je lib v HEAD, skripta na koncu BODY:

  • N časa je vse belo, ker se lovda skript, potem pa se začne renderiranje BODYa
  • M časa je vse popačeno, ker je zlovdan html, remark pa še ni spremenil zadeve v slajde
  • po N+M časa vidimo slajde
    Če je oboje v nogi:
  • N+M časa je vse popačeno, po tem času pa vidimo slajde

Torej jaz bi rekel takole: tole je robni primer, ko damo knjižnico v head in ostalo v body, ker imamo raje, da vidi user belo kot pa popačeno (čeprav verjetno bo totalno isto, razen če ima zelo počasno povezavo). Sicer v spetu je navada takšna, da zadeva vsaj nekak zgleda, dokler se ves html in js ne naloži (torej vidimo vsebino, ni neki zmeštrano, ko pa se JS naloži pa se mogoče izgled malo 'popravi').

<script src="../remark-script.js"></script>
<script src="../resources/permutacije/threejs/jquery-2.1.0.min.js"></script>
<script src="../resources/permutacije/threejs/three.min.js"></script>
<script src="../resources/permutacije/threejs/OrbitControls.js"></script>
<script src="../resources/permutacije/threejs/perm.js"></script>
<script src="../resources/permutacije/threejs/drawData.js"></script>
<script src="../resources/permutacije/threejs/main.js"></script>

</body>
</html>
Binary file added resources/permutacije/combinationlock.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added resources/permutacije/salad.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading