lizard-ui

.

도마뱀 UI는 기본 장고 사용자 인터페이스, 그래서 기본 장고 템플릿 및 일부 CSS + 자바 스크립트 & NBSP를 제공하며, 우리는 우리의 지리 정보 웹 사이트에 대한 Nelen & Schuurmans에 그것을 설계 (물 관리 정보).
선택 사항, 요구 사항, 가정
도마뱀-UI는 독단적 : 그것은 선택과 규정한다 (! 좋은) 기술을합니다.
& NBSP; * 포함 : 청사진 CSS 프레임 워크입니다. 우리가 공통의 기반을 가지고 있도록 그것은 CSS 스타일을 다시 설정합니다. 그것은 일반적인 IE 레이아웃 버그를 해결합니다. 그것은 아주 기쁘게의 기본 입력 체계를 제공합니다.
& NBSP; * 필수 :​​ 장고 - staticfiles. 더 자세한 설명은, (마음에 도마뱀 UI 작성) Reinout의 블로그 항목을 참조하십시오.
& NBSP; * 필수 :​​ 생산 CSS / 자바 스크립트 파일을 결합 django_compressor.
& NBSP * 가정 : 한 화면 스크롤없이 브라우저의 전체 폭 / 높이를 사용. 우리의 주요 목표는 작은 헤더와 사이드와 함께 좋은 큰지도를 보이고있다. 당신은지도를 스크롤하고 싶지 않아요. 그것은 그 주요 내용 영역 자체 내부 스크롤을 가지고 물론 가능하다.
& NBSP; * 가정 : 자바 스크립트 사용할 수 있습니다. 당신은 자바 스크립트를 필요로하므로 이봐, 우리는지도를 보여주는 것입니다. 그래서 우리는 자유롭게 검색하고 주요 콘텐츠 영역의 폭과 높이를 설정하여 예를 들어, UI의 권리를 얻기 위해 자바 스크립트를 사용합니다.
& NBSP; * 포함 : JQuery와. 그래, 그 정도는 현재의 표준입니다. JQuery와 대신 일반 자바 스크립트로 일을 사용할 수있는 그래서 우리는 JQuery와 사용합니다.
& NBSP; * 포함 : jqueryui 및 jquerytools 모두. 비주얼 케이크. 나머지 (드래그 / 드롭 등)에 대한 오버레이 탭, jqueryui에 대한 Jquerytools.
& NBSP; * 포함 : 자바 스크립트 라이브러리 맵으로 openlayers을. (도마뱀 맵, sooooon 발매 예정, 우리의 기본적인지도의 상호 작용 자바 스크립트와 파이썬 코드가 포함되어 있습니다).
외부 CSS / 자바 스크립트 라이브러리의 부부와 함께 도마뱀 - UI 제공됩니다.
청사진
& NBSP; MIT를 수정
JQuery와 및 jqueryui
& NBSP는, 이중 MIT 또는 GPL 버전 2 라이센스하에. MIT, BSD와 GPL 라이센스하에 발표 Sizzle.js가 포함되어 있습니다.
Jquerytools
& NBSP; 아니 저작권 또는 라이센스. 당신이 무엇을 좋아합니까.
Openlayers
& NBSP; 지우기 BSD 라이센스.
Famfamfam 아이콘을 설정
& NBSP; CC 저작자 표시 라이센스.
트 리뷰 jQuery 플러그인
& NBSP; MIT / GPL
장고 설정
여기에 당신이 사용할 수있는 settings.py의 일부입니다. 미디어 및 정적 루트 디렉토리 설정은 buildout의 사용을 가정,하지만 당신은 당신의 자신의 파일 시스템 설치로 변환 할 수 있습니다 :
INSTALLED_APPS = [
& NBSP; 'lizard_ui'
& NBSP; '압축기',
& NBSP; 'staticfiles'
& NBSP; 'django.contrib.admin'
& NBSP; 'django.contrib.auth'
& NBSP; 'django.contrib.contenttypes'
& NBSP; 'django.contrib.sessions'
& NBSP; 'django.contrib.sites'
& NBSP;]
# 참고 : 아래의 설정이 필요보다 더 정교,
# 그러나 우리는 django_compressor의 압축을 테스트 할
# 그래서 미디어 URL 및 루트 및 필요합니다.
True로 # 설정 COMPRESS 당신이 때 압축을 테스트하려면
# DEBUG == 사실. (기본적으로 COMPRESS는 반대입니다
# 1 DEBUG).
COMPRESS = 거짓
# 1 SETTINGS_DIR 미디어 경로 등의 정보는 다음의 제품에 상대 할 수 있습니다
#이 설정에 하드 코드 된 대신 파일
# 1 C : 만 내 컴퓨터 에.
SETTINGS_DIR = os.path.dirname (os.path.realpath (__ FILE__))
# BUILDOUT_DIR는 "주변"buildout에 액세스하는 데 사용
BUILDOUT_DIR은 / var / 정적 파일을 제공하기위한 예를 들어 #
# 1 수집 된 모든 배치 할 적절한 장소를 장고 - staticfiles
# 정적 파일.
BUILDOUT_DIR = os.path.abspath (os.path.join (SETTINGS_DIR, '..'))
사용자가 올린 보유하고있는 디렉토리에 # 절대 경로
# 미디어.
MEDIA_ROOT = os.path.join (BUILDOUT_DIR, 'VAR', '미디어')
# 디렉토리에 대한 절대 경로 위치 장고 - staticfiles '
# "빈 / 장고 build_static"장소는 모든 정적 수집
모든 응용 프로그램 '/ 미디어 디렉토리에서 # 파일.
STATIC_ROOT = os.path.join (BUILDOUT_DIR, 'VAR', '정적')
# 미디어 MEDIA_ROOT에서 제공 처리 URL. 확인
경로 구성 요소가있는 경우 # 확인 슬래시를 사용하는
# (다른 경우 선택 사항).
MEDIA_URL = '/ 미디어 /'
응용 프로그램 별 / 미디어 정적 파일에 대한 # URL을 수집
장고 - staticfiles에 의해 #. {{ "와 같은 템플릿에 사용
# 1 MEDIA_URL}} myPackage에 / my.css ".
STATIC_URL = '/ static_media /'
관리자 미디어 # URL 접두어 - CSS, 자바 스크립트,
# 이미지. 슬래시를 사용하십시오. 용도
장고 - staticfiles자가 # STATIC_URL 멋지게 관리자의 수집
STATIC_ROOT / 관리자에 # 정적 미디어.
ADMIN_MEDIA_PREFIX = STATIC_URL + '관리자 /'
# 스토리지 엔진은 압축 중에 사용될
COMPRESS_STORAG​​E = "staticfiles.storage.StaticFileStorage"
# 미디어 링크 된 URL은 읽고 압축됩니다
# 미디어가 기록됩니다.
COMPRESS_URL = STATIC_URL
# 미디어를 연결 절대 파일 경로에서 읽을 수 있습니다
# 압축 매체를 기록 할 것입니다.
COMPRESS_ROOT = STATIC_ROOT
# 장고 - staticfiles에 사용
TEMPLATE_CONTEXT_PROCESSORS = (
& NBSP; # 기본 항목.
& NBSP; "django.core.context_processors.auth"
& NBSP; "django.core.context_processors.debug"
& NBSP; "django.core.context_processors.i18n"
& NBSP; "django.core.context_processors.media"
& NBSP; # 당신에게 허용하는 장고 - staticfiles 추가 할 필요가
& NBSP는 #은 템플릿에서 {{STATIC_URL}} MyApp를 / my.css를 사용합니다.
& NBSP; 'staticfiles.context_processors.static_url'
& NBSP;)
그리고 적절한 아파치 설정 힌트 :
<위치 / static_media />
& NBSP; # CSS / 자바 스크립트 / 이미지 staticfiles는에 캐시됩니다
& NBSP; 하루 # 브라우저.
& NBSP;는 ExpiresActive에
& NBSP; ExpiresDefault "액세스 더하기 일일"

