site-javascriptonafhankelijk-maken

Gesponsorde koppelingen

PHP script bestanden

  1. site-javascriptonafhankelijk-maken

« Lees de omschrijving en reacties

index.php

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
<?php
session_start();
define('JAVASCRIPT_FILES_LADEN', true);  // deze define de waarde false geven, zorgt er voor dat de javascript files niet geladen worden.  Dit geeft dus een vergelijkbaar effect alsof je javascript af hebt staan.
$_GET['p'] = ( !empty($_GET['p']) ? $_GET['p'] : '');

if ( !empty($_POST) )
{  // afhandelen van post
  switch ( $_GET['p'] )
    {
      case 'login': echo login(); break;
    default:
      break;
    }
}
else
{ // gewone pagina's
  switch ( $_GET['p'] )
  {
  default           : echo main();         break;
  case 'welkom'     : echo welkom();       break;
  case 'fotoalbum'  : echo fotoalbum();    break;
  case 'login'      : echo loginForm();    break;
  }
}

///////////////////////
function main()
{
  return htmlOpmaak('');
}
function fotoalbum()
{
  $fotos = getFotos();
    $_GET['id'] = ( !empty($_GET['id']) ? (int) $_GET['id'] : 0);
    if ($_GET['id'] >= count($fotos) )
      $_GET['id'] = 0;
  
  if (!empty($_GET['ajax']))    // enkel de url van de foto meegeven
  {
    $return = $fotos[ (int) $_GET['id'] ] ; // uiteraard geen html opmaak
  }
  else    // volledige pagina
  {
    $return = '<div id="thumbnails">';
    foreach ($fotos as $key => $foto)
      $return .='<a onClick="return get_foto('. $key .')" href="index.php?p=fotoalbum&id='. $key .'"><img src="'. $foto .'"/></a>';
    $return .= '</div>
    <img id="grote_foto" src="'. $fotos[ (int) $_GET['id'] ] .'"></div>
    ';
    $return = htmlOpmaak($return);
  }
  return $return;
}

function getFotos()
{
return array(
  'http://www.planetperplex.com/img/escher_waterfall.jpg'
  , 'http://blogimages.bloggen.be/artiest_escher/81550-10ab380c07a9a49af2bfc1a4521115b3.jpg'
  , 'http://www.wadden.vuurwerk.nl/socrates/escher.gif'
  , 'http://maths.ucd.ie/mathsupportcentre/ucdwebpage/images/escher_ascending_descending.jpg'
  );
}


