Просмотр исходного кода

Merge branch 'feature/style' into develop

Add a styled and mostly content-complete about page.
tags/v1.0^2
Severyn Kozak 10 лет назад
Родитель
Сommit
13c4d7ee23
14 измененных файлов: 170 добавлений и 12 удалений
  1. +3
    -2
      app.py
  2. Двоичные данные
     
  3. Двоичные данные
     
  4. Двоичные данные
     
  5. Двоичные данные
     
  6. +15
    -0
      static/js/about.js
  7. +0
    -1
      static/js/index.js
  8. +4
    -0
      static/sass/_mixins.sass
  9. +88
    -0
      static/sass/about.sass
  10. +1
    -1
      static/sass/index.sass
  11. +9
    -3
      static/sass/main.sass
  12. +48
    -4
      templates/about.html
  13. +1
    -0
      templates/index.html
  14. +1
    -1
      templates/layout.html

+ 3
- 2
app.py Просмотреть файл

@@ -2,10 +2,10 @@
Module to contain all the project's Flask server plumbing.
"""

from json import dumps
import datetime

from json import dumps
from flask import Flask, make_response, render_template, request

from bitshift import assets
from bitshift.database import Database
from bitshift.languages import LANGS
@@ -13,6 +13,7 @@ from bitshift.query import parse_query, QueryParseException

app = Flask(__name__)
app.config.from_object("bitshift.config")
app.jinja_env.globals.update(year=datetime.datetime.now().year)

app_env = app.jinja_env
app_env.line_statement_prefix = "="


Двоичные данные
Просмотреть файл


Двоичные данные
Просмотреть файл


Двоичные данные
Просмотреть файл


Двоичные данные
Просмотреть файл


+ 15
- 0
static/js/about.js Просмотреть файл

@@ -0,0 +1,15 @@
/*
* @file Implements a parallax effect on the about page.
*/

var lastVertPos = $(window).scrollTop();

$(window).scroll(function(e){
var currVertPos = $(window).scrollTop();
var delta = currVertPos - lastVertPos;
$(".bg").each(function(){
$(this).css("top", parseFloat($(this).css("top")) -
delta * $(this).attr("speed") + "px");
});
lastVertPos = currVertPos;
});

+ 0
- 1
static/js/index.js Просмотреть файл

@@ -138,7 +138,6 @@ var searchResultsPage = 1;

//Obtained by parsing python file with pygments
var codeExample = '<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre> 1\n 2\n 3\n 4\n 5\n 6\n 7\n 8\n 9\n10\n11\n12\n13\n14\n15\n16\n17\n18\n19\n20\n21\n22\n23\n24\n25\n26\n27\n28\n29\n30\n31\n32\n33\n34\n35\n36\n37\n38\n39\n40</pre></div></td><td class="code"><div class="highlight"><pre><span class="sd">&quot;&quot;&quot;</span>\n<span class="sd">Module to contain all the project&#39;s Flask server plumbing.</span>\n<span class="sd">&quot;&quot;&quot;</span>\n\n<span class="kn">from</span> <span class="nn">flask</span> <span class="kn">import</span> <span class="n">Flask</span>\n<span class="kn">from</span> <span class="nn">flask</span> <span class="kn">import</span> <span class="n">render_template</span><span class="p">,</span> <span class="n">session</span>\n\n<span class="kn">from</span> <span class="nn">bitshift</span> <span class="kn">import</span> <span class="n">assets</span>\n<span class="c"># from bitshift.database import Database</span>\n<span class="c"># from bitshift.query import parse_query</span>\n\n<span class="hll"><span class="n">app</span> <span class="o">=</span> <span class="n">Flask</span><span class="p">(</span><span class="n">__name__</span><span class="p">)</span>\n</span><span class="hll"><span class="n">app</span><span class="o">.</span><span class="n">config</span><span class="o">.</span><span class="n">from_object</span><span class="p">(</span><span class="s">&quot;bitshift.config&quot;</span><span class="p">)</span>\n</span>\n<span class="hll"><span class="n">app_env</span> <span class="o">=</span> <span class="n">app</span><span class="o">.</span><span class="n">jinja_env</span>\n</span><span class="hll"><span class="n">app_env</span><span class="o">.</span><span class="n">line_statement_prefix</span> <span class="o">=</span> <span class="s">&quot;=&quot;</span>\n</span><span class="hll"><span class="n">app_env</span><span class="o">.</span><span class="n">globals</span><span class="o">.</span><span class="n">update</span><span class="p">(</span><span class="n">assets</span><span class="o">=</span><span class="n">assets</span><span class="p">)</span>\n</span>\n<span class="c"># database = Database()</span>\n\n<span class="hll"><span class="nd">@app.route</span><span class="p">(</span><span class="s">&quot;/&quot;</span><span class="p">)</span>\n</span><span class="k">def</span> <span class="nf">index</span><span class="p">():</span>\n <span class="k">return</span> <span class="n">render_template</span><span class="p">(</span><span class="s">&quot;index.html&quot;</span><span class="p">)</span>\n\n<span class="hll"><span class="nd">@app.route</span><span class="p">(</span><span class="s">&quot;/search/&lt;query&gt;&quot;</span><span class="p">)</span>\n</span><span class="k">def</span> <span class="nf">search</span><span class="p">(</span><span class="n">query</span><span class="p">):</span>\n <span class="c"># tree = parse_query(query)</span>\n <span class="c"># database.search(tree)</span>\n <span class="k">pass</span>\n\n<span class="hll"><span class="nd">@app.route</span><span class="p">(</span><span class="s">&quot;/about&quot;</span><span class="p">)</span>\n</span><span class="k">def</span> <span class="nf">about</span><span class="p">():</span>\n <span class="k">return</span> <span class="n">render_template</span><span class="p">(</span><span class="s">&quot;about.html&quot;</span><span class="p">)</span>\n\n<span class="hll"><span class="nd">@app.route</span><span class="p">(</span><span class="s">&quot;/developers&quot;</span><span class="p">)</span>\n</span><span class="k">def</span> <span class="nf">developers</span><span class="p">():</span>\n <span class="k">return</span> <span class="n">render_template</span><span class="p">(</span><span class="s">&quot;developers.html&quot;</span><span class="p">)</span>\n\n<span class="k">if</span> <span class="n">__name__</span> <span class="o">==</span> <span class="s">&quot;__main__&quot;</span><span class="p">:</span>\n<span class="hll"> <span class="n">app</span><span class="o">.</span><span class="n">run</span><span class="p">(</span><span class="n">debug</span><span class="o">=</span><span class="bp">True</span><span class="p">)</span>\n</span></pre></div>\n</td></tr></table>'
searchBar.onkeyup = typingTimer;

var testCodelet = {
'url': 'https://github.com/earwig/bitshift/blob/develop/app.py',


+ 4
- 0
static/sass/_mixins.sass Просмотреть файл

@@ -15,6 +15,10 @@
@include vendor(opacity, $opacity)
filter: alpha(opacity=$opacity)

@mixin delay($time)
transition-delay: $time
-webkit-transition-delay: $time

.t1
@include vendor(transition, all 0.1s ease-out)



+ 88
- 0
static/sass/about.sass Просмотреть файл

@@ -0,0 +1,88 @@
/*
Stylesheet for `templates/about.html`
*/

@import mixins
@import variables

div.bg
$img-height: 650px

position: fixed
width: 100%
left: 0
z-index: -1

&#img-1
background: url(../img/about/bg1.png) no-repeat
background-size: cover
height: 400px
top: -210px

&#img-2
background: url(../img/about/bg2.png) no-repeat
height: $img-height + 530
top: 550px

&#img-3
background: url(../img/about/bg3.png) no-repeat
background-size: cover
height: $img-height + 250
top: 1600px

&#img-4
background: url(../img/about/bg4.png) no-repeat
background-size: cover
height: $img-height + 300
top: 5450px

div.section
background-color: white
border: 1px solid $baseColor2
height: 300px
margin-bottom: 200px
margin-top: 300px
padding-bottom: 50px
padding-top: 20px

&#top
margin-top: 0px

div.centered
font-size: 110%
line-height: 150%
margin-left: auto
margin-right: auto
width: 50%

&#how
b
font-family: monospace
font-size: 110%

ul
list-style: none

span
color: $baseColor1
font-weight: bold

h1
color: $baseColor1

span
color: $baseColor2

a
color: #727070
font-style: italic
text-decoration: none

&:hover
@extend .t3

color: #575757

span#title
color: $baseColor1
font-weight: bold

+ 1
- 1
static/sass/index.sass Просмотреть файл

@@ -1,5 +1,5 @@
/*
Stylesheet for `index.html`.
Stylesheet for `templates/index.html`.
*/

@import mixins


+ 9
- 3
static/sass/main.sass Просмотреть файл

@@ -30,15 +30,21 @@ div#container

div#footer
@extend .t3
@include delay(1s)

background-color: $baseColor1
bottom: 0
bottom: -30px
height: 60px
padding-top: 12px
position: absolute
padding-top: 15px
position: fixed
text-align: center
width: 100%

&:hover
@include delay(0s)

bottom: 0

*
color: white



+ 48
- 4
templates/about.html Просмотреть файл

@@ -1,11 +1,55 @@
= extends "layout.html"

= block title
About
about
= endblock

= block body
<div>
About us, son.
= block head
{{ assets.tag("lib/jquery.min.js") }}
{{ assets.tag("main.css") }}
{{ assets.tag("about.css") }}
{{ assets.tag("about.js") }}
= endblock

= block after_body
<div id="img-1" class="bg" speed="-1.25"></div>
<div id="img-2" class="bg" speed="1.8"></div>
<div id="img-3" class="bg" speed="1.6"></div>
<div id="img-4" class="bg" speed="3.8"></div>

<div id="top" class="section">
<div class="centered">
<h1><span>&raquo;</span> What</h1>
<span id="title">bitshift</span> is an <a href="https://github.com/earwig/bitshift">open-source</a>
online source-code search engine, developed by programmers, for programmers. The engine currently aggregates
publicly-available code from two online frameworks &#8211; <a href="https://github.com/">GitHub</a> and <a
href="https://bitbucket.org/">Bitbucket</a> &#8211; but has the necessary infrastructure to quickly incorporate
others, like <a href="http://stackoverflow.com/">StackOverflow</a> and <a href="https://gitorious.org/">Gitorious</a>
<span id="title">bitshift</span> supports a robust query language, which allows users to search for specific
languages, files, dates of creation and last modifcation, and symbols (function, class, and variable names),
amongst other attributes.
</div>
</div>

<div class="section">
<div id="how" class="centered">
<h1><span>&raquo;</span> How</h1>
<span id="title">bitshift</span> has an extensive back-end, roughly divided into three sections:
<ul>
<li><span>indexer</span> : finds and downloads code on online frameworks</li>
<li><span>parser</span> : parses newly crawled code, identifying its symbols</li>
<li><span>database</span> : interprets and compiles user searches into database queries</li>
</ul>

The engine was developed over the span of four months, and is primarily implemented in <b>Python</b>, but has
parser in <b>Ruby</b>, <b>Java</b>, and a number of other languages.
</div>
</div>

<div class="section">
<div class="centered">
<h1><span>&raquo;</span> Who</h1>
Who who? <b>Us who.</b> <span style="font-size:70%;">More stuffs to come (photos and bios).</span>
</div>
</div>
= endblock

+ 1
- 0
templates/index.html Просмотреть файл

@@ -108,6 +108,7 @@
<li><span class="hotkey">j</span> <span class="seperator">:</span> move window down to the next result</li>
<li><span class="hotkey">h</span> <span class="seperator">:</span> move to the previous symbol match</li>
<li><span class="hotkey">l</span> <span class="seperator">:</span> move to the next symbol match</li>
<li><span class="hotkey">?</span> <span class="seperator">:</span> toggle help</li>
</ul>
</div>
= endblock

+ 1
- 1
templates/layout.html Просмотреть файл

@@ -41,7 +41,7 @@
<a href="/about">about</a>
<a href="/developers">developers</a>
<p>
&copy; 2012-2013 bitshift. <span>All Rights Reserved.</span>
&copy; {{ year }} bitshift
</p>
</div>
</div>


Загрузка…
Отмена
Сохранить