Переглянути джерело

Search results are now code blocks. Used pygments to parse a block of code into html, and used html styles to highlight the text.

tags/v1.0^2
Benjamin Attal 10 роки тому
джерело
коміт
38660eaae2
4 змінених файлів з 34 додано та 5 видалено
  1. BIN
     
  2. +3
    -4
      static/js/index.js
  3. +2
    -1
      static/sass/index.sass
  4. +29
    -0
      templates/index.html

+ 3
- 4
static/js/index.js Переглянути файл

@@ -25,6 +25,8 @@ searchBar = $("form#search-bar input[type='text']")[0];
resultsDiv = $("div#results")[0];

var typingTimer, lastValue;
//Obtained by parsing python file with pygments
var codeExample = '<div class="hll"><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="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 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\n<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 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 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\n<span class="c"># database = Database()</span>\n\n<span class="nd">@app.route</span><span class="p">(</span><span class="s">&quot;/&quot;</span><span class="p">)</span>\n<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="nd">@app.route</span><span class="p">(</span><span class="s">&quot;/search/&lt;query&gt;&quot;</span><span class="p">)</span>\n<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="nd">@app.route</span><span class="p">(</span><span class="s">&quot;/about&quot;</span><span class="p">)</span>\n<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="nd">@app.route</span><span class="p">(</span><span class="s">&quot;/developers&quot;</span><span class="p">)</span>\n<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="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</pre></div>\n'
searchBar.onkeyup = typingTimer;

// Enable infinite scrolling down the results page.
@@ -120,10 +122,7 @@ function queryServer(){
for(var result = 0; result < 20; result++){
var newDiv = document.createElement("div");
newDiv.classList.add("result");
newDiv.innerHTML = Math.random();
newDiv.style.textAlign = "center";
newDiv.style.color = "#" + Math.floor(Math.random() *
16777215).toString(16);
newDiv.innerHTML = codeExample;
resultDivs.push(newDiv);
}



+ 2
- 1
static/sass/index.sass Переглянути файл

@@ -283,7 +283,8 @@ div#results
width: 80%

div.result
background-color: #F8F8F8
background-color: none
font-family: Arial, "Inconsolata"
margin-bottom: 10%
margin-top: 1%
padding: 1%


+ 29
- 0
templates/index.html Переглянути файл

@@ -11,6 +11,7 @@
{{ assets.tag("lib/typeahead.bundle.min.js") }}

{{ assets.tag("index.css") }}
{{ assets.tag("highlight.css") }}

<script>
AUTOCOMPLETE_LANGUAGES = {{ autocomplete_languages | safe }};
@@ -89,6 +90,34 @@
<span class="regex">Regex</span>
</div>
</div>
<<<<<<< HEAD
=======

<div id="lower-half">
<ul>
<li>
<label for="symbols">Symbols</label>
<input type="text" name="symbols" id="symbols"><br>
</li>

<li>
<label for="functions">Functions</label>
<input type="text" name="functions" id="functions"><br>
</li>

<li>
<label for="classes">Classes</label>
<input type="text" name="classes" id="classes"><br>
</li>

<li>
<label for="variables">Variables</label>
<input type="text" name="variables" id="variables"><br>
</li>

</ul>
</div>
>>>>>>> Search results are now code blocks. Used pygments to parse a block of code into html, and used html styles to highlight the text.
</div>
</div>
</form>


Завантаження…
Відмінити
Зберегти