function welkom()
{
      $ingelogd = 'niet ingelogd. <div><a href="index.php?p=login">Inloggen</a></div>';
      if ( !empty($_SESSION['login']) )
        $ingelogd = '
        <div id="login_container">
          Ingelogd als: '. $_SESSION['login'] .' (met de traditionele post)
        </div>';
  return htmlOpmaak($ingelogd);
}
function loginForm()
{
  return htmlOpmaak('
      <div id="login_container">
        <form method="post" action="index.php?p=login" onsubmit="return submit_login();">
          <h2>Inloggen</h2>
          <div><label><input type="text"  name="login" id="login"/> Login </label></div>
          <div><label><input type="password"  name="password" id="password"/> Paswoord </label></div>
          <div><label><input type="submit"  value="login"/></label></div>
        </form>
      </div>
');
}
function login()
{
  $result='';
  $sql = sprintf("SELECT id, login, password FROM users WHERE login='%s' AND password='%s' LIMIT 1"
          , mysql_real_escape_string($_POST['login'])
          , md5($_POST['password'])
  );
  // haal record uit db, ...
  $_SESSION['login'] = $_POST['login'];
  if ( empty($_GET['ajax']) )
    {
      header('location: index.php?p=welkom');
    }
  else
    {
      $result .= 'Ingelogd als: '. $_SESSION['login'] .' (met Ajax)' ;
    }
return $result;
}
function getMenu()
{
return '
      <span><a href="index.php?p=login">Inloggen</a></span>
      | <span><a href="index.php?p=fotoalbum">Foto album</a></span>
';
}
function htmlOpmaak($body)
{
$js = false;
if(JAVASCRIPT_FILES_LADEN == true)
  $js = '
  <script src="ajax.js" language="javascript" type="text/javascript"> </script>
  <script src="js.js" language="javascript" type="text/javascript"> </script>
  ';
  return '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//NL" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
  <head>
    '.$js.'
    <link href="css.css" rel="stylesheet" type="text/css" />
    <title></title>
  </head>
  <body>
    <div id="menu">'. getMenu() .'</div>
    <div id="content">'. $body .'</div>
  </body>
</html>';
}
?>


js.js
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
var http = new ajaxObject();
function submit_login()
{
  var url = 'index.php?p=login&ajax=1';
  var vars = 'login='+ document.getElementById('login').value + '&password='+ document.getElementById('password').value;
  http.send(
     url,   // url
    response_login,           // callback
    'post',                    // get / post
    vars                      // string of variables, eg. 'id='+ escape(id) +'&action=delete';
    );
  return false;
}
function response_login()
{
  var response = http.response('text');
  if ( response != null )
    {
      document.getElementById('login_container').innerHTML = response;
    }
}
function get_foto(id)
{

  var url = 'index.php?p=fotoalbum&ajax=1&id='+ id;
  http.send(
     url,   // url
    response_foto,           // callback
    'get',                    // get / post
    null                      // string of variables, eg. 'id='+ escape(id) +'&action=delete';
    );
  return false;
}
function response_foto()
{
  var response = http.response('text');
  if ( response != null )
    {
      document.getElementById('grote_foto').src = response;
    }
}


ajax.js
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
/*
// example of how to use:
var http = new ajaxObject();
var catSelected;

function getMeer(cat)
{
  http.send(
    'ajax.php?cat='+ cat, // url
    response_links,       // callback
    'get',                // get / post
    null                  // string of variables, eg. 'id='+ escape(id) +'&action=delete';
    );
}
function response_links()
{
  var response = http.response('text');
  if ( response != null )
    {
      var container = document.getElementById('categorie');
      container.innerHTML = response;
    }
}
*/

function ajaxObject()
{
  this.http = createHTTPHandler();
}
ajaxObject.prototype.send = function(url, response, method, passData)
{
  if (method == 'post')
  {
  this.http.open("POST", url, true);
  this.http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  this.http.onreadystatechange = response;
  this.http.send( passData );
  }
  else // default GET
  {
    this.http.open("GET", url, true);
    this.http.onreadystatechange = response;
    this.http.send(null);
  }
}
ajaxObject.prototype.response = function(type)
{
  try
  {
    if (this.http.readyState == 4)
    {
      switch (type)
      {
        default:
          return this.http.responseText;
          break;
        case 'json':
          return eval('(' + this.http.responseText + ')');
          break;
        case 'xml':
          return this.http.responseXml;
          break;
      }
    }
    else
      return null;
  }
  catch(e)
  {
  }
  return null;
}

function createHTTPHandler()
{
    httphandler = false;
    // branch for native XMLHttpRequest object
    if(window.XMLHttpRequest)
    {
      try
      {
      httphandler = new XMLHttpRequest();
        } catch(e)
        {
      httphandler = false;
        }
    // branch for IE/Windows ActiveX version
    }
    else if(window.ActiveXObject)
    {
          try
          {
            httphandler = new ActiveXObject("Msxml2.XMLHTTP");
          } catch(e)
          {
            try
            {
                httphandler = new ActiveXObject("Microsoft.XMLHTTP");
            } catch(e)
            {
                httphandler = false;
            }
      }
    }
    return httphandler;
}


css.css
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
body
{
background-color: #000000;
color: #33eecc;
}
a
{
color: #ccee22;
text-decoration: none;
}

img
{
border: 0;
}

#grote_foto
{
height: 450px;
margin: 10px;
}
#thumbnails a img
{
  height: 120px;
  margin: 5px;
}

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.