home page
This commit is contained in:
parent
3df8e6fef9
commit
df0f250605
|
|
@ -0,0 +1,34 @@
|
|||
@font-face {
|
||||
font-family: 'Bondoluo-Peek';
|
||||
src: url("../fonts/bondoluopeek/BondoluoPeek.eot");
|
||||
src: url("../fonts/bondoluopeek/BondoluoPeek.eot?#iefix") format("embedded-opentype"), url("../fonts/bondoluopeek/BondoluoPeek.woff") format("woff"), url("../fonts/bondoluopeek/BondoluoPeek.ttf") format("truetype"); }
|
||||
@font-face {
|
||||
font-family: 'helvetica-neue-bold';
|
||||
src: url("../fonts/Helvetica-Neue-Bold/Helvetica-Neue-Bold.eot");
|
||||
src: url("../fonts/Helvetica-Neue-Bold/Helvetica-Neue-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/Helvetica-Neue-Bold/Helvetica-Neue-Bold.woff2") format("woff2"), url("../fonts/Helvetica-Neue-Bold/Helvetica-Neue-Bold.woff") format("woff"), url("../fonts/Helvetica-Neue-Bold/Helvetica-Neue-Bold.svg#Helvetica Neue Bold") format("svg");
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-stretch: normal;
|
||||
unicode-range: U+0-10FFFF; }
|
||||
@font-face {
|
||||
font-family: 'Gotham-Bold';
|
||||
src: url("../fonts/gotham/Gotham-Bold/Gotham-Bold.eot");
|
||||
src: url("../fonts/gotham/Gotham-Bold/Gotham-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/gotham/Gotham-Bold/Gotham-Bold.woff") format("woff"), url("../fonts/gotham/Gotham-Bold/Gotham-Bold.ttf") format("truetype"); }
|
||||
@font-face {
|
||||
font-family: 'Gotham-Book';
|
||||
src: url("../fonts/gotham/Gotham-Book/Gotham-Book.eot");
|
||||
src: url("../fonts/gotham/Gotham-Book/Gotham-Book.eot?#iefix") format("embedded-opentype"), url("../fonts/gotham/Gotham-Book/Gotham-Book.woff") format("woff"), url("../fonts/gotham/Gotham-Book/Gotham-Book.ttf") format("truetype"); }
|
||||
|
||||
#homeLogo:hover,
|
||||
#homeMenu > img:hover {
|
||||
opacity: 0.5;
|
||||
}
|
||||
#homeLogo.selected:hover,
|
||||
#homeMenu > img.selected:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.homeLink,
|
||||
.homeLink:visited {
|
||||
color: rgb(0, 0, 255);
|
||||
}
|
||||
|
|
@ -2,319 +2,441 @@
|
|||
|
||||
pandora.ui.home = function() {
|
||||
|
||||
var that = $('<div>')
|
||||
var self = {},
|
||||
|
||||
that = $('<div>')
|
||||
.addClass('OxScreen')
|
||||
.css({
|
||||
position: 'absolute',
|
||||
width: '100%',
|
||||
backgroundColor: 'white',
|
||||
height: '100%',
|
||||
opacity: 0,
|
||||
overflowY: 'auto',
|
||||
position: 'absolute',
|
||||
width: '100%',
|
||||
zIndex: 1001
|
||||
}),
|
||||
$reflectionImage = $('<img>')
|
||||
.addClass('logo')
|
||||
.attr({src: '/static/png/logo.png'})
|
||||
|
||||
$box = $('<div>')
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
top: '160px',
|
||||
margin: '0 auto',
|
||||
position: 'absolute',
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
width: '320px',
|
||||
margin: 'auto',
|
||||
opacity: 0,
|
||||
MozTransform: 'scaleY(-1)',
|
||||
OTransform: 'scaleY(-1)',
|
||||
WebkitTransform: 'scaleY(-1)'
|
||||
top: '32px',
|
||||
width: '800px'
|
||||
})
|
||||
.appendTo(that),
|
||||
$reflectionGradient = $('<div>')
|
||||
.addClass('OxReflection logo')
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
top: '160px',
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
// FIXME: should be 320 and 160 - the values below are temporary fixes for Chrome 26
|
||||
width: '322px',
|
||||
height: '162px',
|
||||
margin: 'auto',
|
||||
})
|
||||
.appendTo(that),
|
||||
$logo = $('<img>')
|
||||
.addClass('logo')
|
||||
|
||||
homeMenuCenterCSS = {
|
||||
height: 'auto',
|
||||
left: 0,
|
||||
margin: '0 auto',
|
||||
position: 'absolute',
|
||||
right: 0,
|
||||
top: '300px',
|
||||
width: '320px'
|
||||
},
|
||||
homeMenuLeftCSS = {
|
||||
margin: '',
|
||||
right: '',
|
||||
left: '32px',
|
||||
position: 'absolute',
|
||||
top: '32px',
|
||||
width: '128px'
|
||||
},
|
||||
|
||||
$menu = $('<div>')
|
||||
.attr({
|
||||
id: 'logo',
|
||||
id: 'homeMenu'
|
||||
})
|
||||
.css(homeMenuCenterCSS)
|
||||
.appendTo(that),
|
||||
|
||||
$counter = $('<div>')
|
||||
.attr({
|
||||
id: 'homeCounter'
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
right: '32px',
|
||||
top: '32px',
|
||||
width: '128px'
|
||||
})
|
||||
.appendTo(that),
|
||||
|
||||
$logo = Ox.Element({
|
||||
element: '<img>'
|
||||
})
|
||||
.addClass('selected')
|
||||
.attr({
|
||||
id: 'homeLogo',
|
||||
src: '/static/png/logo.png'
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
height: 'auto',
|
||||
left: 0,
|
||||
top: 0,
|
||||
margin: '0 auto',
|
||||
position: 'absolute',
|
||||
right: 0,
|
||||
bottom: '160px',
|
||||
width: window.innerWidth + 'px',
|
||||
margin: 'auto',
|
||||
cursor: 'pointer'
|
||||
top: 0,
|
||||
width: '320px'
|
||||
})
|
||||
.on({
|
||||
.bind({
|
||||
click: function() {
|
||||
$browseButton.triggerEvent('click');
|
||||
}
|
||||
})
|
||||
.appendTo(that),
|
||||
$findInput = Ox.Input({
|
||||
width: 156
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
top: '48px',
|
||||
right: '164px',
|
||||
bottom: 0,
|
||||
margin: 'auto',
|
||||
opacity: 0
|
||||
})
|
||||
.on({
|
||||
click: function(e) {
|
||||
// fixme: why?
|
||||
e.stopPropagation();
|
||||
}
|
||||
})
|
||||
.bindEvent({
|
||||
submit: function(data) {
|
||||
if (data.value) {
|
||||
$findButton.triggerEvent('click');
|
||||
} else {
|
||||
$browseButton.triggerEvent('click');
|
||||
if (!$logo.hasClass('selected')) {
|
||||
$logo.css({opacity: 1});
|
||||
renderPage('home');
|
||||
}
|
||||
},
|
||||
mouseenter: function() {
|
||||
if (!$logo.hasClass('selected')) {
|
||||
$logo.css({opacity: 0.5});
|
||||
}
|
||||
},
|
||||
mouseleave: function() {
|
||||
if (!$logo.hasClass('selected')) {
|
||||
$logo.css({opacity: 1});
|
||||
}
|
||||
}
|
||||
})
|
||||
.appendTo(that),
|
||||
$findButton = Ox.Button({
|
||||
title: Ox._('Find'),
|
||||
width: 74
|
||||
.appendTo($box),
|
||||
|
||||
$title = Ox.Element({
|
||||
element: '<img>'
|
||||
})
|
||||
.css({
|
||||
display: 'none',
|
||||
height: '40px',
|
||||
left: 0,
|
||||
margin: '0 auto',
|
||||
position: 'absolute',
|
||||
left: '82px',
|
||||
top: '48px',
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
margin: 'auto',
|
||||
opacity: 0
|
||||
top: '280px'
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
var folder = pandora.getListData().folder,
|
||||
value = $findInput.value();
|
||||
folder && pandora.$ui.folderList[folder].options({selected: []});
|
||||
that.fadeOutScreen();
|
||||
pandora.UI.set({
|
||||
page: '',
|
||||
find: {
|
||||
conditions: value === ''
|
||||
? []
|
||||
: [{key: '*', value: value, operator: '='}],
|
||||
operator: '&'
|
||||
},
|
||||
section: 'items'
|
||||
});
|
||||
pandora.$ui.findSelect && pandora.$ui.findSelect.value('*');
|
||||
pandora.$ui.findInput && pandora.$ui.findInput.value(value);
|
||||
}
|
||||
.appendTo($box),
|
||||
|
||||
$text_es = $('<div>')
|
||||
.css({
|
||||
display: 'none',
|
||||
fontFamily: 'Home Arabic',
|
||||
fontSize: '13px',
|
||||
lineHeight: '18px',
|
||||
marginRight: '8px',
|
||||
position: 'absolute',
|
||||
textAlign: 'right',
|
||||
top: '360px',
|
||||
width: '392px'
|
||||
})
|
||||
.appendTo(that),
|
||||
$browseButton = Ox.Button({
|
||||
title: Ox._('Browse'),
|
||||
width: 74
|
||||
.appendTo($box),
|
||||
|
||||
$text_en = $('<div>')
|
||||
.css({
|
||||
display: 'none',
|
||||
fontFamily: 'Home English',
|
||||
fontSize: '12px',
|
||||
left: '400px',
|
||||
lineHeight: '17px',
|
||||
marginLeft: '8px',
|
||||
position: 'absolute',
|
||||
top: '360px',
|
||||
width: '392px'
|
||||
})
|
||||
.appendTo($box),
|
||||
|
||||
$tutorials = $('<div>')
|
||||
.css({
|
||||
display: 'none',
|
||||
left: '-128px',
|
||||
marginLeft: '8px',
|
||||
marginBottom: '32px',
|
||||
position: 'absolute',
|
||||
top: '392px',
|
||||
width: '1024px',
|
||||
height: '288px'
|
||||
}).appendTo($box),
|
||||
|
||||
$enterButton = Ox.Element({
|
||||
element: '<img>'
|
||||
})
|
||||
.attr({
|
||||
src: '/static/png/enter.png'
|
||||
})
|
||||
.css({
|
||||
cursor: 'url(/static/png/cursor.png) 4 12, auto',
|
||||
height: '32px',
|
||||
left: 0,
|
||||
margin: '0 auto',
|
||||
position: 'absolute',
|
||||
left: '246px',
|
||||
top: '48px',
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
margin: 'auto',
|
||||
opacity: 0
|
||||
})
|
||||
.bindEvent({
|
||||
.bind({
|
||||
click: function() {
|
||||
var page = pandora.user.ui.page == 'home' ? '' : pandora.user.ui.page;
|
||||
/*
|
||||
if (pandora.user.level == 'guest') {
|
||||
page = 'signup'
|
||||
}
|
||||
*/
|
||||
pandora.UI.set({
|
||||
page: pandora.user.ui.page == 'home' ? '' : pandora.user.ui.page,
|
||||
page: page,
|
||||
section: 'items'
|
||||
});
|
||||
that.fadeOutScreen();
|
||||
},
|
||||
mouseenter: function() {
|
||||
$enterButton.css({opacity: 0.5});
|
||||
},
|
||||
mouseleave: function() {
|
||||
$enterButton.css({opacity: 1});
|
||||
}
|
||||
})
|
||||
.appendTo(that),
|
||||
.appendTo($menu),
|
||||
|
||||
$signupButton = Ox.Button({
|
||||
title: Ox._('Sign Up'),
|
||||
width: 74
|
||||
$aboutButton = Ox.Element({
|
||||
element: '<img>'
|
||||
})
|
||||
.attr({
|
||||
src: '/static/png/about.png'
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
cursor: 'pointer',
|
||||
height: '32px',
|
||||
left: 0,
|
||||
top: '112px',
|
||||
right: '246px',
|
||||
bottom: 0,
|
||||
margin: 'auto',
|
||||
opacity: 0
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
pandora.UI.set({page: 'signup'});
|
||||
that.fadeOutScreen();
|
||||
}
|
||||
}),
|
||||
$signinButton = Ox.Button({
|
||||
title: Ox._('Sign In'),
|
||||
width: 74
|
||||
})
|
||||
.css({
|
||||
margin: '0 auto',
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
top: '112px',
|
||||
right: '82px',
|
||||
bottom: 0,
|
||||
margin: 'auto',
|
||||
opacity: 0
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
pandora.UI.set({page :'signin'});
|
||||
that.fadeOutScreen();
|
||||
}
|
||||
}),
|
||||
$preferencesButton = Ox.Button({
|
||||
title: Ox._('Preferences'),
|
||||
width: 156
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
top: '112px',
|
||||
right: '164px',
|
||||
bottom: 0,
|
||||
margin: 'auto',
|
||||
opacity: 0
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
pandora.UI.set({page: 'preferences'});
|
||||
that.fadeOutScreen();
|
||||
}
|
||||
}),
|
||||
$aboutButton = Ox.Button({
|
||||
title: Ox._('About {0}', [pandora.site.site.name]),
|
||||
width: 156
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: '164px',
|
||||
top: '112px',
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
margin: 'auto',
|
||||
opacity: 0
|
||||
top: '48px'
|
||||
})
|
||||
.bindEvent({
|
||||
.bind({
|
||||
click: function() {
|
||||
pandora.UI.set({page: 'about'});
|
||||
that.fadeOutScreen();
|
||||
renderPage('about');
|
||||
},
|
||||
mouseenter: function() {
|
||||
$aboutButton.css({opacity: 0.5});
|
||||
},
|
||||
mouseleave: function() {
|
||||
$aboutButton.css({opacity: 1});
|
||||
}
|
||||
})
|
||||
.appendTo(that),
|
||||
$text = $('<div>')
|
||||
.html(Ox._(
|
||||
'pan.do/ra. \u2620 2007-{0} 0x2620. All Open Source.',
|
||||
[Ox.formatDate(new Date(), '%Y')]
|
||||
)).css({
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
top: '176px',
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
width: '360px',
|
||||
height: '16px',
|
||||
margin: 'auto',
|
||||
opacity: 0,
|
||||
textAlign: 'center'
|
||||
.appendTo($menu),
|
||||
|
||||
$tutorialButton = Ox.Element({
|
||||
element: '<img>'
|
||||
})
|
||||
.appendTo(that);
|
||||
.attr({
|
||||
src: '/static/png/tutorial.png'
|
||||
})
|
||||
.css({
|
||||
cursor: 'pointer',
|
||||
height: '32px',
|
||||
left: 0,
|
||||
margin: '0 auto',
|
||||
position: 'absolute',
|
||||
right: 0,
|
||||
top: '84px'
|
||||
})
|
||||
.bind({
|
||||
click: function() {
|
||||
renderPage('tutorial');
|
||||
},
|
||||
mouseenter: function() {
|
||||
$tutorialButton.css({opacity: 0.5});
|
||||
},
|
||||
mouseleave: function() {
|
||||
$tutorialButton.css({opacity: 1});
|
||||
}
|
||||
})
|
||||
.appendTo($menu),
|
||||
|
||||
adjustRatio();
|
||||
$contactButton = Ox.Element({
|
||||
element: '<img>'
|
||||
})
|
||||
.attr({
|
||||
src: '/static/png/contact.png'
|
||||
})
|
||||
.css({
|
||||
cursor: 'pointer',
|
||||
height: '32px',
|
||||
left: 0,
|
||||
margin: '0 auto',
|
||||
position: 'absolute',
|
||||
right: 0,
|
||||
top: '120px'
|
||||
})
|
||||
.bind({
|
||||
click: function() {
|
||||
renderPage('contact');
|
||||
},
|
||||
mouseenter: function() {
|
||||
$contactButton.css({opacity: 0.5});
|
||||
},
|
||||
mouseleave: function() {
|
||||
$contactButton.css({opacity: 1});
|
||||
}
|
||||
})
|
||||
.appendTo($menu),
|
||||
|
||||
if (pandora.user.level == 'guest') {
|
||||
$signupButton.appendTo(that);
|
||||
$signinButton.appendTo(that);
|
||||
} else {
|
||||
$preferencesButton.appendTo(that);
|
||||
$counterImage = Ox.Element({
|
||||
element: '<img>'
|
||||
})
|
||||
.attr({
|
||||
src: '/static/png/counter.png'
|
||||
})
|
||||
.css({
|
||||
height: '64px',
|
||||
position: 'absolute',
|
||||
right: 0,
|
||||
top: '40px'
|
||||
})
|
||||
.appendTo($counter),
|
||||
|
||||
text,
|
||||
loadedCSS = false;
|
||||
|
||||
function getText(callback) {
|
||||
var text = {};
|
||||
Ox.getAsync([
|
||||
'/static/txt/about.ar.txt',
|
||||
'/static/txt/about.en.txt',
|
||||
'/static/txt/tutorial.ar.txt',
|
||||
'/static/txt/tutorial.en.txt',
|
||||
'/static/txt/contact.ar.txt',
|
||||
'/static/txt/contact.en.txt'
|
||||
], Ox.get, function(data) {
|
||||
Object.keys(data).forEach(function(key) {
|
||||
text[key.slice(12, -4)] = data[key].replace(/\n/g, '<br/>')
|
||||
+ '<br/><br/><br/>';
|
||||
})
|
||||
pandora.api.find({}, function(result) {
|
||||
var seconds = result.data.duration | (858 * 3600)
|
||||
text.hours = Math.round(seconds / 3600).toString();
|
||||
callback(text);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function adjustRatio() {
|
||||
var width = $logo.width();
|
||||
var height = $logo.height();
|
||||
if (width == 0 || height == 0) {
|
||||
setTimeout(adjustRatio, 50);
|
||||
function renderCounter() {
|
||||
Ox.forEach(text.hours, function(value, index) {
|
||||
Ox.Element()
|
||||
.css({
|
||||
border: '2px solid black',
|
||||
fontFamily: 'Home English',
|
||||
fontSize: '32px',
|
||||
fontWeight: 'bold',
|
||||
height: '43px',
|
||||
paddingTop: '5px',
|
||||
position: 'absolute',
|
||||
right: 24 + (text.hours.length - index) * 22 + 'px',
|
||||
width: '20px'
|
||||
})
|
||||
.html(value)
|
||||
.appendTo($counter);
|
||||
});
|
||||
}
|
||||
|
||||
function renderPage(page) {
|
||||
if (page == 'home') {
|
||||
$logo.addClass('selected').css({cursor: 'default'});
|
||||
$title.css({display: 'none'});
|
||||
$text_es.css({display: 'none'});
|
||||
$text_en.css({display: 'none'});
|
||||
$tutorials.html('').hide();
|
||||
$menu.css(homeMenuCenterCSS);
|
||||
} else {
|
||||
var aspect = width / height;
|
||||
if (aspect != 2) {
|
||||
var top = 320 / aspect;
|
||||
$reflectionImage.css({
|
||||
top: top + 'px',
|
||||
})
|
||||
$reflectionGradient.css({
|
||||
top: top + 'px',
|
||||
height: (top + 2) + 'px',
|
||||
})
|
||||
$logo.css({
|
||||
bottom: top + 'px',
|
||||
})
|
||||
$menu.css(homeMenuLeftCSS);
|
||||
$logo.removeClass('selected').css({cursor: 'pointer'});
|
||||
$title.attr({
|
||||
src: '/static/png/' + page + '.png'
|
||||
})
|
||||
.css({
|
||||
display: 'block'
|
||||
});
|
||||
$text_es.css({
|
||||
display: 'block'
|
||||
}).html(
|
||||
text[page + '.es']
|
||||
);
|
||||
$text_en.css({
|
||||
display: 'block'
|
||||
}).html(
|
||||
text[page + '.en']
|
||||
);
|
||||
if (page == 'contact') {
|
||||
Ox.forEach(
|
||||
document.querySelectorAll('a[href="/contact"]'),
|
||||
function(link) {
|
||||
link.addEventListener('click', function(e) {
|
||||
pandora.UI.set({page: 'contact'});
|
||||
that.fadeOutScreen();
|
||||
e.preventDefault();
|
||||
return false;
|
||||
})
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function loadCSS(callback) {
|
||||
if (loadedCSS) {
|
||||
callback()
|
||||
} else {
|
||||
Ox.getFile('/static/css/home.css', function() {
|
||||
loadedCSS = true
|
||||
callback()
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
that.fadeInScreen = function() {
|
||||
that.appendTo(Ox.$body).animate({opacity: 1}, 500, function() {
|
||||
that.find(':not(#logo)').animate({opacity: 1}, 250, function() {
|
||||
$findInput.focusInput(true);
|
||||
loadCSS(function() {
|
||||
that.appendTo(Ox.$body).animate({opacity: 1}, 500, function() {
|
||||
getText(function(data) {
|
||||
text = data;
|
||||
renderCounter();
|
||||
that.find('*').animate({opacity: 1}, 250, function() {
|
||||
// ...
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
$logo.animate({width: '320px'}, 500);
|
||||
return that;
|
||||
};
|
||||
|
||||
that.fadeOutScreen = function() {
|
||||
that.find(':not(#logo)').hide();
|
||||
$logo.animate({width: window.innerWidth + 'px'}, 500);
|
||||
$('.OxTooltip').remove();
|
||||
that.animate({opacity: 0}, 500, function() {
|
||||
that.remove();
|
||||
});
|
||||
pandora.$ui.tv && pandora.$ui.tv.unmute().find('.OxControls.OxVolume').hide();
|
||||
return that;
|
||||
};
|
||||
|
||||
that.hideScreen = function() {
|
||||
that.hide().remove();
|
||||
that.find(':not(#logo)').css({opacity: 0});
|
||||
$logo.css({width: window.innerWidth + 'px'});
|
||||
self.keydown && Ox.$document.off({keydown: self.keydown});
|
||||
return that;
|
||||
};
|
||||
|
||||
that.showScreen = function(callback) {
|
||||
var $elements = that.find(':not(.logo)'), count = 0;
|
||||
$logo.css({width: '320px'});
|
||||
that.css({opacity: 1}).appendTo(Ox.$body);
|
||||
that.find(':not(#logo)').css({opacity: 1});
|
||||
$elements.animate({opacity: 1}, 500, function() {
|
||||
if (callback && ++count == $elements.length) {
|
||||
callback();
|
||||
}
|
||||
var $elements = that.find('*'), count = 0;
|
||||
$box.css({top: '80px'});
|
||||
$menu.css({top: '80px'});
|
||||
$counter.css({top: '80px'});
|
||||
getText(function(data) {
|
||||
text = data;
|
||||
renderCounter();
|
||||
loadCSS(function() {
|
||||
that.css({opacity: 1}).appendTo(Ox.$body);
|
||||
$box.animate({top: '32px'}, 500, function() {
|
||||
$elements.animate({opacity: 1}, 250, function() {
|
||||
if (++count == $elements.length) {
|
||||
// ...
|
||||
// callback && callback();
|
||||
}
|
||||
});
|
||||
});
|
||||
//$menu.animate({top: '32px'}, 500);
|
||||
$menu.animate({top: homeMenuCenterCSS.top}, 500);
|
||||
$counter.animate({top: '32px'}, 500);
|
||||
callback && callback();
|
||||
});
|
||||
});
|
||||
$findInput.focusInput(true);
|
||||
return that;
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,18 @@
|
|||
<p class="right">
|
||||
This is a project based on an anthropological investigation of the collective gaze. How are our visual perceptions adjusting? How do symbolic structures connect to each other? How do the visible and the invisible work together? How do memories, desires, subjective projections and common obsessions function as a dynamic ensemble? Based on different precepts, research contexts, and creative parameters, the materials archived, annotated, and edited here seek to set visual precedents for a delirious age in a form of an intersectional, experimental and engaged research.
|
||||
</p>
|
||||
<p class="right">
|
||||
The first step in this process involves the development of the trilogy Le Grande Banlieu. The project culminates by presenting films generated with found footage and collective filming of explicit scenes from three directors who left unfinished projects: Sergei Eisenstein (The Capital), Pier Paolo Pasolini (Oresteia) and Orson Wells (The Dreamers).
|
||||
</p>
|
||||
<p class="right">
|
||||
Other projects are based on specific contextual needs and urgent political assessments. To make them possible, the starting point is the creation of qualitative archives from which editions that explore a plurality of meanings are generated.
|
||||
</p>
|
||||
<p class="right">
|
||||
The project is a collective research proposal, generated by Javier Toscano*
|
||||
(*Member of the National System for the Arts, Mexico).
|
||||
</p>
|
||||
<p class="right">
|
||||
<em>
|
||||
Project funded by the National Fund for Culture and Arts, Mexico.
|
||||
</em>
|
||||
</p>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<p class="left">
|
||||
Este es un proyecto que se basa en una investigación antropológica de la mirada colectiva. ¿Cómo se ajustan nuestras percepciones visuales? ¿Qué estructuras simbólicas se conectan entre sí? ¿Qué es lo que se hace visible e invisible? ¿Cómo se acoplan los recuerdos, los deseos, las proyecciones subjetivas, las obsesiones comunes? Basado en distintos preceptos, contextos de investigación y parámetros creativos, los materiales aquí archivados, anotados y editados buscan sentar precedentes visuales para una época delirante en una forma de investigación interseccional, experimental y comprometida.
|
||||
</p>
|
||||
<p class="left">
|
||||
El primer paso en este proceso implica el desarrollo de la trilogía El Grande Banlieu. El proyecto culmina con películas generadas con materiales encontrados y filmaciones colectivas de escenas explícitas de tres directores que dejaron proyectos sin terminar: Sergei Eisenstein (El Capital), Pier Paolo Pasolini (Orestiada) y Orson Wells (Los Soñadores).
|
||||
</p>
|
||||
<p class="left">
|
||||
Otros proyectos parten de necesidades contextuales específicas y emplazamientos políticos urgentes. Para hacerlos posible, se parte de la creación de archivos cualitativos a partir de los cuales se generan ediciones que exploran una pluralidad de sentidos.
|
||||
</p>
|
||||
<p class="left">
|
||||
El proyecto es una propuesta de investigación colectiva, generado por Javier Toscano* (*Miembro del Sistema Nacional de Creadores de Arte).
|
||||
</p>
|
||||
<p class="left">
|
||||
<em>
|
||||
Proyecto apoyado por el Fondo Nacional para la Cultura y las Artes, México.
|
||||
</em>
|
||||
</p>
|
||||
|
|
@ -0,0 +1 @@
|
|||
For more information on this project, write to: <a class="underline" href="mailto:tosgue@yahoo.com">tosgue@yahoo.com
|
||||
|
|
@ -0,0 +1 @@
|
|||
Para más información sobre este proyecto, escribe a: <a class="underline" href="mailto:tosgue@yahoo.com">tosgue@yahoo.com</a>
|
||||
Loading…
Reference in New Issue