Is this possible with Gulp? Gulp Change Text and Dest - javascript

I don't know what this is possible.
files
a.html / b.hml
c.css / d.css
There are two changes in Html and Css
Each HTML has a changed Css(c.css,d.css).
The path of Css is as follows
<link src="/style/sample/c.css">
If a Css file has been changed, verify that the CSS file has been declared in the changed HTML.
Change the path of the css file.
Create a new file using Gulf's dest.
That's my code here.
async function ds(cd) {
const branch = branchName.replace("/", "-");
let fileHtml = [],
fileCSS = [],
fileImage = [];
// npm package git-status,
// Look for files that are up on git stage.
await gitStatus((err, data) => {
data.map((e) => {
item = e.to.replace("WebContent/resources", "./resources"); // change path
// Check only Resources
if (item.indexOf("./resources/") !== -1) {
if (item.indexOf("html") !== -1) {
fileHtml.push(item); // get Html List T^T
return fileHtml;
}
if (item.indexOf("css") !== -1) {
// css
fileCSS.push(item);
return fileCSS;
}
if (item.indexOf("img") !== -1) {
// img
fileImage.push(item);
return fileImage;
}
}
});
cd();
});
//I think it's possible with JavaScript, but I don't know what to do with Gulp.
fileHtml.forEach((e) => {
let files = fs.readFileSync(__dirname + e, "utf8"); //해당 HTML 파일
let splitFile = files.split(/\r?\n/);
// 각각의 HTML 파일 내부에서
let result = splitFile.forEach((j, i) => {
// 위에서 찾은 css 파일이 있는지 찾아서
fileCSS.forEach((v) => {
if (j.indexOf(v) >= 0) {
let result = j.replace("/resources/", "/" + branch + "/");
console.log(result);
// console.log("페이지는", e);
// console.log("파일은", v);
}
});
});
});
}

Related

Find first file with given filename

Hello I am trying to find first file with given filename ( piece of filename ).
It works fine but it take a while to take result
There is code
const fs = require("fs");
const dirCheckIn =
"\\\\192.168.2.4\\Photos";
exports.checkUploadedFiles = (req, res) => {
let fileName = req.params.filename;
const getAllFiles = function (dirPath, arrayOfFiles) {
files = fs.readdirSync(dirPath);
arrayOfFiles = arrayOfFiles || [];
files.forEach(function (file) {
if (fs.statSync(dirPath + "/" + file).isDirectory()) {
arrayOfFiles = getAllFiles(dirPath + "/" + file, arrayOfFiles);
} else {
arrayOfFiles.push(file);
}
});
return arrayOfFiles;
};
const uploadedFiles = getAllFiles(inventDirCheckIn);
console.log(uploadedFiles)
let result = uploadedFiles.find(
(result) => result.startsWith(fileName));
if (!result) {
res.send('nothing found')
} else if (result) {
res.send(result)
}
}
It works fine but for example if I have over 7000 photos it takes about 5 sec to get result.
Maybe there is smarter solution?
How can I make it in better way? I want to check if file is uploaded into dir Photos.
I got simple api route /api/getUploadedFiles/:filename
Also I want use startsWith because sometimes I do not know full name of file
/**
*
* #param filePath path to file which is to be checked if it exists.
*/
private checkFileExistsSync(filePath: string) {
let flag = true;
try {
fs.accessSync(filePath, fs.constants.F_OK);
} catch (e) {
flag = false;
}
return flag;
}
// Example usage
// path to the file
const dirCheckIn =
"\\\\192.168.2.4\\Photos";
if (checkFileExistsSync(dirCheckIn)) {
// if the file exists do something...
}
if (!checkFileExistsSync(dirCheckIn)) {
// if the file doesn't exists do something...
}

Change the way my nodejs app activates

