Translations #37

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.

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

Merged

CropWatchDevelopment merged 2 commits into develop from translations

May 7, 2024

src/lib/components/ui/Back.svelte

-Original file line number
+Diff line change
@@ -1,12 +1,13 @@
     <script lang="ts">
     	import { goto } from '$app/navigation';
     	import cw_LogoImage from '$lib/images/UI/cw_back.png';
+    	import { _ } from 'svelte-i18n';
     	export let previousPage: string | null = null;
     </script>
     <div class="flex flex-row align-middle text-center mx-2" on:click={() => previousPage ? goto(previousPage) : history.go(-1)}>
     	<img src={cw_LogoImage} alt="" class="w-12 bg-surface-100 rounded-full p-2" />
     	<span class="text-2xl text-surface-100 ml-2 mt-2 align-middle">
-    		Back
+    		{$_('app.back')}
     	</span>
     </div>

src/lib/components/ui/DarkCard.svelte

            
                      Original file line number
                      Diff line number
                      Diff line change
                  
    @@ -1,4 +1,5 @@
  
    <script lang="ts">

    	import { _ } from 'svelte-i18n';

    	export let title;

    	export let value;

    	export let optimalValue;

    @@ -26,11 +27,11 @@
  
    	{#if optimalValue}

    		<div class="mt-4 text-[#C3C3C3] space-y-1 text-left">

    			<div class="flex justify-between">

    				<p class="text-sm">Optimal</p>

    				<p class="text-sm">{$_('optimal')}</p>

    				<p class="text-sm">{optimalValue}<span class="text-xs">{unit}</span></p>

    			</div>

    			<div class="flex justify-between">

    				<p class="text-sm">Difference</p>

    				<p class="text-sm">{$_('difference')}</p>

    				<p

    					class="text-sm {checkValue(differenceValue) == 'greater'

    						? 'greater'

src/lib/components/ui/SensorFooterControls.svelte

            
                      Original file line number
                      Diff line number
                      Diff line change
                  
    @@ -2,15 +2,16 @@
  
    	import { goto } from "$app/navigation";

    	import { mdiCog, mdiHistory, mdiLock } from "@mdi/js";

    	import { Button } from "svelte-ux";

    	import { _ } from 'svelte-i18n';

        import RulesImage from '$lib/images/UI/cw_rules.svg';

    </script>

    <div class="flex flex-col w-full my-8 gap-4">

    	<Button classes={{ root: 'w-full' }} size="lg" icon={mdiHistory} variant="fill" on:click={() => goto('history')}>History</Button>

    	<Button classes={{ root: 'w-full' }} size="lg" icon={mdiCog} variant="fill" on:click={() => goto('settings')}>Settings</Button>

    	<Button classes={{ root: 'w-full' }} size="lg" icon={mdiHistory} variant="fill" on:click={() => goto('history')}>{$_('sensorFooterControls.history')}</Button>

    	<Button classes={{ root: 'w-full' }} size="lg" icon={mdiCog} variant="fill" on:click={() => goto('settings')}>{$_('sensorFooterControls.settings')}</Button>

    	<Button classes={{ root: 'w-full' }} on:click={() => goto('rules')} size="lg" variant="fill">

    		<img src={RulesImage} alt="Rules" class="w-6 h-6 mr-2" />

    		Rules and Custom Alerts

    		{$_('sensorFooterControls.rules')}

    	</Button>

    	<Button classes={{ root: 'w-full' }} size="lg" icon={mdiLock} variant="fill" on:click={() => goto('permissions')}>Permissions</Button>

    	<Button classes={{ root: 'w-full' }} size="lg" icon={mdiLock} variant="fill" on:click={() => goto('permissions')}>{$_('sensorFooterControls.permissions')}</Button>

    </div>

src/lib/components/ui/TempHumidityCard.svelte

            
                      Original file line number
                      Diff line number
                      Diff line change
                  
    @@ -7,8 +7,8 @@
  
        function computeColor(temp) {

            // Temperature range from -40 to +150

            const minTemp = -40;

            const maxTemp = 85;

            const minTemp = -20;

            const maxTemp = 40;

            // Normalize temperature to a 0-1 scale

            const normalized = (temp - minTemp) / (maxTemp - minTemp);

    @@ -31,7 +31,7 @@
  
            <div class="h-56 w-56 rounded-full bg-[#343f34] bg-opacity-80 flex justify-center items-center">

                <div class="text-center space-y-4">

                    <p class="text-5xl text-center">{temperature}<span class="text-4xl text-[#A3A3A3]">ºC</span></p>

                    <p class="text-xl text-center">{humidity}<span class="text-xl text-[#A3A3A3]">RHS%</span></p>

                    <p class="text-xl text-center">{humidity}<span class="text-xl text-[#A3A3A3]">RH%</span></p>

                </div>

            </div>

    		</div>

src/lib/components/ui/dashboardCard.svelte

            
                      Original file line number
                      Diff line number
                      Diff line change
                  
    @@ -11,6 +11,7 @@
  
    	import { goto } from '$app/navigation';

    	import { mdiEye } from '@mdi/js';

    	import { _ } from 'svelte-i18n';

    	import moment from 'moment';

    	export let data;

    	const locationId = data.location_id;

    @@ -60,9 +61,9 @@
  
    				class="w-1/2 h-full bg-gradient-to-l from-black absolute top-0 rounded-2xl right-0"

    			></div>

    			<div class="absolute top-4 text-[0.65em] text-surface-100 drop-shadow-md right-3 space-y-1">

    				<p>Rainfall: {rainfall}%</p>

    				<p>Humidity: {humidity}%</p>

    				<p>Windspeed: {windSpeed} km/h</p>

    				<p>{$_('dashboardCard.rainfall')}: {rainfall}%</p>

    				<p>{$_('dashboardCard.humidity')}: {humidity}%</p>

    				<p>{$_('dashboardCard.windspeed')}: {windSpeed} km/h</p>

    			</div>

    			<div class="absolute left-3 top-5">

    				<p class="flex text-surface-100 text-3xl text-shadow">

    @@ -82,13 +83,13 @@
  
    		<h2 class="text-xl my-3">{locationName ?? '--'}</h2>

    		<div class="flex">

    			<p class="basis-1/3"></p>

    			<div class="basis-1/3 text-xs flex">

    			<div class="basis-1/3 text-xs flex flex-row justify-center">

    				<img src={thermometerImage} alt="" class="w-4" />

    				<p>Primary Data</p>

    				<p>{$_('dashboardCard.primaryData')}</p>

    			</div>

    			<div class="basis-1/3 text-xs flex">

    			<div class="basis-1/3 text-xs flex flex-row justify-center">

    				<img src={moistureImage} alt="" class="w-4" />

    				<p>Secondary Data</p>

    				<p>{$_('dashboardCard.secondaryData')}</p>

    			</div>

    		</div>

    		<div class="flex flex-col text-sm">

    @@ -105,7 +106,7 @@
  
    							<div class="flex text-center">

    								<div class="basis-1/3 flex items-center space-x-2">

    									<div class="w-2">

    										<img src={device.isPastDue ? inactiveImage : activeImage} alt="" />

    										<img src={moment().diff(moment(device.data.created_at), 'minutes') > 120 ? inactiveImage : activeImage} alt="" />

    									</div>

    									<p>{device.cw_devices.name}</p>

    								</div>

    @@ -128,7 +129,7 @@
  
    						<!-- Inside -->

    						<div class="pl-4">

    							<div class="flex px-3 mt-3">

    								<h3 class="text-lg basis-1/3 font-medium mb-2">Details</h3>

    								<h3 class="text-lg basis-1/3 font-medium mb-2">{$_('dashboardCard.details')}</h3>

    							</div>

    							{#if device.data}

    								{#await latestDeviceData(device)}

    @@ -138,7 +139,7 @@
  
    								{:then data}

    									{#each Object.keys(data) as dataPointKey}

    										<div class="px-3 pb-3 flex border-b">

    											<p class="basis-1/2 text-sm">{dataPointKey.replace(/_/g, ' ')}</p>

    											<p class="basis-1/2 text-sm">{$_(dataPointKey)}</p>

    											<p class="basis-1/2 text-sm">{data[dataPointKey]}</p>

    										</div>

    									{/each}

    @@ -148,7 +149,7 @@
  
    									variant="fill-light"

    									color="primary"

    									class="w-full"

    									icon={mdiEye}>View</Button

    									icon={mdiEye}>{$_('dashboardCard.view')}</Button

    								>

    							{:else}

    								<ProgressCircle />

src/lib/components/ui/sensors/CW_SS_TME.svelte

            
                      Original file line number
                      Diff line number
                      Diff line change
                  
    @@ -7,6 +7,7 @@
  
    	import moment from 'moment';

    	import { HighChartsTimeSeriesChart } from '$lib/charts/highcharts/timeseries';

    	import Highcharts from '$lib/actions/highcharts.action';

    	import { _ } from 'svelte-i18n';

    	export let data;

    	export let sensorName = 'NS';

    @@ -22,25 +23,25 @@
  
    			{

    				type: 'line',

    				yAxis: 0,

    				name: 'Temperature',

    				name: $_('temperature'),

    				color: 'red',

    				data: data.map((d: any) => [new Date(d.created_at).valueOf(), d.soil_temperatureC])

    			}

    		],

    		'Soil Temperature'

    		$_('soil_temperature')

    	);

    	$: moistureConfig = HighChartsTimeSeriesChart(

    		[

    			{

    				type: 'line',

    				yAxis: 0,

    				name: 'Moisture',

    				name: $_('soil_moisture'),

    				color: 'blue',

    				data: data.map((d: any) => [new Date(d.created_at).valueOf(), d.soil_moisture])

    			}

    		],

    		'Soil Moisture'

    		$_('soil_moisture')

    	);

    </script>

    @@ -53,19 +54,19 @@
  
    		/>

    		<div class="flex flex-col">

    			<p class="text-surface-100 text-4xl">{sensorName}</p>

    			<p class="text-slate-500">Last Seen: <Duration start={lastSeen} totalUnits={1} /> ago</p>

    			<p class="text-slate-500">{$_('lastSeen')}: <Duration start={lastSeen} totalUnits={1} /> {$_('ago')}</p>

    		</div>

    	</div>

    	<DarkCard title={'Temperature'} value={temperature} optimalValue={20} unit={'ºC'}>

    	<DarkCard title={$_('soil_temperature')} value={temperature} optimalValue={20} unit={'ºC'}>

    		<div class="chart" use:Highcharts={tempConfig} />

    		{data.length}

    	</DarkCard>

    	<DarkCard title={'Moisture'} value={moisture} optimalValue={40} unit={'%'}>

    	<DarkCard title={$_('soil_moisture')} value={moisture} optimalValue={40} unit={'%'}>

    		<div class="chart" use:Highcharts={moistureConfig} />

    	</DarkCard>

    	<DarkCard title={'EC'} value={soil_ec} unit={'dS/m'} optimalValue={1}></DarkCard>

    	<DarkCard title={$_('soil_EC')} value={soil_ec} unit={'dS/m'} optimalValue={1}></DarkCard>

    	<SensorFooterControls />

    </div>

src/lib/components/ui/sensors/CW_SS_TMEPNPK.svelte

            
                      Original file line number
                      Diff line number
                      Diff line change
                  
    @@ -8,10 +8,9 @@
  
    	import { HighChartsTimeSeriesChart } from '$lib/charts/highcharts/timeseries';

    	import Highcharts from '$lib/actions/highcharts.action';

    	import { scaleBand, scaleUtc } from 'd3-scale';

    	import { flatGroup } from 'd3-array';

    	import { curveLinearClosed, curveCatmullRomClosed, curveCatmullRom } from 'd3-shape';

    	import { Field, PeriodType, ToggleGroup, ToggleOption, cls } from 'svelte-ux';

    	import { curveLinearClosed } from 'd3-shape';

        import { Chart, Svg, Group, Axis, Spline, Points } from 'layerchart';

    	import { _ } from 'svelte-i18n';

    	export let data;

    	export let sensorName = 'NS';

    @@ -38,20 +37,20 @@
  
    				data: data.map((d: any) => [new Date(d.created_at).valueOf(), d.soil_temperatureC])

    			}

    		],

    		'Soil Temperature'

    		$_('soil_temperature')

    	);

    	$: moistureConfig = HighChartsTimeSeriesChart(

    		[

    			{

    				type: 'line',

    				yAxis: 0,

    				name: 'Moisture',

    				name: $_('soil_moisture'),

    				color: 'blue',

    				data: data.map((d: any) => [new Date(d.created_at).valueOf(), d.soil_moisture])

    			}

    		],

    		'Soil Moisture'

    		$_('soil_moisture')

    	);

    </script>

    @@ -64,21 +63,21 @@
  
    		/>

    		<div class="flex flex-col">

    			<p class="text-surface-100 text-4xl">{sensorName}</p>

    			<p class="text-slate-500">Last Seen: <Duration start={lastSeen} totalUnits={1} /> ago</p>

    			<p class="text-slate-500">{$_('lastSeen')}: <Duration start={lastSeen} totalUnits={1} /> {$_('ago')}</p>

    		</div>

    	</div>

    	<DarkCard title={'Temperature'} value={temperature} optimalValue={-20} unit={'ºC'}>

    	<DarkCard title={$_('soil_temperature')} value={temperature} optimalValue={-20} unit={'ºC'}>

    		<div class="chart" use:Highcharts={tempConfig} />

    		{data.length}

    	</DarkCard>

    	<DarkCard title={'Moisture'} value={moisture} optimalValue={20} unit={'%'}>

    	<DarkCard title={$_('soil_moisture')} value={moisture} optimalValue={20} unit={'%'}>

    		<div class="chart" use:Highcharts={moistureConfig} />

    	</DarkCard>

    	<DarkCard title={'EC'} value={soil_ec} unit={'µS/m'} optimalValue={1}></DarkCard>

    	<DarkCard title={$_('soil_EC')} value={soil_ec} unit={'µS/m'} optimalValue={1}></DarkCard>

    	<DarkCard title={'NPK'}>

    	<DarkCard title={`${$_('soil_N')} / ${$_('soil_P')} / ${$_('soil_K')}`}>

    		<div class="h-[300px] p-4 border rounded">

    			<Chart

    				data={npk_array}

