Skip to content

Add code formate #13

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Add code formate #13

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
166 changes: 88 additions & 78 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,8 @@ <h1 class="display-3">Graph Language Analyzer</h1>
<div class="col-12">
<div class="alert alert-primary" role="alert">
<h5><b>Instruction:</b></h5>
<p>Enter some text below to make a graph of language. When you click on "Click to Analyze!" your text will be automatically cleared form any special chars. If you want analyze text with special chars or language like morse alphabet choose second option.</p>
<p>Enter some text below to make a graph of language. When you click on "Click to Analyze!" your text will be automatically cleared form any special chars. If you want analyze text with special chars or language like morse alphabet choose
second option.</p>
</div>
</div>
<div class="col-12">
Expand Down Expand Up @@ -55,39 +56,36 @@ <h5><b>Legend:</b></h5>
<img src="assets/img/start.png" class="height-50"> - a start point, which connects all first letters of words,<br>
<img src="assets/img/begin.png" class="height-50 width-36"> - first letter of word,<br>
<img src="assets/img/node.png" class="height-50 width-36"> - letter of the word on which word can't end,<br>
<img src="assets/img/end.png" class="height-50 width-36"> - letter of the word where reading can end. When it's connected to start it means that your grammar has single chars also. In short it can start and end on that node in some cases.<br>
<img src="assets/img/end.png" class="height-50 width-36"> - letter of the word where reading can end. When it's connected to start it means that your grammar has single chars also. In short it can start and end on that node in some
cases.
<br>
</div>
</div>
</div>
</div>

<script type="text/javascript" src="assets/js/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
<script type="text/javascript" src="assets/js/cytoscape.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/cytoscape-cose-bilkent@4.0.0/cytoscape-cose-bilkent.min.js"></script>

<script sync>
function onlyUnique(value, index, self) {
return self.indexOf(value) === index;
}

