Olimpiada Nationala de TIC – etapa nationala

1.Utilizand aplicatia Microsoft Paint si imaginile “imagine5.jpg” si “imagine6.jpg”,din folderul de

resurse,am realizat logoul proiectului.
In aplicatia Microsoft Paint am selectat “New” si am setat dimensiunile conform cerintei.
Am introdus cele doua imagini din folderul de resurse si le-am redimensionat astfel incat sa fie simetrice.
Folosind unealta “Text” am introdus textul “GREEN~OTI~TOUR” in centrul imaginii si apoi am salvat
imaginea in formatul “jpg”,conform cerintei.

2.In aceasta etapa a proiectului,am dezarhifat “resurse.rar” in fisierul “resurse” si am selectat casutele
din dreptul imaginilor,la fel ca in poza data.
Am folosind tasta “Prnt Scrn” pentru a face captura ecranului,apoi am apasat combinatia de taste
“Ctrl+V” si am salvat salvat-o in fisierul “pasi.mht”,ca in cerinta.

3.Am creeat un now fisier “Notepad.txt” pe care l-am deschis si in care am apasat tasta “F5” pentru a
copia in acesta data deschiderii sale.

4.La acest punct am deschis aplicatia Microsoft Word si am setat dimensiunea paginii din tab-ul „Aspect
pagina” la dimensiunea A5.
Am impartit pagina in 3 zone egale.In prima am copiat prezentarea din fisierul de resurse,din
documentul word “textprezentare.docx” si am folosit “model4.jpg” ca exemplu.
In cea de-a doua zona am alipit imagini din fisierul de resurse.
In cea de-a treia am introdus numele si cate o imagine corespunzatoare fiecarei pensiuni,din fisierul de
resurse.
In final,am salvat documentul sub numele “pliant.docx”,la fel ca in cerinta.

5.In aceasta etapa,am deschis aplicatia Microsoft Word si am selectat “Macrocomenzi” din tab-ul
“Vizualizare”.Am apasat “vizualizare macrocomenzi” si am dat scroll pana am gasit “Comenzi Word”.
Apoi,am selectat “Lista comenzi” si am afisat in document toate comenzile tastaturii in Microsoft Word.
Am salvat documentul sub numele “lista.docx” si am inchis programul.

6.Pentru a insera sigla proiectului pe toate diapozitivele se va proceda astfel: click pe tabul View, in
sectiunea Master Views click pe Slide Master; se acceseaza primul diapozitiv unde se introduce sigla
folosind functia Insert Picture. Odata ce se va inchide Master View sigla va aparea pe toate diapozitivele.

Pentru a realiza figura 6.1 se va accesa tabul Insert, optiunea AutoShapes si se va alege un dreptunghi. Se
dimensioneaza / coloreaza / adauga efect 3D conform cerintei (toate aceste optiuni se gasesc in tabul
Format daca forma e selectata). Se multiplica forma. Pentru a adauga text se face click-dreapta pe forma
si se alege optiunea Add Text. In final se selecteaza toate formele si se grupeaza cu click-dreapta ->
Group.

Pentru a realiza cerinta cu cubul se introduc 2 imagini si o forma automata (dreptunghi). Se

redimensioneaza cele 3 elemente pentru a avea aceeasi dimensiune. Se selecteaza fiecare element
individual, in tabul Format, sectiunea Picture Style se face click pe Picture Effects apoi 3D Rotation si din
grupul Parallel se alege fata cubului corespunzatoare imaginii. Pentru a crea efectul de rotire se repeta
procedeul in urmatorul diapozitiv schimband una din poze. Pentru a crea efectul de rotire ordinea
imaginilor e importanta! Butonul de "rotire" se insereaza din tabul Insert, AutoShapes, Action Buttons si
in realitate va face legatura catre urmatorul slide (butonul din ultimul diapoitiv va face legatura catre
primul diapozitiv cu cub).

7.Se vor crea spatiile pentru fiecare litera, conform jocului, si tot alfabetul englez sub acesta, fiecare
litera reprezentand un layer. Deasupra fiecarei litere ce este corecta cuvantului se va crea un nou layer
invizibil. Se creaza si litere pe spatii conform cuvantului TURISM.

