do rzeczy:
szukam skryptu, który pozwoli wlewać strony do strony bez ponownego wczytywania całej zawartości.
Znalazłem skrypt, który są w stanie sobie z tym poradzić:
page loader z phatfusion (tu link bezpośredni do projektu: http://www.phatfusion.net/pageloader
który byłby idealny z wyjątkiem ścieżki którą tworzy
a wygląda to tak, że jeśli chcę wczytać plik np nazwa.php
to adres w ścieżce www jest makabryczny i wygląda następująco:
Cytat
Jeszcze wytrzymałym, gdyby wyglądał np tak:
Cytat
adresserwera.pl/index.php#nazwa
ale obie ścieżki to masakra.Nie wiem, czy miał ktoś okazję spotkać się z tym, w każdym razie wykorzystuje to mootools,
a także pliki pageloader i history, które zamieszczam poniżej.
Przypuszczam, że zmiana wpisu w odpowiedniej linii poprawi to, jednak wciąż nie znając js, nie bardzo wiem za co się zabrać.
Będę wdzięczny za pomoc.
poniżej wrzucam oryginalny kod pageloadera (sam go nie przerabiałem) a jeszcze niżej kod pliku history.js:
Kod
/**************************************************************
Script : Page Loader
Version : 1.0
Authors : Samuel Birch
Desc : load pages via AJAX.
Licence : Open Source MIT Licence
**************************************************************/
var pageLoader = new Class({
getOptions: function(){
return {
links: '.loadMe',
loadInTo: 'content',
loadFrom: 'content',
onStart: Class.empty,
onComplete: Class.empty
};
},
initialize: function(options){
this.setOptions(this.getOptions(), options);
this.links = $$(this.options.links);
this.links.each(function(el,i){
el.addEvent('click',function(e){
if(e != undefined){
new Event(e).stop();
}
this.start(el);
}.bind(this));
}.bind(this));
},
setContent: function(){
var temp = new Element('div').setProperties({id:'temp'}).setStyles({display:'none'}).injectInside(document.body);
temp.setHTML(this.content.response.text);
var newEl = $('temp').getElement('#'+this.options.loadFrom);
$(this.options.loadInTo).replaceWith(newEl);
newEl.setProperties({id:this.options.loadInTo});
temp.remove();
},
start: function(el){
this.options.onStart();
this.content = new Ajax(el.href, {
method: 'get',
onComplete: this.complete.bind(this),
autoCancel: true
}).request();
},
complete: function(){
this.setContent();
this.options.onComplete();
}
});
pageLoader.implement(new Events);
pageLoader.implement(new Options);
/*************************************************************/
Script : Page Loader
Version : 1.0
Authors : Samuel Birch
Desc : load pages via AJAX.
Licence : Open Source MIT Licence
**************************************************************/
var pageLoader = new Class({
getOptions: function(){
return {
links: '.loadMe',
loadInTo: 'content',
loadFrom: 'content',
onStart: Class.empty,
onComplete: Class.empty
};
},
initialize: function(options){
this.setOptions(this.getOptions(), options);
this.links = $$(this.options.links);
this.links.each(function(el,i){
el.addEvent('click',function(e){
if(e != undefined){
new Event(e).stop();
}
this.start(el);
}.bind(this));
}.bind(this));
},
setContent: function(){
var temp = new Element('div').setProperties({id:'temp'}).setStyles({display:'none'}).injectInside(document.body);
temp.setHTML(this.content.response.text);
var newEl = $('temp').getElement('#'+this.options.loadFrom);
$(this.options.loadInTo).replaceWith(newEl);
newEl.setProperties({id:this.options.loadInTo});
temp.remove();
},
start: function(el){
this.options.onStart();
this.content = new Ajax(el.href, {
method: 'get',
onComplete: this.complete.bind(this),
autoCancel: true
}).request();
},
complete: function(){
this.setContent();
this.options.onComplete();
}
});
pageLoader.implement(new Events);
pageLoader.implement(new Options);
/*************************************************************/
history.js
Kod
/**************************************************************
Script : History
Version : 1.0
Authors : Samuel Birch
Desc : Enables browser back/forward buttons when using Javascript or AJAX.
Licence : Open Source MIT Licence
**************************************************************/
var History = new Class({
getOptions: function(){
return {
links: '.loadMe'
};
},
initialize: function(options){
this.setOptions(this.getOptions(), options);
this.url = window.location.href.toString();
this.checkURL.periodical(500,this);
if(window.ie){
this.iframe = new Element('iframe').setProperties({id: 'HistoryIframe', src: this.url}).setStyles({display: 'none'}).injectInside(document.body);
}
var url = this.formatHash(this.url);
this.links = $$(this.options.links);
this.links.each(function(el,i){
el.addEvent('click',function(e){
if(e != undefined){
new Event(e).stop();
}
this.set(el);
}.bind(this));
if(url != ''){
if(el.href == url){
el.fireEvent('click','',50);
this.set(el.href);
}
}
}.bind(this));
},
formatHash: function(str){
str = str.toString();
var index = str.indexOf('#');
if(index > -1){
str = str.substr(index+1);
}
return str;
},
formatURL: function(str){
str = str.toString();
var index = str.indexOf('#');
if(index > -1){
str = str.substring(0, index);
}
return str;
},
set: function(str){
var url = this.formatURL(this.url);
str = this.formatHash(str);
this.url = url+'#'+str;
window.location.href = this.url;
if(window.ie){
this.iframe.setProperty('src', str);
}
},
checkURL: function(){
if(window.ie){
var url = this.iframe.contentWindow.location.href;
if(url != this.formatHash(this.url)){
this.url = this.formatURL(this.url)+'#'+url;
window.location.href = this.url;
this.iframe.setProperty('src', url);
this.setContent();
}
}else{
var url = window.location.href.toString();
if(url != this.url){
this.url = url;
window.location.href = this.url;
this.setContent();
}
}
},
setContent: function(){
var url = this.formatHash(this.url)
this.links.each(function(el,i){
if(el.href == url){
el.fireEvent('click','',50);
}
});
}
});
History.implement(new Events);
History.implement(new Options);
/*************************************************************/
Script : History
Version : 1.0
Authors : Samuel Birch
Desc : Enables browser back/forward buttons when using Javascript or AJAX.
Licence : Open Source MIT Licence
**************************************************************/
var History = new Class({
getOptions: function(){
return {
links: '.loadMe'
};
},
initialize: function(options){
this.setOptions(this.getOptions(), options);
this.url = window.location.href.toString();
this.checkURL.periodical(500,this);
if(window.ie){
this.iframe = new Element('iframe').setProperties({id: 'HistoryIframe', src: this.url}).setStyles({display: 'none'}).injectInside(document.body);
}
var url = this.formatHash(this.url);
this.links = $$(this.options.links);
this.links.each(function(el,i){
el.addEvent('click',function(e){
if(e != undefined){
new Event(e).stop();
}
this.set(el);
}.bind(this));
if(url != ''){
if(el.href == url){
el.fireEvent('click','',50);
this.set(el.href);
}
}
}.bind(this));
},
formatHash: function(str){
str = str.toString();
var index = str.indexOf('#');
if(index > -1){
str = str.substr(index+1);
}
return str;
},
formatURL: function(str){
str = str.toString();
var index = str.indexOf('#');
if(index > -1){
str = str.substring(0, index);
}
return str;
},
set: function(str){
var url = this.formatURL(this.url);
str = this.formatHash(str);
this.url = url+'#'+str;
window.location.href = this.url;
if(window.ie){
this.iframe.setProperty('src', str);
}
},
checkURL: function(){
if(window.ie){
var url = this.iframe.contentWindow.location.href;
if(url != this.formatHash(this.url)){
this.url = this.formatURL(this.url)+'#'+url;
window.location.href = this.url;
this.iframe.setProperty('src', url);
this.setContent();
}
}else{
var url = window.location.href.toString();
if(url != this.url){
this.url = url;
window.location.href = this.url;
this.setContent();
}
}
},
setContent: function(){
var url = this.formatHash(this.url)
this.links.each(function(el,i){
if(el.href == url){
el.fireEvent('click','',50);
}
});
}
});
History.implement(new Events);
History.implement(new Options);
/*************************************************************/