-
Posts
108 -
Joined
Everything posted by eaglehopes
-
How can I pass class object to onclick function ?
eaglehopes replied to eaglehopes's topic in Javascript Help
Please forgive my impatience 🙏 . I am asking the question and not leaving it there, I am continuing to solve it and when I found a working solution or I am close to solve it or I understand my mistake, I am writing here. 😇 -
How can I pass class object to onclick function ?
eaglehopes replied to eaglehopes's topic in Javascript Help
I must also add the select function to complete solution how can I "pass the class object"(i.e. more correctly "find" the event source/ sender object among other class instances ) : function select() { //alternative function to find which checkbox is selected and its object var source = window.event.target || window.event.srcElement ; for (let i = 0; i<nodesArray.length ; i++ ) { let ne = nodesArray[i]; // node element if(ne.cbox === source ) { ne.setSelect(ne.cbox.checked); // I defined a setSelect in class object too... console.log("node " +ne.no +" selected : ?"+ne.isSelected() ); } } } Then I can reach the class object. I could not find the way to pass it directly. -
How can I pass class object to onclick function ?
eaglehopes replied to eaglehopes's topic in Javascript Help
I found a partial solution by using static function and pointing to this class's static function : class NodeElement { no; x; y; tre; tdno; tdx; tdy; cbox; nodesArray; nodesTable; selected; constructor( x, y,nodesArray, nodesTable) { nodeCounter++; this.no = nodeCounter; this.x = x; this.y = y; this.nodesArray = nodesArray; this.nodesTable = nodesTable; //create elements this.tre = document.createElement("tr"); this.tre.id = "row"+this.no; this.tdno = document.createElement("td"); this.tdno.id = this.no; //get node number from session node array this.tdno.innerHTML = this.no; this.cbox = document.createElement("input"); this.cbox.type="checkbox"; this.cbox.id="cbox"+this.no; this.cbox.value=this.no; this.cbox.name="cbox"+this.no; // INSTEAD OF THIS ONE -> this.cbox.setAttribute('onclick','select()'); I USED BELOW ONE AND static FUNCTION I DEFINED BELOW this.cbox.setAttribute('onclick','NodeElement.selecting()'); this.tdx = document.createElement("td"); this.tdx.id="tdx"+this.no; this.tdx.innerHTML = this.x; this.tdy = document.createElement("td"); this.tdx.id="tdy"+this.no; this.tdy.innerHTML = this.y; } static selecting() { var source = window.event.target || window.event.srcElement ; if(source.checked) { console.log("selected..."); } else { console.log("un selected..."); } } } I found my mistake and solved the problem : static code did not solve my problem since I could not pass an instance of class there, since it is a static. My error was that, I was using the single quote since in https://www.codegrepper.com/code-examples/javascript/setattribute+onclick the sample code is like that for setting attribute for onclick event. However, when I changed singlequote to double quote I did what I want : Here is the working code : class NodeElement { no; x; y; tre; tdno; tdx; tdy; cbox; nodesArray; nodesTable; selected; constructor( x, y,nodesArray, nodesTable) { nodeCounter++; this.no = nodeCounter; this.x = x; this.y = y; this.nodesArray = nodesArray; this.nodesTable = nodesTable; //create elements this.tre = document.createElement("tr"); this.tre.id = "row"+this.no; this.tdno = document.createElement("td"); this.tdno.id = this.no; //get node number from session node array this.tdno.innerHTML = this.no; this.cbox = document.createElement("input"); this.cbox.type="checkbox"; this.cbox.id="cbox"+this.no; this.cbox.value=this.no; this.cbox.name="cbox"+this.no; // THIS PIECE OF CODE IS NOT WORKING FOR ME -> this.cbox.setAttribute('onclick','select()'); BELOW CODE WORKS LIKE A CHARM this.cbox.setAttribute("onclick","select()"); this.tdx = document.createElement("td"); this.tdx.id="tdx"+this.no; this.tdx.innerHTML = this.x; this.tdy = document.createElement("td"); this.tdx.id="tdy"+this.no; this.tdy.innerHTML = this.y; } } -
How can I pass class object to onclick function ?
eaglehopes replied to eaglehopes's topic in Javascript Help
I found a partial solution by using static function and pointing to this class's static function : class NodeElement { no; x; y; tre; tdno; tdx; tdy; cbox; nodesArray; nodesTable; selected; constructor( x, y,nodesArray, nodesTable) { nodeCounter++; this.no = nodeCounter; this.x = x; this.y = y; this.nodesArray = nodesArray; this.nodesTable = nodesTable; //create elements this.tre = document.createElement("tr"); this.tre.id = "row"+this.no; this.tdno = document.createElement("td"); this.tdno.id = this.no; //get node number from session node array this.tdno.innerHTML = this.no; this.cbox = document.createElement("input"); this.cbox.type="checkbox"; this.cbox.id="cbox"+this.no; this.cbox.value=this.no; this.cbox.name="cbox"+this.no; // INSTEAD OF THIS ONE -> this.cbox.setAttribute('onclick','select()'); I USED BELOW ONE AND static FUNCTION I DEFINED BELOW this.cbox.setAttribute('onclick','NodeElement.selecting()'); this.tdx = document.createElement("td"); this.tdx.id="tdx"+this.no; this.tdx.innerHTML = this.x; this.tdy = document.createElement("td"); this.tdx.id="tdy"+this.no; this.tdy.innerHTML = this.y; } static selecting() { var source = window.event.target || window.event.srcElement ; if(source.checked) { console.log("selected..."); } else { console.log("un selected..."); } } } -
I had such a class : class NodeElement { no; x; y; tre; tdno; tdx; tdy; cbox; nodesArray; nodesTable; selected; constructor( x, y,nodesArray, nodesTable) { nodeCounter++; this.no = nodeCounter; this.x = x; this.y = y; this.nodesArray = nodesArray; this.nodesTable = nodesTable; //create elements this.tre = document.createElement("tr"); this.tre.id = "row"+this.no; this.tdno = document.createElement("td"); this.tdno.id = this.no; this.tdno.innerHTML = this.no; this.cbox = document.createElement("input"); this.cbox.type="checkbox"; this.cbox.id="cbox"+this.no; this.cbox.value=this.no; this.cbox.name="cbox"+this.no; this.cbox.setAttribute('onclick','select(this)'); this.tdx = document.createElement("td"); this.tdx.id="tdx"+this.no; this.tdx.innerHTML = this.x; this.tdy = document.createElement("td"); this.tdx.id="tdy"+this.no; this.tdy.innerHTML = this.y; } } I want to pass complete class object(i.e instantiated one) to a function select() as parameter when I click(i.e. checked the checkbox object of the class instance). My question is that line : this.cbox.setAttribute('onclick','select(this)'); I tried that too : this.cbox.setAttribute('onclick','select("'+this+'")'); but not worked. I could no achieve to pass neither checkbox nor the class object(NodeElement) to function select() as parameter. How can I do that?
-
Need critiques and "indexing-crawling" help
eaglehopes replied to eaglehopes's topic in Website Critique
I noticed that, my sitemap contains other mistakes as well : https://developers.google.com/search/docs/advanced/sitemaps/build-sitemap?hl=en#general-guidelines I have not use "www" in "url"s because I do not know it. I corrected them too. I hope, this time google will start to crawl my page -
How can I anchor to a <h1 id="title1"> tag of external url?
eaglehopes replied to eaglehopes's topic in HTML Help
I was completely WRONG! I checked it in another page and worked ! It is feasible and that works actually like all contributer's said : if there is a tag and its valid id at the end of the link after "#" ! My big sorry again ! -
How can I anchor to a <h1 id="title1"> tag of external url?
eaglehopes replied to eaglehopes's topic in HTML Help
@mac_gyver and @requinix thanks, you could not see "specialfirewall" tag, because I removed it as requinix said that after my last post. In the post before this I noticed that what requinix "will say" is logical : why am I holding my left ear with my right hand? Thanks. -
How can I anchor to a <h1 id="title1"> tag of external url?
eaglehopes replied to eaglehopes's topic in HTML Help
Sometimes I saw that some sites do such things,,, maybe I saw it wrong, because I could not remember any site name. I think it is not feasible to do such thing. Maybe I must seperate pages and link to seperate page which will be the most easy solution for now ☺️. -
How can I anchor to a <h1 id="title1"> tag of external url?
eaglehopes replied to eaglehopes's topic in HTML Help
No. I am using index.php page to include other pages and external url tag is inside one of that pages. I can give an example : url of the external page : http://x.freecluster.eu/index.php?page=articles tag in the external page : <h2 id="specialfirewall"> ....</h2> (title of one article) I want to link from : http://x.freecluster.eu/index.php?page=blog&subblog=CP&fin=FIXBUGS&blogPage=2.php I added a link there but I can only get the page not focused on the tag like href="#<id>". Can I do what I want with html? -
How can I anchor to a <h1 id="title1"> tag of external url?
eaglehopes replied to eaglehopes's topic in HTML Help
Sorry, I only get the page, not to the tag. -
I want to link to a special tag, for instance the <h1 id="title1"> tag in external url. Can I do that, how ? I tried , no success: <a href="...freecluster.eu/page=x.html#title1"> link</a> Thanks.
-
Can search engines crawl content of .php files?
eaglehopes replied to eaglehopes's topic in Application Design
I am searching the answer in the internet, looking for search engines' pages but I could not find the answer. Thanks @requinix. It is the main problem for me, as you noticed from my questions that are about sitemap , include function, crawling etc. All are about the same problem : not indexed pages. You finally put a period ! Then I will look for other points why my site could not indexed correctly. -
In my site, I used build my own content management system and all menus and related files created by php. All of my pages have .php extension. I used queries to get them(i.e. index.php?page=...&blog=...subblog=... etc.) When user clicked the related blog/subblog page from the menu, I use include function for page and put it in index.php. So all of them shown in index.php, not their seperate links. I created correct sitemap.xml showing each page correctly. So does such structure prevents search engines to crawl their content? Thanks.
-
Why drawing on canvas resizing/scaling with canvas size?
eaglehopes replied to eaglehopes's topic in HTML Help
Thanks requinix, when I changed : canvasElement.style.width=canvasWidth+"px"; with canvasElement.width=canvasWidth; it works as I expected. -
What did I wrong in scoping- not working?
eaglehopes replied to eaglehopes's topic in Javascript Help
@maxxdI tried what you said as : <script type="text/javascript"> window.onload = function () { draw(); } var gui = document; var canvasElement = gui.getElementById("GraphicArea"); var icerik = canvasElement.getContext("2d"); var canvasWidth=300; var canvasHeight=300; ... </script> It worked like a charm. Thanks. -
My complet code is : <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Online canvas program</title> </head> <body> <style type="text/css"> .GraphicArea { background-color: #ceccec; border-top-left-radius:10px; border-top-right-radius:10px; border-bottom-left-radius:10px; border-bottom-right-radius:10px; } </style> <table> <tr> <td> <p id="Canvas Result"></p> </td> </tr> <tr> <td> <form> <label for="canvasWidth">Canvas width :</label> <input type="number" id="width" name="quantity" min="300" max="1000" value="350" onchange="setCanvasWidth(this.value)"></input><br> <label for="canvasWidth">Canvas heigth :</label> <input type="number" id="width" name="quantity" min="300" max="1000" value="350" onchange="setCanvasHeight(this.value)"></input><br> <input type="submit" value="Apply" ><br> </form> </td> <td> <canvas class="GraphicArea" id="GraphicArea" alt="Graphics Area for drawing cross section"> </canvas> <script type="text/javascript"> var gui = document; const canvasElement = gui.getElementById("GraphicArea"); const icerik = canvasElement.getContext("2d"); var canvasWidth=300; var canvasHeight=300; if (canvasElement.getContext) { //const ctx = canvas.getContext('2d'); // drawing code here gui.getElementById("Canvas Result").innerHTML = "supported"; } else { // canvas-unsupported code here gui.getElementById("Canvas Result").innerHTML = "not supported"; } function setCanvasWidth(w) { canvasWidth=w; canvasElement.style.width=canvasWidth+"px"; draw(); } function setCanvasHeight(h) { canvasHeight=h; canvasElement.style.height=canvasHeight+"px"; draw(); } function draw() { icerik.beginPath(); icerik.moveTo(10,10); icerik.lineTo(50,50); icerik.stroke(); icerik.closePath(); icerik.lineWidth=3; var linearGradient2 = icerik.createLinearGradient(125,0, 225,0); linearGradient2.addColorStop(0 , 'rgb(255, 0, 0)'); linearGradient2.addColorStop(0.5, 'rgb( 0, 0, 255)'); linearGradient2.addColorStop(1 , 'rgb( 0, 0, 0)'); icerik.strokeStyle = linearGradient2; icerik.strokeRect(125, 10, 100, 100); } </script> </td> </tr> </table> </body> </html> The same code but in corrected format in my last post. The problem is that, when I resize canvas, drawing on it resizing too : When i resized canvas using input boxes, them square streches and becomes rectangle : Why? How can I prevent it? Any help is appreciated.
-
What did I wrong in scoping- not working?
eaglehopes replied to eaglehopes's topic in Javascript Help
I found my mistake !! Sorry to disturb, when I put all script tag after canvas object, everything worked ! Element not defined when script is written, I think that is the problem. -
My simple html page and script is like this : <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Online canvas program</title> </head> <body> <style type="text/css"> .GraphicArea { background-color: #ceccec; border-top-left-radius:10px; border-top-right-radius:10px; border-bottom-left-radius:10px; border-bottom-right-radius:10px; } </style> <script type="text/javascript"> var gui = document; var canvasElement = gui.getElementById("GraphicArea"); var icerik = canvasElement.getContext("2d"); var canvasWidth,canvasHeight; if (canvasElement.getContext) { // canvas supported gui.getElementById("Canvas Result").innerHTML = "supported"; } else { // canvas-unsupported code here gui.getElementById("Canvas Result").innerHTML = "not supported"; } function setCanvasWidth(w) { canvasWidth=w; canvasElement.style.width=canvasWidth+"px"; } function setCanvasHeight(h) { canvasHeight=h; canvasElement.style.height=canvasHeight+"px"; } </script> <table> <tr> <td> <p id="Canvas Result"></p> </td> </tr> <tr> <td> <form> <label for="canvasWidth">Canvas width :</label> <input type="number" id="width" name="quantity" min="300" max="1000" value="350" onchange="setCanvasWidth(this.value)"></input><br> <label for="canvasWidth">Canvas heigth :</label> <input type="number" id="width" name="quantity" min="300" max="1000" value="350" onchange="setCanvasHeight(this.value)"></input><br> <input type="submit" value="Apply" ><br> </form> </td> <td> <canvas class="GraphicArea" id="GraphicArea" alt="Graphics Area for drawing cross section"> </canvas> </td> </tr> </table> </body> </html> I tried to use gui,canvasElement,canvasWidth and canvasHeigth etc. variables as global scope. However, code does not work. Only work when I define all variables inside the functions again. Why? Where am I doing wrong?
-
What are the ways of checking responsive website?
eaglehopes replied to eaglehopes's topic in HTML Help
Thanks Barand, I used Firefox too ,but I could not fine "Responsive Design Mode" in "More Tools", but I can solve that problem. 👍 Edit : I found it : they hide it under "Developer Tools" ( reference page : https://firefox-source-docs.mozilla.org/devtools-user/responsive_design_mode/). -
I did instructions in "responsive webpages(RW)"( https://www.w3schools.com/html/html_responsive.asp ) and checked my webpage in https://www.w3schools.com/howto/howto_css_devices.asp . However, my website did not shown in iframe when I changed the code in "try it" page, it showed white blank page with no error. When I changed my web-browser's size(i.e adjust it near the tablet size), does this do the trick of check RW, or do I need other things to do? Thanks.
-
Need critiques and "indexing-crawling" help
eaglehopes replied to eaglehopes's topic in Website Critique
Hi again, I noticed that, some CSS graphical coding in my web page cause high GPU usage so I remove all CSS patterns. So it will become very simple and fast in terms of loading speed. I used small sized images for thumbs which increase speed too. I also changed my website's xml sitemap; this time I only used folder based page locations, not using query types(i.e using & etc.) , maybe this time search engines will crawl my pages, I hope Since still there seems a excluded $ of pages are 307 which is nearly the 95% of the whole site... Eagle hopes that -
Need critiques and "indexing-crawling" help
eaglehopes replied to eaglehopes's topic in Website Critique
Thanks requinix, I corrected it. 🙂 -
Need critiques and "indexing-crawling" help
eaglehopes replied to eaglehopes's topic in Website Critique
Sorry, i wrote wrong my sitemap address in robots.txt , it should be : http://enginery.freecluster.eu/sitemap.xml. -
Hello to everybody, I need critiques and "website crawling help" about my website http://enginery.freecluster.eu . My crawling question was that: I tried google search console tools to add my website's sitemap and add it : http://enginery.freecluster.eu/sitemap.xml . It says my sitemap is ok and found 312 pages but not crawl all correctly! Three weeks have passed but nothing changed. I manually request indexing some pages(about 4 pages) and google search console, after than today it only shows some of them(not all 4) when I search using "site:http://enginery.freecluster.eu". My website's all files have php extensions. Did this prevent googlebot to reach the content of my websites' pages? My robots.txt file's content is : User-agent: Googlebot Allow: / User-agent: * Allow: / Sitemap: http://enginery.freecluster.eu/sitemapv1.xml Any critiques and help is appreciated. Thanks.