Peste fiecare litera a alfabetului se va crea un layer separat, dublu, exact ca cel dinainte, exceptia fiind ca
literel corecte vor fi cu fond verde,iar cele incorecte pe fond rosu.

Se creaza banda de avansare cu cele 10 greseli, una cu cursorul pe fiecare din cele 10,suprapuse ( in total
10 layers)

Animatiile vor fi urmatoarele:

-Pe fiecare litera gresita apasata, va porni o animatie de disparitie a literei apasate, aceasta colorandu-se
in rosu sau verde.

-Pe fiecare litera gresita apasata, va porni o animatie de disparitie a primei benzi de greseli, cu 0, si va
aparea cea cu 1, etc. ( pe fiecare litera se pun cate 10 animatii ; in cazul in care animatia de disparitie a
unui obiect a fost lansata anterior de catre o alta actiune, aceasta va fi ignorata)

-Pe fiecare litera corecta va porni o animatie de aparitie a literei de pe spatial corespunzator

9.Am deshis aplicatia Microsoft Access si am creat un formular in care am deschi o casuta text
“unbound” si am schimbat formatul in “long time”,in tab-ul “Other” am schimbat numele in “txtClock”
iar tab-ul “Data” am schimbat “Control Source” in “=Time()” si formatul textului in “Rich Time”.
Am creat un table in care am inserat campurile “VDO_ID”(AutoNumber),”VDOName”(Text) si
“VDOLink”(Text) si am introdus numele pensiunilor din fisierul de resurse.In tabul “VDOLink” am introdus
locatia ficarui video.
Pe baza tabelului,am crat un formular in care am folosit “List Box Wizard” pentru a insera lista cu
pensiuni si am numit lista “List0” si am apasat butonul de “Finish”.
Sub meniul design,am apasat “ActiveX Controls” si am selectat “Windows Media Player” si am apasat
“OK” si l-am numit “WindowsMediaPlayer2”.Am deschis apoi foaia de proprietati si am selectat “Event
Procedure” si apoi am apasat “…” si am introdus codul “Me.WindowsMediaPlayer2.URL =
Me.List0.Column(2)” si in a doua coloana am introdus numele “VDOName”,corespunzator campului
“VDOName” din baza de date.
In incheierea acestei cerinte,am am deschis “Form View” si am vizionat videoul in mod corespunzator.
In continuare,am creat o casuta text “Unbound” si i-am dat proprietatea “Button,in meniu butonului am
selectat “Form Operation si am ales actiunile corespunzatoare fiecarei optiuni din cerinta(Butonul
“Acasa” pentru a afisa formularul “Ceas”,Butonul “Adaugare Client Nou” care afiseaza formularul
“adaugare_client”, s.a.m.d.).
Am creat formularul “Rezultate financiare” cu:lista “Pensiune” care contine denumirile celor 5
pensiuni,lista “Anul” in care am introdus anii “2000-2010”,campul “Profit” care va calcula diferenta
dintre campurile “Inchirieri” si “Cheltuieli”.
Am continuat prin adaugarea butoanelor “Adauga”(prin a carui apasare vor fi adaugate datele in
formularul “Rezultate” si butonul “Urmatoarea Pensiune”(prin a carui apasare se reseteaza datele in
formularul “Rezultate Financiare”.Am creat un control de tip imagine,care va afisa imaginea adecvata
fiecarei pensiuni.
In final,am creat butonul “Inchidere formular”,cu rolul de a inchide formularul.

10.

Partea principal a codului html este aceasta:

<!DOCTYPE html>

<html>

<head>

<style>

.column {

float: left;

width: 33.20%;

padding: 1px;

height: 300px;

.row:after {

content: "";

display: table;

clear: both;

.topnav {

overflow: hidden;

background-color: #333;

.topnav a {

float: left;

color: #f2f2f2;

text-align: center;

padding: 14px 16px;

 text-decoration: none;

font-size: 30px;

.topnav a:hover {

background-color: #ddd;

color: black;

.topnav a.active {

background-color: #4CAF50;

color: white;

.dropbtn {

background-color: #4CAF50;

color: white;

padding: 16px;

font-size: 16px;

border: none;

.dropdown {

position: relative;

display: inline-block;

.dropdown-content {

display: none;

position: absolute;

background-color: #f9f9f9;

min-width: 160px;

box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);

z-index: 1;

.dropdown-content a {

color: black;

padding: 12px 16px;

text-decoration: none;

display: block;

}
.dropdown-content a:hover {background-color: #f1f1f1}

.footl {float:left;}

.footr {float:right;}

.dropdown:hover .dropdown-content {

display: block;

.dropdown:hover .dropbtn {

background-color: #3e8e41;

div.container {

width: 100%;

border: 1px solid gray;

header, footer {

padding: 1em;

color: white;

background-color: black;

clear: left;

text-align: center;

.footer {

position: fixed;

left: 0;

bottom: 0;

width: 100%;

color: white;

text-align: center;

font-size: 15px;

nav {
 float: left;

max-width: 160px;

margin: 0;

padding: 1em;

nav ul {

list-style-type: none;

padding: 0;

nav ul a {

text-decoration: none;

article {

margin-left: 170px;

border-left: 1px solid gray;

padding: 1em;

overflow: hidden;

</style>

</head>

<body>

<div class="container">

<header>

<marquee behavior="scroll" direction="right" scrollamount="10">

<img src="imagine1.jpg" width="150" height="120" alt="1">

<img src="imagine2.jpg" width="150" height="120" alt="1">

<img src="imagine3.jpg" width="150" height="120" alt="1">

<img src="imagine4.jpg" width="150" height="120" alt="1">

<img src="imagine5.jpg" width="150" height="120" alt="1">

<img src="imagine6.jpg" width="150" height="120" alt="1">

<img src="imagine8.jpg" width="150" height="120" alt="1">

<img src="imagine7.jpg" width="150" height="120" alt="1">

<img src="imagine9.jpg" width="150" height="120" alt="1">

<img src="imagine10.jpg" width="150" height="120" alt="1">

<img src="imagine11.jpg" width="150" height="120" alt="1">

<img src="imagine12.jpg" width="150" height="120" alt="1">

 <img src="imagine13.jpg" width="150" height="120" alt="1">

<img src="imagine14.jpg" width="150" height="120" alt="1">

<img src="imagine15.jpg" width="150" height="120" alt="1">

</marquee>

</header>

<div class="topnav">

<a class="active" href="#home"><img src="sigla.jpg" width="60" height="60" padding="0 0 0 0"></a>

<a href="#Pensiune">Pensiune</a>

<a href="#contact">Contact</a>

<a href="#Maramures">Maramures</a>

<a href="#Oferta">Oferta</a>

<div class="row">

<div class="column" style="background-color:#aaa;">

<h2>Date utile</h2>

<p>text</p>

</div>

<div class="column" style="background-color:#bbb;">

<h2>Date Firma</h2>

<p>text</p>

</div>

<div class="column" style="background-color:#ccc;">

<h2>Newsletter</h2>

<p>text</p>

</div>

</div>

<footer class="footer">

<p style="text-align:left; font-size:50;">

Marcă înregistrată

<span style="float:right;">Garanția unui turism de calitate … </span>

</p>

</footer>

</div>

</body>

</html>
Variantiile de la pagina la pagina:
Pentru butoanul de rezervare
CSS
.modal {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 1; /* Sit on top */
padding-top: 100px; /* Location of the box */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0); /* Fallback color */
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
.modal-content {
background-color: #fefefe;
margin: auto;
padding: 20px;
border: 1px solid #888;
width: 80%;
}
.close {
color: #aaaaaa;
float: right;
font-size: 28px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: #000;
text-decoration: none;
cursor: pointer;

JAVASCRIPT
<script>
var modal = document.getElementById('myModal');
var btn = document.getElementById("myBtn");
var span = document.getElementsByClassName("close")[0];
btn.onclick = function() {
modal.style.display = "block";
}
span.onclick = function() {
modal.style.display = "none";
}
window.onclick = function(event) {
if (event.target == modal) {
modal.style.display = "none";
}
}
</script>

Formularul se face cu urmatoarele tag-uri si proprietati:

<form>
<input name="zona de completare" type="text">
<select name="numar de camere">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</form>

Introducerea de pagini .docx sau .xlms se realizeaza astfel:

Se salveaza documentul in format Web Page, se preia codul din spatele sau si se pune intr-un <iframe>