Added a LICENSE file, modofied CONTRIBUTING.md and now CSS and JS files are included directly into graf.php
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index ca64b2d..38b4da3 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -1,22 +1,19 @@
# Contributing
-For the sake of safe and understandable code, we divide our JS scripts and CSS styles into multiples files. But, to make the page load faster, before committing, please run `sh concatenate.sh` so all those files are concatenated.
+Hi there! If you want to contribute to build this alternative version of the Graf, you can do several things:
-This will concatenate the files in the following way:
+## Contribute with code
+If you want to contribute by writing code, you can fork this repository, develop there, and then create a new pull request to merge your modifications into this repository.
-The file script.js will be created with the concatenation of the following files: (in this order)
-1. circle-mode.js
-2. graf.js
-3. limit-years.js
-4. search-bar.js
-5. dialog.js
-6. camera.js
-7. just-do-it.js
-8. init.js
+All help is welcome, but please make sure to test your code before creating the pull request and don't create multiple pull requests about a single feature. Also, try to follow the style of the code already written, which will make it look clean. These are some of the conventions we use (adapted from https://github.com/opengovernment/opengovernment/blob/master/CONTRIBUTING.md):
-The file styles.css will be created with the concatenation of the following files: (in this order)
-1. general.css
-2. graf.css
-3. dialog.css
-4. option-buttons.css
-5. year-list.css
-6. search-bar.css
+* We indent using two spaces (soft tabs)
+* We generally put spaces after list items and method parameters (`[1, 2, 3]`, not `[1,2,3]`) and around operators (`x += 1`, not `x+=1`). Some exceptions are when using increment and decrement operators (e.g. `i++`) or when multiplying, dividing, and even sometimes when summing or subtracting two numbers (e.g. `a*b`), although sometimes spaces are added to sums and subtractions to make it clear that multiplication and division have higher precedence (e.g. `a + b*c`).
+* This is open source software. Consider the people who will read your code, and make it look nice for them. It's sort of like driving a car: Perhaps you love doing donuts when you're alone, but with passengers the goal is to make the ride as smooth as possible.
+
+### About CSS and JS files
+For the sake of understandable code, we divide our JS scripts and CSS styles into multiples files.
+
+Before, we concatenated all these JS and CSS files into two single files which were included into `graf.php`, but as we now have `modspeed` running in our server (an Apache mod which, apart from other things, can combine CSS and JS files when serving pages) and this procedure was complex and tiring, we no longer need to do this, so we are now including all JS and CSS files directly to the `graf.php` page for the sake of simplicity.
+
+## Contribute filling in bug issues or feature requests
+Did you find out something is not working, or do you have an awesome idea about the alternative Graf? It would be great if you filled in a new issue! But just before you do that, check out that another issue about the same topic doesn't exist.
diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000..c086046
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2018 The Alternative Graf Authors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.
diff --git a/concatenate.sh b/concatenate.sh
deleted file mode 100644
index e8e72c3..0000000
--- a/concatenate.sh
+++ /dev/null
@@ -1,3 +0,0 @@
-#!/bin/sh
-(cd css && rm -f styles.css && cat general.css graf.css dialog.css option-buttons.css year-list.css search-bar.css > styles.css)
-(cd js && rm -f script.js && cat circle-mode.js graf.js limit-years.js search-bar.js dialog.js camera.js just-do-it.js init.js > script.js)
diff --git a/css/styles.css b/css/styles.css
deleted file mode 100644
index cb36762..0000000
--- a/css/styles.css
+++ /dev/null
@@ -1,303 +0,0 @@
-/* ********** HERE STARTS general.css ****** */
-
-html, body {
- margin: 0;
- width: 100%;
- height: 100%;
- background-color: #060606;
- color: white;
- -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
- user-select: none !important;
- font-family: 'Roboto';
-}
-/* ********** HERE STARTS graf.css ****** */
-
-#graf {
- width: 100%;
- height: 100%;
-}
-
-span {
- position: relative;
- z-index: -1;
-}
-/* ********** HERE STARTS dialog.css ****** */
-
-#dialog {
- position: absolute;
- top: 0px;
- left: 0px;
- width: 300px;
- height: 100%;
- background-color: white;
- color: black;
- z-index: 120;
- overflow-y: auto;
-}
-
-#backdrop {
- display: none;
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- background-color: rgba(0, 0, 0, .5);
- z-index: 110;
-}
-
-#dialog-vertex, #dialog-edge {
- padding: 8px;
- user-select: auto;
-}
-
-#dialog h2 {
- font-weight: bold;
- font-size: 20px;
-}
-
-#dialog h3 {
- font-weight: bold;
- font-size: 16px;
- margin-bottom: 0;
-}
-
-#quit-dialog, #quit2-dialog {
- position: absolute;
- top: 8px;
- right: 8px;
-}
-
-#min-dialog, #max-dialog {
- position: absolute;
- top: 8px;
- right: 48px;
-}
-
-#min-dialog {
- display: none;
-}
-
-#summary-dialog {
- position: absolute;
- top: 0px;
- left: 0px;
- width: 100%;
- height: 100px;
- background-color: white;
- color: black;
- z-index: 120;
-}
-
-#summary-vertex {
- padding: 8px;
- user-select: auto;
-}
-
-#summary-dialog h2 {
- font-weight: bold;
- font-size: 20px;
- margin: 0;
-}
-/* ********** HERE STARTS search-bar.css ****** */
-#circle-mode {
- position: absolute;
- right: 10px;
- bottom: 210px;
- z-index: 100;
-}
-
-#settings {
- position: absolute;
- right: 10px;
- bottom: 160px;
- z-index: 100;
-}
-
-#search {
- position: absolute;
- right: 10px;
- bottom: 110px;
- z-index: 100;
-}
-
-#zoomin {
- position: absolute;
- right: 10px;
- bottom: 60px;
- z-index: 100;
-}
-
-#zoomout {
- position: absolute;
- right: 10px;
- bottom: 10px;
- z-index: 100;
-}
-
-#zoomin.touch {
- display: none;
-}
-
-#zoomout.touch {
- display: none;
-}
-/* ********** HERE STARTS year-list.css ****** */
-
-#year-list {
- padding: 16px;
- padding-top: 0;
- position:absolute;
- right: 0;
- top: 68px;
- z-index:10;
- display:none
-}
-
-#year-list-span {
- position:relative;
- z-index:10;
-}
-
-.custom-checkbox .mdl-checkbox__box-outline {
- border: 2px solid rgba(0,0,0,.8)!important;
- background-color: white!important;
-}
-/* ********** HERE STARTS search-bar.css ****** */
-.md-google-search__metacontainer {
- position: absolute;
- top: 10px;
- height: 48px;
- width: 100%;
- z-index: 100;
-}
-
-.md-google-search__container {
- display: block;
- margin-left: auto;
- margin-right: auto;
- height: 48px;
- width: Calc(100% - 66px);
- max-width: 720px;
- white-space: nowrap;
-}
-
-.md-google-search {
- height: 48px;
- background-color: rgba(245, 245, 245, 1);
- border: 1px solid rgba(0, 0, 0, 0);
- -webkit-border-radius: 4px;
- border-radius: 4px;
- max-width: 720px;
- position: relative;
- -webkit-transition: background-color 100ms ease-in, width 100ms ease-out;
- transition: background-color 100ms ease-in, width 100ms ease-out;
-}
-
-.md-google-search:focus-within {
- border: 1px solid rgba(0, 0, 0, 0.45);
- background-color: rgba(255, 255, 255, 1);
- -webkit-box-shadow: 0 1px 1px rgba(255, 255, 255, .5);
- box-shadow: 0 1px 1px rgba(255, 255, 255, .5);
-}
-
-.md-google-search__search-btn {
- float: left;
- background: none;
- border: none;
- opacity: .54;
- outline: none;
- padding: 0 4px;
- line-height: 0;
- color: #212121;
-}
-
-.md-google-search__search-btn svg, .md-google-search__empty-btn svg {
- padding: 7px;
- margin: 4px;
-}
-
-.md-google-search__field-container {
- height: 46px;
- padding: 0 11px;
- margin-right: 48px;
-}
-
-.md-google-search__field {
- border: none;
- font: normal 16px Roboto, sans-serif;
- height: 24px;
- outline: none;
- padding: 11px 0 11px 16px;
- width: 100%;
- background: transparent;
-}
-
-.md-google-search__empty-btn {
- position: absolute;
- right: 0;
- top: 0;
- background: none;
- border: none;
- opacity: .54;
- outline: none;
- padding: 0 4px;
- line-height: 0;
- color: #212121;
- cursor: pointer;
-}
-
-/**
- * Search Box Autocomplete
- */
-.autocomplete-container {
- z-index: 110;
- position: absolute;
- top: 60px;
- width: 100%;
-}
-
-.autocomplete-items {
- display: block;
- margin-left: auto;
- margin-right: auto;
- width: Calc(100% - 66px);
- max-width: 720px;
- background-color: white;
- color: black;
- box-shadow: 0 2px 5px 0 rgba(255, 255, 255, 0.258824), 0 2px 10px 0
- rgba(255, 255, 255, 0.156863) !important;
- max-height: 510px;
- overflow-y: auto;
-}
-
-.autocomplete-item {
- font-size: 16px;
- padding: 12px 14px;
- cursor: pointer;
-}
-
-.autocomplete-item:hover, .autocomplete-active {
- background: #eee;
-}
-
-.autocomplete-year {
- position: relative;
- z-index: 120;
-
- color: #222;
-}
-
-@media ( max-width : 700px) {
- #dialog {
- width: Calc(100% - 32px) !important;
- height: Calc(100% - 32px) !important;
- margin: 16px;
- }
- #backdrop {
- display: block;
- }
- #min-dialog {
- display: block !important;
- }
-}
diff --git a/graf.php b/graf.php
index f829007..9dcf6ee 100644
--- a/graf.php
+++ b/graf.php
@@ -24,13 +24,16 @@
<link rel="manifest" href="manifest.json">
<!-- own css stylesheets -->
- <link rel="stylesheet" href="css/styles.css">
+ <link rel="stylesheet" href="css/general.css">
+ <link rel="stylesheet" href="css/graf.css">
+ <link rel="stylesheet" href="css/dialog.css">
+ <link rel="stylesheet" href="css/option-buttons.css">
+ <link rel="stylesheet" href="css/year-list.css">
+ <link rel="stylesheet" href="css/search-bar.css">
<!-- imported css stylesheets -->
- <link rel="stylesheet"
- href="https://fonts.googleapis.com/icon?family=Material+Icons">
- <link rel="stylesheet"
- href="https://code.getmdl.io/1.3.0/material.blue_grey-blue.min.css" />
+ <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
+ <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.blue_grey-blue.min.css" />
<!-- Apple web app -->
<link rel="apple-touch-icon" href="img/graf.png">
@@ -112,8 +115,15 @@
<!-- Our scripts -->
- <script src="./js/autocomplete.js"></script>
- <script src="./js/script.js"></script>
+ <script src="js/autocomplete.js"></script>
+ <script src="js/circle-mode.js"></script>
+ <script src="js/graf.js"></script>
+ <script src="js/limit-years.js"></script>
+ <script src="js/search-bar.js"></script>
+ <script src="js/dialog.js"></script>
+ <script src="js/camera.js"></script>
+ <script src="js/just-do-it.js"></script>
+ <script src="js/init.js"></script>
<!-- imported scripts -->
<script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>
diff --git a/js/script.js b/js/script.js
deleted file mode 100644
index feeabe8..0000000
--- a/js/script.js
+++ /dev/null
@@ -1,538 +0,0 @@
-// *********** HERE STARTS circle-mode.js *************
-
-circleMode = false;
-
-function initCircleMode() {
- document.querySelector("#circle-mode").addEventListener('click', function() {
- circleMode = !circleMode;
- document.querySelector("#circle-mode i").innerText = (circleMode ? "scatter_plot" : "trip_origin");
- s.graph.nodes().forEach(function(n) {
- n.x = (circleMode ? n.circleX : n.originalX);
- n.y = (circleMode ? n.circleY : n.originalY);
- n.size = 10;
- });
-
- s.refresh();
- });
-}
-
-function isInRect(x, y, rect) {
- if (x < -10000 || x > 10000) return true;
- if (y < -10000 || y > 10000) return true;
-
- var ans = true;
- var c = crossProd(rect[0], rect[1], x, y);
-
- for (var i = 1; i < 4; i++) {
- var temp = crossProd(rect[i], rect[(i+1)%4], x, y);
- if (c*temp < 0) ans = false;
- }
- return ans;
-}
-
-function crossProd(r1, r2, x, y) {
- return r1[0]*r2[1] + r2[0]*y + x*r1[1] - r1[0]*y - r2[0]*r1[1] - x*r2[1];
-}
-// *********** HERE STARTS graf.js *************
-
-// s is the sigma graph
-// graf is the JSON graph
-var s, graf;
-
-// query dario JSON for the graph information
-function xhr(method, url, params, callback) {
- var http = new XMLHttpRequest();
- if (method == "POST") {
- http.open(method, url, true);
- } else {
- if (params != "") {
- http.open(method, url+"?"+params, true);
- } else {
- http.open(method, url, true);
- }
- }
- http.onload = function() {
- if(this.status != 200) {
- console.warn("Attention, status code "+this.status+" when loading via xhr url "+url);
- }
- callback(this.responseText, this.status);
- };
- if (method == "POST") {
- http.setRequestHeader("Content-type","application/x-www-form-urlencoded");
- http.send(params);
- } else {
- http.send();
- }
-}
-
-
-function initGraf() {
- // create new methods for sigma library
- updateSigma();
-
- // create graf, s is the sigma graf
- s = new sigma({
- renderers: [{
- container: "graf",
- type: "webgl"
- }],
- settings: {
- defaultEdgeColor: "#fff",
- edgeColor: "default",
- defaultLabelColor: "#fff",
- autoRescale: false,
- zoomMax: 30,
- // enableEdgeHovering: true,
- font: "Roboto",
- labelThreshold: 5
- }
- });
-
-
- // query for JSON for graph data
- xhr("GET", "api.php", "action=getgraf", function(responseText, status) {
- // graf is the JSON data
- graf = JSON.parse(responseText);
-
- // does graf.nodes have a size attribute?
- var rectBorrar = [[0,0], [0,0], [0,0], [0,0]];
- for (var i in graf.nodes) {
- if (graf.nodes[i].name == "Erase") rectBorrar[0] = [ graf.nodes[i].x , graf.nodes[i].y ];
- if (graf.nodes[i].name == "Borrar") rectBorrar[1] = [ graf.nodes[i].x , graf.nodes[i].y ];
- if (graf.nodes[i].name == "Esborrar") rectBorrar[2] = [ graf.nodes[i].x , graf.nodes[i].y ];
- if (graf.nodes[i].name == "Delete") rectBorrar[3] = [ graf.nodes[i].x , graf.nodes[i].y ];
- }
-
- var sizegraf = 0;
- for (var i in graf.nodes) {
- if (isInRect(graf.nodes[i].x, graf.nodes[i].y, rectBorrar)) continue;
- sizegraf++;
- }
- var nnode = 0;
- for (var i in graf.nodes) {
- var ncolor = null;
-
- if(graf.nodes[i].sex =="F") ncolor = "#d61c08";
- else if(graf.nodes[i].sex == "M") ncolor = "#0159aa";
- else ncolor = "#0ca80a";
-
- // post-processing for year corrections
- if(1970 < graf.nodes[i].year && graf.nodes[i].year < 2004) graf.nodes[i].year += 18;
-
- var newX = 5000*Math.cos( 2*Math.PI*nnode/sizegraf ) + 725;
- var newY = 5000*Math.sin( 2*Math.PI*nnode/sizegraf ) + 800;
-
- if (isInRect(graf.nodes[i].x, graf.nodes[i].y, rectBorrar) ) continue;
-
- s.graph.addNode({
- // we add color, originalColor, size, originalX..Y, circleX..Y atributes
- id: graf.nodes[i].id,
- year: graf.nodes[i].year,
- sex: graf.nodes[i].sex,
- label: graf.nodes[i].name,
- x: graf.nodes[i].x,
- y: graf.nodes[i].y,
- circleX: newX,
- circleY: newY,
- originalX: graf.nodes[i].x,
- originalY: graf.nodes[i].y,
- size: 10,
- color: ncolor,
- originalColor: ncolor
- });
- nnode++;
-
- }
-
- for (var i in graf.edges) {
- if (isInRect(graf.nodes[graf.edges[i].a].x, graf.nodes[graf.edges[i].a].y, rectBorrar)) continue;
- if (isInRect(graf.nodes[graf.edges[i].b].x, graf.nodes[graf.edges[i].b].y, rectBorrar)) continue;
-
- s.graph.addEdge({
- id: i,
- source: graf.edges[i].a,
- target: graf.edges[i].b,
- size: Math.min(4, Math.max((7/(2*Math.pow(20, 2)))*Math.pow(graf.edges[i].votes, 2) + 1/2, 0.5))
- });
-
- }
-
- s.bind('clickNode', function(e) {
- var nodeId = e.data.node.id,
- toKeep = s.graph.neighbors(nodeId);
- // toKeep[nodeId] = e.data.node;
-
-
- s.graph.nodes().forEach(function(n) {
- if (toKeep[n.id] || n.id == nodeId) {
- n.color = n.originalColor;
- } else {
- n.color = '#333';
- }
- });
-
- s.graph.edges().forEach(function(e) {
- if ((e.source == nodeId || e.target == nodeId) && (toKeep[e.source] || toKeep[e.target])) {
- e.color = '#fff';
- } else {
- e.color = '#333';
- }
- });
-
- if (circleMode) {
- s.graph.nodes().forEach(function (n) {
- n.x = n.circleX;
- n.y = n.circleY;
- n.size = 10;
- });
-
- e.data.node.x = 0;
- e.data.node.y = 0;
- e.data.node.size = 30;
- }
-
- s.refresh();
-
- dialog.show(nodeId, toKeep);
- });
-
- initDialog();
- initCamera();
- initSearchBar();
-
- s.refresh();
- autocomplete(document.querySelector("#search-input"), graf.nodes, "search", rectBorrar);
- });
-}
-
-function updateSigma() {
- // returns set of neighouts
- sigma.classes.graph.addMethod("neighbors", function(nodeId) {
- var k,
- neighbors = {},
- index = this.allNeighborsIndex[nodeId] || [];
-
- for (k in index) {
- neighbors[k] = this.nodesIndex[k];
- }
-
- return neighbors;
- });
-
- // returns number of neighbours from a set of years
- sigma.classes.graph.addMethod("numNeighborsFromYears", function(nodeId, showYearsCopy) {
- var k,
- neighbors = 0,
- index = this.allNeighborsIndex[nodeId] || [];
-
- for (k in index) {
- if(this.nodesIndex){
- if (showYearsCopy.has("" + this.nodesIndex[k].year)) neighbors++;
- else if (this.nodesIndex[k].year == 0) neighbors++;
- }
- }
-
- return neighbors;
- });
-}
-// *********** HERE STARTS limit-years.js *************
-
-var limitYears = false;
-var showYears = new Set();
-
-function repaint() {
- //targetYear: graf.nodes[e.source].year,
- if(limitYears) {
- var added = new Set();
-
- s.graph.nodes().forEach(function(n) {
- var numNeig = s.graph.numNeighborsFromYears(n.id, showYears);
-
- if ((n.year == 0 && (n.sex == 'F' || n.sex == 'M') )
- || numNeig == 0
- || (!showYears.has("" + n.year) && (n.year != 0) )) {
- n.hidden = true;
- }
- else {
- n.hidden = false;
- added.add(n.id);
- }
- });
-
- s.graph.edges().forEach(function(e) {
- if(!added.has(e.source) && !added.has(e.target)){
- e.hidden = true;
- }
- else e.hidden = false;
- });
- }
- else {
- s.graph.nodes().forEach(function(n) {
- n.hidden = false;
- });
-
- s.graph.edges().forEach(function(e) {
- e.hidden = false;
- });
- }
-}
-
-function altYearList() {
- var yearlist = document.querySelector("#year-list");
-
- if(yearlist.style.display == "none"){
- yearlist.style.display = "block";
- document.querySelector("#settings i").innerText = "close";
- yearLimits = true;
- }
- else{
- yearlist.style.display = "none";
- document.querySelector("#settings i").innerText = "settings";
- yearLimits = true;
- }
-}
-
-function first_day(year) {
- start_course = new Date(year + '-09-12');
- return start_course;
-}
-
-function addYearList() {
- var ylistspan = document.querySelector("#year-list-span")
- var year = 2007;
- var today = new Date();
- while (first_day(year) < today) {
- var lab = document.createElement("label");
- lab.setAttribute("class", "mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect custom-checkbox");
- lab.setAttribute("for", "checkbox-"+year);
- var yin = document.createElement("input");
- yin.type = "checkbox";
- yin.setAttribute("class", "mdl-checkbox__input");
- yin.name = year;
- yin.id = "checkbox-"+year;
- yin.addEventListener("change", function() {
- limitYears = true;
-
- if(this.checked) {
- showYears.add(this.name);
- } else {
- showYears.delete(this.name);
- }
-
- if (showYears.size == 0) limitYears = false;
-
- repaint();
-
- s.refresh();
- });
-
- var span = document.createElement("span");
- span.innerText = year;
- span.setAttribute("class", "mdl-checkbox__label");
-
- lab.appendChild(yin);
- lab.appendChild(span);
- ylistspan.appendChild(lab);
- ylistspan.insertAdjacentHTML("beforeend", "<br>");
- ++year;
- }
-
- document.querySelector("#settings").addEventListener("click", altYearList);
-}
-// *********** HERE STARTS search-bar.js *************
-
-function altSearchBar() {
- if (document.querySelector(".md-google-search__metacontainer").style.display == "none") {
- document.querySelector(".md-google-search__metacontainer").style.display = "block";
- document.querySelector("#search i").innerText = "fullscreen";
- document.querySelector("#search-input").focus();
- } else {
- document.querySelector(".md-google-search__metacontainer").style.display = "none";
- document.querySelector(".autocomplete-container").style.display = "none";
- document.querySelector("#search i").innerText = "search";
- }
-}
-
-function initSearchBar() {
- document.querySelector("#search").addEventListener("click", altSearchBar);
- if (window.innerWidth > 700) altSearchBar();
-}
-// *********** HERE STARTS dialog.js *************
-
-var dialog = {
- fill: function(data, text, html=false) {
- var el = document.querySelectorAll("*[data-fill=\""+data+"\"]");
- for (var i in el) {
- if (html === true) {
- el[i].innerHTML = text;
- } else {
- el[i].innerText = text;
- }
- }
- },
- show: function(id, neighbors) {
- var neighbors = Object.values(neighbors);
-
- this.fill("name", graf.nodes[id].name);
- this.fill("year", graf.nodes[id].year);
- this.fill("sex", graf.nodes[id].sex);
- this.fill("id", "#"+id);
- this.fill("n-edges", neighbors.length);
-
- var list = "";
- neighbors.forEach(function (a) {
- list += "<li><b>"+graf.nodes[id].name+" - "+a.label+":</b> "+(graf.edges[id+"_"+a.id] ? graf.edges[id+"_"+a.id].votes : graf.edges[a.id+"_"+id].votes)+" vots</li>";
- });
- this.fill("edges", list, true);
-
- if (window.innerWidth > 700) {
- document.querySelector("#dialog").style.display = "block";
- document.querySelector("#backdrop-container").style.display = "block";
- } else {
- document.querySelector("#summary-dialog").style.display = "block";
- }
- },
- close: function() {
- document.querySelector("#dialog").style.display = "none";
- document.querySelector("#summary-dialog").style.display = "none";
- document.querySelector("#backdrop-container").style.display = "none";
-
- s.graph.nodes().forEach(function(n) {
- n.color = n.originalColor;
- });
-
- s.graph.edges().forEach(function(e) {
- e.color = e.originalColor;
- });
-
- if(circleMode) {
- s.graph.nodes().forEach(function (n) {
- n.x = n.circleX;
- n.y = n.circleY;
- n.size = 10;
- });
- }
- else {
- s.graph.nodes().forEach(function (n) {
- n.x = n.originalX;
- n.y = n.originalY;
- n.size = 10;
- });
- }
- s.refresh();
-
- },
- max: function() {
- document.querySelector("#summary-dialog").style.display = "none";
- document.querySelector("#dialog").style.display = "block";
- },
- min: function() {
- document.querySelector("#dialog").style.display = "none";
- document.querySelector("#summary-dialog").style.display = "block";
- }
-};
-
-
-function initDialog() {
- document.querySelector("#quit-dialog").addEventListener("click", dialog.close);
- document.querySelector("#quit2-dialog").addEventListener("click", dialog.close);
- document.querySelector("#max-dialog").addEventListener("click", dialog.max);
- document.querySelector("#min-dialog").addEventListener("click", dialog.min);
-}
-// *********** HERE STARTS camera.js *************
-
-function cameraGoto(nodeX, nodeY) {
- sigma.misc.animation.camera( s.camera,
- { x: nodeX, y: nodeY, ratio: 1 },
- { duration: s.settings('animationsTime') || 300 }
- );
-}
-
-function is_touch_device() {
- var prefixes = ' -webkit- -moz- -o- -ms- '.split(' ');
- var mq = function(query) {
- return window.matchMedia(query).matches;
- }
-
- if (('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch) {
- return true;
- }
-
- // include the 'heartz' as a way to have a non matching MQ to help terminate the join
- // https://git.io/vznFH
- var query = ['(', prefixes.join('touch-enabled),('), 'heartz', ')'].join('');
- return mq(query);
-}
-
-function initCamera() {
- if(!is_touch_device()) {
- document.querySelector("#zoomin").addEventListener("click", function() {
- s.camera.goTo({
- ratio: Math.max(s.camera.settings("zoomMin"), s.camera.ratio / Math.sqrt(2))
- });
- });
-
- document.querySelector("#zoomout").addEventListener("click", function() {
- s.camera.goTo({
- ratio: Math.min(s.camera.settings("zoomMax"), s.camera.ratio * Math.sqrt(2))
- });
- });
- } else {
- document.querySelector("#zoomin").style.display = "none";
- document.querySelector("#zoomout").style.display = "none";
-
- document.querySelector("#circle-mode").style.bottom = "110px";
- document.querySelector("#settings").style.bottom = "60px";
- document.querySelector("#search").style.bottom = "10px";
- }
-}
-// *********** HERE STARTS just-do-it.js *************
-
-var seq = [38, 38, 40, 40, 37, 39, 37, 39, 65, 66, 13];
-var cur = 0;
-
-function justdoit() {
- s.graph.nodes().forEach(function(n) {
- switch(n.color) {
- case "#d61c08":
- n.color = "#0159aa";
- break;
-
- case "#0159aa":
- n.color = "#0ca80a";
- break;
-
- case "#0ca80a":
- n.color = "#d61c08";
- break;
- }
- });
-
- s.refresh();
- setTimeout(justdoit, 333);
-}
-
-
-function initJustDoIt() {
- document.addEventListener("keydown", function(event) {
- if (event.key == "f" && event.target.getAttribute("id") != "search-input") altSearchBar();
- if (event.which == seq[cur]) {
- if (cur < seq.length) {
- ++cur;
- if (cur == seq.length) {
- justdoit();
- }
- }
- } else cur = 0;
- });
-}
-// *********** HERE STARTS init.js *************
-
-function init() {
- initGraf();
- addYearList();
- initCircleMode();
- initJustDoIt();
-}
-
-window.addEventListener("load", init);