previews and infos

This commit is contained in:
sanj 2011-01-11 19:56:36 +05:30
parent 8053437ccc
commit d106ad3371
7 changed files with 129 additions and 18 deletions

View File

@ -2,6 +2,7 @@
# vi:si:et:sw=4:sts=4:ts=4 # vi:si:et:sw=4:sts=4:ts=4
from __future__ import division from __future__ import division
import os.path import os.path
from os.path import join
import re import re
from datetime import datetime from datetime import datetime
from urllib2 import unquote from urllib2 import unquote
@ -97,8 +98,7 @@ def api_error(request):
def api_find(request): def api_find(request):
data = json.loads(request.POST['data']) data = json.loads(request.POST['data'])
# print json.dumps(data) # print json.dumps(data)
module = __import__(data['module']) model = getModel(data)
model = module.models.__getattribute__(data['model'])
response = json_response({}) response = json_response({})
l = model.get_list(data) l = model.get_list(data)
if data.has_key('range'): if data.has_key('range'):
@ -107,7 +107,38 @@ def api_find(request):
response['data']['items'] = len(l) response['data']['items'] = len(l)
response['status'] = {'code': 200} response['status'] = {'code': 200}
return render_to_json_response(response) return render_to_json_response(response)
def api_preview(request):
data = json.loads(request.POST['data'])
id = int(data['id'])
model = getModel(data)
response = json_response({})
response['status'] = {'code': 200}
obj = get_object_or_404(model, pk=id)
response['data'] = obj.preview_dict()
response['template'] = getTemplate(data, "preview")
return render_to_json_response(response)
#FIXME: Generalize based on these two functions being the same.
def api_info(request):
data = json.loads(request.POST['data'])
id = int(data['id'])
model = getModel(data)
response = json_response({})
response['status'] = {'code': 200}
obj = get_object_or_404(model, pk=id)
response['data'] = obj.info_dict()
response['template'] = getTemplate(data, "info")
return render_to_json_response(response)
def getTemplate(data, tmpl_name):
path = join(settings.PROJECT_PATH, "templates", data['module'], data['model'], tmpl_name + ".html")
return open(path).read().strip()
def getModel(data):
module = __import__(data['module'])
return module.models.__getattribute__(data['model'])
def get_api_doc(f): def get_api_doc(f):
f = 'api_' + f f = 'api_' + f

View File

@ -39,6 +39,15 @@ class BestPractice(ItfModel):
'category': self.category.name, 'category': self.category.name,
} }
def preview_dict(self):
return {
'id': self.id,
'title': self.title,
'category': self.category.name,
'quick_howto': self.quick_howto,
'guideline': self.guideline
}
class BestPracticeCategory(models.Model): class BestPracticeCategory(models.Model):
name = models.CharField(max_length=256) name = models.CharField(max_length=256)

8
itf/static/css/itf.css Normal file
View File

@ -0,0 +1,8 @@
.itfPreviewSub {
font-weight: bold;
}
.itfInfoSub {
font-weight: bold;
font-size: 1.2em;
}

View File

