Develop Reference

Image autoslider for dynamic folder's content

I'd like to make autoslide gallery.I wonder how to start it... It got to be dynamic, because folder content will change with time. Typing is not what I'm looking for. Can You give me any advices or tutorials I can base on? I was searching but there's no for dynamic folder content...

This is a very generic example and may not be direct copy/paste for you but it should help you learn the fundamentals of achieving your intended result.
Using this library:
https://gist.github.com/tsohil/623538
Assuming you want to get all of the images in the folder.
First, we'll use PHP to fetch the file names doing so along the lines of:
<?php
echo json_encode(glob("folder/relative/to/controller/*.{jpg,png,gif}", GLOB_BRACE));
Our HTML we will stage as:
<div id="carousel"></div>
Then in our JS (example requires jQuery) we will send a request for to that.
$.get('/phpcontroller.php', {}, function(data) {
data.forEach(function(val) => {
$("#carousel").append("<div class=\"inactive\">
<img width=\"946\" height=\"473\" src=\"/path/to/folder/"+val+"\" class=\"car-img\">
</div>");
});
});

How do I set an image url from Javascript

I am writing an Open University project that requires me to use Cordova to generate an Android app. To do this, I am using a combination of HTML and JavaScript.
My HTML uses
<div data-role="page" id="view">
etc. to define individual pages within the single HTML file. When the page first runs, it shows a "corporate" logo. After signing in, it shows the personal logo. The url to the logo comes from a database and is held in a JS global variable railroadLogoPath. I have an HTML placeholder Once I move to another page, I can't see how to get the HTML to use the JS to get the url of this logo.
My HTML looks like this:
<img class="banner" id = "signedInlogo" width = "100%">
I have a JS function in index.js as follows:
function insertLogo(anID) {
document.getElementById("anID").src = railroadLogoPath;
}
How do I call this from HTML. I have tried putting it in
<script> insertLogo("signedInLogo")</script>
but this doesn't work.
I am just starting to understand JS so any help would be appreciated.
David

In this line:
document.getElementById("anID").src = railroadLogoPath;
You're looking for an element by ID with the literal string "anID". You should be using the variable anID
function insertLogo(anID) {
document.getElementById(anID).src = railroadLogoPath;
}

multiple divs with a single .load()

After hours ploughing through all the posts on this I'm still without a solution. I've got at least 6 divs in a single HTML file which I need to load to a master HTML file. The contents of each div are posted to different div containers in the master file. I can get this to work with the code below, but I'm carrying out 6 separate loads of the same file which is clearly resource and time-wasting. I've tried separating ID's with commas on a single line, but I get strange results where data gets posted to the wrong containers. Does anyone know how to achieve a single load?
$(function() {
$("#CountryList").load("https://URL #CountryStore");
$("#YearList").load("https://URL #YearStore");
$("#ProductList").load("https://URL #ProductStore");
});

Make only one request using $.get() and parse the response yourself and place the various parts where you want them
$.get('https://URL', function(data){
var $data= $(data);
$( "#CountryList" ).html($data.find('#CountryStore'));
$("#YearList").html($data.find("#YearStore"));
$("#ProductList").html($data.find("#ProductStore"));
});
This is essentially what load() is doing internally

AppleScript saving documents from urls from particular part of webpage

I'm trying to write an AppleScript that saves and downloads all the urls from a particular part of a webpage (a table) and saves them into a folder. All the links are either pdfs or videos that link to Youtube. The table I want to get the links from is organized by week, date and material. I want a folder containing all the weeks, and then inside would be a folder for each date, and another folder that contains the material for that date. (MyStuff/Week/Date/Material)
e.g.
<div class="table">
<div class="row">
<div class="topcell">Week </div>
<div class="topcell">Date</div>
<div class="topcell">Material</div>
</div>
</div> <!-- end table-->
From some research I've seen that some people are using JavaScript in their implementations to open the document? http://macscripter.net/viewtopic.php?id=20287 I tried using something like this but couldn't get it to compile.
I'm completely new at this, so any help would be appreciated! :)
What I have so far:
tell application "Finder"
set p1 to path to user/Desktop
make new folder at p with properties {name:"AllMaterial"}
--Make AllMaterial Folder--
set p2 to path to user/Desktop/AllMaterial
repeat with i from 1 to 18
make new folder at p2 with properties {name:"Week" + i}
--Make all the weeks--
--in each week, make 3 days--
set p3 to path3 to user/Desktop/AllMaterial/"Week" + i
repeat with j from 1 to 3
make new folder at p2 with properties {name:"Day" + j}
end repeat
end repeat
--Make all the days--
end
set siteURL to "XXX"
tell application " Safari"
activate
open location siteURL
--wait until page loaded
if my page_loaded(20) is false then error numner - 128
set numLinks to (do JavaScript "document.links.length" in document1)
--(do JavaScript "document.body.table.links.length" in document1)--
--get num of links --(doesn't account for the "table" that I want ^^. There are multiple different links on the page )
set count to numLinks - 1,
set thisLink to "",
set f to false
repeat with i from 0 to count
set thisLink to do JavaScript
end tell

The question is are you wanting to learn how to do it or are you just wanting someone to provide you a completed script? I can help with the former rather than the later.
To learn how to write the script you need to understand what you trying to achieve and the tools you are using to get the job done.
Three things you must learn, or understand, to solve the problem you are dealing with: Applescript, Javascript and the Document Object Model.
JS & the DOM
First of all, let's deal with the content and why you can't grab it with Javascript:
<div class="table">
<div class="row">
<div class="topcell">Week </div>
<div class="topcell">Date</div>
<div class="topcell">Material</div>
</div>
</div> <!-- end table-->
This is NOT a table!
These are divs with classes that are laid out in such a way using CSS to look like a table. Which is why you are having issues navigating the DOM of the page.
(do JavaScript "document.body.table.links.length" in document1)--
--get num of links --(doesn't account for the "table" that I want ^^. There are multiple different links on the page )
This does not work because there is NO TABLE!
You need to retrieve the links from the right place. No real table there, each is a div.
I would love to show you a working example, but the 'table' does not contain enough to give a working example. Where exactly are the links?
So, let's make a working example
<div class="table">
<div class="row">
<div class="topcell">Week</div>
<div class="example">
TEST
</div>
<div class="topcell">Date</div>
<div class="topcell">Material</div>
</div>
</div> <!-- end table-->
Now we know where the links are, but you need to understand the DOM...
The following:
document.getElementsByClassName('example')[0].getElementsByTagName('a')[0].href;
would get the href of the first a link of the first element of the document whose class name is example (0 being first in Javascript). We move up to the next a by going to 1:
document.getElementsByClassName('example')[0].getElementsByTagName('a')[1].href;
This is not the method to use for your issue, but is a good example of where you need to head.
You can read more about the navigating the DOM with Javascript here or tons of places, just google it.
Applescript
The only reason you are using applescript is because you are on a mac... You don't need to learn applescript to get this done, but it wouldn't hurt.
You do need to learn to do it properly though...Zero is correct, your Applescript is all wrong on many levels...
Small steps, but here is an example of something like how it should be
tell application "Finder"
set p1 to (path to desktop folder) as string
--Make AllMaterial Folder--
try
make new folder at p1 with properties {name:"AllMaterial"}
on error
--it exists! IT WILL ERROR IF THERE IS A FOLDER ALREADY
end try
set p2 to p1 & "AllMaterial" as string
repeat with i from 1 to 18
set thisfolder to make new folder at p2 with properties {name:"Week" & i as string}
--Make all the weeks--
--in each week, make 3 days--
repeat with j from 1 to 3
set thisdaysfolder to make new folder at thisfolder with properties {name:"Day" & j as string}
---WHILE IN THIS LOOP thisdaysfolder IS THE REFERENCE TO THE FOLDER TO SAVE IN… SO HERE IS WHERE YOU SAVE TO OR SOME ORDER OR LOGIC...
end repeat
end repeat
end tell
TYING IT TOGETHER
Bringing it all together to make a complete script depends on the actual data on the website.
The part that grabs the data from the website needs to store the data into applescript lists or possibly grab the data in the repeat when making the folders, etc... it's up to you the coder really.
In the end you need to save the files and you will most likely want to use cURL via shell script and some quoted forms:
do shell script "curl -f " & quoted form of thisURL & " -o " & quoted form of (POSIX path of savelocation) & filesname ---(this is a variable with the file name)
This is not a complete solution obviously but will get you going in the right direction.

Saving an edited SVG file as a new file or to DB

I don't often need to ask questions but Google has failed me this time
so I have a site that uses Javascript to edit an external SVG file like so:
<embed id="svgFile" src="svgFile.svg" type="image/svg+xml" />
I have a form with inputs to edit the SVG on the fly with Javascript and Jquery like so:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="JavascriptFile.js"></script>
....HTML....
<input id="txt1" name="text_one" maxlength="16" type="text" class="text" placeholder="Line one" onkeyup="update(1)" />
the javascript is something like this:
function update(n) {var txtID = n;
var txt = document.getElementById("txt" + txtID).value;
var svgTXT = document.getElementById("svgFile").getSVGDocument().getElementById("txt" + txtID);
svgTXT.textContent = txt;
}
Now this all works OK and the "image"/SVG updates on the page BUT now I need to save this updated image.
New I don't know exactly what file format we need but saving the information to a php/MySQL DB and PDF are a minimum. the PDF is for the user to save and print... what ever they want to do and the DB is for on-line saving.
I also have JQuery linked to the site but I find Javascript more natural to code in, ether way I need some sort of solution/example/plugin. Can anyone help!?

I accomplished this by using the following code segments in php and mySQL database :
First of all, remember svg is basically stored in text just like HTML is also. And svg tags, all be it different ones, are laid out very similar to HTML tags.
Storing into the database. You must use the following code segment in the actual mySQL Insertcall. I found out if you do this to the variable first and then put the variable in the insert call it will not work. The function must be in the mySQL statement.
mysql_real_escape_string($myValue)
Retrieving Into textbox in value. Assuming your values have been already retrieved from the database and now are in an array Called theValues. Basically I am Removing any backslashes but before hand I'm making sure it can be displayed correctly using htmlentities. Since you are no Backslashes in svg that I know of it fixes it where servers replace quotes with \". If you do encounter some Backslashes in svg you'll just have to be a bit more clever in your replacement function.
$myValue= str_replace("\\", "", htmlentities($theValues->myValue));
echo $myValue;
echoing out on to a page same reasons as above, but the htmlentities function Makes it only display the text of the svg Instead of processing the svg And displaying your picture. this is only required for displaying svg after the text of the Has been stored in a data base but it will not hurt your display If it wasn't the data the first, just A needless function call .
str_replace("\\", "",$myValue)

Saving as SVG
Use XMLSerializer to get a source-XML representation of your SVG, and post that back to your server (using AJAX if you like).
Saving as a PNG
Use XMLSerializer to create a data URI for your SVG, and use that as the source for an <img> element. Draw this image to an HTML5 canvas and then use toDataURL() to convert the contents to a base64-encoded PNG data URI, whichh you can then post to your server and save as a file.
Caveat: The current version of Chrome and semi-recent versions of Firefox (but not the latest) currently "punt" on security and taint the canvas when you draw any SVG, preventing you from getting a data URI.
Note: Both answers above require IE9+; but then, that's true for SVG, too.