I'm working on a art project about poetry, writing processes and A.I (you can see the ongoing tests here http://82.223.18.239/writing3.php) and I would like to implement a thing I saw on some other website, for exemple here constantdullaart.com/
For exemple I have now : http://82.223.18.239/writing3.php (this is a temporary URL) and I would like to expend the writing to the url box (The after domain part of course). A short looped text could be constantly writen there, or a serie of symbols like on Dullaart website.
I know it can sound technically messy and not elegant at all but, still do you have any idea how to do it ?
Here's our actual code
<head>
<div id="header"></div>
<div id="body"></div>
<div id="footer"></div>
<script type = "text/javascript" src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<style type="text/css">
#myTable{
width:"90%";
height:"100%";
overflow:hidden;
min-width:250px;
white-space: pre-wrap;
word-wrap:break-word;
position:absolute;
border:solid 0px;
top:-500px;
left:320px;
right:320px;
bottom:0px;
font-size:100px;
font-family:"Times New Roman", Times, serif;
text-align:left
}
#body{
height:"100%";
overflow:auto;
min-width:250px;
}
::-webkit-scrollbar {display: none;}
</style>
</head>
<body>
<div id="myTable"> <div>
<script type="text/javascript">
var skip = 0;
function get_data(index) {
$.ajax({
url : 'getData.php',
type : 'POST',
data: ({"skip":skip}),
success : function(data) {
if(data && data.trim()!='') {
skip = skip+1;
showText("#myTable", data, 0, 20);
}
else {
setTimeout(function () { get_data(skip); }, 30000);
}
},
error : function(request,error)
{
alert("Request error : "+JSON.stringify(request));
}
});
}
function showText(target, message, index, interval) {
if (index < message.length) {
$(target).append(message[index++]);
setTimeout(function () { showText(target, message, index, interval); }, interval);
$('#myTable').css('overflow', 'hidden').bind('DOMNodeInserted', function () {
this.scrollTop = this.scrollHeight;
});
}
else {
get_data(skip);
$('#myTable').css('overflow', 'scroll')
}
}
//var period = 10000; //NOTE: period is passed in milliseconds
get_data(skip);
//setInterval(page_refresh, period);
</script>
</body>
This whole function and piece of code can be found in the page source. In Google chrome or your favorite web browser right click and select "view page source". You will find this function which does what you want:
<SCRIPT LANGUAGE="JavaScript">
var message = new Array();
message[0] = ""
var reps = 2;
var speed = 666;
var p = message.length;
var T = "";
var C = 0;
var mC = 0;
var s = 0;
var sT = null;
if (reps < 1) reps = 1;
function doIt() {
T = message[mC];
A();
}
function A() {
s++;
if (s > 8) { s = 1;}
if (s == 1) { document.title = 'βπ»ββπΌββπ½ββπΎββπΏββπ»ββπΌβββπ»ββπΌββπ½ββπΎ'+T+'βπ»ββπΌββπ½ββπΎββπΏββπ»ββπΌββπ½ββπΎββ'; }
if (s == 2) { document.title = 'β οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ '+T+'β οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈβ οΈ'; }
if (s == 3) { document.title = 'πππππππππππππππππππππ'+T+'βπ»ββπΌββπ½ββπΎββπΏββπ»ββπΌββ'; }
if (s == 4) { document.title = 'βπ»ββπΌββπ½ββπΎββπΏββπ»ββπΌββπ½ββπΎββ'+T+'ββββββββββββββββββββ'; }
if (s == 5) { document.title = 'πππππππππππππππππππ'+T+'π π π π π π π π π π π π π π π π π π π π '; }
if (s == 6) { document.title = 'π£π£π£π£π£π£π£π£π£π£π£π£π£π£π£π£π£π£π£π£'+T+'πππΏπππΌππΎππΌππΏπππΌππΎπππΏπππΌππΎππΌ'; }
if (s == 7) { document.title = 'ππππππππππππππππππ'+T+'ππππππππππππππππππ'; }
if (s == 8) { document.title = 'βπ»ββπΌββπ½ββπΎββπΏββπ»ββπΌββπ½ββπΎββπΏ'+T+'β³β³β³β³β³β³β³β³β³β³β³β³β³β³β³β³β³β³β³β³β³'; }if (C < (8 * reps)) {
sT = setTimeout("A()", speed);
C++;
}
else {
C = 0;
s = 0;
mC++;
if(mC > p - 1) mC = 0;
sT = null;
doIt();
}
}
doIt();
(function() {
var template = 'ββββββ βββββ³ββ ββββ³β βββββπ£βπΎ'.split(''),
len = template.length,
chars, string, i, j, k,
pushOrHash = typeof window.history.pushState === 'function',
increase = function(n) {
return n < len - 1 ? n + 1 : 0;
},
update = function() {
chars = [];
j = k;
for (i=0; i<len; i++) {
j = increase(j);
chars[i] = template[j];
}
string = ['/', chars.join(''), '/'].join('');
k = increase(k);
if (pushOrHash) {
window.history.pushState(null, null, string);
} else {
window.document.location.hash = string;
}
setTimeout(update, 1000);
};
update();
})();
</script>
<script type="text/javascript">
function pageLoad()
{
alert('The image of external things possesses for us the ambiguous dimension that in external nature everything can be considered to be connected, but also as separated. The uninterrupted transformations of materials as well as energies brings everything into relationship with everything else and make one cosmos out of all the individual elements. On the other hand, however, the objects remain banished in the merciless separation of space; no particle of matter can share its space with another and a real unity of the diverse does not exist in spatial terms. And, by virtue of this equal demand on self-excluding concepts, natural existence seems to resist any application of them at all. Only to humanity, in contrast to nature, has the right to connect and separate been granted, and in the distinctive manner that one of these activities is always the presupposition of the other. By choosing two items from the undisturbed store of natural things in order to designate them as -separate-, we have already related them to one another in our consciousness, we have emphasized these two together against whatever lies between them. And conversely, we can only sense those things to be related which we have previously somehow isolated from one another; things must first be separated from one another in order to be together. Practically as well as logically, it would be meaningless to connect that which was not separated, and indeed that which also remains separated in some sense. The formula according to which both types of activity come together in human undertakings, whether the connectedness or the separation is felt to be what was naturally ordained and the respective alternative is felt to be our task, is something which can guide all our activity. In the immediate as well as the symbolic sense, in the physical as well as the intellectual sense, we are at any moment those who separate the connected or connect the separate. Georg Simmel from -Bridges and Doors- 1909ΜΏ');
}
pageLoad();
</script>
I think that I will build chrome extensions to count down.
In case of the present code, if popup.html is closed, processing will be completed compulsorily.
In this case, is it better to write setInterval to background.js?
Moreover, I want you to teach whether what I should do concrete.
background.js
var num = window.localStorage.setItem("minite_num", 20);
default_count = num*60;
function count_start() {
count = default_count;
chrome.browserAction.setIcon({
path: {
"19": "img/icon_count19.png",
"38": "img/icon_count38.png"
}
});
}
function count_down() {
count--;
if (count <= 0) {
page_change();
count_stop();
}
}
popup.js
var bg = chrome.extension.getBackgroundPage();
var num = bg.num;
var start_btn = document.count_timer.start_btn;
var count_time = document.getElementById("counter");
document.addEventListener('DOMContentLoaded', function () {
load();
start_btn.addEventListener('click', start_display);
});
function timer_reset() {
timerID = 0;
}
function count_format(num) {
var tm,ts;
tm = Math.floor(num / 60); //ε
ts = num % 60; //η§
if (ts < 10) ts = "0" + ts;
return tm + ":" + ts;
}
function load(){
display_num = bg.count_format(bg.default_count);
bg.timer_reset();
start_btn.disabled = false;
count_time.innerHTML = display_num;
}
function start_display() {
start_btn.disabled = true;
bg.count_start();
timerID = setInterval(function() {bg.count_down();count_time.innerHTML = bg.count;}, 1000);
}
popup.html
<form name="count_timer" class="count_timer">
<div id="counter" class="counter"></div>
<input type="button" name="start_btn" value="START">
</form>
Thanks.
use chrome storage / localStorage to remember your target time.
Use an interval from the popup to update your calculations. First time, the popup needs to read from storage and determine where the countdown is at.
Nothing needs to be done from background, unless you want to separate logic (as in MVC), then maybe do all storage stuff from background, and ask for it with messaging.
I have a published open-source chrome extension (plus for trello) with a count(up) timer feature that does something similar.
I have found the following code and I was wondering how can I repeat this code 9 times before changing the newPage. What i am doing right now is making 10 html documents and i change newPage to page2.html, page3.html ,page4.html so after the count done it changes and eventually cycles through all these html documents. I want to keep it to only 2 documents. index.html with this code and end.html. index ill perform this code 9 times then change to end.html. Can anyone help?
var startTime = 45;
var newPage = "page2.html";
function countDown() {
startTime--;
document.getElementById("counter_display").innerHTML = startTime;
if (startTime == 0) {
window.location = newPage;
}
}
function gett(id) {
if (document.getElementById) {
return document.getElementById(id);
}
if (document.all) {
return document.all.id;
}
if (document.layers) {
return document.layers.id;
}
if (window.opera) {
return window.opera.id;
}
}
function watchNow() {
if (gett('counter_display')) {
setInterval(countDown, 1000);
gett("counter_display").innerHTML = startTime;
} else {
setTimeout(watchNow, 50);
}
}
document.onload = watchNow();
<p><b id="counter_display"></b></p>
<iframe frameborder="no" height="735" src="http://website.com/video.php" width="385"></iframe>
If you were loading the contents of the other pages with AJAX into the current page in a frame then you could replace the last line with:
document.onload = function () {
for (var i= 1; i < 10; i++) {
newPage = "page"+i+".html";
watchNow();
}
}
But as to how you do the first bit, I'll need more information about what the overal pages does etc.
I am using javascript to cycle through an array of urls within an iframe and so far when the prev or next buttons are pressed it jumps to the first var in the array and both prev and next functions end. Any ideas?
<iframe id="myFrame" src="http://startpage.com" width="484px" height = "424px"></iframe>
<button onclick = "prevPage(); ">Prev</button>
<button onclick = "nextPage(); ">Next</button>
<script>
var sites=new Array();
sites[0]="http://site1.html";
sites[1]="http://site2.html";
sites[2]="http://site3.html";
sites[3]="http://site4.html";
function nextPage() {
var number = document.getElementById("myFrame").src;
number = number.substring(number.length - 4 ,number.length-3);
number = parseInt(number) + 1;
document.getElementById("myFrame").src=sites[0];
}
function prevPage() {
var number = document.getElementById("myFrame").src;
number = number.substring(number.length - 3 ,number.length-4);
number = parseInt(number) - 1;
document.getElementById("myFrame").src=sites[0];
}
</script>
Why are you using the URL as your 'position' storage? It'd be FAR easier to just use a variable:
var curPos = 0;
function nextPage() {
curPos++;
if (curPos >= sites.length) {
curPos = 0;
}
document.getElementById('myframe').src = sites[curPos];
}
function prevPage() {
curPos--;
if (curPos < 0) {
curPos = sites.length - 1;
}
document.getElementById('myframe'.).src = sites[curPos];
}
If I understood your problem correctly I think all you need to do is use document.getElementById("myFrame").src=sites[number]; instead of document.getElementById("myFrame").src=sites[0];
May be
document.getElementById("myFrame").src=sites[number-1];
is what you are trying to do in both functions.
<script language="JavaScript" type="text/javascript">
var theBar = createProgressBar(document.getElementById('progress-bar'));
var value;
function resetValue() {
value = 0;
}
function showProgress() {
value += 1;
theBar.setValue(value);
if (value < 100) {
window.setTimeout(showProgress, 100);
}
if (value = 100) {
window.location = 'http://google.com';
}
}
window.onload=resetValue();showProgress();
</script>
I'm trying to redirect after the timer reaches 10 sec, but what I tried doesn`t seem to work (redirects instantly).
not familiar with JS one bit, tried my best to mimick
= means assignment
if (value == 100) { ...