@ -7,7 +7,7 @@ var app = new Ox.App({
}); });
app.launch(function(data) { app.launch(function(data) {
Ox.theme("modern"); Ox.theme("classic");
Ox.print(data); Ox.print(data);
app.$body = $('body'); app.$body = $('body');
@ -20,7 +20,7 @@ app.launch(function(data) {
/* /*
//FIXME: should this be a nested structure as their representation on the page? //FIXME: should this be a nested structure as their representation on the page?
app.constructors = ['wrapper', 'headerPanel', 'mainPanel', 'leftPanel', 'cityPicker', 'calendarBox', 'currentEventsList', 'middlePanel', 'middleTopPanel', 'newsfeedBox', 'aboutBox', 'itfBox', 'middleBottomPanel', 'erangBox', 'scriptArchiveBox', 'bestPracticesBox', 'biblioBox', 'offersNeedsBox', 'surveysBox', 'rightPanel', 'searchBox', 'loginBox', 'featureBox', 'footerPanel'] app.constructors = ['wrapper', 'headerPanel', 'mainPanel', 'leftPanel', 'cityPicker', 'calendarBox', 'currentEventsList', 'middlePanel', 'middleTopPanel', 'newsfeedBox', 'aboutBox', 'itfBox', 'middleBottomPanel', 'erangBox', 'scriptArchiveBox', 'bestPracticesBox', 'biblioBox', 'offersNeedsBox', 'surveysBox', 'rightPanel', 'searchBox', 'loginBox', 'previewBox', 'footerPanel']
*/ */
app.$ui = {}; app.$ui = {};
@ -219,7 +219,7 @@ Structure:
surveysBox surveysBox
rightPanel rightPanel
loginBox loginBox
featureBox previewBox
footerPanel footerPanel
*/ */
@ -534,12 +534,26 @@ BEGIN mainPanel
'bestPracticesBox': function() { 'bestPracticesBox': function() {
var id = 'bestpracticesBox'; var id = 'bestpracticesBox';
var title = "Best Practices";
var module = "bestpractices";
var model = "BestPractice";
var info = "Some best practices lorem ipsum";
var c = app.$ui[id] = new Ox.ItfBox({ var c = app.$ui[id] = new Ox.ItfBox({
'id': id, 'id': id,
'title': 'Best Practices', 'title': 'Best Practices',
'module': 'bestpractices', 'module': 'bestpractices',
'model': 'BestPractice', 'model': 'BestPractice',
'info': 'Some best practices lorem ipsum' 'info': 'Some best practices lorem ipsum'
/*
'preview': function(data, callback) {
var selectedId = data.ids[0];
app.api.preview({
'model': model,
'module': module,
'data': {'id': selectedId}
}, callback);
}
*/
}); });
// c.html("best practices goes here"); // c.html("best practices goes here");
return c; return c;
@ -624,7 +638,7 @@ BEGIN mainPanel
size: 256 size: 256
}, },
{ {
element: app.construct.featureBox() element: app.construct.previewBox()
} }
] ]
}); });
@ -640,12 +654,12 @@ BEGIN mainPanel
return c; return c;
}, },
'featureBox': function() { 'previewBox': function() {
var id = 'featureBox'; var id = 'previewBox';
var c = app.$ui[id] = new Ox.Element({ var c = app.$ui[id] = new Ox.Element({
id: id id: id
}); });
c.html("featured profile here"); c.html("previews here");
return c; return c;
}, },
@ -791,7 +805,7 @@ Ox.ItfBox = function(options, self) {
.appendTo(that) .appendTo(that)
.css({position: 'relative', height: '100%'}); .css({position: 'relative', height: '100%'});
var $list = new Ox.TextList({ var listOptions = $.extend(options, {
'width': 256, 'width': 256,
// 'itemHeight': 16, // 'itemHeight': 16,
// 'itemWidth': 250, // 'itemWidth': 250,
@ -800,11 +814,15 @@ Ox.ItfBox = function(options, self) {
return app.api.find(getQueryParams(data), callback) return app.api.find(getQueryParams(data), callback)
}, },
'id': options.id + 'List', 'id': options.id + 'List',
/*
'construct': function(data) { 'construct': function(data) {
var $a = $('<a />').attr("href", "/" + options.module.toLowerCase() + "/" + data.id).text(data.title); var $a = $('<a />').attr("href", "/" + options.module.toLowerCase() + "/" + data.id).text(data.title);
var $item = $('<div />').addClass('OxTarget').append($a); var $item = $('<div />').addClass('OxTarget').append($a);
return $item; return $item;
}, },
*/
'max': 1, 'max': 1,
'columns': [ 'columns': [
{ {
@ -825,21 +843,54 @@ Ox.ItfBox = function(options, self) {
key: 'title', key: 'title',
operator: '-' operator: '-'
}] }]
})
// .css({position: 'relative', height: '100%'})
.appendTo($listContainer)
.bindEvent("select", function(e, data) {
// alert(JSON.stringify(data));
}); });
var $list = new Ox.ItfList(listOptions)
.appendTo($listContainer);
// $buttons = new Ox.
return that; return that;
} }
Ox.ItfList = function(options, self) { Ox.ItfList = function(options, self) {
var self = self || {}; var self = self || {};
var that = new Ox.List(options, self); var that = new Ox.TextList(options, self);
that.bindEvent("select", function(e, data) {
app.api.preview({
model: options.model,
module: options.module,
id: data.ids[0]
}, function(response) {
// alert(JSON.stringify(response.data.data));
var html = $.tmpl(response['template'], response['data']);
app.$ui.previewBox.html(html);
});
});
that.bindEvent("open", function(e, data) {
// alert(JSON.stringify(data));
app.api.info({
model: options.model,
module: options.module,
id: data.ids[0]
}, function(response) {
var html = $.tmpl(response['template'], response['data']);
// alert(html);
var d = new Ox.Dialog({
buttons: [
new Ox.Button({
id: 'cancel',
title: 'Close',
})
.bindEvent("click", function() { d.close(); })
],
content: new Ox.Element().append(html),
title: options.title + ": " + response.data.title,
width: 800,
height: 500
})
.open();
// alert(response);
});
});
return that; return that;
} }

View File

@ -0,0 +1,7 @@
<div class="itfInfo">
<span class="itfInfoSub">Story: </span><span class="itfInfoInfo">${story}</span><br /><br />
<span class="itfInfoSub">Guideline: </span><span class="itfInfoInfo">${guideline}</span><br /><br />
<span class="itfInfoSub">Law: </span><span class="itfInfoInfo">${law}</span><br /><br />
<span class="itfInfoSub">Relevance to Theatre: </span><span class="itfInfoInfo">${theatre}</span><br /><br />
<span class="itfInfoSub">Quick Howto: </span><span class="itfInfoInfo">${quick_howto}</span><br /><br />
</div>

View File

@ -0,0 +1,4 @@
<div class="itfPreview">
<span class="itfPreviewSub">Category: </span><span class="itfPreviewText">${category}</span> <br /><br />
<span class="itfPreviewSub">Quick Howto: </span><span class="itfPreviewText">${quick_howto}</span>
</div>

View File

@ -5,6 +5,7 @@
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link rel="shortcut icon" type="image/png" href="/favicon.ico"/> <link rel="shortcut icon" type="image/png" href="/favicon.ico"/>
<link rel="stylesheet" type="text/css" href="/static/oxjs/build/css/ox.ui.css"/> <link rel="stylesheet" type="text/css" href="/static/oxjs/build/css/ox.ui.css"/>
<link rel="stylesheet" type="text/css" href="/static/css/itf.css"/>
<script type='text/javascript'> <script type='text/javascript'>
if(typeof(console)=='undefined') { if(typeof(console)=='undefined') {
console = {}; console = {};