function cleanInput(text){ //--- Cleanse Input Data
function cleanInput(text) { //--- Cleanse Input Data
text = text.replace(/[&\/\\#,+()$~%.'":|!@;*?<>{}\-\.]/g, '').toLowerCase();
text = text.replace(/\ {2,}/g, " ");
text = text.replace(/\n/g, " ");
return text;
}

function generateGraph(cy, text){
function generateGraph(cy, text) {
var data = text.split(" ");
data.forEach(function (word, index, arr) {
data.forEach(function(word, index, arr) {
if (word === "" || word == " ")
arr.splice(index, 1);
});

data = data.filter(onlyUnique);

data.forEach(function (word, index, arr) {
data.forEach(function(word, index, arr) {
arr[index] = word.split('')
});

Expand Down Expand Up @@ -115,26 +113,26 @@ <h5><b>Legend:</b></h5>
}
})

data.forEach(function (word, index, arr) {
data.forEach(function(word, index, arr) {
previousRepeat = true;
filtering_saves = new Array();

word.forEach(function (letter, l_index, letters) {
if(l_index > 0)
var filtered = cy.$('node[tag = "' + letter + '"][l_index = ' + l_index + '][start = "' + letters[0] + '"][left = "' + letters[l_index-1] + '"]')
else
word.forEach(function(letter, l_index, letters) {
if (l_index > 0)
var filtered = cy.$('node[tag = "' + letter + '"][l_index = ' + l_index + '][start = "' + letters[0] + '"][left = "' + letters[l_index - 1] + '"]')
else
var filtered = cy.$('node[tag = "' + letter + '"][l_index = ' + l_index + '][start = "' + letters[0] + '"]')

var filtering_saves_new = new Array();
var end = new Boolean;
//console.log("How long: " + letters.length + " " + l_index);
l_index == letters.length - 1 ? end = 1 : end = 0;
//console.log("END:" + end)

//Checking if searched node exist and adding nodes to searched
if (filtered[0] != undefined && l_index != 0 && previousRepeat) {

filtered.forEach(function (element, i, collected) {
filtered.forEach(function(element, i, collected) {
filtering_saves_new.push(element);
//console.log(element.data('id') + " " + element.data('index'));
});
Expand All @@ -157,34 +155,34 @@ <h5><b>Legend:</b></h5>
//console.log("Data:" ,filtering_saves_new, filtering_saves)

//Edge value incrementation
var inc_edge = cy.edges('[id = "'+
filtering_saves[0].data('tag') +
"_" + letter +
"_" + filtering_saves_new[0].data('index') +
"_" + l_index +
'"]');

if(inc_edge[0] != undefined) {
var inc_edge = cy.edges('[id = "' +
filtering_saves[0].data('tag') +
"_" + letter +
"_" + filtering_saves_new[0].data('index') +
"_" + l_index +
'"]');

if (inc_edge[0] != undefined) {
var data_value = inc_edge[0].data('tag');
inc_edge[0].data('tag', data_value+1);
inc_edge[0].data('tag', data_value + 1);

}
//console.log(inc_edge);

filtering_saves = filtering_saves_new;

} else if (filtered[0] != undefined && l_index == 0 && previousRepeat) {
filtered.forEach(function (element, i, collected) {
filtered.forEach(function(element, i, collected) {
filtering_saves_new.push(element);
});
filtering_saves = filtering_saves_new;


//Edge value incrementation
var inc_edge = cy.edges('[id = "'+ letter +'_start"]');
var inc_edge = cy.edges('[id = "' + letter + '_start"]');
var data_value = inc_edge[0].data('tag');
inc_edge[0].data('tag', data_value+1);
inc_edge[0].data('tag', data_value + 1);

//console.log(inc_edge);

} else {
Expand All @@ -200,7 +198,7 @@ <h5><b>Legend:</b></h5>
previous.l_index = filtering_saves[0].data('l_index')
previous.index = filtering_saves[0].data('index')
previous.check = check
//console.log("Previous", previous)
//console.log("Previous", previous)

if (end == 1) filtering_saves[0].data('end', 1);

Expand All @@ -221,9 +219,9 @@ <h5><b>Legend:</b></h5>
}
});
if (l_index > 0) {

//console.log("Edge: ", previous, { letter, l_index, index, check })

cy.add({
group: 'edges',
data: {
Expand All @@ -240,7 +238,7 @@ <h5><b>Legend:</b></h5>
search: 0
}
});

} else if (l_index == 0) {

cy.add({
Expand All @@ -258,49 +256,54 @@ <h5><b>Legend:</b></h5>
});
}

previous = { letter, l_index, index, check };

previous = {
letter,
l_index,
index,
check
};

}
});
});

cy.layout({
//name: 'cose'
name: 'cose-bilkent'
//name: 'grid'
//name: 'breadthfirst', avoidOverlap: true,
//name: 'concentric'
//name: 'random'
//name: 'grid'
//name: 'breadthfirst', avoidOverlap: true,
//name: 'concentric'
//name: 'random'
}).run();

}

function searchSubGraphSylabs(cy, text){
if(text.length > 0)
function searchSubGraphSylabs(cy, text) {
if (text.length > 0)
var serached = cy.nodes('[tag = "' + text[0] + '"]');
//console.log(serached);
serached.forEach( function(ele, i, eles){
second = ele.neighborhood('[tag = "' + text[1] + '"][left = "' + text[0] + '"][l_index = ' + (ele.data('l_index') + 1 )+ ']');
//console.log(second);
if(second.length > 0){
second.forEach( function(ele1, i1, eles1){
console.log(ele, ele1);

//Changing first and second element
ele.data('search', 1);
ele1.data('search', 1);

search_edge = ele.edgesWith(ele1);
search_edge.data('search', 1);

//console.log(search_edge);
});
}
});
//console.log(serached);
serached.forEach(function(ele, i, eles) {
second = ele.neighborhood('[tag = "' + text[1] + '"][left = "' + text[0] + '"][l_index = ' + (ele.data('l_index') + 1) + ']');
//console.log(second);
if (second.length > 0) {
second.forEach(function(ele1, i1, eles1) {

console.log(ele, ele1);

//Changing first and second element
ele.data('search', 1);
ele1.data('search', 1);

search_edge = ele.edgesWith(ele1);
search_edge.data('search', 1);

//console.log(search_edge);
});
}
});
}

$(function () {
$(function() {
var cy = cytoscape({
container: document.getElementById('cy'),
wheelSensitivity: 1,
Expand Down Expand Up @@ -358,13 +361,13 @@ <h5><b>Legend:</b></h5>

//cy.layout({name: 'cose'}).run();

$("form").submit(function (e) {
$("form").submit(function(e) {
e.preventDefault();
});

$("#analyzeIt").on("click", function () {
$("#analyzeIt").on("click", function() {
var text = $("#toAnalyze").val();

//--- Cleaning Data
text = cleanInput(text);
generateGraph(cy, text);
Expand All @@ -374,16 +377,16 @@ <h5><b>Legend:</b></h5>
//searchSubGraphSylabs(cy, searchFor);
});

$("#analyzeCrap").on("click", function () {
$("#analyzeCrap").on("click", function() {
var text = $("#toAnalyze").val();

//--- Cleaning Data
generateGraph(cy, text);
});

$("#analyzeEnteredSylabs").on("click", function () {
$("#analyzeEnteredSylabs").on("click", function() {
var text = $("#analyzeSylabsTextbox").val();

//----------------------------------------START Refreshing to fecator
var ref = $("#toAnalyze").val();
//--- Cleaning Data
Expand All @@ -396,9 +399,9 @@ <h5><b>Legend:</b></h5>
searchSubGraphSylabs(cy, searchFor);
});

$("#analyzeEnteredSylabsSpecial").on("click", function () {
$("#analyzeEnteredSylabsSpecial").on("click", function() {
var text = $("#analyzeSylabsTextbox").val();

//----------------------------------------START Refreshing to fecator
var ref = $("#toAnalyze").val();
generateGraph(cy, ref);
Expand All @@ -409,16 +412,23 @@ <h5><b>Legend:</b></h5>
searchSubGraphSylabs(cy, searchFor);
});

cy.on('tap', function(event){
cy.on('tap', function(event) {
// target holds a reference to the originator
// of the event (core or element)
var evtTarget = event.target;
console.log("Clicked:", evtTarget);

});

});
</script>
<script type="text/javascript" src="assets/js/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
<script type="text/javascript" src="assets/js/cytoscape.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/cytoscape-cose-bilkent@4.0.0/cytoscape-cose-bilkent.min.js"></script>
<script type="text/javascript" scr="/assets/js/bootstrap.bundle.min.js"></script>
<script type="text/javascript" src="assets/js/bootstrap.bundle.min.js.map"></script>
<script type="text/javascript" src="/assets/js/bootstrap.min.js.map"></script>
</body>

</html>