<위치 / static_media / CACHE />
& NBSP; # 1 django_compress의 생성 timestamp'ed 파일 :
& NBSP; # 캐시 영원히
& NBSP;는 ExpiresActive에
& NBSP; ExpiresDefault "액세스 플러스 십년"

# 정적 파일은 아파치 자체에 의해 호스팅됩니다.
# 사용자가 업로드 한 미디어 : MEDIA_URL = '/ 미디어 /'
별칭 / 미디어 / $ {buildout : 디렉토리}은 / var / 미디어 /
# 1 장고 - staticfiles : STATIC_URL = '/ static_media /'
별칭 / static_media / $ {buildout : 디렉토리}은 / var / 정적 /
용법
당신은 도마뱀 UI의 URL을 장착 할 수 있지만, 예를 살 만 포함되어 있습니다. 그래서 아마 당신은 단지 / UI에서 디버그 모드로 마운트해야합니다. 핸디가 사용할 블록 및 클래스 / 당신이 사용할 수있는 ID를 포함하여, 그것을 사용하는 방법에 대한 합리적 전체 문서가 들어있다.
기본 레이아웃은 realbase.html에 정의되어있다. 당신은 그러나 lizard_ui / lizardbase.html을 확장 한 다음 원하는 블록을 오버라이드 (override) 할 필요가 있습니다.
CSS와 자바 스크립트 관련 블록에 추가해야하지만 "block.super"를 호출하는 것을 잊지 마세요. 예 :
{%는 "lizard_ui / lizardbase.html"% 확장}
{% 블록의​​ CSS %}
{{block.super}}
<링크 유형 = "텍스트 / CSS"
& NBSP; HREF = "{{STATIC_URL}} lizard_map / lizard_map.css"
& NBSP; 미디어 = "화면 투사"
& NBSP; REL = "스타일"/>
{% 엔드 블록의 CSS %}
{% 블록 자바 스크립트 %}
{{block.super}}
<스크립트 유형 = "텍스트 / 자바 스크립트"
& NBSP; SRC = "{{STATIC_URL}} openlayers / OpenLayers.js">

<스크립트 유형 = "텍스트 / 자바 스크립트"
& NBSP; SRC = "{{STATIC_URL}} lizard_map / lizard_map.js">
{%의 엔드 블록 자바 스크립트 %}
{% 블록 콘텐츠 %}