The code listed below searches for files that contains a specified string under it's directory/subdirectories.
to activate it, you type node [jsfilename] [folder] [ext] [term]
i would like to change it so it will search without the base folder, i don't want to type ./ , just node [jsfilename] [ext] [term]
so it already know to search from it's location.
i know it has something to do with the process.argv but it need a hint what should i do.
PS:.
I already tried to change the last raw to :
searchFilesInDirectory(__dirname, process.argv[3], process.argv[2]);
it giving me noting...
const path = require('path');
const fs = require('fs');
function searchFilesInDirectory(dir, filter, ext) {
if (!fs.existsSync(dir)) {
console.log(`Welcome! to start, type node search [location] [ext] [word]`);
console.log(`For example: node search ./ .txt myterm`);
return;
}
const files = fs.readdirSync(dir);
const found = getFilesInDirectory(dir, ext);
let printed = false
found.forEach(file => {
const fileContent = fs.readFileSync(file);
const regex = new RegExp('\\b' + filter + '\\b');
if (regex.test(fileContent)) {
console.log(`Your word has found in file: ${file}`);
}
if (!printed && !regex.test(fileContent)) {
console.log(`Sorry, Noting found`);
printed = true;
}
});
}
function getFilesInDirectory(dir, ext) {
if (!fs.existsSync(dir)) {
console.log(`Specified directory: ${dir} does not exist`);
return;
}
let files = [];
fs.readdirSync(dir).forEach(file => {
const filePath = path.join(dir, file);
const stat = fs.lstatSync(filePath);
if (stat.isDirectory()) {
const nestedFiles = getFilesInDirectory(filePath, ext);
files = files.concat(nestedFiles);
} else {
if (path.extname(file) === ext) {
files.push(filePath);
}
}
});
return files;
}
searchFilesInDirectory(process.argv[2], process.argv[4], process.argv[3]);
If I get what are you trying to achieve. You can do so by slightly changing your function call in the last line.
Change
searchFilesInDirectory(process.argv[2], process.argv[4], process.argv[3]);
to
searchFilesInDirectory(process.cwd(), process.argv[3], process.argv[2]);
Edit
As #Keith said in comments use process.cwd() to get the current working directory instead of __dirname
If you want it to work for both conditions then you need to do a conditional check...
if(process.argv.length === 5){
searchFilesInDirectory(process.argv[2], process.argv[4], process.argv[3]);
}else if(process.argv.length === 4){
searchFilesInDirectory(process.cwd(), process.argv[3], process.argv[2]);
}else{
throw new Error("Not enough arguments provided..");
}

Javascript,nodejs: give a "string not found" messege on console.log