src/lib/components/ui/sensors/Sensor1.svelte

            
                      Original file line number
                      Diff line number
                      Diff line change
                  
    @@ -7,6 +7,7 @@
  
    	import inActiveImage from '$lib/images/UI/cw_sensor_status_inactive.svg';

    	import { Duration } from 'svelte-ux';

    	import SensorFooterControls from '../SensorFooterControls.svelte';

    	import { _ } from 'svelte-i18n';

    	export let data;

    	export let sensorName = 'NS';

    @@ -23,14 +24,14 @@
  
    			{

    				type: 'line',

    				yAxis: 0,

    				name: 'Temperature',

    				name: $_('temperatureC'),

    				color: 'red',

    				data: data.map((d: any) => [new Date(d.created_at).valueOf(), d.temperatureC])

    			},

    			{

    				type: 'line',

    				yAxis: 1,

    				name: 'Humidity',

    				name: $_('humidity'),

    				color: 'blue',

    				data: data.map((d: any) => [new Date(d.created_at).valueOf(), d.humidity])

    			}

    @@ -42,7 +43,7 @@
  
    		{

    			type: 'line',

    			yAxis: 0,

    			name: 'Dew Point',

    			name: $_('dewPointC'),

    			color: 'red',

    			data: data.map((d: any) => [new Date(d.created_at).valueOf(), d.dewPointC])

    		}

    @@ -58,19 +59,19 @@
  
    		/>

    		<div class="flex flex-col">

    			<p class="text-surface-100 text-4xl">{sensorName}</p>

    			<p class="text-slate-500">Last Seen: <Duration start={lastSeen} totalUnits={1} /> ago</p>

    			<p class="text-slate-500">{$_('lastSeen')}: <Duration start={lastSeen} totalUnits={1} /> {$_('ago')}</p>

    		</div>

    	</div>

    	<TempHumidityCard {temperature} {humidity} />

    	<DarkCard title={'Temperature'} value={temperature} optimalValue={-20} unit={'ºC'} />

    	<DarkCard title={'Humidity'} value={humidity} optimalValue={0} unit={'%'} />

    	<DarkCard title={'Temperature/Humidity History'}>

    	<DarkCard title={$_('temperature')} value={temperature} optimalValue={-20} unit={'ºC'} />

    	<DarkCard title={$_('humidity')} value={humidity} optimalValue={0} unit={'%'} />

    	<DarkCard title={$_('temp_humidity')}>

    		<div class="chart" use:Highcharts={config} />

    	</DarkCard>

    	<DarkCard title={'Dew Point'} value={dewPoint} optimalValue={null} unit={'ºC'}>

    	<DarkCard title={$_('dewPointC')} value={dewPoint} optimalValue={null} unit={'ºC'}>

    		<div class="chart" use:Highcharts={dewPointConfig} />

    	</DarkCard>

    	<DarkCard title={'VPD'} value={vpd} optimalValue={null} unit={'kPa'} />

    	<DarkCard title={$_('vpd')} value={vpd} optimalValue={null} unit={'kPa'} />

    	<SensorFooterControls />

    </div>

src/lib/i18n/locales/en.json

-Original file line number
+Diff line change
@@ Expand Up / @@ -160,5 +160,13 @@ @@
         "no_rules_created": "You have not created any rules for this sensor yet.",
         "rule_criteria": "Rule Criteria",
         "no_rule_criteria": "No Rule Criteria yet..."
+      },
+      "dashboardCard": {
+        "Rainfall": "Rainfall",
+        "Humidity": "Humidity",
+        "Windspeed": "Windspeed",
+        "PrimaryData": "Primary Data",
+        "secondaryData": "Secondary Data",
+        "Details": "Details"
       }
     }

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Translations #37

Uh oh!

Diff view

Diff view

There are no files selected for viewing

Uh oh!