The code listed below searches for files that
contains a specified string under it's directory/subdirectories.
to activate it, you type node [jsfilename] [folder] [filename] [ext]
i would also like it to announce: Nothing found in a console.log every time that
a word wasn't found.
ive tried
if (!regex.test(fileContent)) {
console.log(`Noting found`);
it works only if you have one file without your word, but if not ,it loops.
for example if you have 4 files and one of them has the string it wil show
Your word was found in directory: [file]
Noting found
Noting found
Noting found.
So, how can i stop the loop after one !found console.log and how can i prevent it from showing in case of something has found?
const path = require('path');
const fs = require('fs');
function searchFilesInDirectory(dir, filter, ext) {
if (!fs.existsSync(dir)) {
console.log(`Specified directory: ${dir} does not exist`);
return;
}
const files = fs.readdirSync(dir);
const found = getFilesInDirectory(dir, ext);
found.forEach(file => {
const fileContent = fs.readFileSync(file);
const regex = new RegExp('\\b' + filter + '\\b');
if (regex.test(fileContent)) {
console.log(`Your word was found in directory: ${file}`);
}
});
}
function getFilesInDirectory(dir, ext) {
if (!fs.existsSync(dir)) {
console.log(`Specified directory: ${dir} does not exist`);
return;
}
let files = [];
fs.readdirSync(dir).forEach(file => {
const filePath = path.join(dir, file);
const stat = fs.lstatSync(filePath);
if (stat.isDirectory()) {
const nestedFiles = getFilesInDirectory(filePath, ext);
files = files.concat(nestedFiles);
} else {
if (path.extname(file) === ext) {
files.push(filePath);
}
}
});
return files;
}
searchFilesInDirectory(process.argv[2], process.argv[3], process.argv[4]);
Change:
if (!regex.test(fileContent)) {
console.log(`Noting found`);
// ...
to:
if (!printed && !regex.test(fileContent)) {
console.log(`Noting found`);
printed = true;
// ...
and make sure that you have a variable called printed defined in outer scope, originally falsy.

Nativescript bind value inside image-picker function

I am using image-picker plugin. I can open images gallery and select single or multiple images.
My problem is how to bind the path of the image to the xml image src?! It doesn't work inside getImage() function.
xml:
<Image class="imageSource" src="{{ thumb }}" stretch="none" />
typescript:
import { Observable } from 'data/observable';
import * as imagepicker from "nativescript-imagepicker";
var counter = 0;
var fs = require('file-system');
export class AssistenceViewModel extends Observable {
thumb:any;
public addImage(){
dialogs.action({
message: "Opções",
cancelButtonText: "Cancelar",
actions: ["Câmera", "Galeria"]
}).then(result => {
console.log("Dialog result: " + result);
if(result == "Câmera"){
//Do action1
console.log("Abrir camera");
}else if(result == "Galeria"){
console.log("Abrir galeria");
let context = imagepicker.create({
mode: "single"
});
context.authorize().then(function() {
return context.present();
}).then(function(selection) {
selection.forEach(function(selected){
selected.getImage().then(function(imagesource){
var localPath = null;
if(platformModule.device.os === "Android"){
localPath = selected.android;
console.log("localPath android: " +localPath);
}else {
// selected_item.ios for iOS is PHAsset and not path - so we are creating own path
let folder = fs.knownFolders.documents();
let path = fs.path.join(folder.path, "Test" + counter + ".png");
let saved = imagesource.saveToFile(path, "png");
localPath = path;
console.log("localPath iOS: " +localPath);
}
if(localPath){
this.thumb = localPath // this is not working
console.log("thumb: "+this.thumb); // this is not working
}
});
});
}).catch(function(e) {
console.log(e);
});
}
});
}
}
The result for console.log("localPath android: " +localPath);
localPath android: /storage/emulated/0/DCIM/Camera/IMG_20171213_224917038.jpg
but I cannot get any log for this.thumb.
You should either use TS arrow functions to preserve the context of this of "cache the meaning of this"
e.g. for arrow functions
// more code above this line
.then(() => {
return context.present();
}).then((selection) => {
selection.forEach((selected) => {
selected.getImage().then((imagesource) => {
Or that = this; pattern
var that = this;
// ... your code in the promises follows
that.thumb = newValue;

HTML5 ondrop event returns before zip.js can finish operations

The crux of my issue is that I need to use a datatransferitemlist asynchronously which is at odds with the functionality described in the specs, which is that you are locked out of the dataTransfer.items collection once the event ends.
https://bugs.chromium.org/p/chromium/issues/detail?id=137231
http://www.whatwg.org/specs/web-apps/current-work/multipage/dnd.html#drag-data-store
The case offender is the following. With a more detailed description of my problem and thoughts below it.
drophandler: function(event) {
event.stopPropagation();
event.preventDefault();
event.dataTransfer.dropEffect = 'copy';
zip.workerScriptsPath = "../bower_components/zip.js/WebContent/";
zip.useWebWorkers = false; // Disabled because it just makes life more complicated
// Check if files contains just a zip
if (event.dataTransfer.files[0].name.match(/(?:\.([^.]+))?$/) == 'zip') {
var reader = new FileReader();
that = this;
reader.onload = function(e) {
that.fire('zipuploaded', e.target.result.split(',')[1]);
}
reader.readAsDataURL(event.dataTransfer.files[0]);
// Rev up that in browser zipping
} else {
var that = this;
var items = event.dataTransfer.items;
// Async operation, execution falls through from here
zip.createWriter(new zip.Data64URIWriter(), function(writer) {
(function traverse(list, path, i, depth) {
return new Promise(function(resolve, reject) {
var item;
if (depth == 0) {
if (i == list.length) {
writer.close(function(uri) {
that.fire('zipuploaded', uri.split(',')[1]); // Just the base64, please
fulfill(1);
return;
});
} else {
console.log(i);
console.log(list);
var item = list[i].webkitGetAsEntry();
}
} else {
if (i == list.length) {
resolve(0);
return;
} else {
item = list[i];
}
}
if (item.isFile) {
item.file(function(file) {
// Zipping operations done asynchronously, it'll fail by roughly the second operation
writer.add(path + file.name, zip.BlobReader(file), function() {
traverse(list, path, i + 1, depth).then(resolve(0)); // Next item
});
});
} else if (item.isDirectory) {
var dirReader = item.createDirReader();
dirReader.readEntries(function(entries) {
// Operate on child folder then the next item at this level
traverse(entries, path + item.name + "/", 0, depth + 1).then(function() {
traverse(list, path, i + 1, depth).then(resolve(0));
});
});
}
});
})(items, "", 0, 0); // Begin with datatransferitemlist, 0th element, depth 0
});
this.$.uploadarea.classList.remove('highlightdrag');
}
// When we exit it kills the event.dataTransfer.items
},
I am using zip.js which is asynchronous with the HTML5 DnD API.
The ondrop event ends before the asynchronous zip.createWriter/writer.add operations finish. I can think of four ways to solve this although I don't know how to implement any of them and would like some advice.
Block until createWriter is done. (Blocking javascript? Uhoh)
Prevent the ondrop from locking me out of dataTransfer.items (It seems to be for security so unlikely)
Synchronously copy out the contents of dataTransfer.items first (Probably very slow)
Do everything synchronously (Don't think zip.js allows this, JsZip does, but I moved away from that due to it having its own limitations with large file sets)
HTML5 DnD works as expected. The problem is, when adding multiple files, if you add a file before previous finish, zip.js breaks silently. This can be fixed by calling writer.add in series.
The snippet might not work, see this pen instead.
This example flats the structure of dropped files, then add it to zip in series.
function mes(it) {
const m = document.querySelector('#mes')
return m.textContent = it + '\n' + m.textContent
}
function read(items) {
return Promise.all(items.map(item => {
if (item.isFile) return [item]
return new Promise(resolve => item.createReader().readEntries(resolve))
.then(entries => {
entries.forEach(it => it.path = item.path + '/' + it.name)
return read(entries)
})
})).then(entries => entries.reduce((a, b) => a.concat(b)))
}
function handleResult(blob){
const res = document.querySelector('#result')
res.download = 'files.zip'
res.href = window.URL.createObjectURL(blob)
res.textContent = 'download zipped file'
}
function handleItems(items){
mes(items.length)
items.forEach(item => item.path = item.name)
const initZip = new Promise(resolve =>
zip.createWriter(new zip.BlobWriter, resolve)
)
const getFiles = read(items).then(entries => {
return Promise.all(entries.map(entry =>
new Promise(resolve =>
entry.file(file => {
file.path = entry.path
resolve(file)
})
)
))
})
return Promise.all([getFiles, initZip]).then(([files, writer]) =>
files.reduce((current, next) =>
current.then(() =>
new Promise(resolve => {
mes(next.path)
writer.add(next.path, new zip.BlobReader(next), resolve)
})
)
, Promise.resolve())
.then(() => writer.close(handleResult))
)
}
zip.useWebWorkers = false
const drop = document.querySelector('#drop');
['dragover', 'drop'].forEach(name =>
drop.addEventListener(name, ev => ev.preventDefault())
)
drop.addEventListener('drop', ev => {
const items = [].slice.call(ev.dataTransfer.items)
.map(item => item.webkitGetAsEntry())
return handleItems(items)
})
html, body, #drop {
height: 100%;
width: 100%;
}
<script src="http://gildas-lormeau.github.io/zip.js/demos/zip.js"></script>
<script src="http://gildas-lormeau.github.io/zip.js/demos/deflate.js"></script>
<div id="drop">
Drop here!
<br>
<a id="result"></a>
</div>
<pre id="mes"></pre>
jszip is much easier than this, you might want to give it a try.

Categories

Resources